Merge pull request #1416 from Safelite/feature/csr-1465
Feature/csr 1465 + 1464 + 1389 tech review/demo
This commit is contained in:
commit
442a5a6522
7 changed files with 80 additions and 18 deletions
|
|
@ -5,9 +5,3 @@ export const paymentMethods = {
|
|||
PAYPAL: "Paypal",
|
||||
AFTERPAY: "Afterpay",
|
||||
};
|
||||
|
||||
export const paymentTimes = {
|
||||
NONE: null,
|
||||
ADVANCE: "Advance",
|
||||
LATER: "Later",
|
||||
};
|
||||
|
|
|
|||
|
|
@ -80,7 +80,7 @@ const storeActions = {
|
|||
SAVE_MOLDING_QUESTION_ANSWERS: "saveMoldingQuestionAnswers",
|
||||
SAVE_CAPABILITY_QUESTION_ANSWERS: "saveCapabilityQuestionAnswers",
|
||||
SAVE_PAYMENT_TYPE: "savePaymentType",
|
||||
SAVE_PAY_NOW_TYPE: "savePayNowType",
|
||||
SAVE_PAYMENT_METHOD_CHOICE: "savePaymentMethodChoice",
|
||||
SAVE_PARENT_ACCOUNT_NUMBER: "saveParentAccountNumber",
|
||||
SAVE_SUPPORTING_ITEMS: "saveSupportingItems",
|
||||
SAVE_SUPPORTING_ITEMS_SUPPRESSING_STATE_RESETTING:
|
||||
|
|
|
|||
|
|
@ -50,7 +50,8 @@ const storeMutations = {
|
|||
UPDATE_IS_INSURANCE: "updateIsInsurance",
|
||||
UPDATE_SAVED_SESSION_ID: "updateSavedSessionId",
|
||||
UPDATE_CRM_CUSTOMER_ID: "updateCrmCustomerId",
|
||||
UPDATE_PAY_NOW_TYPE: "updatePayNowType",
|
||||
UPDATE_IS_PIA: "updateIsPia",
|
||||
UPDATE_PIA_TYPE: "updatePiaType",
|
||||
WORK_ORDER_NUMBER: "updateWorkOrderNumber",
|
||||
|
||||
// EVENT BUS MUTATIONS
|
||||
|
|
@ -68,6 +69,7 @@ const storeMutations = {
|
|||
RESET_SERVICE_LOCATION_PROVIDER: "resetServiceLocationProvider",
|
||||
RESET_SERVICE_LOCATION_MOBILE_ADDRESS: "resetServiceLocationMobileAddress",
|
||||
RESET_SCHEDULE: "resetSchedule",
|
||||
RESET_PAYMENT_METHOD_CHOICE: "resetPaymentMethodChoice",
|
||||
|
||||
// OTHER MUTATIONS
|
||||
UPDATE_PAGE_DATA: "updatePageData",
|
||||
|
|
|
|||
|
|
@ -8,6 +8,7 @@
|
|||
:questionText="paymentMethodQuestionText"
|
||||
:answers="paymentMethodAnswerData"
|
||||
isRequired
|
||||
:validationRules="validationRules"
|
||||
v-model="selectedMethod"
|
||||
textPosition="text-start" />
|
||||
</div>
|
||||
|
|
@ -27,6 +28,7 @@ export default {
|
|||
},
|
||||
props: {
|
||||
modelValue: String,
|
||||
validationRules: String,
|
||||
},
|
||||
methods: {
|
||||
getAnswersNullSafe(widgetName) {
|
||||
|
|
|
|||
|
|
@ -13,7 +13,16 @@
|
|||
cmsWidgetName="VehicleBannerWidget"
|
||||
:displayGenericVehicleImage="false" />
|
||||
|
||||
<funnelSubHeader class="mb-5" cmsWidgetName="FunnelSubHeaderWidget" />
|
||||
<funnelSubHeader
|
||||
class="mb-5"
|
||||
cmsWidgetName="FunnelSubHeaderWidget"
|
||||
leftAlignHeader />
|
||||
|
||||
<p v-if="isPiaDisabled" class="fw-normal no-pia-disclaimer">
|
||||
<span>{{ noPiaDisclaimer }}</span>
|
||||
</p>
|
||||
|
||||
<hr />
|
||||
|
||||
<cart
|
||||
:damage="damageInfo"
|
||||
|
|
@ -41,7 +50,8 @@
|
|||
<contentGroupModal ref="RainDefenseModal" cmsWidgetName="RainDefenseModal" />
|
||||
<paymentMethodQuestion
|
||||
v-if="!isPiaDisabled"
|
||||
v-model="paymentMethodInternalModel" />
|
||||
v-model="paymentMethodInternalModel"
|
||||
validationRules="option-required" />
|
||||
|
||||
<navbar
|
||||
cmsWidgetName="FunnelFooterWidget"
|
||||
|
|
@ -78,8 +88,13 @@ import { paymentMethods } from "@/constants/payment-method-constants";
|
|||
import { experimentSettings } from "@/constants/experiments";
|
||||
|
||||
import { Form } from "vee-validate";
|
||||
import { defineRule } from "vee-validate";
|
||||
import { required } from "@/helpers/validation-rules";
|
||||
import { errorMessages } from "@/constants/error-messages";
|
||||
import { AppointmentTypeStrings } from "@/constants/schedule-constants";
|
||||
|
||||
defineRule("option-required", required(errorMessages.OPTION_REQUIRED));
|
||||
|
||||
export default {
|
||||
name: "paymentMethod",
|
||||
async beforeRouteEnter(to, from, next) {
|
||||
|
|
@ -162,7 +177,7 @@ export default {
|
|||
lineItems: [],
|
||||
availableLineItems: [],
|
||||
displayPaypalAlert: this.getPaypalAlert(),
|
||||
paymentMethodInternalModel: null,
|
||||
paymentMethodInternalModel: this.getPaymentMethodFromStore(),
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
|
|
@ -224,6 +239,19 @@ export default {
|
|||
getPaypalAlert() {
|
||||
return store.getters.order.payment.piaErrorCode ? true : false;
|
||||
},
|
||||
getPaymentMethodFromStore() {
|
||||
const isPia = store.getters.order.payment.isPia;
|
||||
|
||||
if (isPia === null || isPia === undefined) {
|
||||
return null;
|
||||
}
|
||||
|
||||
if (isPia) {
|
||||
return store.getters.order.payment.piaType;
|
||||
} else {
|
||||
return paymentMethods.LATER;
|
||||
}
|
||||
},
|
||||
vapsItemsSelectedAction(vapsItemsSelected) {
|
||||
this.cartItems = vapsItemsSelected;
|
||||
},
|
||||
|
|
@ -261,6 +289,11 @@ export default {
|
|||
default:
|
||||
this.dispatchStoreAction(storeActions.SAVE_PIA_ERROR_CODE, null, false);
|
||||
this.dispatchStoreAction(this.storeActions.SAVE_WORK_ORDER_FLAG, true, false);
|
||||
this.dispatchStoreAction(
|
||||
storeActions.SAVE_PAYMENT_METHOD_CHOICE,
|
||||
this.paymentMethod,
|
||||
false
|
||||
);
|
||||
await submitWorkOrder({ pageNameToLog: "payment-method" });
|
||||
this.$router.navigateWithoutSaving(
|
||||
this.navigationScenarios.CLICKED_FORWARD,
|
||||
|
|
@ -282,7 +315,11 @@ export default {
|
|||
|
||||
// since we're leaving the site for pia, clear any save session promises that we will not be able to resolve when we return
|
||||
await this.dispatchStoreAction(storeActions.RESET_SAVE_SESSION_PROMISE);
|
||||
await this.dispatchStoreAction(storeActions.SAVE_PAY_NOW_TYPE, payNowType, false);
|
||||
await this.dispatchStoreAction(
|
||||
storeActions.SAVE_PAYMENT_METHOD_CHOICE,
|
||||
this.paymentMethod,
|
||||
false
|
||||
);
|
||||
|
||||
// make sure pia error codes are reset
|
||||
this.dispatchStoreAction(storeActions.SAVE_PIA_ERROR_CODE, null, false);
|
||||
|
|
@ -305,6 +342,9 @@ export default {
|
|||
// console.log("this.$store.getters.damage ", this.$store.getters.damage)
|
||||
return this.$store.getters.damage;
|
||||
},
|
||||
noPiaDisclaimer() {
|
||||
return this.getCmsContent("NoPiaDisclaimerWidget", "Text");
|
||||
},
|
||||
customCtaCopy() {
|
||||
switch (this.paymentMethod) {
|
||||
case paymentMethods.CREDIT_CARD:
|
||||
|
|
@ -353,3 +393,10 @@ export default {
|
|||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.no-pia-disclaimer {
|
||||
color: $gray-550;
|
||||
margin: 0;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -294,7 +294,7 @@ export default {
|
|||
: store.getters.order.serviceLocation.provider.address.zipCode;
|
||||
},
|
||||
getPaymentType() {
|
||||
return store.getters.order.payment.payNowType;
|
||||
return store.getters.order.payment.piaType;
|
||||
},
|
||||
getHeaderLine1() {
|
||||
if (!this.isPaypal()) {
|
||||
|
|
|
|||
|
|
@ -22,6 +22,7 @@ import {
|
|||
militaryToTwelveHourTime,
|
||||
getDisplayTextForDurationLength,
|
||||
} from "@/layouts/schedule/helpers/schedule-helper";
|
||||
import { paymentMethods } from "@/constants/payment-method-constants";
|
||||
|
||||
import { getDateDifferenceInDays } from "@/helpers/date-helper";
|
||||
// Export State
|
||||
|
|
@ -94,7 +95,8 @@ const getDefaultState = () => {
|
|||
coverageStatus: null,
|
||||
},
|
||||
parentAccountNumber: 0,
|
||||
payNowType: "cc",
|
||||
isPia: null,
|
||||
piaType: null,
|
||||
piaErrorCode: null,
|
||||
inactivePromos: null,
|
||||
},
|
||||
|
|
@ -227,8 +229,11 @@ export const mutations = {
|
|||
updateIsInsurance(state, isInsurance) {
|
||||
state.order.payment.isInsurance = isInsurance;
|
||||
},
|
||||
updatePayNowType(state, payNowType) {
|
||||
state.order.payment.payNowType = payNowType;
|
||||
updateIsPia(state, isPia) {
|
||||
state.order.payment.isPia = isPia;
|
||||
},
|
||||
updatePiaType(state, piaType) {
|
||||
state.order.payment.piaType = piaType;
|
||||
},
|
||||
updatePiaErrorCode(state, piaErrorCode) {
|
||||
state.order.payment.piaErrorCode = piaErrorCode;
|
||||
|
|
@ -418,6 +423,10 @@ export const mutations = {
|
|||
state.order.serviceLocation.state = null;
|
||||
state.order.serviceLocation.isVehicleProtected = null;
|
||||
},
|
||||
resetPaymentMethodChoice(state) {
|
||||
state.order.payment.isPia = null;
|
||||
state.order.payment.piaType = null;
|
||||
},
|
||||
// Misc Mutations
|
||||
updateStateWithOrderInformation(state, sessionInformation) {
|
||||
state.order.referralNumber = sessionInformation.order.referralNumber;
|
||||
|
|
@ -888,6 +897,7 @@ export const actions = {
|
|||
context.commit(storeMutations.RESET_SERVICE_LOCATION_PROVIDER);
|
||||
|
||||
context.commit(storeMutations.RESET_SCHEDULE);
|
||||
context.commit(storeMutations.RESET_PAYMENT_METHOD_CHOICE);
|
||||
},
|
||||
|
||||
resetState(context) {
|
||||
|
|
@ -2012,10 +2022,16 @@ export const actions = {
|
|||
|
||||
savePaymentType(context, isInsurance) {
|
||||
context.commit(storeMutations.UPDATE_IS_INSURANCE, isInsurance);
|
||||
|
||||
context.commit(storeMutations.RESET_PAYMENT_METHOD_CHOICE);
|
||||
},
|
||||
|
||||
savePayNowType(context, payNowType) {
|
||||
context.commit(storeMutations.UPDATE_PAY_NOW_TYPE, payNowType);
|
||||
savePaymentMethodChoice(context, paymentMethod) {
|
||||
const isPia = paymentMethod !== paymentMethods.LATER;
|
||||
|
||||
context.commit(storeMutations.UPDATE_IS_PIA, isPia);
|
||||
|
||||
context.commit(storeMutations.UPDATE_PIA_TYPE, isPia ? paymentMethod : null);
|
||||
},
|
||||
|
||||
saveParentAccountNumber(context, parentAccountNumber) {
|
||||
|
|
@ -2285,6 +2301,7 @@ export const actions = {
|
|||
context.state.order.serviceLocation.appointmentType
|
||||
) {
|
||||
context.commit(storeMutations.RESET_SCHEDULE);
|
||||
context.commit(storeMutations.RESET_PAYMENT_METHOD_CHOICE);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue