commit

src/App.vue

@@ -6,7 +6,6 @@
     </transition>
   </router-view>
 </template>
-
 <style lang="scss">
   @import "./node_modules/bootstrap/scss/bootstrap";
   @import "@/styles/common-animations.scss";

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

@@ -1,8 +1,10 @@
 <template>
-    <form @submit.prevent="addYear(2024)">
+    <div>
-        Vehicle Make Placeholder
+        <input type="text" v-model="year"/>
-        <button>Add</button>
+        <span> Vehicle Make Placeholder </span>
-    </form>
+        <span>{{returnVehicleYear}}</span> 
+        <button @click="addYear(year)">Add</button>
+    </div>
 </template>
 
 <script>
@@ -10,18 +12,18 @@
     import { storeActions } from "@/constants/store-actions";
     export default {
         name: 'vehicle-make',
-        setup() 
-        {
-            const store = issStore();
-            return {
-                store
-            }
-        },
         methods:
         {
             addYear(item) 
             {
-               this.store.saveVehicleYear(item);
+               this.$store.saveVehicleYear(item);
+            }
+        },
+        computed:
+        {
+            returnVehicleYear()
+            {
+               return this.$store.order.vehicle.year;
             }
         }
     }

src/main.js

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