diff --git a/src/digital-components/modal/modal.vue b/src/digital-components/modal/modal.vue index 3d1be957a..96263ecf2 100644 --- a/src/digital-components/modal/modal.vue +++ b/src/digital-components/modal/modal.vue @@ -44,7 +44,6 @@ import buttonMain from "@/ux-components/button-main/button-main"; import { Modal } from "bootstrap"; import { useIsFormTouched, useIsFormDirty, useIsFormValid } from "vee-validate"; -import { checkPropertyChange } from "json-schema"; export default { name: "modal", diff --git a/src/layouts/service-location/mobile-location-modal-questions/mobile-location-modal-questions.vue b/src/layouts/service-location/mobile-location-modal-questions/mobile-location-modal-questions.vue index 8469985fe..5face28b1 100644 --- a/src/layouts/service-location/mobile-location-modal-questions/mobile-location-modal-questions.vue +++ b/src/layouts/service-location/mobile-location-modal-questions/mobile-location-modal-questions.vue @@ -54,11 +54,6 @@ import textBlock from "@/digital-components/text-block/text-block"; export default { name: "mobile-location-modal-questions", emits: ["update:modelValue"], // The component emits an event - data() { - return { - answers: [], - }; - }, props: { modelValue: { type: Object, @@ -70,11 +65,12 @@ export default { state: "", zipCode: "", }, - isZipServiceableMobile: Boolean, - isZipServiceableInShop: Boolean, isVehicleProtected: Boolean, + isZipServiceableMobile: Boolean, + isZipServiceableInShop: Boolean, }), }, + serviceZipCode: String, cmsWidgetName: String, modalWidgetName: String, mobileFeeDisclaimerWidgetName: String, @@ -100,7 +96,6 @@ export default { } return this.getCmsContent(this.cmsWidgetName, "BodyText"); }, - modalHeaderText() { return this.getCmsContent(this.modalWidgetName, "HeaderText"); }, @@ -120,6 +115,14 @@ export default { return this.mobileLocationQuestionModel.addressQuestions; }, }, + _isVehicleProtected: { + get: function () { + return this.modelValue.isVehicleProtected; + }, + set: function (newValue) { + this.$emit("update:modelValue.isVehicleProtected", newValue); + }, + } }, methods: { openModal() { @@ -128,10 +131,29 @@ export default { closeModal() { this.$refs.mobileLocationModal.closeModal(); }, + resetModel() { + // Address + this.addressModel.streetAddress = ""; + this.addressModel.apartmentNumberOrBusinessName = ""; + this.addressModel.city = ""; + this.addressModel.state = ""; + this.addressModel.zipCode = ""; + + // Is Vehicle Protected + this._isVehicleProtected = null; + }, async setMobileLocation() { this.closeModal(); }, }, + watch: { + serviceZipCode: { + handler() { + // if they modify the Service Zip Code, clear the model + this.resetModel(); + } + }, + }, components: { textLink, modal, diff --git a/src/layouts/service-location/mobile-location-modal-questions/vehicle-protected-question/vehicle-protected-question.vue b/src/layouts/service-location/mobile-location-modal-questions/vehicle-protected-question/vehicle-protected-question.vue index 6b00df0d1..f5754ea06 100644 --- a/src/layouts/service-location/mobile-location-modal-questions/vehicle-protected-question/vehicle-protected-question.vue +++ b/src/layouts/service-location/mobile-location-modal-questions/vehicle-protected-question/vehicle-protected-question.vue @@ -23,7 +23,9 @@ defineRule("option-required", required(errorMessages.OPTION_REQUIRED)); export default { name: "vehicle-protected-question", props: { - modelValue: String, + modelValue: { + isVehicleProtected: Boolean, + }, cmsWidgetName: String, }, components: { diff --git a/src/layouts/service-location/service-location.vue b/src/layouts/service-location/service-location.vue index 2ed5f676b..63e0d1c81 100644 --- a/src/layouts/service-location/service-location.vue +++ b/src/layouts/service-location/service-location.vue @@ -1,4 +1,3 @@ -fmg