first push message
This commit is contained in:
@@ -0,0 +1,390 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<odoo>
|
||||
<!-- Flow 1: Trial Signup Page -->
|
||||
<template id="trial_signup_page" name="Free Trial - App Selection">
|
||||
<t t-call="website.layout">
|
||||
<div id="wrap" class="trial-signup-page oe_structure">
|
||||
<div class="container py-5">
|
||||
<!-- Header -->
|
||||
<div class="row mb-5">
|
||||
<div class="col-12 text-center">
|
||||
<h1 class="display-4 mb-3">Start Your Free 15-Day Trial</h1>
|
||||
<p class="lead">No credit card required • Select up to 10 apps • Get started in 60 seconds</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<form id="trial-registration-form" t-attf-action="/trial/register" method="post">
|
||||
<input type="hidden" name="csrf_token" t-att-value="request.csrf_token()"/>
|
||||
|
||||
<div class="row">
|
||||
<!-- Left Column: App Selection -->
|
||||
<div class="col-lg-8">
|
||||
<div class="card mb-4">
|
||||
<div class="card-header bg-primary text-white">
|
||||
<h3 class="mb-0"><i class="fa fa-th me-2"/>Step 1: Select Your Apps</h3>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<p class="text-muted mb-4">Choose the apps you want to try (Maximum 10 apps)</p>
|
||||
|
||||
<!-- Sales Category -->
|
||||
<div class="mb-4">
|
||||
<h4 class="h5 mb-3 text-primary">Sales & CRM</h4>
|
||||
<div class="row">
|
||||
<t t-foreach="apps" t-as="app" t-key="app['name']">
|
||||
<t t-if="app['category'] == 'sales'">
|
||||
<div class="col-md-6 col-lg-4 mb-3">
|
||||
<div class="app-selection-card card h-100"
|
||||
t-att-data-app="app['technical_name']">
|
||||
<div class="card-body text-center p-3">
|
||||
<i t-attf-class="fa #{app['icon']} fa-2x mb-2 text-primary"/>
|
||||
<h6 class="card-title mb-1" t-esc="app['name']"/>
|
||||
</div>
|
||||
<div class="card-footer bg-transparent text-center">
|
||||
<div class="form-check form-switch d-inline-block">
|
||||
<input class="form-check-input app-checkbox"
|
||||
type="checkbox"
|
||||
t-att-id="'app_' + app['technical_name']"
|
||||
t-att-name="'selected_apps'"
|
||||
t-att-value="app['name']"
|
||||
t-att-data-technical="app['technical_name']"/>
|
||||
<label class="form-check-label"
|
||||
t-att-for="'app_' + app['technical_name']">
|
||||
Select
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</t>
|
||||
</t>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Finance Category -->
|
||||
<div class="mb-4">
|
||||
<h4 class="h5 mb-3 text-success">Finance & Accounting</h4>
|
||||
<div class="row">
|
||||
<t t-foreach="apps" t-as="app" t-key="app['name']">
|
||||
<t t-if="app['category'] == 'finance'">
|
||||
<div class="col-md-6 col-lg-4 mb-3">
|
||||
<div class="app-selection-card card h-100"
|
||||
t-att-data-app="app['technical_name']">
|
||||
<div class="card-body text-center p-3">
|
||||
<i t-attf-class="fa #{app['icon']} fa-2x mb-2 text-success"/>
|
||||
<h6 class="card-title mb-1" t-esc="app['name']"/>
|
||||
</div>
|
||||
<div class="card-footer bg-transparent text-center">
|
||||
<div class="form-check form-switch d-inline-block">
|
||||
<input class="form-check-input app-checkbox"
|
||||
type="checkbox"
|
||||
t-att-id="'app_' + app['technical_name']"
|
||||
t-att-name="'selected_apps'"
|
||||
t-att-value="app['name']"
|
||||
t-att-data-technical="app['technical_name']"/>
|
||||
<label class="form-check-label"
|
||||
t-att-for="'app_' + app['technical_name']">
|
||||
Select
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</t>
|
||||
</t>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Services Category -->
|
||||
<div class="mb-4">
|
||||
<h4 class="h5 mb-3 text-info">Services & Projects</h4>
|
||||
<div class="row">
|
||||
<t t-foreach="apps" t-as="app" t-key="app['name']">
|
||||
<t t-if="app['category'] == 'services'">
|
||||
<div class="col-md-6 col-lg-4 mb-3">
|
||||
<div class="app-selection-card card h-100"
|
||||
t-att-data-app="app['technical_name']">
|
||||
<div class="card-body text-center p-3">
|
||||
<i t-attf-class="fa #{app['icon']} fa-2x mb-2 text-info"/>
|
||||
<h6 class="card-title mb-1" t-esc="app['name']"/>
|
||||
</div>
|
||||
<div class="card-footer bg-transparent text-center">
|
||||
<div class="form-check form-switch d-inline-block">
|
||||
<input class="form-check-input app-checkbox"
|
||||
type="checkbox"
|
||||
t-att-id="'app_' + app['technical_name']"
|
||||
t-att-name="'selected_apps'"
|
||||
t-att-value="app['name']"
|
||||
t-att-data-technical="app['technical_name']"/>
|
||||
<label class="form-check-label"
|
||||
t-att-for="'app_' + app['technical_name']">
|
||||
Select
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</t>
|
||||
</t>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Marketing Category -->
|
||||
<div class="mb-4">
|
||||
<h4 class="h5 mb-3 text-warning">Marketing & Website</h4>
|
||||
<div class="row">
|
||||
<t t-foreach="apps" t-as="app" t-key="app['name']">
|
||||
<t t-if="app['category'] == 'marketing'">
|
||||
<div class="col-md-6 col-lg-4 mb-3">
|
||||
<div class="app-selection-card card h-100"
|
||||
t-att-data-app="app['technical_name']">
|
||||
<div class="card-body text-center p-3">
|
||||
<i t-attf-class="fa #{app['icon']} fa-2x mb-2 text-warning"/>
|
||||
<h6 class="card-title mb-1" t-esc="app['name']"/>
|
||||
</div>
|
||||
<div class="card-footer bg-transparent text-center">
|
||||
<div class="form-check form-switch d-inline-block">
|
||||
<input class="form-check-input app-checkbox"
|
||||
type="checkbox"
|
||||
t-att-id="'app_' + app['technical_name']"
|
||||
t-att-name="'selected_apps'"
|
||||
t-att-value="app['name']"
|
||||
t-att-data-technical="app['technical_name']"/>
|
||||
<label class="form-check-label"
|
||||
t-att-for="'app_' + app['technical_name']">
|
||||
Select
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</t>
|
||||
</t>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Selected Apps Counter -->
|
||||
<div class="alert alert-info mt-3">
|
||||
<div class="d-flex justify-content-between align-items-center">
|
||||
<div>
|
||||
<i class="fa fa-info-circle me-2"/>
|
||||
<span id="selected-count">0</span> / 10 apps selected
|
||||
</div>
|
||||
<div id="selected-apps-tags" class="d-flex gap-2 flex-wrap">
|
||||
<!-- Tags will be added here dynamically -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Right Column: Registration Form -->
|
||||
<div class="col-lg-4">
|
||||
<div class="card mb-4 sticky-top" style="top: 20px;">
|
||||
<div class="card-header bg-success text-white">
|
||||
<h3 class="mb-0"><i class="fa fa-user me-2"/>Step 2: Your Information</h3>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="mb-3">
|
||||
<label for="email" class="form-label">Email Address <span class="text-danger">*</span></label>
|
||||
<input type="email" class="form-control" id="email" name="email" required="required"
|
||||
placeholder="your.email@company.com"/>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label for="name" class="form-label">Full Name <span class="text-danger">*</span></label>
|
||||
<input type="text" class="form-control" id="name" name="name" required="required"
|
||||
placeholder="John Doe"/>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label for="company_name" class="form-label">Company Name <span class="text-danger">*</span></label>
|
||||
<input type="text" class="form-control" id="company_name" name="company_name" required="required"
|
||||
placeholder="Your Company Ltd."/>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label for="phone" class="form-label">Phone Number</label>
|
||||
<input type="tel" class="form-control" id="phone" name="phone"
|
||||
placeholder="+855 12 345 678"/>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label for="country_id" class="form-label">Country</label>
|
||||
<select class="form-select" id="country_id" name="country_id">
|
||||
<option value="">Select Country</option>
|
||||
<t t-foreach="countries" t-as="country" t-key="country.id">
|
||||
<option t-att-value="country.id" t-esc="country.name"/>
|
||||
</t>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="alert alert-warning mt-3">
|
||||
<small>
|
||||
<i class="fa fa-shield-alt me-1"/>
|
||||
By registering, you agree to our Terms of Service and Privacy Policy
|
||||
</small>
|
||||
</div>
|
||||
|
||||
<button type="submit" class="btn btn-success btn-lg w-100 mt-3" id="submit-trial-btn">
|
||||
<i class="fa fa-rocket me-2"/>Start Free Trial
|
||||
</button>
|
||||
|
||||
<div class="text-center mt-3">
|
||||
<small class="text-muted">
|
||||
<i class="fa fa-clock me-1"/> Setup takes 30-60 seconds
|
||||
</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</t>
|
||||
</template>
|
||||
|
||||
<!-- Email Verification Page -->
|
||||
<template id="email_verification_page" name="Email Verification">
|
||||
<t t-call="website.layout">
|
||||
<div id="wrap" class="email-verification-page">
|
||||
<div class="container py-5">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-md-8 text-center">
|
||||
<div class="card">
|
||||
<div class="card-body py-5">
|
||||
<i class="fa fa-envelope-open-o fa-5x text-primary mb-4"/>
|
||||
<h2 class="mb-3">Verify Your Email</h2>
|
||||
<p class="lead mb-4">
|
||||
We've sent a verification link to your email address.<br/>
|
||||
Please check your inbox and click the link to continue.
|
||||
</p>
|
||||
<div class="alert alert-info">
|
||||
<p class="mb-2"><strong>Didn't receive the email?</strong></p>
|
||||
<button type="button" class="btn btn-link" id="resend-verification">
|
||||
Click here to resend
|
||||
</button>
|
||||
</div>
|
||||
<a href="/trial" class="btn btn-outline-secondary mt-3">
|
||||
<i class="fa fa-arrow-left me-2"/>Back to Trial Signup
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</t>
|
||||
</template>
|
||||
|
||||
<!-- Provisioning Success Page -->
|
||||
<template id="provisioning_success" name="Provisioning Success">
|
||||
<t t-call="website.layout">
|
||||
<div id="wrap" class="provisioning-success-page">
|
||||
<div class="container py-5">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-md-10">
|
||||
<div class="card border-success">
|
||||
<div class="card-body text-center py-5">
|
||||
<i class="fa fa-check-circle fa-5x text-success mb-4"/>
|
||||
<h1 class="display-4 mb-3">Your Trial is Ready!</h1>
|
||||
<p class="lead mb-4">
|
||||
Your database has been successfully created and configured.<br/>
|
||||
You can now start using your selected applications.
|
||||
</p>
|
||||
|
||||
<div class="row mt-5">
|
||||
<div class="col-md-6 mb-3">
|
||||
<div class="card bg-light">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">
|
||||
<i class="fa fa-link me-2"/>Your Instance URL
|
||||
</h5>
|
||||
<p class="card-text">
|
||||
<a t-attf-href="https://{{provisioning_result.database_url}}"
|
||||
class="btn btn-primary btn-lg" target="_blank">
|
||||
<t t-esc="provisioning_result.database_url"/>
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6 mb-3">
|
||||
<div class="card bg-light">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">
|
||||
<i class="fa fa-key me-2"/>Admin Credentials
|
||||
</h5>
|
||||
<p class="card-text">
|
||||
<strong>Login:</strong> <t t-esc="provisioning_result.admin_login"/><br/>
|
||||
<strong>Password:</strong> <t t-esc="provisioning_result.admin_password"/>
|
||||
</p>
|
||||
<small class="text-muted">
|
||||
<i class="fa fa-info-circle"/>
|
||||
These credentials have been sent to your email
|
||||
</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="alert alert-info mt-4">
|
||||
<h5 class="alert-heading">
|
||||
<i class="fa fa-gift me-2"/>15-Day Free Trial Activated
|
||||
</h5>
|
||||
<p>
|
||||
You have full access to all features for the next 15 days.<br/>
|
||||
No credit card required during the trial period.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="mt-4">
|
||||
<a t-attf-href="https://{{provisioning_result.database_url}}"
|
||||
class="btn btn-success btn-lg me-3" target="_blank">
|
||||
<i class="fa fa-external-link me-2"/>Launch Your Instance
|
||||
</a>
|
||||
<a href="/subscription/upgrade" class="btn btn-outline-primary btn-lg">
|
||||
<i class="fa fa-arrow-up me-2"/>Upgrade Now
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</t>
|
||||
</template>
|
||||
|
||||
<!-- Provisioning Failed Page -->
|
||||
<template id="provisioning_failed" name="Provisioning Failed">
|
||||
<t t-call="website.layout">
|
||||
<div id="wrap" class="provisioning-failed-page">
|
||||
<div class="container py-5">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-md-8 text-center">
|
||||
<div class="card border-danger">
|
||||
<div class="card-body py-5">
|
||||
<i class="fa fa-exclamation-triangle fa-5x text-danger mb-4"/>
|
||||
<h2 class="mb-3">Provisioning Failed</h2>
|
||||
<p class="lead mb-4">
|
||||
We encountered an issue while creating your database.<br/>
|
||||
Please try again or contact support.
|
||||
</p>
|
||||
<div class="alert alert-danger">
|
||||
<strong>Error:</strong>
|
||||
<t t-esc="provisioning_result.get('error', 'Unknown error')"/>
|
||||
</div>
|
||||
<a href="/trial" class="btn btn-primary btn-lg">
|
||||
<i class="fa fa-refresh me-2"/>Try Again
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</t>
|
||||
</template>
|
||||
</odoo>
|
||||
Reference in New Issue
Block a user