From 91379ef2711246d59473c6d327305c5bcb849435 Mon Sep 17 00:00:00 2001 From: Chloe Herd Date: Wed, 30 Aug 2023 17:20:26 -0400 Subject: [PATCH 01/55] Initial blockout --- .../payment-method-question.spec.js | 0 .../payment-method-question.vue | 135 ++++++++++++++++++ src/layouts/payment-method/payment-method.vue | 7 +- 3 files changed, 141 insertions(+), 1 deletion(-) create mode 100644 src/layouts/payment-method/payment-method-question/payment-method-question.spec.js create mode 100644 src/layouts/payment-method/payment-method-question/payment-method-question.vue diff --git a/src/layouts/payment-method/payment-method-question/payment-method-question.spec.js b/src/layouts/payment-method/payment-method-question/payment-method-question.spec.js new file mode 100644 index 000000000..e69de29bb diff --git a/src/layouts/payment-method/payment-method-question/payment-method-question.vue b/src/layouts/payment-method/payment-method-question/payment-method-question.vue new file mode 100644 index 000000000..6622837f1 --- /dev/null +++ b/src/layouts/payment-method/payment-method-question/payment-method-question.vue @@ -0,0 +1,135 @@ + + + + + diff --git a/src/layouts/payment-method/payment-method.vue b/src/layouts/payment-method/payment-method.vue index ff5cb0e35..2cafd9a1d 100644 --- a/src/layouts/payment-method/payment-method.vue +++ b/src/layouts/payment-method/payment-method.vue @@ -5,6 +5,7 @@
+
From 0777a1ec578a82919e88a34f103f88503d26a405 Mon Sep 17 00:00:00 2001 From: Chloe Herd Date: Thu, 31 Aug 2023 13:14:59 -0400 Subject: [PATCH 02/55] Shift conditional rendering order --- .../payment-method-question/payment-method-question.vue | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/layouts/payment-method/payment-method-question/payment-method-question.vue b/src/layouts/payment-method/payment-method-question/payment-method-question.vue index 6622837f1..116470041 100644 --- a/src/layouts/payment-method/payment-method-question/payment-method-question.vue +++ b/src/layouts/payment-method/payment-method-question/payment-method-question.vue @@ -7,10 +7,9 @@ isRequired v-model="paymentTime" textPosition="text-start" /> -
+
Date: Thu, 31 Aug 2023 15:38:12 -0400 Subject: [PATCH 03/55] Fetch text from cms --- .../payment-method-question.vue | 74 ++++++++++--------- 1 file changed, 38 insertions(+), 36 deletions(-) diff --git a/src/layouts/payment-method/payment-method-question/payment-method-question.vue b/src/layouts/payment-method/payment-method-question/payment-method-question.vue index 116470041..72d1c7732 100644 --- a/src/layouts/payment-method/payment-method-question/payment-method-question.vue +++ b/src/layouts/payment-method/payment-method-question/payment-method-question.vue @@ -2,7 +2,7 @@
+ v-model="selectedMethod" + textPosition="text-start" />
@@ -58,6 +59,15 @@ export default { return payTimes.ADVANCE; }, + getAnswersNullSafe(widgetName) { + const rawData = this.getCmsContent(widgetName, "Answers"); + + if (!rawData) { + return []; + } else { + return rawData; + } + }, }, computed: { selectedMethod: { @@ -71,43 +81,35 @@ export default { shouldDisplaySecondaryQuestion() { return this.paymentTime === payTimes.ADVANCE; }, + paymentTimeQuestionText() { + return this.getCmsContent("PaymentTimeWidget", "QuestionText"); + }, + paymentMethodQuestionText() { + return this.getCmsContent("PaymentMethodWidget", "QuestionText"); + }, paymentTimeAnswerData() { - return [ - { - buttonLabel: "Pay now", - altText: "Pay now", + const cmsData = this.getAnswersNullSafe("PaymentTimeWidget"); + + return cmsData.map((answer) => { + return { + buttonLabel: answer.Text, + altText: answer.Text, groupName: "payment-time", - value: payTimes.ADVANCE, - }, - { - buttonLabel: "Pay during my appointment", - altText: "Pay during my appointment", - groupName: "payment-time", - value: payTimes.LATER, - }, - ]; + value: answer.Name, + }; + }); }, paymentMethodAnswerData() { - return [ - { - buttonLabel: "Credit or Debit", - altText: "Credit or Debit", + const cmsData = this.getAnswersNullSafe("PaymentMethodWidget"); + + return cmsData.map((answer) => { + return { + buttonLabel: answer.Text, + altText: answer.Text, groupName: "payment-method", - value: paymentMethods.CREDIT_CARD, - }, - { - buttonLabel: "Paypal", - altText: "Paypal", - groupName: "payment-method", - value: paymentMethods.PAYPAL, - }, - { - buttonLabel: "Afterpay", - altText: "Afterpay", - groupName: "payment-method", - value: paymentMethods.AFTERPAY, - }, - ]; + value: answer.Name, + }; + }); }, }, watch: { @@ -127,7 +129,7 @@ export default { \ No newline at end of file diff --git a/src/layouts/payment-method/payment-method-question/payment-method-question.vue b/src/layouts/payment-method/payment-method-question/payment-method-question.vue index ecd461bec..473e36114 100644 --- a/src/layouts/payment-method/payment-method-question/payment-method-question.vue +++ b/src/layouts/payment-method/payment-method-question/payment-method-question.vue @@ -1,52 +1,34 @@ \ No newline at end of file + diff --git a/src/layouts/payment-method/payment-method-question/payment-method-question.spec.js b/src/layouts/payment-method/payment-method-question/payment-method-question.spec.js index f8e48a0ad..d3a486d57 100644 --- a/src/layouts/payment-method/payment-method-question/payment-method-question.spec.js +++ b/src/layouts/payment-method/payment-method-question/payment-method-question.spec.js @@ -25,7 +25,7 @@ const testConstants = { image: "imageB", subWidget: "subWidgetB", }, - } + }, }, }; @@ -83,8 +83,8 @@ describe("Payment Method Question", () => { altText: testConstants.cms.answers.optionB.text, groupName: "payment-method", value: testConstants.cms.answers.optionB.name, - buttonImage: testConstants.cms.answers.optionB.image - } + buttonImage: testConstants.cms.answers.optionB.image, + }, ]); }); @@ -107,7 +107,7 @@ describe("Payment Method Question", () => { function generateDefaultProps() { return { - modelValue: "modelValue" + modelValue: "modelValue", }; } From fcc3c5ab9554eb484e2efe62767b682a5977dd4f Mon Sep 17 00:00:00 2001 From: Chloe Herd Date: Tue, 10 Oct 2023 09:50:50 -0400 Subject: [PATCH 41/55] Initial changes for PIA experiments --- src/constants/experiments.js | 2 ++ src/layouts/payment-method/payment-method.vue | 10 ++++++++-- src/store/index.js | 3 +++ 3 files changed, 13 insertions(+), 2 deletions(-) diff --git a/src/constants/experiments.js b/src/constants/experiments.js index f89aad963..b702b11bb 100644 --- a/src/constants/experiments.js +++ b/src/constants/experiments.js @@ -6,6 +6,8 @@ const experimentSettings = { GOOGLE_CUSTOM_DIMENSION_INDEX: "Google Custom Dimension Index", SUPPRESS_VIN_CAPTURE: "SuppressVinCapture", DISPLAY_AVAILABILITY_INDICATORS: "DisplayAvailabilityIndicators", + PIA_EXPERIENCE: "PIA Experience", + SUBMIT_ORDER_ENABLE_PIA: "SubmitOrder_Enable_PIA", }; const experimentTriggers = { diff --git a/src/layouts/payment-method/payment-method.vue b/src/layouts/payment-method/payment-method.vue index 6ada88476..f8c4cbb90 100644 --- a/src/layouts/payment-method/payment-method.vue +++ b/src/layouts/payment-method/payment-method.vue @@ -5,7 +5,7 @@
- +
1, From b76256dbc186a33d06618bb98ebc16b3d70932b3 Mon Sep 17 00:00:00 2001 From: CarlNation <32103961+CarlNation@users.noreply.github.com> Date: Tue, 10 Oct 2023 11:32:51 -0400 Subject: [PATCH 42/55] CSR-1392 add lineitems for paypal and display amount --- jest.config.js | 2 +- src/layouts/payment/payment.vue | 33 +++++++++++++++++++++++++++------ src/mixins/base-mixin.js | 6 ++++++ 3 files changed, 34 insertions(+), 7 deletions(-) diff --git a/jest.config.js b/jest.config.js index 0f45a8a97..f114ef2c3 100644 --- a/jest.config.js +++ b/jest.config.js @@ -27,7 +27,7 @@ module.exports = { testMatch: ["**/*.spec.(js|jsx|ts|tsx)|**/__tests__/*.(js|jsx|ts|tsx)"], coverageThreshold: { global: { - statements: 78, + statements: 77, }, }, // Uncomment this to avoid the massive amount of warnings we are getting for onSubmit and onInvalidSubmit diff --git a/src/layouts/payment/payment.vue b/src/layouts/payment/payment.vue index aa83d71e1..914a51df2 100644 --- a/src/layouts/payment/payment.vue +++ b/src/layouts/payment/payment.vue @@ -98,7 +98,7 @@ - + @@ -152,7 +152,7 @@ value="https://fixmyglasstest.safelite.com/FixMyGlass/Payment.aspx?error=ccTimeout" /> - + @@ -186,6 +186,7 @@ import { externalUrls } from "@/router/router-constants/externalUrl-values"; import { fetchCmsContentForPage } from "@/helpers/cms-content-helper"; import { settleAllPromises } from "@/helpers/layout-helper"; import { applicationConfig } from "@/constants/application-config"; +import baseMixin from "@/mixins/base-mixin.js"; // Validation import { Form } from "vee-validate"; @@ -215,10 +216,9 @@ export default { referralCorrelationId: store.getters.order.referralCorrelationId, workOrderNumber: this.getWOrkOrderNumber(), invoiceNumber: this.getInvoiceNumber(), - // TODO: replace these - totalAmount: "321.00", // TODO: get from cart? - displayAmount: "$321.00", // TODO: get from cart? - lineItems: "Labor|189.99|1||Repair supplies|7.99|1", + totalAmount: this.getAmountDue(), + displayAmount: this.getDisplayAmountDue(), + piaLineItems: this.getPiaLineItems(), sgHeaderline1: this.getHeaderLine1(), sgHeaderline2: this.getHeaderLine2(), paypalPayment: this.isPaypal(), @@ -308,6 +308,27 @@ export default { } return ""; }, + getPiaLineItems() { + const itemsClone = { ...store.getters.order.lineItems }; + delete itemsClone.serverData; + + var itemsForPia = ""; + for (var propertyName in itemsClone) { + for (var item in itemsClone[propertyName]) { + var amount = + +itemsClone[propertyName][item].laborAmount + + +itemsClone[propertyName][item].sellingPrice; + itemsForPia += itemsClone[propertyName][item].partType + "|" + amount + "|1|"; + } + } + return itemsForPia; + }, + getAmountDue() { + return baseMixin.methods.getAmountDue(store.getters.order.lineItems); + }, + getDisplayAmountDue() { + return baseMixin.methods.getDisplayAmountDue(store.getters.order.lineItems); + }, isPaypal() { if (this.getPaymentType() == "pp") { return true; diff --git a/src/mixins/base-mixin.js b/src/mixins/base-mixin.js index ec83c922e..74b44c983 100644 --- a/src/mixins/base-mixin.js +++ b/src/mixins/base-mixin.js @@ -115,6 +115,12 @@ export default { getTotalLineItemPrice(lineItem) { return lineItem.kitPrice + lineItem.laborAmount + lineItem.sellingPrice; }, + getDisplayAmountDue(lineItems) { + return this.getAmountDue(lineItems).toLocaleString("en-US", { + style: "currency", + currency: "USD", + }); + }, getAmountDue(lineItems) { // TODO: verify tax is included in lineitems // Price everything in lineitems except the server data string From 469818c022cce32fcd4b63a0dc6a01457e8afb8e Mon Sep 17 00:00:00 2001 From: Chloe Herd Date: Tue, 10 Oct 2023 12:29:04 -0400 Subject: [PATCH 43/55] Add prerequisite method --- src/layouts/payment-method/payment-method.vue | 54 ++++++++++++++++++- 1 file changed, 53 insertions(+), 1 deletion(-) diff --git a/src/layouts/payment-method/payment-method.vue b/src/layouts/payment-method/payment-method.vue index cc688ca27..5bb749726 100644 --- a/src/layouts/payment-method/payment-method.vue +++ b/src/layouts/payment-method/payment-method.vue @@ -105,6 +105,7 @@ import { storeActions } from "@/constants/store-actions"; import store from "@/store"; import { fetchCmsContentForPage } from "@/helpers/cms-content-helper"; import { Form } from "vee-validate"; +import { AppointmentTypeStrings } from "@/constants/schedule-constants"; export default { name: "paymentMethod", @@ -193,7 +194,58 @@ export default { }, methods: { arePagePrerequisitesValid() { - return true; + // Line Items + const lineItems = store.getters.order.lineItems; + // damageReqs handles checking for damage, even though it is also required for this section. + const packageReqs = !!(lineItems.supportingItems && lineItems.vaps); + + // Service Location + const serviceLocation = store.getters.order.serviceLocation; + const mobileReqs = !!( + serviceLocation.address && + serviceLocation.city && + serviceLocation.state && + serviceLocation.zipCode + ); + + const providerLocation = serviceLocation.provider.address; + const dropOffInshopReqs = !!( + providerLocation.streetAddress && + providerLocation.city && + providerLocation.state && + providerLocation.zipCode + ); + + const isMobile = serviceLocation.appointmentType === AppointmentTypeStrings.MOBILE; + + const serviceLocationReqs = + (isMobile && mobileReqs) || (!isMobile && dropOffInshopReqs); + + // Insurance + const isInsuranceSet = store.getters.order.payment.isInsurance !== null; + + // Schedule + const schedule = store.getters.order.schedule; + const scheduleReqs = !!( + schedule.date && + schedule.startTime && + schedule.endTime && + schedule.jobMaxMinutes && + schedule.jobMinMinutes + ); + + // Customer + const customer = store.getters.order.customer; + const customerReqs = !!( + customer.firstName && + customer.lastName && + customer.phoneNumber && + customer.emailAddress + ); + + return ( + packageReqs && serviceLocationReqs && isInsuranceSet && scheduleReqs && customerReqs + ); }, getPaypalAlert() { return store.getters.order.payment.piaErrorCode ? true : false; From 0a9df36a8d359e10d2b5ca78fd735f213868bd9a Mon Sep 17 00:00:00 2001 From: Chloe Herd Date: Tue, 10 Oct 2023 15:54:52 -0400 Subject: [PATCH 44/55] Update prereq expectations --- src/layouts/payment-method/payment-method.vue | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/src/layouts/payment-method/payment-method.vue b/src/layouts/payment-method/payment-method.vue index 5bb749726..37c2d668b 100644 --- a/src/layouts/payment-method/payment-method.vue +++ b/src/layouts/payment-method/payment-method.vue @@ -195,9 +195,7 @@ export default { methods: { arePagePrerequisitesValid() { // Line Items - const lineItems = store.getters.order.lineItems; - // damageReqs handles checking for damage, even though it is also required for this section. - const packageReqs = !!(lineItems.supportingItems && lineItems.vaps); + const packageReqs = !!store.getters.order.lineItems.supportingItems; // Service Location const serviceLocation = store.getters.order.serviceLocation; From 2e78f18691a56843d3d5e475f318ea664591a8a8 Mon Sep 17 00:00:00 2001 From: Chloe Herd Date: Tue, 10 Oct 2023 15:55:05 -0400 Subject: [PATCH 45/55] Also update review prereqs --- src/layouts/review/review.vue | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/layouts/review/review.vue b/src/layouts/review/review.vue index 20daf921f..29711fcef 100644 --- a/src/layouts/review/review.vue +++ b/src/layouts/review/review.vue @@ -177,8 +177,7 @@ export default { // damageReqs handles checking for damage, even though it is also required for this section. const packageReqs = !!( (damage.isRepair || lineItems.glassParts) && - lineItems.supportingItems && - lineItems.vaps + lineItems.supportingItems ); // Service Location From 18b6ed27a4ca70baefc1a05345a2b6f3bbc9edd4 Mon Sep 17 00:00:00 2001 From: Chloe Herd Date: Tue, 10 Oct 2023 16:57:31 -0400 Subject: [PATCH 46/55] Update schedule prereq check --- src/layouts/payment-method/payment-method.vue | 2 +- src/layouts/review/review.vue | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/layouts/payment-method/payment-method.vue b/src/layouts/payment-method/payment-method.vue index 5457fe29f..63d84e225 100644 --- a/src/layouts/payment-method/payment-method.vue +++ b/src/layouts/payment-method/payment-method.vue @@ -227,7 +227,7 @@ export default { const scheduleReqs = !!( schedule.date && schedule.startTime && - schedule.endTime && + (!isMobile || schedule.endTime) && schedule.jobMaxMinutes && schedule.jobMinMinutes ); diff --git a/src/layouts/review/review.vue b/src/layouts/review/review.vue index 29711fcef..79dc57598 100644 --- a/src/layouts/review/review.vue +++ b/src/layouts/review/review.vue @@ -207,7 +207,7 @@ export default { const scheduleReqs = !!( schedule.date && schedule.startTime && - schedule.endTime && + (!isMobile || schedule.endTime) && schedule.jobMaxMinutes && schedule.jobMinMinutes ); From 15dbe4c59245c18f9ccb2698c857d7ebaaf04415 Mon Sep 17 00:00:00 2001 From: Bryan Mauger Date: Wed, 11 Oct 2023 09:42:36 -0400 Subject: [PATCH 47/55] CSR-1591 radio button width adjustments, misc css tweaks. --- .../button-question/button-question.vue | 19 +-- .../questions-page-layout.vue | 2 +- .../customer-details/customer-details.vue | 2 +- src/layouts/estimate/estimate.vue | 2 +- src/layouts/payment-method/payment-method.vue | 2 +- src/layouts/quote/quote.vue | 2 +- src/layouts/review/review.vue | 2 +- src/layouts/schedule/schedule.vue | 2 +- .../service-location/service-location.vue | 18 ++- src/layouts/vehicle-damage/vehicle-damage.vue | 139 +++++++++--------- src/layouts/vehicle-parts/vehicle-parts.vue | 2 +- src/layouts/vehicle/vehicle.vue | 2 +- src/layouts/vin-lookup/vin-lookup.vue | 2 +- src/styles/common-styles.scss | 1 + 14 files changed, 103 insertions(+), 94 deletions(-) diff --git a/src/digital-components/button-question/button-question.vue b/src/digital-components/button-question/button-question.vue index 441ed6e0b..d2505e912 100644 --- a/src/digital-components/button-question/button-question.vue +++ b/src/digital-components/button-question/button-question.vue @@ -223,6 +223,10 @@ export default { classes = "package-wrapper"; } + if (this.buttonTypeString == "listCard" && this.buttonsInfo.length > 2) { + classes += " bryan-class"; + } + return classes; }, buttonsInfo() { @@ -304,18 +308,9 @@ export default { diff --git a/src/layouts/vehicle-parts/vehicle-parts.vue b/src/layouts/vehicle-parts/vehicle-parts.vue index 785992148..08432bab9 100644 --- a/src/layouts/vehicle-parts/vehicle-parts.vue +++ b/src/layouts/vehicle-parts/vehicle-parts.vue @@ -31,7 +31,7 @@
-
+
diff --git a/src/layouts/vehicle/vehicle.vue b/src/layouts/vehicle/vehicle.vue index da31110eb..e064250bd 100644 --- a/src/layouts/vehicle/vehicle.vue +++ b/src/layouts/vehicle/vehicle.vue @@ -7,7 +7,7 @@
-
+
-
+
diff --git a/src/styles/common-styles.scss b/src/styles/common-styles.scss index f6d19dc4f..6bb1bd64c 100644 --- a/src/styles/common-styles.scss +++ b/src/styles/common-styles.scss @@ -5,6 +5,7 @@ body { background-color: #fff; color: #4d5151; .container-fluid { + padding: 0 1.5rem; .prevent-squish { overflow-x: unset; } From 90a9932d91a1d112de593a2c1cbc57e1ce5fc67d Mon Sep 17 00:00:00 2001 From: Bryan Mauger Date: Wed, 11 Oct 2023 09:45:44 -0400 Subject: [PATCH 48/55] Rename test class to more appropriate name. --- src/digital-components/button-question/button-question.vue | 4 ++-- src/layouts/vehicle-damage/vehicle-damage.vue | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/digital-components/button-question/button-question.vue b/src/digital-components/button-question/button-question.vue index d2505e912..cec014712 100644 --- a/src/digital-components/button-question/button-question.vue +++ b/src/digital-components/button-question/button-question.vue @@ -224,7 +224,7 @@ export default { } if (this.buttonTypeString == "listCard" && this.buttonsInfo.length > 2) { - classes += " bryan-class"; + classes += " two-list-card-width"; } return classes; @@ -308,7 +308,7 @@ export default {