Added Tabs to Createddocuments Index
This commit is contained in:
@@ -72,78 +72,85 @@
|
|||||||
</template>
|
</template>
|
||||||
</UDashboardToolbar>
|
</UDashboardToolbar>
|
||||||
|
|
||||||
<UTable
|
<UTabs :items="selectedTypes" class="m-3">
|
||||||
:rows="filteredRows"
|
<template #item="{item}">
|
||||||
:columns="columns"
|
<div style="height: 80vh; overflow-y: scroll">
|
||||||
class="w-full"
|
<UTable
|
||||||
:ui="{ divide: 'divide-gray-200 dark:divide-gray-800' }"
|
:rows="filteredRows.filter(i => i.type === item.key)"
|
||||||
@select="selectItem"
|
:columns="columns"
|
||||||
:empty-state="{ icon: 'i-heroicons-circle-stack-20-solid', label: 'Keine Belege anzuzeigen' }"
|
class="w-full"
|
||||||
>
|
:ui="{ divide: 'divide-gray-200 dark:divide-gray-800' }"
|
||||||
<template #type-data="{row}">
|
@select="selectItem"
|
||||||
{{dataStore.documentTypesForCreation[row.type].labelSingle}}
|
:empty-state="{ icon: 'i-heroicons-circle-stack-20-solid', label: 'Keine Belege anzuzeigen' }"
|
||||||
<span v-if="row.type === 'cancellationInvoices'"> zu {{row.linkedDocument.documentNumber}}</span>
|
>
|
||||||
</template>
|
<template #type-data="{row}">
|
||||||
<template #state-data="{row}">
|
{{dataStore.documentTypesForCreation[row.type].labelSingle}}
|
||||||
|
<span v-if="row.type === 'cancellationInvoices'"> zu {{row.linkedDocument.documentNumber}}</span>
|
||||||
|
</template>
|
||||||
|
<template #state-data="{row}">
|
||||||
<span
|
<span
|
||||||
v-if="row.state === 'Entwurf'"
|
v-if="row.state === 'Entwurf'"
|
||||||
class="text-rose-500"
|
class="text-rose-500"
|
||||||
>
|
>
|
||||||
{{row.state}}
|
{{row.state}}
|
||||||
</span>
|
</span>
|
||||||
<!-- <span
|
<!-- <span
|
||||||
v-if="row.state === 'Gebucht'"
|
v-if="row.state === 'Gebucht'"
|
||||||
class="text-cyan-500"
|
class="text-cyan-500"
|
||||||
>
|
>
|
||||||
{{row.state}}
|
{{row.state}}
|
||||||
</span>-->
|
</span>-->
|
||||||
<span
|
<span
|
||||||
v-if="row.state === 'Gebucht' && !items.find(i => i.linkedDocument && i.linkedDocument.id === row.id)"
|
v-if="row.state === 'Gebucht' && !items.find(i => i.linkedDocument && i.linkedDocument.id === row.id)"
|
||||||
class="text-primary-500"
|
class="text-primary-500"
|
||||||
>
|
>
|
||||||
{{row.state}}
|
{{row.state}}
|
||||||
</span>
|
</span>
|
||||||
<span
|
<span
|
||||||
v-else-if="row.state === 'Gebucht' && items.find(i => i.linkedDocument && i.linkedDocument.id === row.id) && ['invoices','advanceInvoices'].includes(row.type)"
|
v-else-if="row.state === 'Gebucht' && items.find(i => i.linkedDocument && i.linkedDocument.id === row.id && i.type === 'cancellationInvoices') && ['invoices','advanceInvoices'].includes(row.type)"
|
||||||
class="text-cyan-500"
|
class="text-cyan-500"
|
||||||
>
|
>
|
||||||
Storniert mit {{items.find(i => i.linkedDocument && i.linkedDocument.id === row.id).documentNumber}}
|
Storniert mit {{items.find(i => i.linkedDocument && i.linkedDocument.id === row.id).documentNumber}}
|
||||||
</span>
|
</span>
|
||||||
<span
|
<span
|
||||||
v-else-if="row.state === 'Gebucht'"
|
v-else-if="row.state === 'Gebucht'"
|
||||||
class="text-primary-500"
|
class="text-primary-500"
|
||||||
>
|
>
|
||||||
{{row.state}}
|
{{row.state}}
|
||||||
</span>
|
</span>
|
||||||
</template>
|
</template>
|
||||||
<template #partner-data="{row}">
|
<template #partner-data="{row}">
|
||||||
<span v-if="row.customer">{{row.customer ? row.customer.name : ""}}</span>
|
<span v-if="row.customer">{{row.customer ? row.customer.name : ""}}</span>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
<template #reference-data="{row}">
|
||||||
|
<span v-if="row === filteredRows[selectedItem]" class="text-primary-500 font-bold">{{row.documentNumber}}</span>
|
||||||
|
<span v-else>{{row.documentNumber}}</span>
|
||||||
|
</template>
|
||||||
|
<template #date-data="{row}">
|
||||||
|
<span v-if="row.date">{{row.date ? dayjs(row.date).format("DD.MM.YY") : ''}}</span>
|
||||||
|
<span v-if="row.documentDate">{{row.documentDate ? dayjs(row.documentDate).format("DD.MM.YY") : ''}}</span>
|
||||||
|
</template>
|
||||||
|
<template #dueDate-data="{row}">
|
||||||
|
<span v-if="row.state === 'Gebucht' && row.paymentDays && ['invoices','advanceInvoices'].includes(row.type) && !items.find(i => i.linkedDocument && i.linkedDocument.id === row.id)" :class="dayjs(row.documentDate).add(row.paymentDays,'day').diff(dayjs()) <= 0 && !isPaid(row) ? ['text-rose-500'] : '' ">{{row.documentDate ? dayjs(row.documentDate).add(row.paymentDays,'day').format("DD.MM.YY") : ''}}</span>
|
||||||
|
</template>
|
||||||
|
<template #paid-data="{row}">
|
||||||
|
<div v-if="(row.type === 'invoices' ||row.type === 'advanceInvoices') && row.state === 'Gebucht' && !items.find(i => i.linkedDocument && i.linkedDocument.id === row.id)">
|
||||||
|
<span v-if="useSum().getIsPaid(row,items)" class="text-primary-500">Bezahlt</span>
|
||||||
|
<span v-else class="text-rose-600">Offen</span>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<template #amount-data="{row}">
|
||||||
|
<span v-if="row.type !== 'deliveryNotes'">{{displayCurrency(useSum().getCreatedDocumentSum(row,items))}}</span>
|
||||||
|
</template>
|
||||||
|
<template #amountOpen-data="{row}">
|
||||||
|
<span v-if="!['deliveryNotes','cancellationInvoices','quotes','confirmationOrders'].includes(row.type) && row.state !== 'Entwurf' && !useSum().getIsPaid(row,items) && !items.find(i => i.linkedDocument && i.linkedDocument.id === row.id) ">{{displayCurrency(useSum().getCreatedDocumentSum(row, items) - row.statementallocations.reduce((n,{amount}) => n + amount, 0))}}</span>
|
||||||
|
</template>
|
||||||
|
</UTable>
|
||||||
|
</div>
|
||||||
|
|
||||||
</template>
|
</template>
|
||||||
<template #reference-data="{row}">
|
</UTabs>
|
||||||
<span v-if="row === filteredRows[selectedItem]" class="text-primary-500 font-bold">{{row.documentNumber}}</span>
|
|
||||||
<span v-else>{{row.documentNumber}}</span>
|
|
||||||
</template>
|
|
||||||
<template #date-data="{row}">
|
|
||||||
<span v-if="row.date">{{row.date ? dayjs(row.date).format("DD.MM.YY") : ''}}</span>
|
|
||||||
<span v-if="row.documentDate">{{row.documentDate ? dayjs(row.documentDate).format("DD.MM.YY") : ''}}</span>
|
|
||||||
</template>
|
|
||||||
<template #dueDate-data="{row}">
|
|
||||||
<span v-if="row.state === 'Gebucht' && row.paymentDays && ['invoices','advanceInvoices'].includes(row.type) && !items.find(i => i.linkedDocument && i.linkedDocument.id === row.id)" :class="dayjs(row.documentDate).add(row.paymentDays,'day').diff(dayjs()) <= 0 && !isPaid(row) ? ['text-rose-500'] : '' ">{{row.documentDate ? dayjs(row.documentDate).add(row.paymentDays,'day').format("DD.MM.YY") : ''}}</span>
|
|
||||||
</template>
|
|
||||||
<template #paid-data="{row}">
|
|
||||||
<div v-if="(row.type === 'invoices' ||row.type === 'advanceInvoices') && row.state === 'Gebucht' && !items.find(i => i.linkedDocument && i.linkedDocument.id === row.id)">
|
|
||||||
<span v-if="useSum().getIsPaid(row,items)" class="text-primary-500">Bezahlt</span>
|
|
||||||
<span v-else class="text-rose-600">Offen</span>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
<template #amount-data="{row}">
|
|
||||||
<span v-if="row.type !== 'deliveryNotes'">{{displayCurrency(useSum().getCreatedDocumentSum(row,items))}}</span>
|
|
||||||
</template>
|
|
||||||
<template #amountOpen-data="{row}">
|
|
||||||
<span v-if="!['deliveryNotes','cancellationInvoices','quotes','confirmationOrders'].includes(row.type) && row.state !== 'Entwurf' && !useSum().getIsPaid(row,items) && !items.find(i => i.linkedDocument && i.linkedDocument.id === row.id) ">{{displayCurrency(useSum().getCreatedDocumentSum(row, items) - row.statementallocations.reduce((n,{amount}) => n + amount, 0))}}</span>
|
|
||||||
</template>
|
|
||||||
</UTable>
|
|
||||||
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user