diff --git a/resources/js/components/GraphqlMutation.vue b/resources/js/components/GraphqlMutation.vue index 036b3ae9e..797e2c26e 100644 --- a/resources/js/components/GraphqlMutation.vue +++ b/resources/js/components/GraphqlMutation.vue @@ -77,6 +77,7 @@ export default { running: false, initialVariables: {}, data: {}, + prevData: {}, mutate: () => null, }), @@ -117,6 +118,23 @@ export default { deepMerge(this.data, diff) } }, + + data: { + handler() { + let diff = objectDiff(this.prevData, this.data) + + // Remove ignored variables + diff = Object.fromEntries(Object.entries(diff).filter(([key, _]) => !['uid'].includes(key))) + + // Only send event when changes are detected + if (Object.keys(diff).length > 0) { + this.changeFn(this) + } + + deepMerge(this.prevData, JSON.parse(JSON.stringify(diff))) + }, + deep: true, + }, }, mounted() { @@ -130,6 +148,10 @@ export default { }, methods: { + changeFn: useDebounceFn((self) => { + self.$emit('change', { target: self.$el, mutate: self.mutate, variables: self.variables }) + }, 500), + async mutateFn() { if (this.running) { return diff --git a/resources/js/stores/useCart.js b/resources/js/stores/useCart.js index c9631c417..5e0170cdc 100644 --- a/resources/js/stores/useCart.js +++ b/resources/js/stores/useCart.js @@ -158,7 +158,7 @@ function addCustomerAddressId(address) { return address } const customerAddress = user.value?.addresses?.find((customerAddress) => areAddressesSame(customerAddress, address)) - address.customer_address_id = address.customer_address_id || customerAddress?.id + address.customer_address_id = (address.customer_address_id || customerAddress?.id) ?? null return address } diff --git a/resources/views/checkout/partials/address.blade.php b/resources/views/checkout/partials/address.blade.php index b9a130397..ca29b8803 100644 --- a/resources/views/checkout/partials/address.blade.php +++ b/resources/views/checkout/partials/address.blade.php @@ -41,7 +41,7 @@ @lang('Company') @@ -53,7 +53,7 @@ @lang('Tax ID') @@ -89,7 +89,7 @@ @lang('Firstname') @@ -100,7 +100,7 @@ @lang('Middlename') @@ -110,7 +110,7 @@ @lang('Lastname') @@ -167,7 +167,7 @@ class="region exists" @lang('Telephone') @@ -178,7 +178,7 @@ class="region exists" @lang('Postcode') @@ -190,7 +190,7 @@ class="region exists" @lang('Housenumber') @@ -203,7 +203,7 @@ class="region exists" @lang('Addition') @@ -213,7 +213,7 @@ class="region exists" @lang('Street') @@ -223,7 +223,7 @@ class="region exists" @lang('City') @@ -234,7 +234,7 @@ class="region exists" @lang('Fax') diff --git a/resources/views/checkout/steps/billing-address.blade.php b/resources/views/checkout/steps/billing-address.blade.php index 02809a15b..2a54df764 100644 --- a/resources/views/checkout/steps/billing-address.blade.php +++ b/resources/views/checkout/steps/billing-address.blade.php @@ -14,22 +14,21 @@ :error-callback="checkResponseForExpiredCart" group="billing" mutate-event="setBillingAddressOnCart" + v-on:change="function (e) { + e.target.closest('fieldset').querySelector(':invalid') === null + && (!e.variables.same_as_shipping || !!cart?.shipping_addresses?.[0]?.postcode) + && window.app.$emit('setBillingAddressOnCart') + }" v-slot="{ mutate, variables }" > -
-
- - -
-
+
+ + +
diff --git a/resources/views/checkout/steps/shipping-address.blade.php b/resources/views/checkout/steps/shipping-address.blade.php index 5cd317af2..e6121ad0f 100644 --- a/resources/views/checkout/steps/shipping-address.blade.php +++ b/resources/views/checkout/steps/shipping-address.blade.php @@ -7,15 +7,20 @@ country_code: cart.shipping_addresses[0]?.country.code || window.address_defaults.country_code, region_id: cart.shipping_addresses[0]?.region.region_id || window.address_defaults.region_id, }))" - group="shipping" :before-request="(query, variables, options) => [variables.customer_address_id ? config.queries.setExistingShippingAddressesOnCart : query, variables, options]" :callback="updateCart" :error-callback="checkResponseForExpiredCart" + group="shipping" mutate-event="setShippingAddressesOnCart" + v-on:change="function (e) { + e.target.closest('fieldset').querySelector(':invalid') === null + && e.mutate().then(() => (cart?.billing_address?.same_as_shipping ?? true) + && window.app.$emit('setBillingAddressOnCart')) + }" v-slot="{ mutate, variables }" v-if="!cart.is_virtual" > -
+
@include('rapidez::checkout.partials.address', ['type' => 'shipping'])