This commit is contained in:
2024-04-07 17:18:58 +02:00
parent d7fafda78e
commit 491cbf15b6
7 changed files with 229 additions and 311 deletions

View File

@@ -50,7 +50,7 @@ setupPage()
</script>
<template>
<UDashboardNavbar :title="currentItem ? currentItem.name : (mode === 'create' ? 'Kunde erstellen' : 'Kunde bearbeiten')">
<UDashboardNavbar :title="currentItem ? `Kunde: ${currentItem.name}` : (mode === 'create' ? 'Kunde erstellen' : 'Kunde bearbeiten')">
<template #right>
<UButton
v-if="mode === 'edit'"
@@ -83,120 +83,141 @@ setupPage()
<UBadge
v-if="currentItem.active"
>
Kunde aktiv
Aktiv
</UBadge>
<UBadge
v-else
color="red"
>
Kunde gesperrt
Gesperrt
</UBadge>
</template>
</UDashboardNavbar>
<UTabs
v-if="currentItem && mode == 'show'"
:items="[{label: 'Informationen'}, {label: 'Logbuch'}, {label: 'Projekte'},{label: 'Objekte'},{label: 'Verträge'}, {label: 'Ansprechpartner'}]"
:items="[{label: 'Informationen'}, /*{label: 'Logbuch'},*/ {label: 'Projekte'},{label: 'Objekte'},{label: 'Verträge'}, {label: 'Ansprechpartner'}]"
class="p-5"
>
<template #item="{item}">
<UCard class="mt-5">
<div v-if="item.label === 'Informationen'">
<div v-if="item.label === 'Informationen'" class="flex mt-5">
<div class="w-1/2 mr-5">
<UCard >
<div class="text-wrap">
<p>Kundennummer: {{currentItem.customerNumber}}</p>
<p>Typ: {{currentItem.isCompany ? 'Firma' : 'Privatperson'}}</p>
<p v-if="currentItem.infoData.street">Straße + Hausnummer: {{currentItem.infoData.street}}</p>
<p v-if="currentItem.infoData.zip && currentItem.infoData.city">PLZ + Ort: {{currentItem.infoData.zip}} {{currentItem.infoData.city}}</p>
<p v-if="currentItem.infoData.tel">Telefon: {{currentItem.infoData.tel}}</p>
<p v-if="currentItem.infoData.email">E-Mail: {{currentItem.infoData.email}}</p>
<p v-if="currentItem.infoData.web">Web: {{currentItem.infoData.web}}</p>
<p v-if="currentItem.infoData.ustid">USt-Id: {{currentItem.infoData.ustid}}</p>
<p>Notizen:<br> {{currentItem.notes}}</p>
</div>
</UCard>
<UCard class="mt-5">
<Toolbar>
<UButton
@click="router.push(`/contacts/create?customer=${currentItem.id}`)"
>
+ Ansprechpartner
</UButton>
</Toolbar>
<UTable
:rows="dataStore.getContactsByCustomerId(currentItem.id)"
@select="(row) => router.push(`/contacts/show/${row.id}`)"
:columns="[{label: 'Anrede', key: 'salutation'},{label: 'Name', key: 'fullName'},{label: 'Rolle', key: 'role'}]"
:empty-state="{ icon: 'i-heroicons-circle-stack-20-solid', label: 'Keine zugehörigen Ansprechpartner' }"
<div class="text-wrap">
<p>Kundennummer: {{currentItem.customerNumber}}</p>
<p v-if="currentItem.infoData.street">Straße + Hausnummer: {{currentItem.infoData.street}}<br></p>
<p v-if="currentItem.infoData.zip && currentItem.infoData.city">PLZ + Ort: {{currentItem.infoData.zip}} {{currentItem.infoData.city}}<br></p>
<p v-if="currentItem.infoData.tel">Telefon: {{currentItem.infoData.tel}}<br></p>
<p v-if="currentItem.infoData.email">E-Mail: {{currentItem.infoData.email}}<br></p>
<p v-if="currentItem.infoData.web">Web: {{currentItem.infoData.web}}<br></p>
<p v-if="currentItem.infoData.ustid">USt-Id: {{currentItem.infoData.ustid}}<br></p>
<p>Notizen: {{currentItem.notes}}</p>
</div>
</div>
<div v-else-if="item.label === 'Logbuch'">
<HistoryDisplay
type="customer"
v-if="currentItem"
:element-id="currentItem.id"
/>
</div>
<div v-else-if="item.label === 'Projekte'">
<Toolbar>
<UButton
@click="router.push(`/projects/create?customer=${currentItem.id}`)"
>
+ Projekt
</UButton>
</Toolbar>
<UTable
:rows="dataStore.getProjectsByCustomerId(currentItem.id)"
@select="(row) => router.push(`/projects/show/${row.id}`)"
:columns="[{label: 'Name', key: 'name'},{label: 'Phase', key: 'phase'}]"
:empty-state="{ icon: 'i-heroicons-circle-stack-20-solid', label: 'Keine zugehörigen Projekte' }"
>
</UTable>
</UTable>
</UCard>
</div>
<div v-else-if="item.label === 'Objekte'">
<Toolbar>
<UButton
@click="router.push(`/plants/create?customer=${currentItem.id}`)"
>
+ Objekt
</UButton>
</Toolbar>
<UTable
:rows="dataStore.getPlantsByCustomerId(currentItem.id)"
@select="(row) => router.push(`/plants/show/${row.id}`)"
:columns="[{label: 'Name', key: 'name'}]"
:empty-state="{ icon: 'i-heroicons-circle-stack-20-solid', label: 'Keine zugehörigen Objekte' }"
>
</UTable>
</div>
<div v-else-if="item.label === 'Verträge'">
<Toolbar>
<UButton
@click="router.push(`/contracts/create?customer=${currentItem.id}`)"
>
+ Objekt
</UButton>
</Toolbar>
<UTable
:rows="dataStore.getContractsByCustomerId(currentItem.id)"
@select="(row) => router.push(`/contracts/show/${row.id}`)"
:columns="[{label: 'Name', key: 'name'},{label: 'Aktiv', key: 'active'}]"
:empty-state="{ icon: 'i-heroicons-circle-stack-20-solid', label: 'Keine zugehörigen Verträge' }"
>
</UTable>
</div>
<div v-else-if="item.label === 'Ansprechpartner'">
<Toolbar>
<UButton
@click="router.push(`/contacts/create?customer=${currentItem.id}`)"
>
+ Ansprechpartner
</UButton>
</Toolbar>
<UTable
:rows="dataStore.getContactsByCustomerId(currentItem.id)"
@select="(row) => router.push(`/contacts/show/${row.id}`)"
:columns="[{label: 'Anrede', key: 'salutation'},{label: 'Name', key: 'fullName'},{label: 'Rolle', key: 'role'}]"
:empty-state="{ icon: 'i-heroicons-circle-stack-20-solid', label: 'Keine zugehörigen Ansprechpartner' }"
>
</UTable>
<div class="w-1/2">
<UCard class="h-full">
<HistoryDisplay
type="customer"
v-if="currentItem"
:element-id="currentItem.id"
:render-headline="true"
/>
</UCard>
</div>
</UCard>
</div>
<UCard class="mt-5" v-else>
<div v-if="item.label === 'Informationen'" class="flex">
</div>
<div v-else-if="item.label === 'Projekte'">
<Toolbar>
<UButton
@click="router.push(`/projects/create?customer=${currentItem.id}`)"
>
+ Projekt
</UButton>
</Toolbar>
<UTable
:rows="dataStore.getProjectsByCustomerId(currentItem.id)"
@select="(row) => router.push(`/projects/show/${row.id}`)"
:columns="[{label: 'Name', key: 'name'},{label: 'Phase', key: 'phase'}]"
:empty-state="{ icon: 'i-heroicons-circle-stack-20-solid', label: 'Keine zugehörigen Projekte' }"
>
<template #phase-data="{row}">
{{row.phases ? row.phases.find(i => i.active).label : ""}}
</template>
</UTable>
</div>
<div v-else-if="item.label === 'Objekte'">
<Toolbar>
<UButton
@click="router.push(`/plants/create?customer=${currentItem.id}`)"
>
+ Objekt
</UButton>
</Toolbar>
<UTable
:rows="dataStore.getPlantsByCustomerId(currentItem.id)"
@select="(row) => router.push(`/plants/show/${row.id}`)"
:columns="[{label: 'Name', key: 'name'}]"
:empty-state="{ icon: 'i-heroicons-circle-stack-20-solid', label: 'Keine zugehörigen Objekte' }"
>
</UTable>
</div>
<div v-else-if="item.label === 'Verträge'">
<Toolbar>
<UButton
@click="router.push(`/contracts/create?customer=${currentItem.id}`)"
>
+ Objekt
</UButton>
</Toolbar>
<UTable
:rows="dataStore.getContractsByCustomerId(currentItem.id)"
@select="(row) => router.push(`/contracts/show/${row.id}`)"
:columns="[{label: 'Name', key: 'name'},{label: 'Aktiv', key: 'active'}]"
:empty-state="{ icon: 'i-heroicons-circle-stack-20-solid', label: 'Keine zugehörigen Verträge' }"
>
</UTable>
</div>
</UCard>
</template>
</UTabs>
<UForm v-else-if="mode === 'edit' || mode === 'create'" class="p-5">