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

Tint mapper changes

Browse source
This commit is contained in:
FrankRua 2022-02-24 15:59:25 -05:00
parent d17f214967
commit 2386153061
3 changed files with 52 additions and 81 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

48
src/constants/tint-mapper.js
View file

@ -5,25 +5,25 @@
const tintMap = {
other: [
// Blue Shade
{ name: "blue shade, blue tint", src: "Glass-BlueShade-BlueTint.svg" },
{ name: "blue shade, brown tint", src: "Glass-BlueShade-BrownTint.svg" },
{ name: "blue shade, gray tint", src: "Glass-BlueShade-GrayTint.svg" },
{ name: "blue shade, green tint", src: "Glass-BlueShade-GreenTint.svg" },
{ name: "blue tint, blue shade", src: "Glass-BlueShade-BlueTint.svg" },
{ name: "brown tint, blue shade", src: "Glass-BlueShade-BrownTint.svg" },
{ name: "gray tint, blue shade", src: "Glass-BlueShade-GrayTint.svg" },
{ name: "green tint, blue shade", src: "Glass-BlueShade-GreenTint.svg" },
{ name: "blue shade", src: "Glass-BlueShade-NoTint.svg" },
// Brown Shade
{ name: "brown shade, brown tint", src: "Glass-BrownShade-BrownTint.svg" },
{ name: "brown tint, brown shade", src: "Glass-BrownShade-BrownTint.svg" },
// Gray Shade
{ name: "gray shade, blue tint", src: "Glass-GrayShade-BlueTint.svg" },
{ name: "gray shade, brown tint", src: "Glass-GrayShade-BrownTint.svg" },
{ name: "gray shade, gray tint", src: "Glass-GrayShade-GrayTint.svg" },
{ name: "gray shade, green tint", src: "Glass-GrayShade-GreenTint.svg" },
{ name: "blue tint, gray shade", src: "Glass-GrayShade-BlueTint.svg" },
{ name: "brown tint, gray shade", src: "Glass-GrayShade-BrownTint.svg" },
{ name: "gray tint, gray shade", src: "Glass-GrayShade-GrayTint.svg" },
{ name: "green tint, gray shade", src: "Glass-GrayShade-GreenTint.svg" },
// Green Shade
{ name: "green shade, blue tint", src: "Glass-GreenShade-BlueTint.svg" },
{ name: "green shade, brown tint", src: "Glass-GreenShade-BrownTint.svg" },
{ name: "green shade, green tint", src: "Glass-GreenShade-GreenTint.svg" },
{ name: "blue tint, green shade", src: "Glass-GreenShade-BlueTint.svg" },
{ name: "brown tint, green shade", src: "Glass-GreenShade-BrownTint.svg" },
{ name: "green tint, green shade", src: "Glass-GreenShade-GreenTint.svg" },
// Tints Only
{ name: "blue tint", src: "Glass-NoShade-BlueTint.svg" },
@ -40,25 +40,25 @@ const tintMap = {
windshield: [
// Blue Shade
{ name: "blue shade, blue tint", src: "Windshield-BlueShade-BlueTint.svg" },
{ name: "blue shade, brown tint", src: "Windshield-BlueShade-BrownTint.svg" },
{ name: "blue shade, gray tint", src: "Windshield-BlueShade-GrayTint.svg" },
{ name: "blue shade, green tint", src: "Windshield-BlueShade-GreenTint.svg" },
{ name: "blue tint, blue shade", src: "Windshield-BlueShade-BlueTint.svg" },
{ name: "brown tint, blue shade", src: "Windshield-BlueShade-BrownTint.svg" },
{ name: "gray tint, blue shade", src: "Windshield-BlueShade-GrayTint.svg" },
{ name: "green tint, blue shade", src: "Windshield-BlueShade-GreenTint.svg" },
{ name: "blue shade", src: "Windshield-BlueShade-NoTint.svg" },
// Brown Shade
{ name: "brown shade, brown tint", src: "Windshield-BrownShade-BrownTint.svg" },
{ name: "brown tint, brown shade", src: "Windshield-BrownShade-BrownTint.svg" },
// Gray Shade
{ name: "gray shade, blue tint", src: "Windshield-GrayShade-BlueTint.svg" },
{ name: "gray shade, brown tint", src: "Windshield-GrayShade-BrownTint.svg" },
{ name: "gray shade, gray tint", src: "Windshield-GrayShade-GrayTint.svg" },
{ name: "gray shade, green tint", src: "Windshield-GrayShade-GreenTint.svg" },
{ name: "blue tint, gray shade", src: "Windshield-GrayShade-BlueTint.svg" },
{ name: "brown tint, gray shade", src: "Windshield-GrayShade-BrownTint.svg" },
{ name: "gray tint, gray shade", src: "Windshield-GrayShade-GrayTint.svg" },
{ name: "green tint, gray shade", src: "Windshield-GrayShade-GreenTint.svg" },
// Green Shade
{ name: "green shade, blue tint", src: "Windshield-GreenShade-BlueTint.svg" },
{ name: "green shade, brown tint", src: "Windshield-GreenShade-BrownTint.svg" },
{ name: "green shade, green tint", src: "Windshield-GreenShade-GreenTint.svg" },
{ name: "blue tint, green shade", src: "Windshield-GreenShade-BlueTint.svg" },
{ name: "brown tint, green shade", src: "Windshield-GreenShade-BrownTint.svg" },
{ name: "green tint, green shade", src: "Windshield-GreenShade-GreenTint.svg" },
// Tints Only
{ name: "blue tint", src: "Windshield-NoShade-BlueTint.svg" },

2
src/layouts/vehicle-damage/vehicle-damage.vue
View file

@ -145,7 +145,7 @@ export default {
const partsData = await baseMixin.methods.dispatchNonBlockingStoreAction(this.storeActions.GET_PARTS_OR_QUESTIONS,
{ carId: this.$store.getters.vehicle.carId, glassArray: this.selectedGlassToReplace()}, false);
this.$router.navigateAfterSave(this.navigationScenarios.SELECTED_GLASS_MULTIPLE_PARTS, this.$route, { [routerParameterKeys.VEHICLE_PARTS_DATA]: partsData});
this.$router.navigateAfterSave(this.navigationScenarios.SELECTED_GLASS_MULTIPLE_PARTS, this.$route, {}, { [routerParameterKeys.VEHICLE_PARTS_DATA]: JSON.stringify(partsData.data)});
},
selectedGlassToReplace() {

83
src/layouts/vehicle-parts/vehicle-parts.vue
View file

@ -1,27 +1,38 @@
<template>
<div class="container-fluid shadow rounded-3 p-2 position-relative make-tall">
<div class="container-fluid shadow rounded-3 p-2 position-relative make-tall">
<funnelHeader ref="funnelHeader" />
<vehicleBanner ref="vehicleBanner" :displayGenericVehicleImage="false" />
<funnelSubHeader ref="funnelSubHeader" />
<div class="container-fluid prevent-squish my-5">
<div class="row">
<div class="col">
<alert class="rounded border-0 shadow-sm" alertClass="alert-warning" :alertHeadline="alertWidgetData.headline" :alertCopy="alertWidgetData.copy" :isDismissible="false" />
</div>
<div class="row">
<div class="col">
<alert
class="rounded border-0 shadow-sm"
alertClass="alert-warning"
:alertHeadline="alertWidgetData.headline"
:alertCopy="alertWidgetData.copy"
:isDismissible="false"
/>
</div>
</div>
</div>
<div v-for="(item, i) in Parts" :key="i">
<!-- Render horizontal lines if there is multi-glass (aka if i > 0) -->
<div class="container-fluid">
<hr v-if="i > 0" />
</div>
<!-- Render horizontal lines if there is multi-glass (aka if i > 0) -->
<div class="container-fluid">
<hr v-if="i > 0">
</div>
<partQuestion :ref="`${refPrefix}-${item.glassLocation}`" v-model="glassParts[item.glassLocation + '-' + item.glassName]" :glassLocation="item.glassLocation" :glassName="item.glassName" :colorAnswers="item.colorAnswers" />
<partQuestion
:ref="`${refPrefix}-${item.glassLocation}`"
v-model="glassParts[item.glassLocation + '-' + item.glassName]"
:glassLocation="item.glassLocation"
:glassName="item.glassName"
:colorAnswers="item.colorAnswers"
/>
</div>
<funnelFooter ref="funnelFooter" @back-clicked="backButtonAction" />
</div>
</div>
</template>
<script>
@ -34,12 +45,9 @@ import funnelFooter from "@/common-components/funnel-footer/funnel-footer";
import alert from "@/ux-components/alert/alert";
// Supporting Files
import {
fetchCmsContentForPage
} from "@/helpers/cms-content-helper";
import {
settleAllPromises
} from "@/helpers/layout-helper";
import {fetchCmsContentForPage} from "@/helpers/cms-content-helper";
import { settleAllPromises} from "@/helpers/layout-helper";
import { routerParameterKeys } from "@/router/router-constants/router-parameter-keys";
export default {
name: "vehicle-parts",
@ -106,44 +114,7 @@ export default {
},
computed: {
Parts() {
const partsData = {
"partsOrQuestions": [{
"glassName": "Front",
"glassLocation": "Driver",
"parts": [{
"partNumber": "FD27736GTYN",
"description": "solar, driver side, front",
"color": "Green Tint",
"requiresRecalibration": false,
"requiresCapabilityQuestions": false,
"childParts": null
},
{
"partNumber": "FD27738GTYN",
"description": "solar, driver side, front, laminated, soundproofing",
"color": "Green Tint",
"requiresRecalibration": false,
"requiresCapabilityQuestions": false,
"childParts": null
}
],
"partQuestions": null
},
{
"glassName": "Back",
"glassLocation": "Passenger",
"parts": [{
"partNumber": "FD27739YPYN",
"description": "solar, passenger side, rear",
"color": "Gray Tint Privacy",
"requiresRecalibration": false,
"requiresCapabilityQuestions": false,
"childParts": null
}],
"partQuestions": null
}
]
}
const partsData = JSON.parse(this.$route.params[routerParameterKeys.VEHICLE_PARTS_DATA]);
// Map API result data, to vehicle-parts data structure
const mappedData = partsData.partsOrQuestions.map(g => {