diff --git a/src/iss-components/cart-dropdown/cart-dropdown.vue b/src/iss-components/cart-dropdown/cart-dropdown.vue index 43b8f62a..13d6a1d9 100644 --- a/src/iss-components/cart-dropdown/cart-dropdown.vue +++ b/src/iss-components/cart-dropdown/cart-dropdown.vue @@ -39,15 +39,51 @@ +
+
+ + {{ formatAmountInDollars(packagePrice) }} +
+
+
+
+ {{ item.name }} + + + +
+
+
+
{{ mobileFeeCartItem.name }} @@ -56,18 +92,18 @@
+ linkType="text" + :text="recycleFeeCartItem.name" + href="javascript:void(0)" + @clickEvent="openModal(recyclingModalCmsWidgetName)" /> {{ getDisplayed(recycleFeeCartItem.subTotal) }}
@@ -100,30 +136,6 @@
-
-
- {{ servicePackageLabel }} - {{ formatAmountInDollars(packagePrice) }} - Remove -
- -
- Wiper blades - Remove -
-
@@ -140,12 +152,10 @@ import textBlock from '@/digital-components/text-block/text-block.vue'; import textLink from '@/ux-components/text-link/text-link.vue'; import getPriceOfLineItems from '@/helpers/price-calculator.js'; import { formatAmountInDollars } from '@/helpers/text-helper.js'; -import { getHighestFullySatisfiedTier, getAvailablePackages } from '@/helpers/service-package-helper.js'; +import { getHighestFullySatisfiedTier, getPackageContents } from '@/helpers/service-package-helper.js'; // Constants import partTypeStrings from '@/constants/part-type-strings.js'; -import cartItemCategories from '@/constants/cart-item-categories.js'; -import cartItemTypes from '@/constants/cart-item-types.js'; import widgetFields from '@/constants/cms-widget-fields.js'; const VERIFYING_COVERAGE = 'Verifying coverage'; @@ -159,24 +169,26 @@ export default { }, props: { showAsPaid: Boolean, - // servicePackageLabel: String, readOnly: Boolean, - // TODO add allowRemoveItems - recyclingModalCmsWidgetName: String + recyclingModalCmsWidgetName: String, + availableVaps: Array }, data() { const { currentDeductible } = useMainStore().order; + const { glassToReplace, isRepair } = useMainStore().damage; const { supportingItems, glassParts, otherParts, vaps } = useMainStore().lineItems; - const baseServiceLineItems = [ - ...(supportingItems ?? []), - ...(glassParts ?? []), - ...(otherParts ?? []) - ]; + return { - vaps: vaps ?? [], + isRepair, + glassToReplace: glassToReplace ?? [], + vapsInOrder: vaps ?? [], + baseServiceLineItems: [ + ...(supportingItems ?? []), + ...(glassParts ?? []), + ...(otherParts ?? []) + ], deductible: currentDeductible, - baseServiceLineItems, - isExpanded: false, + isExpanded: true, // false, widget: { amountDue: 'AmountDueTextWidget', deductible: 'DeductibleWidget', @@ -184,7 +196,8 @@ export default { subtotal: 'SubtotalWidget', salesTax: 'SalesTaxWidget', recycleFee: 'RecycleFeeWidget', - mobileFee: 'MobileServiceWidget' + mobileFee: 'MobileServiceWidget', + servicePackage: 'ServicePackageTitle' } }; }, @@ -209,141 +222,64 @@ export default { amountDue() { return this.showAsPaid ? 0 - : this.subTotal + this.packagePrice + this.salesTax; + : this.subTotal + this.salesTax; + }, + availableLineItems() { + const { glassParts, supportingItems } = useMainStore().lineItems; + return [ + ...(glassParts ?? []), + ...(supportingItems ?? []), + ...this.availableVaps + ]; + }, + servicePackageTier() { + return getHighestFullySatisfiedTier( + this.glassToReplace, + this.availableLineItems, + this.isRepair, + this.vapsInOrder + ); + }, + servicePackageCartItems() { + const packageContentTypes = getPackageContents( + this.glassToReplace, + this.availableLineItems, + this.isRepair, + this.servicePackageTier + ) ?? []; + const items = []; + if (packageContentTypes.includes(partTypeStrings.FRONT_WIPER)) { + items.push(this.frontWipersCartItem); + } + if (packageContentTypes.includes(partTypeStrings.REAR_WIPER)) { + items.push(this.rearWipersCartItem); + } + if (packageContentTypes.includes(partTypeStrings.RAIN_DEFENSE)) { + items.push(this.rainDefenseCartItem); + } + return items; }, - // frontWiperCartItemName() { - // return this.getCmsContentForVapsType(partTypeStrings.FRONT_WIPER); - // }, - // frontWipersCartItem() { - // let cartItem = null; - - // const frontWiperLineItems = this.vaps.filter((vapsLineItem) => vapsLineItem.partType == partTypeStrings.FRONT_WIPER); - - // if (frontWiperLineItems.length > 0) { - // cartItem = { - // name: this.frontWiperCartItemName, - // category: cartItemCategories.VAPS, - // cartItemType: cartItemTypes.FRONT_WIPERS, - // isDisplayed: true, - // isRemovable: true, - // subTotal: 0, - // salesTax: 0, - // lineItems: [] - // }; - - // frontWiperLineItems.forEach((lineItem) => { - // lineItem.cartItemType = cartItem.cartItemType; - // cartItem.lineItems.push(lineItem); - - // cartItem.subTotal - // += (lineItem.kitPrice ?? 0) - // + (lineItem.laborAmount ?? 0) - // + (lineItem.sellingPrice ?? 0); - - // cartItem.salesTax += lineItem.salesTax ?? 0; - // }); - // } - - // return cartItem; - // }, - // rearWiperCartItemName() { - // return this.getCmsContentForVapsType(partTypeStrings.REAR_WIPER); - // }, - // rearWipersCartItem() { - // let cartItem = null; - - // const rearWiperLineItems = this.vaps.filter((vapsLineItem) => vapsLineItem.partType == partTypeStrings.REAR_WIPER); - - // if (rearWiperLineItems.length > 0) { - // cartItem = { - // name: this.rearWiperCartItemName, - // category: cartItemCategories.VAPS, - // cartItemType: cartItemTypes.REAR_WIPERS, - // isDisplayed: true, - // isRemovable: true, - // subTotal: 0, - // salesTax: 0, - // lineItems: [] - // }; - - // rearWiperLineItems.forEach((lineItem) => { - // lineItem.cartItemType = cartItem.cartItemType; - // cartItem.lineItems.push(lineItem); - - // cartItem.subTotal - // += (lineItem.kitPrice ?? 0) - // + (lineItem.laborAmount ?? 0) - // + (lineItem.sellingPrice ?? 0); - - // cartItem.salesTax += lineItem.salesTax ?? 0; - // }); - // } - - // return cartItem; - // }, - rainDefenseCartItemName() { - return this.getCmsContentForVapsType(partTypeStrings.RAIN_DEFENSE); + frontWipersCartItem() { + const frontWipersLabel = this.getCmsContentForVapsType(partTypeStrings.FRONT_WIPER); + const frontWipersLineItems = this.vapsInOrder + .filter((vapsLineItem) => vapsLineItem.partType === partTypeStrings.FRONT_WIPER); + return this.getCartItem(frontWipersLabel, frontWipersLineItems); + }, + rearWipersCartItem() { + const rearWipersLabel = this.getCmsContentForVapsType(partTypeStrings.REAR_WIPER); + const rearWipersLineItems = this.vapsInOrder + .filter((vapsLineItem) => vapsLineItem.partType === partTypeStrings.REAR_WIPER); + return this.getCartItem(rearWipersLabel, rearWipersLineItems); }, rainDefenseCartItem() { - let cartItem = null; - - const rainDefenseLineItem = this.vaps.find((vapsLineItem) => vapsLineItem.partType === partTypeStrings.RAIN_DEFENSE); - rainDefenseLineItem.cartItemType = cartItemTypes.RAIN_DEFENSE; - if (rainDefenseLineItem) { - cartItem = { - name: this.rainDefenseCartItemName, - category: cartItemCategories.VAPS, - cartItemType: cartItemTypes.RAIN_DEFENSE, - isDisplayed: true, - isRemovable: true, - subTotal: getPriceOfLineItems([rainDefenseLineItem]), - salesTax: rainDefenseLineItem.salesTax ?? 0, - lineItems: [rainDefenseLineItem] - }; - } - return cartItem; - }, - - servicePackageLabelCalc() { - // If just rain, "Rain" - return ''; - }, - packageLevel() { - const tier = getHighestFullySatisfiedTier( - this.glassToReplace, - this.baseServiceLineItems, - this.isRepair, - this.vaps - ); - - return tier; + const rainDefenseLabel = this.getCmsContentForVapsType(partTypeStrings.RAIN_DEFENSE); + const rainDefenseLineItem = this.vapsInOrder + .find((vapsLineItem) => vapsLineItem.partType === partTypeStrings.RAIN_DEFENSE); + return this.getCartItem(rainDefenseLabel, [rainDefenseLineItem]); }, packagePrice() { - return getPriceOfLineItems(this.packageLineItems); - }, - // TODO - packageLineItems() { - return this.vaps; - }, - // TODO finish - servicePackageRemovable() { - // If valid package level then false - // otherwise true - return false; - }, - // TODO finish - isValidPackageLevel() { - const availablePackages = getAvailablePackages( - // TODO what is glass to replace - this.glassToReplace, - // TODO what are available line items - this.availableLineItems, - this.isRepair - ); - availablePackages.find((servicePackage) => servicePackage.forEach() === this.vaps); - - return false; + return getPriceOfLineItems(this.vapsInOrder); }, amountDueLabel() { return this.getCmsContent(this.widget.amountDue, widgetFields.TEXT_BLOCK_WIDGET.TEXT); @@ -360,16 +296,33 @@ export default { salesTaxLabel() { return this.getCmsContent(this.widget.salesTax, widgetFields.TEXT_BLOCK_WIDGET.TEXT); }, + // TODO confirm what happens when servicePackageNames is null with test + servicePackageNames() { + return this.getCmsContent( + this.widget.servicePackage, + widgetFields.INPUT_QUESTION_WIDGET.ANSWERS + ); + }, + servicePackageLabelWidget() { + if (!this.servicePackageNames) { + console.log('no service package names'); + return ''; + } + const currentPackage = this.servicePackageNames + ?.find((entry) => entry.Name === this.servicePackageTier); + + return currentPackage.SubWidgetName ?? ''; + }, recycleFeeCartItem() { return this.getCartItem( this.getCmsContent(this.widget.recycleFee, widgetFields.TEXT_BLOCK_WIDGET.TEXT), - useMainStore().order.lineItems.supportingItems.find((lineItem) => lineItem.partType === partTypeStrings.REPLACE_FEE) + [useMainStore().lineItems.supportingItems.find((lineItem) => lineItem.partType === partTypeStrings.REPLACE_FEE)] ); }, mobileFeeCartItem() { return this.getCartItem( this.getCmsContent(this.widget.mobileFee, widgetFields.TEXT_BLOCK_WIDGET.TEXT), - useMainStore().order.lineItems.mobileFee + [useMainStore().lineItems.mobileFee] ); } }, @@ -386,18 +339,33 @@ export default { : formatAmountInDollars(amount); }, formatAmountInDollars, - getCartItem(label, lineItem) { + getCartItem(label, lineItems) { let cartItem = null; - if (lineItem) { + if (lineItems) { cartItem = { name: label, - subTotal: this.getTotalLineItemPrice(lineItem, false), - salesTax: lineItem.salesTax ?? 0 + subTotal: getPriceOfLineItems(lineItems), + salesTax: lineItems.salesTax ?? 0 }; } return cartItem; + }, + removeItem() { + // TODO in later ticket + }, + getCmsContentForVapsType(vapsType) { + // TODO make strings constants + const vapsItemDescriptions = this.getCmsContent('VapsItemDescriptions', 'Answers'); + + if (!vapsItemDescriptions) { + return ''; + } + + const vapsTypeName = vapsItemDescriptions.find((entry) => entry.Name === vapsType); + + return vapsTypeName.Text; } } }; @@ -407,6 +375,10 @@ export default {