132 lines
2.8 KiB
Vue
132 lines
2.8 KiB
Vue
<script setup>
|
|
|
|
const route = useRoute()
|
|
const router = useRouter()
|
|
const dataStore = useDataStore()
|
|
|
|
|
|
const itemInfo = ref({
|
|
resources: []
|
|
})
|
|
|
|
const mapResources = () => {
|
|
itemInfo.value.resources.map(resource => {
|
|
|
|
|
|
return {
|
|
id: resource.id,
|
|
type: resource.type
|
|
}
|
|
|
|
|
|
})
|
|
}
|
|
|
|
|
|
const setupPage = () => {
|
|
if(route.query.start) itemInfo.value.start = route.query.start.replace(" ", "+")
|
|
if(route.query.end) itemInfo.value.end = route.query.end.replace(" ", "+")
|
|
if(route.query.resources) itemInfo.value.resources = JSON.parse(route.query.resources)
|
|
if(route.query.project) itemInfo.value.project = route.query.project
|
|
}
|
|
|
|
setupPage()
|
|
</script>
|
|
|
|
<template>
|
|
<UDashboardNavbar title="Neuen Termin erstellen">
|
|
<template #right>
|
|
<UButton
|
|
color="rose"
|
|
@click="router.push(`/calendar/${route.query.source}`)"
|
|
>
|
|
Abbrechen
|
|
</UButton>
|
|
|
|
<UButton
|
|
@click="dataStore.createNewItem('events',itemInfo)"
|
|
>
|
|
Erstellen
|
|
</UButton>
|
|
</template>
|
|
</UDashboardNavbar>
|
|
<!-- <UDashboardToolbar>
|
|
|
|
</UDashboardToolbar>-->
|
|
|
|
<UForm class="p-5">
|
|
<UFormGroup
|
|
label="Resource:"
|
|
>
|
|
<USelectMenu
|
|
v-model="itemInfo.resources"
|
|
:options="dataStore.getResourcesList"
|
|
option-attribute="title"
|
|
value-attribute="id"
|
|
multiple
|
|
onChange="mapResources"
|
|
>
|
|
<template #label>
|
|
<span v-if="itemInfo.resources.length == 0">Keine Ressourcen ausgewählt</span>
|
|
<span v-else >{{ itemInfo.resources.length }} ausgewählt</span>
|
|
</template>
|
|
</USelectMenu>
|
|
{{dataStore.getResourcesList}}
|
|
</UFormGroup>
|
|
<UFormGroup
|
|
label="Titel:"
|
|
>
|
|
<UInput
|
|
v-model="itemInfo.title"
|
|
/>
|
|
</UFormGroup>
|
|
<UFormGroup
|
|
label="Projekt:"
|
|
>
|
|
<USelectMenu
|
|
v-model="itemInfo.project"
|
|
:options="dataStore.projects"
|
|
option-attribute="name"
|
|
value-attribute="id"
|
|
searchable
|
|
searchable-placeholder="Suche..."
|
|
:search-attributes="['name']"
|
|
>
|
|
<template #label>
|
|
{{dataStore.getProjectById(itemInfo.project) ? dataStore.getProjectById(itemInfo.project).name : "Kein Projekt ausgewählt"}}
|
|
</template>
|
|
|
|
</USelectMenu>
|
|
</UFormGroup>
|
|
<UFormGroup
|
|
label="Typ:"
|
|
>
|
|
<USelectMenu
|
|
v-model="itemInfo.type"
|
|
:options="dataStore.getEventTypes"
|
|
option-attribute="label"
|
|
value-attribute="label"
|
|
>
|
|
|
|
</USelectMenu>
|
|
</UFormGroup>
|
|
<UFormGroup
|
|
label="Start:"
|
|
>
|
|
<UInput
|
|
v-model="itemInfo.start"
|
|
/>
|
|
</UFormGroup>
|
|
<UFormGroup
|
|
label="Ende:"
|
|
>
|
|
<UInput
|
|
v-model="itemInfo.end"
|
|
/>
|
|
</UFormGroup>
|
|
</UForm>
|
|
</template>
|
|
|
|
<style scoped>
|
|
|
|
</style> |