141 lines
3.5 KiB
JavaScript
Vendored
141 lines
3.5 KiB
JavaScript
Vendored
/*
|
|
* This mixin is primarily used to share code for the "interval" selector
|
|
* on the registration and subscription screens, which is used to show
|
|
* all of the various subscription plans offered by the application.
|
|
*/
|
|
module.exports = {
|
|
data() {
|
|
return {
|
|
selectedPlan: null,
|
|
detailingPlan: null,
|
|
|
|
showingMonthlyPlans: true,
|
|
showingYearlyPlans: false
|
|
};
|
|
},
|
|
|
|
|
|
methods: {
|
|
/**
|
|
* Switch to showing monthly plans.
|
|
*/
|
|
showMonthlyPlans() {
|
|
this.showingMonthlyPlans = true;
|
|
|
|
this.showingYearlyPlans = false;
|
|
},
|
|
|
|
|
|
/**
|
|
* Switch to showing yearly plans.
|
|
*/
|
|
showYearlyPlans() {
|
|
this.showingMonthlyPlans = false;
|
|
|
|
this.showingYearlyPlans = true;
|
|
},
|
|
|
|
|
|
/**
|
|
* Show the plan details for the given plan.
|
|
*/
|
|
showPlanDetails(plan) {
|
|
this.detailingPlan = plan;
|
|
|
|
$('#modal-plan-details').modal('show');
|
|
}
|
|
},
|
|
|
|
|
|
computed: {
|
|
/**
|
|
* Get the active "interval" being displayed.
|
|
*/
|
|
activeInterval() {
|
|
return this.showingMonthlyPlans ? 'monthly' : 'yearly';
|
|
},
|
|
|
|
|
|
/**
|
|
* Get all of the plans for the active interval.
|
|
*/
|
|
plansForActiveInterval() {
|
|
return _.filter(this.plans, plan => {
|
|
return plan.active && (plan.price == 0 || plan.interval == this.activeInterval);
|
|
});
|
|
},
|
|
|
|
|
|
/**
|
|
* Get all of the paid plans.
|
|
*/
|
|
paidPlans() {
|
|
return _.filter(this.plans, plan => {
|
|
return plan.active && plan.price > 0;
|
|
});
|
|
},
|
|
|
|
|
|
/**
|
|
* Get all of the paid plans for the active interval.
|
|
*/
|
|
paidPlansForActiveInterval() {
|
|
return _.filter(this.plansForActiveInterval, plan => {
|
|
return plan.active && plan.price > 0;
|
|
});
|
|
},
|
|
|
|
|
|
/**
|
|
* Determine if both monthly and yearly plans are available.
|
|
*/
|
|
hasMonthlyAndYearlyPlans() {
|
|
return this.monthlyPlans.length > 0 && this.yearlyPlans.length > 0;
|
|
},
|
|
|
|
/**
|
|
* Determine if both monthly and yearly plans are available.
|
|
*/
|
|
hasMonthlyAndYearlyPaidPlans() {
|
|
return _.where(this.paidPlans, {interval: 'monthly'}).length > 0 &&
|
|
_.where(this.paidPlans, {interval: 'yearly'}).length > 0;
|
|
},
|
|
|
|
|
|
/**
|
|
* Determine if only yearly plans are available.
|
|
*/
|
|
onlyHasYearlyPlans() {
|
|
return this.monthlyPlans.length == 0 && this.yearlyPlans.length > 0;
|
|
},
|
|
|
|
/**
|
|
* Determine if both monthly and yearly plans are available.
|
|
*/
|
|
onlyHasYearlyPaidPlans() {
|
|
return _.where(this.paidPlans, {interval: 'monthly'}).length == 0 &&
|
|
_.where(this.paidPlans, {interval: 'yearly'}).length > 0;
|
|
},
|
|
|
|
|
|
/**
|
|
* Get all of the monthly plans.
|
|
*/
|
|
monthlyPlans() {
|
|
return _.filter(this.plans, plan => {
|
|
return plan.active && plan.interval == 'monthly';
|
|
});
|
|
},
|
|
|
|
|
|
/**
|
|
* Get all of the yearly plans.
|
|
*/
|
|
yearlyPlans() {
|
|
return _.filter(this.plans, plan => {
|
|
return plan.active && plan.interval == 'yearly';
|
|
});
|
|
}
|
|
}
|
|
};
|