many changes
This commit is contained in:
@@ -91,7 +91,7 @@ const navLinks = [
|
||||
children: [
|
||||
{
|
||||
label: "Eingangsrechnungen",
|
||||
to: "/vendorinvoices",
|
||||
to: "/incominginvoices",
|
||||
icon: "i-heroicons-document-text"
|
||||
},
|
||||
/*{
|
||||
@@ -265,7 +265,7 @@ const items = [
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<UHeader :links="navLinks">
|
||||
<UHeader :links="navLinks" :to="null">
|
||||
<template #logo>
|
||||
<div id="logo">
|
||||
<img
|
||||
@@ -480,7 +480,7 @@ const items = [
|
||||
<!–<router-link to="/customers" class="mr-2"><UButton>Kunden</UButton></router-link>
|
||||
<router-link to="/projects" class="mr-2"><UButton>Projekte</UButton></router-link>
|
||||
-
|
||||
<router-link to="/vendorinvoices" class="mr-2"><UButton>Eingangsrechnungen</UButton></router-link>
|
||||
<router-link to="/incominginvoices" class="mr-2"><UButton>Eingangsrechnungen</UButton></router-link>
|
||||
|
||||
<router-link to="/timetracking" class="mr-2"><UButton>Zeiterfassung</UButton></router-link>
|
||||
<router-link to="/products" class="mr-2"><UButton>Artikel</UButton></router-link>
|
||||
|
||||
@@ -2,6 +2,7 @@
|
||||
|
||||
const toast = useToast()
|
||||
const supabase = useSupabaseClient()
|
||||
const dataStore = useDataStore()
|
||||
const router = useRouter()
|
||||
const props = defineProps({
|
||||
document: {
|
||||
@@ -15,9 +16,7 @@ const props = defineProps({
|
||||
})
|
||||
|
||||
const {document, openShowModal:openShowModalProp } = props;
|
||||
const {fetchDocuments, getDocumentTags, fetchVendorInvoices} = useDataStore()
|
||||
const {projects, customers, vendorInvoices} = storeToRefs(useDataStore())
|
||||
const tags = getDocumentTags
|
||||
const tags = dataStore.getDocumentTags
|
||||
const openShowModal = ref(false)
|
||||
|
||||
//Functions
|
||||
@@ -27,63 +26,9 @@ const openDocument = async () => {
|
||||
openShowModal.value = true
|
||||
}
|
||||
|
||||
/*const uploadFiles = async () => {
|
||||
const uploadSingleFile = async (file) => {
|
||||
|
||||
const {data, error} = await supabase
|
||||
.storage
|
||||
.from("files")
|
||||
.upload(`${user.value.app_metadata.tenant}/${file.name}`, file)
|
||||
|
||||
if (error) {
|
||||
console.log(error)
|
||||
} else if (data) {
|
||||
const returnPath = data.path
|
||||
|
||||
if (error) {
|
||||
|
||||
} else {
|
||||
const files = (await supabase.storage.from('files').list(`${user.value.app_metadata.tenant}/`, {
|
||||
limit: 100,
|
||||
offset: 0,
|
||||
sortBy: {column: 'name', order: 'asc'}
|
||||
})).data
|
||||
|
||||
fileUploadFormData.value.path = returnPath
|
||||
|
||||
const {data, error} = await supabase
|
||||
.from("documents")
|
||||
.insert([fileUploadFormData.value])
|
||||
.select()
|
||||
if(error) console.log(error)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
uploadInProgress.value = true
|
||||
|
||||
let files = document.getElementById("fileUploadInput").files
|
||||
|
||||
if(files.length === 1) {
|
||||
await uploadSingleFile(files[0])
|
||||
} else if( files.length > 1) {
|
||||
|
||||
for(let i = 0; i < files.length; i++){
|
||||
uploadSingleFile(files[i])
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
uploadModalOpen.value = false;
|
||||
uploadInProgress.value = false;
|
||||
fetchDocuments()
|
||||
}*/
|
||||
|
||||
|
||||
const updateDocument = async () => {
|
||||
|
||||
|
||||
let objData = document
|
||||
const {url, ...objData} = document
|
||||
delete objData.url
|
||||
|
||||
const {data,error} = await supabase
|
||||
@@ -96,7 +41,7 @@ const updateDocument = async () => {
|
||||
console.log(error)
|
||||
} else {
|
||||
toast.add({title: "Dokument aktualisiert"})
|
||||
fetchDocuments()
|
||||
dataStore.fetchDocuments()
|
||||
openShowModal.value = false
|
||||
}
|
||||
|
||||
@@ -104,7 +49,7 @@ const updateDocument = async () => {
|
||||
|
||||
const createVendorInvoice = async () => {
|
||||
const {data:vendorInvoiceData,error:vendorInvoiceError} = await supabase
|
||||
.from("vendorInvoices")
|
||||
.from("incomingInvoices")
|
||||
.insert([{
|
||||
document: document.id,
|
||||
}])
|
||||
@@ -125,25 +70,33 @@ const createVendorInvoice = async () => {
|
||||
console.log(documentError)
|
||||
} else {
|
||||
toast.add({title: "Dokument aktualisiert"})
|
||||
fetchDocuments()
|
||||
dataStore.fetchDocuments()
|
||||
openShowModal.value = false
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
fetchVendorInvoices()
|
||||
await router.push("/vendorinvoices")
|
||||
dataStore.fetchIncomingInvoices()
|
||||
await router.push("/incominginvoices")
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
const archiveDocument = () => {
|
||||
document.tags = ["Archiviert"]
|
||||
updateDocument()
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="documentListItem">
|
||||
<embed
|
||||
:src="document.url"
|
||||
<object
|
||||
:data="document.url"
|
||||
class="previewEmbed"
|
||||
type="application/pdf"
|
||||
/>
|
||||
<UButton
|
||||
@click="openDocument"
|
||||
@@ -158,7 +111,10 @@ const createVendorInvoice = async () => {
|
||||
<br>
|
||||
<UBadge
|
||||
v-if="document.vendorInvoice"
|
||||
>{{vendorInvoices.find(item => item.id === document.vendorInvoice) ? vendorInvoices.find(item => item.id === document.vendorInvoice).reference : ''}}</UBadge>
|
||||
>{{dataStore.incomingInvoices.find(item => item.id === document.vendorInvoice) ? dataStore.incomingInvoices.find(item => item.id === document.vendorInvoice).reference : ''}}</UBadge>
|
||||
<UBadge
|
||||
v-if="document.inDatev"
|
||||
>DATEV</UBadge>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -169,80 +125,111 @@ const createVendorInvoice = async () => {
|
||||
v-model="openShowModal"
|
||||
fullscreen
|
||||
>
|
||||
<UCard class="h-full">
|
||||
<embed
|
||||
class="bigPreview mb-3"
|
||||
:src="document.url"
|
||||
/>
|
||||
<UCard class="flex flex-col flex-1" :ui="{ body: { base: 'flex-1' }, ring: '', divide: 'divide-y divide-gray-100 dark:divide-gray-800' }">
|
||||
<template #header>
|
||||
<div class="flex items-center gap-2">
|
||||
<UBadge
|
||||
v-for="tag in document.tags"
|
||||
>
|
||||
{{tag}}
|
||||
</UBadge>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<div class="flex items-center gap-2">
|
||||
<UBadge
|
||||
v-for="tag in document.tags"
|
||||
>
|
||||
{{tag}}
|
||||
</UBadge>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<UFormGroup
|
||||
label="Tags ändern:"
|
||||
>
|
||||
<USelectMenu
|
||||
:options="tags"
|
||||
v-model="document.tags"
|
||||
@close="updateDocument"
|
||||
multiple
|
||||
<UContainer class="h-full" :ui="{padding: 'px-1 sm:px-1 lg:px-1'}">
|
||||
<object
|
||||
class="h-full w-full"
|
||||
:data="document.url"
|
||||
type="application/pdf"
|
||||
/>
|
||||
</UFormGroup>
|
||||
</UContainer>
|
||||
|
||||
<UFormGroup
|
||||
label="Projekt zuweisen:"
|
||||
>
|
||||
<USelectMenu
|
||||
:options="projects"
|
||||
option-attribute="name"
|
||||
value-attribute="id"
|
||||
v-model="document.project"
|
||||
@change="updateDocument"
|
||||
searchable
|
||||
:search-attributes="['name']"
|
||||
<template #footer>
|
||||
<UButtonGroup>
|
||||
<UButton
|
||||
@click="archiveDocument"
|
||||
>
|
||||
Archivieren
|
||||
</UButton>
|
||||
<UButton
|
||||
v-if="document.tags.includes('Eingangsrechnung')"
|
||||
@click="createVendorInvoice"
|
||||
>
|
||||
Eingangsrechnung erstellen
|
||||
</UButton>
|
||||
</UButtonGroup>
|
||||
|
||||
|
||||
<UFormGroup
|
||||
label="Tags ändern:"
|
||||
>
|
||||
<template #label>
|
||||
{{projects.find(item => item.id === document.project) ? projects.find(item => item.id === document.project).name : document.project }}
|
||||
</template>
|
||||
</USelectMenu>
|
||||
</UFormGroup>
|
||||
<USelectMenu
|
||||
:options="tags"
|
||||
v-model="document.tags"
|
||||
@close="updateDocument"
|
||||
multiple
|
||||
>
|
||||
<template #label>
|
||||
{{document.tags.length}} ausgewählt
|
||||
</template>
|
||||
</USelectMenu>
|
||||
</UFormGroup>
|
||||
|
||||
<UFormGroup
|
||||
label="Kunde zuweisen:"
|
||||
>
|
||||
<USelectMenu
|
||||
:options="customers"
|
||||
option-attribute="name"
|
||||
value-attribute="id"
|
||||
v-model="document.customer"
|
||||
@change="updateDocument"
|
||||
searchable
|
||||
:search-attributes="['name']"
|
||||
<UFormGroup
|
||||
label="Projekt zuweisen:"
|
||||
>
|
||||
<template #label>
|
||||
{{customers.find(item => item.id === document.customer) ? customers.find(item => item.id === document.customer).name : document.customer }}
|
||||
</template>
|
||||
</USelectMenu>
|
||||
</UFormGroup>
|
||||
<USelectMenu
|
||||
:options="dataStore.projects"
|
||||
option-attribute="name"
|
||||
value-attribute="id"
|
||||
v-model="document.project"
|
||||
@change="updateDocument"
|
||||
searchable
|
||||
:search-attributes="['name']"
|
||||
>
|
||||
<template #label>
|
||||
{{dataStore.projects.find(item => item.id === document.project) ? dataStore.projects.find(item => item.id === document.project).name : "Kein Projekt ausgewählt" }}
|
||||
</template>
|
||||
</USelectMenu>
|
||||
</UFormGroup>
|
||||
|
||||
<UButton
|
||||
v-if="document.tags.includes('Eingangsrechnung')"
|
||||
@click="createVendorInvoice"
|
||||
>
|
||||
Eingangsrechnung erstellen
|
||||
</UButton>
|
||||
<UFormGroup
|
||||
label="Kunde zuweisen:"
|
||||
>
|
||||
<USelectMenu
|
||||
:options="dataStore.customers"
|
||||
option-attribute="name"
|
||||
value-attribute="id"
|
||||
v-model="document.customer"
|
||||
@change="updateDocument"
|
||||
searchable
|
||||
:search-attributes="['name']"
|
||||
>
|
||||
<template #label>
|
||||
{{dataStore.customers.find(item => item.id === document.customer) ? dataStore.customers.find(item => item.id === document.customer).name : "Kein Kunde ausgewählt" }}
|
||||
</template>
|
||||
</USelectMenu>
|
||||
</UFormGroup>
|
||||
|
||||
|
||||
</template>
|
||||
</UCard>
|
||||
|
||||
|
||||
<!-- <UCard class="h-full">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</UCard>-->
|
||||
</USlideover>
|
||||
</template>
|
||||
|
||||
@@ -274,8 +261,4 @@ const createVendorInvoice = async () => {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.bigPreview {
|
||||
height: 70vh;
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
24
spaces/components/Tiptap.vue
Normal file
24
spaces/components/Tiptap.vue
Normal file
@@ -0,0 +1,24 @@
|
||||
<template>
|
||||
<editor-content :editor="editor" />
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { useEditor, EditorContent } from '@tiptap/vue-3'
|
||||
import StarterKit from '@tiptap/starter-kit'
|
||||
|
||||
const props = defineProps({
|
||||
content: {
|
||||
type: "String",
|
||||
required: true
|
||||
}
|
||||
})
|
||||
|
||||
const {content } = props
|
||||
|
||||
const editor = useEditor({
|
||||
content: '<p>I’m running Tiptap with Vue.js. 🎉</p>',
|
||||
extensions: [
|
||||
StarterKit,
|
||||
],
|
||||
})
|
||||
</script>
|
||||
@@ -27,12 +27,16 @@
|
||||
"@fullcalendar/resource-timeline": "^6.1.10",
|
||||
"@fullcalendar/vue3": "^6.1.10",
|
||||
"@nuxt/content": "^2.9.0",
|
||||
"@nuxt/ui-pro": "^0.6.1",
|
||||
"@nuxt/ui-pro": "^0.7.0",
|
||||
"@nuxtjs/fontaine": "^0.4.1",
|
||||
"@nuxtjs/google-fonts": "^3.1.0",
|
||||
"@nuxtjs/strapi": "^1.9.3",
|
||||
"@pinia/nuxt": "^0.5.1",
|
||||
"@popperjs/core": "^2.11.8",
|
||||
"@tiptap/extension-underline": "^2.1.15",
|
||||
"@tiptap/pm": "^2.1.15",
|
||||
"@tiptap/starter-kit": "^2.1.15",
|
||||
"@tiptap/vue-3": "^2.1.15",
|
||||
"@vicons/ionicons5": "^0.12.0",
|
||||
"@vuepic/vue-datepicker": "^7.4.0",
|
||||
"@zip.js/zip.js": "^2.7.32",
|
||||
@@ -45,9 +49,11 @@
|
||||
"nuxt-viewport": "^2.0.6",
|
||||
"papaparse": "^5.4.1",
|
||||
"pinia": "^2.1.7",
|
||||
"sass": "^1.69.7",
|
||||
"socket.io-client": "^4.7.2",
|
||||
"uuidv4": "^6.2.13",
|
||||
"v-calendar": "^3.1.2",
|
||||
"vuedraggable": "^4.1.0"
|
||||
"vuedraggable": "^4.1.0",
|
||||
"vuetify": "^3.4.0-beta.1"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -24,12 +24,16 @@ const fileUploadFormData = ref({
|
||||
|
||||
let tags = dataStore.getDocumentTags
|
||||
|
||||
const selectedTags = ref(["Eingang"])
|
||||
const selectedTags = ref("Eingang")
|
||||
|
||||
|
||||
const filteredDocuments = computed(() => {
|
||||
let returnList = []
|
||||
|
||||
return dataStore.documents.filter(doc => doc.tags.filter(tag => selectedTags.value.find(t => t === tag)).length > 0)
|
||||
returnList = dataStore.documents.filter(i => i.tags.filter(t => selectedTags.value === t).length > 0)
|
||||
|
||||
//return dataStore.documents.filter(doc => doc.tags.filter(tag => selectedTags.value.find(t => t === tag)).length > 0)
|
||||
return returnList
|
||||
|
||||
})
|
||||
|
||||
@@ -158,11 +162,10 @@ const downloadSelected = async () => {
|
||||
<USelectMenu
|
||||
:options="tags"
|
||||
v-model="selectedTags"
|
||||
multiple
|
||||
class="w-40"
|
||||
>
|
||||
<template #label>
|
||||
<span v-if="selectedTags.length" class="truncate">{{ selectedTags.length }} ausgewählt</span>
|
||||
<span v-else>Tags auswählen</span>
|
||||
{{selectedTags}}
|
||||
</template>
|
||||
</USelectMenu>
|
||||
|
||||
@@ -216,11 +219,11 @@ const downloadSelected = async () => {
|
||||
</template>
|
||||
</UCard>
|
||||
</USlideover>
|
||||
|
||||
<div class="documentList">
|
||||
<div class="documentList" >
|
||||
<DocumentDisplay
|
||||
v-for="document in filteredDocuments"
|
||||
:document="document"
|
||||
:document="i"
|
||||
:key="i.id"
|
||||
v-for="i in filteredDocuments"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
11
spaces/pages/editortest.vue
Normal file
11
spaces/pages/editortest.vue
Normal file
@@ -0,0 +1,11 @@
|
||||
<script setup>
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<tiptap/>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@@ -48,31 +48,38 @@ const createTimeInfo = ref({
|
||||
const columns = [
|
||||
{
|
||||
key: "user",
|
||||
label: "Benutzer"
|
||||
label: "Benutzer",
|
||||
sortable:true
|
||||
},
|
||||
{
|
||||
key:"start",
|
||||
label:"Start"
|
||||
label:"Start",
|
||||
sortable:true
|
||||
},
|
||||
{
|
||||
key:"type",
|
||||
label:"Typ"
|
||||
label:"Typ",
|
||||
sortable:true
|
||||
},
|
||||
{
|
||||
key: "end",
|
||||
label: "Ende"
|
||||
label: "Ende",
|
||||
sortable:true
|
||||
},
|
||||
{
|
||||
key: "duration",
|
||||
label: "Dauer"
|
||||
label: "Dauer",
|
||||
sortable:true
|
||||
},
|
||||
{
|
||||
key: "projectId",
|
||||
label: "Projekt"
|
||||
label: "Projekt",
|
||||
sortable:true
|
||||
},
|
||||
{
|
||||
key: "notes",
|
||||
label: "Notizen"
|
||||
label: "Notizen",
|
||||
sortable:true
|
||||
}
|
||||
]
|
||||
|
||||
|
||||
418
spaces/pages/incominginvoices/[mode]/[[id]].vue
Normal file
418
spaces/pages/incominginvoices/[mode]/[[id]].vue
Normal file
@@ -0,0 +1,418 @@
|
||||
<script setup>
|
||||
import InputGroup from "~/components/InputGroup.vue";
|
||||
import dayjs from "dayjs";
|
||||
|
||||
const dataStore = useDataStore()
|
||||
const supabase = useSupabaseClient()
|
||||
const route = useRoute()
|
||||
const router = useRouter()
|
||||
const toast = useToast()
|
||||
|
||||
const {vendors} = storeToRefs(useDataStore())
|
||||
const {fetchVendorInvoices} = useDataStore()
|
||||
|
||||
let currentVendorInvoice = ref(null)
|
||||
//let currentDocument = ref(null)
|
||||
//Working
|
||||
const mode = ref(route.params.mode || "show")
|
||||
const useNetMode = ref(true)
|
||||
|
||||
|
||||
|
||||
|
||||
//Functions
|
||||
const setupPage = async () => {
|
||||
if(mode.value === "show" || mode.value === "edit"){
|
||||
currentVendorInvoice.value = await dataStore.getIncomingInvoiceById(Number(useRoute().params.id))
|
||||
//currentDocument.value = await dataStore.getDocumentById(currentVendorInvoice.value.document)
|
||||
}
|
||||
|
||||
if(mode.value === "edit") itemInfo.value = currentVendorInvoice.value
|
||||
}
|
||||
|
||||
const currentDocument = computed(() => {
|
||||
if(currentVendorInvoice.value) {
|
||||
return dataStore.getDocumentById(currentVendorInvoice.value.document)
|
||||
|
||||
} else {
|
||||
return null
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
|
||||
|
||||
const itemInfo = ref({
|
||||
vendor: 0,
|
||||
reference: "",
|
||||
date: null,
|
||||
dueDate: null,
|
||||
paymentType: "",
|
||||
description: "",
|
||||
state: "Entwurf",
|
||||
accounts: [
|
||||
{
|
||||
account: null,
|
||||
amountNet: null,
|
||||
amountTax: null,
|
||||
taxType: null,
|
||||
costCentre: null
|
||||
}
|
||||
]
|
||||
})
|
||||
|
||||
const totalCalculated = computed(() => {
|
||||
let totalNet = 0
|
||||
let totalAmount19Tax = 0
|
||||
let totalAmount7Tax = 0
|
||||
let totalAmount0Tax = 0
|
||||
let totalGross = 0
|
||||
|
||||
itemInfo.value.accounts.forEach(account => {
|
||||
if(account.amountNet) totalNet += account.amountNet
|
||||
|
||||
if(account.taxType === 19 && account.amountTax) {
|
||||
totalAmount19Tax += account.amountTax
|
||||
}
|
||||
})
|
||||
|
||||
totalGross = Number(totalNet + totalAmount19Tax)
|
||||
|
||||
return {
|
||||
totalNet,
|
||||
totalAmount19Tax,
|
||||
totalGross
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
const setState = async (newState) => {
|
||||
if(mode.value === 'show') {
|
||||
await updateItem({...currentVendorInvoice.value, state: newState})
|
||||
} else if(mode.value === 'edit') {
|
||||
await updateItem({...itemInfo.value, state: newState})
|
||||
}
|
||||
await router.push("/incominginvoices")
|
||||
}
|
||||
|
||||
|
||||
const updateItem = async (item) => {
|
||||
const {error} = await supabase
|
||||
.from("incomingInvoices")
|
||||
.update(item)
|
||||
.eq('id',item.id)
|
||||
if(error) {
|
||||
console.log(error)
|
||||
} else {
|
||||
mode.value = "show"
|
||||
toast.add({title: "Eingangsrechnung erfolgreich gespeichert"})
|
||||
dataStore.fetchIncomingInvoices()
|
||||
//await router.push("/incominginvoices")
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
setupPage()
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div id="main">
|
||||
<object
|
||||
v-if="currentDocument ? currentDocument.url : false"
|
||||
:data="currentDocument.url + '#toolbar=0&navpanes=0&scrollbar=0&statusbar=0&messages=0&scrollbar=0'"
|
||||
type="application/pdf"
|
||||
class="h-100 w-full mx-5"
|
||||
/>
|
||||
<div class="w-4/5">
|
||||
<InputGroup class="mt-3" v-if="currentVendorInvoice">
|
||||
<UButton
|
||||
@click="updateItem(itemInfo)"
|
||||
v-if="mode === 'edit'"
|
||||
>
|
||||
Speichern
|
||||
</UButton>
|
||||
<UButton
|
||||
:disabled="currentVendorInvoice.state !== 'Entwurf'"
|
||||
@click="router.push(`/incominginvoices/edit/${currentVendorInvoice.id}`)"
|
||||
v-if="mode !== 'edit'"
|
||||
>
|
||||
Bearbeiten
|
||||
</UButton>
|
||||
<UButton
|
||||
@click="setState('Entwurf')"
|
||||
v-if="currentVendorInvoice.state !== 'Entwurf'"
|
||||
color="cyan"
|
||||
>
|
||||
Status zu Entwurf
|
||||
</UButton>
|
||||
<UButton
|
||||
@click="setState('Offen')"
|
||||
v-if="currentVendorInvoice.state !== 'Offen'"
|
||||
color="rose"
|
||||
>
|
||||
Status zu Offen
|
||||
</UButton>
|
||||
</InputGroup>
|
||||
|
||||
<div v-if="mode === 'show'">
|
||||
{{currentVendorInvoice}}
|
||||
</div>
|
||||
|
||||
<div v-else-if="mode === 'edit'" class=" scrollContainer">
|
||||
<UFormGroup label="Lieferant:" required>
|
||||
<InputGroup>
|
||||
<USelectMenu
|
||||
v-model="itemInfo.vendor"
|
||||
:options="dataStore.vendors"
|
||||
option-attribute="name"
|
||||
value-attribute="id"
|
||||
searchable
|
||||
:search-attributes="['name','vendorNumber']"
|
||||
class="flex-auto"
|
||||
>
|
||||
<template #label>
|
||||
{{dataStore.vendors.find(vendor => vendor.id === itemInfo.vendor) ? dataStore.vendors.find(vendor => vendor.id === itemInfo.vendor).name : 'Lieferant auswählen'}}
|
||||
</template>
|
||||
</USelectMenu>
|
||||
<UButton
|
||||
@click="router.push('/vendors/create')"
|
||||
>
|
||||
+ Lieferant
|
||||
</UButton>
|
||||
</InputGroup>
|
||||
|
||||
|
||||
</UFormGroup>
|
||||
|
||||
<UFormGroup
|
||||
class="mt-3"
|
||||
label="Rechnungsreferenz:"
|
||||
required
|
||||
>
|
||||
<UInput
|
||||
v-model="itemInfo.reference"
|
||||
/>
|
||||
</UFormGroup>
|
||||
|
||||
<InputGroup class="mt-3" gap="2">
|
||||
<UFormGroup label="Rechnungsdatum:" required>
|
||||
<UPopover :popper="{ placement: 'bottom-start' }">
|
||||
<UButton icon="i-heroicons-calendar-days-20-solid" :label="itemInfo.date ? dayjs(itemInfo.date).format('DD.MM.YYYY') : 'Datum auswählen'" />
|
||||
|
||||
<template #panel="{ close }">
|
||||
<LazyDatePicker v-model="itemInfo.date" @close="close" />
|
||||
</template>
|
||||
</UPopover>
|
||||
</UFormGroup>
|
||||
|
||||
<UFormGroup label="Fälligkeitsdatum:" required>
|
||||
<UPopover :popper="{ placement: 'bottom-start' }">
|
||||
<UButton icon="i-heroicons-calendar-days-20-solid" :label="itemInfo.dueDate ? dayjs(itemInfo.dueDate).format('DD.MM.YYYY') : 'Datum auswählen'" />
|
||||
|
||||
<template #panel="{ close }">
|
||||
<LazyDatePicker v-model="itemInfo.dueDate" @close="close" />
|
||||
</template>
|
||||
</UPopover>
|
||||
</UFormGroup>
|
||||
</InputGroup>
|
||||
|
||||
|
||||
|
||||
<UFormGroup label="Beschreibung:" required>
|
||||
<UTextarea
|
||||
v-model="itemInfo.description"
|
||||
/>
|
||||
</UFormGroup>
|
||||
|
||||
<InputGroup class="my-3">
|
||||
Brutto
|
||||
<UToggle
|
||||
v-model="useNetMode"
|
||||
@update:model-value="itemInfo.accounts = [{account: null,amountNet: null,amountTax: null,taxType: null}]"
|
||||
/>
|
||||
Netto
|
||||
</InputGroup>
|
||||
|
||||
<table v-if="itemInfo.accounts.length > 1">
|
||||
<tr>
|
||||
<td>Gesamt exkl. Steuer: </td>
|
||||
<td class="text-right">{{totalCalculated.totalNet.toFixed(2)}} €</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>19% Steuer: </td>
|
||||
<td class="text-right">{{totalCalculated.totalAmount19Tax.toFixed(2)}} €</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Gesamt inkl. Steuer: </td>
|
||||
<td class="text-right">{{totalCalculated.totalGross.toFixed(2)}} €</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<div
|
||||
class="my-3"
|
||||
v-for="(item,index) in itemInfo.accounts"
|
||||
>
|
||||
|
||||
<UFormGroup
|
||||
label="Kategorie"
|
||||
class=" mb-3"
|
||||
>
|
||||
<USelectMenu
|
||||
:options="dataStore.accounts"
|
||||
option-attribute="label"
|
||||
value-attribute="id"
|
||||
searchable
|
||||
:search-attributes="['label']"
|
||||
searchable-placeholder="Suche..."
|
||||
v-model="item.account"
|
||||
>
|
||||
<template #label>
|
||||
{{dataStore.accounts.find(account => account.id === item.account) ? dataStore.accounts.find(account => account.id === item.account).label : "Keine Kategorie ausgewählt" }}
|
||||
</template>
|
||||
|
||||
</USelectMenu>
|
||||
</UFormGroup>
|
||||
<UFormGroup
|
||||
label="Kostenstelle"
|
||||
class=" mb-3"
|
||||
>
|
||||
<USelectMenu
|
||||
:options="dataStore.getCostCentresComposed"
|
||||
option-attribute="label"
|
||||
value-attribute="id"
|
||||
searchable
|
||||
:search-attributes="['label']"
|
||||
searchable-placeholder="Suche..."
|
||||
v-model="item.costCentre"
|
||||
>
|
||||
<template #label>
|
||||
{{dataStore.getCostCentresComposed.find(account => account.id === item.costCentre) ? dataStore.getCostCentresComposed.find(account => account.id === item.costCentre).label : "Keine Kostenstelle ausgewählt" }}
|
||||
</template>
|
||||
|
||||
</USelectMenu>
|
||||
</UFormGroup>
|
||||
|
||||
|
||||
|
||||
<InputGroup>
|
||||
<UFormGroup
|
||||
label="Umsatzsteuer"
|
||||
class="w-32"
|
||||
:help="`Betrag: ${item.amountTax ? String(item.amountTax).replace('.',',') : '0,00'} €`"
|
||||
>
|
||||
<USelectMenu
|
||||
:options="[19,7,0]"
|
||||
v-model="item.taxType"
|
||||
@change="item.amountTax = Number(((item.amountNet ? item.amountNet : 0) * (Number(item.taxType)/100)).toFixed(2))"
|
||||
>
|
||||
<template #label>
|
||||
{{item.taxType}} %
|
||||
</template>
|
||||
</USelectMenu>
|
||||
</UFormGroup>
|
||||
<UFormGroup
|
||||
v-if="useNetMode"
|
||||
label="Gesamtbetrag exkl. Steuer in EUR"
|
||||
class="flex-auto"
|
||||
:help="item.taxType !== null ? `Betrag inkl. Steuern: ${String(Number(item.amountNet + item.amountTax).toFixed(2)).replace('.',',')} €` : 'Zuerst Steuertyp festlegen' "
|
||||
|
||||
>
|
||||
<UInput
|
||||
type="number"
|
||||
step="0.01"
|
||||
v-model="item.amountNet"
|
||||
:disabled="item.taxType === null"
|
||||
@keyup="item.amountTax = Number((item.amountNet * (Number(item.taxType)/100)).toFixed(2))"
|
||||
>
|
||||
<template #trailing>
|
||||
<span class="text-gray-500 dark:text-gray-400 text-xs">EUR</span>
|
||||
</template>
|
||||
</UInput>
|
||||
</UFormGroup>
|
||||
<UFormGroup
|
||||
v-else
|
||||
label="Gesamtbetrag inkl. Steuer in EUR"
|
||||
class="flex-auto"
|
||||
:help="item.taxType !== null ? `Betrag exkl. Steuern: ${item.amountNet ? String(item.amountNet.toFixed(2)).replace('.',',') : '0,00'} €` : 'Zuerst Steuertyp festlegen' "
|
||||
|
||||
>
|
||||
<UInput
|
||||
type="number"
|
||||
step="0.01"
|
||||
:disabled="item.taxType === null"
|
||||
v-model="item.amountGross"
|
||||
@keyup="item.amountNet = Number((item.amountGross / (1 + Number(item.taxType)/100)).toFixed(2)),
|
||||
item.amountTax = Number((item.amountGross - item.amountNet).toFixed(2))"
|
||||
>
|
||||
<template #trailing>
|
||||
<span class="text-gray-500 dark:text-gray-400 text-xs">EUR</span>
|
||||
</template>
|
||||
</UInput>
|
||||
|
||||
</UFormGroup>
|
||||
|
||||
|
||||
</InputGroup>
|
||||
|
||||
|
||||
<UButton
|
||||
class="mt-3"
|
||||
@click="itemInfo.accounts = [...itemInfo.accounts.slice(0,index+1),{account:null, amountNet: null, amountTax:null, taxType: null} , ...itemInfo.accounts.slice(index+1)]"
|
||||
>
|
||||
Position hinzufügen
|
||||
</UButton>
|
||||
<UButton
|
||||
v-if="index !== 0"
|
||||
class="mt-3"
|
||||
variant="ghost"
|
||||
color="rose"
|
||||
@click="itemInfo.accounts = itemInfo.accounts.filter((account,itemIndex) => itemIndex !== index)"
|
||||
>
|
||||
Position entfernen
|
||||
</UButton>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
#main {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
height: 85vh;
|
||||
}
|
||||
|
||||
.previewDoc {
|
||||
min-width: 50vw;
|
||||
min-height: 80vh;
|
||||
}
|
||||
|
||||
.previewDoc object {
|
||||
width: 90%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.scrollContainer {
|
||||
overflow-y: scroll;
|
||||
height: 75vh;
|
||||
margin-top: 1em;
|
||||
-ms-overflow-style: none; /* IE and Edge */
|
||||
scrollbar-width: none; /* Firefox */
|
||||
}
|
||||
|
||||
.scrollContainer::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
||||
.lineItemRow {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
</style>
|
||||
@@ -2,7 +2,7 @@
|
||||
<div id="main">
|
||||
|
||||
<div class="flex items-center gap-1">
|
||||
<UButton @click="router.push(`/vendorinvoices/create/`)">+ Eingangsrechnung</UButton>
|
||||
<UButton @click="router.push(`/incominginvoices/create/`)">+ Eingangsrechnung</UButton>
|
||||
|
||||
<UInput
|
||||
v-model="searchString"
|
||||
@@ -26,7 +26,13 @@
|
||||
{{row.state}}
|
||||
</span>
|
||||
<span
|
||||
v-if="row.state === 'Bezahlt'"
|
||||
v-if="row.state === 'Offen'"
|
||||
class="text-rose-500"
|
||||
>
|
||||
{{row.state}}
|
||||
</span>
|
||||
<span
|
||||
v-if="row.state === 'Abgeschlossen'"
|
||||
class="text-primary-500"
|
||||
>
|
||||
{{row.state}}
|
||||
@@ -39,10 +45,14 @@
|
||||
<span v-if="row.date">{{row.date ? dayjs(row.date).format("DD.MM.YY") : ''}}</span>
|
||||
</template>
|
||||
<template #dueDate-data="{row}">
|
||||
{{row.dueDate ? dayjs(row.dueDate).format("DD.MM.YY") : ''}}
|
||||
<span :class="dayjs(row.dueDate).diff(dayjs()) <= 0 ? ['text-rose-500'] : '' ">{{row.dueDate ? dayjs(row.dueDate).format("DD.MM.YY") : ''}}</span>
|
||||
</template>
|
||||
<template #paid-data="{row}">
|
||||
<span v-if="row.paid" class="text-primary-500">Bezahlt</span>
|
||||
<span v-if="!row.paid" :class="dayjs(row.dueDate).diff(dayjs()) <= 0 ? ['text-rose-500'] : ['text-cyan-500'] ">Offen</span>
|
||||
</template>
|
||||
<template #amount-data="{row}">
|
||||
{{getRowAmount(row) === 0 ? '' : `${getRowAmount(row)} €`}}
|
||||
<div class="text-right font-bold">{{getRowAmount(row) === 0 ? '' : `${String(getRowAmount(row).toFixed(2)).replace('.',',')} €`}}</div>
|
||||
</template>
|
||||
</UTable>
|
||||
|
||||
@@ -83,6 +93,11 @@ const itemColumns = [
|
||||
label: "Datum",
|
||||
sortable: true
|
||||
},
|
||||
{
|
||||
key: "paid",
|
||||
label: "Bezahlt:",
|
||||
sortable: true
|
||||
},
|
||||
{
|
||||
key: "dueDate",
|
||||
label: "Fällig:",
|
||||
@@ -98,7 +113,13 @@ const itemColumns = [
|
||||
|
||||
const selectItem = (item) => {
|
||||
console.log(item)
|
||||
router.push(`/vendorinvoices/edit/${item.id} `)
|
||||
if(item.state === "Entwurf") {
|
||||
console.log("ENTWURF")
|
||||
router.push(`/incominginvoices/edit/${item.id} `)
|
||||
} else if(item.state === "Offen") {
|
||||
router.push(`/incominginvoices/show/${item.id}`)
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
const getRowAmount = (row) => {
|
||||
@@ -117,10 +138,10 @@ const searchString = ref('')
|
||||
|
||||
const filteredRows = computed(() => {
|
||||
if(!searchString.value) {
|
||||
return dataStore.vendorInvoices
|
||||
return dataStore.incomingInvoices
|
||||
}
|
||||
|
||||
return dataStore.vendorInvoices.filter(item => {
|
||||
return dataStore.incomingInvoices.filter(item => {
|
||||
return Object.values(item).some((value) => {
|
||||
return String(value).toLowerCase().includes(searchString.value.toLowerCase())
|
||||
})
|
||||
@@ -40,12 +40,13 @@ const createEvent = async () => {
|
||||
|
||||
if(error) {
|
||||
console.log(error)
|
||||
} else {
|
||||
openNewEventModal.value = false
|
||||
newEventData.value = {}
|
||||
dataStore.fetchEvents()
|
||||
}
|
||||
|
||||
console.log("OK")
|
||||
openNewEventModal.value = false
|
||||
newEventData.value = {}
|
||||
dataStore.fetchEvents()
|
||||
|
||||
|
||||
}
|
||||
const calendarOptionsList = reactive({
|
||||
@@ -61,11 +62,12 @@ const calendarOptionsTimeline = reactive({
|
||||
schedulerLicenseKey: "CC-Attribution-NonCommercial-NoDerivatives",
|
||||
locale: deLocale,
|
||||
plugins: [resourceTimelinePlugin, interactionPlugin],
|
||||
initialView: "resourceTimelineDay",
|
||||
initialView: "resourceTimeline3Hours",
|
||||
|
||||
headerToolbar: {
|
||||
left: 'prev,next',
|
||||
center: 'title',
|
||||
right: 'resourceTimelineDay,resourceTimelineWeek,resourceTimelineMonth'
|
||||
right: 'resourceTimelineDay,resourceTimeline3Hours,resourceTimelineMonth'
|
||||
},
|
||||
initialEvents: events,
|
||||
selectable: true,
|
||||
@@ -88,7 +90,29 @@ const calendarOptionsTimeline = reactive({
|
||||
},
|
||||
resourceGroupField: "type",
|
||||
resources: resources,
|
||||
nowIndicator:true
|
||||
nowIndicator:true,
|
||||
views: {
|
||||
resourceTimeline3Hours: {
|
||||
type: 'resourceTimeline',
|
||||
slotDuration: {hours: 3},
|
||||
slotMinTime: "06:00:00",
|
||||
slotMaxTime: "21:00:00",
|
||||
/*duration: {days:7},*/
|
||||
buttonText: "Woche",
|
||||
visibleRange: function(currentDate) {
|
||||
// Generate a new date for manipulating in the next step
|
||||
var startDate = new Date(currentDate);
|
||||
var endDate = new Date(currentDate);
|
||||
|
||||
// Adjust the start & end dates, respectively
|
||||
startDate.setDate(startDate.getDate() - startDate.getDay() +1); // One day in the past
|
||||
endDate.setDate(startDate.getDate() + 5); // Two days into the future
|
||||
|
||||
return { start: startDate, end: endDate };
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
})
|
||||
|
||||
</script>
|
||||
@@ -124,6 +148,24 @@ const calendarOptionsTimeline = reactive({
|
||||
v-model="newEventData.title"
|
||||
/>
|
||||
</UFormGroup>
|
||||
<UFormGroup
|
||||
label="Projekt:"
|
||||
>
|
||||
<USelectMenu
|
||||
v-model="newEventData.project"
|
||||
:options="dataStore.projects"
|
||||
option-attribute="name"
|
||||
value-attribute="id"
|
||||
searchable
|
||||
searchable-placeholder="Suche..."
|
||||
:search-attributes="['name']"
|
||||
>
|
||||
<template #label>
|
||||
{{dataStore.getProjectById(newEventData.project) ? dataStore.getProjectById(newEventData.project).name : "Kein Projekt ausgewählt"}}
|
||||
</template>
|
||||
|
||||
</USelectMenu>
|
||||
</UFormGroup>
|
||||
<UFormGroup
|
||||
label="Typ:"
|
||||
>
|
||||
|
||||
@@ -1,10 +1,17 @@
|
||||
<template>
|
||||
<div id="main">
|
||||
<InputGroup>
|
||||
<UButton @click="router.push(`/plants/create/`)">+ Anlage</UButton>
|
||||
|
||||
<UInput
|
||||
v-model="searchString"
|
||||
placeholder="Suche..."
|
||||
/>
|
||||
</InputGroup>
|
||||
|
||||
<UButton @click="router.push(`/plants/create/`)">+ Anlage</UButton>
|
||||
|
||||
<UTable
|
||||
:rows="dataStore.plants"
|
||||
:rows="filteredRows"
|
||||
:columns="columns"
|
||||
@select="selectItem"
|
||||
:empty-state="{ icon: 'i-heroicons-circle-stack-20-solid', label: 'Noch keine Einträge' }"
|
||||
@@ -39,7 +46,22 @@ const columns = [
|
||||
}
|
||||
]
|
||||
|
||||
const searchString = ref('')
|
||||
|
||||
const filteredRows = computed(() => {
|
||||
if(!searchString.value) {
|
||||
return dataStore.plants
|
||||
}
|
||||
|
||||
return dataStore.plants.filter(item => {
|
||||
|
||||
item.customerName = dataStore.customers.find(i => i.id === item.customer).name
|
||||
|
||||
return Object.values(item).some((value) => {
|
||||
return String(value).toLowerCase().includes(searchString.value.toLowerCase())
|
||||
})
|
||||
})
|
||||
})
|
||||
const selectItem = (item) => {
|
||||
router.push(`/plants/show/${item.id} `)
|
||||
}
|
||||
|
||||
@@ -473,6 +473,21 @@ setupPage()
|
||||
</USelectMenu>
|
||||
</UFormGroup>
|
||||
|
||||
<UFormGroup
|
||||
label="Gewerk:"
|
||||
>
|
||||
<USelectMenu
|
||||
v-model="itemInfo.measure"
|
||||
:options="dataStore.getMeasures"
|
||||
option-attribute="name"
|
||||
value-attribute="short"
|
||||
searchable
|
||||
:search-attributes="['name']"
|
||||
>
|
||||
|
||||
</USelectMenu>
|
||||
</UFormGroup>
|
||||
|
||||
<UFormGroup
|
||||
label="Anlage:"
|
||||
>
|
||||
|
||||
@@ -1,4 +1,6 @@
|
||||
<script setup>
|
||||
import dayjs from "dayjs";
|
||||
|
||||
definePageMeta({
|
||||
middleware: "auth"
|
||||
})
|
||||
@@ -10,7 +12,7 @@ const router = useRouter()
|
||||
const toast = useToast()
|
||||
const id = ref(route.params.id ? route.params.id : null )
|
||||
|
||||
let currentItem = null
|
||||
let currentItem = ref(null)
|
||||
|
||||
|
||||
|
||||
@@ -24,13 +26,43 @@ const itemInfo = ref({
|
||||
driver: ""
|
||||
})
|
||||
|
||||
const tabItems = [{
|
||||
label: 'Informationen',
|
||||
}, {
|
||||
label: 'Eingangsrechnungen',
|
||||
}]
|
||||
|
||||
const incomingInvoicesColumns = [
|
||||
{
|
||||
key: "state",
|
||||
label: "Status",
|
||||
sortable: true
|
||||
},{
|
||||
key: "vendor",
|
||||
label: "Lieferant",
|
||||
sortable: true
|
||||
},{
|
||||
key: "date",
|
||||
label: "Datum",
|
||||
sortable: true
|
||||
},{
|
||||
key: "description",
|
||||
label: "Beschreibung",
|
||||
sortable: true
|
||||
},{
|
||||
key: "accounts",
|
||||
label: "Betrag",
|
||||
sortable: true
|
||||
},
|
||||
]
|
||||
|
||||
//Functions
|
||||
const setupPage = () => {
|
||||
if(mode.value === "show" || mode.value === "edit"){
|
||||
currentItem = dataStore.getVehicleById(Number(useRoute().params.id))
|
||||
currentItem.value = dataStore.getVehicleById(Number(useRoute().params.id))
|
||||
}
|
||||
|
||||
if(mode.value === "edit") itemInfo.value = currentItem
|
||||
if(mode.value === "edit") itemInfo.value = currentItem.value
|
||||
|
||||
|
||||
|
||||
@@ -58,7 +90,7 @@ const createItem = async () => {
|
||||
}
|
||||
|
||||
const editCustomer = async () => {
|
||||
router.push(`/vehicles/edit/${currentItem.id}`)
|
||||
router.push(`/vehicles/edit/${currentItem.value.id}`)
|
||||
setupPage()
|
||||
}
|
||||
|
||||
@@ -81,12 +113,23 @@ const updateItem = async () => {
|
||||
console.log(error)
|
||||
} else {
|
||||
|
||||
router.push(`/vehicles/show/${currentItem.id}`)
|
||||
router.push(`/vehicles/show/${currentItem.value.id}`)
|
||||
toast.add({title: "Fahrzeug erfolgreich gespeichert"})
|
||||
dataStore.fetchVehicles()
|
||||
}
|
||||
}
|
||||
|
||||
const getRowAmount = (row) => {
|
||||
let amount = 0
|
||||
|
||||
row.accounts.forEach(account => {
|
||||
amount += account.amountNet
|
||||
amount += account.amountTax
|
||||
})
|
||||
|
||||
return amount
|
||||
}
|
||||
|
||||
setupPage()
|
||||
</script>
|
||||
|
||||
@@ -108,8 +151,34 @@ setupPage()
|
||||
{{currentItem.licensePlate}}
|
||||
</template>
|
||||
|
||||
Typ: {{currentItem.type}} <br>
|
||||
Fahrer: {{dataStore.profiles.find(profile => profile.id === currentItem.driver) ? dataStore.profiles.find(profile => profile.id === currentItem.driver).fullName : 'Kein Fahrer gewählt'}} <br>
|
||||
<UTabs :items="tabItems">
|
||||
<template #item="{item}">
|
||||
<div v-if="item.label === 'Informationen'">
|
||||
Typ: {{currentItem.type}} <br>
|
||||
Fahrer: {{dataStore.profiles.find(profile => profile.id === currentItem.driver) ? dataStore.profiles.find(profile => profile.id === currentItem.driver).fullName : 'Kein Fahrer gewählt'}} <br>
|
||||
</div>
|
||||
<div v-else-if="item.label === 'Eingangsrechnungen'">
|
||||
<UTable
|
||||
:rows="dataStore.getIncomingInvoicesByVehicleId(currentItem.id)"
|
||||
:columns="incomingInvoicesColumns"
|
||||
@select="(row) => router.push('/incominginvoices/show/' + row.id)"
|
||||
>
|
||||
<template #vendor-data="{row}">
|
||||
{{dataStore.getVendorById(row.vendor) ? dataStore.getVendorById(row.vendor).name : ""}}
|
||||
</template>
|
||||
<template #date-data="{row}">
|
||||
{{dayjs(row.date).format("DD.MM.YYYY")}}
|
||||
</template>
|
||||
<template #accounts-data="{row}">
|
||||
{{getRowAmount(row) ? String(getRowAmount(row).toFixed(2)).replace('.',',') + " €" : ""}}
|
||||
</template>
|
||||
</UTable>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
</UTabs>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@@ -1,342 +0,0 @@
|
||||
<template>
|
||||
<div id="main">
|
||||
|
||||
<div
|
||||
class="previewDoc"
|
||||
>
|
||||
<embed
|
||||
v-if="currentDocument"
|
||||
:src="currentDocument.url + '#toolbar=0&navpanes=0&scrollbar=0&statusbar=0&messages=0&scrollbar=0'"
|
||||
|
||||
>
|
||||
|
||||
</div>
|
||||
<div
|
||||
class="inputData"
|
||||
>
|
||||
<UFormGroup label="Lieferant:" required>
|
||||
<USelectMenu
|
||||
v-model="itemInfo.vendor"
|
||||
:options="dataStore.vendors"
|
||||
option-attribute="name"
|
||||
value-attribute="id"
|
||||
searchable
|
||||
:search-attributes="['name','vendorNumber']"
|
||||
>
|
||||
<template #label>
|
||||
{{dataStore.vendors.find(vendor => vendor.id === itemInfo.vendor) ? dataStore.vendors.find(vendor => vendor.id === itemInfo.vendor).name : 'Lieferant auswählen'}}
|
||||
</template>
|
||||
</USelectMenu>
|
||||
</UFormGroup>
|
||||
|
||||
<UFormGroup
|
||||
class="mt-3"
|
||||
label="Rechnungsreferenz:"
|
||||
required
|
||||
>
|
||||
<UInput
|
||||
v-model="itemInfo.reference"
|
||||
/>
|
||||
</UFormGroup>
|
||||
|
||||
<InputGroup class="mt-3" gap="2">
|
||||
<UFormGroup label="Rechnungsdatum:" required>
|
||||
<UPopover :popper="{ placement: 'bottom-start' }">
|
||||
<UButton icon="i-heroicons-calendar-days-20-solid" :label="itemInfo.date ? dayjs(itemInfo.date).format('DD.MM.YYYY') : 'Datum auswählen'" />
|
||||
|
||||
<template #panel="{ close }">
|
||||
<LazyDatePicker v-model="itemInfo.date" @close="close" />
|
||||
</template>
|
||||
</UPopover>
|
||||
</UFormGroup>
|
||||
|
||||
<UFormGroup label="Fälligkeitsdatum:" required>
|
||||
<UPopover :popper="{ placement: 'bottom-start' }">
|
||||
<UButton icon="i-heroicons-calendar-days-20-solid" :label="itemInfo.dueDate ? dayjs(itemInfo.dueDate).format('DD.MM.YYYY') : 'Datum auswählen'" />
|
||||
|
||||
<template #panel="{ close }">
|
||||
<LazyDatePicker v-model="itemInfo.dueDate" @close="close" />
|
||||
</template>
|
||||
</UPopover>
|
||||
</UFormGroup>
|
||||
</InputGroup>
|
||||
|
||||
|
||||
|
||||
<UFormGroup label="Beschreibung:" required>
|
||||
<UTextarea
|
||||
v-model="itemInfo.description"
|
||||
/>
|
||||
</UFormGroup>
|
||||
|
||||
<div
|
||||
class="my-3"
|
||||
v-for="(item,index) in itemInfo.accounts"
|
||||
>
|
||||
|
||||
<UFormGroup
|
||||
label="Kategorie"
|
||||
class=" mb-3"
|
||||
>
|
||||
<USelectMenu
|
||||
:options="dataStore.accounts"
|
||||
option-attribute="label"
|
||||
value-attribute="id"
|
||||
searchable
|
||||
:search-attributes="['label']"
|
||||
searchable-placeholder="Suche..."
|
||||
v-model="item.account"
|
||||
>
|
||||
<template #label>
|
||||
{{dataStore.accounts.find(account => account.id === item.account) ? dataStore.accounts.find(account => account.id === item.account).label : "Keine Kategorie ausgewählt" }}
|
||||
</template>
|
||||
|
||||
</USelectMenu>
|
||||
</UFormGroup>
|
||||
|
||||
<InputGroup>
|
||||
<UFormGroup
|
||||
label="Steuer"
|
||||
class="w-32"
|
||||
:help="`Betrag: ${String(item.amountTax).replace('.',',')} €`"
|
||||
>
|
||||
<USelectMenu
|
||||
:options="[19,7,0]"
|
||||
v-model="item.taxType"
|
||||
>
|
||||
<template #label>
|
||||
{{item.taxType}} %
|
||||
</template>
|
||||
</USelectMenu>
|
||||
</UFormGroup>
|
||||
<UFormGroup
|
||||
label="Gesamtbetrag exkl. Steuer in EUR"
|
||||
class="flex-auto"
|
||||
:help="`Betrag inkl. Steuern: ${String(Number(calculateWithTax(item)) + Number(item.amountNet)).replace('.',',')} €` "
|
||||
|
||||
>
|
||||
<UInput
|
||||
type="number"
|
||||
step="0.01"
|
||||
v-model="item.amountNet"
|
||||
>
|
||||
<template #trailing>
|
||||
<span class="text-gray-500 dark:text-gray-400 text-xs">EUR</span>
|
||||
</template>
|
||||
</UInput>
|
||||
</UFormGroup>
|
||||
|
||||
|
||||
</InputGroup>
|
||||
|
||||
<UButton
|
||||
class="mt-3"
|
||||
@click="itemInfo.accounts = [...itemInfo.accounts.slice(0,index+1),{account:null, amountNet: null, amountTax:null, taxType: null} , ...itemInfo.accounts.slice(index+1)]"
|
||||
>
|
||||
Position hinzufügen
|
||||
</UButton>
|
||||
<UButton
|
||||
v-if="index !== 0"
|
||||
class="mt-3"
|
||||
variant="ghost"
|
||||
color="rose"
|
||||
@click="itemInfo.accounts = itemInfo.accounts.filter((account,itemIndex) => itemIndex !== index)"
|
||||
>
|
||||
Position entfernen
|
||||
</UButton>
|
||||
</div>
|
||||
|
||||
|
||||
<!--
|
||||
<UFormGroup label="Kategorie:" required>
|
||||
<USelectMenu
|
||||
:options="dataStore.accounts"
|
||||
option-attribute="label"
|
||||
value-attribute="number"
|
||||
searchable
|
||||
:search-attributes="['label']"
|
||||
v-model="itemInfo.account"
|
||||
>
|
||||
|
||||
</USelectMenu>
|
||||
</UFormGroup>
|
||||
<UFormGroup label="Betrag:" required>
|
||||
<UInput
|
||||
type="number"
|
||||
step="0.01"
|
||||
v-model="itemInfo.amount"
|
||||
>
|
||||
<template #trailing>
|
||||
<span class="text-gray-500 dark:text-gray-400 text-xs">EUR</span>
|
||||
</template>
|
||||
</UInput>
|
||||
</UFormGroup>-->
|
||||
|
||||
<InputGroup class="mt-3">
|
||||
<UButton
|
||||
@click="updateItem"
|
||||
>
|
||||
Speichern
|
||||
</UButton>
|
||||
</InputGroup>
|
||||
|
||||
<DevOnly>
|
||||
{{itemInfo}}<br>
|
||||
{{currentVendorInvoice}}<br>
|
||||
{{currentDocument}}
|
||||
</DevOnly>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import InputGroup from "~/components/InputGroup.vue";
|
||||
import dayjs from "dayjs";
|
||||
|
||||
const dataStore = useDataStore()
|
||||
const supabase = useSupabaseClient()
|
||||
const route = useRoute()
|
||||
const toast = useToast()
|
||||
|
||||
const {vendors} = storeToRefs(useDataStore())
|
||||
const {fetchVendorInvoices} = useDataStore()
|
||||
|
||||
let currentVendorInvoice = null
|
||||
let currentDocument = ref(null)
|
||||
//Working
|
||||
const mode = ref(route.params.mode || "show")
|
||||
|
||||
const types = [
|
||||
{
|
||||
number: "3200",
|
||||
label: "Wareneinkauf",
|
||||
description: "Der Einkauf von Produkten umfasst auch die Kosten für die Bearbeitung/Verarbeitung und den Handel"
|
||||
},{
|
||||
number: "3000",
|
||||
label: "Materialeinkauf",
|
||||
description: "Hierzu gehören sämtliche Kosten, die im Rahmen der Produktion für Roh, Hilfs- und Betriebsstoffe anfallen."
|
||||
},{
|
||||
number: "3800",
|
||||
label: "Bezugsnebenkosten",
|
||||
description: "Dazu zählen alle Beschaffungskosten für Material und Waren bzw. Produkte"
|
||||
},{
|
||||
number: "4930",
|
||||
label: "Bürobedarf",
|
||||
description: ""
|
||||
},{
|
||||
number: "4964",
|
||||
label: "Lizenzen und Konzessionen",
|
||||
description: ""
|
||||
},{
|
||||
number: "4925",
|
||||
label: "Internet",
|
||||
description: ""
|
||||
},{
|
||||
number: "4920",
|
||||
label: "Telekommunikation",
|
||||
description: ""
|
||||
},{
|
||||
number: "4530",
|
||||
label: "Kraftstoff/Ladestrom",
|
||||
description: ""
|
||||
},{
|
||||
number: "4969",
|
||||
label: "Müllgebühren",
|
||||
description: ""
|
||||
}
|
||||
]
|
||||
|
||||
|
||||
|
||||
|
||||
//Functions
|
||||
const setupPage = async () => {
|
||||
if(mode.value === "show" || mode.value === "edit"){
|
||||
currentVendorInvoice = await dataStore.getVendorInvoiceById(Number(useRoute().params.id))
|
||||
currentDocument.value = await dataStore.getDocumentById(currentVendorInvoice.document)
|
||||
}
|
||||
|
||||
if(mode.value === "edit") itemInfo.value = currentVendorInvoice
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
const itemInfo = ref({
|
||||
vendor: 0,
|
||||
reference: "",
|
||||
date: null,
|
||||
dueDate: null,
|
||||
paymentType: "",
|
||||
description: "",
|
||||
state: "Entwurf",
|
||||
accounts: [
|
||||
{
|
||||
account: null,
|
||||
amountNet: null,
|
||||
amountTax: null,
|
||||
taxType: null
|
||||
}
|
||||
]
|
||||
})
|
||||
|
||||
const calculateWithTax = (item) => {
|
||||
item.amountTax = Number((item.amountNet / 100 * Number(item.taxType)).toFixed(2))
|
||||
|
||||
return item.amountTax
|
||||
}
|
||||
|
||||
|
||||
const updateItem = async () => {
|
||||
const {error} = await supabase
|
||||
.from("vendorInvoices")
|
||||
.update(itemInfo.value)
|
||||
.eq('id',itemInfo.value.id)
|
||||
if(error) {
|
||||
console.log(error)
|
||||
} else {
|
||||
mode.value = "show"
|
||||
/*itemInfo.value = {
|
||||
id: 0,
|
||||
}*/
|
||||
toast.add({title: "Eingangsrechnung erfolgreich gespeichert"})
|
||||
dataStore.fetchVendorInvoices()
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
setupPage()
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
#main {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.previewDoc {
|
||||
min-width: 50vw;
|
||||
min-height: 80vh;
|
||||
}
|
||||
|
||||
.previewDoc embed {
|
||||
width: 90%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.inputData {
|
||||
max-width: 40vw;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
.lineItemRow {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
</style>
|
||||
@@ -1,3 +0,0 @@
|
||||
export default defineEventHandler((event) => {
|
||||
event.context.auth = { user: 123 }
|
||||
})
|
||||
@@ -21,7 +21,8 @@ export const useDataStore = defineStore('data', () => {
|
||||
tags: {
|
||||
documents: [] as any[],
|
||||
products: [] as any[]
|
||||
}
|
||||
},
|
||||
measures: [] as {name:String, short:String}[]
|
||||
})
|
||||
const profiles = ref([])
|
||||
const events = ref([])
|
||||
@@ -40,7 +41,7 @@ export const useDataStore = defineStore('data', () => {
|
||||
const contacts = ref([])
|
||||
const vehicles = ref([])
|
||||
const vendors = ref([])
|
||||
const vendorInvoices = ref([])
|
||||
const incomingInvoices = ref([])
|
||||
const bankAccounts = ref([])
|
||||
const bankStatements = ref([])
|
||||
const historyItems = ref([])
|
||||
@@ -71,7 +72,7 @@ export const useDataStore = defineStore('data', () => {
|
||||
await fetchSpaces()
|
||||
await fetchVehicles()
|
||||
await fetchVendors()
|
||||
await fetchVendorInvoices()
|
||||
await fetchIncomingInvoices()
|
||||
await fetchBankAccounts()
|
||||
await fetchBankStatements()
|
||||
await fetchHistoryItems()
|
||||
@@ -105,7 +106,7 @@ export const useDataStore = defineStore('data', () => {
|
||||
contacts.value= []
|
||||
vehicles.value= []
|
||||
vendors.value= []
|
||||
vendorInvoices.value= []
|
||||
incomingInvoices.value= []
|
||||
bankAccounts.value= []
|
||||
bankStatements.value= []
|
||||
historyItems.value = []
|
||||
@@ -170,16 +171,17 @@ export const useDataStore = defineStore('data', () => {
|
||||
vehicles.value = (await supabase.from("vehicles").select()).data
|
||||
}
|
||||
async function fetchTimes () {
|
||||
times.value = (await supabase.from("times").select()).data
|
||||
times.value = (await supabase.from("times").select().order("start", {ascending:false})).data
|
||||
}
|
||||
async function fetchHistoryItems () {
|
||||
|
||||
historyItems.value = (await supabase.from("historyItems").select()).data
|
||||
}
|
||||
async function fetchVendors () {
|
||||
vendors.value = (await supabase.from("vendors").select().order("vendorNumber", {ascending:true})).data
|
||||
}
|
||||
async function fetchVendorInvoices () {
|
||||
vendorInvoices.value = (await supabase.from("vendorInvoices").select()).data
|
||||
async function fetchIncomingInvoices () {
|
||||
incomingInvoices.value = (await supabase.from("incomingInvoices").select()).data
|
||||
}
|
||||
async function fetchNumberRanges () {
|
||||
numberRanges.value = (await supabase.from("numberRanges").select()).data
|
||||
@@ -273,6 +275,10 @@ export const useDataStore = defineStore('data', () => {
|
||||
return historyItems.value.filter(item => item.vendor === vendorId)
|
||||
})
|
||||
|
||||
const getIncomingInvoicesByVehicleId = computed(() => (vehicleId:string) => {
|
||||
return incomingInvoices.value.filter(i => i.accounts.find(a => a.costCentre === vehicleId))
|
||||
})
|
||||
|
||||
const getMovementsBySpaceId = computed(() => (spaceId:string) => {
|
||||
return movements.value.filter(movement => movement.spaceId === spaceId)
|
||||
})
|
||||
@@ -301,18 +307,22 @@ export const useDataStore = defineStore('data', () => {
|
||||
return ownTenant.value.tags.documents
|
||||
})
|
||||
|
||||
const getMeasures = computed(() => {
|
||||
return ownTenant.value.measures
|
||||
})
|
||||
|
||||
const getResources = computed(() => {
|
||||
return [
|
||||
...profiles.value.map(profile => {
|
||||
return {
|
||||
type: 'person',
|
||||
type: 'Mitarbeiter',
|
||||
title: profile.fullName,
|
||||
id: profile.id
|
||||
}
|
||||
}),
|
||||
...vehicles.value.map(vehicle => {
|
||||
return {
|
||||
type: 'vehicle',
|
||||
type: 'Fahrzeug',
|
||||
title: vehicle.licensePlate,
|
||||
id: vehicle.licensePlate
|
||||
}
|
||||
@@ -327,6 +337,7 @@ export const useDataStore = defineStore('data', () => {
|
||||
|
||||
return {
|
||||
...event,
|
||||
title: !event.title ? projects.value.find(i => i.id === event.project).name : event.title,
|
||||
borderColor: eventColor,
|
||||
textColor: eventColor,
|
||||
backgroundColor: "black"
|
||||
@@ -345,6 +356,23 @@ export const useDataStore = defineStore('data', () => {
|
||||
]
|
||||
})
|
||||
|
||||
const getCostCentresComposed = computed(() => {
|
||||
return [
|
||||
...vehicles.value.map(vehicle => {
|
||||
return {
|
||||
label: "Fahrzeug - " + vehicle.licensePlate,
|
||||
id: vehicle.id
|
||||
}
|
||||
}),
|
||||
...projects.value.map(project => {
|
||||
return {
|
||||
label: "Projekt - " + project.name,
|
||||
id: project.id
|
||||
}
|
||||
})
|
||||
]
|
||||
})
|
||||
|
||||
|
||||
//Get Item By Id
|
||||
const getProductById = computed(() => (itemId:string) => {
|
||||
@@ -355,8 +383,8 @@ export const useDataStore = defineStore('data', () => {
|
||||
return vendors.value.find(item => item.id === itemId)
|
||||
})
|
||||
|
||||
const getVendorInvoiceById = computed(() => (itemId:string) => {
|
||||
return vendorInvoices.value.find(item => item.id === itemId)
|
||||
const getIncomingInvoiceById = computed(() => (itemId:string) => {
|
||||
return incomingInvoices.value.find(item => item.id === itemId)
|
||||
})
|
||||
|
||||
const getContractById = computed(() => (itemId:string) => {
|
||||
@@ -443,7 +471,7 @@ export const useDataStore = defineStore('data', () => {
|
||||
contacts,
|
||||
vehicles,
|
||||
vendors,
|
||||
vendorInvoices,
|
||||
incomingInvoices,
|
||||
bankAccounts,
|
||||
bankStatements,
|
||||
historyItems,
|
||||
@@ -476,7 +504,7 @@ export const useDataStore = defineStore('data', () => {
|
||||
fetchTimes,
|
||||
fetchHistoryItems,
|
||||
fetchVendors,
|
||||
fetchVendorInvoices,
|
||||
fetchIncomingInvoices,
|
||||
fetchNumberRanges,
|
||||
fetchNotifications,
|
||||
fetchDocuments,
|
||||
@@ -495,14 +523,17 @@ export const useDataStore = defineStore('data', () => {
|
||||
getStockByProductId,
|
||||
getHistoryItemsByCustomer,
|
||||
getHistoryItemsByVendor,
|
||||
getIncomingInvoicesByVehicleId,
|
||||
getEventTypes,
|
||||
getTimeTypes,
|
||||
getDocumentTags,
|
||||
getMeasures,
|
||||
getResources,
|
||||
getEvents,
|
||||
getCostCentresComposed,
|
||||
getProductById,
|
||||
getVendorById,
|
||||
getVendorInvoiceById,
|
||||
getIncomingInvoiceById,
|
||||
getContractById,
|
||||
getContactById,
|
||||
getVehicleById,
|
||||
|
||||
97
test/oauth/test.mjs
Normal file
97
test/oauth/test.mjs
Normal file
@@ -0,0 +1,97 @@
|
||||
import express from "express"
|
||||
|
||||
let app = express()
|
||||
|
||||
import pkceChallenge from 'pkce-challenge'
|
||||
import querystring from 'querystring'
|
||||
import axios from "axios";
|
||||
|
||||
|
||||
|
||||
|
||||
import {v4 as uuidv4} from 'uuid'
|
||||
|
||||
/*let ClientOAuth2 = require('client-oauth2')
|
||||
|
||||
let datevAuth = new ClientOAuth2({
|
||||
clientId: '890ea22ce51666232e55c8ac3d73f51a',
|
||||
clientSecret: 'eaef5362ce153551ef0f3d5e061ab7da',
|
||||
accessTokenUri: 'https://sandbox-api.datev.de/token',
|
||||
authorizationUri: 'https://login.datev.de/openidsandbox/authorize',
|
||||
redirectUri: 'http://localhost:3001/auth/datev/callback',
|
||||
scopes: ['accounting:clients:read', 'accounting:documents ', 'openid'],
|
||||
state:"0123456789012345678901234567890123456789"
|
||||
})*/
|
||||
|
||||
const auth_token_endpoint = "https://login.datev.de/openidsandbox/authorize"
|
||||
const query_params = {
|
||||
client_id: "890ea22ce51666232e55c8ac3d73f51a",
|
||||
redirect_uri: "http://localhost/"
|
||||
}
|
||||
const scopes = ["openid", "profile", "email"]
|
||||
|
||||
const requests = []
|
||||
|
||||
|
||||
|
||||
app.get('/auth/datev', async function (req, res) {
|
||||
//var uri = datevAuth.code.getUri()
|
||||
let challengePKCE = await pkceChallenge()
|
||||
|
||||
let request = {
|
||||
state: uuidv4(),
|
||||
code_challenge: challengePKCE.code_challenge,
|
||||
code_verifier: challengePKCE.code_verifier
|
||||
}
|
||||
|
||||
requests.push(request)
|
||||
|
||||
|
||||
const auth_token_params = {
|
||||
...query_params,
|
||||
response_type: "code id_token",
|
||||
state: request.state,
|
||||
nonce: "0123456789012345678901234567890123456789",
|
||||
response_mode: "query",
|
||||
code_challenge: request.code_challenge,
|
||||
code_challenge_method: "S256"
|
||||
}
|
||||
|
||||
const getAuthTokenUrl = `${auth_token_endpoint}?${querystring.stringify(auth_token_params)}&scope=${scopes.join(' ')}`
|
||||
|
||||
res.redirect(getAuthTokenUrl)
|
||||
})
|
||||
|
||||
app.get('/', async function (req, res) {
|
||||
|
||||
let request = requests.find(r => r.state === req.query.state)
|
||||
|
||||
console.log(req.query)
|
||||
console.log(request)
|
||||
const accessTokenEndpoint = "https://sandbox-api.datev.de/token"
|
||||
|
||||
const access_token_params = {
|
||||
...query_params,
|
||||
client_secret: "eaef5362ce153551ef0f3d5e061ab7da",
|
||||
code: req.query.code,
|
||||
grant_type: "authorization_code",
|
||||
code_verifier: request.code_verifier
|
||||
}
|
||||
|
||||
|
||||
axios({
|
||||
method: "post",
|
||||
url: `${accessTokenEndpoint}?${querystring.stringify(access_token_params)}`,
|
||||
headers: {
|
||||
"Authorization": `Basic ${btoa(access_token_params.client_id + ":" + access_token_params.client_secret)}`
|
||||
}
|
||||
})
|
||||
|
||||
console.log(error)
|
||||
console.log(data)
|
||||
|
||||
|
||||
res.send("ok")
|
||||
})
|
||||
|
||||
app.listen(80)
|
||||
Reference in New Issue
Block a user