WIP CSR-2115

This commit is contained in:
Bryan Mauger 2024-06-26 11:27:20 -04:00
parent 60a63891df
commit da89f0929f
4 changed files with 79 additions and 43 deletions

View file

@ -24,6 +24,7 @@ const errorMessages = {
VIN_FORMAT:
"Invalid VIN. Please make sure that you entered the correct 17-digit, alpha-numeric number. VINs do not contain the letters I, O, or Q",
OPTION_REQUIRED: "Please select an option",
RECAL_ACK_REQUIRED: "Please acknowledge recalibration alert",
VEHICLE_REQUIRED: "Please select a vehicle",
MOBILE_LOCATION_REQUIRED: "Please enter your service address",
DATE_REQUIRED: "Please select a date",

View file

@ -10,6 +10,7 @@
type="checkbox"
aria-checked="false"
:name="checkboxName"
:validationRules="validationRules"
:id="buttonID"
:tabindex="tabIndex"
:aria-required="isRequired" />
@ -20,6 +21,10 @@
</template>
<script>
import { useField, validate } from "vee-validate";
import { v4 as uuidv4 } from "uuid";
export default {
name: "checkboxQuestion",
computed: {
@ -35,7 +40,34 @@ export default {
},
},
},
setup(props) {
const uuid = uuidv4();
const inputId = !props.customInputId ? `input-${uuid}` : props.customInputId;
const propsClone = Object.assign({}, props);
const modelValue = propsClone.modelValue;
const fieldOptions = {
value: modelValue,
initialValue: null,
};
const { errorMessage, handleBlur, handleChange, meta, validate, errors, resetField } =
useField(inputId, props.validationRules, fieldOptions);
return {
errorMessage,
handleBlur,
handleChange,
validate,
meta,
errors,
resetField,
};
},
props: {
customInputId: String,
validationRules: String,
cmsWidgetName: String,
checkboxName: String,
buttonID: String,

View file

@ -55,7 +55,9 @@
<div class="d-flex flex-row checkbox-group">
<checkboxQuestion
class="mb-5"
v-model="isRecalAckOptIn" />
isRequired=true
v-model="isRecalAckOptIn"
validationRules="recal-ack-required" />
<textBlock
cmsWidgetName="RecalConfirmationWidget"
justifyText="left"
@ -66,7 +68,7 @@
<paymentMethodQuestion
v-if="!isPiaDisabled"
v-model="paymentMethodInternalModel"
validationRules="option-required" />
validationRules="payment-method-required" />
<alert
v-if="isPiaDisabled"
@ -144,7 +146,8 @@ import { partTypeStrings } from "@/constants/part-type-strings";
import { mapTaxedLineItemsToStoreFormat } from "../../store";
import { coverageStatus } from "@/constants/insurance";
defineRule("option-required", required(errorMessages.OPTION_REQUIRED));
defineRule("payment-method-required", required(errorMessages.OPTION_REQUIRED));
defineRule("recal-ack-required", required(errorMessages.RECAL_ACK_REQUIRED));
export default {
name: "paymentMethod",
@ -486,44 +489,44 @@ export default {
this.$router.navigateWithoutSaving(this.navigationScenarios.CLICKED_BACK, this.$route);
},
async forwardButtonAction() {
await this.dispatchStoreAction(
storeActions.SAVE_PAYMENT_METHOD_CHOICE,
this.paymentMethod,
false
);
// await this.dispatchStoreAction(
// storeActions.SAVE_PAYMENT_METHOD_CHOICE,
// this.paymentMethod,
// false
// );
// save lineitems as they now have salestax added
await this.dispatchStoreAction(
storeActions.SAVE_GLASS_PARTS_SUPPRESSING_STATE_RESETTING,
this.lineItems.glassParts,
false
);
// // save lineitems as they now have salestax added
// await this.dispatchStoreAction(
// storeActions.SAVE_GLASS_PARTS_SUPPRESSING_STATE_RESETTING,
// this.lineItems.glassParts,
// false
// );
await this.dispatchStoreAction(
storeActions.SAVE_SUPPORTING_ITEMS_SUPPRESSING_STATE_RESETTING,
this.lineItems.supportingItems,
false
);
await this.dispatchStoreAction(storeActions.SAVE_VAPS, this.lineItems.vaps, false);
this.dispatchStoreAction(
storeActions.SAVE_ACTIVE_AND_OR_INACTIVE_PROMOS,
{
activePromos: this.lineItems.promos,
inactivePromos: this.inactivePromos,
},
false
);
// await this.dispatchStoreAction(
// storeActions.SAVE_SUPPORTING_ITEMS_SUPPRESSING_STATE_RESETTING,
// this.lineItems.supportingItems,
// false
// );
// await this.dispatchStoreAction(storeActions.SAVE_VAPS, this.lineItems.vaps, false);
// this.dispatchStoreAction(
// storeActions.SAVE_ACTIVE_AND_OR_INACTIVE_PROMOS,
// {
// activePromos: this.lineItems.promos,
// inactivePromos: this.inactivePromos,
// },
// false
// );
if (this.paymentMethod == paymentMethods.LATER) {
// this creates the final work order
await submitWorkOrder({ pageNameToLog: "payment-method", submitAfterSave: true });
this.$router.navigateWithoutSaving(
this.navigationScenarios.CLICKED_FORWARD,
this.$route
);
} else {
this.setupPia();
}
// if (this.paymentMethod == paymentMethods.LATER) {
// // this creates the final work order
// await submitWorkOrder({ pageNameToLog: "payment-method", submitAfterSave: true });
// this.$router.navigateWithoutSaving(
// this.navigationScenarios.CLICKED_FORWARD,
// this.$route
// );
// } else {
// this.setupPia();
// }
},
async setupPia() {
this.$refs.loadingModal.showModal();

View file

@ -29,10 +29,10 @@ vueApp.mixin(analyticsMixin);
vueApp.mixin(experimentMixin);
// Vue Error Handling
vueApp.config.errorHandler = (err, vm, info) => {
global.$logger.logError(
`Page Name - ${vm.getPageName()} - ${info}: ${err.message}\n${err.stack}`
);
};
// vueApp.config.errorHandler = (err, vm, info) => {
// global.$logger.logError(
// `Page Name - ${vm.getPageName()} - ${info}: ${err.message}\n${err.stack}`
// );
// };
vueApp.mount("#app");