Files
FEDEO/spaces/pages/absenceRequests/index.vue

84 lines
1.6 KiB
Vue

<template>
<div id="main">
<UButton @click="router.push(`/employees/absenceRequests/create/`)">+ Abwesenheit</UButton>
<UTable
:rows="dataStore.absenceRequests"
:columns="columns"
@select="selectItem"
:empty-state="{ icon: 'i-heroicons-circle-stack-20-solid', label: 'Noch keine Einträge' }"
>
<template #approved-data="{row}">
<span v-if="!row.approved">
Genehmigung offen
</span>
<span
v-else-if="row.approved"
class="text-primary"
>
Genemigt
</span>
<span
v-else
class="text-rose"
>
Abgelehnt
</span>
</template>
<template #user-data="{row}">
{{dataStore.profiles.find(profile => profile.id === row.user) ? dataStore.profiles.find(profile => profile.id === row.user).fullName : ""}}
</template>
</UTable>
</div>
</template>
<script setup>
definePageMeta({
middleware: "auth"
})
const dataStore = useDataStore()
const router = useRouter()
const mode = ref("show")
const columns = [
{
key: "approved",
label: "Genehmigt",
sortable: true
},
{
key: "user",
label: "Mitarbeiter",
sortable: true
},{
key: "reason",
label: "Grund",
sortable: true
},{
key: "start",
label: "Start",
sortable: true
},{
key: "end",
label: "Ende",
sortable: true
},{
key: "note",
label: "Notizen",
sortable: true
}
]
const selectItem = (item) => {
router.push(`/employees/absenceRequests/show/${item.id} `)
}
</script>
<style scoped>
</style>