Added Modals for Adding, Editing, Showing

components/StandardEntityModal.vue

@@ -0,0 +1,97 @@
+<script setup>
+
+const toast = useToast()
+const dataStore = useDataStore()
+const supabase = useSupabaseClient()
+const modal = useModal()
+const props = defineProps({
+  type: {
+    type: String,
+    required: true
+  },
+  mode: {
+    type: String,
+    required: true,
+    default: "show"
+  },
+  createQuery: {
+    type: Object
+  },
+  id: {
+    type: String,
+  },
+})
+
+
+
+const emit = defineEmits(["updateNeeded","returnData"])
+
+const dataType = dataStore.dataTypes[props.type]
+
+const loaded = ref(false)
+const items = ref([])
+const item = ref({})
+
+const setupPage = async () => {
+  if(props.mode === "show") {
+    //Load Data for Show
+    item.value = await useSupabaseSelectSingle(props.type, props.id, dataType.supabaseSelectWithInformation || "*")
+  } else if(props.mode === "edit") {
+    //Load Data for Edit
+    const data = JSON.stringify((await supabase.from(props.type).select().eq("id", props.id).single()).data)
+    //await useSupabaseSelectSingle(type, route.params.id)
+    item.value = data
+
+  }  else if(props.mode === "create") {
+    //Load Data for Create
+    item.value = JSON.stringify({})
+
+  } else if(props.mode === "list") {
+    //Load Data for List
+    items.value = await useSupabaseSelect(props.type, dataType.supabaseSelectWithInformation || "*", dataType.supabaseSortColumn,dataType.supabaseSortAscending || false)
+  }
+
+  loaded.value = true
+}
+
+setupPage()
+
+
+
+
+</script>
+
+<template>
+  <UModal :fullscreen="props.mode === 'show'">
+    <EntityShow
+        v-if="loaded && props.mode === 'show'"
+        :type="props.type"
+        :item="item"
+        @updateNeeded="setupPage"
+        :key="item"
+        :in-modal="true"
+    />
+    <EntityEdit
+        v-else-if="loaded && (props.mode === 'edit' || props.mode === 'create')"
+        :type="props.type"
+        :item="item"
+        :inModal="true"
+        @return-data="(data) => emit('return-data',data)"
+        :createQuery="props.createQuery"
+    />
+<!--    <EntityList
+        v-else-if="loaded && props.mode === 'list'"
+        :type="props.type"
+        :items="items"
+    />-->
+    <UProgress
+        v-else
+        animation="carousel"
+        class="p-5 mt-10"
+    />
+  </UModal>
+</template>
+
+<style scoped>
+
+</style>