@@ -27,7 +27,7 @@ | |||
</div> | |||
<div v-if="!networks || networks.length === 0"> | |||
<span v-if="verifiedContacts">{{messages.message_empty_networks}}</span> | |||
<!-- <span v-if="verifiedContacts">{{messages.message_empty_networks}}</span>--> | |||
<router-view></router-view> | |||
</div> | |||
@@ -1,7 +1,7 @@ | |||
<!-- Copyright (c) 2020 Bubble, Inc. All rights reserved. For personal (non-commercial) use, see license: https://getbubblenow.com/bubble-license/ --> | |||
<template> | |||
<div> | |||
<h2 v-if="verifiedContacts || user.admin">{{messages.form_title_new_network}}</h2> | |||
<!-- <h2 v-if="verifiedContacts || user.admin">{{messages.form_title_new_network}}</h2>--> | |||
<div v-if="inboundAction" :class="`alert ${inboundAction.alertType}`"> | |||
{{messages['message_inbound_'+inboundAction.actionType]}} | |||
@@ -20,6 +20,59 @@ | |||
<hr/> | |||
<button class="btn btn-primary" :disabled="actionStatus.requesting" @click="resendVerification(firstContact)">{{messages.button_label_resend_verify_code}}</button> | |||
</div> | |||
<div v-else-if="typeof accountPayMethods !== 'undefined' && accountPayMethods !== null && accountPayMethods.length === 0"> | |||
<!-- plan --> | |||
<div class="form-group"> | |||
<label htmlFor="plan">{{messages.field_label_choose_plan}}:</label> | |||
<select v-validate="'required'" v-if="planObjects" v-model="accountPlan.plan" name="plan" class="form-control" :class="{ 'is-invalid': submitted && errors.has('plan') }"> | |||
<option v-for="plan in planObjects" :value="plan.name">{{messages['plan_name_'+plan.name]}} - {{messages.price_format.parseExpression({messages: messages, ...plan})}}</option> | |||
</select> | |||
<div v-if="submitted && errors.has('plan')" class="invalid-feedback d-block">{{ errors.first('plan') }}</div> | |||
</div> | |||
<div> | |||
{{messages['plan_description_'+accountPlan.plan]}} | |||
<div v-if="selectedPlan"> | |||
<div v-if="typeof selectedPlan.maxAccounts !== 'undefined' && selectedPlan.maxAccounts !== null">• {{messages.message_plan_max_accounts.parseExpression({max: selectedPlan.maxAccounts})}}</div> | |||
<div v-else>• {{messages.message_plan_no_max_accounts}}</div> | |||
</div> | |||
</div> | |||
<hr/> | |||
<div v-if="promos && promos.length && promos.length > 0"> | |||
<h4><b>{{messages.payment_first_details_with_promos}}</b></h4> | |||
<table border="0"> | |||
<tr v-for="promo in promos"> | |||
<td><b>{{messages['label_promotion_'+promo.name]}}</b>:</td> | |||
<td>{{messages['label_promotion_'+promo.name+'_description']}}</td> | |||
</tr> | |||
</table> | |||
<hr/> | |||
<p>{{messages.payment_first_details_with_promos_details}}</p> | |||
</div> | |||
<div v-else> | |||
<p v-html="messages.payment_first_details_no_promos"></p> | |||
</div> | |||
<hr/> | |||
<!-- add a new payment method --> | |||
<!-- <label htmlFor="paymentMethod">{{messages.field_label_newPaymentMethod}}</label>--> | |||
<div v-if="payMethods && payMethods.length > 1"> | |||
<span v-for="pm in payMethods"> | |||
<button v-if="!pm.driverClass.endsWith('NoopCloud')" class="btn btn-primary" :disabled="loading()" @click="setPaymentMethod(pm)">{{messages['payment_description_'+pm.paymentMethodType]}}</button> | |||
</span> | |||
</div> | |||
<div v-if="typeof payMethods !== 'undefined' && payMethods !== null || payMethods.length > 0" v-for="pm in payMethods"> | |||
<div v-if="selectedPaymentMethod !== null && selectedPaymentMethod.driverClass !== null && selectedPaymentMethod.driverClass === pm.driverClass"> | |||
<router-view name="pay_stripe" v-if="pm.driverClass.endsWith('StripePaymentDriver')"></router-view> | |||
<router-view name="pay_invite" v-else-if="pm.driverClass.endsWith('CodePaymentDriver')"></router-view> | |||
<router-view name="pay_free" v-else-if="pm.driverClass.endsWith('FreePaymentDriver')"></router-view> | |||
<!-- <router-view name="pay_unknown" v-else></router-view> --> | |||
</div> | |||
</div> | |||
<hr/> | |||
</div> | |||
<div v-else> | |||
<form @submit.prevent="handleSubmit"> | |||
@@ -75,7 +128,7 @@ | |||
<!-- plan --> | |||
<div v-if="customize.plan === true" class="form-group"> | |||
<label htmlFor="plan">{{messages.field_label_plan}}</label> | |||
<label htmlFor="plan">{{messages.field_label_plan}}:</label> | |||
<select v-validate="'required'" v-if="planObjects" v-model="accountPlan.plan" name="plan" class="form-control" :class="{ 'is-invalid': submitted && errors.has('plan') }"> | |||
<option v-for="plan in planObjects" :value="plan.name">{{messages['plan_name_'+plan.name]}} - {{messages.price_format.parseExpression({messages: messages, ...plan})}}</option> | |||
</select> | |||
@@ -253,26 +306,6 @@ | |||
</div> | |||
<hr/> | |||
</div> | |||
<!-- add a new payment method --> | |||
<label htmlFor="paymentMethod">{{messages.field_label_newPaymentMethod}}</label> | |||
<div v-if="typeof payMethods === 'undefined' || payMethods === null || payMethods.length === 0" class="invalid-feedback d-block"> | |||
<h5>{{messages.err_noPaymentMethods}}</h5> | |||
</div> | |||
<div v-else-if="payMethods.length > 1"> | |||
<span v-for="pm in payMethods"> | |||
<button v-if="!pm.driverClass.endsWith('NoopCloud')" class="btn btn-primary" :disabled="loading()" @click="setPaymentMethod(pm)">{{messages['payment_description_'+pm.paymentMethodType]}}</button> | |||
</span> | |||
</div> | |||
</div> | |||
<div v-for="pm in payMethods"> | |||
<div v-if="selectedPaymentMethod !== null && selectedPaymentMethod.driverClass !== null && selectedPaymentMethod.driverClass === pm.driverClass"> | |||
<router-view name="pay_stripe" v-if="pm.driverClass.endsWith('StripePaymentDriver')"></router-view> | |||
<router-view name="pay_invite" v-else-if="pm.driverClass.endsWith('CodePaymentDriver')"></router-view> | |||
<router-view name="pay_free" v-else-if="pm.driverClass.endsWith('FreePaymentDriver')"></router-view> | |||
<!-- <router-view name="pay_unknown" v-else></router-view> --> | |||
</div> | |||
</div> | |||
</div> | |||
@@ -281,7 +314,7 @@ | |||
<table border="0"> | |||
<tr> | |||
<td>{{messages.field_label_plan}}:</td> | |||
<td>{{selectedPlanName}}</td> | |||
<td>{{selectedPlanName}}<span v-if="messages && selectedPlan && selectedPlan.currency"> - {{messages.price_format.parseExpression({messages: messages, ...selectedPlan})}}</span></td> | |||
</tr> | |||
<tr> | |||
<td>{{messages.field_label_network_name}}:</td> | |||
@@ -588,9 +621,10 @@ | |||
return "(~"+parseInt(region.distance/1000)+" "+this.messages.msg_km_distance_away+")"; | |||
}, | |||
findPlan(name) { | |||
if (this.planObjects) { | |||
for (let i=0; i<this.planObjects.length; i++) { | |||
if (this.planObjects[i].name === name) return this.planObjects[i]; | |||
const plans = this.planObjects; | |||
if (plans) { | |||
for (let i=0; i<plans.length; i++) { | |||
if (plans[i].name === name) return plans[i]; | |||
} | |||
} | |||
return null; | |||
@@ -737,11 +771,28 @@ | |||
this.$router.push({path:'/bubble/'+nn.networkName}); | |||
this.submitted = false; | |||
} | |||
}, | |||
plans (p) { | |||
if (p) { | |||
if (this.user && this.user.preferredPlan) { | |||
const plans = this.planObjects; | |||
if (plans) { | |||
for (let i=0; i<plans.length; i++) { | |||
if (plans[i].uuid === this.user.preferredPlan) { | |||
this.defaults.plan = plans[i].name; | |||
this.accountPlan.plan = plans[i].name; | |||
} | |||
} | |||
} | |||
} | |||
} | |||
} | |||
}, | |||
created() { | |||
this.inboundAction = util.setInboundAction(this.$route); | |||
this.initDefaults(); | |||
const vue = this; | |||
window.setTimeout(() => { vue.inboundAction = null; }, 5000) | |||
} | |||
}; | |||
</script> |
@@ -28,7 +28,7 @@ | |||
} | |||
}, | |||
computed: { | |||
...mapState('paymentMethods', ['paymentMethod', 'paymentStatus', 'paymentInfo']), | |||
...mapState('paymentMethods', ['paymentMethod', 'paymentStatus', 'paymentInfo', 'accountPaymentMethods']), | |||
...mapState('system', ['messages']), | |||
}, | |||
created () { | |||
@@ -41,7 +41,7 @@ | |||
this.card.mount(this.$refs.card); | |||
}, | |||
methods: { | |||
...mapActions('paymentMethods', ['addAccountPaymentMethod']), | |||
...mapActions('paymentMethods', ['addAccountPaymentMethod', 'getAllAccountPaymentMethods']), | |||
authorizeCard(e) { | |||
util.setSkipRegistration(); | |||
const comp = this; | |||
@@ -66,6 +66,14 @@ | |||
}); | |||
return false; | |||
} | |||
}, | |||
watch: { | |||
paymentStatus (ps) { | |||
if (ps && ps.addedPaymentMethod) { | |||
// refresh account payment methods | |||
this.getAllAccountPaymentMethods({userId: this.user.uuid, messages: this.messages, errors: this.errors}) | |||
} | |||
} | |||
} | |||
}; | |||
</script> |
@@ -0,0 +1,40 @@ | |||
<!-- Copyright (c) 2020 Bubble, Inc. All rights reserved. For personal (non-commercial) use, see license: https://getbubblenow.com/bubble-license/ --> | |||
<template> | |||
<div> | |||
<h2>{{messages.title_check_certificate}}</h2> | |||
<hr/> | |||
<div v-if="cert_verified !== null"> | |||
<h4>{{messages['check_cert_'+cert_verified]}}</h4> ({{cert_verified}}) | |||
</div> | |||
<!-- <iframe style="visibility: hidden" id="cert_check_frame" v-if="configs && configs.certValidationHost" :src="'https://'+configs.certValidationHost" @load="frameLoaded()"></iframe>--> | |||
<iframe id="cert_check_frame" v-if="configs && configs.certValidationHost" :src="'https://'+configs.certValidationHost" @load="frameLoaded()"></iframe> | |||
</div> | |||
</template> | |||
<script> | |||
import { mapState, mapActions } from 'vuex' | |||
export default { | |||
data() { | |||
return { | |||
cert_verified: null | |||
} | |||
}, | |||
computed: { | |||
...mapState('system', ['messages', 'configs']) | |||
}, | |||
created() { | |||
this.loadSystemConfigs(); | |||
const vue = this; | |||
window.setTimeout(() => { | |||
if (vue.cert_verified === null) vue.cert_verified = false; | |||
}, 10000); | |||
}, | |||
methods: { | |||
...mapActions('system', ['loadSystemConfigs']), | |||
frameLoaded() { | |||
console.log('frame loaded!'); | |||
this.cert_verified = true; | |||
} | |||
} | |||
}; | |||
</script> |
@@ -26,31 +26,31 @@ | |||
<small><a :href="messages.message_request_promoCode_link">{{messages.message_request_promoCode}}</a></small> | |||
</div> | |||
<div v-if="plan" class="form-group"> | |||
<label htmlFor="paymentMethod">{{messages.field_label_paymentMethod}}</label> | |||
<div v-if="typeof payMethods === 'undefined' || payMethods === null || payMethods.length === 0" class="invalid-feedback d-block"> | |||
<h5>{{messages.err_noPaymentMethods}}</h5> | |||
</div> | |||
<div v-else-if="payMethods.length > 1"> | |||
<span v-for="pm in payMethods"> | |||
<button v-if="!pm.driverClass.endsWith('NoopCloud')" class="btn btn-primary" :disabled="loading()" @click="setPaymentMethod(pm)">{{messages['payment_description_'+pm.paymentMethodType]}}</button> | |||
</span> | |||
</div> | |||
<!-- <div v-if="plan" class="form-group">--> | |||
<!-- <label htmlFor="paymentMethod">{{messages.field_label_paymentMethod}}</label>--> | |||
<!-- <div v-if="typeof payMethods === 'undefined' || payMethods === null || payMethods.length === 0" class="invalid-feedback d-block">--> | |||
<!-- <h5>{{messages.err_noPaymentMethods}}</h5>--> | |||
<!-- </div>--> | |||
<!-- <div v-else-if="payMethods.length > 1">--> | |||
<!-- <span v-for="pm in payMethods">--> | |||
<!-- <button v-if="!pm.driverClass.endsWith('NoopCloud')" class="btn btn-primary" :disabled="loading()" @click="setPaymentMethod(pm)">{{messages['payment_description_'+pm.paymentMethodType]}}</button>--> | |||
<!-- </span>--> | |||
<!-- </div>--> | |||
<div v-for="pm in payMethods"> | |||
<div v-if="selectedPaymentMethod !== null && selectedPaymentMethod.driverClass !== null && selectedPaymentMethod.driverClass === pm.driverClass"> | |||
<router-view name="pay_stripe" v-if="pm.driverClass.endsWith('StripePaymentDriver')"></router-view> | |||
<router-view name="pay_invite" v-else-if="pm.driverClass.endsWith('CodePaymentDriver')"></router-view> | |||
<router-view name="pay_free" v-else-if="pm.driverClass.endsWith('FreePaymentDriver')"></router-view> | |||
<!-- <router-view name="pay_unknown" v-else></router-view> --> | |||
</div> | |||
</div> | |||
<div v-if="submitted && errors.has('paymentInfo')" class="invalid-feedback d-block">{{ errors.first('paymentInfo') }}</div> | |||
<div v-if="submitted && errors.has('paymentMethod')" class="invalid-feedback d-block">{{ errors.first('paymentMethod') }}</div> | |||
<div v-if="submitted && errors.has('paymentMethodInfo')" class="invalid-feedback d-block">{{ errors.first('paymentMethodInfo') }}</div> | |||
<div v-if="submitted && errors.has('paymentMethodType')" class="invalid-feedback d-block">{{ errors.first('paymentMethodType') }}</div> | |||
<div v-if="submitted && errors.has('paymentMethodService')" class="invalid-feedback d-block">{{ errors.first('paymentMethodService') }}</div> | |||
</div> | |||
<!-- <div v-for="pm in payMethods">--> | |||
<!-- <div v-if="selectedPaymentMethod !== null && selectedPaymentMethod.driverClass !== null && selectedPaymentMethod.driverClass === pm.driverClass">--> | |||
<!-- <router-view name="pay_stripe" v-if="pm.driverClass.endsWith('StripePaymentDriver')"></router-view>--> | |||
<!-- <router-view name="pay_invite" v-else-if="pm.driverClass.endsWith('CodePaymentDriver')"></router-view>--> | |||
<!-- <router-view name="pay_free" v-else-if="pm.driverClass.endsWith('FreePaymentDriver')"></router-view>--> | |||
<!-- <!– <router-view name="pay_unknown" v-else></router-view> –>--> | |||
<!-- </div>--> | |||
<!-- </div>--> | |||
<!-- <div v-if="submitted && errors.has('paymentInfo')" class="invalid-feedback d-block">{{ errors.first('paymentInfo') }}</div>--> | |||
<!-- <div v-if="submitted && errors.has('paymentMethod')" class="invalid-feedback d-block">{{ errors.first('paymentMethod') }}</div>--> | |||
<!-- <div v-if="submitted && errors.has('paymentMethodInfo')" class="invalid-feedback d-block">{{ errors.first('paymentMethodInfo') }}</div>--> | |||
<!-- <div v-if="submitted && errors.has('paymentMethodType')" class="invalid-feedback d-block">{{ errors.first('paymentMethodType') }}</div>--> | |||
<!-- <div v-if="submitted && errors.has('paymentMethodService')" class="invalid-feedback d-block">{{ errors.first('paymentMethodService') }}</div>--> | |||
<!-- </div>--> | |||
<div class="form-group"> | |||
<label for="user.agreeToTerms" v-html="messages.field_label_agreeToTerms"></label> | |||
@@ -133,15 +133,15 @@ export default { | |||
this.errors.add({field: 'confirmPassword', msg: this.messages['err_confirmPassword_mismatch']}) | |||
} else { | |||
if (this.plan !== null) { | |||
if (this.paymentMethodObject === null) { | |||
this.errors.add({field: 'paymentMethod', msg: this.messages['err_paymentMethod_required']}); | |||
return; | |||
} else { | |||
// if (this.paymentMethodObject === null) { | |||
// this.errors.add({field: 'paymentMethod', msg: this.messages['err_paymentMethod_required']}); | |||
// return; | |||
// } else { | |||
console.log('handleSubmit: setting this.user.preferredPlan = '+this.plan.uuid); | |||
this.user.preferredPlan = this.plan.uuid; | |||
this.user.paymentMethodObject = this.paymentMethodObject; | |||
this.user.paymentMethodObject.cloud = this.selectedPaymentMethod.name; | |||
} | |||
// this.user.paymentMethodObject = this.paymentMethodObject; | |||
// this.user.paymentMethodObject.cloud = this.selectedPaymentMethod.name; | |||
// } | |||
} | |||
this.register({ | |||
user: this.user, | |||