Merge pull request #682 from Safelite/SSR-1201-QA-updates

SSR-1201 misc alignment and spacing fixes.
This commit is contained in:
bmauger 2024-05-03 11:49:22 -04:00 committed by GitHub
commit 857ef7db31
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 40 additions and 44 deletions

View file

@ -32,7 +32,8 @@
:allowPageInteraction="true" /> :allowPageInteraction="true" />
<div <div
v-else v-else
id="availabilityIndicator"> id="availabilityIndicator"
class="d-flex align-items-center">
<div <div
id="availabilityBadge" id="availabilityBadge"
class="availability-badge" class="availability-badge"

View file

@ -18,7 +18,7 @@
class="subheader-secondary d-flex align-items-center overflow-hidden" class="subheader-secondary d-flex align-items-center overflow-hidden"
:class="[justifySubheader, subHeaderClasses]"> :class="[justifySubheader, subHeaderClasses]">
<p <p
class="fw-normal mb-0" class="fw-normal"
:class="[alternateFormatting, subTextClasses]"> :class="[alternateFormatting, subTextClasses]">
<span v-html="subText"> </span> <span v-html="subText"> </span>
</p> </p>
@ -33,7 +33,7 @@ import {
splitCopyOnCMSPlaceHolder, splitCopyOnCMSPlaceHolder,
getRouterLinkRouteFromCopy, getRouterLinkRouteFromCopy,
getRouterLinkDisplayTextFromCopy, getRouterLinkDisplayTextFromCopy,
getRouterLinkHtmlStringFromCopy, getRouterLinkHtmlStringFromCopy
} from '@/helpers/cms-content-helper'; } from '@/helpers/cms-content-helper';
import { stripRteStyle } from '@/helpers/text-helper'; import { stripRteStyle } from '@/helpers/text-helper';
@ -51,7 +51,7 @@ export default {
stripRteStyle: Boolean, stripRteStyle: Boolean,
subContentProperty: String, subContentProperty: String,
subHeaderClasses: String, subHeaderClasses: String,
subTextClasses: String, subTextClasses: String
}, },
emits: ['click-event'], emits: ['click-event'],
computed: { computed: {
@ -103,10 +103,10 @@ export default {
alternateFormatting() { alternateFormatting() {
// override for service-packages unique style // override for service-packages unique style
if (this.issContainingPage?.toLowerCase() === 'service-packages') { if (this.issContainingPage?.toLowerCase() === 'service-packages') {
return 'service-packages-subtext mt-4 mb-4 px-5'; return 'service-packages-subtext my-4';
} }
return this.darkGraySubText ? 'dark-gray' : 'light-gray'; return this.darkGraySubText ? 'dark-gray' : 'light-gray';
}, }
}, },
methods: { methods: {
doesCopyContainRouterLink, doesCopyContainRouterLink,
@ -116,8 +116,8 @@ export default {
getRouterLinkHtmlStringFromCopy, getRouterLinkHtmlStringFromCopy,
clickEvent() { clickEvent() {
this.$emit('click-event'); this.$emit('click-event');
}, }
}, }
}; };
</script> </script>

View file

@ -13,6 +13,7 @@
<div class="row justify-content-center"> <div class="row justify-content-center">
<div class="col-md-6 col-xl-4"> <div class="col-md-6 col-xl-4">
<siteSubHeader <siteSubHeader
justification="left"
cmsWidgetName="SiteSubHeaderWidget" cmsWidgetName="SiteSubHeaderWidget"
issContainingPage="service-packages" /> issContainingPage="service-packages" />
<servicePackageQuestion <servicePackageQuestion
@ -34,7 +35,9 @@
@ForwardClicked="forwardButtonAction" /> @ForwardClicked="forwardButtonAction" />
</div> </div>
</div> </div>
<loadingModal ref="loadingModal" :textSlides="loadingText" /> <loadingModal
ref="loadingModal"
:textSlides="loadingText" />
<contentGroupModal <contentGroupModal
ref="RainDefenseModal" ref="RainDefenseModal"
cmsWidgetName="RainDefenseModal" /> cmsWidgetName="RainDefenseModal" />
@ -44,7 +47,9 @@
<contentGroupModal <contentGroupModal
ref="RearWiperModal" ref="RearWiperModal"
cmsWidgetName="RearWiperModal" /> cmsWidgetName="RearWiperModal" />
<contentGroupModal ref="RecalModal" cmsWidgetName="RecalModal" /> <contentGroupModal
ref="RecalModal"
cmsWidgetName="RecalModal" />
</div> </div>
</Form> </Form>
</template> </template>
@ -80,7 +85,7 @@ export default {
Form, Form,
servicePackageQuestion, servicePackageQuestion,
loadingModal, loadingModal,
contentGroupModal, contentGroupModal
}, },
mixins: [baseFormMixin], mixins: [baseFormMixin],
async beforeRouteEnter(to, from, next) { async beforeRouteEnter(to, from, next) {
@ -93,20 +98,20 @@ export default {
const promiseResultMap = [ const promiseResultMap = [
{ {
resultKey: 'cmsContent', resultKey: 'cmsContent',
promise: cmsContentPromise, promise: cmsContentPromise
}, },
{ {
resultKey: 'wipers', resultKey: 'wipers',
promise: wipersPromise, promise: wipersPromise
}, },
{ {
resultKey: 'rainDefense', resultKey: 'rainDefense',
promise: rainDefensePromise, promise: rainDefensePromise
}, },
{ {
resultKey: 'supportingItems', resultKey: 'supportingItems',
promise: supportingItemsPromise, promise: supportingItemsPromise
}, }
]; ];
const resultMap = await settleAllPromises(promiseResultMap); const resultMap = await settleAllPromises(promiseResultMap);
@ -117,19 +122,17 @@ export default {
resultMap.rainDefense, resultMap.rainDefense,
...resultMap.supportingItems, ...resultMap.supportingItems,
...resultMap.wipers, ...resultMap.wipers,
...clonedGlassParts, ...clonedGlassParts
]; ];
let hasBailedOut = false; let hasBailedOut = false;
const pricingResults = await store const pricingResults = await store
.getPriceOrderItems(availableLineItems) .getPriceOrderItems(availableLineItems)
.catch((err) => { .catch((err) => {
useMainStore().setBailout( useMainStore().setBailout(bailoutMessage.pricingResponseError(
bailoutMessage.pricingResponseError( availableLineItems.map((li) => li.partNumber),
availableLineItems.map((li) => li.partNumber), { code: err.code, message: err.message, data: err.data }
{ code: err.code, message: err.message, data: err.data } ));
)
);
hasBailedOut = true; hasBailedOut = true;
next(`/?issPage=${issPageValues.BAILOUT_PAGE}`); next(`/?issPage=${issPageValues.BAILOUT_PAGE}`);
}); });
@ -155,17 +158,17 @@ export default {
'Looking for dates', 'Looking for dates',
'Searching for times', 'Searching for times',
'Nearly there', 'Nearly there',
'Finishing up', 'Finishing up'
], ],
rules: { rules: {
optionRequired: globalRules.OPTION_REQUIRED, optionRequired: globalRules.OPTION_REQUIRED
}, }
}; };
}, },
computed: { computed: {
PriceDisclaimerText() { PriceDisclaimerText() {
return this.getCmsContent('PriceDisclaimerWidget', 'Text'); return this.getCmsContent('PriceDisclaimerWidget', 'Text');
}, }
}, },
methods: { methods: {
openModalAction(modalName) { openModalAction(modalName) {
@ -173,11 +176,11 @@ export default {
}, },
arePagePrerequisitesValid() { arePagePrerequisitesValid() {
return ( return (
store.order.serviceLocation.zipCode && store.order.serviceLocation.zipCode
store.order.serviceLocation.zipCodeCtu && && store.order.serviceLocation.zipCodeCtu
(store.order.damage.isRepair || && (store.order.damage.isRepair
(store.order.lineItems?.glassParts != null && || (store.order.lineItems?.glassParts != null
store.order.lineItems.glassParts.length > 0)) && store.order.lineItems.glassParts.length > 0))
); );
}, },
vapsItemsSelectedAction(vapsItemsSelected) { vapsItemsSelectedAction(vapsItemsSelected) {
@ -187,12 +190,10 @@ export default {
const parts = { const parts = {
glassParts: this.pricedGlassParts, glassParts: this.pricedGlassParts,
supportingItems: this.supportingItems, supportingItems: this.supportingItems,
vaps: this.selectedVaps, vaps: this.selectedVaps
}; };
if (!allGlassPartsAndItemsHavePrices(parts)) { if (!allGlassPartsAndItemsHavePrices(parts)) {
window.console.error( window.console.error('One or more items have no price assigned!');
'One or more items have no price assigned!'
);
} }
if (this.pricedGlassParts.length > 0) { if (this.pricedGlassParts.length > 0) {
store.updateGlassParts(this.pricedGlassParts); store.updateGlassParts(this.pricedGlassParts);
@ -204,8 +205,8 @@ export default {
this.navigationScenarios.CLICKED_FORWARD, this.navigationScenarios.CLICKED_FORWARD,
this.$route this.$route
); );
}, }
}, }
}; };
</script> </script>

View file

@ -522,12 +522,6 @@ export default {
flex: 0 auto; flex: 0 auto;
} }
} }
.damage-location-question {
span {
font-size: 1.25rem;
font-weight: 400;
}
}
.button-question, .button-question,
.windshield-damage-type-question, .windshield-damage-type-question,
.damage-location-question { .damage-location-question {