generated from boboko/starter
47 lines
1.7 KiB
JavaScript
47 lines
1.7 KiB
JavaScript
import { Controller } from '@hotwired/stimulus'
|
|||
|
|
|
||
|
|
// Static, client-only interactivity for the checkout page's address form — no
|
||
|
|
// fetch, no cart mutation, just show/hide. Nothing here talks to the server;
|
||
|
|
// CheckoutController::saveAddress() is what actually persists anything.
|
||
|
|
export default class extends Controller {
|
||
|
|
static targets = [
|
||
|
|
'guestTab', 'loginTab', 'guestPanel', 'loginPanel',
|
||
|
|
'sameAsBilling', 'shippingFields',
|
||
|
|
]
|
||
|
|
|
||
|
|
connect() {
|
||
|
|
// Reflect whatever the server rendered (old input on a validation
|
||
|
|
// redisplay, or the default) before any click happens.
|
||
|
|
if (this.hasSameAsBillingTarget) this.syncShippingFields()
|
||
|
|
}
|
||
|
|
|
||
|
|
showGuest() {
|
||
|
|
this.guestPanelTarget.hidden = false
|
||
|
|
this.loginPanelTarget.hidden = true
|
||
|
|
this.guestTabTarget.setAttribute('aria-selected', 'true')
|
||
|
|
this.loginTabTarget.setAttribute('aria-selected', 'false')
|
||
|
|
}
|
||
|
|
|
||
|
|
showLogin() {
|
||
|
|
this.guestPanelTarget.hidden = true
|
||
|
|
this.loginPanelTarget.hidden = false
|
||
|
|
this.guestTabTarget.setAttribute('aria-selected', 'false')
|
||
|
|
this.loginTabTarget.setAttribute('aria-selected', 'true')
|
||
|
|
}
|
||
|
|
|
||
|
|
toggleSameAsBilling() {
|
||
|
|
this.syncShippingFields()
|
||
|
|
}
|
||
|
|
|
||
|
|
// Disabled fields are simply never submitted by the browser — the server
|
||
|
|
// never sees stale shipping values while "same as billing" is checked.
|
||
|
|
syncShippingFields() {
|
||
|
|
const sameAsBilling = this.sameAsBillingTarget.checked
|
||
|
|
|
||
|
|
this.shippingFieldsTarget.hidden = sameAsBilling
|
||
|
|
this.shippingFieldsTarget.querySelectorAll('input, select, textarea').forEach((field) => {
|
||
|
|
field.disabled = sameAsBilling
|
||
|
|
})
|
||
|
|
}
|
||
|
|
}
|