jason/DigitalConsumer.FixMyGlass
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #1744 from Safelite/feature/CSR-1952-revert

Browse source 
CSR-1952 revert
This commit is contained in:
CarlNation 2024-02-12 15:47:52 -05:00 committed by GitHub
commit c42d49e8d3
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 82 additions and 123 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

195
src/fmg-components/cart/cart.vue
View file

@ -13,101 +13,78 @@
<span class="label amount-due">{{ getFormattedAmount("", amountDue) }}</span> <span class="label amount-due">{{ getFormattedAmount("", amountDue) }}</span>
</a> </a>
</div> </div>
<div class="cart-panel"> <div class="price-table">
<div class="price-table"> <div class="service-type">
<div class="service-type"> <textBlock :cmsWidgetName="servicePackageTitleWidget" />
<textBlock :cmsWidgetName="servicePackageTitleWidget" /> <span>
<span> {{ getFormattedAmount("", packagePrice) }}
{{ getFormattedAmount("", packagePrice) }} </span>
</span> </div>
</div>
<!-- Packaged Cart Items -->
<!-- Packaged Cart Items --> <div v-for="(cartItem, i) in packageCartItems" :key="i" class="packaged-cart-item">
<div <span>{{ cartItem.name }}</span>
v-for="(cartItem, i) in packageCartItems" <textLink
:key="i" v-if="allowItemRemoval"
class="packaged-cart-item"> ref="removeLink"
<span linkType="text"
><span v-if="cartItem.category === 'promos'">&lt;</span :text="removeLinkText"
>{{ cartItem.name href="javascript:void(0)"
}}<span v-if="cartItem.category === 'promos'">&gt;</span></span @click-event="removeItem(cartItem.cartItemType, cartItem.category)">
> <template v-slot:after-text>
<textLink <span class="sr-only">{{ cartItem.name }}</span>
v-if="allowItemRemoval" </template>
ref="removeLink" </textLink>
linkType="text" </div>
:text="removeLinkText"
href="javascript:void(0)" <!-- Nonpackaged Cart Items -->
@click-event="removeItem(cartItem.cartItemType, cartItem.category)"> <div
<template v-slot:after-text> v-for="(cartItem, i) in nonpackageCartItems"
<span class="sr-only">{{ cartItem.name }}</span> :key="i"
</template> class="non-packaged-cart-item"
</textLink> :class="[
</div> i % 2 == 0 ? 'even' : 'odd',
cartItem.isRemovable ? 'removable-cart-item' : '',
<!-- Nonpackaged Cart Items --> ]">
<div <span v-if="cartItem != recycleFeeCartItem">{{ cartItem.name }}</span>
v-for="(cartItem, i) in nonpackageCartItems" <textLink
:key="i" v-if="allowItemRemoval && cartItem.isRemovable"
class="non-packaged-cart-item" ref="removeLink"
:class="[ linkType="text"
i % 2 == 0 ? 'even' : 'odd', :text="removeLinkText"
cartItem.isRemovable ? 'removable-cart-item' : '', href="javascript:void(0)"
]"> @click-event="removeItem(cartItem.cartItemType, cartItem.category)" />
<span v-if="cartItem != recycleFeeCartItem">{{ cartItem.name }}</span> <textLink
<textLink v-else-if="cartItem == recycleFeeCartItem && recyclingModalCmsWidgetName"
v-if="allowItemRemoval && cartItem.isRemovable" linkType="text"
ref="removeLink" :text="recycleFeeCartItem.name"
linkType="text" href="javascript:void(0)"
:text="removeLinkText" @click-event="openModal(recyclingModalCmsWidgetName)" />
href="javascript:void(0)" <span v-else-if="cartItem == recycleFeeCartItem">
@click-event="removeItem(cartItem.cartItemType, cartItem.category)" /> {{ recycleFeeCartItem.name }}
<textLink </span>
v-else-if=" <span>{{ getFormattedAmount(cartItem.category, cartItem.subTotal) }}</span>
cartItem == recycleFeeCartItem && recyclingModalCmsWidgetName </div>
"
linkType="text" <!-- Sub total, sales tax, total columns -->
:text="recycleFeeCartItem.name" <div class="sub-total">
href="javascript:void(0)" <span>{{ subtotalText }}</span
@click-event="openModal(recyclingModalCmsWidgetName)" /> ><span>{{ getFormattedAmount("", subTotal) }}</span>
<span v-else-if="cartItem == recycleFeeCartItem"> </div>
{{ recycleFeeCartItem.name }} <div class="sales-tax">
</span> <span>{{ salesTaxText }}</span
<span>{{ getFormattedAmount(cartItem.category, cartItem.subTotal) }}</span> ><span>{{ getFormattedAmount("", salesTax) }}</span>
</div> </div>
<div v-if="showAsPaid" class="amount-paid">
<!-- Sub total, sales tax, total columns --> <span>{{ amountPaidText }}</span
<div class="sub-total"> ><span>{{ getFormattedAmount("", amountPaid) }}</span>
<span>{{ subtotalText }}</span </div>
><span>{{ getFormattedAmount("", subTotal) }}</span> <div class="amount-due">
</div> <span>{{ amountDueText }}</span
<div class="sales-tax"> ><span>{{ getFormattedAmount("", amountDue) }}</span>
<span>{{ salesTaxText }}</span
><span>{{ getFormattedAmount("", salesTax) }}</span>
</div>
<div v-if="showAsPaid" class="amount-paid">
<span>{{ amountPaidText }}</span
><span>{{ getFormattedAmount("", amountPaid) }}</span>
</div>
<div class="amount-due">
<span>{{ amountDueText }}</span
><span>{{ getFormattedAmount("", amountDue) }}</span>
</div>
</div> </div>
<promoModalQuestion
ref="promoModalQuestion"
class="small mt-4"
v-model="lineItems"
:availableVaps="availableVaps"
modalWidgetName="PromoModalWidget" />
</div> </div>
</div> </div>
<div
class="my-2 lh-1 applied-promo"
v-for="(promoCode, i) in this.getPromoCodeList()"
:key="i">
<span class="caption">Promo code &lt;{{ promoCode }}&gt; applied </span>
</div>
<contentGroupModal ref="RecycleModal" cmsWidgetName="RecycleModal"> <contentGroupModal ref="RecycleModal" cmsWidgetName="RecycleModal">
<textBlock cmsWidgetName="RecycleTextBlock" /> <textBlock cmsWidgetName="RecycleTextBlock" />
</contentGroupModal> </contentGroupModal>
@ -119,7 +96,6 @@
import textLink from "@/ux-components/text-link/text-link"; import textLink from "@/ux-components/text-link/text-link";
import textBlock from "@/digital-components/text-block/text-block"; import textBlock from "@/digital-components/text-block/text-block";
import contentGroupModal from "@/fmg-components/content-group-modal/content-group-modal"; import contentGroupModal from "@/fmg-components/content-group-modal/content-group-modal";
import promoModalQuestion from "@/layouts/payment-method/promo-modal-question/promo-modal-question";
// Mixins // Mixins
import baseMixin from "@/mixins/base-mixin.js"; import baseMixin from "@/mixins/base-mixin.js";
@ -222,12 +198,6 @@ export default {
this.$emit("update:modelValue", this.lineItems); this.$emit("update:modelValue", this.lineItems);
}, },
getPromoCodeList() {
if (this.$refs["promoModalQuestion"]) {
return this.$refs["promoModalQuestion"].getPromoCodeList();
}
return [];
},
}, },
computed: { computed: {
screenReaderTotalAmountDueText() { screenReaderTotalAmountDueText() {
@ -826,23 +796,16 @@ export default {
}, },
deep: true, deep: true,
}, },
lineItems: {
handler(newValue) {
this.$emit("update:modelValue", this.lineItems);
},
deep: true,
},
}, },
components: { components: {
textBlock, textBlock,
textLink, textLink,
contentGroupModal, contentGroupModal,
promoModalQuestion,
}, },
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss">
.cart { .cart {
margin-bottom: 1rem; margin-bottom: 1rem;
@ -867,15 +830,12 @@ export default {
.amount-due { .amount-due {
color: $green; color: $green;
} }
.cart-panel { .price-table {
max-height: 0; max-height: 0;
transition: all 350ms ease-in; transition: all 350ms ease-in;
overflow: hidden; overflow: hidden;
visibility: hidden; visibility: hidden;
color: $gray-600; color: $gray-600;
}
.price-table {
div { div {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
@ -980,26 +940,17 @@ export default {
&.expanded:after { &.expanded:after {
transform: rotate(180deg); transform: rotate(180deg);
} }
&.expanded + .cart-panel { &.expanded + .price-table {
max-height: 650px; max-height: 650px;
transition: all 150ms ease-in; transition: all 150ms ease-in;
overflow: hidden; overflow: hidden;
padding: 1rem 0 0.5rem; padding-top: 1rem;
visibility: visible; visibility: visible;
} }
a { a {
text-decoration: none; text-decoration: none;
} }
} }
.applied-promo {
span {
color: $green-700;
font-weight: 500;
padding: 2px 8px;
background-color: $green-100;
border-radius: 12px;
}
}
} }
.payment-method-question { .payment-method-question {
.question-text { .question-text {

10
src/layouts/payment-method/payment-method.vue
View file

@ -29,7 +29,13 @@
servicePackageOptionsCmsName="ServicePackageTitle" servicePackageOptionsCmsName="ServicePackageTitle"
recyclingModalCmsWidgetName="RecycleModal" /> recyclingModalCmsWidgetName="RecycleModal" />
<hr class="mb-5" /> <promoModalQuestion
class="small mt-4"
v-model="lineItems"
:availableVaps="availableVaps"
modalWidgetName="PromoModalWidget" />
<hr class="my-5" />
<div> <div>
<alert <alert
@ -76,6 +82,7 @@ import paymentMethodQuestion from "@/layouts/payment-method/payment-method-quest
import loadingModal from "@/fmg-components/loading-modal/loading-modal.vue"; import loadingModal from "@/fmg-components/loading-modal/loading-modal.vue";
import cart from "@/fmg-components/cart/cart"; import cart from "@/fmg-components/cart/cart";
import reviewDropdown from "@/layouts/payment-method/review-dropdown/review-dropdown"; import reviewDropdown from "@/layouts/payment-method/review-dropdown/review-dropdown";
import promoModalQuestion from "@/layouts/payment-method/promo-modal-question/promo-modal-question";
import { submitWorkOrder } from "@/helpers/heritage-integration/order-helper.js"; import { submitWorkOrder } from "@/helpers/heritage-integration/order-helper.js";
import alert from "@/ux-components/alert/alert"; import alert from "@/ux-components/alert/alert";
@ -589,6 +596,7 @@ export default {
cart, cart,
alert, alert,
paymentMethodQuestion, paymentMethodQuestion,
promoModalQuestion,
reviewDropdown, reviewDropdown,
}, },
}; };