314 lines
9.0 KiB
Vue
314 lines
9.0 KiB
Vue
<script setup>
|
|
|
|
import dayjs from "dayjs";
|
|
import {useSum} from "~/composables/useSum.js";
|
|
defineShortcuts({
|
|
/*'/': () => {
|
|
//console.log(searchinput)
|
|
//searchinput.value.focus()
|
|
document.getElementById("searchinput").focus()
|
|
},*/
|
|
'Enter': {
|
|
usingInput: true,
|
|
handler: () => {
|
|
router.push(`/standardEntity/${props.topLevelType}/show/${props.item.createddocuments.value[selectedItem.value].id}`)
|
|
}
|
|
},
|
|
'arrowdown': () => {
|
|
if(selectedItem.value < props.item.createddocuments.length - 1) {
|
|
selectedItem.value += 1
|
|
} else {
|
|
selectedItem.value = 0
|
|
}
|
|
},
|
|
'arrowup': () => {
|
|
if(selectedItem.value === 0) {
|
|
selectedItem.value = props.item.createddocuments.length - 1
|
|
} else {
|
|
selectedItem.value -= 1
|
|
}
|
|
}
|
|
})
|
|
|
|
const props = defineProps({
|
|
queryStringData: {
|
|
type: String
|
|
},
|
|
item: {
|
|
type: Object,
|
|
required: true
|
|
},
|
|
type: {
|
|
type: String,
|
|
required: true
|
|
},
|
|
topLevelType: {
|
|
type: String,
|
|
required: true
|
|
},
|
|
platform: {
|
|
type: String,
|
|
required: true
|
|
}
|
|
})
|
|
|
|
const dataStore = useDataStore()
|
|
const tempStore = useTempStore()
|
|
|
|
const router = useRouter()
|
|
|
|
const createddocuments = ref([])
|
|
|
|
const setup = async () => {
|
|
//createddocuments.value = (await useSupabaseSelect("createddocuments")).filter(i => !i.archived)
|
|
createddocuments.value = (await useEntities("createddocuments").select()).filter(i => !i.archived)
|
|
}
|
|
setup()
|
|
|
|
const templateColumns = [
|
|
{
|
|
key: "reference",
|
|
label: "Referenz"
|
|
|
|
|
|
},
|
|
{
|
|
key: 'type',
|
|
label: "Typ"
|
|
},{
|
|
key: 'state',
|
|
label: "Status"
|
|
},{
|
|
key: 'paid',
|
|
label: "Bezahlt"
|
|
},{
|
|
key: 'amount',
|
|
label: "Betrag"
|
|
},
|
|
{
|
|
key: "date",
|
|
label: "Datum"
|
|
},
|
|
{
|
|
key: "dueDate",
|
|
label: "Fällig"
|
|
}
|
|
]
|
|
const selectedColumns = ref(tempStore.columns["createddocuments"] ? tempStore.columns["createddocuments"] : templateColumns)
|
|
const columns = computed(() => templateColumns.filter((column) => selectedColumns.value.find(i => i.key === column.key)))
|
|
|
|
const selectedItem = ref(0)
|
|
|
|
const getAvailableQueryStringData = (keys) => {
|
|
let returnString = props.queryStringData
|
|
|
|
function addParam (key,value) {
|
|
if(returnString.length === 0) {
|
|
returnString += `${key}=${value}`
|
|
} else {
|
|
returnString += `&${key}=${value}`
|
|
}
|
|
}
|
|
|
|
if(keys) {
|
|
Object.keys(keys).forEach(key => {
|
|
addParam(key, keys[key])
|
|
})
|
|
}
|
|
|
|
return returnString
|
|
|
|
}
|
|
|
|
const invoiceDeliveryNotes = () => {
|
|
router.push(`/createDocument/edit?type=invoices&loadMode=deliveryNotes&linkedDocuments=[${props.item.createddocuments.filter(i => i.type === "deliveryNotes").map(i => i.id)}]`)
|
|
}
|
|
|
|
const showFinalInvoiceConfig = ref(false)
|
|
const referenceDocument = ref(null)
|
|
const advanceInvoicesToAdd = ref([])
|
|
const invoiceAdvanceInvoices = () => {
|
|
router.push(`/createDocument/edit?type=invoices&loadMode=finalInvoice&linkedDocuments=[${[referenceDocument.value, ... advanceInvoicesToAdd.value]}]`)
|
|
}
|
|
|
|
const selectItem = (item) => {
|
|
console.log(item)
|
|
|
|
if(item.state === "Entwurf"){
|
|
router.push(`/createDocument/edit/${item.id}`)
|
|
} else if(item.state !== "Entwurf") {
|
|
router.push(`/createDocument/show/${item.id}`)
|
|
}
|
|
}
|
|
|
|
</script>
|
|
|
|
<template>
|
|
<UCard class="mt-5" :style="props.platform !== 'mobile' ? 'height: 80vh' : ''">
|
|
<template #header v-if="props.platform === 'mobile'">
|
|
<span>Ausgangsbelege</span>
|
|
</template>
|
|
<Toolbar>
|
|
<!-- TODO Rendering when Screen is too small -->
|
|
<UButton
|
|
@click="invoiceDeliveryNotes"
|
|
v-if="props.topLevelType === 'projects'"
|
|
>
|
|
Lieferscheine abrechnen
|
|
</UButton>
|
|
<UButton
|
|
@click="router.push(`/createDocument/edit/?${getAvailableQueryStringData({type: 'quotes'})}`)"
|
|
>
|
|
+ Angebot
|
|
</UButton>
|
|
<UButton
|
|
@click="router.push(`/createDocument/edit/?${getAvailableQueryStringData({type: 'confirmationOrders'})}`)"
|
|
>
|
|
+ Auftragsbestätigung
|
|
</UButton>
|
|
<UButton
|
|
@click="router.push(`/createDocument/edit/?${getAvailableQueryStringData({type: 'deliveryNotes'})}`)"
|
|
>
|
|
+ Lieferschein
|
|
</UButton>
|
|
<UButton
|
|
@click="router.push(`/createDocument/edit/?${getAvailableQueryStringData({type: 'advanceInvoices'})}`)"
|
|
>
|
|
+ Abschlagsrechnung
|
|
</UButton>
|
|
<UButton
|
|
@click="showFinalInvoiceConfig = true"
|
|
v-if="props.topLevelType === 'projects'"
|
|
:disabled="!props.item.createddocuments?.filter(i => !i.archived && i.type === 'advanceInvoices').length > 0"
|
|
>
|
|
+ Schlussrechnung
|
|
</UButton>
|
|
<UModal
|
|
prevent-close
|
|
v-model="showFinalInvoiceConfig"
|
|
>
|
|
<UCard>
|
|
<template #header>
|
|
<div class="flex items-center justify-between">
|
|
<h3 class="text-base font-semibold leading-6 text-gray-900 dark:text-white">
|
|
Schlussrechnung konfigurieren
|
|
</h3>
|
|
<UButton color="gray" variant="ghost" icon="i-heroicons-x-mark-20-solid" class="-my-1" @click="isOpen = false" />
|
|
</div>
|
|
</template>
|
|
|
|
<UFormGroup
|
|
label="Rechnungsvorlage"
|
|
>
|
|
<USelectMenu
|
|
:options="props.item.createddocuments.filter(i => ['confirmationOrders','quotes'].includes(i.type))"
|
|
value-attribute="id"
|
|
option-attribute="documentNumber"
|
|
v-model="referenceDocument"
|
|
/>
|
|
</UFormGroup>
|
|
|
|
<UFormGroup
|
|
label="Abschlagsrechnungen"
|
|
>
|
|
<USelectMenu
|
|
:options="props.item.createddocuments.filter(i => ['advanceInvoices'].includes(i.type))"
|
|
multiple
|
|
value-attribute="id"
|
|
option-attribute="documentNumber"
|
|
v-model="advanceInvoicesToAdd"
|
|
/>
|
|
</UFormGroup>
|
|
|
|
<template #footer>
|
|
<UButton
|
|
@click="invoiceAdvanceInvoices"
|
|
>
|
|
Weiter
|
|
</UButton>
|
|
</template>
|
|
</UCard>
|
|
</UModal>
|
|
<UButton
|
|
@click="router.push(`/createDocument/edit/?${getAvailableQueryStringData({type: 'invoices'})}`)"
|
|
>
|
|
+ Rechnung
|
|
</UButton>
|
|
|
|
<template #right>
|
|
<USelectMenu
|
|
v-model="selectedColumns"
|
|
icon="i-heroicons-adjustments-horizontal-solid"
|
|
:options="templateColumns"
|
|
multiple
|
|
class="hidden lg:block"
|
|
by="key"
|
|
@change="tempStore.modifyColumns('createddocuments',selectedColumns)"
|
|
>
|
|
<template #label>
|
|
Spalten
|
|
</template>
|
|
</USelectMenu>
|
|
</template>
|
|
</Toolbar>
|
|
<UTable
|
|
:rows="props.item.createddocuments.filter(i => !i.archived)"
|
|
:columns="columns"
|
|
class="w-full"
|
|
:ui="{ divide: 'divide-gray-200 dark:divide-gray-800' }"
|
|
@select="selectItem"
|
|
:empty-state="{ icon: 'i-heroicons-circle-stack-20-solid', label: 'Keine Belege anzuzeigen' }"
|
|
style="height: 70vh"
|
|
>
|
|
<template #type-data="{row}">
|
|
{{dataStore.documentTypesForCreation[row.type].labelSingle}}
|
|
</template>
|
|
<template #state-data="{row}">
|
|
<span
|
|
v-if="row.state === 'Entwurf'"
|
|
class="text-rose-500"
|
|
>
|
|
{{row.state}}
|
|
</span>
|
|
<span
|
|
v-if="row.state === 'Gebucht'"
|
|
class="text-cyan-500"
|
|
>
|
|
{{row.state}}
|
|
</span>
|
|
<span
|
|
v-if="row.state === 'Abgeschlossen'"
|
|
class="text-primary-500"
|
|
>
|
|
{{row.state}}
|
|
</span>
|
|
</template>
|
|
<template #paid-data="{row}">
|
|
<div v-if="(row.type === 'invoices' ||row.type === 'advanceInvoices') && row.state === 'Gebucht'">
|
|
<span v-if="useSum().getIsPaid(row,createddocuments)" class="text-primary-500">Bezahlt</span>
|
|
<span v-else class="text-rose-600">Offen</span>
|
|
</div>
|
|
</template>
|
|
<template #reference-data="{row}">
|
|
<span v-if="row === props.item.createddocuments[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.paymentDays && ['invoices','advanceInvoices'].includes(row.type)" >{{row.documentDate ? dayjs(row.documentDate).add(row.paymentDays,'day').format("DD.MM.YY") : ''}}</span>
|
|
</template>
|
|
<template #amount-data="{row}">
|
|
<span v-if="row.type !== 'deliveryNotes'">{{useCurrency(useSum().getCreatedDocumentSum(row, createddocuments))}}</span>
|
|
</template>
|
|
</UTable>
|
|
|
|
|
|
</UCard>
|
|
</template>
|
|
|
|
<style scoped>
|
|
|
|
</style> |