diff --git a/src/common-components/base-input-button/base-input-button.vue b/src/common-components/base-input-button/base-input-button.vue index ad9da9f2a..deb1558d0 100644 --- a/src/common-components/base-input-button/base-input-button.vue +++ b/src/common-components/base-input-button/base-input-button.vue @@ -26,6 +26,7 @@ import { useField } from "vee-validate"; import { toRef } from "vue"; import { queryStrings } from "@/constants/query-strings"; +import inputButtonWrapperMixin from "../../mixins/input-button-wrapper-mixin"; export default { name: "base-input-button", @@ -35,6 +36,7 @@ export default { event: "change", }, props: { + // ...inputButtonWrapperMixin.props value: { type: [String, Number], required: true, @@ -62,6 +64,7 @@ export default { isRequired: Boolean, lastValuePushedToGa: [String, Number], setLastValuePushedToGa: Function, + shouldPushClickEventToGAOnMount: Boolean, }, data() { return { @@ -69,12 +72,23 @@ export default { }; }, mounted() { + console.log("mounted: ", { + isChecked: this.isChecked + }) if (this.isChecked) { - this.handleChange(this.modelValue); + // if (this.shouldPushClickEventToGAOnMount) { + // this.handleEventAction(this.eventTypes.MOUNT) + // } else { + this.handleChange(this.modelValue); + // } } }, methods: { handleEventAction(eventType, e) { + console.log("handleEventAction: ", { + eventType, + value: this.value, + }); if (this.isMultiSelect) { switch (eventType) { case this.eventTypes.ENTER: @@ -90,6 +104,7 @@ export default { case this.eventTypes.CLICK: case this.eventTypes.ENTER: case this.eventTypes.SPACE: + case this.eventTypes.MOUNT: this.handleClick(e); this.handlePushClickEventToGACheck( this.eventTypes.CLICK @@ -189,6 +204,7 @@ export default { ENTER: "enter", SPACE: "space", CLICK: "click", + MOUNT: "mount" }; }, }, diff --git a/src/common-components/button-question/button-question.vue b/src/common-components/button-question/button-question.vue index d9ce22040..e3b0ca823 100644 --- a/src/common-components/button-question/button-question.vue +++ b/src/common-components/button-question/button-question.vue @@ -53,6 +53,7 @@ :selectOnKeypress="selectOnKeypress" :lastValuePushedToGa="lastValuePushedToGa" :setLastValuePushedToGa="setLastValuePushedToGa" + :shouldPushClickEventToGAOnMount="shouldPushClickEventToGAOnMount" @inputButtonClicked="handleAnswerChange" /> @@ -121,6 +122,7 @@ export default { type: Boolean, default: true, }, + shouldPushClickEventToGAOnMount: Boolean }, data() { return { diff --git a/src/layouts/vehicle-parts/glass-part-question/glass-part-question.vue b/src/layouts/vehicle-parts/glass-part-question/glass-part-question.vue index 19cf4524b..72b66e3e3 100644 --- a/src/layouts/vehicle-parts/glass-part-question/glass-part-question.vue +++ b/src/layouts/vehicle-parts/glass-part-question/glass-part-question.vue @@ -28,6 +28,7 @@ isRequired :groupName="`${glassLocation}-${glassName}-${selectedTint}`" :validationRules="partValidationRules" + :shouldPushClickEventToGAOnMount="shouldPushClickEventToGAOnMount" /> @@ -56,6 +57,7 @@ export default { glassColorQuestion: "", glassFeatureQuestion: "", selectedTint: "", + shouldPushClickEventToGAOnMount: true }; }, props: { @@ -110,7 +112,7 @@ export default { selectedPartNumber: { get() { - return this.modelValue?.partNumber; + return this.modelValue ? this.modelValue[this.glassLocation][0] : undefined; }, set(newValue) { this.$emit("update:modelValue", this.partsForSelectedTint.filter(part => part.partNumber == newValue)[0]); @@ -198,9 +200,16 @@ export default { // Loads the preselected values from the store. LoadPreselectedValues() { this.$nextTick(() => { + console.log("LoadPreselectedValues: ", { + modelValue: this.modelValue, + alreadyPopulatedPartsData: this.alreadyPopulatedPartsData, + selectedPartNumber: this.selectedPartNumber + }) if (this.modelValue !== undefined) { // Populate button-question model-value if parts data already exists in VueX + this.shouldPushClickEventToGAOnMount = false; this.selectedTint = this.alreadyPopulatedPartsData.filter(part => part.partNumber === this.selectedPartNumber)[0]?.color; + console.log({color: this.selectedTint}) } }); }, diff --git a/src/mixins/input-button-wrapper-mixin.js b/src/mixins/input-button-wrapper-mixin.js index f36d25fca..a5d1a66d2 100644 --- a/src/mixins/input-button-wrapper-mixin.js +++ b/src/mixins/input-button-wrapper-mixin.js @@ -21,7 +21,8 @@ export default { default: true, }, lastValuePushedToGa: [String, Number], - setLastValuePushedToGa: Function + setLastValuePushedToGa: Function, + shouldPushClickEventToGAOnMount: Boolean }, methods: { handleAnswerChange(e) {