73 lines
1.3 KiB
Vue
73 lines
1.3 KiB
Vue
<template>
|
|
<div id="main">
|
|
<div id="left">
|
|
|
|
<router-link to="/vendorinvoices/edit"><UButton>+ Lieferantenrechnung</UButton></router-link>
|
|
|
|
|
|
|
|
<a v-for="item in dataStore.getVendorInvoiceList" @click="selectItem(item)">
|
|
<UCard class="listItem">
|
|
<UBadge>{{item.id}}</UBadge> {{item.date}}
|
|
</UCard>
|
|
</a>
|
|
|
|
|
|
|
|
</div>
|
|
<div id="right">
|
|
|
|
<UCard v-if="selectedItem.id">
|
|
<template #header>
|
|
<UBadge>{{selectedItem.id}}</UBadge> {{selectedItem.name}}
|
|
</template>
|
|
<UTable :rows="selectedItem.lineItems"></UTable>
|
|
{{selectedItem}}
|
|
|
|
|
|
</UCard>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
|
|
import {useDataStore} from "../../store/data";
|
|
import {storeToRefs} from "pinia"
|
|
|
|
|
|
const showCreateProject = ref(false)
|
|
const showCreateCustomer = ref(false)
|
|
const projectData = ref({})
|
|
|
|
|
|
const dataStore = useDataStore()
|
|
|
|
const {projects} = storeToRefs(dataStore)
|
|
const {addCustomer} = dataStore
|
|
const {addProject} = dataStore
|
|
let selectedItem = ref({})
|
|
|
|
const selectItem = (item) => {
|
|
selectedItem.value = item
|
|
console.log(item)
|
|
}
|
|
|
|
</script>
|
|
|
|
<style scoped>
|
|
#main {
|
|
display: flex;
|
|
flex-direction: row;
|
|
}
|
|
#left {
|
|
width: 25vw;
|
|
}
|
|
|
|
#right {
|
|
width: 60vw;
|
|
padding-left: 3vw;
|
|
}
|
|
|
|
|
|
</style> |