Added Vehicles
Added Bankimport, BankAccounts, BankStatements Some Visual Changes Added Contacts Changes in VendorInvoices Added layouts with default an one for Login PAge Added Input Group Component
This commit is contained in:
@@ -1,18 +0,0 @@
|
||||
<script setup>
|
||||
const route = useRoute()
|
||||
const supabase = useSupabaseClient()
|
||||
console.log(route.params.account)
|
||||
|
||||
const accounts = (await supabase.from("bankAccounts").select()).data
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@@ -1,103 +1,88 @@
|
||||
<script setup>
|
||||
import Papa from 'papaparse'
|
||||
|
||||
const supabase = useSupabaseClient()
|
||||
|
||||
const accounts = (supabase.from("bankAccounts").select()).data
|
||||
|
||||
let items = ref([])
|
||||
async function readSingleFile(evt) {
|
||||
var f = document.getElementById('fileInput').files[0];
|
||||
if (f) {
|
||||
let results = []
|
||||
let text = await f.text()
|
||||
results = Papa.parse(text).data
|
||||
console.log(results[0])
|
||||
results = results.slice(1)
|
||||
results = results.map(temp => {
|
||||
return {
|
||||
iban: temp[1],
|
||||
bank: temp[3],
|
||||
date: temp[4],
|
||||
partnerName: temp[6],
|
||||
partnerIban: temp[7],
|
||||
type: temp[9],
|
||||
text: temp[10],
|
||||
value: temp[11],
|
||||
currency: temp[12]
|
||||
}
|
||||
})
|
||||
|
||||
console.log(results)
|
||||
items.value = results
|
||||
|
||||
parseStatements()
|
||||
|
||||
} else {
|
||||
alert("Failed to load file");
|
||||
}
|
||||
}
|
||||
|
||||
const newStatements = ref([])
|
||||
|
||||
const parseStatements = async () => {
|
||||
items.value.forEach(item => {
|
||||
if(item.date) {
|
||||
let returnObj = {
|
||||
date: item.date,
|
||||
partnerIban: item.partnerIban,
|
||||
partnerName: item.partnerName,
|
||||
text: item.text,
|
||||
value: Number(item.value.replace(",",".")),
|
||||
|
||||
}
|
||||
|
||||
newStatements.value.push(returnObj)
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
const {data,error} = await supabase
|
||||
.from("bankStatements")
|
||||
.insert(newStatements.value)
|
||||
.select()
|
||||
|
||||
console.log(data)
|
||||
console.log(error)
|
||||
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<UInput
|
||||
type="file"
|
||||
id="fileInput"
|
||||
/>
|
||||
<UButton
|
||||
@click="readSingleFile"
|
||||
>Test</UButton>
|
||||
<div id="main">
|
||||
<!-- TODO: Kontakte erstellen und dem Kunden zuweisen -->
|
||||
|
||||
<table>
|
||||
<tr
|
||||
v-for="temp in items"
|
||||
<!--<InputGroup>
|
||||
<UButton @click="router.push(`/banking/accounts/create/`)">+ Kontakt</UButton>
|
||||
|
||||
<UInput
|
||||
v-model="searchString"
|
||||
placeholder="Suche..."
|
||||
/>
|
||||
</InputGroup>-->
|
||||
|
||||
|
||||
|
||||
<UTable
|
||||
:rows="filteredRows"
|
||||
:columns="itemColumns"
|
||||
@select="selectItem"
|
||||
:empty-state="{ icon: 'i-heroicons-circle-stack-20-solid', label: 'Noch keine Einträge' }"
|
||||
>
|
||||
<td>{{temp.date}}</td>
|
||||
<td>{{temp.partnerName}}</td>
|
||||
<td>{{temp.text}}</td>
|
||||
<td>{{temp.value}}</td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
</UTable>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
|
||||
definePageMeta({
|
||||
middleware: "auth"
|
||||
})
|
||||
|
||||
|
||||
const router = useRouter()
|
||||
const {bankAccounts} = storeToRefs(useDataStore())
|
||||
const mode = ref("show")
|
||||
|
||||
const itemColumns = [
|
||||
|
||||
{
|
||||
key: "name",
|
||||
label: "Name",
|
||||
sortable: true
|
||||
},
|
||||
{
|
||||
key: "iban",
|
||||
label: "IBAN",
|
||||
sortable: true
|
||||
},
|
||||
{
|
||||
key: "bankId",
|
||||
label: "Bank",
|
||||
sortable: true
|
||||
},
|
||||
{
|
||||
key: "ownerName",
|
||||
label: "Besitzer",
|
||||
sortable: true
|
||||
}
|
||||
]
|
||||
|
||||
|
||||
const selectItem = (item) => {
|
||||
router.push(`/banking/statements/${item.id} `)
|
||||
}
|
||||
|
||||
|
||||
const searchString = ref('')
|
||||
|
||||
const filteredRows = computed(() => {
|
||||
bankAccounts.value = bankAccounts.value.filter(account => account.used)
|
||||
|
||||
if(!searchString.value) {
|
||||
return bankAccounts.value
|
||||
}
|
||||
|
||||
return bankAccounts.value.filter(item => {
|
||||
return Object.values(item).some((value) => {
|
||||
return String(value).toLowerCase().includes(searchString.value.toLowerCase())
|
||||
})
|
||||
})
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
142
spaces/pages/banking/statements/[[accountId]].vue
Normal file
142
spaces/pages/banking/statements/[[accountId]].vue
Normal file
@@ -0,0 +1,142 @@
|
||||
<script setup>
|
||||
import * as dayjs from "dayjs";
|
||||
|
||||
definePageMeta({
|
||||
middleware: "auth"
|
||||
})
|
||||
|
||||
const route = useRoute()
|
||||
const supabase = useSupabaseClient()
|
||||
|
||||
const {bankStatements,bankAccounts} = storeToRefs(useDataStore())
|
||||
|
||||
const searchString = ref("")
|
||||
const showAssigned = ref(false)
|
||||
const selectedAccount = ref(0)
|
||||
|
||||
const filteredRows = computed(() => {
|
||||
let statements = bankStatements.value
|
||||
|
||||
if(!showAssigned.value) {
|
||||
statements = statements.filter(statement => !(statement.customerInvoice || statement.vendorInvoice))
|
||||
}
|
||||
|
||||
if(selectedAccount.value !== 0) {
|
||||
statements = statements.filter(statement => statement.account === selectedAccount.value)
|
||||
}
|
||||
|
||||
if(searchString.value.length > 0) {
|
||||
return statements.value.filter(item => {
|
||||
return Object.values(item).some((value) => {
|
||||
return String(value).toLowerCase().includes(searchString.value.toLowerCase())
|
||||
})
|
||||
})
|
||||
} else {
|
||||
return statements
|
||||
}
|
||||
|
||||
|
||||
|
||||
})
|
||||
|
||||
|
||||
|
||||
const showStatementSlideover = ref(false)
|
||||
const selectedStatement = ref({})
|
||||
|
||||
const selectStatement = (statement) => {
|
||||
selectedStatement.value = statement
|
||||
showStatementSlideover.value = true
|
||||
}
|
||||
|
||||
const statementColumns = [
|
||||
{
|
||||
key:"amount",
|
||||
label: "Betrag"
|
||||
},
|
||||
{
|
||||
key:"date",
|
||||
label: "Datum",
|
||||
sortable: true
|
||||
},
|
||||
{
|
||||
key: "credName",
|
||||
label: "Empfänger"
|
||||
},
|
||||
{
|
||||
key: "debName",
|
||||
label: "Sender"
|
||||
},
|
||||
{
|
||||
key: "text",
|
||||
label: "Verwendungszweck"
|
||||
},
|
||||
]
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<USlideover
|
||||
v-model="showStatementSlideover"
|
||||
>
|
||||
<UCard class="flex flex-col flex-1" :ui="{ body: { base: 'flex-1' }, ring: '', divide: 'divide-y divide-gray-100 dark:divide-gray-800' }">
|
||||
|
||||
|
||||
|
||||
|
||||
<DevOnly>
|
||||
{{selectedStatement}}
|
||||
</DevOnly>
|
||||
</UCard>
|
||||
|
||||
</USlideover>
|
||||
|
||||
<InputGroup gap="2">
|
||||
<UInput
|
||||
v-model="searchString"
|
||||
placeholder="Suche..."
|
||||
/>
|
||||
<USelectMenu
|
||||
:options="bankAccounts.filter(account => account.used)"
|
||||
v-model="selectedAccount"
|
||||
option-attribute="iban"
|
||||
value-attribute="id"
|
||||
>
|
||||
<template #label>
|
||||
{{bankAccounts.find(account => account.id === selectedAccount) ? bankAccounts.find(account => account.id === selectedAccount).iban : "Kontoauswählen"}}
|
||||
</template>
|
||||
</USelectMenu>
|
||||
<UCheckbox
|
||||
v-model="showAssigned"
|
||||
label="Zugeordnete Anzeigen"
|
||||
/>
|
||||
</InputGroup>
|
||||
|
||||
<UTable
|
||||
:rows="bankStatements"
|
||||
:columns="statementColumns"
|
||||
@select="selectStatement"
|
||||
>
|
||||
<template #amount-data="{row}">
|
||||
<span
|
||||
v-if="row.amount >= 0"
|
||||
class="text-primary-500"
|
||||
>
|
||||
{{row.amount.toFixed(2) + " €"}}
|
||||
</span>
|
||||
<span
|
||||
v-if="row.amount < 0"
|
||||
class="text-rose-600"
|
||||
>
|
||||
{{row.amount.toFixed(2) + " €"}}
|
||||
</span>
|
||||
</template>
|
||||
<template #date-data="{row}">
|
||||
{{dayjs(row.date).format("DD.MM.YY")}}
|
||||
</template>
|
||||
</UTable>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
Reference in New Issue
Block a user