commit

src/constants/store-actions.js

@@ -39,6 +39,8 @@ const storeActions = {
      UPDATE_VEHICLE_IMAGE_COLOR: "updateVehicleImageColor",
      UPDATE_VEHICLE_VIN: "updateVehicleVin",
      UPDATE_VEHICLE: "updateVehicle",
+
+     UPDATE_LAST_PAGE_VISITED: "updateLastPageVisited",
    
   
     // DEPENDENCY MUTATIONS

src/layouts/vehicle-make/vehicle-make.vue

@@ -1,9 +1,28 @@
 <template>
-    Vehicle Make Placeholder
+    <form @submit.prevent="addYear(2024)">
+        Vehicle Make Placeholder
+        <button>Add</button>
+    </form>
 </template>
 
 <script>
+    import { issStore } from "@/store/index";
+    import { storeActions } from "@/constants/store-actions";
     export default {
-        name: 'vehicle-make'
+        name: 'vehicle-make',
+        setup() 
+        {
+            const store = issStore();
+            return {
+                store
+            }
+        },
+        methods:
+        {
+            addYear(item) 
+            {
+               this.store.saveVehicleYear(item);
+            }
+        }
     }
 </script>

src/main.js

@@ -1,10 +1,14 @@
 import { createApp } from 'vue';
+import { createPinia } from "pinia";
 import App from './App.vue';
 import router from './router';
 import "../node_modules/bootstrap/dist/js/bootstrap.js";
+import piniaPluginPersistedstate from 'pinia-plugin-persistedstate';
 
 const vueApp = createApp(App);
-
+const pinia = createPinia();
+pinia.use(piniaPluginPersistedstate);
+vueApp.use(pinia);
 vueApp.use(router);
 vueApp.mount("#app");
 

src/router/index.js

@@ -2,6 +2,7 @@ import { createWebHistory, createRouter } from "vue-router";
 import { lazyLoadComponent } from "./dynamic-routing/component-loader";
 import { endpoints } from "../constants/mock-endpoints";
 import globalMethods from "@/global-methods";
+import { storeActions } from "../constants/store-actions";
 
 const routes = [
     {
@@ -16,7 +17,7 @@ const routes = [
 
                 if(routeData[0].name.toLowerCase() === "error")
                 {
-                    throw("Page not found!")
+                    throw("Page not found!");
                 }
 
                 // Add our dynamic route.
@@ -45,6 +46,7 @@ const router = createRouter({
     routes,
 });
 
+
 // Get route information by page name.
 // This will reach out to the Cms and there is a 1:1 relationship between page names and route names.
 async function GetRouteInfoFromPageName(pageName) {

src/store/index.js

@@ -0,0 +1,88 @@
+import { defineStore } from "pinia";
+import { endpoints } from "@/constants/endpoints.js";
+import globalMethods from "@/global-methods";
+import { storeActions } from "@/constants/store-actions";
+
+export const issStore = defineStore({
+    id: 'issStore',
+    state()  {
+      return {
+        order: {
+          vehicle: {
+            year: null,
+            make: null,
+            model: null,
+            style: null,
+            carId: null,
+            category: null,
+            vin: null,
+            imageUrl: null,
+            imageVifNumber: null,
+            imageColor: null,
+            registration: {
+              licensePlate: null,
+              address: null,
+              city: null,
+              state: null,
+              zipCode: null,
+              firstName: null,
+              lastName: null,
+            },
+          },
+          serviceLocation: {
+            address: null,
+            city: null,
+            state: null,
+            zipCode: null,
+          },
+          customer: {
+            emailAddress: null,
+          },
+          damage: {
+            isRepair: null,
+            numberOfChips: null,
+            glassToReplace: null,
+            partQuestionAnswers: null,
+            moldingQuestionAnswers: null,
+            capabilityQuestionAnswers: null
+          },
+          lineItems: {
+            glassParts: null
+          },
+          payment: {
+            isInsurance: null,
+            insuranceCoverage: {
+              isVerified: null
+            }
+          },
+          referralNumber: null,
+          referralDate: null,
+          referralCorrelationId: null,
+          accountNumber: 0,
+          eon: null
+        },
+      };
+    },
+    getters: {},
+    actions:
+    {
+      updateYear(state, year) {
+        state.order.vehicle.year = year;
+      },
+      updateMake(state, make) {
+        state.order.vehicle.make = make;
+      },
+      updateModel(state, model) {
+        state.order.vehicle.model = model;
+      },
+      // Vehicle
+      saveVehicleYear(year) 
+      {
+          if (this.$state.order.vehicle.year !== year) {
+            this.updateYear(this.$state,year);
+          }
+      },
+    },
+    persist: true
+});
+