117 lines
2.2 KiB
Vue
117 lines
2.2 KiB
Vue
<script setup>
|
|
import dayjs from "dayjs";
|
|
const supabase = useSupabaseClient()
|
|
const route = useRoute()
|
|
const router = useRouter()
|
|
const profileStore = useProfileStore()
|
|
|
|
|
|
const props = defineProps({
|
|
queryStringData: {
|
|
type: String
|
|
},
|
|
item: {
|
|
type: Object,
|
|
required: true
|
|
},
|
|
topLevelType: {
|
|
type: String,
|
|
required: true
|
|
},
|
|
platform: {
|
|
type: String,
|
|
required: true
|
|
}
|
|
})
|
|
|
|
|
|
const setup = async () => {
|
|
|
|
}
|
|
|
|
setup()
|
|
|
|
const columns = [
|
|
{
|
|
key:"state",
|
|
label: "Status",
|
|
},
|
|
{
|
|
key: "user",
|
|
label: "Benutzer",
|
|
},
|
|
{
|
|
key:"startDate",
|
|
label:"Start",
|
|
},
|
|
{
|
|
key: "endDate",
|
|
label: "Ende",
|
|
},
|
|
{
|
|
key: "duration",
|
|
label: "Dauer",
|
|
},
|
|
{
|
|
key:"type",
|
|
label:"Typ",
|
|
},
|
|
{
|
|
key: "project",
|
|
label: "Projekt",
|
|
},
|
|
{
|
|
key: "notes",
|
|
label: "Notizen",
|
|
}
|
|
]
|
|
|
|
</script>
|
|
|
|
<template>
|
|
<UCard class="mt-5">
|
|
<UTable
|
|
class="mt-3"
|
|
:columns="columns"
|
|
:rows="props.item.times"
|
|
:empty-state="{ icon: 'i-heroicons-circle-stack-20-solid', label: 'Noch keine Einträge' }"
|
|
>
|
|
<template #state-data="{row}">
|
|
<span
|
|
v-if="row.state === 'Entwurf'"
|
|
class="text-rose-500"
|
|
>{{row.state}}</span>
|
|
<span
|
|
v-if="row.state === 'Eingereicht'"
|
|
class="text-cyan-500"
|
|
>{{row.state}}</span>
|
|
<span
|
|
v-if="row.state === 'Bestätigt'"
|
|
class="text-primary-500"
|
|
>{{row.state}}</span>
|
|
</template>
|
|
<template #user-data="{row}">
|
|
{{row.profile ? row.profile.fullName : "" }}
|
|
</template>
|
|
|
|
<template #startDate-data="{row}">
|
|
{{dayjs(row.startDate).format("DD.MM.YY HH:mm")}}
|
|
</template>
|
|
<template #endDate-data="{row}">
|
|
{{dayjs(row.endDate).format("DD.MM.YY HH:mm")}}
|
|
</template>
|
|
<template #duration-data="{row}">
|
|
{{Math.floor(dayjs(row.endDate).diff(row.startDate, "minutes")/60)}}:{{String(dayjs(row.endDate).diff(row.startDate, "minutes") % 60).padStart(2,"0")}} h
|
|
|
|
</template>
|
|
<template #project-data="{row}">
|
|
{{row.project ? row.project.name : "" }}
|
|
</template>
|
|
</UTable>
|
|
</UCard>
|
|
|
|
</template>
|
|
|
|
<style scoped>
|
|
|
|
</style> |