267 lines
16 KiB
XML
267 lines
16 KiB
XML
<?xml version="1.0" encoding="utf-8"?>
|
|
<odoo>
|
|
<!-- Flow 3: Subscription Plans Page -->
|
|
<template id="subscription_plans" name="Subscription Plans">
|
|
<t t-call="website.layout">
|
|
<div id="wrap" class="subscription-plans-page">
|
|
<div class="container py-5">
|
|
<!-- Header -->
|
|
<div class="row mb-5">
|
|
<div class="col-12 text-center">
|
|
<h1 class="display-4 mb-3">Choose Your Plan</h1>
|
|
<p class="lead">Upgrade to continue using your instance after the trial ends</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Current Plan Info -->
|
|
<div t-if="subscription" class="row mb-5">
|
|
<div class="col-12">
|
|
<div class="alert alert-info">
|
|
<div class="d-flex justify-content-between align-items-center">
|
|
<div>
|
|
<strong>Current Plan:</strong>
|
|
<span t-if="subscription.is_trial" class="badge bg-warning">
|
|
Free Trial
|
|
</span>
|
|
<span t-else="" class="badge bg-success">
|
|
Premium
|
|
</span>
|
|
<t t-if="subscription.days_remaining">
|
|
- <span t-esc="subscription.days_remaining"/> days remaining
|
|
</t>
|
|
</div>
|
|
<div>
|
|
<strong>Instance:</strong>
|
|
<span t-if="subscription.active_database_id"
|
|
t-esc="subscription.active_database_id.subdomain"/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Plans Grid -->
|
|
<div class="row justify-content-center">
|
|
<t t-foreach="plans" t-as="plan" t-key="plan.id">
|
|
<div class="col-md-4 mb-4">
|
|
<div class="card h-100 plan-card" t-attf-class="#{'border-primary plan-featured' if plan.plan_code == '1_year' else ''}">
|
|
<!-- Featured Badge -->
|
|
<t t-if="plan.plan_code == '1_year'">
|
|
<div class="position-absolute top-0 start-50 translate-middle">
|
|
<span class="badge bg-primary px-3 py-2">Best Value</span>
|
|
</div>
|
|
</t>
|
|
|
|
<div class="card-header text-center py-4">
|
|
<h3 class="mb-0" t-esc="plan.name"/>
|
|
<div class="mt-3">
|
|
<span class="display-4 fw-bold text-primary">
|
|
<t t-esc="currency.symbol"/>
|
|
<t t-esc="plan.price"/>
|
|
</span>
|
|
<span class="text-muted">
|
|
/<t t-if="plan.plan_code == '3_months'">3 months</t>
|
|
<t t-elif="plan.plan_code == '6_months'">6 months</t>
|
|
<t t-else="">year</t>
|
|
</span>
|
|
</div>
|
|
<div class="mt-2 text-muted">
|
|
<small>Save <t t-esc="int((1 - plan.price / (plan.duration_months * 10)) * 100)"/>% vs monthly</small>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="card-body">
|
|
<ul class="list-unstyled">
|
|
<li class="mb-3">
|
|
<i class="fa fa-check text-success me-2"/>
|
|
<strong t-esc="plan.max_apps"/> Apps Included
|
|
</li>
|
|
<li class="mb-3">
|
|
<i class="fa fa-check text-success me-2"/>
|
|
<strong t-esc="plan.max_users"/> User(s)
|
|
</li>
|
|
<li class="mb-3">
|
|
<i class="fa fa-check text-success me-2"/>
|
|
<t t-esc="plan.max_storage_mb"/> MB Storage
|
|
</li>
|
|
<li class="mb-3">
|
|
<i class="fa fa-check text-success me-2"/>
|
|
Email Support
|
|
</li>
|
|
<li class="mb-3">
|
|
<i class="fa fa-check text-success me-2"/>
|
|
Automatic Backups
|
|
</li>
|
|
<t t-if="plan.plan_code == '1_year'">
|
|
<li class="mb-3">
|
|
<i class="fa fa-star text-warning me-2"/>
|
|
Priority Support
|
|
</li>
|
|
</t>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="card-footer text-center py-4 bg-transparent">
|
|
<form t-attf-action="/subscription/checkout" method="post">
|
|
<input type="hidden" name="csrf_token" t-att-value="request.csrf_token()"/>
|
|
<input type="hidden" name="plan_id" t-att-value="plan.id"/>
|
|
|
|
<!-- Payment Method Selection -->
|
|
<div class="mb-3">
|
|
<label class="form-label">Payment Method:</label>
|
|
<div class="btn-group w-100" role="group">
|
|
<input type="radio" class="btn-check" name="payment_method"
|
|
id="aba_{{plan.id}}" value="aba" checked="checked"/>
|
|
<label class="btn btn-outline-primary" t-att-for="aba_{{plan.id}}">
|
|
<i class="fa fa-university me-1"/>ABA
|
|
</label>
|
|
|
|
<input type="radio" class="btn-check" name="payment_method"
|
|
id="stripe_{{plan.id}}" value="stripe"/>
|
|
<label class="btn btn-outline-primary" t-att-for="stripe_{{plan.id}}">
|
|
<i class="fa fa-cc-stripe me-1"/>Stripe
|
|
</label>
|
|
|
|
<input type="radio" class="btn-check" name="payment_method"
|
|
id="paypal_{{plan.id}}" value="paypal"/>
|
|
<label class="btn btn-outline-primary" t-att-for="paypal_{{plan.id}}">
|
|
<i class="fa fa-paypal me-1"/>PayPal
|
|
</label>
|
|
</div>
|
|
</div>
|
|
|
|
<button type="submit" class="btn btn-primary btn-lg w-100">
|
|
<i class="fa fa-credit-card me-2"/>
|
|
Subscribe Now
|
|
</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</t>
|
|
</div>
|
|
|
|
<!-- Money Back Guarantee -->
|
|
<div class="row mt-5">
|
|
<div class="col-12 text-center">
|
|
<div class="alert alert-success d-inline-block">
|
|
<i class="fa fa-shield me-2"/>
|
|
<strong>30-Day Money Back Guarantee</strong> - Not satisfied? Get a full refund within 30 days.
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</t>
|
|
</template>
|
|
|
|
<!-- Subscription Success Page -->
|
|
<template id="subscription_success" name="Subscription Success">
|
|
<t t-call="website.layout">
|
|
<div id="wrap" class="subscription-success-page">
|
|
<div class="container py-5">
|
|
<div class="row justify-content-center">
|
|
<div class="col-md-8 text-center">
|
|
<div class="card border-success">
|
|
<div class="card-body py-5">
|
|
<i class="fa fa-check-circle fa-5x text-success mb-4"/>
|
|
<h1 class="display-4 mb-3">Payment Successful!</h1>
|
|
<p class="lead mb-4">
|
|
Thank you for subscribing. Your account has been upgraded to Premium.<br/>
|
|
You now have access to all premium features.
|
|
</p>
|
|
|
|
<div class="row mt-4">
|
|
<div class="col-md-6 mb-3">
|
|
<div class="card bg-light">
|
|
<div class="card-body">
|
|
<h5>
|
|
<i class="fa fa-calendar me-2"/>Subscription Details
|
|
</h5>
|
|
<p class="mb-1">
|
|
<strong>Plan:</strong>
|
|
<span t-if="subscription.subscription_plan_id"
|
|
t-esc="subscription.subscription_plan_id.name"/>
|
|
</p>
|
|
<p class="mb-1">
|
|
<strong>Valid Until:</strong>
|
|
<span t-if="subscription.subscription_end_date"
|
|
t-esc="subscription.subscription_end_date.strftime('%Y-%m-%d')"/>
|
|
</p>
|
|
<p class="mb-0">
|
|
<strong>Payment Reference:</strong>
|
|
<span t-if="subscription.payment_reference"
|
|
t-esc="subscription.payment_reference"/>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6 mb-3">
|
|
<div class="card bg-light">
|
|
<div class="card-body">
|
|
<h5>
|
|
<i class="fa fa-gift me-2"/>What's Included
|
|
</h5>
|
|
<ul class="list-unstyled mb-0">
|
|
<li><i class="fa fa-check text-success me-2"/>Full Feature Access</li>
|
|
<li><i class="fa fa-check text-success me-2"/>Priority Support</li>
|
|
<li><i class="fa fa-check text-success me-2"/>Automatic Backups</li>
|
|
<li><i class="fa fa-check text-success me-2"/>99.9% Uptime SLA</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mt-5">
|
|
<a t-if="subscription.active_database_id"
|
|
t-attf-href="https://{{subscription.active_database_id.full_domain}}"
|
|
class="btn btn-success btn-lg me-3" target="_blank">
|
|
<i class="fa fa-external-link me-2"/>Go to Your Instance
|
|
</a>
|
|
<a href="/web" class="btn btn-outline-primary btn-lg">
|
|
<i class="fa fa-dashboard me-2"/>Dashboard
|
|
</a>
|
|
</div>
|
|
|
|
<div class="mt-4">
|
|
<small class="text-muted">
|
|
A receipt has been sent to <strong t-if="subscription" t-esc="subscription.user_email"/>
|
|
</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</t>
|
|
</template>
|
|
|
|
<!-- Trial Expired Page -->
|
|
<template id="trial_expired" name="Trial Expired">
|
|
<t t-call="website.layout">
|
|
<div id="wrap" class="trial-expired-page">
|
|
<div class="container py-5">
|
|
<div class="row justify-content-center">
|
|
<div class="col-md-8 text-center">
|
|
<div class="card border-warning">
|
|
<div class="card-body py-5">
|
|
<i class="fa fa-exclamation-circle fa-5x text-warning mb-4"/>
|
|
<h2 class="mb-3">Trial Period Expired</h2>
|
|
<p class="lead mb-4">
|
|
Your 15-day free trial has ended.<br/>
|
|
Upgrade now to continue using your instance and keep all your data.
|
|
</p>
|
|
<a href="/subscription/upgrade" class="btn btn-primary btn-lg">
|
|
<i class="fa fa-arrow-up me-2"/>Upgrade to Premium
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</t>
|
|
</template>
|
|
</odoo> |