Added Frontend

frontend/pages/support/[id].vue

@@ -0,0 +1,146 @@
+<script setup>
+
+import {useFunctions} from "~/composables/useFunctions.js";
+import dayjs from "dayjs";
+
+const supabase = useSupabaseClient()
+const profileStore = useProfileStore()
+const toast = useToast()
+const auth = useAuthStore()
+
+const itemInfo = ref({})
+const loaded = ref(false)
+
+const setup = async () => {
+  itemInfo.value = await useEntities("tickets").selectSingle(useRoute().params.id,"*, ticketmessages(*), created_by(*)")
+  loaded.value = true
+}
+
+setup()
+
+const messageContent = ref("")
+
+const addMessage = async () => {
+  const res = await useEntities("ticketmessages").create({
+    auth_user: auth.user.user_id,
+    content: messageContent.value,
+    ticket: itemInfo.value.id,
+    internal: false,
+    type: "Nachricht"
+  })
+}
+
+
+
+</script>
+
+<template>
+  <UDashboardNavbar title="Support Ticket">
+    <template #badge>
+      <UBadge
+        variant="outline"
+        v-if="itemInfo.status === 'Offen'"
+        color="yellow"
+      >{{itemInfo.status}}</UBadge>
+      <UBadge
+        variant="outline"
+        v-if="itemInfo.status === 'Geschlossen'"
+        color="primary"
+      >{{itemInfo.status}}</UBadge>
+    </template>
+    <template #center>
+      {{itemInfo.title}}
+    </template>
+    <template #right>
+<!--      <UButton
+        v-if="profileStore.currentTenant === 5"
+        variant="outline"
+        @click="closeTicket"
+      >
+        Ticket Schließen
+      </UButton>
+      <UButton
+        v-if="profileStore.currentTenant === 5"
+        variant="outline"
+        @click="showAddEntryModal = true"
+      >
+        + Eintrag
+      </UButton>
+      <UModal v-model="showAddEntryModal">
+        <UCard>
+          <template #header>
+            Eintrag hinzufügen
+          </template>
+
+          <UFormGroup
+            label="Intern:"
+          >
+            <UToggle
+              v-model="addEntryData.internal"
+            />
+          </UFormGroup>
+          <UFormGroup
+            label="Typ:"
+          >
+            <USelectMenu
+              v-model="addEntryData.type"
+              :options="['Nachricht','Notiz','Anruf','Externe Kommunikation']"
+            />
+          </UFormGroup>
+          <UFormGroup
+            label="Inhalt:"
+          >
+            <UTextarea
+              v-model="addEntryData.content"
+            />
+          </UFormGroup>
+
+          <template #footer>
+            <UButton
+              @click="addEntry"
+            >
+              Erstellen
+            </UButton>
+          </template>
+        </UCard>
+      </UModal>-->
+    </template>
+  </UDashboardNavbar>
+  <UDashboardPanelContent v-if="loaded">
+
+    <UAlert
+        v-for="item in itemInfo.ticketmessages.filter(i => !i.internal)"
+        :title="`${item.type}`"
+        class="mb-3"
+        :color="item.profile.tenant === 5 ? 'primary' : 'white'"
+        variant="outline"
+    >
+      <template #description>
+        <p>{{item.content}}</p>
+        <p class="mt-1 text-gray-600 dark:text-gray-400">{{dayjs(item.created_at).format("DD.MM.YYYY HH:mm")}}</p>
+      </template>
+    </UAlert>
+
+    <InputGroup>
+      <UTextarea
+        class="w-full mr-2"
+        placeholder="Neue Nachricht senden"
+        v-model="messageContent"
+      />
+      <UButton
+        @click="addMessage"
+      >
+        Senden
+      </UButton>
+    </InputGroup>
+
+  </UDashboardPanelContent>
+  <UProgress animation="carousel" v-else class="w-3/4 mx-auto"/>
+
+
+
+</template>
+
+<style scoped>
+
+</style>