CSR 77

src/constants/endpoints.js

@@ -19,6 +19,10 @@ const endpoints = {
     url: "/vehicle/api/v1/vehicle/Styles",
     method: "GET",
   },
+  GetVehicle: {
+    url: "/vehicle/api/v1/vehicle/lookup",
+    method: "GET",
+  },
   GetPageData: {
     url: "/content/api/v1/content",
     method: "GET",

src/constants/store-actions.js

@@ -5,6 +5,7 @@ const storeActions = {
   GET_VEHICLE_MAKES: "getVehicleMakes",
   GET_VEHICLE_MODELS: "getVehicleModels",
   GET_VEHICLE_STYLES: "getVehicleStyles",
+  GET_VEHICLE: "getVehicle",
   GET_EVOX_IMAGE: "getEvoxImage",
   LOOKUP_VEHICLE_BY_YMMS: "lookupVehicleByYmms",
   LOOKUP_VEHICLE_BY_VIN: "lookupVehicleByVin",

src/layouts/vehicle-damage/vehicle-damage.vue

@@ -0,0 +1,36 @@
+<template>
+    <div class="container-fluid shadow rounded-3 p-0">
+        <funnelHeader ref="funnelHeader" />
+        <vehicleBanner ref="vehicleBanner" />
+        <funnelSubHeader 
+            class="Header" 
+            ref="funnelSubHeader"
+        />
+    </div>
+</template>
+
+<script>
+// Components
+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";
+// Supporting files
+import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";
+import { settleAllPromises } from "@/helpers/layout-helper";
+
+export default ({
+    name: "vehicle-damage",
+    beforeRouteEnter(to, from, next) { 
+        // Call APIs
+        const cmsContentPromise = fetchCmsContentForPage(to.query.fmgPage);
+
+        
+
+    },
+    components: {
+        funnelHeader,
+        vehicleBanner,
+        funnelSubHeader,
+  },
+})
+</script>

src/router/router-constants/fmgPage-values.js

@@ -3,6 +3,7 @@ const fmgPageValues = {
   VEHICLE_MAKE: "vehicle-make",
   VEHICLE_MODEL: "vehicle-model",
   VEHICLE_STYLE: "vehicle-style",
+  VEHICLE_DAMAGE: "vehicle-damage",
 };
 
 export { fmgPageValues };

src/router/router-constants/navigation-scenarios.js

@@ -3,6 +3,7 @@ const navigationScenarios = {
   SELECTED_MODEL: "SELECTED_MODEL",
   SELECTED_MAKE: "SELECTED_MAKE",
   SELECTED_STYLE: "SELECTED_STYLE",
+  
   CLICKED_BACK: "CLICKED_BACK",
 };
 

src/store/index.js

@@ -24,6 +24,7 @@ export default createStore({
         vin: null,
         licensePlate: null,
         carId: null,
+        category: null,
         evoxImageId: null,
         hasSplitWindshieldOption: null,
         hasBackglassSliderOption: null,
@@ -73,6 +74,10 @@ export default createStore({
     updateStyle(state, style) {
       state.order.vehicle.style = style;
     },
+    updateVehicle(state, data) {
+      state.carId = data.carId;
+      state.category = data.category;
+    }
   },
   getters: {
     vehicle: state => state.order.vehicle
@@ -123,6 +128,13 @@ export default createStore({
         payload: {},
       });
     },
+    getVehicle(context, {year, make, model, style}) {
+      return globalMethods.callHttpClient({
+        methods: endpoints.GetVehicle.method,
+        endpoint: `${endpoints.GetVehicle.url}/${year}/${make}/${model}/${style}`,
+        payload: {},
+      })
+    },
 
     // Content API Actions
     getRouteInfo(context, { pageName }) {