%PDF-
%PDF-
Mini Shell
Mini Shell
exports.ids = [23];
exports.modules = {
/***/ 196:
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
// ESM COMPAT FLAG
__webpack_require__.r(__webpack_exports__);
// CONCATENATED MODULE: ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/@nuxt/components/dist/loader.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./components/blocks/Booking/PaymentStep.vue?vue&type=template&id=ccb0a27a&
var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',[_vm._ssrNode("<span class=\"block text-center text-3xl font-bold mb-6\">Payment</span> <div class=\"grid grid-cols-1 sm:grid-cols-2 gap-y-3 mb-6\"><div class=\"leading-6 text-center sm:text-left\">"+_vm._ssrEscape(_vm._s(Object.keys(_vm.selected_slots).length)+" x Sessions with "+_vm._s(_vm.therapist.user.full_name))+"</div> <div class=\"flex items-center justify-center sm:justify-end text-2xl font-bold\">"+_vm._ssrEscape(_vm._s(_vm.totals.formatted))+"</div></div> <div id=\"payment-request-wrapper\""+(_vm._ssrStyle(null,null, { display: (_vm.isPaymentRequestAllowed) ? '' : 'none' }))+"><div class=\"w-full flex items-center justify-center mb-8\"><div id=\"payment-request-button\" class=\"w-full\"></div></div> <div class=\"relative text-center my-6\"><span class=\"absolute z-10 top-1/2 left-0 transform -translate-y-1/2 block w-full h-0.5 bg-gray\"></span> <span class=\"relative z-20 inline-block px-6 bg-white uppercase\">Or Pay with Card</span></div></div> "+((_vm.isPaymentRequestAllowed == false)?("<div class=\"relative text-center my-6\"><span class=\"absolute z-10 top-1/2 left-0 transform -translate-y-1/2 block w-full h-0.5 bg-gray\"></span> <span class=\"relative z-20 inline-block px-6 bg-white uppercase\">Pay with Card</span></div>"):"<!---->")+" "+((_vm.payment_methods.length > 0)?("<div class=\"grid grid-cols-1 gap-y-2 mb-6\">"+(_vm._ssrList((_vm.payment_methods),function(payment_method,key){return ("<label"+(_vm._ssrAttr("for",'payment_method-'+key))+(_vm._ssrClass("relative grid grid-cols-2 bg-white border border-black border-opacity-10 py-2 px-3 pl-12 rounded-lg transition cursor-pointer",_vm.selected_payment_method == payment_method.id ? 'bg-gray' : ''))+"><input type=\"radio\" name=\"payment_methods\""+(_vm._ssrAttr("id",'payment_method-'+key))+(_vm._ssrAttr("value",payment_method.id))+(_vm._ssrAttr("checked",_vm._q(_vm.selected_payment_method,payment_method.id)))+" class=\"hidden\"> <div"+(_vm._ssrClass("absolute top-0 left-0.5 w-10 h-full bg-center bg-contain",'card-icon-'+payment_method.card.brand))+"></div> <span class=\"text-sm\">"+_vm._ssrEscape(_vm._s(payment_method.billing_details.name))+"</span> <div class=\"text-sm flex items-center justify-end\"><span class=\"mx-2\">"+_vm._ssrEscape("****"+_vm._s(payment_method.card.last4))+"</span> <span class=\"mx-2\">"+_vm._ssrEscape(_vm._s(payment_method.card.exp_month)+"/"+_vm._s(payment_method.card.exp_year))+"</span></div></label>")}))+"</div>"):"<!---->")+" "),_vm._ssrNode("<div"+(_vm._ssrStyle(null,null, { display: (_vm.selected_payment_method == null) ? '' : 'none' }))+">","</div>",[_c('ValidationObserver',{ref:"paymentForm"},[_c('form',{attrs:{"role":"form","method":"POST"},on:{"submit":function($event){$event.preventDefault();return _vm.submitForm($event)}}},[_c('ValidationProvider',{attrs:{"rules":"required"},scopedSlots:_vm._u([{key:"default",fn:function(ref){
var errors = ref.errors;
return [_c('t-input-group',{attrs:{"label":"Name on Card"}},[_c('t-input',{attrs:{"type":"text","placeholder":"Name on Card"},model:{value:(_vm.card_name),callback:function ($$v) {_vm.card_name=$$v},expression:"card_name"}}),_vm._v(" "),(errors[0])?_c('span',{staticClass:"field-invalid"},[_vm._v(_vm._s(errors[0]))]):_vm._e()],1)]}}])}),_vm._v(" "),_c('t-input-group',{attrs:{"label":"Card Information"}},[_c('div',{staticClass:"px-4 py-4 bg-white border border-black border-opacity-20 rounded-xl",attrs:{"id":"card-element"}})]),_vm._v(" "),_c('div',{staticClass:"flex flex-col items-center justify-center sm:px-10"},[_c('button',{staticClass:"btn btn-primary btn-small rounded-full w-full sm:w-auto",attrs:{"disabled":_vm.working == true,"type":"submit"}},[(_vm.working == false)?_c('span',[_vm._v("Pay Now")]):_c('span',{staticClass:"flex items-center justify-center"},[_c('svg',{staticClass:"animate-spin -ml-1 mr-3 h-5 w-5 text-current",attrs:{"xmlns":"http://www.w3.org/2000/svg","fill":"none","viewBox":"0 0 24 24"}},[_c('circle',{staticClass:"opacity-25",attrs:{"cx":"12","cy":"12","r":"10","stroke":"currentColor","stroke-width":"4"}}),_vm._v(" "),_c('path',{staticClass:"opacity-75",attrs:{"fill":"currentColor","d":"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"}})]),_vm._v(" "),_c('span',[_vm._v("Processing")])])]),_vm._v(" "),_c('button',{staticClass:"mt-6 uppercase text-blue-light text-sm",attrs:{"type":"button"},on:{"click":_vm.goBack}},[_vm._v("Go Back")])])],1)])],1),_vm._ssrNode(" "+((_vm.selected_payment_method)?("<div class=\"flex flex-col items-center justify-center sm:px-10\"><button class=\"mb-2 uppercase text-blue-light text-sm\">Use New Card</button> <button"+(_vm._ssrAttr("disabled",_vm.working == true))+" type=\"button\" class=\"btn btn-primary btn-small rounded-full w-full sm:w-auto\">"+((_vm.working == false)?("<span>Pay Now</span>"):("<span class=\"flex items-center justify-center\"><svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" viewBox=\"0 0 24 24\" class=\"animate-spin -ml-1 mr-3 h-5 w-5 text-current\"><circle cx=\"12\" cy=\"12\" r=\"10\" stroke=\"currentColor\" stroke-width=\"4\" class=\"opacity-25\"></circle> <path fill=\"currentColor\" d=\"M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z\" class=\"opacity-75\"></path></svg> <span>Processing</span></span>"))+"</button> <button type=\"button\" class=\"mt-6 uppercase text-blue-light text-sm\">Go Back</button></div>"):"<!---->")+" "),_vm._ssrNode("<p class=\"text-sm text-center mt-6 text-black text-opacity-75\">","</p>",[_vm._ssrNode("By subscribing to Take a Seat you are agreeing to all site "),_c('NuxtLink',{staticClass:"text-blue-light hover:underline",attrs:{"to":"/terms-conditions","target":"_blank"}},[_vm._v("Terms and Conditions")]),_vm._ssrNode(". Please read carefully before continuing.")],2)],2)}
var staticRenderFns = []
// CONCATENATED MODULE: ./components/blocks/Booking/PaymentStep.vue?vue&type=template&id=ccb0a27a&
// CONCATENATED MODULE: ./node_modules/babel-loader/lib??ref--2-0!./node_modules/@nuxt/components/dist/loader.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./components/blocks/Booking/PaymentStep.vue?vue&type=script&lang=js&
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
/* harmony default export */ var PaymentStepvue_type_script_lang_js_ = ({
props: {
value: {
required: true
},
selected_slots: {
type: Object,
required: true
}
},
data() {
return {
error: null,
working: false,
stripe: null,
card: {},
selected_payment_method: null,
isPaymentRequestAllowed: false,
paymentRequest: {},
card_name: null
};
},
computed: {
totals() {
return this.$store.state.booking.summary.totals;
},
therapist() {
return this.$store.state.booking.therapist;
},
payment_methods() {
return this.$store.state.account.billing.paymentMethods;
},
setup_intent() {
return this.$store.state.account.billing.setupIntent;
},
connect_id() {
return this.$store.state.booking.payment.connect_id;
}
},
async mounted() {
await this.$store.dispatch('account/billing/setupIntent');
await this.$store.dispatch('account/billing/getPaymentMethods');
this.mountCard();
},
methods: {
mountCard() {
const elements = this.$stripe.elements();
this.card = elements.create('card', {
style: {
base: {
fontSize: '15px',
fontFamily: 'Poppins, sans-serif'
}
}
});
this.getPaymentRequest();
this.card.mount('#card-element');
},
submitForm() {
this.$refs.paymentForm.validate().then(success => {
if (!success) {
return;
}
this.confirmCardSetup();
});
},
async getPaymentRequest() {
this.paymentRequest = await this.$stripe.paymentRequest({
country: 'GB',
currency: 'gbp',
total: {
amount: parseInt(this.totals.amount),
label: 'Takeaseat Booking with ' + this.therapist.user.full_name
},
requestPayerName: true,
requestPayerEmail: true
});
this.mountPaymentButton();
},
async mountPaymentButton() {
const elements = this.$stripe.elements();
let prButton = elements.create('paymentRequestButton', {
paymentRequest: this.paymentRequest
}); // Check the availability of the Payment Request API first.
this.paymentRequest.canMakePayment().then(function (result) {
if (result) {
this.isPaymentRequestAllowed = true;
prButton.mount('#payment-request-button');
} else {
this.isPaymentRequestAllowed = false;
}
}.bind(this));
this.paymentRequest.on('paymentmethod', function (event) {
event.complete('success');
this.createPayment(event.paymentMethod.id);
}.bind(this));
},
async confirmCardSetup() {
this.working = true;
const {
setupIntent,
error
} = await this.$stripe.confirmCardSetup(this.setup_intent, {
payment_method: {
card: this.card,
billing_details: {
name: this.card_name
}
}
});
if (error) {
this.$toast.error(error.message).goAway(3000);
await this.$store.dispatch('account/billing/setupIntent');
this.working = false;
} else {
this.createPayment(setupIntent.payment_method);
}
},
async createPayment(payment_method) {
this.working = true;
await this.$axios.post('/booking/payment/' + this.therapist.user.id, {
grand_total: this.totals.amount,
sessions: this.selected_slots,
sessions_count: Object.keys(this.selected_slots).length,
payment_method: payment_method
}).then(response => {
if (response.status == 200) {
this.createBooking(response.data);
}
}).catch(error => {
this.working = false;
this.$toast.error(error.response.data.message).goAway(3000);
});
},
async createBooking(data) {
this.working = true;
await this.$axios.post('/booking/create', {
sessions: this.selected_slots,
amount: this.totals.amount,
therapist_id: this.therapist.id,
charges: data.charges,
transfer: data.transfer
}).then(response => {
if (response.status == 200) {
this.$store.commit('booking/success/setBookings', response.data);
this.$router.push({
path: '/booking/success'
});
}
}).catch(error => {
this.$toast.error(error.response.message).goAway(1000);
this.working = false;
});
},
goBack() {
this.$emit("input", 2);
}
}
});
// CONCATENATED MODULE: ./components/blocks/Booking/PaymentStep.vue?vue&type=script&lang=js&
/* harmony default export */ var Booking_PaymentStepvue_type_script_lang_js_ = (PaymentStepvue_type_script_lang_js_);
// EXTERNAL MODULE: ./node_modules/vue-loader/lib/runtime/componentNormalizer.js
var componentNormalizer = __webpack_require__(1);
// CONCATENATED MODULE: ./components/blocks/Booking/PaymentStep.vue
/* normalize component */
var component = Object(componentNormalizer["a" /* default */])(
Booking_PaymentStepvue_type_script_lang_js_,
render,
staticRenderFns,
false,
null,
null,
"dbe2298a"
)
/* harmony default export */ var PaymentStep = __webpack_exports__["default"] = (component.exports);
/***/ })
};;
//# sourceMappingURL=payment-step.js.map
Zerion Mini Shell 1.0