140 lines
2.9 KiB
Vue
140 lines
2.9 KiB
Vue
<template>
|
|
<div id="main">
|
|
<div id="left">
|
|
<!-- TODO: Projekt Auflistung überarbeiten, Rechte Seite wird nicht genutzt -->
|
|
<UButton @click="showCreateProject = true">+ Projekt</UButton>
|
|
<UModal v-model="showCreateProject">
|
|
<UCard>
|
|
<template #header>
|
|
Projekt erstellen
|
|
</template>
|
|
|
|
<UFormGroup
|
|
label="Name:"
|
|
>
|
|
<UInput
|
|
v-model="createProjectData.name"
|
|
/>
|
|
</UFormGroup>
|
|
<UFormGroup
|
|
label="Kunde:"
|
|
>
|
|
<USelectMenu
|
|
v-model="createProjectData.customer"
|
|
:options="customers"
|
|
option-attribute="name"
|
|
value-attribute="id"
|
|
searchable
|
|
:search-attributes="['name']"
|
|
/>
|
|
</UFormGroup>
|
|
<UFormGroup
|
|
label="Notizen:"
|
|
>
|
|
<UTextarea
|
|
v-model="createProjectData.notes"
|
|
/>
|
|
</UFormGroup>
|
|
|
|
<template #footer>
|
|
<UButton
|
|
@click="createProject"
|
|
>
|
|
Erstellen
|
|
</UButton>
|
|
</template>
|
|
</UCard>
|
|
</UModal>
|
|
|
|
<router-link v-for="item in projects" :to="`/projects/${item.id}`">
|
|
<UCard class="listItem">
|
|
<UBadge>{{item.id}}</UBadge> {{item.name}}
|
|
</UCard>
|
|
</router-link>
|
|
|
|
|
|
</div>
|
|
<div id="right">
|
|
{{selectedItem}}
|
|
<UCard v-if="selectedItem.id">
|
|
<template #header>
|
|
<UBadge>{{selectedItem.id}}</UBadge> {{selectedItem.name}}
|
|
</template>
|
|
|
|
Kunde:<br>
|
|
{{selectedItem.customer.data.name}}<br>
|
|
|
|
Notizen: <br>
|
|
{{selectedItem.notes}}
|
|
|
|
<!-- Lieferantenrechnungen: <br>
|
|
<UTable :rows="dataStore.getVendorInvoicesByProjectId(selectedItem.id)"></UTable>
|
|
{{dataStore.getVendorInvoicesByProjectId(selectedItem.id)}}-->
|
|
|
|
|
|
|
|
|
|
</UCard>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
<script setup>
|
|
|
|
definePageMeta({
|
|
middleware: "auth"
|
|
})
|
|
|
|
const supabase = useSupabaseClient()
|
|
|
|
const {projects,customers} = storeToRefs(useDataStore())
|
|
const {fetchProjects} = useDataStore()
|
|
|
|
//const projects = (await supabase.from("projects").select()).data
|
|
//const customers = (await supabase.from("customers").select()).data
|
|
|
|
const showCreateProject = ref(false)
|
|
const createProjectData = ref({
|
|
phases: []
|
|
})
|
|
|
|
let selectedItem = ref({})
|
|
|
|
const selectItem = (item) => {
|
|
selectedItem.value = item
|
|
console.log(item)
|
|
}
|
|
|
|
const createProject = async () => {
|
|
const {data,error} = await supabase
|
|
.from("projects")
|
|
.insert([createProjectData.value])
|
|
.select()
|
|
|
|
if(error) console.log(error)
|
|
|
|
showCreateProject.value = false
|
|
createProjectData.value = {phases: []}
|
|
fetchProjects()
|
|
|
|
|
|
}
|
|
|
|
</script>
|
|
|
|
<style scoped>
|
|
#main {
|
|
display: flex;
|
|
flex-direction: row;
|
|
}
|
|
#left {
|
|
width: 25vw;
|
|
}
|
|
|
|
#right {
|
|
width: 60vw;
|
|
padding-left: 3vw;
|
|
}
|
|
</style> |