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

move alert from bottom of page

Browse source
This commit is contained in:
Kroell 2023-01-31 14:04:46 -05:00
parent c195cd9778
commit d2c09c6be3
1 changed files with 48 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

65
src/layouts/address-vehicles/address-vehicles.vue
View file

@ -20,7 +20,18 @@
:manualHeadline="AlertFoundMultipleVehiclesHeader" :manualHeadline="AlertFoundMultipleVehiclesHeader"
manualCopy="" manualCopy=""
v-bind:isDismissible="false" v-bind:isDismissible="false"
id="multiple-vehicles-alert" id="address-vehicles-alert"
/>
<alert
cmsWidgetName="FoundWindshield"
ref="alertFoundWindshield"
class="my-4"
alertClass="alert-warning"
:manualHeadline="AlertFoundWindshieldHeader"
:manualCopy="AlertFoundWindshieldBody"
v-if="isCarIdDifferent"
v-bind:isDismissible="false"
id="address-vehicles-alert"
/> />
<addressVehiclesQuestion <addressVehiclesQuestion
ref="addressVehiclesQuestion" ref="addressVehiclesQuestion"
@ -28,7 +39,6 @@
:vehicles="VehiclesForQuestions" :vehicles="VehiclesForQuestions"
validationRules="vehicle-required" validationRules="vehicle-required"
v-model="selectedVehicleVin" v-model="selectedVehicleVin"
:isCarIdDifferent="isCarIdDifferent"
/> />
<div <div
class="alert-provide-vin my-3" class="alert-provide-vin my-3"
@ -67,7 +77,10 @@ import { issPageValues } from "@/router/router-constants/issPage-values";
import { errorMessages } from "@/constants/error-messages"; import { errorMessages } from "@/constants/error-messages";
import { required } from "@/helpers/validation-rules"; import { required } from "@/helpers/validation-rules";
import { Form, defineRule } from "vee-validate"; import { Form, defineRule } from "vee-validate";
import { isGlassAvailableForCarId } from "@/helpers/damage-helper"; import {
getDamageString,
isGlassAvailableForCarId,
} from "@/helpers/damage-helper";
import { import {
doesCopyContainRouterLink, doesCopyContainRouterLink,
splitCopyOnCMSPlaceHolder, splitCopyOnCMSPlaceHolder,
@ -129,6 +142,22 @@ export default {
"HeadlineText" "HeadlineText"
).replaceAll("{custom:vehicleCount}", this.vehicleCount); ).replaceAll("{custom:vehicleCount}", this.vehicleCount);
}, },
AlertFoundWindshieldHeader() {
return this.getCmsContent("FoundWindshield", "HeadlineText").replaceAll(
"{custom:damage}",
getDamageString()
);
},
AlertFoundWindshieldBody() {
return this.getCmsContent(
"FoundWindshield",
"BodyText"
)
.replaceAll("{custom:damage}", getDamageString())
.replaceAll("{custom:vinlookupYear}", this.selectedVehicle.vehicle.year)
.replaceAll("{custom:vinlookupMake}", this.selectedVehicle.vehicle.make)
.replaceAll("{custom:vinlookupModel}", this.selectedVehicle.vehicle.model)
},
AlertProvideVinBody() { AlertProvideVinBody() {
return this.getCmsContent("ProvideVinAlert", "BodyText"); return this.getCmsContent("ProvideVinAlert", "BodyText");
}, },
@ -181,18 +210,19 @@ export default {
this.$router.navigate(this.navigationScenarios.CLICKED_BACK, this.$route); this.$router.navigate(this.navigationScenarios.CLICKED_BACK, this.$route);
}, },
async forwardButtonAction() { async forwardButtonAction() {
const vinLookup = await useMainStore().lookupVehicleByVin( const vinLookup = await useMainStore()
this.selectedVehicle.vin, .lookupVehicleByVin(this.selectedVehicle.vin)
).catch(() => { .catch(() => {
this.$refs.siteFooter.removeLoader(); this.$refs.siteFooter.removeLoader();
}); });
if (!vinLookup) { if (!vinLookup) {
return; return;
} }
this.isSelectedGlassAvailableForVehicle = await isGlassAvailableForCarId( this.isSelectedGlassAvailableForVehicle = await isGlassAvailableForCarId(
vinLookup.data.carId vinLookup.data.carId
); );
await useMainStore().saveVin({ await useMainStore().saveVin(
{
vehicleInfo: Object.assign(this.selectedVehicle.vehicle, { vehicleInfo: Object.assign(this.selectedVehicle.vehicle, {
vin: this.selectedVehicle.vin, vin: this.selectedVehicle.vin,
}), }),
@ -212,7 +242,7 @@ export default {
this.navigationScenarios.SELECTED_VIN_WITH_MISMATCHED_GLASS, this.navigationScenarios.SELECTED_VIN_WITH_MISMATCHED_GLASS,
this.$route, this.$route,
{}, {},
{ [routerParams.DISPLAY_VEHICLE_CHANGE_ALERT]: true }, { [routerParams.DISPLAY_VEHICLE_CHANGE_ALERT]: true }
); );
} else { } else {
await this.navigateForwardWithSingleCarMatch(); await this.navigateForwardWithSingleCarMatch();
@ -252,16 +282,15 @@ export default {
<style lang="scss"> <style lang="scss">
.alert-provide-vin { .alert-provide-vin {
font-size: 0.875rem; font-size: 0.875rem;
line-height: 1.4; line-height: 1.4;
margin-bottom: 0 !important; // Overrides extra margin-bottom on alert body a {
a { text-underline-offset: 4px; //Per Devyn. This can't be documented in Figma so there is a comment with the Prototype mocks on the Quote page in Figma
text-underline-offset: 4px; //Per Devyn. This can't be documented in Figma so there is a comment with the Prototype mocks on the Quote page in Figma line-height: inherit;
line-height: inherit; }
}
} }
#multiple-vehicles-alert p { #address-vehicles-alert p {
margin-bottom: 0 !important; // Overrides extra margin-bottom on alert body margin-bottom: 0 !important; // Overrides extra margin-bottom on alert body
} }
</style> </style>