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

Merge pull request #1493 from Safelite/CSR-1396-recycling-fee-modal

Browse source 
CSR-1396 add recycle modal to cart page.
This commit is contained in:
bmauger 2023-11-06 17:02:24 -05:00 committed by GitHub
commit 9be8662ed5
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 20 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -53,7 +53,7 @@
linkType="text" linkType="text"
:text="recycleFeeCartItem.name" :text="recycleFeeCartItem.name"
href="#!" href="#!"
@click-event="openModal(recyclingModal)" /> @click-event="openModal(recyclingModalCmsWidgetName)" />
<span>{{ currencyFormatter.format(recycleFeeCartItem.subTotal) }}</span> <span>{{ currencyFormatter.format(recycleFeeCartItem.subTotal) }}</span>
</div> </div>
<div v-if="mobileFeeCartItem"> <div v-if="mobileFeeCartItem">
@ -95,6 +95,9 @@
</div> </div>
</div> </div>
</div> </div>
<contentGroupModal ref="RecycleModal" cmsWidgetName="RecycleModal">
<textBlock cmsWidgetName="RecycleTextBlock" />
</contentGroupModal>
</div> </div>
</template> </template>
@ -102,6 +105,7 @@
// Components // Components
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";
// Mixins // Mixins
import baseMixin from "@/mixins/base-mixin.js"; import baseMixin from "@/mixins/base-mixin.js";
@ -122,6 +126,7 @@ export default {
damage: Object, damage: Object,
servicePackageOptionsCmsName: String, servicePackageOptionsCmsName: String,
availableLineItems: Object, availableLineItems: Object,
recyclingModalCmsWidgetName: String,
}, },
data() { data() {
return { return {
@ -135,6 +140,9 @@ export default {
}; };
}, },
methods: { methods: {
openModal(modalName) {
this.$refs[modalName].openModal();
},
toggleClass: function (event) { toggleClass: function (event) {
this.isActive = !this.isActive; this.isActive = !this.isActive;
}, },
@ -668,6 +676,7 @@ export default {
components: { components: {
textBlock, textBlock,
textLink, textLink,
contentGroupModal,
}, },
}; };
</script> </script>
@ -678,6 +687,12 @@ export default {
border-bottom: 1px solid $gray-500; border-bottom: 1px solid $gray-500;
color: $black; color: $black;
} }
.modal-body {
h5 {
text-align: center;
border-bottom: none;
}
}
.border-bottom { .border-bottom {
color: $gray; color: $gray;
} }
@ -751,6 +766,7 @@ export default {
} }
a { a {
order: 3; order: 3;
margin-right: 100%;
} }
} }
} }

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

@ -1,7 +1,7 @@
<template> <template>
<Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm" v-slot="{ meta }"> <Form @submit="onSubmit" @invalid-submit="onInvalidSubmit" ref="theForm" v-slot="{ meta }">
<loadingModal notFullScreen ref="loadingModal" /> <loadingModal notFullScreen ref="loadingModal" />
<div class="container-fluid page-container-grouped-styles"> <div class="container-fluid">
<div class="row"> <div class="row">
<div class="col"> <div class="col">
<funnelHeader cmsWidgetName="FunnelHeaderWidget" ref="funnelHeader" /> <funnelHeader cmsWidgetName="FunnelHeaderWidget" ref="funnelHeader" />
@ -26,7 +26,8 @@
:availableLineItems="availableLineItems" :availableLineItems="availableLineItems"
v-model="lineItems" v-model="lineItems"
servicePackageOptionsCmsName="ServicePackageTitle" servicePackageOptionsCmsName="ServicePackageTitle"
@cart-remove="cartRemove" /> @cart-remove="cartRemove"
recyclingModalCmsWidgetName="RecycleModal" />
<hr /> <hr />