tagging release w.t.f.

frontend/src/pages/loads/Add.vue

@@ -1,7 +1,8 @@
 <template>
   <Card class="md:w-2/3 w-full">
     <template #title>
-      Add New Load
+      <span v-if="route.params.id">Edit Load</span>
+      <span v-else>Add New Load</span>
     </template>
     <template #content>
       <div class="grid grid-cols-1">
@@ -103,6 +104,7 @@
     </template>
   </Dialog>
 
+  <FullScreenLoader :loading="loading" />
 </template>
 <script lang="ts">
 interface Select {
@@ -121,13 +123,16 @@ import { defineAsyncComponent, onMounted, ref } from 'vue'
 import { Primers } from '../../types/primers'
 import { Powder } from '../../types/powder'
 import axios from 'axios'
-import { Response } from '../../types/Response'
+import { Load, Response } from '../../types/Response'
 import { icons } from '../../lib/icons.ts'
 import { FileUploadSelectEvent } from 'primevue/fileupload'
 import useVuelidate from '@vuelidate/core'
 import { required } from '@vuelidate/validators'
 import { useToast } from 'primevue/usetoast'
-import router from '../../router'
+import { useRoute, useRouter } from 'vue-router'
+
+const router = useRouter()
+const route = useRoute()
 
 const Card = defineAsyncComponent(() => import('primevue/card'))
 const Select = defineAsyncComponent(() => import('primevue/select'))
@@ -138,6 +143,7 @@ const InputMask = defineAsyncComponent(() => import('primevue/inputmask'))
 const FileUpload = defineAsyncComponent(() => import('primevue/fileupload'))
 const Dialog = defineAsyncComponent(() => import('primevue/dialog'))
 const Message = defineAsyncComponent(() => import('primevue/message'))
+const FullScreenLoader = defineAsyncComponent(() => import('../../components/FullScreenLoader.vue'))
 
 const toast = useToast()
 
@@ -145,6 +151,7 @@ const bullets = ref<Select[]>([])
 const primers = ref<Select[]>([])
 const powders = ref<Select[]>([])
 const cartridges = ref<Select[]>([])
+const loading = ref(false)
 
 const cartridgeName = ref('')
 const addCartridgeDialog = ref(false)
@@ -191,21 +198,18 @@ const fetchBullets = async () => {
     bullets.value.push({ label: `${bullet.manufacturer.name} ${bullet.weight}gr ${bullet.name}`, value: bullet.id })
   })
 }
-
 const fetchPrimers = async () => {
   const response = await axios.get<any, Response<Primers[]>>(`${import.meta.env.VITE_API}/primer`)
   response.data.payload.forEach((primer: Primers) => {
     primers.value.push({ label: `${primer.manufacturer.name} ${primer.name}`, value: primer.id })
   })
 }
-
 const fetchPowders = async () => {
   const response = await axios.get<any, Response<Powder[]>>(`${import.meta.env.VITE_API}/powder`)
   response.data.payload.forEach((powder: Powder) => {
     powders.value.push({ label: `${powder.manufacturer.name} ${powder.name}`, value: powder.id })
   })
 }
-
 const fetchCartridges = async () => {
   cartridges.value = []
 
@@ -214,7 +218,6 @@ const fetchCartridges = async () => {
     cartridges.value.push({ label: `${cartridge.name}`, value: cartridge.id })
   })
 }
-
 const addCartridgeName = async () => {
   if (cartridgeName.value === '') {
     return
@@ -237,7 +240,6 @@ const addCartridgeName = async () => {
   cartridgeName.value = ''
   addCartridgeDialog.value = false
 }
-
 const add = async () => {
   v$.value.$touch()
 
@@ -284,14 +286,46 @@ const add = async () => {
       life: 3000,
     })
   }
-
 }
 
+const fetchLoad = async () => {
+  if (!route.params.id) {
+    return
+  }
+
+  loading.value = true
+  const response = await axios.get<any, Response<Load>>(`${import.meta.env.VITE_API}/load/${route.params.id}`)
+
+  if (response.data.payload) {
+    load.value.cartridge = response.data.payload.cartridge_id
+    load.value.bullet = response.data.payload.bullet.id
+    load.value.powder = response.data.payload.powder.id
+    load.value.powderGrs = response.data.payload.powder_gr
+    load.value.primer = response.data.payload.primer.id
+  } else {
+    toast.add({
+      severity: 'error',
+      summary: 'Error',
+      detail: 'Load not found',
+      life: 3000,
+    })
+
+    await router.push('/loads')
+  }
+
+  loading.value = false
+}
+
+
 onMounted(() => {
   fetchBullets()
   fetchPrimers()
   fetchPowders()
   fetchCartridges()
+
+  if (route.params.id) {
+    fetchLoad()
+  }
 })
 
 </script>