Added Phases to Projects

This commit is contained in:
2024-02-15 22:49:09 +01:00
parent 2fc45b3ea0
commit 1a0b7288df
37 changed files with 2342 additions and 1483 deletions

View File

@@ -10,6 +10,7 @@ definePageMeta({
const dataStore = useDataStore()
const supabase = useSupabaseClient()
const user = useSupabaseUser()
const route = useRoute()
const router = useRouter()
const toast = useToast()
@@ -22,6 +23,10 @@ const tabItems = [
key: "information",
label: "Informationen"
},
{
key: "historyDisplay",
label: "Logbuch"
},
{
key: "phases",
label: "Phasen"
@@ -68,22 +73,6 @@ const timeTableRows = [
},
]
const taskColumns = [
{
key: "name",
label: "Name"
},{
key: "description",
label: "Beschreibung"
},{
key: "categorie",
label: "Kategorie"
}, {
key: "user",
label: "Benutzer"
}
]
//Working
@@ -91,7 +80,7 @@ const mode = ref(route.params.mode || "show")
const itemInfo = ref({
name: "",
customer: 0,
users: [user.value.id]
})
const uploadModalOpen = ref(false)
@@ -223,38 +212,50 @@ setupPage()
</script>
<template>
<UCard v-if="currentItem && mode == 'show'">
<template #header>
{{currentItem.name}}
</template>
<UTabs :items="tabItems" class="w-full">
<template #item="{ item }">
<h1
class="mb-3 truncate font-bold text-2xl"
v-if="currentItem "
>Projekt: {{currentItem.name}}</h1>
<UTabs :items="tabItems" class="w-full" v-if="currentItem && mode == 'show'">
<template #item="{ item }">
<UCard class="mt-5">
<div v-if="item.key === 'information'">
<InputGroup>
<Toolbar>
<UButton
@click="router.push(`/customers/show/${currentItem.customer}`)"
class="mb-3"
@click="editItem"
>
Zum Kunden
Bearbeiten
</UButton>
<UButton
@click="router.push(`/plants/show/${currentItem.plant}`)"
class="mb-3"
>
Zum Objekt
</UButton>
</InputGroup>
</Toolbar>
Kunde: {{dataStore.getCustomerById(currentItem.customer).name}}<br>
Objekt: {{currentItem.plant ? dataStore.getPlantById(currentItem.plant).name : ""}}<br>
Notizen:<br>
{{currentItem.notes}}
<div class="text-wrap">
<p>Kunde: <nuxt-link :to="`/customers/show/${currentItem.customer}`">{{dataStore.getCustomerById(currentItem.customer).name}}</nuxt-link></p>
<p>Objekt: <nuxt-link :to="`/plants/show/${currentItem.plant}`">{{currentItem.plant ? dataStore.getPlantById(currentItem.plant).name : ""}}</nuxt-link></p>
<p class="">Notizen: {{currentItem.notes}}</p>
</div>
<UDivider class="my-3"/>
<h1 class="font-bold text-lg my-3">Beteiligte Benutzer:</h1>
<UAlert
v-for="projectUser in currentItem.users"
:avatar="{ alt: dataStore.getProfileById(projectUser).fullName }"
:title="dataStore.getProfileById(projectUser).fullName"
class="mb-3"
/>
</div>
<div v-else-if="item.key === 'historyDisplay'">
<HistoryDisplay
type="project"
v-if="currentItem"
:element-id="currentItem.id"
/>
</div>
<div v-if="item.key === 'phases'" class="space-y-3">
<UFormGroup
label="Vorlage laden"
v-if="currentItem.phases.length === 0"
label="Vorlage laden"
v-if="currentItem.phases.length === 0"
>
<InputGroup>
<USelectMenu
@@ -276,38 +277,58 @@ setupPage()
<UAccordion
:items="currentItem.phases"
>
<template #item="{item}">
<InputGroup>
<UButton
v-if="!item.active"
@click="changeActivePhase(item)"
>
Phase aktivieren
</UButton>
>
<template #default="{item,index,open}">
<UButton
variant="ghost"
:color="item.active ? 'primary' : 'white'"
class="mb-1"
>
<template #leading>
<div class="w-6 h-6 flex items-center justify-center -my-1">
<UIcon :name="item.icon" class="w-4 h-4 " />
</div>
</template>
<!-- <UButton>
+ Phase
</UButton>-->
</InputGroup>
</template>
<span class="truncate"> {{item.label}}</span>
<template #trailing>
<UIcon
name="i-heroicons-chevron-right-20-solid"
class="w-5 h-5 ms-auto transform transition-transform duration-200"
:class="[open && 'rotate-90']"
/>
</template>
</UButton>
</template>
<template #item="{item}">
<InputGroup>
<UButton
v-if="!item.active"
@click="changeActivePhase(item)"
>
Phase aktivieren
</UButton>
</InputGroup>
</template>
</UAccordion>
</div>
<div v-if="item.key === 'tasks'" class="space-y-3">
<InputGroup>
<Toolbar>
<UButton
@click="router.push(`/tasks/create?project=${currentItem.id}`)"
@click="router.push(`/tasks/create?project=${currentItem.id}`)"
>
+ Aufgabe
</UButton>
</InputGroup>
</Toolbar>
<UTable
:rows="dataStore.getTasksByProjectId(currentItem.id)"
:columns="taskColumns"
@select="(row) => {
router.push(`/tasks/show/${row.id}`)
}"
:columns="[{key: 'name',label: 'Name'},{key: 'categorie',label: 'Kategorie'},{key: 'user',label: 'Benutzer'}]"
@select="(row) => router.push(`/tasks/show/${row.id}`)"
:empty-state="{ icon: 'i-heroicons-circle-stack-20-solid', label: 'Keine zugehörigen Aufgaben' }"
>
<template #user-data="{row}">
{{dataStore.profiles.find(i => i.id === row.user) ? dataStore.profiles.find(i => i.id === row.user).fullName : ""}}
@@ -315,63 +336,8 @@ setupPage()
</UTable>
</div>
<!--
<div v-else-if="item.key === 'forms'" class="space-y-3">
<UButton
@click="formModalOpen = true"
>
+ Formular
</UButton>
<UModal
v-model="formModalOpen"
>
<UCard>
<template #header>
Formular hinzufügen
</template>
<UFormGroup>
<USelectMenu
:options="forms"
option-attribute="name"
value-attribute="id"
v-model="newFormSubmissionData.formType"
/>
</UFormGroup>
<template #footer>
<UButton
@click="addNewFormSubmission"
>
Hinzufügen
</UButton>
</template>
</UCard>
</UModal>
<UAccordion :items="formSubmissionsComposed">
<template #item="{item}">
<p class="my-3">Formular Link: <a :href="'https://app.spaces.software/formSubmissions/' + item.id">{{'https://app.spaces.software/formSubmissions/' + item.id}}</a></p>
<div v-if="Object.keys(item.values).length == 0">
<p>Es wurden noch keine Daten über das Formular abgegeben</p>
</div>
<table v-else>
<tr v-for="key in Object.keys(item.values)">
<td>{{key}}</td>
<td>{{ item.values[key] }}</td>
</tr>
</table>
</template>
</UAccordion>
</div>
-->
<div v-else-if="item.key === 'documents'" class="space-y-3">
<InputGroup>
<Toolbar>
<DocumentUpload
type="project"
:element-id="currentItem.id"
@@ -386,68 +352,8 @@ setupPage()
>
+ Rechnung
</UButton>
</InputGroup>
</Toolbar>
<!-- <UModal
v-model="uploadModalOpen"
>
<UCard class="p-4">
<template #header>
Datei hochladen
</template>
<UFormGroup
label="Datei:"
>
<UInput
type="file"
id="fileUploadInput"
/>
</UFormGroup>
&lt;!&ndash; <UFormGroup
label="Name:"
class="mt-3"
>
<UInput
v-model="fileUploadFormData.name"
/>
</UFormGroup>&ndash;&gt;
<UFormGroup
label="Tags:"
class="mt-3"
>
<USelectMenu
multiple
searchable
searchable-placeholder="Suchen..."
:options="tags"
v-model="fileUploadFormData.tags"
/>
</UFormGroup>
&lt;!&ndash;<UFormGroup
label="Ordner:"
class="mt-3"
>
<USelectMenu
:options="folders"
v-model="fileUploadFormData.folder"
value-attribute="label"
/>
</UFormGroup>&ndash;&gt;
<template #footer>
<UButton
class="mt-3"
@click="uploadFiles"
>Hochladen</UButton>
</template>
</UCard>
</UModal>-->
<DocumentList :documents="dataStore.getDocumentsByProjectId(currentItem.id)"/>
@@ -476,32 +382,15 @@ setupPage()
</UTable>
</div>
<div v-else-if="item.key === 'events'" class="space-y-3">
{{dataStore.getEventsByProjectId(currentItem.id)}}
{{dataStore.getEventsByProjectId(currentItem.id).length > 0 ? dataStore.getEventsByProjectId(currentItem.id) : "Keine Termine in für dieses Projekt"}}
</div>
<!--
<div v-else-if="item.key === 'material'" class="space-y-3">
<p>Hier wird aktuell noch gearbeitet</p>
</div>
-->
</template>
</UTabs>
<template #footer>
<UButton
v-if="mode == 'show' && currentItem.id"
@click="editItem"
>
Bearbeiten
</UButton>
</UCard>
</template>
</UTabs>
</UCard>
<UCard v-else-if="mode === 'edit' || mode === 'create'" >
<template #header v-if="mode === 'edit'">
{{itemInfo.name}}
@@ -563,6 +452,23 @@ setupPage()
</template>
</USelectMenu>
</UFormGroup>
<UFormGroup
label="Beteiligte Benutzer:"
>
<USelectMenu
v-model="itemInfo.users"
:options="dataStore.profiles"
option-attribute="fullName"
value-attribute="id"
searchable
multiple
:search-attributes="['fullName']"
>
<template #label>
{{itemInfo.users.length > 0 ? itemInfo.users.map(i => dataStore.getProfileById(i).fullName).join(", ") : "Kein Benutzer ausgewählt"}}
</template>
</USelectMenu>
</UFormGroup>
<UFormGroup
label="Notizen:"
@@ -596,11 +502,7 @@ setupPage()
</UCard>
<HistoryDisplay
type="project"
v-if="currentItem"
:element-id="currentItem.id"
/>
</template>
<style scoped>

View File

@@ -14,23 +14,28 @@
</InputGroup>
<div class="table">
<UTable
:rows="filteredRows"
@select="selectItem"
:columns="itemColumns"
:empty-state="{ icon: 'i-heroicons-circle-stack-20-solid', label: 'Noch keine Einträge' }"
>
<template #phase-data="{row}">
{{getActivePhaseLabel(row)}}
</template>
<template #customer-data="{row}">
{{dataStore.getCustomerById(row.customer) ? dataStore.getCustomerById(row.customer).name : ""}}
</template>
<template #plant-data="{row}">
{{dataStore.getPlantById(row.plant) ? dataStore.getPlantById(row.plant).name : ""}}
</template>
<template #users-data="{row}">
{{row.users.map(i => dataStore.getProfileById(i).fullName).join(", ")}}
</template>
</UTable>
</div>
<UTable
:rows="filteredRows"
@select="selectItem"
:columns="itemColumns"
:empty-state="{ icon: 'i-heroicons-circle-stack-20-solid', label: 'Noch keine Einträge' }"
>
<template #phase-data="{row}">
{{getActivePhaseLabel(row)}}
</template>
<template #customer-data="{row}">
{{dataStore.getCustomerById(row.customer) ? dataStore.getCustomerById(row.customer).name : ""}}
</template>
<template #plant-data="{row}">
{{dataStore.getPlantById(row.plant) ? dataStore.getPlantById(row.plant).name : ""}}
</template>
</UTable>
</template>
<script setup>
@@ -58,16 +63,21 @@ const itemColumns = [
key: "customer",
label: "Kunde",
sortable: true
},
},/*
{
key: "notes",
label: "Notizen",
sortable: true
},
},*/
{
key: "plant",
label: "Objekt",
sortable: true
},
{
key: "users",
label: "Benutzer",
sortable: true
}
]