Restructured Create Process Into Store

spaces/pages/contacts/[mode]/[[id]].vue

@@ -40,29 +40,6 @@ const setupPage = () => {
 
 }
 
-const createItem = async () => {
-  let fullName = itemInfo.value.firstName + ' ' + itemInfo.value.lastName
-
-
-  const {data,error} = await supabase
-      .from("contacts")
-      .insert([{...itemInfo.value, fullName}])
-      .select()
-
-  if(error) {
-    console.log(error)
-  } else {
-    mode.value = "show"
-    itemInfo.value = {
-      id: 0,
-    }
-    toast.add({title: "Kontakt erfolgreich erstellt"})
-    await dataStore.fetchContacts()
-    router.push(`/contacts/show/${data[0].id}`)
-    setupPage()
-  }
-}
-
 const editCustomer = async () => {
   router.push(`/contacts/edit/${currentContact.id}`)
   setupPage()
@@ -273,7 +250,7 @@ setupPage()
         </UButton>
         <UButton
             v-else-if="mode == 'create'"
-            @click="createItem"
+            @click="dataStore.createNewItem('contacts',itemInfo)"
         >
           Erstellen
         </UButton>

spaces/pages/contracts/[mode]/[[id]].vue

@@ -37,27 +37,6 @@ const setupPage = () => {
 
 }
 
-const createItem = async () => {
-  const {data,error} = await supabase
-      .from("contracts")
-      .insert([itemInfo.value])
-      .select()
-
-  if(error) {
-    console.log(error)
-  } else {
-    mode.value = "show"
-    itemInfo.value = {
-      id: 0,
-      name: ""
-    }
-    toast.add({title: "Vertrag erfolgreich erstellt"})
-    await dataStore.fetchContracts()
-    router.push(`/contracts/show/${data[0].id}`)
-    setupPage()
-  }
-}
-
 const editCustomer = async () => {
   router.push(`/contracts/edit/${currentContract.id}`)
   setupPage()
@@ -197,7 +176,7 @@ setupPage()
         </UButton>
         <UButton
             v-else-if="mode == 'create'"
-            @click="createItem"
+            @click="dataStore.createNewItem('contracts',itemInfo)"
         >
           Erstellen
         </UButton>

spaces/pages/customers/[mode]/[[id]].vue

@@ -19,7 +19,7 @@ let currentCustomer = ref(null)
 
 //Working
 const mode = ref(route.params.mode || "show")
-const customerInfo = ref({
+const itemInfo = ref({
   name: "",
   infoData: {},
   active: true
@@ -31,37 +31,11 @@ const setupPage = async () => {
     currentCustomer.value = await dataStore.getCustomerById(Number(useRoute().params.id))
   }
 
-  if(mode.value === "edit") customerInfo.value = currentCustomer.value
+  if(mode.value === "edit") itemInfo.value = currentCustomer.value
 
 
 }
 
-const createCustomer = async () => {
-
-  if(!customerInfo.value.customerNumber) customerInfo.value.customerNumber = await numberRange.useNextNumber()
-
-
-  const {data,error} = await supabase
-      .from("customers")
-      .insert([customerInfo.value])
-      .select()
-
-  if(error) {
-    console.log(error)
-  } else {
-    mode.value = "show"
-    customerInfo.value = {
-      id: 0,
-      name: "",
-      infoData: {}
-    }
-    toast.add({title: "Kunde erfolgreich erstellt"})
-    await dataStore.fetchCustomers()
-    router.push(`/customers/show/${data[0].id}`)
-    setupPage()
-  }
-}
-
 const editCustomer = async () => {
   router.push(`/customers/edit/${currentCustomer.value.id}`)
   setupPage()
@@ -69,7 +43,7 @@ const editCustomer = async () => {
 
 const cancelEditorCreate = () => {
   mode.value = "show"
-  customerInfo.value = {
+  itemInfo.value = {
     id: 0,
     name: "",
     infoData: {}
@@ -79,8 +53,8 @@ const cancelEditorCreate = () => {
 const updateCustomer = async () => {
   const {error} = await supabase
       .from("customers")
-      .update(customerInfo.value)
+      .update(itemInfo.value)
-      .eq('id',customerInfo.value.id)
+      .eq('id',itemInfo.value.id)
 
   if(error) {
     console.log(error)
@@ -188,14 +162,14 @@ setupPage()
   </UCard>
   <UCard v-else-if="mode == 'edit' || mode == 'create'" >
     <template #header v-if="mode === 'edit'">
-      <UBadge>{{customerInfo.customerNumber}}</UBadge>{{customerInfo.name}}
+      <UBadge>{{itemInfo.customerNumber}}</UBadge>{{itemInfo.name}}
     </template>
 
     <UFormGroup
         label="Name:"
     >
       <UInput
-          v-model="customerInfo.name"
+          v-model="itemInfo.name"
       />
     </UFormGroup>
 
@@ -203,7 +177,7 @@ setupPage()
         label="Kundennummer:"
     >
       <UInput
-          v-model="customerInfo.customerNumber"
+          v-model="itemInfo.customerNumber"
           placeholder="Leer lassen für automatisch generierte Nummer"
       />
     </UFormGroup>
@@ -213,7 +187,7 @@ setupPage()
           label="Kunde aktiv:"
       >
         <UCheckbox
-            v-model="customerInfo.active"
+            v-model="itemInfo.active"
         />
       </UFormGroup>
     </UTooltip>
@@ -221,7 +195,7 @@ setupPage()
         label="Notizen:"
     >
       <UTextarea
-          v-model="customerInfo.notes"
+          v-model="itemInfo.notes"
       />
     </UFormGroup>
 
@@ -229,21 +203,21 @@ setupPage()
         label="Straße + Hausnummer"
     >
       <UInput
-          v-model="customerInfo.infoData.street"
+          v-model="itemInfo.infoData.street"
       />
     </UFormGroup>
     <UFormGroup
         label="Postleitzahl"
     >
       <UInput
-          v-model="customerInfo.infoData.zip"
+          v-model="itemInfo.infoData.zip"
       />
     </UFormGroup>
     <UFormGroup
         label="Ort"
     >
       <UInput
-          v-model="customerInfo.infoData.city"
+          v-model="itemInfo.infoData.city"
       />
     </UFormGroup>
 
@@ -251,28 +225,28 @@ setupPage()
         label="Telefon:"
     >
       <UInput
-          v-model="customerInfo.infoData.tel"
+          v-model="itemInfo.infoData.tel"
       />
     </UFormGroup>
     <UFormGroup
         label="E-Mail:"
     >
       <UInput
-          v-model="customerInfo.infoData.email"
+          v-model="itemInfo.infoData.email"
       />
     </UFormGroup>
     <UFormGroup
         label="Webseite:"
     >
       <UInput
-          v-model="customerInfo.infoData.web"
+          v-model="itemInfo.infoData.web"
       />
     </UFormGroup>
     <UFormGroup
         label="USt-Id:"
     >
       <UInput
-          v-model="customerInfo.infoData.ustid"
+          v-model="itemInfo.infoData.ustid"
       />
     </UFormGroup>
 
@@ -285,7 +259,7 @@ setupPage()
       </UButton>
       <UButton
           v-else-if="mode == 'create'"
-          @click="createCustomer"
+          @click="dataStore.createNewItem('customers',itemInfo)"
       >
         Erstellen
       </UButton>

spaces/pages/employees/absenceRequests/[mode]/[[id]].vue

@@ -46,26 +46,6 @@ const setupPage = () => {
 
 }
 
-const createItem = async () => {
-  const {data,error} = await supabase
-      .from("absenceRequests")
-      .insert([itemInfo.value])
-      .select()
-
-  if(error) {
-    console.log(error)
-  } else {
-    mode.value = "show"
-    itemInfo.value = {
-      id: 0,
-    }
-    toast.add({title: "Abwesenheit erfolgreich erstellt"})
-    await dataStore.fetchAbsenceRequests()
-    router.push(`/employees/absenceRequests/show/${data[0].id}`)
-    setupPage()
-  }
-}
-
 const editItem = async () => {
   router.push(`/employees/absenceRequests/edit/${currentItem.id}`)
   setupPage()
@@ -234,7 +214,7 @@ setupPage()
         </UButton>
         <UButton
             v-else-if="mode == 'create'"
-            @click="createItem"
+            @click="dataStore.createNewItem('absenceRequests', itemInfo)"
         >
           Erstellen
         </UButton>

spaces/pages/plants/[mode]/[[id]].vue

@@ -40,26 +40,7 @@ const setupPage = () => {
 
 }
 
-const createItem = async () => {
-  const {data,error} = await supabase
-      .from("plants")
-      .insert([itemInfo.value])
-      .select()
 
-  if(error) {
-    console.log(error)
-  } else {
-    mode.value = "show"
-    itemInfo.value = {
-      id: 0,
-      title: "",
-    }
-    toast.add({title: "Anlage erfolgreich erstellt"})
-    await dataStore.fetchPlants()
-    router.push(`/plants/show/${data[0].id}`)
-    setupPage()
-  }
-}
 
 const editItem = async () => {
   router.push(`/plants/edit/${currentItem.id}`)
@@ -199,7 +180,7 @@ setupPage()
       </UButton>
       <UButton
           v-else-if="mode == 'create'"
-          @click="createItem"
+          @click="dataStore.createNewItem('plants', itemInfo)"
       >
         Erstellen
       </UButton>

spaces/pages/products/[mode]/[[id]].vue

@@ -33,26 +33,6 @@ const setupPage = () => {
 
 }
 
-const createItem = async () => {
-  const {data,error} = await supabase
-      .from("products")
-      .insert([itemInfo.value])
-      .select()
-
-  if(error) {
-    console.log(error)
-  } else {
-    mode.value = "show"
-    itemInfo.value = {
-      id: 0,
-      name: ""
-    }
-    toast.add({title: "Artikel erfolgreich erstellt"})
-    await dataStore.fetchProducts()
-    router.push(`/products/show/${data[0].id}`)
-    setupPage()
-  }
-}
 
 const editItem = async () => {
   router.push(`/products/edit/${currentProduct.id}`)
@@ -226,7 +206,7 @@ setupPage()
         </UButton>
         <UButton
             v-else-if="mode == 'create'"
-            @click="createItem"
+            @click="dataStore.createNewItem('products',itemInfo)"
         >
           Erstellen
         </UButton>

spaces/pages/projects/[mode]/[[id]].vue

@@ -124,27 +124,6 @@ const setupPage = () => {
 
 }
 
-const createItem = async () => {
-  const {data,error} = await supabase
-      .from("projects")
-      .insert([itemInfo.value])
-      .select()
-
-  if(error) {
-    console.log(error)
-  } else {
-    mode.value = "show"
-    itemInfo.value = {
-      id: 0,
-      title: "",
-    }
-    toast.add({title: "Projekt erfolgreich erstellt"})
-    await dataStore.fetchProjects()
-    router.push(`/projects/show/${data[0].id}`)
-    setupPage()
-  }
-}
-
 const editItem = async () => {
   router.push(`/projects/edit/${currentItem.value.id}`)
   setupPage()
@@ -533,7 +512,7 @@ setupPage()
       </UButton>
       <UButton
           v-else-if="mode == 'create'"
-          @click="createItem"
+          @click="dataStore.createNewItem('projects',itemInfo)"
       >
         Erstellen
       </UButton>

spaces/pages/tasks/[mode]/[[id]].vue

@@ -10,7 +10,13 @@ const router = useRouter()
 const toast = useToast()
 const id = ref(route.params.id ? route.params.id : null )
 
-let currentItem = null
+let currentItem = ref(null)
+
+/*watch(dataStore.tasks, (oldVal,newVal) => {
+  console.log("OK")
+  console.log(dataStore.tasks)
+  currentItem.value = dataStore.getTaskById(Number(useRoute().params.id))
+})*/
 
 //Working
 const mode = ref(route.params.mode || "show")
@@ -37,7 +43,10 @@ const setupPage = () => {
 }
 
 const createItem = async () => {
-  const {data,error} = await supabase
+
+
+
+  /*const {data,error} = await supabase
       .from("tasks")
       .insert([itemInfo.value])
       .select()
@@ -50,11 +59,11 @@ const createItem = async () => {
       id: 0,
       title: "",
     }
-    toast.add({title: "Aufgabe erfolgreich erstellt"})
+    //toast.add({title: "Aufgabe erfolgreich erstellt"})
     await dataStore.fetchTasks()
-    router.push(`/tasks/show/${data[0].id}`)
+    //router.push(`/tasks/show/${data[0].id}`)
     setupPage()
-  }
+  }*/
 }
 
 const editItem = async () => {
@@ -219,7 +228,7 @@ setupPage()
         </UButton>
         <UButton
             v-else-if="mode == 'create'"
-            @click="createItem"
+            @click="dataStore.createNewItem('tasks',itemInfo)"
         >
           Erstellen
         </UButton>

spaces/pages/users/[mode]/[[id]].vue

@@ -329,8 +329,8 @@ setupPage()
               </UButton>
               <UButton
                   @click="timeSelection = 'Letztes Jahr'"
-                  :variant="timeSelection === 'Letzes Jahr' ? 'solid' : 'outline'"
+                  :variant="timeSelection === 'Letztes Jahr' ? 'solid' : 'outline'"
-                  color="slate"
+                  color="rose"
               >
                 Letztes Jahr
               </UButton>

spaces/pages/vehicles/[mode]/[[id]].vue

@@ -68,26 +68,6 @@ const setupPage = () => {
 
 }
 
-const createItem = async () => {
-  const {data,error} = await supabase
-      .from("vehicles")
-      .insert([itemInfo.value])
-      .select()
-
-  if(error) {
-    console.log(error)
-  } else {
-    mode.value = "show"
-    itemInfo.value = {
-      id: 0,
-      name: ""
-    }
-    toast.add({title: "Fahrzeug erfolgreich erstellt"})
-    await dataStore.fetchVehicles()
-    router.push(`/vehicles/show/${data[0].id}`)
-    setupPage()
-  }
-}
 
 const editCustomer = async () => {
   router.push(`/vehicles/edit/${currentItem.value.id}`)
@@ -257,7 +237,7 @@ setupPage()
         </UButton>
         <UButton
             v-else-if="mode == 'create'"
-            @click="createItem"
+            @click="dataStore.createNewItem('vehicles',itemInfo)"
         >
           Erstellen
         </UButton>

spaces/pages/vendors/[mode]/[[id]].vue

@@ -13,7 +13,7 @@ const toast = useToast()
 const id = ref(route.params.id ? route.params.id : null )
 const numberRange  = useNumberRange("vendors")
 
-let currentItem = null
+let currentItem = ref(null)
 
 
 
@@ -25,35 +25,11 @@ const itemInfo = ref({
 
 //Functions
 const setupPage = () => {
-  if(mode.value === "show" || mode.value === "edit"){
+  if (mode.value === "show" || mode.value === "edit") {
-    currentItem = dataStore.getVendorById(Number(useRoute().params.id))
+    currentItem.value = dataStore.getVendorById(Number(useRoute().params.id))
   }
 
-  if(mode.value === "edit") itemInfo.value = currentItem
+  if (mode.value === "edit") itemInfo.value = currentItem.value
-
-
-
-}
-
-const createItem = async () => {
-
-  if(!itemInfo.value.vendorNumber) itemInfo.value.vendorNumber = await numberRange.useNextNumber()
-
-  const {data,error} = await supabase
-      .from("vendors")
-      .insert([itemInfo.value])
-      .select()
-
-  if(error) {
-    console.log(error)
-  } else {
-    mode.value = "show"
-    itemInfo.value = {}
-    toast.add({title: "Lieferant erfolgreich erstellt"})
-    await dataStore.fetchVendors()
-    router.push(`/vendors/show/${data[0].id}`)
-    setupPage()
-  }
 }
 
 const editItem = async () => {
@@ -75,7 +51,7 @@ const updateItem = async () => {
     console.log(error)
   } else {
     toast.add({title: "Lieferant erfolgreich gespeichert"})
-    router.push(`/vendors/show/${currentItem.id}`)
+    router.push(`/vendors/show/${currentItem.value.id}`)
     dataStore.fetchVendors()
   }
 
@@ -226,7 +202,7 @@ setupPage()
         </UButton>
         <UButton
             v-else-if="mode == 'create'"
-            @click="createItem"
+            @click="dataStore.createNewItem('vendors',itemInfo)"
         >
           Erstellen
         </UButton>

spaces/stores/data.ts

@@ -1,5 +1,6 @@
 import {defineStore} from 'pinia'
 import dayjs from "dayjs"
+import {typeOf} from "uri-js/dist/esnext/util";
 
 //const supabase = createClient('https://uwppvcxflrcsibuzsbil.supabase.co','eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6InV3cHB2Y3hmbHJjc2lidXpzYmlsIiwicm9sZSI6ImFub24iLCJpYXQiOjE3MDA5MzgxOTQsImV4cCI6MjAxNjUxNDE5NH0.CkxYSQH0uLfwx9GVUlO6AYMU2FMLAxGMrwEKvyPv7Oo')
 
@@ -9,6 +10,50 @@ export const useDataStore = defineStore('data', () => {
     const supabase = useSupabaseClient()
     const user = useSupabaseUser()
     const toast = useToast()
+    const router = useRouter()
+
+    const dataTypes = {
+        tasks: {
+            label: "Aufgaben",
+            labelSingle: "Aufgabe"
+        },
+        customers: {
+            label: "Kunden",
+            labelSingle: "Kunde"
+        },
+        contacts: {
+            label: "Kontakte",
+            labelSingle: "Kontakt"
+        },
+        contracts: {
+            label: "Verträge",
+            labelSingle: "Vertrag"
+        },
+        absenceRequests: {
+            label: "Abwesenheitsanträge",
+            labelSingle: "Abwesenheitsantrag"
+        },
+        plants: {
+            label: "Anlagen",
+            labelSingle: "Anlage"
+        },
+        products: {
+            label: "Artikel",
+            labelSingle: "Artikel"
+        },
+        projects: {
+            label: "Projekte",
+            labelSingle: "Projekt"
+        },
+        vehicles: {
+            label: "Fahrzeuge",
+            labelSingle: "Fahrzeug"
+        },
+        vendors: {
+            label: "Lieferanten",
+            labelSingle: "Lieferant"
+        }
+    }
 
     const loaded = ref(false)
     const ownTenant = ref({
@@ -127,6 +172,38 @@ export const useDataStore = defineStore('data', () => {
         messages.value = []
     }
 
+    const channelA = supabase
+        .channel('schema-db-changes')
+        .on(
+            'postgres_changes',
+            {
+                event: '*',
+                schema: 'public',
+            },
+            (payload) => {
+                //console.log(payload)
+                const c = payload.table + '.value.push(' + JSON.stringify(payload.new) + ')'
+                eval(c)
+
+            }
+        )
+        .subscribe()
+
+    async function createNewItem (dataType:string,data:Array){
+        const {data:supabaseData,error:supabaseError} = await supabase
+            .from(dataType)
+            .insert(typeOf(data) === 'Object' ? [data] : data)
+            .select()
+
+        if(supabaseError) {
+            console.log(supabaseError)
+        } else if (supabaseData) {
+            await eval( dataType + '.value.push(' + JSON.stringify(...supabaseData) + ')')
+            toast.add({title: `${dataTypes[dataType].labelSingle} hinzugefügt`})
+            await router.push(`/${dataType}/show/${supabaseData[0].id}`)
+        }
+    }
+
     async function fetchOwnTenant () {
         ownTenant.value = (await supabase.from("tenants").select().eq('id', user.value?.app_metadata.tenant)).data[0]
     }
@@ -582,6 +659,7 @@ export const useDataStore = defineStore('data', () => {
         chats,
         messages,
         //Functions
+        createNewItem,
         fetchData,
         clearStore,
         fetchOwnTenant,