118 lines
2.5 KiB
Vue
118 lines
2.5 KiB
Vue
<script setup>
|
|
import dayjs from "dayjs";
|
|
|
|
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="normalizeTableColumns(columns)"
|
|
:data="props.item.times"
|
|
>
|
|
<template #empty>
|
|
<div class="flex flex-col items-center justify-center py-8 text-center text-sm text-muted">
|
|
<UIcon name="i-heroicons-circle-stack-20-solid" class="mb-2 size-5" />
|
|
<span>Noch keine Einträge</span>
|
|
</div>
|
|
</template>
|
|
<template #state-cell="{ row }">
|
|
<span
|
|
v-if="row.original.state === 'Entwurf'"
|
|
class="text-error-500"
|
|
>{{ row.original.state }}</span>
|
|
<span
|
|
v-if="row.original.state === 'Eingereicht'"
|
|
class="text-cyan-500"
|
|
>{{ row.original.state }}</span>
|
|
<span
|
|
v-if="row.original.state === 'Bestätigt'"
|
|
class="text-primary-500"
|
|
>{{ row.original.state }}</span>
|
|
</template>
|
|
<template #user-cell="{ row }">
|
|
{{ row.original.profile ? row.original.profile.fullName : "" }}
|
|
</template>
|
|
|
|
<template #startDate-cell="{ row }">
|
|
{{ dayjs(row.original.startDate).format("DD.MM.YY HH:mm") }}
|
|
</template>
|
|
<template #endDate-cell="{ row }">
|
|
{{ dayjs(row.original.endDate).format("DD.MM.YY HH:mm") }}
|
|
</template>
|
|
<template #duration-cell="{ row }">
|
|
{{ Math.floor(dayjs(row.original.endDate).diff(row.original.startDate, "minutes") / 60) }}:{{ String(dayjs(row.original.endDate).diff(row.original.startDate, "minutes") % 60).padStart(2,"0") }} h
|
|
|
|
</template>
|
|
<template #project-cell="{ row }">
|
|
{{ row.original.project ? row.original.project.name : "" }}
|
|
</template>
|
|
</UTable>
|
|
</UCard>
|
|
|
|
</template>
|
|
|
|
<style scoped>
|
|
|
|
</style>
|