Changeset View
Changeset View
Standalone View
Standalone View
src/resources/vue/Signup.vue
<template> | <template> | ||||
<div class="container"> | <div class="container"> | ||||
<div id="step0"> | <div id="step0"> | ||||
<div class="plan-selector d-flex justify-content-around align-items-stretch mb-3"> | <div class="plan-selector d-flex justify-content-around align-items-stretch"> | ||||
<div v-for="item in plans" :key="item.id" :class="'p-3 m-1 text-center bg-light flex-fill plan-box d-flex flex-column align-items-center plan-' + item.title"> | <div v-for="item in plans" :key="item.id" :class="'p-3 m-1 text-center bg-light flex-fill plan-box d-flex flex-column align-items-center plan-' + item.title"> | ||||
<div class="plan-ico"> | <div class="plan-ico"> | ||||
<svg-icon :icon="plan_icons[item.title]"></svg-icon> | <svg-icon :icon="plan_icons[item.title]"></svg-icon> | ||||
</div> | </div> | ||||
<button class="btn btn-primary" :data-title="item.title" @click="selectPlan(item.title)" v-html="item.button"></button> | <button class="btn btn-primary" :data-title="item.title" @click="selectPlan(item.title)" v-html="item.button"></button> | ||||
<div class="plan-description text-left mt-3" v-html="item.description"></div> | <div class="plan-description text-left mt-3" v-html="item.description"></div> | ||||
</div> | </div> | ||||
</div> | </div> | ||||
<div class="faq"> | <div class="faq mt-3"> | ||||
<h5>FAQ</h5> | <h5>FAQ</h5> | ||||
<ul class="pl-4"> | <ul class="pl-4"> | ||||
<li><a href="https://kolabnow.com/tos">What are your terms of service?</a></li> | <li><a href="https://kolabnow.com/tos">What are your terms of service?</a></li> | ||||
<li><a href="https://kb.kolabnow.com/faq/can-i-upgrade-an-individual-account-to-a-group-account">Can I upgrade an individual account to a group account?</a></li> | <li><a href="https://kb.kolabnow.com/faq/can-i-upgrade-an-individual-account-to-a-group-account">Can I upgrade an individual account to a group account?</a></li> | ||||
<li><a href="https://kb.kolabnow.com/faq/how-much-storage-comes-with-my-account">How much storage comes with my account?</a></li> | <li><a href="https://kb.kolabnow.com/faq/how-much-storage-comes-with-my-account">How much storage comes with my account?</a></li> | ||||
</ul> | </ul> | ||||
</div> | </div> | ||||
</div> | </div> | ||||
▲ Show 20 Lines • Show All 130 Lines • ▼ Show 20 Lines | export default { | ||||
this.$router.push({path: '/signup/' + plan}) | this.$router.push({path: '/signup/' + plan}) | ||||
this.plan = plan | this.plan = plan | ||||
this.displayForm(1, true) | this.displayForm(1, true) | ||||
}, | }, | ||||
// Composes plan selection page | // Composes plan selection page | ||||
step0() { | step0() { | ||||
if (!this.plans.length) { | if (!this.plans.length) { | ||||
this.$root.startLoading() | this.$root.startLoading() | ||||
axios.get('/api/auth/signup/plans', {}).then(response => { | axios.get('/api/auth/signup/plans').then(response => { | ||||
this.$root.stopLoading() | this.$root.stopLoading() | ||||
this.plans = response.data.plans | this.plans = response.data.plans | ||||
}) | }) | ||||
.catch(error => { | .catch(error => { | ||||
this.$root.errorHandler(error) | this.$root.errorHandler(error) | ||||
}) | }) | ||||
} | } | ||||
}, | }, | ||||
▲ Show 20 Lines • Show All 100 Lines • Show Last 20 Lines |