flfeders/FEDEO
2
1
Fork 0
Code Issues 62 Pull Requests Actions Packages Projects 21 Releases Wiki Activity

Changed STore Type and corrected all Pages

Browse Source 
Added HistoryDisplay.vue
Added NumberRanges
This commit is contained in:
Florian Federspiel
2023-12-27 21:52:55 +01:00
parent 9e092823e4
commit c41b99f29d
33 changed files with 1094 additions and 812 deletions
Download Patch File Download Diff File Expand all files Collapse all files

368
spaces/pages/customers/[mode]/[[id]].vue
View File

@@ -1,20 +1,19 @@
<script setup>
import HistoryDisplay from "~/components/HistoryDisplay.vue";
definePageMeta({
middleware: "auth"
})
//
const supabase = useSupabaseClient()
const route = useRoute()
const router = useRouter()
const toast = useToast()
const id = ref(route.params.id ? route.params.id : null )
const numberRange = useNumberRange("customers")
const dataStore = useDataStore()
//Store
const {customers, contacts } = storeToRefs(useDataStore())
const {fetchCustomers, getCustomerById, getContactsByCustomerId} = useDataStore()
let currentCustomer = null
let currentCustomer = ref(null)
@@ -22,24 +21,26 @@ let currentCustomer = null
const mode = ref(route.params.mode || "show")
const customerInfo = ref({
name: "",
customerNumber: 0,
infoData: {},
active: true
})
//Functions
const setupPage = () => {
const setupPage = async () => {
if(mode.value === "show" || mode.value === "edit"){
currentCustomer = getCustomerById(Number(useRoute().params.id))
currentCustomer.value = await dataStore.getCustomerById(Number(useRoute().params.id))
}
if(mode.value === "edit") customerInfo.value = currentCustomer
if(mode.value === "edit") customerInfo.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])
@@ -55,14 +56,14 @@ const createCustomer = async () => {
infoData: {}
}
toast.add({title: "Kunde erfolgreich erstellt"})
await fetchCustomers()
await dataStore.fetchCustomers()
router.push(`/customers/show/${data[0].id}`)
setupPage()
}
}
const editCustomer = async () => {
router.push(`/customers/edit/${currentCustomer.id}`)
router.push(`/customers/edit/${currentCustomer.value.id}`)
setupPage()
}
@@ -88,7 +89,7 @@ const updateCustomer = async () => {
infoData: {}
}
toast.add({title: "Kunde erfolgreich gespeichert"})
fetchCustomers()
dataStore.fetchCustomers()
}
@@ -97,203 +98,194 @@ setupPage()
</script>
<template>
<div>
<UCard v-if="currentCustomer && mode == 'show'" >
<template #header>
<UBadge
v-if="currentCustomer.active"
>
Kunde aktiv
</UBadge>
<UBadge
<UCard v-if="currentCustomer && mode == 'show'" >
<template #header>
<UBadge
v-if="currentCustomer.active"
>
Kunde aktiv
</UBadge>
<UBadge
v-else
color="red"
>
Kunde gesperrt
</UBadge>
{{currentCustomer.name}}
</template>
>
Kunde gesperrt
</UBadge>
{{currentCustomer.name}}
</template>
Kundennummer: {{currentCustomer.customerNumber}} <br>
Kundennummer: {{currentCustomer.customerNumber}} <br>
<UDivider
class="my-2"
/>
Informationen:<br>
{{currentCustomer.infoData}}<br>
<UDivider
<UDivider
class="my-2"
/>
/>
Notizen:<br>
{{currentCustomer.notes}}<br>
Informationen:<br>
{{currentCustomer.infoData}}<br>
<UDivider
<UDivider
class="my-2"
/>
Notizen:<br>
{{currentCustomer.notes}}<br>
<UDivider
class="my-2"
/>
Kontakte: <br>
<ul>
<li
v-for="contact in dataStore.getContactsByCustomerId(currentCustomer.id)"
>
<router-link :to="'/contacts/show/' + contact.id">{{contact.salutation}} {{contact.fullName}} - {{contact.role}}</router-link>
</li>
</ul>
<template #footer>
<UButton
v-if="mode == 'show' && currentCustomer.id"
@click="editCustomer"
>
Bearbeiten
</UButton>
<UButton
color="red"
class="ml-2"
disabled
>
Archivieren
</UButton>
<!-- TODO: Kunde archivieren -->
</template>
</UCard>
<UCard v-else-if="mode == 'edit' || mode == 'create'" >
<template #header v-if="mode === 'edit'">
<UBadge>{{customerInfo.customerNumber}}</UBadge>{{customerInfo.name}}
</template>
<UFormGroup
label="Name:"
>
<UInput
v-model="customerInfo.name"
/>
</UFormGroup>
Kontakte: <br>
<table>
<tr>
<th>Anrede</th>
<th>Name</th>
<th>Rolle</th>
</tr>
<tr v-for="contact in getContactsByCustomerId(currentCustomer.id)">
<td>{{contact.salutation}}</td>
<td>{{contact.fullName}}</td>
<td>{{contact.role}}</td>
</tr>
</table>
<!-- Kontakte:<br>
&lt;!&ndash; <ul>
<li v-for="contact in currentCustomer.contacts.data">{{contact.lastName}}, {{contact.firstName}}</li>
</ul>&ndash;&gt;
&lt;!&ndash; {{currentCustomer.contacts.data}}&ndash;&gt;
<br>
Projekte:<br>
&lt;!&ndash; <ul>
<li v-for="project in currentCustomer.projects.data"><router-link :to="'/projects?id=' + project.id">{{project.name}}</router-link></li>
</ul>&ndash;&gt;-->
<template #footer>
<UButton
v-if="mode == 'show' && currentCustomer.id"
@click="editCustomer"
>
Bearbeiten
</UButton>
<UButton
color="red"
class="ml-2"
disabled
>
Archivieren
</UButton>
<!-- TODO: Kunde archivieren -->
</template>
</UCard>
<UCard v-else-if="mode == 'edit' || mode == 'create'" >
<template #header>
<UBadge>{{customerInfo.customerNumber}}</UBadge> {{customerInfo.name}}
</template>
<UFormGroup
label="Kundennummer:"
>
<UInput
v-model="customerInfo.customerNumber"
placeholder="Leer lassen für automatisch generierte Nummer"
/>
</UFormGroup>
<UTooltip text="Ist ein Kunde nicht aktiv so wird er für neue Aufträge gesperrt">
<UFormGroup
label="Name:"
label="Kunde aktiv:"
>
<UInput
v-model="customerInfo.name"
<UCheckbox
v-model="customerInfo.active"
/>
</UFormGroup>
</UTooltip>
<UFormGroup
label="Notizen:"
>
<UTextarea
v-model="customerInfo.notes"
/>
</UFormGroup>
<UFormGroup
label="Kundennummer:"
>
<UInput
v-model="customerInfo.customerNumber"
/>
</UFormGroup>
<UFormGroup
label="Straße + Hausnummer"
>
<UInput
v-model="customerInfo.infoData.street"
/>
</UFormGroup>
<UFormGroup
label="Postleitzahl"
>
<UInput
v-model="customerInfo.infoData.zip"
/>
</UFormGroup>
<UFormGroup
label="Ort"
>
<UInput
v-model="customerInfo.infoData.city"
/>
</UFormGroup>
<UTooltip text="Ist ein Kunde nicht aktiv so wird er für neue Aufträge gesperrt">
<UFormGroup
label="Kunde aktiv:"
>
<UCheckbox
v-model="customerInfo.active"
/>
</UFormGroup>
</UTooltip>
<UFormGroup
label="Notizen:"
>
<UTextarea
v-model="customerInfo.notes"
/>
</UFormGroup>
<UFormGroup
label="Telefon:"
>
<UInput
v-model="customerInfo.infoData.tel"
/>
</UFormGroup>
<UFormGroup
label="E-Mail:"
>
<UInput
v-model="customerInfo.infoData.email"
/>
</UFormGroup>
<UFormGroup
label="Webseite:"
>
<UInput
v-model="customerInfo.infoData.web"
/>
</UFormGroup>
<UFormGroup
label="USt-Id:"
>
<UInput
v-model="customerInfo.infoData.ustid"
/>
</UFormGroup>
<UFormGroup
label="Straße + Hausnummer"
<template #footer>
<UButton
v-if="mode == 'edit'"
@click="updateCustomer"
>
<UInput
v-model="customerInfo.infoData.street"
/>
</UFormGroup>
<UFormGroup
label="Postleitzahl"
Speichern
</UButton>
<UButton
v-else-if="mode == 'create'"
@click="createCustomer"
>
<UInput
v-model="customerInfo.infoData.zip"
/>
</UFormGroup>
<UFormGroup
label="Ort"
Erstellen
</UButton>
<UButton
@click="cancelEditorCreate"
color="red"
class="ml-2"
>
<UInput
v-model="customerInfo.infoData.city"
/>
</UFormGroup>
Abbrechen
</UButton>
</template>
<UFormGroup
label="Telefon:"
>
<UInput
v-model="customerInfo.infoData.tel"
/>
</UFormGroup>
<UFormGroup
label="E-Mail:"
>
<UInput
v-model="customerInfo.infoData.email"
/>
</UFormGroup>
<UFormGroup
label="Webseite:"
>
<UInput
v-model="customerInfo.infoData.web"
/>
</UFormGroup>
<UFormGroup
label="USt-Id:"
>
<UInput
v-model="customerInfo.infoData.ustid"
/>
</UFormGroup>
</UCard>
<template #footer>
<UButton
v-if="mode == 'edit'"
@click="updateCustomer"
>
Speichern
</UButton>
<UButton
v-else-if="mode == 'create'"
@click="createCustomer"
>
Erstellen
</UButton>
<UButton
@click="cancelEditorCreate"
color="red"
class="ml-2"
>
Abbrechen
</UButton>
</template>
</UCard>
</div>
<HistoryDisplay
type="customer"
v-if="currentCustomer"
:element-id="currentCustomer.id"
/>
</template>
<style scoped>