isaacclad
dc65bc44ac
Deploy Ladill POS / deploy (push) Successful in 42s
Use this.\$store in the host component so the bottomsheet opens, and share the hardened Paystack sheet sync path used across apps.
43 lines
1.8 KiB
PHP
43 lines
1.8 KiB
PHP
{{-- Global host for till-operator Card/MoMo sheets (register + open tickets). --}}
|
|
<div x-data="{
|
|
showSheet: false,
|
|
checkoutUrl: '',
|
|
accessCode: '',
|
|
returnUrl: '',
|
|
syncFromStore() {
|
|
const store = this.$store.paymentCheckout;
|
|
if (!store) return;
|
|
this.showSheet = !!store.isOpen;
|
|
this.checkoutUrl = store.url || '';
|
|
this.accessCode = store.accessCode || '';
|
|
},
|
|
init() {
|
|
// Keep local reactive mirrors so the teleported sheet always re-renders.
|
|
this.$watch(() => this.$store.paymentCheckout.isOpen, () => this.syncFromStore());
|
|
this.$watch(() => this.$store.paymentCheckout.url, () => this.syncFromStore());
|
|
this.$watch(() => this.$store.paymentCheckout.accessCode, () => this.syncFromStore());
|
|
this.$watch('showSheet', (open) => {
|
|
if (!open && this.$store.paymentCheckout?.isOpen) {
|
|
this.$store.paymentCheckout.close();
|
|
}
|
|
});
|
|
|
|
const url = @js(session('checkout_url'));
|
|
const code = @js(session('access_code'));
|
|
if (url || code) {
|
|
this.$store.paymentCheckout.open(url || '', code || '');
|
|
this.syncFromStore();
|
|
}
|
|
},
|
|
}"
|
|
@ladill-pay-cancelled.window="showSheet = false; $store.paymentCheckout.close()"
|
|
class="contents">
|
|
@include('partials.paystack-sheet', [
|
|
'audience' => 'operator',
|
|
'sheetTitle' => 'Customer payment',
|
|
'sheetSubtitle' => 'Hand this screen to the customer for card or mobile money.',
|
|
'sheetFooter' => 'Stay on this screen until the customer finishes. Closing only hides the sheet.',
|
|
'iframeTitle' => 'Customer card or mobile money checkout',
|
|
])
|
|
</div>
|