From b5cd51833021e28c5294a48b8b9e5953fe75423e Mon Sep 17 00:00:00 2001 From: FrankRua Date: Mon, 14 Feb 2022 16:39:17 -0500 Subject: [PATCH 01/35] init design for radio question data --- src/constants/tint-mapper.js | 76 +++++++++++++++ .../tints/BackGlass-BlueShade-BlueTint.svg | 18 ++++ .../tints/BackGlass-BlueShade-BrownTint.svg | 18 ++++ .../tints/BackGlass-BlueShade-GrayTint.svg | 19 ++++ .../tints/BackGlass-BlueShade-GreenTint.svg | 18 ++++ .../tints/BackGlass-BlueShade-NoTint.svg | 19 ++++ .../tints/BackGlass-BrownShade-BrownTint.svg | 18 ++++ .../tints/BackGlass-GrayShade-BlueTint.svg | 17 ++++ .../tints/BackGlass-GrayShade-BrownTint.svg | 17 ++++ .../tints/BackGlass-GrayShade-GrayTint.svg | 17 ++++ .../tints/BackGlass-GrayShade-GreenTint.svg | 17 ++++ .../tints/BackGlass-GreenShade-BlueTint.svg | 20 ++++ .../tints/BackGlass-GreenShade-BrownTint.svg | 18 ++++ .../tints/BackGlass-GreenShade-GreenTint.svg | 18 ++++ .../tints/BackGlass-NoShade-BlueTint.svg | 3 + .../tints/BackGlass-NoShade-BrownTint.svg | 3 + .../tints/BackGlass-NoShade-DarkBrownTint.svg | 3 + .../tints/BackGlass-NoShade-DaryGrayTint.svg | 3 + .../tints/BackGlass-NoShade-GrayTint.svg | 3 + .../tints/BackGlass-NoShade-GreenTint.svg | 3 + .../assets/tints/BackGlass-NoShade-NoTint.svg | 3 + .../tints/BackGlass-NoShade-Privacy.svg | 3 + .../tints/Windshield-BlueShade-BlueTint.svg | 18 ++++ .../tints/Windshield-BlueShade-BrownTint.svg | 18 ++++ .../tints/Windshield-BlueShade-GrayTint.svg | 19 ++++ .../tints/Windshield-BlueShade-GreenTint.svg | 17 ++++ .../tints/Windshield-BlueShade-NoTint.svg | 19 ++++ .../tints/Windshield-BrownShade-BrownTint.svg | 18 ++++ .../tints/Windshield-GrayShade-BlueTint.svg | 17 ++++ .../tints/Windshield-GrayShade-BrownTint.svg | 17 ++++ .../tints/Windshield-GrayShade-GrayTint.svg | 17 ++++ .../tints/Windshield-GrayShade-GreenTint.svg | 17 ++++ .../tints/Windshield-GreenShade-BlueTint.svg | 18 ++++ .../tints/Windshield-GreenShade-BrownTint.svg | 18 ++++ .../tints/Windshield-GreenShade-GreenTint.svg | 18 ++++ .../tints/Windshield-NoShade-BlueTint.svg | 3 + .../tints/Windshield-NoShade-BrownTint.svg | 3 + .../Windshield-NoShade-DarkBrownTint.svg | 3 + .../tints/Windshield-NoShade-DarkGrayTint.svg | 3 + .../tints/Windshield-NoShade-GrayTint.svg | 3 + .../tints/Windshield-NoShade-GreenTint.svg | 3 + .../tints/Windshield-NoShade-NoTint.svg | 3 + .../tints/Windshield-NoShade-Privacy.svg | 3 + .../part-question/part-question.vue | 65 +++++++++++++ src/layouts/vehicle-parts/response.json | 96 +++++++++++++++++++ src/layouts/vehicle-parts/vehicle-parts.vue | 44 +++++++++ 46 files changed, 794 insertions(+) create mode 100644 src/constants/tint-mapper.js create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-BlueTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-BrownTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-GrayTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-GreenTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-NoTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BrownShade-BrownTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-BlueTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-BrownTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-GrayTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-GreenTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-BlueTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-BrownTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-GreenTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-BlueTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-BrownTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-DarkBrownTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-DaryGrayTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-GrayTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-GreenTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-NoTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-Privacy.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-BlueTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-BrownTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-GrayTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-GreenTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-NoTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BrownShade-BrownTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-BlueTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-BrownTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-GrayTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-GreenTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-BlueTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-BrownTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-GreenTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-BlueTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-BrownTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-DarkBrownTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-DarkGrayTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-GrayTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-GreenTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-NoTint.svg create mode 100644 src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-Privacy.svg create mode 100644 src/layouts/vehicle-parts/part-question/part-question.vue create mode 100644 src/layouts/vehicle-parts/response.json create mode 100644 src/layouts/vehicle-parts/vehicle-parts.vue diff --git a/src/constants/tint-mapper.js b/src/constants/tint-mapper.js new file mode 100644 index 000000000..dc978dc38 --- /dev/null +++ b/src/constants/tint-mapper.js @@ -0,0 +1,76 @@ +const tintMap = { + backglass: [ + // Blue Shade + { name: "blue shade, blue tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-BlueTint.svg" }, + { name: "blue shade, brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-BrownTint.svg" }, + { name: "blue shade, gray tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-GrayTint.svg" }, + { name: "blue shade, green tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-GreenTint.svg" }, + { name: "blue shade", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-NoTint.svg" }, + + // Brown Shade + { name: "brown shade, brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BrownShade-BrownTint.svg" }, + + // Gray Shade + { name: "gray shade, blue tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-BlueTint.svg" }, + { name: "gray shade, brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-BrownTint.svg" }, + { name: "gray shade, gray tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-GrayTint.svg" }, + { name: "gray shade, green tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-GreenTint.svg" }, + + // Green Shade + { name: "green shade, blue tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-BlueTint.svg" }, + { name: "green shade, brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-BrownTint.svg" }, + { name: "green shade, green tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-GreenTint.svg" }, + + // Tints Only + { name: "blue tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-BlueTint.svg" }, + { name: "brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-BrownTint.svg" }, + { name: "dark brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-DarkBrownTint.svg" }, + { name: "dark gray tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-DarkGrayTint.svg" }, + { name: "gray tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-GrayTint.svg" }, + { name: "green tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-GreenTint.svg" }, + { name: "gray tint privacy", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-Privacy.svg" }, + + // No shade or tint + { name: "no shade, no tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-NoTint.svg" }, // ??? + ], + + windhshield: [ + // Blue Shade + { name: "blue shade, blue tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-BlueTint.svg" }, + { name: "blue shade, brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-BrownTint.svg" }, + { name: "blue shade, gray tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-GrayTint.svg" }, + { name: "blue shade, green tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-GreenTint.svg" }, + { name: "blue shade", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-NoTint.svg" }, + + // Brown Shade + { name: "brown shade, brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-BrownShade-BrownTint.svg" }, + + // Gray Shade + { name: "gray shade, blue tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-BlueTint.svg" }, + { name: "gray shade, brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-BrownTint.svg" }, + { name: "gray shade, gray tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-GrayTint.svg" }, + { name: "gray shade, green tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-GreenTint.svg" }, + + // Green Shade + { name: "green shade, blue tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-BlueTint.svg" }, + { name: "green shade, brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-BrownTint.svg" }, + { name: "green shade, green tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-GreenTint.svg" }, + + // Tints Only + { name: "blue tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-BlueTint.svg" }, + { name: "brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-BrownTint.svg" }, + { name: "dark brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-DarkBrownTint.svg" }, + { name: "dark gray tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-DarkGrayTint.svg" }, + { name: "gray tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-GrayTint.svg" }, + { name: "green tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-GreenTint.svg" }, + { name: "gray tint privacy", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-Privacy.svg" }, + + // No shade or tint + { name: "no shade, no tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-NoTint.svg" }, // ??? + + ] +} + +export function getTintImage(glassType, colorString) { + return tintMap[glassType.toLowerCase()].find(item => item.name == colorString.toLowerCase()) +} \ No newline at end of file diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-BlueTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-BlueTint.svg new file mode 100644 index 000000000..007c490f0 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-BlueTint.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + + + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-BrownTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-BrownTint.svg new file mode 100644 index 000000000..d1ffeb8e0 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-BrownTint.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + + + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-GrayTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-GrayTint.svg new file mode 100644 index 000000000..417ce474d --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-GrayTint.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + + + + + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-GreenTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-GreenTint.svg new file mode 100644 index 000000000..4cf1c3831 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-GreenTint.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + + + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-NoTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-NoTint.svg new file mode 100644 index 000000000..220b1ab04 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-NoTint.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + + + + + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BrownShade-BrownTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BrownShade-BrownTint.svg new file mode 100644 index 000000000..dbd059625 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BrownShade-BrownTint.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + + + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-BlueTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-BlueTint.svg new file mode 100644 index 000000000..2ec4a0535 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-BlueTint.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-BrownTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-BrownTint.svg new file mode 100644 index 000000000..f9cc80c12 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-BrownTint.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-GrayTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-GrayTint.svg new file mode 100644 index 000000000..fcfe78cf6 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-GrayTint.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-GreenTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-GreenTint.svg new file mode 100644 index 000000000..b420ec6f4 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-GreenTint.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-BlueTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-BlueTint.svg new file mode 100644 index 000000000..e1f2e9688 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-BlueTint.svg @@ -0,0 +1,20 @@ + + + + + + + + + + + + + + + + + + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-BrownTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-BrownTint.svg new file mode 100644 index 000000000..b8f49b565 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-BrownTint.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + + + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-GreenTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-GreenTint.svg new file mode 100644 index 000000000..b07e8dbcc --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-GreenTint.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + + + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-BlueTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-BlueTint.svg new file mode 100644 index 000000000..1e4fd4eba --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-BlueTint.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-BrownTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-BrownTint.svg new file mode 100644 index 000000000..658774678 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-BrownTint.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-DarkBrownTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-DarkBrownTint.svg new file mode 100644 index 000000000..f36ebd878 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-DarkBrownTint.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-DaryGrayTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-DaryGrayTint.svg new file mode 100644 index 000000000..5aab7ea07 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-DaryGrayTint.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-GrayTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-GrayTint.svg new file mode 100644 index 000000000..ee14d3c4b --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-GrayTint.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-GreenTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-GreenTint.svg new file mode 100644 index 000000000..5f5b99de0 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-GreenTint.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-NoTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-NoTint.svg new file mode 100644 index 000000000..ec1ced501 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-NoTint.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-Privacy.svg b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-Privacy.svg new file mode 100644 index 000000000..caa726f47 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-Privacy.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-BlueTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-BlueTint.svg new file mode 100644 index 000000000..b4cf30c92 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-BlueTint.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + + + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-BrownTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-BrownTint.svg new file mode 100644 index 000000000..dbca11b88 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-BrownTint.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + + + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-GrayTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-GrayTint.svg new file mode 100644 index 000000000..7ef277564 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-GrayTint.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + + + + + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-GreenTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-GreenTint.svg new file mode 100644 index 000000000..18bc35fb5 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-GreenTint.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-NoTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-NoTint.svg new file mode 100644 index 000000000..2217911a8 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-NoTint.svg @@ -0,0 +1,19 @@ + + + + + + + + + + + + + + + + + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BrownShade-BrownTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BrownShade-BrownTint.svg new file mode 100644 index 000000000..8c8b1da66 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BrownShade-BrownTint.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + + + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-BlueTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-BlueTint.svg new file mode 100644 index 000000000..a924b6664 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-BlueTint.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-BrownTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-BrownTint.svg new file mode 100644 index 000000000..b26eedee1 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-BrownTint.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-GrayTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-GrayTint.svg new file mode 100644 index 000000000..69373ca2c --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-GrayTint.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-GreenTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-GreenTint.svg new file mode 100644 index 000000000..14824eb51 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-GreenTint.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-BlueTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-BlueTint.svg new file mode 100644 index 000000000..fcc3d63a3 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-BlueTint.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + + + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-BrownTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-BrownTint.svg new file mode 100644 index 000000000..2fdf4bcf9 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-BrownTint.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + + + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-GreenTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-GreenTint.svg new file mode 100644 index 000000000..65a735289 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-GreenTint.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + + + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-BlueTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-BlueTint.svg new file mode 100644 index 000000000..cbeb84ab4 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-BlueTint.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-BrownTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-BrownTint.svg new file mode 100644 index 000000000..f70fef994 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-BrownTint.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-DarkBrownTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-DarkBrownTint.svg new file mode 100644 index 000000000..feedfa3f0 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-DarkBrownTint.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-DarkGrayTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-DarkGrayTint.svg new file mode 100644 index 000000000..9f55ee8a7 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-DarkGrayTint.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-GrayTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-GrayTint.svg new file mode 100644 index 000000000..249a9866c --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-GrayTint.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-GreenTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-GreenTint.svg new file mode 100644 index 000000000..ce17261a5 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-GreenTint.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-NoTint.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-NoTint.svg new file mode 100644 index 000000000..5a9bc647f --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-NoTint.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-Privacy.svg b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-Privacy.svg new file mode 100644 index 000000000..ca1f024ac --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-Privacy.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/layouts/vehicle-parts/part-question/part-question.vue b/src/layouts/vehicle-parts/part-question/part-question.vue new file mode 100644 index 000000000..7c29a6e61 --- /dev/null +++ b/src/layouts/vehicle-parts/part-question/part-question.vue @@ -0,0 +1,65 @@ + + + diff --git a/src/layouts/vehicle-parts/response.json b/src/layouts/vehicle-parts/response.json new file mode 100644 index 000000000..6bcde0a58 --- /dev/null +++ b/src/layouts/vehicle-parts/response.json @@ -0,0 +1,96 @@ +{ + "partsOrQuestions": [ + { + "glassName": "Backglass", + "parts": [ + { + "partNumber": "DB12209GTYN", + "description": "heated glass, solar, 1 hole", + "color": "Green Tint", + "requiresRecalibration": false, + "requiresCapabilityQuestions": false, + "childParts": null + }, + { + "partNumber": "DB12209YPYN", + "description": "heated glass, solar, 1 hole", + "color": "Gray Tint Privacy", + "requiresRecalibration": false, + "requiresCapabilityQuestions": false, + "childParts": null + } + ], + "partQuestions": null + }, + { + "glassName": "DriverRearQuarterGlass", + "parts": [ + { + "partNumber": "DQ12204GTYNOEM", + "description": "solar, driver side, encap", + "color": "Green Tint", + "requiresRecalibration": false, + "requiresCapabilityQuestions": false, + "childParts": null + }, + { + "partNumber": "DQ12204YPYNOEM", + "description": "solar, driver side, encap", + "color": "Gray Tint Privacy", + "requiresRecalibration": false, + "requiresCapabilityQuestions": false, + "childParts": null + }, + { + "partNumber": "DQ12205GTYNOEM", + "description": "solar, antenna, driver side, encap", + "color": "Green Tint", + "requiresRecalibration": false, + "requiresCapabilityQuestions": false, + "childParts": null + }, + { + "partNumber": "DQ12205YPYNOEM", + "description": "solar, antenna, driver side, encap", + "color": "Gray Tint Privacy", + "requiresRecalibration": false, + "requiresCapabilityQuestions": false, + "childParts": null + }, + { + "partNumber": "DQ12207GTYN", + "description": "solar, driver side, encap, chrome molding", + "color": "Green Tint", + "requiresRecalibration": false, + "requiresCapabilityQuestions": false, + "childParts": null + }, + { + "partNumber": "DQ12207YPYNOEM", + "description": "solar, driver side, encap, chrome molding", + "color": "Gray Tint Privacy", + "requiresRecalibration": false, + "requiresCapabilityQuestions": false, + "childParts": null + }, + { + "partNumber": "DQ12208GTYNOEM", + "description": "solar, antenna, driver side, encap, chrome molding", + "color": "Green Tint", + "requiresRecalibration": false, + "requiresCapabilityQuestions": false, + "childParts": null + }, + { + "partNumber": "DQ12208YPYNOEM", + "description": "solar, antenna, driver side, encap, chrome molding", + "color": "Gray Tint Privacy", + "requiresRecalibration": false, + "requiresCapabilityQuestions": false, + "childParts": null + } + ], + "partQuestions": null + } + ] + } \ No newline at end of file diff --git a/src/layouts/vehicle-parts/vehicle-parts.vue b/src/layouts/vehicle-parts/vehicle-parts.vue new file mode 100644 index 000000000..a0aeb2ebb --- /dev/null +++ b/src/layouts/vehicle-parts/vehicle-parts.vue @@ -0,0 +1,44 @@ + + + From 5a6acf7bce64a7108ab87650192c14ae86597845 Mon Sep 17 00:00:00 2001 From: FrankRua Date: Tue, 15 Feb 2022 13:00:02 -0500 Subject: [PATCH 02/35] More changes --- .../tints/BackGlass-BlueShade-BlueTint.svg | 0 .../tints/BackGlass-BlueShade-BrownTint.svg | 0 .../tints/BackGlass-BlueShade-GrayTint.svg | 0 .../tints/BackGlass-BlueShade-GreenTint.svg | 0 .../img}/tints/BackGlass-BlueShade-NoTint.svg | 0 .../tints/BackGlass-BrownShade-BrownTint.svg | 0 .../tints/BackGlass-GrayShade-BlueTint.svg | 0 .../tints/BackGlass-GrayShade-BrownTint.svg | 0 .../tints/BackGlass-GrayShade-GrayTint.svg | 0 .../tints/BackGlass-GrayShade-GreenTint.svg | 0 .../tints/BackGlass-GreenShade-BlueTint.svg | 0 .../tints/BackGlass-GreenShade-BrownTint.svg | 0 .../tints/BackGlass-GreenShade-GreenTint.svg | 0 .../img}/tints/BackGlass-NoShade-BlueTint.svg | 0 .../tints/BackGlass-NoShade-BrownTint.svg | 0 .../tints/BackGlass-NoShade-DarkBrownTint.svg | 0 .../tints/BackGlass-NoShade-DaryGrayTint.svg | 0 .../img}/tints/BackGlass-NoShade-GrayTint.svg | 0 .../tints/BackGlass-NoShade-GreenTint.svg | 0 .../img}/tints/BackGlass-NoShade-NoTint.svg | 0 .../img}/tints/BackGlass-NoShade-Privacy.svg | 0 .../tints/Windshield-BlueShade-BlueTint.svg | 0 .../tints/Windshield-BlueShade-BrownTint.svg | 0 .../tints/Windshield-BlueShade-GrayTint.svg | 0 .../tints/Windshield-BlueShade-GreenTint.svg | 0 .../tints/Windshield-BlueShade-NoTint.svg | 0 .../tints/Windshield-BrownShade-BrownTint.svg | 0 .../tints/Windshield-GrayShade-BlueTint.svg | 0 .../tints/Windshield-GrayShade-BrownTint.svg | 0 .../tints/Windshield-GrayShade-GrayTint.svg | 0 .../tints/Windshield-GrayShade-GreenTint.svg | 0 .../tints/Windshield-GreenShade-BlueTint.svg | 0 .../tints/Windshield-GreenShade-BrownTint.svg | 0 .../tints/Windshield-GreenShade-GreenTint.svg | 0 .../tints/Windshield-NoShade-BlueTint.svg | 0 .../tints/Windshield-NoShade-BrownTint.svg | 0 .../Windshield-NoShade-DarkBrownTint.svg | 0 .../tints/Windshield-NoShade-DarkGrayTint.svg | 0 .../tints/Windshield-NoShade-GrayTint.svg | 0 .../tints/Windshield-NoShade-GreenTint.svg | 0 .../img}/tints/Windshield-NoShade-NoTint.svg | 0 .../img}/tints/Windshield-NoShade-Privacy.svg | 0 src/constants/tint-mapper.js | 84 +++++++++---------- .../part-question/part-question.vue | 60 ++++++++----- src/layouts/vehicle-parts/vehicle-parts.vue | 16 +++- 45 files changed, 95 insertions(+), 65 deletions(-) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/BackGlass-BlueShade-BlueTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/BackGlass-BlueShade-BrownTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/BackGlass-BlueShade-GrayTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/BackGlass-BlueShade-GreenTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/BackGlass-BlueShade-NoTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/BackGlass-BrownShade-BrownTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/BackGlass-GrayShade-BlueTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/BackGlass-GrayShade-BrownTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/BackGlass-GrayShade-GrayTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/BackGlass-GrayShade-GreenTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/BackGlass-GreenShade-BlueTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/BackGlass-GreenShade-BrownTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/BackGlass-GreenShade-GreenTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/BackGlass-NoShade-BlueTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/BackGlass-NoShade-BrownTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/BackGlass-NoShade-DarkBrownTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/BackGlass-NoShade-DaryGrayTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/BackGlass-NoShade-GrayTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/BackGlass-NoShade-GreenTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/BackGlass-NoShade-NoTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/BackGlass-NoShade-Privacy.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/Windshield-BlueShade-BlueTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/Windshield-BlueShade-BrownTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/Windshield-BlueShade-GrayTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/Windshield-BlueShade-GreenTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/Windshield-BlueShade-NoTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/Windshield-BrownShade-BrownTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/Windshield-GrayShade-BlueTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/Windshield-GrayShade-BrownTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/Windshield-GrayShade-GrayTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/Windshield-GrayShade-GreenTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/Windshield-GreenShade-BlueTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/Windshield-GreenShade-BrownTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/Windshield-GreenShade-GreenTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/Windshield-NoShade-BlueTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/Windshield-NoShade-BrownTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/Windshield-NoShade-DarkBrownTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/Windshield-NoShade-DarkGrayTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/Windshield-NoShade-GrayTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/Windshield-NoShade-GreenTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/Windshield-NoShade-NoTint.svg (100%) rename src/{layouts/vehicle-parts/part-question/assets => assets/img}/tints/Windshield-NoShade-Privacy.svg (100%) diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-BlueTint.svg b/src/assets/img/tints/BackGlass-BlueShade-BlueTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-BlueTint.svg rename to src/assets/img/tints/BackGlass-BlueShade-BlueTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-BrownTint.svg b/src/assets/img/tints/BackGlass-BlueShade-BrownTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-BrownTint.svg rename to src/assets/img/tints/BackGlass-BlueShade-BrownTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-GrayTint.svg b/src/assets/img/tints/BackGlass-BlueShade-GrayTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-GrayTint.svg rename to src/assets/img/tints/BackGlass-BlueShade-GrayTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-GreenTint.svg b/src/assets/img/tints/BackGlass-BlueShade-GreenTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-GreenTint.svg rename to src/assets/img/tints/BackGlass-BlueShade-GreenTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-NoTint.svg b/src/assets/img/tints/BackGlass-BlueShade-NoTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-NoTint.svg rename to src/assets/img/tints/BackGlass-BlueShade-NoTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BrownShade-BrownTint.svg b/src/assets/img/tints/BackGlass-BrownShade-BrownTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BrownShade-BrownTint.svg rename to src/assets/img/tints/BackGlass-BrownShade-BrownTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-BlueTint.svg b/src/assets/img/tints/BackGlass-GrayShade-BlueTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-BlueTint.svg rename to src/assets/img/tints/BackGlass-GrayShade-BlueTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-BrownTint.svg b/src/assets/img/tints/BackGlass-GrayShade-BrownTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-BrownTint.svg rename to src/assets/img/tints/BackGlass-GrayShade-BrownTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-GrayTint.svg b/src/assets/img/tints/BackGlass-GrayShade-GrayTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-GrayTint.svg rename to src/assets/img/tints/BackGlass-GrayShade-GrayTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-GreenTint.svg b/src/assets/img/tints/BackGlass-GrayShade-GreenTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-GreenTint.svg rename to src/assets/img/tints/BackGlass-GrayShade-GreenTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-BlueTint.svg b/src/assets/img/tints/BackGlass-GreenShade-BlueTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-BlueTint.svg rename to src/assets/img/tints/BackGlass-GreenShade-BlueTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-BrownTint.svg b/src/assets/img/tints/BackGlass-GreenShade-BrownTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-BrownTint.svg rename to src/assets/img/tints/BackGlass-GreenShade-BrownTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-GreenTint.svg b/src/assets/img/tints/BackGlass-GreenShade-GreenTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-GreenTint.svg rename to src/assets/img/tints/BackGlass-GreenShade-GreenTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-BlueTint.svg b/src/assets/img/tints/BackGlass-NoShade-BlueTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-BlueTint.svg rename to src/assets/img/tints/BackGlass-NoShade-BlueTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-BrownTint.svg b/src/assets/img/tints/BackGlass-NoShade-BrownTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-BrownTint.svg rename to src/assets/img/tints/BackGlass-NoShade-BrownTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-DarkBrownTint.svg b/src/assets/img/tints/BackGlass-NoShade-DarkBrownTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-DarkBrownTint.svg rename to src/assets/img/tints/BackGlass-NoShade-DarkBrownTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-DaryGrayTint.svg b/src/assets/img/tints/BackGlass-NoShade-DaryGrayTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-DaryGrayTint.svg rename to src/assets/img/tints/BackGlass-NoShade-DaryGrayTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-GrayTint.svg b/src/assets/img/tints/BackGlass-NoShade-GrayTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-GrayTint.svg rename to src/assets/img/tints/BackGlass-NoShade-GrayTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-GreenTint.svg b/src/assets/img/tints/BackGlass-NoShade-GreenTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-GreenTint.svg rename to src/assets/img/tints/BackGlass-NoShade-GreenTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-NoTint.svg b/src/assets/img/tints/BackGlass-NoShade-NoTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-NoTint.svg rename to src/assets/img/tints/BackGlass-NoShade-NoTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-Privacy.svg b/src/assets/img/tints/BackGlass-NoShade-Privacy.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-Privacy.svg rename to src/assets/img/tints/BackGlass-NoShade-Privacy.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-BlueTint.svg b/src/assets/img/tints/Windshield-BlueShade-BlueTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-BlueTint.svg rename to src/assets/img/tints/Windshield-BlueShade-BlueTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-BrownTint.svg b/src/assets/img/tints/Windshield-BlueShade-BrownTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-BrownTint.svg rename to src/assets/img/tints/Windshield-BlueShade-BrownTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-GrayTint.svg b/src/assets/img/tints/Windshield-BlueShade-GrayTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-GrayTint.svg rename to src/assets/img/tints/Windshield-BlueShade-GrayTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-GreenTint.svg b/src/assets/img/tints/Windshield-BlueShade-GreenTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-GreenTint.svg rename to src/assets/img/tints/Windshield-BlueShade-GreenTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-NoTint.svg b/src/assets/img/tints/Windshield-BlueShade-NoTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-NoTint.svg rename to src/assets/img/tints/Windshield-BlueShade-NoTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BrownShade-BrownTint.svg b/src/assets/img/tints/Windshield-BrownShade-BrownTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/Windshield-BrownShade-BrownTint.svg rename to src/assets/img/tints/Windshield-BrownShade-BrownTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-BlueTint.svg b/src/assets/img/tints/Windshield-GrayShade-BlueTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-BlueTint.svg rename to src/assets/img/tints/Windshield-GrayShade-BlueTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-BrownTint.svg b/src/assets/img/tints/Windshield-GrayShade-BrownTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-BrownTint.svg rename to src/assets/img/tints/Windshield-GrayShade-BrownTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-GrayTint.svg b/src/assets/img/tints/Windshield-GrayShade-GrayTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-GrayTint.svg rename to src/assets/img/tints/Windshield-GrayShade-GrayTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-GreenTint.svg b/src/assets/img/tints/Windshield-GrayShade-GreenTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-GreenTint.svg rename to src/assets/img/tints/Windshield-GrayShade-GreenTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-BlueTint.svg b/src/assets/img/tints/Windshield-GreenShade-BlueTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-BlueTint.svg rename to src/assets/img/tints/Windshield-GreenShade-BlueTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-BrownTint.svg b/src/assets/img/tints/Windshield-GreenShade-BrownTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-BrownTint.svg rename to src/assets/img/tints/Windshield-GreenShade-BrownTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-GreenTint.svg b/src/assets/img/tints/Windshield-GreenShade-GreenTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-GreenTint.svg rename to src/assets/img/tints/Windshield-GreenShade-GreenTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-BlueTint.svg b/src/assets/img/tints/Windshield-NoShade-BlueTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-BlueTint.svg rename to src/assets/img/tints/Windshield-NoShade-BlueTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-BrownTint.svg b/src/assets/img/tints/Windshield-NoShade-BrownTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-BrownTint.svg rename to src/assets/img/tints/Windshield-NoShade-BrownTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-DarkBrownTint.svg b/src/assets/img/tints/Windshield-NoShade-DarkBrownTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-DarkBrownTint.svg rename to src/assets/img/tints/Windshield-NoShade-DarkBrownTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-DarkGrayTint.svg b/src/assets/img/tints/Windshield-NoShade-DarkGrayTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-DarkGrayTint.svg rename to src/assets/img/tints/Windshield-NoShade-DarkGrayTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-GrayTint.svg b/src/assets/img/tints/Windshield-NoShade-GrayTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-GrayTint.svg rename to src/assets/img/tints/Windshield-NoShade-GrayTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-GreenTint.svg b/src/assets/img/tints/Windshield-NoShade-GreenTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-GreenTint.svg rename to src/assets/img/tints/Windshield-NoShade-GreenTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-NoTint.svg b/src/assets/img/tints/Windshield-NoShade-NoTint.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-NoTint.svg rename to src/assets/img/tints/Windshield-NoShade-NoTint.svg diff --git a/src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-Privacy.svg b/src/assets/img/tints/Windshield-NoShade-Privacy.svg similarity index 100% rename from src/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-Privacy.svg rename to src/assets/img/tints/Windshield-NoShade-Privacy.svg diff --git a/src/constants/tint-mapper.js b/src/constants/tint-mapper.js index dc978dc38..65c714b1c 100644 --- a/src/constants/tint-mapper.js +++ b/src/constants/tint-mapper.js @@ -1,72 +1,72 @@ const tintMap = { backglass: [ // Blue Shade - { name: "blue shade, blue tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-BlueTint.svg" }, - { name: "blue shade, brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-BrownTint.svg" }, - { name: "blue shade, gray tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-GrayTint.svg" }, - { name: "blue shade, green tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-GreenTint.svg" }, - { name: "blue shade", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BlueShade-NoTint.svg" }, + { name: "blue shade, blue tint", src: "BackGlass-BlueShade-BlueTint.svg" }, + { name: "blue shade, brown tint", src: "BackGlass-BlueShade-BrownTint.svg" }, + { name: "blue shade, gray tint", src: "BackGlass-BlueShade-GrayTint.svg" }, + { name: "blue shade, green tint", src: "BackGlass-BlueShade-GreenTint.svg" }, + { name: "blue shade", src: "BackGlass-BlueShade-NoTint.svg" }, // Brown Shade - { name: "brown shade, brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-BrownShade-BrownTint.svg" }, + { name: "brown shade, brown tint", src: "BackGlass-BrownShade-BrownTint.svg" }, // Gray Shade - { name: "gray shade, blue tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-BlueTint.svg" }, - { name: "gray shade, brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-BrownTint.svg" }, - { name: "gray shade, gray tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-GrayTint.svg" }, - { name: "gray shade, green tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GrayShade-GreenTint.svg" }, + { name: "gray shade, blue tint", src: "BackGlass-GrayShade-BlueTint.svg" }, + { name: "gray shade, brown tint", src: "BackGlass-GrayShade-BrownTint.svg" }, + { name: "gray shade, gray tint", src: "BackGlass-GrayShade-GrayTint.svg" }, + { name: "gray shade, green tint", src: "BackGlass-GrayShade-GreenTint.svg" }, // Green Shade - { name: "green shade, blue tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-BlueTint.svg" }, - { name: "green shade, brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-BrownTint.svg" }, - { name: "green shade, green tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-GreenShade-GreenTint.svg" }, + { name: "green shade, blue tint", src: "BackGlass-GreenShade-BlueTint.svg" }, + { name: "green shade, brown tint", src: "BackGlass-GreenShade-BrownTint.svg" }, + { name: "green shade, green tint", src: "BackGlass-GreenShade-GreenTint.svg" }, // Tints Only - { name: "blue tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-BlueTint.svg" }, - { name: "brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-BrownTint.svg" }, - { name: "dark brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-DarkBrownTint.svg" }, - { name: "dark gray tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-DarkGrayTint.svg" }, - { name: "gray tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-GrayTint.svg" }, - { name: "green tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-GreenTint.svg" }, - { name: "gray tint privacy", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-Privacy.svg" }, + { name: "blue tint", src: "BackGlass-NoShade-BlueTint.svg" }, + { name: "brown tint", src: "BackGlass-NoShade-BrownTint.svg" }, + { name: "dark brown tint", src: "BackGlass-NoShade-DarkBrownTint.svg" }, + { name: "dark gray tint", src: "BackGlass-NoShade-DarkGrayTint.svg" }, + { name: "gray tint", src: "BackGlass-NoShade-GrayTint.svg" }, + { name: "green tint", src: "BackGlass-NoShade-GreenTint.svg" }, + { name: "gray tint privacy", src: "BackGlass-NoShade-Privacy.svg" }, // No shade or tint - { name: "no shade, no tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/BackGlass-NoShade-NoTint.svg" }, // ??? + { name: "no shade, no tint", src: "BackGlass-NoShade-NoTint.svg" }, // ??? ], windhshield: [ // Blue Shade - { name: "blue shade, blue tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-BlueTint.svg" }, - { name: "blue shade, brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-BrownTint.svg" }, - { name: "blue shade, gray tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-GrayTint.svg" }, - { name: "blue shade, green tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-GreenTint.svg" }, - { name: "blue shade", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-BlueShade-NoTint.svg" }, + { 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 shade", src: "Windshield-BlueShade-NoTint.svg" }, // Brown Shade - { name: "brown shade, brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-BrownShade-BrownTint.svg" }, + { name: "brown shade, brown tint", src: "Windshield-BrownShade-BrownTint.svg" }, // Gray Shade - { name: "gray shade, blue tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-BlueTint.svg" }, - { name: "gray shade, brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-BrownTint.svg" }, - { name: "gray shade, gray tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-GrayTint.svg" }, - { name: "gray shade, green tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-GrayShade-GreenTint.svg" }, + { 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" }, // Green Shade - { name: "green shade, blue tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-BlueTint.svg" }, - { name: "green shade, brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-BrownTint.svg" }, - { name: "green shade, green tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-GreenShade-GreenTint.svg" }, + { 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" }, // Tints Only - { name: "blue tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-BlueTint.svg" }, - { name: "brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-BrownTint.svg" }, - { name: "dark brown tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-DarkBrownTint.svg" }, - { name: "dark gray tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-DarkGrayTint.svg" }, - { name: "gray tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-GrayTint.svg" }, - { name: "green tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-GreenTint.svg" }, - { name: "gray tint privacy", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-Privacy.svg" }, + { name: "blue tint", src: "Windshield-NoShade-BlueTint.svg" }, + { name: "brown tint", src: "Windshield-NoShade-BrownTint.svg" }, + { name: "dark brown tint", src: "Windshield-NoShade-DarkBrownTint.svg" }, + { name: "dark gray tint", src: "Windshield-NoShade-DarkGrayTint.svg" }, + { name: "gray tint", src: "Windshield-NoShade-GrayTint.svg" }, + { name: "green tint", src: "Windshield-NoShade-GreenTint.svg" }, + { name: "gray tint privacy", src: "Windshield-NoShade-Privacy.svg" }, // No shade or tint - { name: "no shade, no tint", src: "@/layouts/vehicle-parts/part-question/assets/tints/Windshield-NoShade-NoTint.svg" }, // ??? + { name: "no shade, no tint", src: "Windshield-NoShade-NoTint.svg" }, // ??? ] } diff --git a/src/layouts/vehicle-parts/part-question/part-question.vue b/src/layouts/vehicle-parts/part-question/part-question.vue index 7c29a6e61..021410034 100644 --- a/src/layouts/vehicle-parts/part-question/part-question.vue +++ b/src/layouts/vehicle-parts/part-question/part-question.vue @@ -1,9 +1,11 @@ @@ -21,20 +23,6 @@ export default { return { glassColorQuestion: String, glassFeatureQuestion: String, - testTest: [ - { - // Computed to covert my data to name/text data, - // look at answersToDisplay in damage-location-question.vue - - Name: "DB12209GTYN", // Backing value - Text: "heated glass, solar, 1 hole", // Display to user - }, - - { - Name: "Zzzzzz", - Text: "AAAAAAA", - }, - ] }; }, props: { @@ -45,21 +33,49 @@ export default { listCard, buttonQuestion }, - mounted() { - const s = getTintImage("Backglass", "Green Tint"); - - console.log("hi"); - }, computed: { colorQuestionText() { return "Backglass"; }, + featureListData() { + return this.createFeatureListMap(this.colorAnswers); + }, }, methods: { initializeComponent(cmsContent, initialData) { this.glassColorQuestion = cmsContent.ColorQuestion; this.glassFeatureQuestion = cmsContent.FeatureQuestion; }, + + createFeatureListMap(colorAnswers) { + const tintMapByColor = colorAnswers.reduce((arr, item) => { + + // Create the key + const itemColor = item.ColorAnswerText; + arr[itemColor] = arr[itemColor] || []; + + // Map the data to Name/Text object for ButtonQuestion + const mappedItem = item.FeatureAnswers.reduce((featureArr, item) => { + featureArr["Text"] = item.FeatureAnswerText; + featureArr["Name"] = item.PartNumber; + + return featureArr + }, {}); + + // Add onto the final object + arr[itemColor].push(mappedItem); + + return arr; + }, {}); + + return tintMapByColor; + }, + + getTintImage(glassType, tintColor) { + const tintObject = getTintImage(glassType, tintColor); + + return tintObject === undefined ? "" : tintObject.src; + } }, }; diff --git a/src/layouts/vehicle-parts/vehicle-parts.vue b/src/layouts/vehicle-parts/vehicle-parts.vue index a0aeb2ebb..303afae0a 100644 --- a/src/layouts/vehicle-parts/vehicle-parts.vue +++ b/src/layouts/vehicle-parts/vehicle-parts.vue @@ -21,13 +21,27 @@ export default { PartNumber: 'DB12209GTYN' }] }, + { + ColorAnswerText: 'Green Tint', + FeatureAnswers: [{ + FeatureAnswerText: 'heated glass, solar, 3 hole', + PartNumber: 'DB12209XXXX' + }] + }, { ColorAnswerText: 'Gray Tint Privacy', FeatureAnswers: [{ FeatureAnswerText: 'heated glass, solar, 1 hole', PartNumber: 'DB12209YPYN' }] - } + }, + { + ColorAnswerText: 'Gray Tint Privacy', + FeatureAnswers: [{ + FeatureAnswerText: 'heated glass, solar, 5 hole', + PartNumber: 'DB12209YZZZ' + }] + }, ] }] } From b588fce5ee8136818f86254a7a2f26c94f2ce680 Mon Sep 17 00:00:00 2001 From: FrankRua Date: Tue, 15 Feb 2022 16:30:59 -0500 Subject: [PATCH 03/35] v-model --- .../vehicle-parts/part-question/part-question.vue | 12 +++++++----- 1 file changed, 7 insertions(+), 5 deletions(-) diff --git a/src/layouts/vehicle-parts/part-question/part-question.vue b/src/layouts/vehicle-parts/part-question/part-question.vue index 021410034..c13298af2 100644 --- a/src/layouts/vehicle-parts/part-question/part-question.vue +++ b/src/layouts/vehicle-parts/part-question/part-question.vue @@ -1,12 +1,13 @@ diff --git a/src/layouts/vehicle-parts/part-question/part-question.vue b/src/layouts/vehicle-parts/part-question/part-question.vue index c13298af2..abd5b6b76 100644 --- a/src/layouts/vehicle-parts/part-question/part-question.vue +++ b/src/layouts/vehicle-parts/part-question/part-question.vue @@ -1,22 +1,40 @@ + + diff --git a/src/layouts/vehicle-parts/response.json b/src/layouts/vehicle-parts/response.json deleted file mode 100644 index 6bcde0a58..000000000 --- a/src/layouts/vehicle-parts/response.json +++ /dev/null @@ -1,96 +0,0 @@ -{ - "partsOrQuestions": [ - { - "glassName": "Backglass", - "parts": [ - { - "partNumber": "DB12209GTYN", - "description": "heated glass, solar, 1 hole", - "color": "Green Tint", - "requiresRecalibration": false, - "requiresCapabilityQuestions": false, - "childParts": null - }, - { - "partNumber": "DB12209YPYN", - "description": "heated glass, solar, 1 hole", - "color": "Gray Tint Privacy", - "requiresRecalibration": false, - "requiresCapabilityQuestions": false, - "childParts": null - } - ], - "partQuestions": null - }, - { - "glassName": "DriverRearQuarterGlass", - "parts": [ - { - "partNumber": "DQ12204GTYNOEM", - "description": "solar, driver side, encap", - "color": "Green Tint", - "requiresRecalibration": false, - "requiresCapabilityQuestions": false, - "childParts": null - }, - { - "partNumber": "DQ12204YPYNOEM", - "description": "solar, driver side, encap", - "color": "Gray Tint Privacy", - "requiresRecalibration": false, - "requiresCapabilityQuestions": false, - "childParts": null - }, - { - "partNumber": "DQ12205GTYNOEM", - "description": "solar, antenna, driver side, encap", - "color": "Green Tint", - "requiresRecalibration": false, - "requiresCapabilityQuestions": false, - "childParts": null - }, - { - "partNumber": "DQ12205YPYNOEM", - "description": "solar, antenna, driver side, encap", - "color": "Gray Tint Privacy", - "requiresRecalibration": false, - "requiresCapabilityQuestions": false, - "childParts": null - }, - { - "partNumber": "DQ12207GTYN", - "description": "solar, driver side, encap, chrome molding", - "color": "Green Tint", - "requiresRecalibration": false, - "requiresCapabilityQuestions": false, - "childParts": null - }, - { - "partNumber": "DQ12207YPYNOEM", - "description": "solar, driver side, encap, chrome molding", - "color": "Gray Tint Privacy", - "requiresRecalibration": false, - "requiresCapabilityQuestions": false, - "childParts": null - }, - { - "partNumber": "DQ12208GTYNOEM", - "description": "solar, antenna, driver side, encap, chrome molding", - "color": "Green Tint", - "requiresRecalibration": false, - "requiresCapabilityQuestions": false, - "childParts": null - }, - { - "partNumber": "DQ12208YPYNOEM", - "description": "solar, antenna, driver side, encap, chrome molding", - "color": "Gray Tint Privacy", - "requiresRecalibration": false, - "requiresCapabilityQuestions": false, - "childParts": null - } - ], - "partQuestions": null - } - ] - } \ No newline at end of file diff --git a/src/layouts/vehicle-parts/vehicle-parts.vue b/src/layouts/vehicle-parts/vehicle-parts.vue index 303afae0a..81a7240ca 100644 --- a/src/layouts/vehicle-parts/vehicle-parts.vue +++ b/src/layouts/vehicle-parts/vehicle-parts.vue @@ -12,38 +12,72 @@ export default { name: "vehicle-parts", data() { return { - Parts: [{ - glassName: 'Backglass', - colorAnswers: [{ - ColorAnswerText: 'Green Tint', - FeatureAnswers: [{ - FeatureAnswerText: 'heated glass, solar, 1 hole', - PartNumber: 'DB12209GTYN' - }] - }, - { - ColorAnswerText: 'Green Tint', - FeatureAnswers: [{ - FeatureAnswerText: 'heated glass, solar, 3 hole', - PartNumber: 'DB12209XXXX' - }] - }, - { - ColorAnswerText: 'Gray Tint Privacy', - FeatureAnswers: [{ - FeatureAnswerText: 'heated glass, solar, 1 hole', - PartNumber: 'DB12209YPYN' - }] - }, - { - ColorAnswerText: 'Gray Tint Privacy', - FeatureAnswers: [{ - FeatureAnswerText: 'heated glass, solar, 5 hole', - PartNumber: 'DB12209YZZZ' - }] - }, - ] - }] + Parts: [ + { + glassName: 'Backglass', + colorAnswers: [{ + ColorAnswerText: 'Green Tint', + FeatureAnswers: [{ + FeatureAnswerText: 'Backglass - heated glass, solar, 1 hole', + PartNumber: 'test-backglass-green-tint-1-hole', + }] + }, + { + ColorAnswerText: 'Green Tint', + FeatureAnswers: [{ + FeatureAnswerText: 'Backglass - heated glass, solar, 2 hole', + PartNumber: 'test-backglass-green-tint-2-hole' + }] + }, + { + ColorAnswerText: 'Gray Tint Privacy', + FeatureAnswers: [{ + FeatureAnswerText: 'Backglass - heated glass, solar, 3 hole', + PartNumber: 'test-backglass-gray-tint-privacy-3-hole' + }] + }, + { + ColorAnswerText: 'Gray Tint Privacy', + FeatureAnswers: [{ + FeatureAnswerText: 'Backglass - heated glass, solar, 4 hole', + PartNumber: 'test-backglass-blue-tint-4-hole' + }] + }, + ] + }, + { + glassName: 'Windshield', + colorAnswers: [{ + ColorAnswerText: 'Blue Tint', + FeatureAnswers: [{ + FeatureAnswerText: 'Windshield - heated glass, solar, 1 hole', + PartNumber: 'test-windshield-blue-tint-1-hole' + }] + }, + { + ColorAnswerText: 'Blue Tint', + FeatureAnswers: [{ + FeatureAnswerText: 'Windshield -heated glass, solar, 2 hole', + PartNumber: 'test-blue-tint-windshield-2-hole' + }] + }, + { + ColorAnswerText: 'Gray Tint Privacy', + FeatureAnswers: [{ + FeatureAnswerText: 'Windshield -heated glass, solar, 3 hole', + PartNumber: 'test-gray-tint-privacy-windshield-3-hole' + }] + }, + { + ColorAnswerText: 'Gray Tint Privacy', + FeatureAnswers: [{ + FeatureAnswerText: 'Windshield -heated glass, solar, 4 hole', + PartNumber: 'test-brown-tint-windshield-4-hole' + }] + }, + ] + }, + ] } }, components: { diff --git a/src/ux-components/list-card/list-card.vue b/src/ux-components/list-card/list-card.vue index ddecb9a31..bf06134e0 100644 --- a/src/ux-components/list-card/list-card.vue +++ b/src/ux-components/list-card/list-card.vue @@ -1,266 +1,268 @@ diff --git a/src/ux-components/radio/radio.vue b/src/ux-components/radio/radio.vue index 952aefb1d..386cfdb72 100644 --- a/src/ux-components/radio/radio.vue +++ b/src/ux-components/radio/radio.vue @@ -10,7 +10,7 @@ :aria-required="isRequired" :value="value" :v-model="checkValue" - @change="handleCheckChanged()" + @change="handleCheckChanged" /> - + - + \ No newline at end of file From d9dc1eeb7ec904950ef587d3974c0aa5cb037d0e Mon Sep 17 00:00:00 2001 From: FrankRua Date: Mon, 21 Feb 2022 17:26:29 -0500 Subject: [PATCH 05/35] Changed computed, commented --- .../part-question/part-question.vue | 46 ++++++++++--------- src/ux-components/list-card/list-card.vue | 8 +++- 2 files changed, 31 insertions(+), 23 deletions(-) diff --git a/src/layouts/vehicle-parts/part-question/part-question.vue b/src/layouts/vehicle-parts/part-question/part-question.vue index abd5b6b76..6808c3bee 100644 --- a/src/layouts/vehicle-parts/part-question/part-question.vue +++ b/src/layouts/vehicle-parts/part-question/part-question.vue @@ -1,4 +1,5 @@ diff --git a/src/ux-components/list-card/list-card.vue b/src/ux-components/list-card/list-card.vue index da89bc55a..5f7ace3d4 100644 --- a/src/ux-components/list-card/list-card.vue +++ b/src/ux-components/list-card/list-card.vue @@ -44,36 +44,28 @@ - + + \ No newline at end of file diff --git a/src/ux-components/radio/radio.vue b/src/ux-components/radio/radio.vue index 1b4d71d9e..d7620df94 100644 --- a/src/ux-components/radio/radio.vue +++ b/src/ux-components/radio/radio.vue @@ -2,15 +2,15 @@
-
+ + \ No newline at end of file + From cbdde53a987267dfcf6083fd9417ff4b4d3b8a89 Mon Sep 17 00:00:00 2001 From: FrankRua Date: Tue, 22 Feb 2022 17:06:31 -0500 Subject: [PATCH 09/35] Calls $refs dynamically --- src/layouts/vehicle-parts/vehicle-parts.vue | 9 ++------- 1 file changed, 2 insertions(+), 7 deletions(-) diff --git a/src/layouts/vehicle-parts/vehicle-parts.vue b/src/layouts/vehicle-parts/vehicle-parts.vue index 703c9789c..1f4323a65 100644 --- a/src/layouts/vehicle-parts/vehicle-parts.vue +++ b/src/layouts/vehicle-parts/vehicle-parts.vue @@ -62,15 +62,10 @@ export default { vm.$refs.funnelFooter.initializeComponent( resultMap.cmsContent.FunnelFooterWidget ); + // Part Question dynamic component + Object.keys(vm.$refs).filter(r => r.includes(vm.refPrefix) && vm.$refs[r][0] !== undefined).forEach(c => vm.$refs[c][0].initializeComponent()); - // for (const key of Object.keys(vm.$refs)) { - // if (key.includes(vm.refPrefix) && vm.$refs[key][0] !== undefined) { - // const partQuestionComp = vm.$refs[key][0]; - - // partQuestionComp.initializeComponent() - // } - // } }); }, From 265e32f7a7b80810647283f4dbe15a2ade1f559c Mon Sep 17 00:00:00 2001 From: FrankRua Date: Wed, 23 Feb 2022 11:30:48 -0500 Subject: [PATCH 10/35] Integrated CMS, refactor --- src/constants/dynamictext-mapper.js | 2 +- src/constants/store-actions.js | 1 + .../part-question/part-question.vue | 45 +++-- src/layouts/vehicle-parts/vehicle-parts.vue | 169 +++++++++--------- src/store/index.js | 14 ++ 5 files changed, 120 insertions(+), 111 deletions(-) diff --git a/src/constants/dynamictext-mapper.js b/src/constants/dynamictext-mapper.js index 31e49c368..b450d0561 100644 --- a/src/constants/dynamictext-mapper.js +++ b/src/constants/dynamictext-mapper.js @@ -3,7 +3,7 @@ // Please use lowercase only so that we don't have to worry about case sensitivity. const customMappings = { - glassname: [ + formattedglassname: [ { key: 'Windshield Single', transformedValue: 'windshield' }, { key: 'Windshield Driver', transformedValue: 'driver side split windshield' }, { key: 'Windshield Passenger', transformedValue: 'passenger side split windshield' }, diff --git a/src/constants/store-actions.js b/src/constants/store-actions.js index 177211ae0..dddab1d66 100644 --- a/src/constants/store-actions.js +++ b/src/constants/store-actions.js @@ -11,6 +11,7 @@ const storeActions = { GET_EVOX_IMAGE: "getEvoxImage", LOOKUP_VEHICLE_BY_YMMS: "lookupVehicleByYmms", LOOKUP_VEHICLE_BY_VIN: "lookupVehicleByVin", + GET_PARTS_OR_QUESTIONS: "getPartsOrQuestions", // DEPENDENCY MUTATIONS RESET_VEHICLE_AND_DEPS: "resetVehicleAndDependencies", diff --git a/src/layouts/vehicle-parts/part-question/part-question.vue b/src/layouts/vehicle-parts/part-question/part-question.vue index 10d5a8392..121d358e8 100644 --- a/src/layouts/vehicle-parts/part-question/part-question.vue +++ b/src/layouts/vehicle-parts/part-question/part-question.vue @@ -17,14 +17,13 @@ " :buttonLabel="name" altText="" :buttonID="`${glassLocation}-${glassName}-${name}`" :groupName="`${glassLocation}-${glassName}`" @isCheckedChanged="ResetTintAndPartSelections()" /> -
- +
@@ -49,10 +48,8 @@ export default { inheritAttrs: false, data() { return { - glassColorQuestion: String, - glassFeatureQuestion: String, - featureListData: Object, - selectedPart: {}, // v-model for the radio button selections + glassColorQuestion: '', + glassFeatureQuestion: '', selectedTint: {}, // v-model for the list card selections }; }, @@ -60,6 +57,7 @@ export default { glassName: String, glassLocation: String, colorAnswers: Array, + modelValue: Object }, components: { listCard, @@ -67,24 +65,21 @@ export default { }, computed: { colorQuestionText() { - return getCustomTransformValue( - "Select your current {custom:glassName} color", - `${this.glassLocation} ${this.glassName}` - ); + return getCustomTransformValue(this.glassColorQuestion, `${this.glassLocation} ${this.glassName}`); }, - }, - mounted() { - this.featureListData = this.createFeatureListMap(this.colorAnswers); - }, - methods: { - initializeComponent(cmsContent, initialData) { - console.log("Im here"); + selectedPart: { + get: function () { + return this.modelValue; + }, + set: function (newValue) { + this.$emit("update:modelValue", newValue); + } }, // Creates a map of the feature list data in the correct Name/Value // format for the button-question component. - createFeatureListMap(colorAnswers) { - const tintMapByColor = colorAnswers.reduce((arr, item) => { + featureListData() { + const tintMapByColor = this.colorAnswers.reduce((arr, item) => { // Create the key const itemColor = item.ColorAnswerText; arr[itemColor] = arr[itemColor] || []; @@ -104,6 +99,12 @@ export default { }, {}); return tintMapByColor; + } + }, + methods: { + initializeComponent(cmsContent, initialData) { + this.glassColorQuestion = cmsContent.ColorQuestionWidget.QuestionText; + this.glassFeatureQuestion = cmsContent.FeatureQuestionWidget.QuestionText; }, // Gets tint images based on the glass type, and tint name. @@ -123,12 +124,6 @@ export default { this.selectedTint = {}; this.selectedPart = {}; }, - - // Emits selected part back to the parent vehicle-parts component - // so it can have a object that contains all selected parts. - EmitPartSelection(event) { - this.$emit("update:modelValue", event); - }, }, }; diff --git a/src/layouts/vehicle-parts/vehicle-parts.vue b/src/layouts/vehicle-parts/vehicle-parts.vue index 1f4323a65..1c213465e 100644 --- a/src/layouts/vehicle-parts/vehicle-parts.vue +++ b/src/layouts/vehicle-parts/vehicle-parts.vue @@ -1,11 +1,12 @@ @@ -20,6 +27,7 @@ import funnelHeader from "@/common-components/funnel-header/funnel-header"; import vehicleBanner from "@/common-components/vehicle-banner/vehicle-banner"; import funnelSubHeader from "@/common-components/funnel-sub-header/funnel-sub-header"; import funnelFooter from "@/common-components/funnel-footer/funnel-footer"; +import alert from "@/ux-components/alert/alert"; // Supporting Files import { @@ -29,6 +37,7 @@ import { settleAllPromises } from "@/helpers/layout-helper"; + export default { name: "vehicle-parts", async beforeRouteEnter(to, from, next) { @@ -38,8 +47,8 @@ export default { // Settle promises and get results const promiseResultMap = [{ resultKey: "cmsContent", - promise: cmsContentPromise - }]; + promise: cmsContentPromise, + }, ]; const resultMap = await settleAllPromises(promiseResultMap); @@ -61,16 +70,27 @@ export default { // Part Question dynamic component Object.keys(vm.$refs) .filter((r) => r.includes(vm.refPrefix) && vm.$refs[r][0] !== undefined) - .forEach((c) => vm.$refs[c][0].initializeComponent({ - ColorQuestionWidget: resultMap.cmsContent.ColorQuestionWidget, - FeatureQuestionWidget: resultMap.cmsContent.FeatureQuestionWidget - })); + .forEach((c) => + vm.$refs[c][0].initializeComponent({ + ColorQuestionWidget: resultMap.cmsContent.ColorQuestionWidget, + FeatureQuestionWidget: resultMap.cmsContent.FeatureQuestionWidget, + }) + ); + + // Set alertData for the page alert. These use props so we don't call + // initializeComponent here. + vm.alertWidgetData = { + copy: resultMap.cmsContent.AlertWidget.BodyText, + headline: resultMap.cmsContent.AlertWidget.HeadlineText + }; + }); }, data() { return { glassParts: {}, refPrefix: "partQuestion", + alertWidgetData: Object, }; }, components: { @@ -79,82 +99,85 @@ export default { vehicleBanner, funnelSubHeader, funnelFooter, + alert, }, computed: { Parts() { return [{ - glassLocation: "Rear", - glassName: "Stationary", - colorAnswers: [{ - ColorAnswerText: "Green Tint", - FeatureAnswers: [{ - FeatureAnswerText: "Backglass - heated glass, solar, 1 hole", - PartNumber: "test-backglass-green-tint-1-hole", - }, ], - }, - { - ColorAnswerText: "Green Tint", - FeatureAnswers: [{ - FeatureAnswerText: "Backglass - heated glass, solar, 2 hole", - PartNumber: "test-backglass-green-tint-2-hole", - }, ], - }, - { - ColorAnswerText: "Gray Tint Privacy", - FeatureAnswers: [{ - FeatureAnswerText: "Backglass - heated glass, solar, 3 hole", - PartNumber: "test-backglass-gray-tint-privacy-3-hole", - }, ], - }, - { - ColorAnswerText: "Gray Tint Privacy", - FeatureAnswers: [{ - FeatureAnswerText: "Backglass - heated glass, solar, 4 hole", - PartNumber: "test-backglass-blue-tint-4-hole", - }, ], - }, - ], - }, - { - glassLocation: "Windshield", - glassName: "Single", - colorAnswers: [{ - ColorAnswerText: "Blue Tint", - FeatureAnswers: [{ - FeatureAnswerText: "Windshield - heated glass, solar, 1 hole", - PartNumber: "test-windshield-blue-tint-1-hole", - }, ], - }, - { - ColorAnswerText: "Blue Tint", - FeatureAnswers: [{ - FeatureAnswerText: "Windshield -heated glass, solar, 2 hole", - PartNumber: "test-blue-tint-windshield-2-hole", - }, ], - }, - { - ColorAnswerText: "Gray Tint Privacy", - FeatureAnswers: [{ - FeatureAnswerText: "Windshield -heated glass, solar, 3 hole", - PartNumber: "test-gray-tint-privacy-windshield-3-hole", - }, ], - }, - { - ColorAnswerText: "Gray Tint Privacy", - FeatureAnswers: [{ - FeatureAnswerText: "Windshield -heated glass, solar, 4 hole", - PartNumber: "test-brown-tint-windshield-4-hole", - }, ], - }, - ], - }, - ] - } + glassLocation: "Rear", + glassName: "Stationary", + colorAnswers: [{ + ColorAnswerText: "Green Tint", + FeatureAnswers: [{ + FeatureAnswerText: "Backglass - heated glass, solar, 1 hole", + PartNumber: "test-backglass-green-tint-1-hole", + }, ], + }, + { + ColorAnswerText: "Green Tint", + FeatureAnswers: [{ + FeatureAnswerText: "Backglass - heated glass, solar, 2 hole", + PartNumber: "test-backglass-green-tint-2-hole", + }, ], + }, + { + ColorAnswerText: "Gray Tint Privacy", + FeatureAnswers: [{ + FeatureAnswerText: "Backglass - heated glass, solar, 3 hole", + PartNumber: "test-backglass-gray-tint-privacy-3-hole", + }, ], + }, + { + ColorAnswerText: "Gray Tint Privacy", + FeatureAnswers: [{ + FeatureAnswerText: "Backglass - heated glass, solar, 4 hole", + PartNumber: "test-backglass-blue-tint-4-hole", + }, ], + }, + ], + }, + { + glassLocation: "Windshield", + glassName: "Single", + colorAnswers: [{ + ColorAnswerText: "Blue Tint", + FeatureAnswers: [{ + FeatureAnswerText: "Windshield - heated glass, solar, 1 hole", + PartNumber: "test-windshield-blue-tint-1-hole", + }, ], + }, + { + ColorAnswerText: "Blue Tint", + FeatureAnswers: [{ + FeatureAnswerText: "Windshield -heated glass, solar, 2 hole", + PartNumber: "test-blue-tint-windshield-2-hole", + }, ], + }, + { + ColorAnswerText: "Gray Tint Privacy", + FeatureAnswers: [{ + FeatureAnswerText: "Windshield -heated glass, solar, 3 hole", + PartNumber: "test-gray-tint-privacy-windshield-3-hole", + }, ], + }, + { + ColorAnswerText: "Gray Tint Privacy", + FeatureAnswers: [{ + FeatureAnswerText: "Windshield -heated glass, solar, 4 hole", + PartNumber: "test-brown-tint-windshield-4-hole", + }, ], + }, + ], + }, + ]; + }, }, methods: { arePagePrerequisitesValid() { + // return store.getters.damage.isRepair !== null; + return true; - }, + } }, }; diff --git a/src/store/index.js b/src/store/index.js index 7e114cce4..7feea102d 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -25,6 +25,11 @@ export const state = { numberOfChips: null, glassToReplace: null, }, + lineItems:{ + glassParts: null, + childParts: null, + otherParts: null + } }, applicationUser: { eventBus: [], @@ -102,7 +107,9 @@ export const mutations = { }, resetPartsAndDependencies(state) { - + state.glassParts = null; + state.childParts = null; + state.otherParts = null; } } @@ -118,6 +125,8 @@ export const getters = { return matchedEvent !== undefined ? matchedEvent.eventValue : undefined; }, eventBus: (state) => state.applicationUser.eventBus, + damage: (state) => state.order.damage, + lineItems: (state) => state.order.lineItems } // Export Actions diff --git a/src/styles/common-styles.scss b/src/styles/common-styles.scss index ae409dd36..47ea0815d 100644 --- a/src/styles/common-styles.scss +++ b/src/styles/common-styles.scss @@ -3,7 +3,6 @@ body { font-size: 16px; background-color: #fff; - .container-fluid { max-width: 576px; //Remove once desktop app is complete &.container-shadow { @@ -14,6 +13,9 @@ body { display: flex; flex-direction: column; } + .prevent-squish{ + overflow-x: unset; + } } .pointer { cursor: pointer; diff --git a/src/ux-components/radio/radio.vue b/src/ux-components/radio/radio.vue index d7620df94..46c3b7c76 100644 --- a/src/ux-components/radio/radio.vue +++ b/src/ux-components/radio/radio.vue @@ -63,7 +63,7 @@ export default { }; this.$emit("isCheckedChanged", emitEvent); - this.$emit("update:modelValue", emitEvent); + //this.$emit("update:modelValue", emitEvent); } }, }, From 8e1c5fef34616554e765cb5b73e5955af34b4e24 Mon Sep 17 00:00:00 2001 From: FrankRua Date: Wed, 23 Feb 2022 15:56:03 -0500 Subject: [PATCH 12/35] revert maxes changes --- .../button-question/button-question.vue | 253 +++++++++--------- src/ux-components/radio/radio.vue | 2 +- 2 files changed, 130 insertions(+), 125 deletions(-) diff --git a/src/common-components/button-question/button-question.vue b/src/common-components/button-question/button-question.vue index 946c6e4dd..3ea8fd52e 100644 --- a/src/common-components/button-question/button-question.vue +++ b/src/common-components/button-question/button-question.vue @@ -1,153 +1,158 @@ diff --git a/src/ux-components/radio/radio.vue b/src/ux-components/radio/radio.vue index 46c3b7c76..d7620df94 100644 --- a/src/ux-components/radio/radio.vue +++ b/src/ux-components/radio/radio.vue @@ -63,7 +63,7 @@ export default { }; this.$emit("isCheckedChanged", emitEvent); - //this.$emit("update:modelValue", emitEvent); + this.$emit("update:modelValue", emitEvent); } }, }, From 25f0eaf07516d14dc706537d0b319036ffb567fa Mon Sep 17 00:00:00 2001 From: FrankRua Date: Wed, 23 Feb 2022 16:55:13 -0500 Subject: [PATCH 13/35] include parameters in the prereq calls --- src/layouts/vehicle-parts/part-question/part-question.vue | 4 ++-- src/layouts/vehicle-parts/vehicle-parts.vue | 8 ++++---- src/router/index.js | 8 ++++---- 3 files changed, 10 insertions(+), 10 deletions(-) diff --git a/src/layouts/vehicle-parts/part-question/part-question.vue b/src/layouts/vehicle-parts/part-question/part-question.vue index 574139727..9a7e63df6 100644 --- a/src/layouts/vehicle-parts/part-question/part-question.vue +++ b/src/layouts/vehicle-parts/part-question/part-question.vue @@ -8,7 +8,6 @@
- {{ selectedTint }}
- +
@@ -67,6 +66,7 @@ export default { colorQuestionText() { return getCustomTransformValue(this.glassColorQuestion, `${this.glassLocation} ${this.glassName}`); }, + selectedPart: { get: function () { return this.modelValue; diff --git a/src/layouts/vehicle-parts/vehicle-parts.vue b/src/layouts/vehicle-parts/vehicle-parts.vue index 5c2d290a7..06fa46341 100644 --- a/src/layouts/vehicle-parts/vehicle-parts.vue +++ b/src/layouts/vehicle-parts/vehicle-parts.vue @@ -3,7 +3,6 @@ - {{ glassParts }}
@@ -173,9 +172,10 @@ export default { }, }, methods: { - arePagePrerequisitesValid() { - // return store.getters.damage.isRepair !== null; - + arePagePrerequisitesValid(parameters) { + // store.getters.damage.isRepair !== null; + // parameters.PartsByGlassName.length > 0; + return true; } }, diff --git a/src/router/index.js b/src/router/index.js index b564b7e94..0195dd8d9 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -55,7 +55,7 @@ const routes = [ .getRoutes() .filter((x) => x.name === to.query.fmgPage)[0].components; - if (!arePagePrerequisitesValid(component)) { + if (!arePagePrerequisitesValid(component, to.params)) { await GoToFunnelStartOn404(next); } @@ -80,7 +80,7 @@ const routes = [ .filter((x) => x.name === routeData[0].name)[0] .components.default(); - if (!arePagePrerequisitesValid(nextComponent)) { + if (!arePagePrerequisitesValid(nextComponent, to.params)) { await GoToFunnelStartOn404(next); } @@ -217,8 +217,8 @@ async function GoToFunnelStartOn404(next) { } // Checks arePagePrerequisitesValid on the component passed in. -function arePagePrerequisitesValid(component) { - return component.default.methods.arePagePrerequisitesValid(); +function arePagePrerequisitesValid(component, parameters = {}) { + return component.default.methods.arePagePrerequisitesValid(parameters); } // Reset dependant state on route change. From 9636d358d8795b2eb442999ded745ce80acfbae4 Mon Sep 17 00:00:00 2001 From: FrankRua Date: Thu, 24 Feb 2022 12:33:20 -0500 Subject: [PATCH 14/35] Map API data to vehicle-parts ds --- ...eTint.svg => Glass-BlueShade-BlueTint.svg} | 0 ...Tint.svg => Glass-BlueShade-BrownTint.svg} | 0 ...yTint.svg => Glass-BlueShade-GrayTint.svg} | 0 ...Tint.svg => Glass-BlueShade-GreenTint.svg} | 0 ...-NoTint.svg => Glass-BlueShade-NoTint.svg} | 0 ...int.svg => Glass-BrownShade-BrownTint.svg} | 0 ...eTint.svg => Glass-GrayShade-BlueTint.svg} | 0 ...Tint.svg => Glass-GrayShade-BrownTint.svg} | 0 ...yTint.svg => Glass-GrayShade-GrayTint.svg} | 0 ...Tint.svg => Glass-GrayShade-GreenTint.svg} | 0 ...Tint.svg => Glass-GreenShade-BlueTint.svg} | 0 ...int.svg => Glass-GreenShade-BrownTint.svg} | 0 ...int.svg => Glass-GreenShade-GreenTint.svg} | 0 ...lueTint.svg => Glass-NoShade-BlueTint.svg} | 0 ...wnTint.svg => Glass-NoShade-BrownTint.svg} | 0 ...nt.svg => Glass-NoShade-DarkBrownTint.svg} | 0 ...int.svg => Glass-NoShade-DaryGrayTint.svg} | 0 ...rayTint.svg => Glass-NoShade-GrayTint.svg} | 0 ...enTint.svg => Glass-NoShade-GreenTint.svg} | 0 ...de-NoTint.svg => Glass-NoShade-NoTint.svg} | 0 ...-Privacy.svg => Glass-NoShade-Privacy.svg} | 0 src/constants/tint-mapper.js | 49 ++++--- src/layouts/vehicle-parts/vehicle-parts.vue | 128 ++++++++---------- 23 files changed, 87 insertions(+), 90 deletions(-) rename src/assets/img/tints/{BackGlass-BlueShade-BlueTint.svg => Glass-BlueShade-BlueTint.svg} (100%) rename src/assets/img/tints/{BackGlass-BlueShade-BrownTint.svg => Glass-BlueShade-BrownTint.svg} (100%) rename src/assets/img/tints/{BackGlass-BlueShade-GrayTint.svg => Glass-BlueShade-GrayTint.svg} (100%) rename src/assets/img/tints/{BackGlass-BlueShade-GreenTint.svg => Glass-BlueShade-GreenTint.svg} (100%) rename src/assets/img/tints/{BackGlass-BlueShade-NoTint.svg => Glass-BlueShade-NoTint.svg} (100%) rename src/assets/img/tints/{BackGlass-BrownShade-BrownTint.svg => Glass-BrownShade-BrownTint.svg} (100%) rename src/assets/img/tints/{BackGlass-GrayShade-BlueTint.svg => Glass-GrayShade-BlueTint.svg} (100%) rename src/assets/img/tints/{BackGlass-GrayShade-BrownTint.svg => Glass-GrayShade-BrownTint.svg} (100%) rename src/assets/img/tints/{BackGlass-GrayShade-GrayTint.svg => Glass-GrayShade-GrayTint.svg} (100%) rename src/assets/img/tints/{BackGlass-GrayShade-GreenTint.svg => Glass-GrayShade-GreenTint.svg} (100%) rename src/assets/img/tints/{BackGlass-GreenShade-BlueTint.svg => Glass-GreenShade-BlueTint.svg} (100%) rename src/assets/img/tints/{BackGlass-GreenShade-BrownTint.svg => Glass-GreenShade-BrownTint.svg} (100%) rename src/assets/img/tints/{BackGlass-GreenShade-GreenTint.svg => Glass-GreenShade-GreenTint.svg} (100%) rename src/assets/img/tints/{BackGlass-NoShade-BlueTint.svg => Glass-NoShade-BlueTint.svg} (100%) rename src/assets/img/tints/{BackGlass-NoShade-BrownTint.svg => Glass-NoShade-BrownTint.svg} (100%) rename src/assets/img/tints/{BackGlass-NoShade-DarkBrownTint.svg => Glass-NoShade-DarkBrownTint.svg} (100%) rename src/assets/img/tints/{BackGlass-NoShade-DaryGrayTint.svg => Glass-NoShade-DaryGrayTint.svg} (100%) rename src/assets/img/tints/{BackGlass-NoShade-GrayTint.svg => Glass-NoShade-GrayTint.svg} (100%) rename src/assets/img/tints/{BackGlass-NoShade-GreenTint.svg => Glass-NoShade-GreenTint.svg} (100%) rename src/assets/img/tints/{BackGlass-NoShade-NoTint.svg => Glass-NoShade-NoTint.svg} (100%) rename src/assets/img/tints/{BackGlass-NoShade-Privacy.svg => Glass-NoShade-Privacy.svg} (100%) diff --git a/src/assets/img/tints/BackGlass-BlueShade-BlueTint.svg b/src/assets/img/tints/Glass-BlueShade-BlueTint.svg similarity index 100% rename from src/assets/img/tints/BackGlass-BlueShade-BlueTint.svg rename to src/assets/img/tints/Glass-BlueShade-BlueTint.svg diff --git a/src/assets/img/tints/BackGlass-BlueShade-BrownTint.svg b/src/assets/img/tints/Glass-BlueShade-BrownTint.svg similarity index 100% rename from src/assets/img/tints/BackGlass-BlueShade-BrownTint.svg rename to src/assets/img/tints/Glass-BlueShade-BrownTint.svg diff --git a/src/assets/img/tints/BackGlass-BlueShade-GrayTint.svg b/src/assets/img/tints/Glass-BlueShade-GrayTint.svg similarity index 100% rename from src/assets/img/tints/BackGlass-BlueShade-GrayTint.svg rename to src/assets/img/tints/Glass-BlueShade-GrayTint.svg diff --git a/src/assets/img/tints/BackGlass-BlueShade-GreenTint.svg b/src/assets/img/tints/Glass-BlueShade-GreenTint.svg similarity index 100% rename from src/assets/img/tints/BackGlass-BlueShade-GreenTint.svg rename to src/assets/img/tints/Glass-BlueShade-GreenTint.svg diff --git a/src/assets/img/tints/BackGlass-BlueShade-NoTint.svg b/src/assets/img/tints/Glass-BlueShade-NoTint.svg similarity index 100% rename from src/assets/img/tints/BackGlass-BlueShade-NoTint.svg rename to src/assets/img/tints/Glass-BlueShade-NoTint.svg diff --git a/src/assets/img/tints/BackGlass-BrownShade-BrownTint.svg b/src/assets/img/tints/Glass-BrownShade-BrownTint.svg similarity index 100% rename from src/assets/img/tints/BackGlass-BrownShade-BrownTint.svg rename to src/assets/img/tints/Glass-BrownShade-BrownTint.svg diff --git a/src/assets/img/tints/BackGlass-GrayShade-BlueTint.svg b/src/assets/img/tints/Glass-GrayShade-BlueTint.svg similarity index 100% rename from src/assets/img/tints/BackGlass-GrayShade-BlueTint.svg rename to src/assets/img/tints/Glass-GrayShade-BlueTint.svg diff --git a/src/assets/img/tints/BackGlass-GrayShade-BrownTint.svg b/src/assets/img/tints/Glass-GrayShade-BrownTint.svg similarity index 100% rename from src/assets/img/tints/BackGlass-GrayShade-BrownTint.svg rename to src/assets/img/tints/Glass-GrayShade-BrownTint.svg diff --git a/src/assets/img/tints/BackGlass-GrayShade-GrayTint.svg b/src/assets/img/tints/Glass-GrayShade-GrayTint.svg similarity index 100% rename from src/assets/img/tints/BackGlass-GrayShade-GrayTint.svg rename to src/assets/img/tints/Glass-GrayShade-GrayTint.svg diff --git a/src/assets/img/tints/BackGlass-GrayShade-GreenTint.svg b/src/assets/img/tints/Glass-GrayShade-GreenTint.svg similarity index 100% rename from src/assets/img/tints/BackGlass-GrayShade-GreenTint.svg rename to src/assets/img/tints/Glass-GrayShade-GreenTint.svg diff --git a/src/assets/img/tints/BackGlass-GreenShade-BlueTint.svg b/src/assets/img/tints/Glass-GreenShade-BlueTint.svg similarity index 100% rename from src/assets/img/tints/BackGlass-GreenShade-BlueTint.svg rename to src/assets/img/tints/Glass-GreenShade-BlueTint.svg diff --git a/src/assets/img/tints/BackGlass-GreenShade-BrownTint.svg b/src/assets/img/tints/Glass-GreenShade-BrownTint.svg similarity index 100% rename from src/assets/img/tints/BackGlass-GreenShade-BrownTint.svg rename to src/assets/img/tints/Glass-GreenShade-BrownTint.svg diff --git a/src/assets/img/tints/BackGlass-GreenShade-GreenTint.svg b/src/assets/img/tints/Glass-GreenShade-GreenTint.svg similarity index 100% rename from src/assets/img/tints/BackGlass-GreenShade-GreenTint.svg rename to src/assets/img/tints/Glass-GreenShade-GreenTint.svg diff --git a/src/assets/img/tints/BackGlass-NoShade-BlueTint.svg b/src/assets/img/tints/Glass-NoShade-BlueTint.svg similarity index 100% rename from src/assets/img/tints/BackGlass-NoShade-BlueTint.svg rename to src/assets/img/tints/Glass-NoShade-BlueTint.svg diff --git a/src/assets/img/tints/BackGlass-NoShade-BrownTint.svg b/src/assets/img/tints/Glass-NoShade-BrownTint.svg similarity index 100% rename from src/assets/img/tints/BackGlass-NoShade-BrownTint.svg rename to src/assets/img/tints/Glass-NoShade-BrownTint.svg diff --git a/src/assets/img/tints/BackGlass-NoShade-DarkBrownTint.svg b/src/assets/img/tints/Glass-NoShade-DarkBrownTint.svg similarity index 100% rename from src/assets/img/tints/BackGlass-NoShade-DarkBrownTint.svg rename to src/assets/img/tints/Glass-NoShade-DarkBrownTint.svg diff --git a/src/assets/img/tints/BackGlass-NoShade-DaryGrayTint.svg b/src/assets/img/tints/Glass-NoShade-DaryGrayTint.svg similarity index 100% rename from src/assets/img/tints/BackGlass-NoShade-DaryGrayTint.svg rename to src/assets/img/tints/Glass-NoShade-DaryGrayTint.svg diff --git a/src/assets/img/tints/BackGlass-NoShade-GrayTint.svg b/src/assets/img/tints/Glass-NoShade-GrayTint.svg similarity index 100% rename from src/assets/img/tints/BackGlass-NoShade-GrayTint.svg rename to src/assets/img/tints/Glass-NoShade-GrayTint.svg diff --git a/src/assets/img/tints/BackGlass-NoShade-GreenTint.svg b/src/assets/img/tints/Glass-NoShade-GreenTint.svg similarity index 100% rename from src/assets/img/tints/BackGlass-NoShade-GreenTint.svg rename to src/assets/img/tints/Glass-NoShade-GreenTint.svg diff --git a/src/assets/img/tints/BackGlass-NoShade-NoTint.svg b/src/assets/img/tints/Glass-NoShade-NoTint.svg similarity index 100% rename from src/assets/img/tints/BackGlass-NoShade-NoTint.svg rename to src/assets/img/tints/Glass-NoShade-NoTint.svg diff --git a/src/assets/img/tints/BackGlass-NoShade-Privacy.svg b/src/assets/img/tints/Glass-NoShade-Privacy.svg similarity index 100% rename from src/assets/img/tints/BackGlass-NoShade-Privacy.svg rename to src/assets/img/tints/Glass-NoShade-Privacy.svg diff --git a/src/constants/tint-mapper.js b/src/constants/tint-mapper.js index 1291991f0..0b4d17df9 100644 --- a/src/constants/tint-mapper.js +++ b/src/constants/tint-mapper.js @@ -3,39 +3,39 @@ // Src assumes you have a @/assets/img/tints/, making the final value @/assets/img/tints/{Src} in the markup. // See vehicle-parts for implementation example. const tintMap = { - rear: [ + other: [ // Blue Shade - { name: "blue shade, blue tint", src: "BackGlass-BlueShade-BlueTint.svg" }, - { name: "blue shade, brown tint", src: "BackGlass-BlueShade-BrownTint.svg" }, - { name: "blue shade, gray tint", src: "BackGlass-BlueShade-GrayTint.svg" }, - { name: "blue shade, green tint", src: "BackGlass-BlueShade-GreenTint.svg" }, - { name: "blue shade", src: "BackGlass-BlueShade-NoTint.svg" }, + { 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 shade", src: "Glass-BlueShade-NoTint.svg" }, // Brown Shade - { name: "brown shade, brown tint", src: "BackGlass-BrownShade-BrownTint.svg" }, + { name: "brown shade, brown tint", src: "Glass-BrownShade-BrownTint.svg" }, // Gray Shade - { name: "gray shade, blue tint", src: "BackGlass-GrayShade-BlueTint.svg" }, - { name: "gray shade, brown tint", src: "BackGlass-GrayShade-BrownTint.svg" }, - { name: "gray shade, gray tint", src: "BackGlass-GrayShade-GrayTint.svg" }, - { name: "gray shade, green tint", src: "BackGlass-GrayShade-GreenTint.svg" }, + { 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" }, // Green Shade - { name: "green shade, blue tint", src: "BackGlass-GreenShade-BlueTint.svg" }, - { name: "green shade, brown tint", src: "BackGlass-GreenShade-BrownTint.svg" }, - { name: "green shade, green tint", src: "BackGlass-GreenShade-GreenTint.svg" }, + { 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" }, // Tints Only - { name: "blue tint", src: "BackGlass-NoShade-BlueTint.svg" }, - { name: "brown tint", src: "BackGlass-NoShade-BrownTint.svg" }, - { name: "dark brown tint", src: "BackGlass-NoShade-DarkBrownTint.svg" }, - { name: "dark gray tint", src: "BackGlass-NoShade-DarkGrayTint.svg" }, - { name: "gray tint", src: "BackGlass-NoShade-GrayTint.svg" }, - { name: "green tint", src: "BackGlass-NoShade-GreenTint.svg" }, - { name: "gray tint privacy", src: "BackGlass-NoShade-Privacy.svg" }, + { name: "blue tint", src: "Glass-NoShade-BlueTint.svg" }, + { name: "brown tint", src: "Glass-NoShade-BrownTint.svg" }, + { name: "dark brown tint", src: "Glass-NoShade-DarkBrownTint.svg" }, + { name: "dark gray tint", src: "Glass-NoShade-DarkGrayTint.svg" }, + { name: "gray tint", src: "Glass-NoShade-GrayTint.svg" }, + { name: "green tint", src: "Glass-NoShade-GreenTint.svg" }, + { name: "gray tint privacy", src: "Glass-NoShade-Privacy.svg" }, // No shade or tint - { name: "no shade, no tint", src: "BackGlass-NoShade-NoTint.svg" }, // ??? + { name: "no shade, no tint", src: "Glass-NoShade-NoTint.svg" }, // ??? ], windshield: [ @@ -80,6 +80,11 @@ const tintMap = { // Returns undefined if no items are found. export function getTintImage(glassLocation, colorString) { + // Windshield glass has special images, all other glass uses the same though. + if(glassLocation.toLowerCase() !== 'windshield'){ + glassLocation = 'other'; + } + if (tintMap[glassLocation.toLowerCase()] === undefined) { return ''; } diff --git a/src/layouts/vehicle-parts/vehicle-parts.vue b/src/layouts/vehicle-parts/vehicle-parts.vue index 06fa46341..72bf62d9c 100644 --- a/src/layouts/vehicle-parts/vehicle-parts.vue +++ b/src/layouts/vehicle-parts/vehicle-parts.vue @@ -36,7 +36,6 @@ import { settleAllPromises } from "@/helpers/layout-helper"; - export default { name: "vehicle-parts", async beforeRouteEnter(to, from, next) { @@ -102,80 +101,73 @@ export default { }, computed: { Parts() { - return [{ - glassLocation: "Rear", - glassName: "Stationary", - colorAnswers: [{ - ColorAnswerText: "Green Tint", + 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 + } + ] + } + + // Map API result data, to vehicle-parts data structure + const mappedData = partsData.partsOrQuestions.map(g => { + return { + glassName: g.glassName, + glassLocation: g.glassLocation, + colorAnswers: g.parts.reduce((arr, p) => { + + arr.push({ + ColorAnswerText: p.color, FeatureAnswers: [{ - FeatureAnswerText: "Backglass - heated glass, solar, 1 hole", - PartNumber: "test-backglass-green-tint-1-hole", - }, ], - }, - { - ColorAnswerText: "Green Tint", - FeatureAnswers: [{ - FeatureAnswerText: "Backglass - heated glass, solar, 2 hole", - PartNumber: "test-backglass-green-tint-2-hole", - }, ], - }, - { - ColorAnswerText: "Gray Tint Privacy", - FeatureAnswers: [{ - FeatureAnswerText: "Backglass - heated glass, solar, 3 hole", - PartNumber: "test-backglass-gray-tint-privacy-3-hole", - }, ], - }, - { - ColorAnswerText: "Gray Tint Privacy", - FeatureAnswers: [{ - FeatureAnswerText: "Backglass - heated glass, solar, 4 hole", - PartNumber: "test-backglass-blue-tint-4-hole", - }, ], - }, - ], - }, - { - glassLocation: "Windshield", - glassName: "Single", - colorAnswers: [{ - ColorAnswerText: "Blue Tint", - FeatureAnswers: [{ - FeatureAnswerText: "Windshield - heated glass, solar, 1 hole", - PartNumber: "test-windshield-blue-tint-1-hole", - }, ], - }, - { - ColorAnswerText: "Blue Tint", - FeatureAnswers: [{ - FeatureAnswerText: "Windshield -heated glass, solar, 2 hole", - PartNumber: "test-blue-tint-windshield-2-hole", - }, ], - }, - { - ColorAnswerText: "Gray Tint Privacy", - FeatureAnswers: [{ - FeatureAnswerText: "Windshield -heated glass, solar, 3 hole", - PartNumber: "test-gray-tint-privacy-windshield-3-hole", - }, ], - }, - { - ColorAnswerText: "Gray Tint Privacy", - FeatureAnswers: [{ - FeatureAnswerText: "Windshield -heated glass, solar, 4 hole", - PartNumber: "test-brown-tint-windshield-4-hole", - }, ], - }, - ], - }, - ]; + FeatureAnswerText: p.description, + PartNumber: p.partNumber + }] + }); + + return arr; + }, []) + } + }); + + return mappedData; }, }, methods: { arePagePrerequisitesValid(parameters) { // store.getters.damage.isRepair !== null; // parameters.PartsByGlassName.length > 0; - + return true; } }, From 57ee0fd29a9a5d3780881f0cee26ab9fe6d635df Mon Sep 17 00:00:00 2001 From: CarlNation Date: Thu, 24 Feb 2022 14:55:40 -0500 Subject: [PATCH 15/35] CSR-297 wip store updates. first of three page routes --- .../button-question/button-question.vue | 9 +- src/constants/endpoints.js | 4 + src/constants/store-mutations.js | 3 + .../replace-options-question.vue | 2 +- src/layouts/vehicle-damage/vehicle-damage.vue | 103 ++++++++++++++++-- .../windshield-chip-count-question.vue | 1 + src/router/router-constants/fmgPage-values.js | 2 + .../router-constants/navigation-scenarios.js | 2 + .../router-constants/router-parameter-keys.js | 5 + src/router/router-constants/routing-table.js | 17 +++ src/store/index.js | 14 ++- 11 files changed, 149 insertions(+), 13 deletions(-) create mode 100644 src/router/router-constants/router-parameter-keys.js diff --git a/src/common-components/button-question/button-question.vue b/src/common-components/button-question/button-question.vue index 531043cb4..89f05cda1 100644 --- a/src/common-components/button-question/button-question.vue +++ b/src/common-components/button-question/button-question.vue @@ -13,7 +13,7 @@ :key="answer.Name ? answer.Name : answer" @isCheckedChanged="handleCheckedChanged" :buttonID="answer.Name ? groupName + '-' + answer.Name : groupName + '-' + answer" - :value="answer.Name ? answer.Name : answer" + :value="getValues(answer)" :buttonLabel="answer.Text ? answer.Text : answer" :buttonLabelSubCopy="answer.SubText" :textPosition="textPosition" @@ -79,6 +79,7 @@ export default { modelValue: Array, validationRules: String, suppressError: Boolean, + useTextForValue: Boolean, }, computed: { getFieldSetClasses() { @@ -121,6 +122,12 @@ export default { }, }, methods: { + getValues(answer){ + if (this.useTextForValue){ + return answer.Text + } + return answer.Name ? answer.Name : answer; + }, handleCheckedChanged(val) { if(this.isMultiSelect && this.selectedValues) { // Add or remove item to array of data to emit diff --git a/src/constants/endpoints.js b/src/constants/endpoints.js index 3f258a310..24e5120bd 100644 --- a/src/constants/endpoints.js +++ b/src/constants/endpoints.js @@ -43,6 +43,10 @@ const endpoints = { url: "/vehicle/api/v1/vehicle/Lookup", method: "POST", }, + GetPartsOrQuestions: { + url: "/parts/api/v1/parts/parts-or-questions", + method: "POST", + }, }; export { endpoints }; diff --git a/src/constants/store-mutations.js b/src/constants/store-mutations.js index c572c4f69..6ac9b6926 100644 --- a/src/constants/store-mutations.js +++ b/src/constants/store-mutations.js @@ -10,6 +10,9 @@ const storeMutations = { UPDATE_VEHICLE_IMAGE_URL: "updateVehicleImageUrl", UPDATE_VEHICLE_IMAGE_VIF_NUMBER: "updateVehicleImageVifNumber", UPDATE_VEHICLE_IMAGE_COLOR: "updateVehicleImageColor", + UPDATE_IS_REPAIR: "updateIsRepair", + UPDATE_NUMBER_OF_CHIPS: "updateNumberOfChips", + UPDATE_GLASS_TO_REPLACE: "updateGlassToReplace", // EVENT BUS MUTATIONS ADD_EVENT_TO_BUS: "addEventToBus", diff --git a/src/layouts/vehicle-damage/replace-options-question/replace-options-question.vue b/src/layouts/vehicle-damage/replace-options-question/replace-options-question.vue index 978cf6b41..25eca62da 100644 --- a/src/layouts/vehicle-damage/replace-options-question/replace-options-question.vue +++ b/src/layouts/vehicle-damage/replace-options-question/replace-options-question.vue @@ -52,7 +52,7 @@ export default ({ }, updateSelectedValues() { // UPDATE SELECTEDVALUES IF ONLY ONE ANSWER - if(Array.isArray(this.answersToDisplay) && this.answersToDisplay.length === 1 && this.selectedValues) { + if(Array.isArray(this.answersToDisplay) && this.answersToDisplay.length === 1) { this.selectedValues = [this.answersToDisplay[0].Name]; } }, diff --git a/src/layouts/vehicle-damage/vehicle-damage.vue b/src/layouts/vehicle-damage/vehicle-damage.vue index aa888e14a..cef8e076c 100644 --- a/src/layouts/vehicle-damage/vehicle-damage.vue +++ b/src/layouts/vehicle-damage/vehicle-damage.vue @@ -25,7 +25,7 @@ v-model="selectedRearReplaceOptions" groupName="BackGlassReplaceOptionsQuestion" /> - +
@@ -41,6 +41,7 @@ import windshieldOptions from "@/layouts/vehicle-damage/windshield-options/winds import replaceOptionsQuestion from "@/layouts/vehicle-damage/replace-options-question/replace-options-question"; // Supporting files +import { routerParameterKeys } from "@/router/router-constants/router-parameter-keys"; import { fetchCmsContentForPage } from "@/helpers/cms-content-helper"; import { settleAllPromises } from "@/helpers/layout-helper"; import { storeActions } from "@/constants/store-actions"; @@ -102,14 +103,6 @@ export default { ); }); }, - computed: { - isRearWindowDamageLocation() { - return this.selectedDamageLocations.some(selectedDamages => - { - return selectedDamages.toUpperCase() === "REARWINDOW"; - }); - }, - }, data(){ return { selectedDamageLocations: [], @@ -137,7 +130,99 @@ export default { this.$route ); }, + async forwardButtonAction() { + var windshieldChipCount = this.selectedWindshieldOptions.selectedWindshieldChipCount && this.isWindshieldDamageLocation ? + this.selectedWindshieldOptions.selectedWindshieldChipCount[0] : null; + + this.$store.commit(this.storeMutations.UPDATE_IS_REPAIR, this.isWindshieldRepair); + + if (windshieldChipCount){ + this.$store.commit(this.storeMutations.UPDATE_NUMBER_OF_CHIPS, parseInt(windshieldChipCount)); + } + + this.$store.commit(this.storeMutations.UPDATE_GLASS_TO_REPLACE, this.selectedGlassToReplace()); + + 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}); + }, + + selectedGlassToReplace() { + var selectedGlassToReplace = []; + if (this.isWindshieldDamageLocation && !this.isWindshieldRepair){ + this.selectedWindshieldOptions.selectedWindshieldReplaceOptions.forEach(wsItem => { + selectedGlassToReplace.push({ location: "Windshield", name: wsItem}); + }) + } + + if (this.isDriverSideReplace){ + this.sideDoorOptionsData.selectedDriverSideReplaceOptions.forEach(driverItem => { + selectedGlassToReplace.push({ location: "Driver", name: driverItem}); + }) + } + + if (this.isPassengerSideReplace){ + this.sideDoorOptionsData.selectedPassengerSideReplaceOptions.forEach(passengerItem => { + selectedGlassToReplace.push({ location: "Passenger", name: passengerItem}); + }) + selectedGlassToReplace = Array.prototype.concat.apply([], [selectedGlassToReplace, this.sideDoorOptionsData.selectedDoorSides.selectedPassengerSideReplaceOptions]); + } + + if (this.isRearWindowDamageLocation) { + this.selectedRearReplaceOptions.forEach(rearItem => { + selectedGlassToReplace.push({ location: "Rear", name: rearItem}); + }) + } + + return selectedGlassToReplace; + }, }, + computed:{ + isWindshieldDamageLocation() { + return this.selectedDamageLocations.some(selectedDamages => + { + return selectedDamages.toUpperCase() === "WINDSHIELD"; + }); + }, + isSideDoorDamageLocation() { + return this.selectedDamageLocations.some(selectedDamages => + { + return selectedDamages.toUpperCase() === "SIDEDOOR"; + }); + }, + isRearWindowDamageLocation() { + return this.selectedDamageLocations.some(selectedDamages => + { + return selectedDamages.toUpperCase() === "REARWINDOW"; + }); + }, + isWindshieldRepair() { + if (!this.isWindshieldDamageLocation) return false; + + return this.selectedWindshieldOptions.selectedWindshieldDamageType.some(selectedDamageType => + { + return selectedDamageType.toUpperCase() === "REPAIR"; + }); + }, + isDriverSideReplace() { + if (!this.isSideDoorDamageLocation) return false; + + return this.sideDoorOptionsData.selectedDoorSides.some(selectedDriverSide => + { + return selectedDriverSide.toUpperCase() === "DRIVERSIDE"; + }); + }, + isPassengerSideReplace() { + if (!this.isSideDoorDamageLocation) return false; + + return this.sideDoorOptionsData.selectedDoorSides.some(selectedPassengerSide => + { + return selectedPassengerSide.toUpperCase() === "PASSENGERSIDE"; + }); + } + }, + components: { funnelHeader, funnelFooter, diff --git a/src/layouts/vehicle-damage/windshield-options/windshield-chip-count-question/windshield-chip-count-question.vue b/src/layouts/vehicle-damage/windshield-options/windshield-chip-count-question/windshield-chip-count-question.vue index 347ee2fdf..3226d9656 100644 --- a/src/layouts/vehicle-damage/windshield-options/windshield-chip-count-question/windshield-chip-count-question.vue +++ b/src/layouts/vehicle-damage/windshield-options/windshield-chip-count-question/windshield-chip-count-question.vue @@ -6,6 +6,7 @@ :answers="answersFromCms" :groupName="groupName" buttonType="listButtonHorizontal" + useTextForValue v-model="selectedChipCountValues" />
diff --git a/src/router/router-constants/fmgPage-values.js b/src/router/router-constants/fmgPage-values.js index 9b82cdf7e..a23ba7eb6 100644 --- a/src/router/router-constants/fmgPage-values.js +++ b/src/router/router-constants/fmgPage-values.js @@ -4,6 +4,8 @@ const fmgPageValues = { VEHICLE_MODEL: "vehicle-model", VEHICLE_STYLE: "vehicle-style", VEHICLE_DAMAGE: "vehicle-damage", + VEHICLE_PARTS: "vehicle-parts", + QUOTE : "quote", }; export { fmgPageValues }; diff --git a/src/router/router-constants/navigation-scenarios.js b/src/router/router-constants/navigation-scenarios.js index 48e36996b..05c95a7d6 100644 --- a/src/router/router-constants/navigation-scenarios.js +++ b/src/router/router-constants/navigation-scenarios.js @@ -4,6 +4,8 @@ const navigationScenarios = { SELECTED_MAKE: "SELECTED_MAKE", SELECTED_STYLE: "SELECTED_STYLE", CLICKED_BACK: "CLICKED_BACK", + SELECTED_DAMAGE_WITH_SINGLE_PART: "SELECTED_DAMAGE_WITH_SINGLE_PART", + SELECTED_GLASS_MULTIPLE_PARTS: "SELECTED_GLASS_MULTIPLE_PARTS" }; export { navigationScenarios }; diff --git a/src/router/router-constants/router-parameter-keys.js b/src/router/router-constants/router-parameter-keys.js new file mode 100644 index 000000000..27f6a54b0 --- /dev/null +++ b/src/router/router-constants/router-parameter-keys.js @@ -0,0 +1,5 @@ +const routerParameterKeys = { + VEHICLE_PARTS_DATA: "vehiclePartsData", + }; + + export { routerParameterKeys }; \ No newline at end of file diff --git a/src/router/router-constants/routing-table.js b/src/router/router-constants/routing-table.js index 88c47563c..c5018716c 100644 --- a/src/router/router-constants/routing-table.js +++ b/src/router/router-constants/routing-table.js @@ -57,6 +57,23 @@ const routingTable = [ scenario: navigationScenarios.CLICKED_BACK, destinationFmgPageValue: fmgPageValues.VEHICLE_STYLE, }, + { + scenario: navigationScenarios.SELECTED_DAMAGE_WITH_SINGLE_PART, + destinationFmgPageValue: fmgPageValues.QUOTE, + }, + ], + }, + { + fmgPageValue: fmgPageValues.VEHICLE_DAMAGE, + maps: [ + { + scenario: navigationScenarios.CLICKED_BACK, + destinationFmgPageValue: fmgPageValues.VEHICLE_STYLE, + }, + { + scenario: navigationScenarios.SELECTED_GLASS_MULTIPLE_PARTS, + destinationFmgPageValue: fmgPageValues.VEHICLE_PARTS, + }, ], }, ]; diff --git a/src/store/index.js b/src/store/index.js index 7feea102d..c46b0f1cf 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -66,6 +66,16 @@ export const mutations = { updateVehicleImageColor(state, imageColor) { state.order.vehicle.imageColor = imageColor; }, + updateIsRepair(state, isRepair){ + state.order.damage.isRepair = isRepair; + }, + updateNumberOfChips(state, numberOfChips){ + state.order.damage.numberOfChips = numberOfChips; + }, + updateGlassToReplace(state, glassToReplace){ + state.order.damage.glassToReplace = glassToReplace; + }, + // EVENT BUS MUTATIONS addEventToBus(state, event) { @@ -252,8 +262,8 @@ export const actions = { // Parts API Actions getPartsOrQuestions(context, { carId, glassArray, zipCode, vin = '' }) { return globalMethods.callHttpClient({ - method: endpoints.GetRouteInfo.method, - endpoint: endpoints.GetRouteInfo.url, + method: endpoints.GetPartsOrQuestions.method, + endpoint: endpoints.GetPartsOrQuestions.url, payload: { carId: carId, glass: glassArray, From 7daa6675522510717f5ab6a3594d14f1a036ebfb Mon Sep 17 00:00:00 2001 From: FrankRua Date: Thu, 24 Feb 2022 15:02:57 -0500 Subject: [PATCH 16/35] state changes --- src/constants/store-actions.js | 8 +++---- src/constants/store-mutations.js | 8 +++---- src/layouts/form-test/form-test.vue | 2 +- .../vehicle-damage/vehicle-damage.spec.js | 2 +- src/layouts/vehicle-damage/vehicle-damage.vue | 2 +- src/layouts/vehicle-make/vehicle-make.spec.js | 4 ++-- src/layouts/vehicle-make/vehicle-make.vue | 4 ++-- .../vehicle-model/vehicle-model.spec.js | 4 ++-- src/layouts/vehicle-model/vehicle-model.vue | 4 ++-- .../part-question/part-question.vue | 3 ++- src/layouts/vehicle-parts/vehicle-parts.vue | 9 ++++--- src/layouts/vehicle-style/vehicle-style.vue | 4 ++-- src/layouts/vehicle-year/vehicle-year.spec.js | 4 ++-- src/layouts/vehicle-year/vehicle-year.vue | 4 ++-- src/store/index.js | 24 +++++++++---------- src/store/store.spec.js | 16 ++++++------- src/ux-components/radio/radio.vue | 2 +- 17 files changed, 54 insertions(+), 50 deletions(-) diff --git a/src/constants/store-actions.js b/src/constants/store-actions.js index dddab1d66..0717a3498 100644 --- a/src/constants/store-actions.js +++ b/src/constants/store-actions.js @@ -14,10 +14,10 @@ const storeActions = { GET_PARTS_OR_QUESTIONS: "getPartsOrQuestions", // DEPENDENCY MUTATIONS - RESET_VEHICLE_AND_DEPS: "resetVehicleAndDependencies", - RESET_DAMAGE_AND_DEPS: "resetDamageAndDependencies", - RESET_REGISTRATION_AND_DEPS: "resetRegistrationAndDependencies", - RESET_PARTS_AND_DEPS: "resetPartsAndDependencies", + RESET_VEHICLE_STATE: "resetVehicleAndDependencies", + RESET_DAMAGE_STATE: "resetDamageAndDependencies", + RESET_REGISTRATION_STATE: "resetRegistrationAndDependencies", + RESET_PARTS_STATE: "resetPartsAndDependencies", }; export { storeActions }; diff --git a/src/constants/store-mutations.js b/src/constants/store-mutations.js index c572c4f69..9034d594f 100644 --- a/src/constants/store-mutations.js +++ b/src/constants/store-mutations.js @@ -16,10 +16,10 @@ const storeMutations = { REMOVE_EVENT_FROM_BUS: "removeEventFromBus", // DEPENDENCY MUTATIONS - RESET_VEHICLE_AND_DEPS: "resetVehicleAndDependencies", - RESET_DAMAGE_AND_DEPS: "resetDamageAndDependencies", - RESET_REGISTRATION_AND_DEPS: "resetRegistrationAndDependencies", - RESET_PARTS_AND_DEPS: "resetPartsAndDependencies", + RESET_VEHICLE_STATE: "resetVehicleState", + RESET_DAMAGE_STATE: "resetDamageState", + RESET_REGISTRATION_STATE: "resetRegistrationState", + RESET_PARTS_STATE: "resetPartsState", }; diff --git a/src/layouts/form-test/form-test.vue b/src/layouts/form-test/form-test.vue index f12abb261..774d863a8 100644 --- a/src/layouts/form-test/form-test.vue +++ b/src/layouts/form-test/form-test.vue @@ -144,7 +144,7 @@ export default { }, resetDependentState() { // Invokes - store.dispatch(storeActions.RESET_PARTS_AND_DEPS); + store.dispatch(storeActions.RESET_PARTS_STATE); }, onSubmit(values) { window.alert('Success! Submitted values: ' + JSON.stringify(values, null ,2)) diff --git a/src/layouts/vehicle-damage/vehicle-damage.spec.js b/src/layouts/vehicle-damage/vehicle-damage.spec.js index 519d33457..d01febba1 100644 --- a/src/layouts/vehicle-damage/vehicle-damage.spec.js +++ b/src/layouts/vehicle-damage/vehicle-damage.spec.js @@ -162,7 +162,7 @@ describe("vehicle-damage.vue", () => { wrapper.vm.resetDependentState(); //Assert - expect(store.dispatch).toBeCalledWith(storeActions.RESET_PARTS_AND_DEPS) + expect(store.dispatch).toBeCalledWith(storeActions.RESET_PARTS_STATE) }); }); diff --git a/src/layouts/vehicle-damage/vehicle-damage.vue b/src/layouts/vehicle-damage/vehicle-damage.vue index aa888e14a..2188d4845 100644 --- a/src/layouts/vehicle-damage/vehicle-damage.vue +++ b/src/layouts/vehicle-damage/vehicle-damage.vue @@ -128,7 +128,7 @@ export default { }, resetDependentState() { // Invokes - store.dispatch(storeActions.RESET_PARTS_AND_DEPS); + store.dispatch(storeActions.RESET_PARTS_STATE); }, backButtonAction() { // route to move backwards diff --git a/src/layouts/vehicle-make/vehicle-make.spec.js b/src/layouts/vehicle-make/vehicle-make.spec.js index b2c4dcaf7..ab04bb1d2 100644 --- a/src/layouts/vehicle-make/vehicle-make.spec.js +++ b/src/layouts/vehicle-make/vehicle-make.spec.js @@ -223,8 +223,8 @@ describe("vehicle-make.vue", () => { expect(store.commit).toBeCalledWith(storeMutations.UPDATE_CAR_ID, null) expect(store.commit).toBeCalledWith(storeMutations.UPDATE_VEHICLE_CATEGORY, null) - expect(store.dispatch).toBeCalledWith(storeActions.RESET_DAMAGE_AND_DEPS) - expect(store.dispatch).toBeCalledWith(storeActions.RESET_REGISTRATION_AND_DEPS) + expect(store.dispatch).toBeCalledWith(storeActions.RESET_DAMAGE_STATE) + expect(store.dispatch).toBeCalledWith(storeActions.RESET_REGISTRATION_STATE) }); }); diff --git a/src/layouts/vehicle-make/vehicle-make.vue b/src/layouts/vehicle-make/vehicle-make.vue index c91379318..41c19a64c 100644 --- a/src/layouts/vehicle-make/vehicle-make.vue +++ b/src/layouts/vehicle-make/vehicle-make.vue @@ -94,8 +94,8 @@ export default { store.commit(storeMutations.UPDATE_VEHICLE_CATEGORY, null); // Invokes - store.dispatch(storeActions.RESET_DAMAGE_AND_DEPS); - store.dispatch(storeActions.RESET_REGISTRATION_AND_DEPS); + store.dispatch(storeActions.RESET_DAMAGE_STATE); + store.dispatch(storeActions.RESET_REGISTRATION_STATE); }, }, diff --git a/src/layouts/vehicle-model/vehicle-model.spec.js b/src/layouts/vehicle-model/vehicle-model.spec.js index 7f8f96eb6..4e40a89cb 100644 --- a/src/layouts/vehicle-model/vehicle-model.spec.js +++ b/src/layouts/vehicle-model/vehicle-model.spec.js @@ -208,8 +208,8 @@ describe("vehicle-model.vue", () => { expect(store.commit).toBeCalledWith(storeMutations.UPDATE_CAR_ID, null) expect(store.commit).toBeCalledWith(storeMutations.UPDATE_VEHICLE_CATEGORY, null) - expect(store.dispatch).toBeCalledWith(storeActions.RESET_DAMAGE_AND_DEPS) - expect(store.dispatch).toBeCalledWith(storeActions.RESET_REGISTRATION_AND_DEPS) + expect(store.dispatch).toBeCalledWith(storeActions.RESET_DAMAGE_STATE) + expect(store.dispatch).toBeCalledWith(storeActions.RESET_REGISTRATION_STATE) }); }); diff --git a/src/layouts/vehicle-model/vehicle-model.vue b/src/layouts/vehicle-model/vehicle-model.vue index 02de04c3b..f57429c8b 100644 --- a/src/layouts/vehicle-model/vehicle-model.vue +++ b/src/layouts/vehicle-model/vehicle-model.vue @@ -94,8 +94,8 @@ export default { store.commit(storeMutations.UPDATE_VEHICLE_CATEGORY, null); // Invokes - store.dispatch(storeActions.RESET_DAMAGE_AND_DEPS); - store.dispatch(storeActions.RESET_REGISTRATION_AND_DEPS); + store.dispatch(storeActions.RESET_DAMAGE_STATE); + store.dispatch(storeActions.RESET_REGISTRATION_STATE); }, }, diff --git a/src/layouts/vehicle-parts/part-question/part-question.vue b/src/layouts/vehicle-parts/part-question/part-question.vue index 9a7e63df6..7046e1b79 100644 --- a/src/layouts/vehicle-parts/part-question/part-question.vue +++ b/src/layouts/vehicle-parts/part-question/part-question.vue @@ -1,7 +1,7 @@ diff --git a/src/mixins/base-mixin.js b/src/mixins/base-mixin.js index d37ba38d7..d46841b6a 100644 --- a/src/mixins/base-mixin.js +++ b/src/mixins/base-mixin.js @@ -18,6 +18,9 @@ export default { return store.dispatch(type, payload); }, + savePageDataToStore(page, data){ + store.commit(storeMutations.UPDATE_PAGE_DATA, { page: page, data: data }); + } }, computed: { storeActions() { diff --git a/src/router/index.js b/src/router/index.js index 0195dd8d9..bd3254d02 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -1,6 +1,7 @@ // Supporting files import { createWebHistory, createRouter } from "vue-router"; import { storeActions } from "@/constants/store-actions"; +import baseMixin from "@/mixins/base-mixin"; import { lazyLoadComponent } from "@/router/dynamic-routing/component-loader.js"; import { routingTable } from "@/router/router-constants/routing-table.js"; import { globalEvents, globalEventTypes } from "@/constants/events"; @@ -55,7 +56,7 @@ const routes = [ .getRoutes() .filter((x) => x.name === to.query.fmgPage)[0].components; - if (!arePagePrerequisitesValid(component, to.params)) { + if (!arePagePrerequisitesValid(component)) { await GoToFunnelStartOn404(next); } @@ -80,7 +81,7 @@ const routes = [ .filter((x) => x.name === routeData[0].name)[0] .components.default(); - if (!arePagePrerequisitesValid(nextComponent, to.params)) { + if (!arePagePrerequisitesValid(nextComponent)) { await GoToFunnelStartOn404(next); } @@ -108,18 +109,18 @@ const router = createRouter({ //---------------------------------------------------------- Router Functions ---------------------------------------------------------- -router.navigate = (scenario, currentRoute, optionalQuery = {}, optionalParams = {}) => { - navigate(scenario, currentRoute, false, optionalQuery, optionalParams); +router.navigate = (scenario, currentRoute, optionalQuery = {}, optionalParams = {}, optionalPageData = {}) => { + navigate(scenario, currentRoute, false, optionalQuery, optionalParams, optionalPageData); } -router.navigateAfterSave = (scenario, currentRoute, optionalQuery = {}, optionalParams = {}) => { - navigate(scenario, currentRoute, true, optionalQuery, optionalParams); +router.navigateAfterSave = (scenario, currentRoute, optionalQuery = {}, optionalParams = {}, optionalPageData = {}) => { + navigate(scenario, currentRoute, true, optionalQuery, optionalParams, optionalPageData); } // PRIVATE FUNCTIONS // Navigate to the next route, depending on the scenario. -function navigate(scenario, currentRoute, invalidateOnSave, optionalQuery = {}, optionalParams = {}) { +function navigate(scenario, currentRoute, invalidateOnSave, optionalQuery = {}, optionalParams = {}, optionalPageData = {}) { if (!scenario) { console.error("No scenario provided. Please review the routing table."); return; @@ -138,6 +139,9 @@ function navigate(scenario, currentRoute, invalidateOnSave, optionalQuery = {}, resetDependentState(currentComponent); } + // Append page data to the store for the NEXT page, if any. It will be an empty object if none is provided. + baseMixin.methods.savePageDataToStore(matchingScenarioMap.destinationFmgPageValue, optionalPageData); + router.push({ name: "root", query: Object.assign(optionalQuery, { @@ -217,8 +221,8 @@ async function GoToFunnelStartOn404(next) { } // Checks arePagePrerequisitesValid on the component passed in. -function arePagePrerequisitesValid(component, parameters = {}) { - return component.default.methods.arePagePrerequisitesValid(parameters); +function arePagePrerequisitesValid(component) { + return component.default.methods.arePagePrerequisitesValid(); } // Reset dependant state on route change. diff --git a/src/router/router-constants/router-parameter-keys.js b/src/router/router-constants/router-parameter-keys.js index 27f6a54b0..0c75eb738 100644 --- a/src/router/router-constants/router-parameter-keys.js +++ b/src/router/router-constants/router-parameter-keys.js @@ -1,5 +1,3 @@ -const routerParameterKeys = { - VEHICLE_PARTS_DATA: "vehiclePartsData", - }; +const routerParameterKeys = { }; export { routerParameterKeys }; \ No newline at end of file diff --git a/src/router/router-constants/routing-table.js b/src/router/router-constants/routing-table.js index c5018716c..1e5b9833f 100644 --- a/src/router/router-constants/routing-table.js +++ b/src/router/router-constants/routing-table.js @@ -76,6 +76,19 @@ const routingTable = [ }, ], }, + { + fmgPageValue: fmgPageValues.VEHICLE_PARTS, + maps: [ + { + scenario: navigationScenarios.CLICKED_BACK, + destinationFmgPageValue: fmgPageValues.VEHICLE_DAMAGE, + }, + { + scenario: navigationScenarios.SELECTED_PARTS, + destinationFmgPageValue: fmgPageValues.QUOTE, + }, + ], + }, ]; export { routingTable }; diff --git a/src/store/index.js b/src/store/index.js index 24cd4ef24..619f4a950 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -27,12 +27,12 @@ export const state = { }, lineItems:{ glassParts: null, - childParts: null, otherParts: null } }, applicationUser: { eventBus: [], + pageData: {} }, } @@ -75,7 +75,12 @@ export const mutations = { updateGlassToReplace(state, glassToReplace){ state.order.damage.glassToReplace = glassToReplace; }, - + updateParts(state, partsData){ + state.order.lineItems.glassParts = partsData; + }, + updatePageData(state, pageData){ + state.applicationUser.pageData[pageData.page] = pageData.data; + }, // EVENT BUS MUTATIONS addEventToBus(state, event) { @@ -136,7 +141,10 @@ export const getters = { }, eventBus: (state) => state.applicationUser.eventBus, damage: (state) => state.order.damage, - lineItems: (state) => state.order.lineItems + lineItems: (state) => state.order.lineItems, + pageData: (state) => (page) => { + return state.applicationUser.pageData[page]; + } } // Export Actions From 0ab33965022c703df06c40059a1ecd8735260358 Mon Sep 17 00:00:00 2001 From: FrankRua Date: Fri, 25 Feb 2022 15:58:49 -0500 Subject: [PATCH 21/35] rename var --- src/layouts/vehicle-parts/vehicle-parts.vue | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/src/layouts/vehicle-parts/vehicle-parts.vue b/src/layouts/vehicle-parts/vehicle-parts.vue index 3bb3b9f41..f6d99bcf4 100644 --- a/src/layouts/vehicle-parts/vehicle-parts.vue +++ b/src/layouts/vehicle-parts/vehicle-parts.vue @@ -11,7 +11,7 @@
-
+
@@ -108,7 +108,7 @@ export default { alert, }, computed: { - Parts() { + PartsForQuestions() { const partsData = store.getters.pageData(this.$route.query.fmgPage); // Map API result data, to vehicle-parts data structure @@ -131,6 +131,11 @@ export default { return mappedData; }, + + PartsFromApi() { + return store.getters.pageData(fmgPageValues.VEHICLE_PARTS); + } + }, methods: { arePagePrerequisitesValid() { @@ -149,6 +154,7 @@ export default { }, forwardButtonAction() { + const p = this.PartsFromApi; const pickedParts = ''; } From 62fbdd916b73271b5162de0ad281acceba4935ef Mon Sep 17 00:00:00 2001 From: FrankRua Date: Sun, 27 Feb 2022 14:56:05 -0500 Subject: [PATCH 22/35] Match selected parts to API parts --- src/layouts/vehicle-parts/vehicle-parts.vue | 36 +++++++++++++++++++-- 1 file changed, 34 insertions(+), 2 deletions(-) diff --git a/src/layouts/vehicle-parts/vehicle-parts.vue b/src/layouts/vehicle-parts/vehicle-parts.vue index f6d99bcf4..86936637d 100644 --- a/src/layouts/vehicle-parts/vehicle-parts.vue +++ b/src/layouts/vehicle-parts/vehicle-parts.vue @@ -154,8 +154,40 @@ export default { }, forwardButtonAction() { - const p = this.PartsFromApi; - const pickedParts = ''; + + // Temporary solution to prevent the user from going forward if they have not selected anything. + // will be replaced by validation in the future. + if(Object.keys(this.glassParts).length === 0) { + throw new Error("No parts selected"); + } + + const selectedGlassPartNumbers = []; + const matchedParts = []; + + // Compile all selected parts from the page. + for (let [key, value] of Object.entries(this.glassParts)) { + for (let [glassKey, glassValue] of Object.entries(value)) { + selectedGlassPartNumbers.push(glassValue[0]); + } + } + + // Match them to the parts from the API. + for (let [key, value] of Object.entries(this.PartsFromApi.partsOrQuestions)) { + for (let [partKey, partValue] of Object.entries(value.parts)) { + const currentPart = this.PartsFromApi.partsOrQuestions[key].parts[partKey]; + const isMatched = selectedGlassPartNumbers.some(p => p === currentPart.partNumber); + + if (isMatched) { + matchedParts.push(currentPart); + } + } + } + + // If no parts could be matched, throw an error. + if(matchedParts.length === 0) { + throw new Error("Could not match any parts to the selected parts"); + } + } }, From 0402cc720f40c2769cb6714de9a28335d49f35d2 Mon Sep 17 00:00:00 2001 From: FrankRua Date: Mon, 28 Feb 2022 10:25:06 -0500 Subject: [PATCH 23/35] naibagte forward --- src/layouts/vehicle-parts/vehicle-parts.vue | 26 ++++++++------------- 1 file changed, 10 insertions(+), 16 deletions(-) diff --git a/src/layouts/vehicle-parts/vehicle-parts.vue b/src/layouts/vehicle-parts/vehicle-parts.vue index 86936637d..dd591905a 100644 --- a/src/layouts/vehicle-parts/vehicle-parts.vue +++ b/src/layouts/vehicle-parts/vehicle-parts.vue @@ -33,16 +33,12 @@ 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 {fmgPageValues} from "@/router/router-constants/fmgPage-values"; +import {storeMutations} from "@/constants/store-mutations"; import store from "@/store"; -import { - fmgPageValues -} from "@/router/router-constants/fmgPage-values"; + export default { name: "vehicle-parts", @@ -154,13 +150,6 @@ export default { }, forwardButtonAction() { - - // Temporary solution to prevent the user from going forward if they have not selected anything. - // will be replaced by validation in the future. - if(Object.keys(this.glassParts).length === 0) { - throw new Error("No parts selected"); - } - const selectedGlassPartNumbers = []; const matchedParts = []; @@ -188,6 +177,11 @@ export default { throw new Error("Could not match any parts to the selected parts"); } + // Save parts to the store. + store.commit(storeMutations.UPDATE_PARTS, matchedParts); + + // Navigate to the next page. + } }, From 6f614e9a631d406bccdfe669012be3c04f0be23c Mon Sep 17 00:00:00 2001 From: CarlNation Date: Mon, 28 Feb 2022 10:51:13 -0500 Subject: [PATCH 24/35] CSR-297 wip plus CSR-335 --- src/global-methods.js | 12 +- src/helpers/unit-test-helper.js | 15 + src/layouts/part-questions/part-questions.vue | 81 ++++ src/layouts/reveal/reveal.vue | 69 +++ .../vehicle-damage/vehicle-damage.spec.js | 455 +++++++++++++----- src/layouts/vehicle-damage/vehicle-damage.vue | 38 +- src/layouts/vehicle-parts/vehicle-parts.vue | 8 +- src/router/index.js | 2 +- src/router/router-constants/fmgPage-values.js | 5 +- .../router-constants/navigation-scenarios.js | 3 +- src/router/router-constants/routing-table.js | 17 +- src/store/index.js | 2 +- 12 files changed, 559 insertions(+), 148 deletions(-) create mode 100644 src/layouts/part-questions/part-questions.vue create mode 100644 src/layouts/reveal/reveal.vue diff --git a/src/global-methods.js b/src/global-methods.js index 9df098b7d..716b27e66 100644 --- a/src/global-methods.js +++ b/src/global-methods.js @@ -5,11 +5,15 @@ import httpStatusCodes from "http-status-codes"; export default { callHttpClient({ method, endpoint, payload }) { return new Promise((resolve, reject) => { - const apiGatewayUrl = applicationConfig.CONSUMER_APIGATEWAY_URL; + var apiGatewayUrl = applicationConfig.CONSUMER_APIGATEWAY_URL; const payloadAndAnalyticsData = Object.assign({}, payload, { AppName: "FixMyGlass", }); + if (endpoint.toLowerCase().includes("/parts/")){ + apiGatewayUrl = "https://localhost:44335"; + } + axios({ method: method, url: apiGatewayUrl + endpoint, @@ -19,7 +23,11 @@ export default { }).then( (response) => { if (response.status == httpStatusCodes.OK) { - resolve(response); + if(response.data == undefined || response.data == {}) { + reject(response); + }else{ + resolve(response); + } } else { reject(response); } diff --git a/src/helpers/unit-test-helper.js b/src/helpers/unit-test-helper.js index 4e5d86786..225704aa1 100644 --- a/src/helpers/unit-test-helper.js +++ b/src/helpers/unit-test-helper.js @@ -2,11 +2,26 @@ import { storeActions } from "@/constants/store-actions"; import { storeMutations } from "@/constants/store-mutations.js"; import { navigationScenarios } from "@/router/router-constants/navigation-scenarios.js"; import { vehicleCategories } from "@/constants/vehicle-categories.js"; +import baseMixin from "@/mixins/base-mixin"; export function getMountOptions(mockData) { // Define our mocks to attached to the 'global' object for Vue/Jest. const mocks = {}; + //this is mocking if you use the mixin directly(baseMixin.methods.dispatchNonBlockingStoreAction) vs this.dispatchNonBlockingStoreAction + baseMixin.methods.dispatchNonBlockingStoreAction = jest.fn(); + baseMixin.methods.dispatchNonBlockingStoreAction.mockImplementation((actionName) => { + let actionFilterResult = mockData.actionList.filter( + (x) => x.actionName == actionName + ); + + if (actionFilterResult.length > 0 && actionFilterResult.length === 1) { + return Promise.resolve({ + data: actionFilterResult[0].data, + }); + } + }); + mocks.dispatchNonBlockingStoreAction = jest.fn(); mocks.dispatchNonBlockingStoreAction.mockImplementation((actionName) => { let actionFilterResult = mockData.actionList.filter( diff --git a/src/layouts/part-questions/part-questions.vue b/src/layouts/part-questions/part-questions.vue new file mode 100644 index 000000000..e29b05ac4 --- /dev/null +++ b/src/layouts/part-questions/part-questions.vue @@ -0,0 +1,81 @@ + + + diff --git a/src/layouts/reveal/reveal.vue b/src/layouts/reveal/reveal.vue new file mode 100644 index 000000000..21ca0c6ac --- /dev/null +++ b/src/layouts/reveal/reveal.vue @@ -0,0 +1,69 @@ + + + diff --git a/src/layouts/vehicle-damage/vehicle-damage.spec.js b/src/layouts/vehicle-damage/vehicle-damage.spec.js index d01febba1..d903349da 100644 --- a/src/layouts/vehicle-damage/vehicle-damage.spec.js +++ b/src/layouts/vehicle-damage/vehicle-damage.spec.js @@ -17,6 +17,7 @@ import { shallowMount } from "@vue/test-utils"; import { getMountOptions } from "@/helpers/unit-test-helper.js"; import { nextTick } from "vue"; import { storeActions } from "@/constants/store-actions"; +import { storeMutations } from "@/constants/store-mutations"; import store from "@/store"; // Mock our module for promises. @@ -40,42 +41,214 @@ jest.mock("@/store", () => ({ }, })); -describe("vehicle-damage.vue", () => { - test("Page header is initailized with api data", async (done) => { - //Arrange - const pageHeaderWidgetHeaderText = "Select Damage"; - const { wrapper, apiPromise } = setupMocks({ - pageHeaderWidgetHeaderText: pageHeaderWidgetHeaderText, - }); +// describe("vehicle-damage.vue", () => { +// test("Page header is initailized with api data", async (done) => { +// //Arrange +// const pageHeaderWidgetHeaderText = "Select Damage"; +// const { wrapper, apiPromise } = setupMocks({ +// pageHeaderWidgetHeaderText: pageHeaderWidgetHeaderText, +// }); - //Act - vehicleDamage.beforeRouteEnter.call( - wrapper.vm, - { query: { fmgPage: "vehicle-damage" } }, - undefined, - (c) => c(wrapper.vm) - ); +// //Act +// vehicleDamage.beforeRouteEnter.call( +// wrapper.vm, +// { query: { fmgPage: "vehicle-damage" } }, +// undefined, +// (c) => c(wrapper.vm) +// ); - //Assert - apiPromise.finally(() => { - expect(funnelSubHeader.methods.initializeComponent).toHaveBeenCalledWith( - pageHeaderWidgetHeaderText - ); - done(); - }); - }); -}); +// //Assert +// apiPromise.finally(() => { +// expect(funnelSubHeader.methods.initializeComponent).toHaveBeenCalledWith( +// pageHeaderWidgetHeaderText +// ); +// done(); +// }); +// }); +// }); + +// describe("vehicle-damage.vue", () => { +// test("Page logo image is initailized with api data", async (done) => { +// //Arrange +// const SiteHeaderWidget = { +// LogoImage: +// "https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/safelite-logo.svg?sfvrsn=45e7ed06_3", +// }; +// const { wrapper, apiPromise } = setupMocks({ +// SiteHeaderWidget: SiteHeaderWidget, +// }); + +// //Act +// vehicleDamage.beforeRouteEnter.call( +// wrapper.vm, +// { query: { fmgPage: "vehicle-damage" } }, +// undefined, +// (c) => c(wrapper.vm) +// ); + +// //Assert +// apiPromise.finally(() => { +// expect(funnelHeader.methods.initializeComponent).toHaveBeenCalledWith( +// SiteHeaderWidget +// ); +// done(); +// }); +// }); +// }); + +// describe("vehicle-damage.vue", () => { +// test("Vehicle image is initailized with api data", async (done) => { +// //Arrange +// const VehicleBannerWidget = { +// GenericVehicleImage: +// "https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/blurred-image.jpg?sfvrsn=a6ce3034_3", +// }; +// const { wrapper, apiPromise } = setupMocks({ +// VehicleBannerWidget: VehicleBannerWidget, +// }); + +// //Act +// vehicleDamage.beforeRouteEnter.call( +// wrapper.vm, +// { query: { fmgPage: "vehicle-damage" } }, +// undefined, +// (c) => c(wrapper.vm) +// ); + +// //Assert +// apiPromise.finally(() => { +// expect(vehicleBanner.methods.initializeComponent).toHaveBeenCalledWith( +// VehicleBannerWidget +// ); +// done(); +// }); +// }); +// }); + +// describe("vehicle-damage.vue", () => { +// test("CarId set, arePagePrerequisitesValid should be true ", async () => { +// //Arrange +// const { wrapper } = setupMocks({}); + +// //Act +// vehicleDamage.beforeRouteEnter.call( +// wrapper.vm, +// { query: { fmgPage: "vehicle-damage" } }, +// undefined, +// (c) => c(wrapper.vm) +// ); + +// let arePagePrerequisitesValid = wrapper.vm.arePagePrerequisitesValid(); +// await nextTick(); + +// //Assert +// expect(arePagePrerequisitesValid).toBe(true); +// }); +// }); + +// describe("vehicle-damage.vue", () => { +// test("Call invalidation, ResetPartsAndDeps should be called", async () => { + +// //Arrange +// const { wrapper } = setupMocks({}); + +// //Act +// vehicleDamage.beforeRouteEnter.call( +// wrapper.vm, +// { query: { fmgPage: "vehicle-damage" } }, +// undefined, +// (c) => c(wrapper.vm) +// ); + +// wrapper.vm.resetDependentState(); + +// //Assert +// expect(store.dispatch).toBeCalledWith(storeActions.RESET_PARTS_AND_DEPS) + +// }); +// }); + +// describe("vehicle-damage.vue", () => { +// test("BackButtonAction triggers a router.navigate change", async () => { + +// //Arrange +// const { wrapper } = setupMocks({}); + +// //Act +// vehicleDamage.beforeRouteEnter.call( +// wrapper.vm, +// { query: { fmgPage: "vehicle-damage" } }, +// undefined, +// (c) => c(wrapper.vm) +// ); + +// wrapper.vm.backButtonAction(); + +// //Assert +// expect(wrapper.vm.$router.navigate).toHaveBeenCalled(); + +// }); +// }); describe("vehicle-damage.vue", () => { - test("Page logo image is initailized with api data", async (done) => { + test("ForwardButtonAction triggers a router.navigate change and saves selections to store", async () => { + //Arrange - const SiteHeaderWidget = { - LogoImage: - "https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/safelite-logo.svg?sfvrsn=45e7ed06_3", + const partsData = { partsOrQuestions: [{ + glassName: "Single", + glassLocation: "Windshield", + parts: null, + partQuestions: [{ + questionSequence: 1, + questionText: "Is your vehicle equipped with a heated steering wheel?", + answers: [{ + answerText: "Yes", + nextQuestionSequence: null, + answerResult: "FW04957" + }, + { + answerText: "No", + nextQuestionSequence: 2, + answerResult: "" + }]}, + { + questionSequence: 2, + questionText: "Is your vehicle equipped with a remote start?", + answers: [{ + answerText: "Yes", + nextQuestionSequence: null, + answerResult: "FW04181" + }, + { + answerText: "No", + nextQuestionSequence: null, + answerResult: "FW04179" + }]}]}]}; + + const { wrapper } = setupMocks({ + pageHeaderWidgetHeaderText: "", + mountOptionsMockData: { + router: { navigateAfterSave: jest.fn(), }, + actionList: [{ actionName: storeActions.GET_PARTS_OR_QUESTIONS, data: partsData, },],}, + }); + //jest.mock(storeActions.GET_PARTS_OR_QUESTIONS) + + wrapper.vm.selectedWindshieldOptions = { + selectedWindshieldChipCount : null, + selectedWindshieldReplaceOptions : ["Single"], + // selectedDriverSideReplaceOptions: ["Back"], + // selectedPassengerSideReplaceOptions: ["Quarter"], + selectedWindshieldDamageType: ["Replace"] }; - const { wrapper, apiPromise } = setupMocks({ - SiteHeaderWidget: SiteHeaderWidget, - }); + + //wrapper.vm.selectedDamageLocations = ["Windshield", "SideDoor", "RearWindow"]; + wrapper.vm.selectedDamageLocations = ["Windshield"]; + //wrapper.vm.selectedRearReplaceOptions = ["Stationary"]; + + // const expectedGlassToReplace = [{location: "Windshield", name: "Single"}, {location: "Driver", name: "Back"}, + // {location: "Passenger", name: "Quarter"}, {location: "Rear", name: "Stationary"}]; + + const expectedGlassToReplace = [{location: "Windshield", name: "Single"}]; //Act vehicleDamage.beforeRouteEnter.call( @@ -85,65 +258,145 @@ describe("vehicle-damage.vue", () => { (c) => c(wrapper.vm) ); + await wrapper.vm.forwardButtonAction(); + //Assert - apiPromise.finally(() => { - expect(funnelHeader.methods.initializeComponent).toHaveBeenCalledWith( - SiteHeaderWidget - ); - done(); - }); + expect(wrapper.vm.$router.navigateAfterSave).toHaveBeenCalled(); + expect(wrapper.vm.selectedGlassToReplace()).toEqual(expectedGlassToReplace); + expect(store.commit).toBeCalledWith(storeMutations.UPDATE_IS_REPAIR, false); + expect(store.commit).toBeCalledWith(storeMutations.UPDATE_GLASS_TO_REPLACE, expectedGlassToReplace); }); }); -describe("vehicle-damage.vue", () => { - test("Vehicle image is initailized with api data", async (done) => { - //Arrange - const VehicleBannerWidget = { - GenericVehicleImage: - "https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/blurred-image.jpg?sfvrsn=a6ce3034_3", - }; - const { wrapper, apiPromise } = setupMocks({ - VehicleBannerWidget: VehicleBannerWidget, - }); +// describe("vehicle-damage.vue", () => { +// test("isWindshieldDamageLocation is true when windshield is selected", async () => { - //Act - vehicleDamage.beforeRouteEnter.call( - wrapper.vm, - { query: { fmgPage: "vehicle-damage" } }, - undefined, - (c) => c(wrapper.vm) - ); +// //Arrange +// const { wrapper } = setupMocks({}); - //Assert - apiPromise.finally(() => { - expect(vehicleBanner.methods.initializeComponent).toHaveBeenCalledWith( - VehicleBannerWidget - ); - done(); - }); - }); -}); +// //Act +// vehicleDamage.beforeRouteEnter.call( +// wrapper.vm, +// { query: { fmgPage: "vehicle-damage" } }, +// undefined, +// (c) => c(wrapper.vm) +// ); -describe("vehicle-damage.vue", () => { - test("CarId set, arePagePrerequisitesValid should be true ", async () => { - //Arrange - const { wrapper } = setupMocks({}); +// wrapper.vm.selectedDamageLocations = ["Windshield"]; - //Act - vehicleDamage.beforeRouteEnter.call( - wrapper.vm, - { query: { fmgPage: "vehicle-damage" } }, - undefined, - (c) => c(wrapper.vm) - ); +// //Assert +// expect(wrapper.vm.isWindshieldDamageLocation).toEqual(true); +// }); +// }); - let arePagePrerequisitesValid = wrapper.vm.arePagePrerequisitesValid(); - await nextTick(); +// describe("vehicle-damage.vue", () => { +// test("isSideDoorDamageLocation is true Side door is selected", async () => { - //Assert - expect(arePagePrerequisitesValid).toBe(true); - }); -}); +// //Arrange +// const { wrapper } = setupMocks({}); + +// //Act +// vehicleDamage.beforeRouteEnter.call( +// wrapper.vm, +// { query: { fmgPage: "vehicle-damage" } }, +// undefined, +// (c) => c(wrapper.vm) +// ); + +// wrapper.vm.selectedDamageLocations = ["Sidedoor"]; + +// //Assert +// expect(wrapper.vm.isSideDoorDamageLocation).toEqual(true); +// }); +// }); + + +// describe("vehicle-damage.vue", () => { +// test("isRearWindowDamageLocation is true if Rear Window damage is selected", async () => { + +// //Arrange +// const { wrapper } = setupMocks({}); + +// //Act +// vehicleDamage.beforeRouteEnter.call( +// wrapper.vm, +// { query: { fmgPage: "vehicle-damage" } }, +// undefined, +// (c) => c(wrapper.vm) +// ); + +// wrapper.vm.selectedDamageLocations = ["RearWindow"]; + +// //Assert +// expect(wrapper.vm.isRearWindowDamageLocation).toEqual(true); +// }); +// }); + +// describe("vehicle-damage.vue", () => { +// test("isWindshieldRepair is true if windshield repair is selected", async () => { + +// //Arrange +// const { wrapper } = setupMocks({}); + +// //Act +// vehicleDamage.beforeRouteEnter.call( +// wrapper.vm, +// { query: { fmgPage: "vehicle-damage" } }, +// undefined, +// (c) => c(wrapper.vm) +// ); + +// wrapper.vm.selectedDamageLocations = ["Windshield"]; +// wrapper.vm.selectedWindshieldOptions = { selectedWindshieldDamageType: ["Repair"]}; + +// //Assert +// expect(wrapper.vm.isWindshieldRepair).toEqual(true); +// }); +// }); + +// describe("vehicle-damage.vue", () => { +// test("isDriverSideReplace is true if side door driver is selected", async () => { + +// //Arrange +// const { wrapper } = setupMocks({}); + +// //Act +// vehicleDamage.beforeRouteEnter.call( +// wrapper.vm, +// { query: { fmgPage: "vehicle-damage" } }, +// undefined, +// (c) => c(wrapper.vm) +// ); + +// wrapper.vm.selectedDamageLocations = ["Sidedoor"]; +// wrapper.vm.sideDoorOptionsData = { selectedDoorSides: ["DriverSide"]}; + +// //Assert +// expect(wrapper.vm.isDriverSideReplace).toEqual(true); +// }); +// }); + +// describe("vehicle-damage.vue", () => { +// test("isPassengerSideReplace is true if side door passenger selected", async () => { + +// //Arrange +// const { wrapper } = setupMocks({}); + +// //Act +// vehicleDamage.beforeRouteEnter.call( +// wrapper.vm, +// { query: { fmgPage: "vehicle-damage" } }, +// undefined, +// (c) => c(wrapper.vm) +// ); + +// wrapper.vm.selectedDamageLocations = ["Sidedoor"]; +// wrapper.vm.sideDoorOptionsData = { selectedDoorSides: ["PassengerSide"]}; + +// //Assert +// expect(wrapper.vm.isPassengerSideReplace).toEqual(true); +// }); +// }); describe("vehicle-damage.vue", () => { test("Call invalidation, ResetPartsAndDeps should be called", async () => { @@ -167,50 +420,6 @@ describe("vehicle-damage.vue", () => { }); }); -describe("vehicle-damage.vue", () => { - test("BackButtonAction triggers a router.navigate change", async () => { - - //Arrange - const { wrapper } = setupMocks({}); - - //Act - vehicleDamage.beforeRouteEnter.call( - wrapper.vm, - { query: { fmgPage: "vehicle-damage" } }, - undefined, - (c) => c(wrapper.vm) - ); - - wrapper.vm.backButtonAction(); - - //Assert - expect(wrapper.vm.$router.navigate).toHaveBeenCalled(); - - }); -}); - -describe("vehicle-damage.vue", () => { - test("isRearWindowDamageLocation is true if Rear Window damage is selected", async () => { - - //Arrange - const { wrapper } = setupMocks({}); - - //Act - vehicleDamage.beforeRouteEnter.call( - wrapper.vm, - { query: { fmgPage: "vehicle-damage" } }, - undefined, - (c) => c(wrapper.vm) - ); - - wrapper.vm.selectedDamageLocations = ["RearWindow"]; - - //Assert - expect(wrapper.vm.isRearWindowDamageLocation).toEqual(true); - - }); -}); - function setupMocks({ pageHeaderWidgetHeaderText = {}, mountOptionsMockData = { diff --git a/src/layouts/vehicle-damage/vehicle-damage.vue b/src/layouts/vehicle-damage/vehicle-damage.vue index cc9f7c155..06fc4d17a 100644 --- a/src/layouts/vehicle-damage/vehicle-damage.vue +++ b/src/layouts/vehicle-damage/vehicle-damage.vue @@ -130,22 +130,43 @@ export default { this.$route ); }, + async forwardButtonAction() { var windshieldChipCount = this.selectedWindshieldOptions.selectedWindshieldChipCount && this.isWindshieldDamageLocation ? - this.selectedWindshieldOptions.selectedWindshieldChipCount[0] : null; + this.selectedWindshieldOptions.selectedWindshieldChipCount[0] : null; + + store.commit(this.storeMutations.UPDATE_IS_REPAIR, this.isWindshieldRepair); - this.$store.commit(this.storeMutations.UPDATE_IS_REPAIR, this.isWindshieldRepair); - if (windshieldChipCount){ - this.$store.commit(this.storeMutations.UPDATE_NUMBER_OF_CHIPS, parseInt(windshieldChipCount)); + store.commit(this.storeMutations.UPDATE_NUMBER_OF_CHIPS, parseInt(windshieldChipCount)); } - this.$store.commit(this.storeMutations.UPDATE_GLASS_TO_REPLACE, this.selectedGlassToReplace()); + store.commit(this.storeMutations.UPDATE_GLASS_TO_REPLACE, this.selectedGlassToReplace()); + + console.log("calling parts"); + var partsData = await baseMixin.methods.dispatchNonBlockingStoreAction(this.storeActions.GET_PARTS_OR_QUESTIONS, + { carId: store.getters.vehicle.carId, glassArray: this.selectedGlassToReplace()}, false); + console.log(partsData); - const partsData = await baseMixin.methods.dispatchNonBlockingStoreAction(this.storeActions.GET_PARTS_OR_QUESTIONS, - { carId: this.$store.getters.vehicle.carId, glassArray: this.selectedGlassToReplace()}, false); + this.navigateForward(partsData); + }, - this.$router.navigateAfterSave(this.navigationScenarios.SELECTED_GLASS_MULTIPLE_PARTS, this.$route, {}, {}, partsData.data); + navigateForward(partsData){ + //found problem questions + if (partsData.data.partsOrQuestions.some(pq => pq.partQuestions != null && pq.partQuestions.length > 0)){ + this.$router.navigateAfterSave(this.navigationScenarios.SELECTED_DAMAGE_WITH_PART_QUESTIONS, this.$route, {}, {}, partsData.data); + return; + } + + //found multiple parts + if (partsData.data.partsOrQuestions.some(pq => pq.parts !== null && pq.parts.length > 1)){ + this.$router.navigateAfterSave(this.navigationScenarios.SELECTED_DAMAGE_WITH_MULTIPLE_PARTS, this.$route, {}, {}, partsData.data); + return; + } + + //should only be 1 part and no problem questions at this point so save the part to the store + store.commit(this.storeMutations.UPDATE_PARTS, partsData.data.partsOrQuestions[0].parts); + this.$router.navigateAfterSave(this.navigationScenarios.SELECTED_DAMAGE_WITH_SINGLE_PART, this.$route); }, selectedGlassToReplace() { @@ -166,7 +187,6 @@ export default { this.sideDoorOptionsData.selectedPassengerSideReplaceOptions.forEach(passengerItem => { selectedGlassToReplace.push({ location: "Passenger", name: passengerItem}); }) - selectedGlassToReplace = Array.prototype.concat.apply([], [selectedGlassToReplace, this.sideDoorOptionsData.selectedDoorSides.selectedPassengerSideReplaceOptions]); } if (this.isRearWindowDamageLocation) { diff --git a/src/layouts/vehicle-parts/vehicle-parts.vue b/src/layouts/vehicle-parts/vehicle-parts.vue index dd591905a..5ac258aed 100644 --- a/src/layouts/vehicle-parts/vehicle-parts.vue +++ b/src/layouts/vehicle-parts/vehicle-parts.vue @@ -31,7 +31,6 @@ import vehicleBanner from "@/common-components/vehicle-banner/vehicle-banner"; import funnelSubHeader from "@/common-components/funnel-sub-header/funnel-sub-header"; 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"; @@ -45,15 +44,12 @@ export default { async beforeRouteEnter(to, from, next) { // Call APIs const cmsContentPromise = fetchCmsContentForPage(to.query.fmgPage); - // Settle promises and get results const promiseResultMap = [{ resultKey: "cmsContent", promise: cmsContentPromise, }, ]; - const resultMap = await settleAllPromises(promiseResultMap); - // Call the "next" function to complete the transition to this page. next((vm) => { vm.$refs.funnelHeader.initializeComponent( @@ -78,14 +74,12 @@ export default { FeatureQuestionWidget: resultMap.cmsContent.FeatureQuestionWidget, }) ); - // Set alertData for the page alert. These use props so we don't call // initializeComponent here. vm.alertWidgetData = { copy: resultMap.cmsContent.AlertWidget.BodyText, headline: resultMap.cmsContent.AlertWidget.HeadlineText }; - }); }, data() { @@ -186,4 +180,4 @@ export default { }, }; - + \ No newline at end of file diff --git a/src/router/index.js b/src/router/index.js index bd3254d02..14bb4a062 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -230,4 +230,4 @@ function resetDependentState(component) { return component.default.methods.resetDependentState(); } -export default router; +export default router; \ No newline at end of file diff --git a/src/router/router-constants/fmgPage-values.js b/src/router/router-constants/fmgPage-values.js index a23ba7eb6..770c1f7b6 100644 --- a/src/router/router-constants/fmgPage-values.js +++ b/src/router/router-constants/fmgPage-values.js @@ -5,7 +5,8 @@ const fmgPageValues = { VEHICLE_STYLE: "vehicle-style", VEHICLE_DAMAGE: "vehicle-damage", VEHICLE_PARTS: "vehicle-parts", - QUOTE : "quote", + PART_QUESTIONS: "part-questions", + REVEAL : "reveal", }; -export { fmgPageValues }; +export { fmgPageValues }; \ No newline at end of file diff --git a/src/router/router-constants/navigation-scenarios.js b/src/router/router-constants/navigation-scenarios.js index 05c95a7d6..b96c541b4 100644 --- a/src/router/router-constants/navigation-scenarios.js +++ b/src/router/router-constants/navigation-scenarios.js @@ -5,7 +5,8 @@ const navigationScenarios = { SELECTED_STYLE: "SELECTED_STYLE", CLICKED_BACK: "CLICKED_BACK", SELECTED_DAMAGE_WITH_SINGLE_PART: "SELECTED_DAMAGE_WITH_SINGLE_PART", - SELECTED_GLASS_MULTIPLE_PARTS: "SELECTED_GLASS_MULTIPLE_PARTS" + SELECTED_DAMAGE_WITH_MULTIPLE_PARTS: "SELECTED_DAMAGE_WITH_MULTIPLE_PARTS", + SELECTED_DAMAGE_WITH_PART_QUESTIONS: "SELECTED_DAMAGE_WITH_PART_QUESTIONS" }; export { navigationScenarios }; diff --git a/src/router/router-constants/routing-table.js b/src/router/router-constants/routing-table.js index 1e5b9833f..3540d3bf8 100644 --- a/src/router/router-constants/routing-table.js +++ b/src/router/router-constants/routing-table.js @@ -59,7 +59,7 @@ const routingTable = [ }, { scenario: navigationScenarios.SELECTED_DAMAGE_WITH_SINGLE_PART, - destinationFmgPageValue: fmgPageValues.QUOTE, + destinationFmgPageValue: fmgPageValues.REVEAL, }, ], }, @@ -71,7 +71,7 @@ const routingTable = [ destinationFmgPageValue: fmgPageValues.VEHICLE_STYLE, }, { - scenario: navigationScenarios.SELECTED_GLASS_MULTIPLE_PARTS, + scenario: navigationScenarios.SELECTED_DAMAGE_WITH_MULTIPLE_PARTS, destinationFmgPageValue: fmgPageValues.VEHICLE_PARTS, }, ], @@ -89,6 +89,19 @@ const routingTable = [ }, ], }, + { + fmgPageValue: fmgPageValues.VEHICLE_DAMAGE, + maps: [ + { + scenario: navigationScenarios.CLICKED_BACK, + destinationFmgPageValue: fmgPageValues.VEHICLE_STYLE, + }, + { + scenario: navigationScenarios.SELECTED_DAMAGE_WITH_PART_QUESTIONS, + destinationFmgPageValue: fmgPageValues.PART_QUESTIONS, + }, + ], + }, ]; export { routingTable }; diff --git a/src/store/index.js b/src/store/index.js index 619f4a950..41daf3955 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -293,4 +293,4 @@ export default createStore({ mutations, getters, actions, -}); +}); \ No newline at end of file From ac492e3203ed44bf83dbd4e76be669a75220193c Mon Sep 17 00:00:00 2001 From: FrankRua Date: Mon, 28 Feb 2022 10:56:38 -0500 Subject: [PATCH 25/35] develop / 297 merge --- src/global-methods.js | 4 ---- src/layouts/part-questions/part-questions.vue | 2 ++ src/layouts/reveal/reveal.vue | 2 ++ src/layouts/vehicle-damage/vehicle-damage.vue | 2 -- src/layouts/vehicle-parts/vehicle-parts.vue | 2 +- src/router/router-constants/navigation-scenarios.js | 1 + 6 files changed, 6 insertions(+), 7 deletions(-) diff --git a/src/global-methods.js b/src/global-methods.js index 716b27e66..a0023ef4c 100644 --- a/src/global-methods.js +++ b/src/global-methods.js @@ -10,10 +10,6 @@ export default { AppName: "FixMyGlass", }); - if (endpoint.toLowerCase().includes("/parts/")){ - apiGatewayUrl = "https://localhost:44335"; - } - axios({ method: method, url: apiGatewayUrl + endpoint, diff --git a/src/layouts/part-questions/part-questions.vue b/src/layouts/part-questions/part-questions.vue index e29b05ac4..75cf54527 100644 --- a/src/layouts/part-questions/part-questions.vue +++ b/src/layouts/part-questions/part-questions.vue @@ -18,6 +18,8 @@ import funnelFooter from "@/common-components/funnel-footer/funnel-footer"; // Supporting Files import { fetchCmsContentForPage } from "@/helpers/cms-content-helper"; import { settleAllPromises } from "@/helpers/layout-helper"; +import {storeMutations} from "@/constants/store-mutations"; +import {storeActions} from "@/constants/store-actions"; import store from "@/store"; export default { diff --git a/src/layouts/reveal/reveal.vue b/src/layouts/reveal/reveal.vue index 21ca0c6ac..18f0e499d 100644 --- a/src/layouts/reveal/reveal.vue +++ b/src/layouts/reveal/reveal.vue @@ -14,6 +14,8 @@ import funnelFooter from "@/common-components/funnel-footer/funnel-footer"; // Supporting Files import { fetchCmsContentForPage } from "@/helpers/cms-content-helper"; import { settleAllPromises } from "@/helpers/layout-helper"; +import {storeMutations} from "@/constants/store-mutations"; +import {storeActions} from "@/constants/store-actions"; import store from "@/store"; export default { diff --git a/src/layouts/vehicle-damage/vehicle-damage.vue b/src/layouts/vehicle-damage/vehicle-damage.vue index 06fc4d17a..ce92b6682 100644 --- a/src/layouts/vehicle-damage/vehicle-damage.vue +++ b/src/layouts/vehicle-damage/vehicle-damage.vue @@ -143,10 +143,8 @@ export default { store.commit(this.storeMutations.UPDATE_GLASS_TO_REPLACE, this.selectedGlassToReplace()); - console.log("calling parts"); var partsData = await baseMixin.methods.dispatchNonBlockingStoreAction(this.storeActions.GET_PARTS_OR_QUESTIONS, { carId: store.getters.vehicle.carId, glassArray: this.selectedGlassToReplace()}, false); - console.log(partsData); this.navigateForward(partsData); }, diff --git a/src/layouts/vehicle-parts/vehicle-parts.vue b/src/layouts/vehicle-parts/vehicle-parts.vue index 5ac258aed..c73ccaa03 100644 --- a/src/layouts/vehicle-parts/vehicle-parts.vue +++ b/src/layouts/vehicle-parts/vehicle-parts.vue @@ -175,7 +175,7 @@ export default { store.commit(storeMutations.UPDATE_PARTS, matchedParts); // Navigate to the next page. - + this.$router.navigateAfterSave(this.navigationScenarios.SELECTED_PARTS, this.$route); } }, diff --git a/src/router/router-constants/navigation-scenarios.js b/src/router/router-constants/navigation-scenarios.js index b96c541b4..9fd1c6311 100644 --- a/src/router/router-constants/navigation-scenarios.js +++ b/src/router/router-constants/navigation-scenarios.js @@ -4,6 +4,7 @@ const navigationScenarios = { SELECTED_MAKE: "SELECTED_MAKE", SELECTED_STYLE: "SELECTED_STYLE", CLICKED_BACK: "CLICKED_BACK", + SELECTED_PARTS: "SELECTED_PARTS", SELECTED_DAMAGE_WITH_SINGLE_PART: "SELECTED_DAMAGE_WITH_SINGLE_PART", SELECTED_DAMAGE_WITH_MULTIPLE_PARTS: "SELECTED_DAMAGE_WITH_MULTIPLE_PARTS", SELECTED_DAMAGE_WITH_PART_QUESTIONS: "SELECTED_DAMAGE_WITH_PART_QUESTIONS" From c1df7db2a4f4aff257e72fa4d411607ce0786acd Mon Sep 17 00:00:00 2001 From: FrankRua Date: Mon, 28 Feb 2022 14:36:56 -0500 Subject: [PATCH 26/35] Unit tests for vehicle-parts --- src/helpers/unit-test-helper.js | 4 + .../vehicle-damage/vehicle-damage.spec.js | 530 +++++++++--------- src/layouts/vehicle-damage/vehicle-damage.vue | 1 - .../glass-part-question.vue | 2 +- .../vehicle-parts/vehicle-parts.spec.js | 385 +++++++++++++ src/layouts/vehicle-parts/vehicle-parts.vue | 27 +- 6 files changed, 673 insertions(+), 276 deletions(-) create mode 100644 src/layouts/vehicle-parts/vehicle-parts.spec.js diff --git a/src/helpers/unit-test-helper.js b/src/helpers/unit-test-helper.js index 225704aa1..52c0b5c6c 100644 --- a/src/helpers/unit-test-helper.js +++ b/src/helpers/unit-test-helper.js @@ -2,6 +2,7 @@ import { storeActions } from "@/constants/store-actions"; import { storeMutations } from "@/constants/store-mutations.js"; import { navigationScenarios } from "@/router/router-constants/navigation-scenarios.js"; import { vehicleCategories } from "@/constants/vehicle-categories.js"; +import { fmgPageValues } from "@/router/router-constants/fmgPage-values"; import baseMixin from "@/mixins/base-mixin"; export function getMountOptions(mockData) { @@ -40,10 +41,13 @@ export function getMountOptions(mockData) { mocks.storeMutations = storeMutations; mocks.navigationScenarios = navigationScenarios; mocks.vehicleCategories = vehicleCategories; + mocks.fmgPageValues = fmgPageValues; // Mock $store and $router when accessing this.$store/$router mocks.$store = mockData.store; mocks.$router = mockData.router; + mocks.$route = mockData.route; + const global = { mocks: mocks, diff --git a/src/layouts/vehicle-damage/vehicle-damage.spec.js b/src/layouts/vehicle-damage/vehicle-damage.spec.js index d903349da..9145bad7c 100644 --- a/src/layouts/vehicle-damage/vehicle-damage.spec.js +++ b/src/layouts/vehicle-damage/vehicle-damage.spec.js @@ -41,214 +41,214 @@ jest.mock("@/store", () => ({ }, })); -// describe("vehicle-damage.vue", () => { -// test("Page header is initailized with api data", async (done) => { -// //Arrange -// const pageHeaderWidgetHeaderText = "Select Damage"; -// const { wrapper, apiPromise } = setupMocks({ -// pageHeaderWidgetHeaderText: pageHeaderWidgetHeaderText, -// }); +describe("vehicle-damage.vue", () => { + test("Page header is initailized with api data", async (done) => { + //Arrange + const pageHeaderWidgetHeaderText = "Select Damage"; + const { wrapper, apiPromise } = setupMocks({ + pageHeaderWidgetHeaderText: pageHeaderWidgetHeaderText, + }); -// //Act -// vehicleDamage.beforeRouteEnter.call( -// wrapper.vm, -// { query: { fmgPage: "vehicle-damage" } }, -// undefined, -// (c) => c(wrapper.vm) -// ); + //Act + vehicleDamage.beforeRouteEnter.call( + wrapper.vm, + { query: { fmgPage: "vehicle-damage" } }, + undefined, + (c) => c(wrapper.vm) + ); -// //Assert -// apiPromise.finally(() => { -// expect(funnelSubHeader.methods.initializeComponent).toHaveBeenCalledWith( -// pageHeaderWidgetHeaderText -// ); -// done(); -// }); -// }); -// }); + //Assert + apiPromise.finally(() => { + expect(funnelSubHeader.methods.initializeComponent).toHaveBeenCalledWith( + pageHeaderWidgetHeaderText + ); + done(); + }); + }); +}); -// describe("vehicle-damage.vue", () => { -// test("Page logo image is initailized with api data", async (done) => { -// //Arrange -// const SiteHeaderWidget = { -// LogoImage: -// "https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/safelite-logo.svg?sfvrsn=45e7ed06_3", -// }; -// const { wrapper, apiPromise } = setupMocks({ -// SiteHeaderWidget: SiteHeaderWidget, -// }); +describe("vehicle-damage.vue", () => { + test("Page logo image is initailized with api data", async (done) => { + //Arrange + const SiteHeaderWidget = { + LogoImage: + "https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/safelite-logo.svg?sfvrsn=45e7ed06_3", + }; + const { wrapper, apiPromise } = setupMocks({ + SiteHeaderWidget: SiteHeaderWidget, + }); -// //Act -// vehicleDamage.beforeRouteEnter.call( -// wrapper.vm, -// { query: { fmgPage: "vehicle-damage" } }, -// undefined, -// (c) => c(wrapper.vm) -// ); + //Act + vehicleDamage.beforeRouteEnter.call( + wrapper.vm, + { query: { fmgPage: "vehicle-damage" } }, + undefined, + (c) => c(wrapper.vm) + ); -// //Assert -// apiPromise.finally(() => { -// expect(funnelHeader.methods.initializeComponent).toHaveBeenCalledWith( -// SiteHeaderWidget -// ); -// done(); -// }); -// }); -// }); + //Assert + apiPromise.finally(() => { + expect(funnelHeader.methods.initializeComponent).toHaveBeenCalledWith( + SiteHeaderWidget + ); + done(); + }); + }); +}); -// describe("vehicle-damage.vue", () => { -// test("Vehicle image is initailized with api data", async (done) => { -// //Arrange -// const VehicleBannerWidget = { -// GenericVehicleImage: -// "https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/blurred-image.jpg?sfvrsn=a6ce3034_3", -// }; -// const { wrapper, apiPromise } = setupMocks({ -// VehicleBannerWidget: VehicleBannerWidget, -// }); +describe("vehicle-damage.vue", () => { + test("Vehicle image is initailized with api data", async (done) => { + //Arrange + const VehicleBannerWidget = { + GenericVehicleImage: + "https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/blurred-image.jpg?sfvrsn=a6ce3034_3", + }; + const { wrapper, apiPromise } = setupMocks({ + VehicleBannerWidget: VehicleBannerWidget, + }); -// //Act -// vehicleDamage.beforeRouteEnter.call( -// wrapper.vm, -// { query: { fmgPage: "vehicle-damage" } }, -// undefined, -// (c) => c(wrapper.vm) -// ); + //Act + vehicleDamage.beforeRouteEnter.call( + wrapper.vm, + { query: { fmgPage: "vehicle-damage" } }, + undefined, + (c) => c(wrapper.vm) + ); -// //Assert -// apiPromise.finally(() => { -// expect(vehicleBanner.methods.initializeComponent).toHaveBeenCalledWith( -// VehicleBannerWidget -// ); -// done(); -// }); -// }); -// }); + //Assert + apiPromise.finally(() => { + expect(vehicleBanner.methods.initializeComponent).toHaveBeenCalledWith( + VehicleBannerWidget + ); + done(); + }); + }); +}); -// describe("vehicle-damage.vue", () => { -// test("CarId set, arePagePrerequisitesValid should be true ", async () => { -// //Arrange -// const { wrapper } = setupMocks({}); +describe("vehicle-damage.vue", () => { + test("CarId set, arePagePrerequisitesValid should be true ", async () => { + //Arrange + const { wrapper } = setupMocks({}); -// //Act -// vehicleDamage.beforeRouteEnter.call( -// wrapper.vm, -// { query: { fmgPage: "vehicle-damage" } }, -// undefined, -// (c) => c(wrapper.vm) -// ); + //Act + vehicleDamage.beforeRouteEnter.call( + wrapper.vm, + { query: { fmgPage: "vehicle-damage" } }, + undefined, + (c) => c(wrapper.vm) + ); -// let arePagePrerequisitesValid = wrapper.vm.arePagePrerequisitesValid(); -// await nextTick(); + let arePagePrerequisitesValid = wrapper.vm.arePagePrerequisitesValid(); + await nextTick(); -// //Assert -// expect(arePagePrerequisitesValid).toBe(true); -// }); -// }); + //Assert + expect(arePagePrerequisitesValid).toBe(true); + }); +}); -// describe("vehicle-damage.vue", () => { -// test("Call invalidation, ResetPartsAndDeps should be called", async () => { +describe("vehicle-damage.vue", () => { + test("Call invalidation, ResetPartsAndDeps should be called", async () => { -// //Arrange -// const { wrapper } = setupMocks({}); + //Arrange + const { wrapper } = setupMocks({}); -// //Act -// vehicleDamage.beforeRouteEnter.call( -// wrapper.vm, -// { query: { fmgPage: "vehicle-damage" } }, -// undefined, -// (c) => c(wrapper.vm) -// ); + //Act + vehicleDamage.beforeRouteEnter.call( + wrapper.vm, + { query: { fmgPage: "vehicle-damage" } }, + undefined, + (c) => c(wrapper.vm) + ); -// wrapper.vm.resetDependentState(); + wrapper.vm.resetDependentState(); -// //Assert -// expect(store.dispatch).toBeCalledWith(storeActions.RESET_PARTS_AND_DEPS) + //Assert + expect(store.dispatch).toBeCalledWith(storeActions.RESET_PARTS_AND_DEPS) -// }); -// }); + }); +}); -// describe("vehicle-damage.vue", () => { -// test("BackButtonAction triggers a router.navigate change", async () => { +describe("vehicle-damage.vue", () => { + test("BackButtonAction triggers a router.navigate change", async () => { -// //Arrange -// const { wrapper } = setupMocks({}); + //Arrange + const { wrapper } = setupMocks({}); -// //Act -// vehicleDamage.beforeRouteEnter.call( -// wrapper.vm, -// { query: { fmgPage: "vehicle-damage" } }, -// undefined, -// (c) => c(wrapper.vm) -// ); + //Act + vehicleDamage.beforeRouteEnter.call( + wrapper.vm, + { query: { fmgPage: "vehicle-damage" } }, + undefined, + (c) => c(wrapper.vm) + ); -// wrapper.vm.backButtonAction(); + wrapper.vm.backButtonAction(); -// //Assert -// expect(wrapper.vm.$router.navigate).toHaveBeenCalled(); + //Assert + expect(wrapper.vm.$router.navigate).toHaveBeenCalled(); -// }); -// }); + }); +}); describe("vehicle-damage.vue", () => { test("ForwardButtonAction triggers a router.navigate change and saves selections to store", async () => { //Arrange - const partsData = { partsOrQuestions: [{ - glassName: "Single", - glassLocation: "Windshield", - parts: null, - partQuestions: [{ + const partsData = { + partsOrQuestions: [{ + glassName: "Single", + glassLocation: "Windshield", + parts: null, + partQuestions: [{ questionSequence: 1, questionText: "Is your vehicle equipped with a heated steering wheel?", answers: [{ - answerText: "Yes", - nextQuestionSequence: null, - answerResult: "FW04957" - }, - { - answerText: "No", - nextQuestionSequence: 2, - answerResult: "" - }]}, + answerText: "Yes", + nextQuestionSequence: null, + answerResult: "FW04957" + }, + { + answerText: "No", + nextQuestionSequence: 2, + answerResult: "" + }] + }, { questionSequence: 2, questionText: "Is your vehicle equipped with a remote start?", answers: [{ - answerText: "Yes", - nextQuestionSequence: null, - answerResult: "FW04181" - }, - { - answerText: "No", - nextQuestionSequence: null, - answerResult: "FW04179" - }]}]}]}; + answerText: "Yes", + nextQuestionSequence: null, + answerResult: "FW04181" + }, + { + answerText: "No", + nextQuestionSequence: null, + answerResult: "FW04179" + }] + }] + }] + }; const { wrapper } = setupMocks({ pageHeaderWidgetHeaderText: "", mountOptionsMockData: { router: { navigateAfterSave: jest.fn(), }, - actionList: [{ actionName: storeActions.GET_PARTS_OR_QUESTIONS, data: partsData, },],}, + actionList: [{ actionName: storeActions.GET_PARTS_OR_QUESTIONS, data: partsData, },], + }, }); - //jest.mock(storeActions.GET_PARTS_OR_QUESTIONS) - wrapper.vm.selectedWindshieldOptions = { - selectedWindshieldChipCount : null, - selectedWindshieldReplaceOptions : ["Single"], - // selectedDriverSideReplaceOptions: ["Back"], - // selectedPassengerSideReplaceOptions: ["Quarter"], + + wrapper.vm.selectedWindshieldOptions = { + selectedWindshieldChipCount: null, + selectedWindshieldReplaceOptions: ["Single"], selectedWindshieldDamageType: ["Replace"] }; - //wrapper.vm.selectedDamageLocations = ["Windshield", "SideDoor", "RearWindow"]; + wrapper.vm.selectedDamageLocations = ["Windshield"]; - //wrapper.vm.selectedRearReplaceOptions = ["Stationary"]; - // const expectedGlassToReplace = [{location: "Windshield", name: "Single"}, {location: "Driver", name: "Back"}, - // {location: "Passenger", name: "Quarter"}, {location: "Rear", name: "Stationary"}]; - - const expectedGlassToReplace = [{location: "Windshield", name: "Single"}]; + const expectedGlassToReplace = [{ location: "Windshield", name: "Single" }]; //Act vehicleDamage.beforeRouteEnter.call( @@ -259,7 +259,7 @@ describe("vehicle-damage.vue", () => { ); await wrapper.vm.forwardButtonAction(); - + //Assert expect(wrapper.vm.$router.navigateAfterSave).toHaveBeenCalled(); expect(wrapper.vm.selectedGlassToReplace()).toEqual(expectedGlassToReplace); @@ -268,135 +268,135 @@ describe("vehicle-damage.vue", () => { }); }); -// describe("vehicle-damage.vue", () => { -// test("isWindshieldDamageLocation is true when windshield is selected", async () => { +describe("vehicle-damage.vue", () => { + test("isWindshieldDamageLocation is true when windshield is selected", async () => { -// //Arrange -// const { wrapper } = setupMocks({}); + //Arrange + const { wrapper } = setupMocks({}); -// //Act -// vehicleDamage.beforeRouteEnter.call( -// wrapper.vm, -// { query: { fmgPage: "vehicle-damage" } }, -// undefined, -// (c) => c(wrapper.vm) -// ); + //Act + vehicleDamage.beforeRouteEnter.call( + wrapper.vm, + { query: { fmgPage: "vehicle-damage" } }, + undefined, + (c) => c(wrapper.vm) + ); -// wrapper.vm.selectedDamageLocations = ["Windshield"]; + wrapper.vm.selectedDamageLocations = ["Windshield"]; -// //Assert -// expect(wrapper.vm.isWindshieldDamageLocation).toEqual(true); -// }); -// }); + //Assert + expect(wrapper.vm.isWindshieldDamageLocation).toEqual(true); + }); +}); -// describe("vehicle-damage.vue", () => { -// test("isSideDoorDamageLocation is true Side door is selected", async () => { +describe("vehicle-damage.vue", () => { + test("isSideDoorDamageLocation is true Side door is selected", async () => { -// //Arrange -// const { wrapper } = setupMocks({}); + //Arrange + const { wrapper } = setupMocks({}); -// //Act -// vehicleDamage.beforeRouteEnter.call( -// wrapper.vm, -// { query: { fmgPage: "vehicle-damage" } }, -// undefined, -// (c) => c(wrapper.vm) -// ); + //Act + vehicleDamage.beforeRouteEnter.call( + wrapper.vm, + { query: { fmgPage: "vehicle-damage" } }, + undefined, + (c) => c(wrapper.vm) + ); -// wrapper.vm.selectedDamageLocations = ["Sidedoor"]; + wrapper.vm.selectedDamageLocations = ["Sidedoor"]; -// //Assert -// expect(wrapper.vm.isSideDoorDamageLocation).toEqual(true); -// }); -// }); + //Assert + expect(wrapper.vm.isSideDoorDamageLocation).toEqual(true); + }); +}); -// describe("vehicle-damage.vue", () => { -// test("isRearWindowDamageLocation is true if Rear Window damage is selected", async () => { +describe("vehicle-damage.vue", () => { + test("isRearWindowDamageLocation is true if Rear Window damage is selected", async () => { -// //Arrange -// const { wrapper } = setupMocks({}); + //Arrange + const { wrapper } = setupMocks({}); -// //Act -// vehicleDamage.beforeRouteEnter.call( -// wrapper.vm, -// { query: { fmgPage: "vehicle-damage" } }, -// undefined, -// (c) => c(wrapper.vm) -// ); + //Act + vehicleDamage.beforeRouteEnter.call( + wrapper.vm, + { query: { fmgPage: "vehicle-damage" } }, + undefined, + (c) => c(wrapper.vm) + ); -// wrapper.vm.selectedDamageLocations = ["RearWindow"]; + wrapper.vm.selectedDamageLocations = ["RearWindow"]; -// //Assert -// expect(wrapper.vm.isRearWindowDamageLocation).toEqual(true); -// }); -// }); + //Assert + expect(wrapper.vm.isRearWindowDamageLocation).toEqual(true); + }); +}); -// describe("vehicle-damage.vue", () => { -// test("isWindshieldRepair is true if windshield repair is selected", async () => { +describe("vehicle-damage.vue", () => { + test("isWindshieldRepair is true if windshield repair is selected", async () => { -// //Arrange -// const { wrapper } = setupMocks({}); + //Arrange + const { wrapper } = setupMocks({}); -// //Act -// vehicleDamage.beforeRouteEnter.call( -// wrapper.vm, -// { query: { fmgPage: "vehicle-damage" } }, -// undefined, -// (c) => c(wrapper.vm) -// ); + //Act + vehicleDamage.beforeRouteEnter.call( + wrapper.vm, + { query: { fmgPage: "vehicle-damage" } }, + undefined, + (c) => c(wrapper.vm) + ); -// wrapper.vm.selectedDamageLocations = ["Windshield"]; -// wrapper.vm.selectedWindshieldOptions = { selectedWindshieldDamageType: ["Repair"]}; + wrapper.vm.selectedDamageLocations = ["Windshield"]; + wrapper.vm.selectedWindshieldOptions = { selectedWindshieldDamageType: ["Repair"] }; -// //Assert -// expect(wrapper.vm.isWindshieldRepair).toEqual(true); -// }); -// }); + //Assert + expect(wrapper.vm.isWindshieldRepair).toEqual(true); + }); +}); -// describe("vehicle-damage.vue", () => { -// test("isDriverSideReplace is true if side door driver is selected", async () => { +describe("vehicle-damage.vue", () => { + test("isDriverSideReplace is true if side door driver is selected", async () => { -// //Arrange -// const { wrapper } = setupMocks({}); + //Arrange + const { wrapper } = setupMocks({}); -// //Act -// vehicleDamage.beforeRouteEnter.call( -// wrapper.vm, -// { query: { fmgPage: "vehicle-damage" } }, -// undefined, -// (c) => c(wrapper.vm) -// ); + //Act + vehicleDamage.beforeRouteEnter.call( + wrapper.vm, + { query: { fmgPage: "vehicle-damage" } }, + undefined, + (c) => c(wrapper.vm) + ); -// wrapper.vm.selectedDamageLocations = ["Sidedoor"]; -// wrapper.vm.sideDoorOptionsData = { selectedDoorSides: ["DriverSide"]}; + wrapper.vm.selectedDamageLocations = ["Sidedoor"]; + wrapper.vm.sideDoorOptionsData = { selectedDoorSides: ["DriverSide"] }; -// //Assert -// expect(wrapper.vm.isDriverSideReplace).toEqual(true); -// }); -// }); + //Assert + expect(wrapper.vm.isDriverSideReplace).toEqual(true); + }); +}); -// describe("vehicle-damage.vue", () => { -// test("isPassengerSideReplace is true if side door passenger selected", async () => { +describe("vehicle-damage.vue", () => { + test("isPassengerSideReplace is true if side door passenger selected", async () => { -// //Arrange -// const { wrapper } = setupMocks({}); + //Arrange + const { wrapper } = setupMocks({}); -// //Act -// vehicleDamage.beforeRouteEnter.call( -// wrapper.vm, -// { query: { fmgPage: "vehicle-damage" } }, -// undefined, -// (c) => c(wrapper.vm) -// ); + //Act + vehicleDamage.beforeRouteEnter.call( + wrapper.vm, + { query: { fmgPage: "vehicle-damage" } }, + undefined, + (c) => c(wrapper.vm) + ); -// wrapper.vm.selectedDamageLocations = ["Sidedoor"]; -// wrapper.vm.sideDoorOptionsData = { selectedDoorSides: ["PassengerSide"]}; + wrapper.vm.selectedDamageLocations = ["Sidedoor"]; + wrapper.vm.sideDoorOptionsData = { selectedDoorSides: ["PassengerSide"] }; -// //Assert -// expect(wrapper.vm.isPassengerSideReplace).toEqual(true); -// }); -// }); + //Assert + expect(wrapper.vm.isPassengerSideReplace).toEqual(true); + }); +}); describe("vehicle-damage.vue", () => { test("Call invalidation, ResetPartsAndDeps should be called", async () => { @@ -509,14 +509,14 @@ function setupMocks({ const sideDoorOptionsWrapper = wrapper.findComponent({ name: "sideDoorOptions" }); sideDoorOptionsWrapper.vm.initializeComponent = - sideDoorOptions.methods.initializeComponent; + sideDoorOptions.methods.initializeComponent; const windshieldOptionsWrapper = wrapper.findComponent({ name: "windshieldOptions", }); - + windshieldOptionsWrapper.vm.initializeComponent = - windshieldOptions.methods.initializeComponent; + windshieldOptions.methods.initializeComponent; const funnelSubHeaderWrapper = wrapper.findComponent({ name: "funnelSubHeader", @@ -528,13 +528,13 @@ function setupMocks({ name: "replaceOptionsQuestion", }); backGlassOptionsWrapper.vm.initializeComponent = - replaceOptionsQuestion.methods.initializeComponent; + replaceOptionsQuestion.methods.initializeComponent; const damageLocationQuestionWrapper = wrapper.findComponent({ name: "damageLocationQuestion", }); damageLocationQuestionWrapper.vm.initializeComponent = - damageLocationQuestion.methods.initializeComponent; + damageLocationQuestion.methods.initializeComponent; const funnelFooterWrapper = wrapper.findComponent({ name: "funnelFooter", diff --git a/src/layouts/vehicle-damage/vehicle-damage.vue b/src/layouts/vehicle-damage/vehicle-damage.vue index ce92b6682..8db230860 100644 --- a/src/layouts/vehicle-damage/vehicle-damage.vue +++ b/src/layouts/vehicle-damage/vehicle-damage.vue @@ -120,7 +120,6 @@ export default { return store.getters.vehicle.carId !== null; }, resetDependentState() { - // Invokes store.dispatch(storeActions.RESET_PARTS_STATE); }, backButtonAction() { diff --git a/src/layouts/vehicle-parts/glass-part-question/glass-part-question.vue b/src/layouts/vehicle-parts/glass-part-question/glass-part-question.vue index f5f5cdaa0..83e12a083 100644 --- a/src/layouts/vehicle-parts/glass-part-question/glass-part-question.vue +++ b/src/layouts/vehicle-parts/glass-part-question/glass-part-question.vue @@ -103,7 +103,7 @@ export default { } }, methods: { - initializeComponent(cmsContent, initialData) { + initializeComponent(cmsContent) { this.glassColorQuestion = cmsContent.ColorQuestionWidget.QuestionText; this.glassFeatureQuestion = cmsContent.FeatureQuestionWidget.QuestionText; }, diff --git a/src/layouts/vehicle-parts/vehicle-parts.spec.js b/src/layouts/vehicle-parts/vehicle-parts.spec.js new file mode 100644 index 000000000..b52be441b --- /dev/null +++ b/src/layouts/vehicle-parts/vehicle-parts.spec.js @@ -0,0 +1,385 @@ +// Components +import vehicleParts from "@/layouts/vehicle-parts/vehicle-parts.vue"; +import funnelHeader from "@/common-components/funnel-header/funnel-header"; +import funnelFooter from "@/common-components/funnel-footer/funnel-footer"; +import vehicleBanner from "@/common-components/vehicle-banner/vehicle-banner"; +import funnelSubHeader from "@/common-components/funnel-sub-header/funnel-sub-header"; +import glassPartQuestion from "@/layouts/vehicle-parts/glass-part-question/glass-part-question"; + +// Supporting Files +import { settleAllPromises } from "@/helpers/layout-helper.js"; +import baseMixin from "@/mixins/base-mixin"; +import { fetchCmsContentForPage } from "@/helpers/cms-content-helper"; +import { shallowMount } from "@vue/test-utils"; +import { getMountOptions } from "@/helpers/unit-test-helper.js"; +import { nextTick } from "vue"; +import { storeActions } from "@/constants/store-actions"; +import { storeMutations } from "@/constants/store-mutations"; +import store from "@/store"; + +// Mock our module for promises. +jest.mock("@/helpers/layout-helper.js", () => ({ + settleAllPromises: jest.fn(), +})); + +// Mock fetchCmsContentForPage +jest.mock("@/helpers/cms-content-helper", () => ({ + fetchCmsContentForPage: jest.fn(), +})); + +// Mock store +jest.mock("@/store", () => { return {}; }, { virtual: true }); + +store.getters = { + pageData: jest.fn(), + damage: { + isRepair: false + } +}; + +const basePartResponse = { + partsOrQuestions: [ + { + glassName: "Stationary", + glassLocation: "Rear", + parts: [ + { + partNumber: "DB12209GTYN", + description: "heated glass, solar, 1 hole", + color: "Green Tint", + requiresRecalibration: false, + requiresCapabilityQuestions: false, + childParts: null + }, + { + partNumber: "DB12209YPYNOEM", + description: "heated glass, solar, 1 hole", + color: "Gray Tint Privacy", + requiresRecalibration: false, + requiresCapabilityQuestions: false, + childParts: null + } + ], + partQuestions: null + } + ] +} + + +describe("vehicle-damage.vue", () => { + + test("Page header is initialized with api data", async (done) => { + //Arrange + store.getters.pageData.mockReturnValueOnce({ + partsOrQuestions: [ + { + glassName: "Stationary", + glassLocation: "Rear", + parts: [ + { + partNumber: "DB12209GTYN", + description: "heated glass, solar, 1 hole", + color: "Green Tint", + requiresRecalibration: false, + requiresCapabilityQuestions: false, + childParts: null + }, + { + partNumber: "DB12209YPYNOEM", + description: "heated glass, solar, 1 hole", + color: "Gray Tint Privacy", + requiresRecalibration: false, + requiresCapabilityQuestions: false, + childParts: null + } + ], + partQuestions: null + } + ] + }); + + const pageHeaderWidgetHeaderText = "Select Parts"; + const { wrapper, apiPromise } = setupMocks( + { + pageHeaderWidgetHeaderText: pageHeaderWidgetHeaderText, + mountOptionsMockData: { + router: { + navigateAfterSave: jest.fn() + }, + route: { + query: { + fmgPage: 'vehicle-parts', + } + }, + store: { + getters: store.getters + }, + } + }); + + //Act + vehicleParts.beforeRouteEnter.call(wrapper.vm, + { query: { fmgPage: "vehicle-parts" } }, + undefined, + (c) => c(wrapper.vm) + ); + + //Assert + apiPromise.finally(() => { + expect(funnelSubHeader.methods.initializeComponent).toHaveBeenCalledWith(pageHeaderWidgetHeaderText); + done(); + }); + }); + + test("Page logo image is initialized with api data", async (done) => { + //Arrange + const SiteHeaderWidget = { + LogoImage: + "https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/safelite-logo.svg?sfvrsn=45e7ed06_3", + }; + + store.getters.pageData.mockReturnValueOnce(basePartResponse); + + const { wrapper, apiPromise } = setupMocks( + { + SiteHeaderWidget: SiteHeaderWidget, + mountOptionsMockData: { + router: { + navigateAfterSave: jest.fn() + }, + route: { + query: { + fmgPage: 'vehicle-parts', + } + }, + store: { + getters: store.getters + }, + } + }); + + //Act + vehicleParts.beforeRouteEnter.call( + wrapper.vm, + { query: { fmgPage: "vehicle-parts" } }, + undefined, + (c) => c(wrapper.vm) + ); + + //Assert + apiPromise.finally(() => { + expect(funnelHeader.methods.initializeComponent).toHaveBeenCalledWith(SiteHeaderWidget); + done(); + }); + }); + + test("Vehicle image is initialized with api data", async (done) => { + //Arrange + const VehicleBannerWidget = { + GenericVehicleImage: + "https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/blurred-image.jpg?sfvrsn=a6ce3034_3", + }; + + store.getters.pageData.mockReturnValue(basePartResponse); + + const { wrapper, apiPromise } = setupMocks( + { + VehicleBannerWidget: VehicleBannerWidget, + mountOptionsMockData: { + router: { + navigateAfterSave: jest.fn() + }, + route: { + query: { + fmgPage: 'vehicle-parts', + } + }, + store: { + getters: store.getters + }, + } + }); + + //Act + vehicleParts.beforeRouteEnter.call( + wrapper.vm, + { query: { fmgPage: "vehicle-parts" } }, + undefined, + (c) => c(wrapper.vm) + ); + + //Assert + apiPromise.finally(() => { + expect(vehicleBanner.methods.initializeComponent).toHaveBeenCalledWith(VehicleBannerWidget); + done(); + }); + }); + + test("PageData / isRepair populated in Vuex. arePagePrerequisitesValid should be true ", async () => { + + //Arrange + store.getters.pageData.mockReturnValueOnce(basePartResponse); + const { wrapper } = setupMocks({ + mountOptionsMockData: { + router: { + navigateAfterSave: jest.fn() + }, + route: { + query: { + fmgPage: 'vehicle-parts', + } + }, + store: { + getters: store.getters + }, + } + }); + + //Act + vehicleParts.beforeRouteEnter.call( + wrapper.vm, + { query: { fmgPage: "vehicle-parts" } }, + undefined, + (c) => c(wrapper.vm) + ); + + let arePagePrerequisitesValid = wrapper.vm.arePagePrerequisitesValid(); + await nextTick(); + + //Assert + expect(arePagePrerequisitesValid).toBe(true); + }); + + test("BackButtonAction triggers a router.navigate change", async () => { + + //Arrange + store.getters.pageData.mockReturnValueOnce(basePartResponse); + const { wrapper } = setupMocks({ + mountOptionsMockData: { + router: { + navigateAfterSave: jest.fn(), + navigate: jest.fn() + }, + route: { + query: { + fmgPage: 'vehicle-parts', + } + }, + store: { + getters: store.getters + }, + } + }); + + //Act + vehicleParts.beforeRouteEnter.call( + wrapper.vm, + { query: { fmgPage: "vehicle-parts" } }, + undefined, + (c) => c(wrapper.vm) + ); + + wrapper.vm.backButtonAction(); + + //Assert + expect(wrapper.vm.$router.navigate).toHaveBeenCalled(); + + }); + + test("ForwardButtonAction triggers a router.navigate change and saves selected parts to store", async () => { + + //Arrange + store.getters.pageData.mockReturnValueOnce(basePartResponse); + store.commit = jest.fn(); + + const { wrapper } = setupMocks({ + mountOptionsMockData: { + router: { + navigateAfterSave: jest.fn(), + navigate: jest.fn() + }, + route: { + query: { + fmgPage: 'vehicle-parts', + } + }, + store: { + getters: store.getters, + commit: store.commit + }, + } + }); + + wrapper.setData({ glassParts: { "Rear-Stationary": { "Rear": ['DB12209YPYNOEM'] } } }); + + //Act + vehicleParts.beforeRouteEnter.call( + wrapper.vm, + { query: { fmgPage: "vehicle-parts" } }, + undefined, + (c) => c(wrapper.vm) + ); + + await wrapper.vm.forwardButtonAction(); + + //Assert + expect(wrapper.vm.$router.navigateAfterSave).toHaveBeenCalled(); + // expect(wrapper.vm.selectedGlassToReplace()).toEqual(expectedGlassToReplace); + // expect(store.commit).toBeCalledWith(storeMutations.UPDATE_IS_REPAIR, false); + // expect(store.commit).toBeCalledWith(storeMutations.UPDATE_GLASS_TO_REPLACE, expectedGlassToReplace); + }); +}); + +function setupMocks({ pageHeaderWidgetHeaderText = {}, mountOptionsMockData = {} }) { + //Mock api responses + const apiResponses = { + cmsContent: { + FunnelSubHeaderWidget: pageHeaderWidgetHeaderText, + VehicleBannerWidget: { + GenericVehicleImage: + "https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/blurred-image.jpg?sfvrsn=a6ce3034_3", + }, + FunnelHeaderWidget: { + LogoImage: + "https://digitalconsumercms-dev.safelite.com/images/default-source/default-album/safelite-logo.svg?sfvrsn=45e7ed06_3", + }, + ColorQuestionWidget: 'Please choose your rear window tint color', + FeatureQuestionWidget: 'Ok no choose features', + AlertWidget: { + BodyText: 'Please choose your tint color', + HeadlineText: 'Just a few more steps to go', + } + } + }; + + const apiPromise = Promise.resolve(apiResponses); + + settleAllPromises.mockImplementation(() => apiPromise); + fetchCmsContentForPage.mockImplementation(() => Promise.resolve()); + + //Mock damage initialize methods + funnelHeader.methods = { initializeComponent: jest.fn() }; + vehicleBanner.methods = { initializeComponent: jest.fn() }; + funnelSubHeader.methods = { initializeComponent: jest.fn() }; + funnelFooter.methods = { initializeComponent: jest.fn() } + + const mountOptions = getMountOptions(mountOptionsMockData,); + const wrapper = shallowMount(vehicleParts, mountOptions); + + const funnelHeaderWrapper = wrapper.findComponent({ name: "funnelHeader" }); + funnelHeaderWrapper.vm.initializeComponent = funnelHeader.methods.initializeComponent; + + const vehicleBannerWrapper = wrapper.findComponent({ name: "vehicleBanner" }); + vehicleBannerWrapper.vm.initializeComponent = vehicleBanner.methods.initializeComponent; + + const funnelSubHeaderWrapper = wrapper.findComponent({ name: "funnelSubHeader", }); + funnelSubHeaderWrapper.vm.initializeComponent = funnelSubHeader.methods.initializeComponent; + + const funnelFooterWrapper = wrapper.findComponent({ name: "funnelFooter", }); + funnelFooterWrapper.vm.initializeComponent = funnelFooter.methods.initializeComponent; + + const partQuestionRearWrapper = wrapper.findComponent({ name: "glassPartQuestion", }); + partQuestionRearWrapper.vm.initializeComponent = glassPartQuestion.methods.initializeComponent; + + return { wrapper, apiPromise }; +} diff --git a/src/layouts/vehicle-parts/vehicle-parts.vue b/src/layouts/vehicle-parts/vehicle-parts.vue index c73ccaa03..aaa7f8620 100644 --- a/src/layouts/vehicle-parts/vehicle-parts.vue +++ b/src/layouts/vehicle-parts/vehicle-parts.vue @@ -32,13 +32,20 @@ import funnelSubHeader from "@/common-components/funnel-sub-header/funnel-sub-he 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 {fmgPageValues} from "@/router/router-constants/fmgPage-values"; -import {storeMutations} from "@/constants/store-mutations"; +import { + fetchCmsContentForPage +} from "@/helpers/cms-content-helper"; +import { + settleAllPromises +} from "@/helpers/layout-helper"; +import { + fmgPageValues +} from "@/router/router-constants/fmgPage-values"; +import { + storeMutations +} from "@/constants/store-mutations"; import store from "@/store"; - export default { name: "vehicle-parts", async beforeRouteEnter(to, from, next) { @@ -66,6 +73,7 @@ export default { ); // Glass Part Question dynamic component + Object.keys(vm.$refs) .filter((r) => r.includes(vm.refPrefix) && vm.$refs[r][0] !== undefined) .forEach((c) => @@ -74,12 +82,14 @@ export default { FeatureQuestionWidget: resultMap.cmsContent.FeatureQuestionWidget, }) ); + // Set alertData for the page alert. These use props so we don't call // initializeComponent here. vm.alertWidgetData = { copy: resultMap.cmsContent.AlertWidget.BodyText, headline: resultMap.cmsContent.AlertWidget.HeadlineText }; + }); }, data() { @@ -99,7 +109,7 @@ export default { }, computed: { PartsForQuestions() { - const partsData = store.getters.pageData(this.$route.query.fmgPage); + const partsData = this.$store.getters.pageData(this.$route.query.fmgPage); // Map API result data, to vehicle-parts data structure const mappedData = partsData.partsOrQuestions.map(g => { @@ -142,7 +152,6 @@ export default { this.$route ); }, - forwardButtonAction() { const selectedGlassPartNumbers = []; const matchedParts = []; @@ -167,7 +176,7 @@ export default { } // If no parts could be matched, throw an error. - if(matchedParts.length === 0) { + if (matchedParts.length === 0) { throw new Error("Could not match any parts to the selected parts"); } @@ -180,4 +189,4 @@ export default { }, }; - \ No newline at end of file + From 0684a75f40585725b4afb72c75f06644fa665464 Mon Sep 17 00:00:00 2001 From: bmauger Date: Tue, 1 Mar 2022 08:14:47 -0500 Subject: [PATCH 27/35] Remove unneeded code. --- src/common-components/textbox-question/textbox-question.vue | 1 - src/layouts/component-test/component-test.vue | 2 -- 2 files changed, 3 deletions(-) diff --git a/src/common-components/textbox-question/textbox-question.vue b/src/common-components/textbox-question/textbox-question.vue index 00874a385..feb65ffd9 100644 --- a/src/common-components/textbox-question/textbox-question.vue +++ b/src/common-components/textbox-question/textbox-question.vue @@ -20,7 +20,6 @@ export default { isRequired: Boolean, hasIcon: Boolean,// If input has an icon iconRight: Boolean,// Place icon on right side of text input, otherwise default is left if hasIcon prop is used - iconURL: String, hasError: Boolean, } }; diff --git a/src/layouts/component-test/component-test.vue b/src/layouts/component-test/component-test.vue index d9d6ca37f..63df009e2 100644 --- a/src/layouts/component-test/component-test.vue +++ b/src/layouts/component-test/component-test.vue @@ -33,7 +33,6 @@ placeholderText="Text Input Label" inputID="test-text-input" hasIcon - imgUrl="~@/assets/img/icons/spinner.svg" />
@@ -46,7 +45,6 @@ inputID="test-text-input" hasIcon iconRight - imgUrl="~@/assets/img/icons/spinner.svg" />
From fdf50b1882c9d30708228365c119184d0434001e Mon Sep 17 00:00:00 2001 From: FrankRua Date: Tue, 1 Mar 2022 10:26:42 -0500 Subject: [PATCH 28/35] Unit tests --- src/helpers/unit-test-helper.js | 25 +-- .../damage-location-question.spec.js | 147 +++++++++--------- .../vehicle-damage/vehicle-damage.spec.js | 2 +- .../glass-part-question.spec.js | 122 +++++++++++++++ .../glass-part-question.vue | 2 +- src/store/store.spec.js | 8 +- 6 files changed, 215 insertions(+), 91 deletions(-) create mode 100644 src/layouts/vehicle-parts/glass-part-question/glass-part-question.spec.js diff --git a/src/helpers/unit-test-helper.js b/src/helpers/unit-test-helper.js index 52c0b5c6c..1509a4b16 100644 --- a/src/helpers/unit-test-helper.js +++ b/src/helpers/unit-test-helper.js @@ -10,19 +10,20 @@ export function getMountOptions(mockData) { const mocks = {}; //this is mocking if you use the mixin directly(baseMixin.methods.dispatchNonBlockingStoreAction) vs this.dispatchNonBlockingStoreAction - baseMixin.methods.dispatchNonBlockingStoreAction = jest.fn(); - baseMixin.methods.dispatchNonBlockingStoreAction.mockImplementation((actionName) => { - let actionFilterResult = mockData.actionList.filter( - (x) => x.actionName == actionName - ); - - if (actionFilterResult.length > 0 && actionFilterResult.length === 1) { - return Promise.resolve({ - data: actionFilterResult[0].data, - }); - } - }); + if (mockData.actionList !== undefined) { + baseMixin.methods.dispatchNonBlockingStoreAction = jest.fn(); + baseMixin.methods.dispatchNonBlockingStoreAction.mockImplementation((actionName) => { + let actionFilterResult = mockData.actionList.filter( + (x) => x.actionName == actionName + ); + if (actionFilterResult.length > 0 && actionFilterResult.length === 1) { + return Promise.resolve({ + data: actionFilterResult[0].data, + }); + } + }); + } mocks.dispatchNonBlockingStoreAction = jest.fn(); mocks.dispatchNonBlockingStoreAction.mockImplementation((actionName) => { let actionFilterResult = mockData.actionList.filter( diff --git a/src/layouts/vehicle-damage/damage-location-question/damage-location-question.spec.js b/src/layouts/vehicle-damage/damage-location-question/damage-location-question.spec.js index 92feec9b8..ce12c15ff 100644 --- a/src/layouts/vehicle-damage/damage-location-question/damage-location-question.spec.js +++ b/src/layouts/vehicle-damage/damage-location-question/damage-location-question.spec.js @@ -2,82 +2,83 @@ import { shallowMount } from "@vue/test-utils"; import damageLocationQuestion from "@/layouts/vehicle-damage/damage-location-question/damage-location-question"; import { getMountOptions } from "@/helpers/unit-test-helper.js"; import store from "@/store"; -jest.mock("@/store", () => { return {}; }, {virtual: true}); +jest.mock("@/store", () => { return {}; }, { virtual: true }); describe("damage-location-question.vue", () => { - test("Selected location option is emitted upon selection.", async () => { - - //Arrange - const { wrapper } = setupMocks({ modelValueProp: ["Windshield"] }); - const locationToSelect = ["Backseat"]; - - //Act - wrapper.setValue({ modelValue: locationToSelect }); - await wrapper.vm.$nextTick(); - - //Assert - expect(wrapper.emitted()["update:modelValue"][0]).toEqual([{modelValue: ["Backseat"]}]); + test("Selected location option is emitted upon selection.", async () => { + + //Arrange + const { wrapper } = setupMocks({ modelValueProp: ["Windshield"] }); + const locationToSelect = ["Backseat"]; + + //Act + wrapper.setValue({ modelValue: locationToSelect }); + await wrapper.vm.$nextTick(); + + //Assert + expect(wrapper.emitted()["update:modelValue"][0]).toEqual([{ modelValue: ["Backseat"] }]); + }); +}); + +describe("damage-location-question.vue", () => { + test("Answers to display filtered by data from api.", async () => { + + //Arrange + const { wrapper, cmsContent, damageOptions } = setupMocks({ + dataFromStoreApi: { + driverSideOptions: { + availableReplacementOptions: ['Quarter', 'Front'] + }, + windshieldOptions: { + availableReplacementOptions: ['Single'] + }, + backGlassOptions: { + availableReplacementOptions: [] + } + } }); + + //Act + damageLocationQuestion.methods.initializeComponent.call(wrapper.vm, cmsContent, damageOptions, "car-group"); + + //Assert + expect(wrapper.vm.answersToDisplay).toStrictEqual([{ Name: 'Windshield' }, { Name: 'SideDoor' }]) + }); +}); + +function setupMocks({ + modelValueProp = ["Windshield", "SideDoor"], + isMultiSelect = false, + groupName = "damageQuestion", + cmsQuestionText = "CMS text goes here", + cmsAnswers = [{ Name: "car-Windshield" }, { Name: "car-SideDoor" }, { Name: "car-RearWindow" }], + dataFromStoreApi = [], +}) { + + //Mock store + store.dispatch = jest.fn(() => dataFromStoreApi); + store.getters = { vehicle: { year: 2019, make: 'honda', model: 'civc', style: '2 Door', category: 'CAR' } }; + const mountOptions = getMountOptions({ + store: { + dispatch: store.dispatch, + getters: store.getters, + }, }); - describe("damage-location-question.vue", () => { - test("Answers to display filtered by data from api.", async () => { - - //Arrange - const { wrapper, cmsContent, damageOptions } = setupMocks({ dataFromStoreApi: { - driverSideOptions: { - availableReplacementOptions: ['Quarter', 'Front'] - }, - windshieldOptions: { - availableReplacementOptions: ['Single'] - }, - backGlassOptions: { - availableReplacementOptions: [] - } - } - }); - - //Act - damageLocationQuestion.methods.initializeComponent.call(wrapper.vm, cmsContent, damageOptions, "car-group"); - - //Assert - expect(wrapper.vm.answersToDisplay).toStrictEqual([ { Name: 'Windshield' }, { Name: 'SideDoor' } ]) - }); - }); + //Mock props + mountOptions.propsData = { + modelValue: modelValueProp, + isMultiSelect: isMultiSelect, + }; - function setupMocks({ - modelValueProp = ["Windshield", "SideDoor"], - isMultiSelect = false, - groupName = "damageQuestion", - cmsQuestionText = "CMS text goes here", - cmsAnswers = [{Name: "car-Windshield"}, {Name: "car-SideDoor"}, {Name: "car-RearWindow"}], - dataFromStoreApi = [], - }) { - - //Mock store - store.dispatch = jest.fn(() => dataFromStoreApi); - store.getters = { vehicle: {year: 2019, make: 'honda', model: 'civc', style: '2 Door', category: 'CAR'} }; - const mountOptions = getMountOptions({ - store: { - dispatch: store.dispatch, - getters: store.getters, - }, - }); - - //Mock props - mountOptions.propsData = { - modelValue: modelValueProp, - isMultiSelect: isMultiSelect, - }; - - const wrapper = shallowMount(damageLocationQuestion, mountOptions); - - //Mock CMS content - const cmsContent = { - groupName: groupName, - QuestionText: cmsQuestionText, - Answers: cmsAnswers, - }; - const damageOptions = dataFromStoreApi; - return { wrapper, cmsContent, damageOptions }; - } \ No newline at end of file + const wrapper = shallowMount(damageLocationQuestion, mountOptions); + + //Mock CMS content + const cmsContent = { + groupName: groupName, + QuestionText: cmsQuestionText, + Answers: cmsAnswers, + }; + const damageOptions = dataFromStoreApi; + return { wrapper, cmsContent, damageOptions }; +} \ No newline at end of file diff --git a/src/layouts/vehicle-damage/vehicle-damage.spec.js b/src/layouts/vehicle-damage/vehicle-damage.spec.js index 9145bad7c..50cee4876 100644 --- a/src/layouts/vehicle-damage/vehicle-damage.spec.js +++ b/src/layouts/vehicle-damage/vehicle-damage.spec.js @@ -163,7 +163,7 @@ describe("vehicle-damage.vue", () => { wrapper.vm.resetDependentState(); //Assert - expect(store.dispatch).toBeCalledWith(storeActions.RESET_PARTS_AND_DEPS) + expect(store.dispatch).toBeCalledWith(storeActions.RESET_PARTS_STATE) }); }); diff --git a/src/layouts/vehicle-parts/glass-part-question/glass-part-question.spec.js b/src/layouts/vehicle-parts/glass-part-question/glass-part-question.spec.js new file mode 100644 index 000000000..ec687023c --- /dev/null +++ b/src/layouts/vehicle-parts/glass-part-question/glass-part-question.spec.js @@ -0,0 +1,122 @@ +import { shallowMount } from "@vue/test-utils"; +import { getMountOptions } from "@/helpers/unit-test-helper.js"; +import glassPartQuestion from "@/layouts/vehicle-parts/glass-part-question/glass-part-question.vue"; +import store from "@/store"; + +jest.mock("@/store", () => { return {}; }, { virtual: true }); + +const featureListData = { + colorAnswersProp: [ + { ColorAnswerText: 'Green Tint', FeatureAnswers: [{ FeatureAnswerText: "heated glass, solar, 1 hole", PartNumber: "DB12209GTYN" }] }, + { ColorAnswerText: 'Gray Tint Privacy', FeatureAnswers: [{ FeatureAnswerText: "heated glass, solar, 1 hole", PartNumber: "DB12209YPYN" }] } + ], + glassLocationProp: "Rear", + glassNameProp: "Stationary", + modelValueProp: {} +} + +describe("glass-part-question.vue", () => { + + test("Part data passed in, should map data for ButtonQuestion (radio type)", async () => { + + //Arrange + const { wrapper } = setupMocks(featureListData); + + //Act + await wrapper.vm.$nextTick(); + + //Assert + expect(Object.keys(wrapper.vm.featureListData).length).toBe(2); + expect(wrapper.vm.featureListData['Green Tint'][0].Text).toBe("heated glass, solar, 1 hole"); + expect(wrapper.vm.featureListData['Green Tint'][0].Name).toBe("DB12209GTYN"); + expect(wrapper.vm.featureListData['Gray Tint Privacy'][0].Text).toBe("heated glass, solar, 1 hole"); + expect(wrapper.vm.featureListData['Gray Tint Privacy'][0].Name).toBe("DB12209YPYN"); + + }); + + test("Tint mapper, should get tint image by glassLocation and tintColor", async () => { + + //Arrange + + const { wrapper } = setupMocks(featureListData); + + //Act + await wrapper.vm.$nextTick(); + const tintSourceImage = wrapper.vm.getTintSourceImage("Rear", "Green Tint"); + + //Assert + expect(tintSourceImage).toBe("Glass-NoShade-GreenTint.svg"); + + }); + + + test("Tint mapper, should return empty string if no tint map found", async () => { + + //Arrange + + const { wrapper } = setupMocks(featureListData); + + //Act + await wrapper.vm.$nextTick(); + const tintSourceImage = wrapper.vm.getTintSourceImage("Rear", "Crazy Rainbow Tint"); + + //Assert + expect(tintSourceImage).toBe(""); + + }); + + test("Should emit updateModelValue, and have correct attributes", async () => { + + //Arrange + + const { wrapper } = setupMocks(featureListData); + + //Act + await wrapper.vm.$nextTick(); + const listCard = await wrapper.findComponent({ + name: "listCard", + }); + + wrapper.setValue({ selectedTint: 'Green Tint' }); + + //Assert + expect(wrapper.emitted()["update:modelValue"][0]).toEqual([{ selectedTint: 'Green Tint' }]); + expect(listCard.attributes("buttonid")).toBe("Rear-Stationary-Green Tint"); + expect(listCard.attributes("groupname")).toBe("Rear-Stationary"); + expect(listCard.attributes("isradio")).toBe("true"); + }); + + test("ResetTintAndPartSelections, should reset data elements ", async () => { + + //Arrange + const { wrapper } = setupMocks(featureListData); + + //Act + await wrapper.vm.$nextTick(); + wrapper.setData({selectedTint: {"Rear-Stationary" : 'Green Tint' } }); + + expect(wrapper.vm.selectedTint).toStrictEqual({"Rear-Stationary": 'Green Tint'}); + + await wrapper.vm.ResetTintAndPartSelections(); + expect(wrapper.vm.selectedTint).toStrictEqual({}); + }); + +}); + + +function setupMocks({ glassNameProp, glassLocationProp, colorAnswersProp, modelValueProp }) { + + //Mock store + const mountOptions = getMountOptions({}); + + mountOptions.propsData = { + glassName: glassNameProp, + glassLocation: glassLocationProp, + colorAnswers: colorAnswersProp, + modelValue: modelValueProp + }; + + const wrapper = shallowMount(glassPartQuestion, mountOptions); + + return { wrapper }; +} \ No newline at end of file diff --git a/src/layouts/vehicle-parts/glass-part-question/glass-part-question.vue b/src/layouts/vehicle-parts/glass-part-question/glass-part-question.vue index 83e12a083..8e159aebe 100644 --- a/src/layouts/vehicle-parts/glass-part-question/glass-part-question.vue +++ b/src/layouts/vehicle-parts/glass-part-question/glass-part-question.vue @@ -98,7 +98,7 @@ export default { return arr; }, {}); - + return tintMapByColor; } }, diff --git a/src/store/store.spec.js b/src/store/store.spec.js index b6920b72f..fa75f3255 100644 --- a/src/store/store.spec.js +++ b/src/store/store.spec.js @@ -100,7 +100,7 @@ describe("Mutations", () => { expect(storeState.applicationUser.eventBus).toEqual([{ EventOne: "ValueOne" }]); }); - it("resetVehicleAndDependencies, should set fields to null", () => { + it("resetVehicleState, should set fields to null", () => { // Arrange const storeState = state; @@ -120,7 +120,7 @@ describe("Mutations", () => { expect(storeState.order.vehicle.category).toEqual("CAR"); // Act - mutations.resetVehicleAndDependencies(storeState); + mutations.resetVehicleState(storeState); // Expect expect(storeState.order.vehicle.year).toEqual(null); @@ -132,7 +132,7 @@ describe("Mutations", () => { }); - it("resetDamageAndDependencies, should set fields to null", () => { + it("resetDamageState, should set fields to null", () => { // Arrange const storeState = state; @@ -154,7 +154,7 @@ describe("Mutations", () => { expect(storeState.order.damage.rearGlassToReplace).toEqual("Slider"); // Act - mutations.resetDamageAndDependencies(storeState); + mutations.resetDamageState(storeState); // Expect expect(storeState.order.damage.isRepair).toEqual(null); From 57770537fd734275a07e1ce91c61b8321c5ac49a Mon Sep 17 00:00:00 2001 From: FrankRua Date: Tue, 1 Mar 2022 11:01:16 -0500 Subject: [PATCH 29/35] More unit tests --- jest.config.js | 3 + src/mixins/base-mixin.spec.js | 12 ++- src/store/store.spec.js | 81 +++++++++++++++++++ src/ux-components/list-card/list-card.spec.js | 3 +- 4 files changed, 97 insertions(+), 2 deletions(-) diff --git a/jest.config.js b/jest.config.js index 4a2601c8f..eceda28b1 100644 --- a/jest.config.js +++ b/jest.config.js @@ -17,6 +17,9 @@ module.exports = { "!src/layouts/vehicle-damage/windshield-options/windshield-options.vue", "!src/layouts/address-poc/address-poc.vue", "!src/layouts/nested-radio-poc/nested-radio.vue", + "!src/layouts/button-question-examples/**/*.vue", + "!src/layouts/part-questions/**/*.vue", + "!src/layouts/reveal/**/*.vue", ], //! means exclude from coverage. testMatch: ["**/*.spec.(js|jsx|ts|tsx)|**/__tests__/*.(js|jsx|ts|tsx)"], coverageThreshold: { diff --git a/src/mixins/base-mixin.spec.js b/src/mixins/base-mixin.spec.js index bdc083399..da684af1b 100644 --- a/src/mixins/base-mixin.spec.js +++ b/src/mixins/base-mixin.spec.js @@ -26,6 +26,14 @@ describe("baseMixin.js", () => { expect(store.dispatch).toBeCalledWith(type, payload); }); + test("savePageDataToStore, should call store commit", () => { + const mixIn = getMixInInstance({}); + + mixIn.methods.savePageDataToStore('vehicle-year', {}); + + expect(store.commit).toBeCalledWith(storeMutations.UPDATE_PAGE_DATA, { page: 'vehicle-year', data: {}}); + }); + test("computed: storeActions should be equal to import object", () => { // Arrange const mixIn = getMixInInstance({}); @@ -91,9 +99,11 @@ function getMixInInstance({ isDispatchSuccess = true }) { // Attach mocks to mixin const baseMixIn = baseMixin; baseMixIn.methods.$route = route; - store.dispatch = storeDispatch; baseMixIn.methods.storeActions = storeActions; baseMixIn.methods.widgetNames = widgetNames; + store.dispatch = storeDispatch; + store.commit = jest.fn(); + return baseMixIn; } diff --git a/src/store/store.spec.js b/src/store/store.spec.js index fa75f3255..ccb715e50 100644 --- a/src/store/store.spec.js +++ b/src/store/store.spec.js @@ -166,6 +166,50 @@ describe("Mutations", () => { }); + it("Updates number of chips in state", () => { + // Arrange + const storeState = state; + + // Act + mutations.updateNumberOfChips(storeState, "1"); + + // Assert + expect(storeState.order.damage.numberOfChips).toEqual("1"); + }); + + it("Updates glass to replace in state", () => { + // Arrange + const storeState = state; + + // Act + mutations.updateGlassToReplace(storeState, ["Windshield"]); + + // Assert + expect(storeState.order.damage.glassToReplace).toEqual(["Windshield"]); + }); + + it("Updates Parts in state", () => { + // Arrange + const storeState = state; + + // Act + mutations.updateParts(storeState, { 'Windshield-Single': 'PARTNUM101'}); + + // Assert + expect(storeState.order.lineItems.glassParts).toEqual({ 'Windshield-Single': 'PARTNUM101'}); + }); + + it("Updates page data in state", () => { + // Arrange + const storeState = state; + + // Act + mutations.updatePageData(storeState, { page: 'vehicle-year', data: {} }); + + // Assert + expect(storeState.applicationUser.pageData['vehicle-year']).toEqual({}); + }); + }); describe("Actions", () => { @@ -480,4 +524,41 @@ describe("Getters", () => { }); + it("Damage getter, should return damage data", () => { + // Arrange + const storeState = state; + + // Act + mutations.updateGlassToReplace(storeState, ["Rear"]); + + // Assert + expect(getters.damage(storeState).glassToReplace).toEqual(["Rear"]); + + }); + + it("lineItems getter, should return lineItem data", () => { + // Arrange + const storeState = state; + + // Act + mutations.updateParts(storeState, {"Rear-Stationary": 'PART101'}); + + // Assert + expect(getters.lineItems(storeState).glassParts).toEqual({"Rear-Stationary": 'PART101'}); + + }); + + + it("PageData getter, should return page data for specific page", () => { + // Arrange + const storeState = state; + + // Act + mutations.updatePageData(storeState, { page: 'vehicle-year', data: {} }); + + // Assert + expect(getters.pageData(storeState)('vehicle-year')).toEqual({}); + + }); + }); \ No newline at end of file diff --git a/src/ux-components/list-card/list-card.spec.js b/src/ux-components/list-card/list-card.spec.js index 398c89c78..cee720503 100644 --- a/src/ux-components/list-card/list-card.spec.js +++ b/src/ux-components/list-card/list-card.spec.js @@ -204,11 +204,12 @@ describe("list-card.vue", () => { isRequired: true, isWide: false, modelValue: ["List Card Checkbox"], + buttonID: 'list-card-id' }, }); wrapper.vm.handleCheckChange(); // Assert - expect(wrapper.emitted()["isCheckedChanged"][0]).toEqual([{value: "List Card Checkbox", checkValue: Boolean}]); + expect(wrapper.emitted()["isCheckedChanged"][0]).toEqual([{value: "List Card Checkbox", checkValue: Boolean, buttonId: 'list-card-id'}]); }); it("Should set checkValue data if selectedButtonIDs has value(s)", async () => { From 3c0439c0d30c1ee7746b7ba44e36f2c1f77ca7da Mon Sep 17 00:00:00 2001 From: CarlNation Date: Tue, 1 Mar 2022 11:28:18 -0500 Subject: [PATCH 30/35] CSR-297 vehicle damage routing and testing --- src/constants/damage-locations-cms.js | 9 + src/constants/damage-locations-parts.js | 8 + .../vehicle-damage/vehicle-damage.spec.js | 246 +++++++++++++++--- src/layouts/vehicle-damage/vehicle-damage.vue | 44 ++-- 4 files changed, 255 insertions(+), 52 deletions(-) create mode 100644 src/constants/damage-locations-cms.js create mode 100644 src/constants/damage-locations-parts.js diff --git a/src/constants/damage-locations-cms.js b/src/constants/damage-locations-cms.js new file mode 100644 index 000000000..c4787a598 --- /dev/null +++ b/src/constants/damage-locations-cms.js @@ -0,0 +1,9 @@ +const damageLocationsCms = { + WINDSHIELD: "WINDSHIELD", + SIDEDOOR: "SIDEDOOR", + REARWINDOW: "REARWINDOW", + DRIVERSIDE: "DRIVERSIDE", + PASSENGERSIDE: "PASSENGERSIDE", + }; + + export { damageLocationsCms }; \ No newline at end of file diff --git a/src/constants/damage-locations-parts.js b/src/constants/damage-locations-parts.js new file mode 100644 index 000000000..465d58420 --- /dev/null +++ b/src/constants/damage-locations-parts.js @@ -0,0 +1,8 @@ +const damageLocationsParts = { + WINDSHIELD: "Windshield", + DRIVER: "Driver", + PASSENGER: "Passenger", + REAR: "Rear", + }; + + export { damageLocationsParts }; \ No newline at end of file diff --git a/src/layouts/vehicle-damage/vehicle-damage.spec.js b/src/layouts/vehicle-damage/vehicle-damage.spec.js index 50cee4876..3b5913e56 100644 --- a/src/layouts/vehicle-damage/vehicle-damage.spec.js +++ b/src/layouts/vehicle-damage/vehicle-damage.spec.js @@ -146,28 +146,6 @@ describe("vehicle-damage.vue", () => { }); }); -describe("vehicle-damage.vue", () => { - test("Call invalidation, ResetPartsAndDeps should be called", async () => { - - //Arrange - const { wrapper } = setupMocks({}); - - //Act - vehicleDamage.beforeRouteEnter.call( - wrapper.vm, - { query: { fmgPage: "vehicle-damage" } }, - undefined, - (c) => c(wrapper.vm) - ); - - wrapper.vm.resetDependentState(); - - //Assert - expect(store.dispatch).toBeCalledWith(storeActions.RESET_PARTS_STATE) - - }); -}); - describe("vehicle-damage.vue", () => { test("BackButtonAction triggers a router.navigate change", async () => { @@ -191,8 +169,7 @@ describe("vehicle-damage.vue", () => { }); describe("vehicle-damage.vue", () => { - test("ForwardButtonAction triggers a router.navigate change and saves selections to store", async () => { - + test("Replace several pieces of glass on ForwardButtonAction triggers a router.navigateAfterSave and saves selections to store", async () => { //Arrange const partsData = { partsOrQuestions: [{ @@ -238,17 +215,23 @@ describe("vehicle-damage.vue", () => { }, }); - - wrapper.vm.selectedWindshieldOptions = { - selectedWindshieldChipCount: null, - selectedWindshieldReplaceOptions: ["Single"], + wrapper.vm.selectedDamageLocations = ["Windshield", "SideDoor", "RearWindow"]; + wrapper.vm.selectedWindshieldOptions = { + selectedWindshieldChipCount : null, + selectedWindshieldReplaceOptions : ["Single"], selectedWindshieldDamageType: ["Replace"] }; + wrapper.vm.sideDoorOptionsData = { + selectedDoorSides: ["DriverSide", "PassengerSide"], + selectedDriverSideReplaceOptions: ["Back"], + selectedPassengerSideReplaceOptions: ["Quarter"] + }; - wrapper.vm.selectedDamageLocations = ["Windshield"]; + wrapper.vm.selectedRearReplaceOptions = ["Stationary"]; - const expectedGlassToReplace = [{ location: "Windshield", name: "Single" }]; + const expectedGlassToReplace = [{location: "Windshield", name: "Single"}, {location: "Driver", name: "Back"}, + {location: "Passenger", name: "Quarter"}, {location: "Rear", name: "Stationary"}]; //Act vehicleDamage.beforeRouteEnter.call( @@ -257,7 +240,7 @@ describe("vehicle-damage.vue", () => { undefined, (c) => c(wrapper.vm) ); - + await wrapper.vm.forwardButtonAction(); //Assert @@ -268,6 +251,177 @@ describe("vehicle-damage.vue", () => { }); }); +describe("vehicle-damage.vue", () => { + test("Windshield replace with single part on ForwardButtonAction triggers a router.navigateAfterSave and saves selections to store", async () => { + //Arrange + const partsData = { partsOrQuestions: [ + { + glassLocation: "Windshield", + glassName: "Single", + partQuestions: null, + parts: [ + { + color: "Green Tint, Green Shade", + description: "rain sensor, solar", + partNumber: "FW02728GGYN", + requiresCapabilityQuestions: false, + requiresRecalibration: false + } + ]}]}; + + const { wrapper } = setupMocks({ + pageHeaderWidgetHeaderText: "", + mountOptionsMockData: { + router: { navigateAfterSave: jest.fn(), }, + actionList: [{ actionName: storeActions.GET_PARTS_OR_QUESTIONS, data: partsData, },],}, + }); + + wrapper.vm.selectedDamageLocations = ["Windshield"]; + wrapper.vm.selectedWindshieldOptions = { + selectedWindshieldChipCount : null, + selectedWindshieldReplaceOptions : ["Single"], + selectedWindshieldDamageType: ["Replace"] + }; + + const expectedGlassToReplace = [{location: "Windshield", name: "Single"},]; + + //Act + vehicleDamage.beforeRouteEnter.call( + wrapper.vm, + { query: { fmgPage: "vehicle-damage" } }, + undefined, + (c) => c(wrapper.vm) + ); + + await wrapper.vm.forwardButtonAction(); + + //Assert + expect(wrapper.vm.$router.navigateAfterSave).toHaveBeenCalled(); + expect(wrapper.vm.selectedGlassToReplace()).toEqual(expectedGlassToReplace); + expect(store.commit).toBeCalledWith(storeMutations.UPDATE_IS_REPAIR, false); + expect(store.commit).toBeCalledWith(storeMutations.UPDATE_GLASS_TO_REPLACE, expectedGlassToReplace); + expect(store.commit).toBeCalledWith(storeMutations.UPDATE_PARTS, partsData.partsOrQuestions[0].parts); + }); +}); + +describe("vehicle-damage.vue", () => { + test("Windshield replace with multiple parts on ForwardButtonAction triggers a router.navigateAfterSave and saves selections to store", async () => { + //Arrange + const partsData = { partsOrQuestions: [ + { + glassLocation: "Windshield", + glassName: "Single", + partQuestions: null, + parts: [ + { + color: "Green Tint, Green Shade", + description: "rain sensor, solar", + partNumber: "FW02728GGYN", + requiresCapabilityQuestions: false, + requiresRecalibration: false + }, + { + color: "Green Tint, Green Shade", + description: "rain sensor, solar, hydrophobic coating", + partNumber: "FW02760GGYN", + requiresCapabilityQuestions: false, + requiresRecalibration: false + } + ]}, + { + glassName: "Stationary", + glassLocation: "Rear", + parts: [ + { + partNumber: "DB09626GTYN", + description: "heated glass, solar, antenna", + color: "Green Tint", + requiresRecalibration: false, + requiresCapabilityQuestions: false, + childParts: null + }, + { + partNumber: "DB09821GTYN", + description: "heated glass, solar, antenna, onstar", + color: "Green Tint", + requiresRecalibration: false, + requiresCapabilityQuestions: false, + childParts: null + } + ], + "partQuestions": null + } + ]}; + + const { wrapper } = setupMocks({ + pageHeaderWidgetHeaderText: "", + mountOptionsMockData: { + router: { navigateAfterSave: jest.fn(), }, + actionList: [{ actionName: storeActions.GET_PARTS_OR_QUESTIONS, data: partsData, },],}, + }); + + wrapper.vm.selectedDamageLocations = ["Windshield"]; + wrapper.vm.selectedWindshieldOptions = { + selectedWindshieldChipCount : null, + selectedWindshieldReplaceOptions : ["Single"], + selectedWindshieldDamageType: ["Replace"] + }; + + const expectedGlassToReplace = [{location: "Windshield", name: "Single"},]; + + //Act + vehicleDamage.beforeRouteEnter.call( + wrapper.vm, + { query: { fmgPage: "vehicle-damage" } }, + undefined, + (c) => c(wrapper.vm) + ); + + await wrapper.vm.forwardButtonAction(); + + //Assert + expect(wrapper.vm.$router.navigateAfterSave).toHaveBeenCalled(); + expect(wrapper.vm.selectedGlassToReplace()).toEqual(expectedGlassToReplace); + expect(store.commit).toBeCalledWith(storeMutations.UPDATE_IS_REPAIR, false); + expect(store.commit).toBeCalledWith(storeMutations.UPDATE_GLASS_TO_REPLACE, expectedGlassToReplace); + }); +}); + + +describe("vehicle-damage.vue", () => { + test("Windshield repair on ForwardButtonAction triggers a router.navigateAfterSave and saves selection to store", async () => { + //Arrange + const partsData = { partsOrQuestions: []}; + const { wrapper } = setupMocks({ + pageHeaderWidgetHeaderText: "", + mountOptionsMockData: { + router: { navigateAfterSave: jest.fn(), }, + actionList: [{ actionName: storeActions.GET_PARTS_OR_QUESTIONS, data: partsData, },],}, + }); + + wrapper.vm.selectedDamageLocations = ["Windshield"]; + wrapper.vm.selectedWindshieldOptions = { + selectedWindshieldChipCount : [2], + selectedWindshieldDamageType: ["Repair"] + }; + + //Act + vehicleDamage.beforeRouteEnter.call( + wrapper.vm, + { query: { fmgPage: "vehicle-damage" } }, + undefined, + (c) => c(wrapper.vm) + ); + + await wrapper.vm.forwardButtonAction(); + + //Assert + expect(wrapper.vm.$router.navigateAfterSave).toHaveBeenCalled(); + expect(store.commit).toBeCalledWith(storeMutations.UPDATE_IS_REPAIR, true); + expect(store.commit).toBeCalledWith(storeMutations.UPDATE_NUMBER_OF_CHIPS, 2); + }); +}); + describe("vehicle-damage.vue", () => { test("isWindshieldDamageLocation is true when windshield is selected", async () => { @@ -347,13 +501,35 @@ describe("vehicle-damage.vue", () => { ); wrapper.vm.selectedDamageLocations = ["Windshield"]; - wrapper.vm.selectedWindshieldOptions = { selectedWindshieldDamageType: ["Repair"] }; + wrapper.vm.selectedWindshieldOptions = { selectedWindshieldDamageType: ["Repair"]}; //Assert expect(wrapper.vm.isWindshieldRepair).toEqual(true); }); }); +describe("vehicle-damage.vue", () => { + test("isWindshieldRepair is false if windshield damage is not selected", async () => { + + //Arrange + const { wrapper } = setupMocks({}); + + //Act + vehicleDamage.beforeRouteEnter.call( + wrapper.vm, + { query: { fmgPage: "vehicle-damage" } }, + undefined, + (c) => c(wrapper.vm) + ); + + wrapper.vm.selectedDamageLocations = ["SideDoor"]; + wrapper.vm.selectedWindshieldOptions = { selectedWindshieldDamageType: ["Repair"]}; + + //Assert + expect(wrapper.vm.isWindshieldRepair).toEqual(false); + }); +}); + describe("vehicle-damage.vue", () => { test("isDriverSideReplace is true if side door driver is selected", async () => { @@ -369,7 +545,7 @@ describe("vehicle-damage.vue", () => { ); wrapper.vm.selectedDamageLocations = ["Sidedoor"]; - wrapper.vm.sideDoorOptionsData = { selectedDoorSides: ["DriverSide"] }; + wrapper.vm.sideDoorOptionsData = { selectedDoorSides: ["DriverSide"]}; //Assert expect(wrapper.vm.isDriverSideReplace).toEqual(true); @@ -391,7 +567,7 @@ describe("vehicle-damage.vue", () => { ); wrapper.vm.selectedDamageLocations = ["Sidedoor"]; - wrapper.vm.sideDoorOptionsData = { selectedDoorSides: ["PassengerSide"] }; + wrapper.vm.sideDoorOptionsData = { selectedDoorSides: ["PassengerSide"]}; //Assert expect(wrapper.vm.isPassengerSideReplace).toEqual(true); @@ -399,7 +575,7 @@ describe("vehicle-damage.vue", () => { }); describe("vehicle-damage.vue", () => { - test("Call invalidation, ResetPartsAndDeps should be called", async () => { + test("Call invalidation, ResetPartsAndState should be called", async () => { //Arrange const { wrapper } = setupMocks({}); diff --git a/src/layouts/vehicle-damage/vehicle-damage.vue b/src/layouts/vehicle-damage/vehicle-damage.vue index 8db230860..5a9eca92f 100644 --- a/src/layouts/vehicle-damage/vehicle-damage.vue +++ b/src/layouts/vehicle-damage/vehicle-damage.vue @@ -41,12 +41,13 @@ import windshieldOptions from "@/layouts/vehicle-damage/windshield-options/winds import replaceOptionsQuestion from "@/layouts/vehicle-damage/replace-options-question/replace-options-question"; // Supporting files -import { routerParameterKeys } from "@/router/router-constants/router-parameter-keys"; import { fetchCmsContentForPage } from "@/helpers/cms-content-helper"; import { settleAllPromises } from "@/helpers/layout-helper"; import { storeActions } from "@/constants/store-actions"; import store from "@/store"; import baseMixin from "@/mixins/base-mixin"; +import { damageLocationsParts } from "@/constants/damage-locations-parts.js"; +import { damageLocationsCms } from "@/constants/damage-locations-cms.js"; export default { @@ -144,7 +145,7 @@ export default { var partsData = await baseMixin.methods.dispatchNonBlockingStoreAction(this.storeActions.GET_PARTS_OR_QUESTIONS, { carId: store.getters.vehicle.carId, glassArray: this.selectedGlassToReplace()}, false); - + this.navigateForward(partsData); }, @@ -155,14 +156,23 @@ export default { return; } - //found multiple parts - if (partsData.data.partsOrQuestions.some(pq => pq.parts !== null && pq.parts.length > 1)){ - this.$router.navigateAfterSave(this.navigationScenarios.SELECTED_DAMAGE_WITH_MULTIPLE_PARTS, this.$route, {}, {}, partsData.data); - return; + //found multiple parts for a single glass location (Windshield, Driver, Passenger, Rear) + if (partsData.data.partsOrQuestions){ + var multiParts = false; + partsData.data.partsOrQuestions.forEach(pq => { + if (pq.parts != null && pq.parts.length > 1){ + this.$router.navigateAfterSave(this.navigationScenarios.SELECTED_DAMAGE_WITH_MULTIPLE_PARTS, this.$route, {}, {}, partsData.data); + multiParts = true; + } + }); + if (multiParts) return; } - //should only be 1 part and no problem questions at this point so save the part to the store - store.commit(this.storeMutations.UPDATE_PARTS, partsData.data.partsOrQuestions[0].parts); + //if not a repair then there should only be 1 part and no problem questions at this point so save the part to the store. + if (!this.isWindshieldRepair){ + store.commit(this.storeMutations.UPDATE_PARTS, partsData.data.partsOrQuestions[0].parts); + } + this.$router.navigateAfterSave(this.navigationScenarios.SELECTED_DAMAGE_WITH_SINGLE_PART, this.$route); }, @@ -170,25 +180,25 @@ export default { var selectedGlassToReplace = []; if (this.isWindshieldDamageLocation && !this.isWindshieldRepair){ this.selectedWindshieldOptions.selectedWindshieldReplaceOptions.forEach(wsItem => { - selectedGlassToReplace.push({ location: "Windshield", name: wsItem}); + selectedGlassToReplace.push({ location: damageLocationsParts.WINDSHIELD, name: wsItem}); }) } if (this.isDriverSideReplace){ this.sideDoorOptionsData.selectedDriverSideReplaceOptions.forEach(driverItem => { - selectedGlassToReplace.push({ location: "Driver", name: driverItem}); + selectedGlassToReplace.push({ location: damageLocationsParts.DRIVER, name: driverItem}); }) } if (this.isPassengerSideReplace){ this.sideDoorOptionsData.selectedPassengerSideReplaceOptions.forEach(passengerItem => { - selectedGlassToReplace.push({ location: "Passenger", name: passengerItem}); + selectedGlassToReplace.push({ location: damageLocationsParts.PASSENGER, name: passengerItem}); }) } if (this.isRearWindowDamageLocation) { this.selectedRearReplaceOptions.forEach(rearItem => { - selectedGlassToReplace.push({ location: "Rear", name: rearItem}); + selectedGlassToReplace.push({ location: damageLocationsParts.REAR, name: rearItem}); }) } @@ -199,19 +209,19 @@ export default { isWindshieldDamageLocation() { return this.selectedDamageLocations.some(selectedDamages => { - return selectedDamages.toUpperCase() === "WINDSHIELD"; + return selectedDamages.toUpperCase() === damageLocationsCms.WINDSHIELD; }); }, isSideDoorDamageLocation() { return this.selectedDamageLocations.some(selectedDamages => { - return selectedDamages.toUpperCase() === "SIDEDOOR"; + return selectedDamages.toUpperCase() === damageLocationsCms.SIDEDOOR; }); }, isRearWindowDamageLocation() { return this.selectedDamageLocations.some(selectedDamages => { - return selectedDamages.toUpperCase() === "REARWINDOW"; + return selectedDamages.toUpperCase() === damageLocationsCms.REARWINDOW; }); }, isWindshieldRepair() { @@ -227,7 +237,7 @@ export default { return this.sideDoorOptionsData.selectedDoorSides.some(selectedDriverSide => { - return selectedDriverSide.toUpperCase() === "DRIVERSIDE"; + return selectedDriverSide.toUpperCase() === damageLocationsCms.DRIVERSIDE; }); }, isPassengerSideReplace() { @@ -235,7 +245,7 @@ export default { return this.sideDoorOptionsData.selectedDoorSides.some(selectedPassengerSide => { - return selectedPassengerSide.toUpperCase() === "PASSENGERSIDE"; + return selectedPassengerSide.toUpperCase() === damageLocationsCms.PASSENGERSIDE; }); } }, From 97403cbb8b28e519d8f88db20b4ae2cfa51f51dd Mon Sep 17 00:00:00 2001 From: CarlNation Date: Tue, 1 Mar 2022 11:35:51 -0500 Subject: [PATCH 31/35] CSR-297 empty object valid --- src/global-methods.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/global-methods.js b/src/global-methods.js index a0023ef4c..bb202de13 100644 --- a/src/global-methods.js +++ b/src/global-methods.js @@ -19,7 +19,7 @@ export default { }).then( (response) => { if (response.status == httpStatusCodes.OK) { - if(response.data == undefined || response.data == {}) { + if(response.data == undefined) { reject(response); }else{ resolve(response); From 2fe651c47405d695a0e1748f0acc88aa5550479c Mon Sep 17 00:00:00 2001 From: CarlNation Date: Tue, 1 Mar 2022 11:52:17 -0500 Subject: [PATCH 32/35] CSR-297 change to const --- src/global-methods.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/global-methods.js b/src/global-methods.js index bb202de13..788d4c2e4 100644 --- a/src/global-methods.js +++ b/src/global-methods.js @@ -5,7 +5,7 @@ import httpStatusCodes from "http-status-codes"; export default { callHttpClient({ method, endpoint, payload }) { return new Promise((resolve, reject) => { - var apiGatewayUrl = applicationConfig.CONSUMER_APIGATEWAY_URL; + const apiGatewayUrl = applicationConfig.CONSUMER_APIGATEWAY_URL; const payloadAndAnalyticsData = Object.assign({}, payload, { AppName: "FixMyGlass", }); From 6d0dcb04a08fafde17b5d6ee1b055c6d43f2d2e2 Mon Sep 17 00:00:00 2001 From: FrankRua Date: Tue, 1 Mar 2022 13:40:12 -0500 Subject: [PATCH 33/35] PR review --- .../damage-location-question/damage-location-question.spec.js | 2 -- src/layouts/vehicle-parts/vehicle-parts.spec.js | 2 +- 2 files changed, 1 insertion(+), 3 deletions(-) diff --git a/src/layouts/vehicle-damage/damage-location-question/damage-location-question.spec.js b/src/layouts/vehicle-damage/damage-location-question/damage-location-question.spec.js index ce12c15ff..20c016a12 100644 --- a/src/layouts/vehicle-damage/damage-location-question/damage-location-question.spec.js +++ b/src/layouts/vehicle-damage/damage-location-question/damage-location-question.spec.js @@ -18,9 +18,7 @@ describe("damage-location-question.vue", () => { //Assert expect(wrapper.emitted()["update:modelValue"][0]).toEqual([{ modelValue: ["Backseat"] }]); }); -}); -describe("damage-location-question.vue", () => { test("Answers to display filtered by data from api.", async () => { //Arrange diff --git a/src/layouts/vehicle-parts/vehicle-parts.spec.js b/src/layouts/vehicle-parts/vehicle-parts.spec.js index b52be441b..5d22a458c 100644 --- a/src/layouts/vehicle-parts/vehicle-parts.spec.js +++ b/src/layouts/vehicle-parts/vehicle-parts.spec.js @@ -66,7 +66,7 @@ const basePartResponse = { } -describe("vehicle-damage.vue", () => { +describe("vehicle-parts.vue", () => { test("Page header is initialized with api data", async (done) => { //Arrange From b734e481c1df8906c29b039e30813e00a8e5ff2b Mon Sep 17 00:00:00 2001 From: FrankRua Date: Tue, 1 Mar 2022 15:08:00 -0500 Subject: [PATCH 34/35] Fix defect for routing --- src/router/index.js | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/src/router/index.js b/src/router/index.js index 0d98f6698..aafc5e130 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -57,17 +57,20 @@ const routes = [ try { // If we already have our route, go to it. if (router.hasRoute(to.query.fmgPage)) { + // Since our route is already in scope, we can grab the component from it and call the arePagePrerequisitesValid function. - const component = router - .getRoutes() - .filter((x) => x.name === to.query.fmgPage)[0].components; + let component = router.getRoutes().filter((x) => x.name === to.query.fmgPage)[0].components; + + // If the component hasn't been loaded fully, load it before we check prerequisites. + if (component.default.methods == undefined) { + component = await component.default(); + } if (!arePagePrerequisitesValid(component)) { await GoToFunnelStartOn404(next); } - - return next({ name: to.query.fmgPage, query: to.query, params: to.params }); + return next({ name: to.query.fmgPage, query: to.query, params: to.params }); } // Get route info for the given url. Names will have a 1:1 relationship with names in the Cms. @@ -82,10 +85,7 @@ const routes = [ // Call the next components arePagePrerequisitesValid method before load. // If it returns false, use the 404 logic. - const nextComponent = await router - .getRoutes() - .filter((x) => x.name === routeData[0].name)[0] - .components.default(); + const nextComponent = await router.getRoutes().filter((x) => x.name === routeData[0].name)[0].components.default(); if (!arePagePrerequisitesValid(nextComponent)) { await GoToFunnelStartOn404(next); From 6596239d38ebf97bd2cddbbe84e9070de9884a17 Mon Sep 17 00:00:00 2001 From: FrankRua Date: Tue, 1 Mar 2022 15:09:18 -0500 Subject: [PATCH 35/35] one more = --- src/router/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/router/index.js b/src/router/index.js index aafc5e130..be434e9d8 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -62,7 +62,7 @@ const routes = [ let component = router.getRoutes().filter((x) => x.name === to.query.fmgPage)[0].components; // If the component hasn't been loaded fully, load it before we check prerequisites. - if (component.default.methods == undefined) { + if (component.default.methods === undefined) { component = await component.default(); }