187 lines
4.7 KiB
Vue
187 lines
4.7 KiB
Vue
<script setup>
|
||
import {NDataTable, NFlex, NText, NDatePicker} from 'naive-ui'
|
||
import AppLayout from "../../Layouts/AppLayout.vue";
|
||
import {h, ref} from "vue";
|
||
import DatePickerQuery from "../../Components/DatePickerQuery.vue";
|
||
import {Link, usePage} from "@inertiajs/vue3";
|
||
|
||
const props = defineProps({
|
||
data: {
|
||
type: Object,
|
||
default: []
|
||
},
|
||
isHeadOrAdmin: {
|
||
type: Boolean
|
||
},
|
||
date: {
|
||
type: [Number, Array]
|
||
},
|
||
isOneDay: {
|
||
type: Boolean
|
||
}
|
||
})
|
||
|
||
const columns = ref([
|
||
{
|
||
title: 'Отделение',
|
||
key: 'department',
|
||
width: 240,
|
||
titleAlign: 'center',
|
||
colSpan: (row) => row.colspan,
|
||
render(row) {
|
||
if (row.isGroupHeader) {
|
||
return h(NFlex, {
|
||
align: "center",
|
||
justify: "center"
|
||
}, h(NText, { style: 'font-weight: 600;' }, row.groupName))
|
||
}
|
||
|
||
// Получаем текущие query параметры
|
||
const { url } = usePage()
|
||
const currentUrl = new URL(url, window.location.origin)
|
||
const searchParams = currentUrl.searchParams
|
||
|
||
// Берем startAt и endAt из текущего URL
|
||
const startAt = searchParams.get('startAt')
|
||
const endAt = searchParams.get('endAt')
|
||
|
||
const linkData = {}
|
||
|
||
if (startAt)
|
||
linkData.startAt = startAt
|
||
if (endAt)
|
||
linkData.endAt = endAt
|
||
|
||
return h(Link, {
|
||
href: `/report`,
|
||
data: linkData,
|
||
class: 'underline decoration-dashed'
|
||
}, row.department)
|
||
}
|
||
},
|
||
{
|
||
title: 'Кол-во коек',
|
||
key: 'beds',
|
||
width: 60,
|
||
titleAlign: 'center',
|
||
align: 'center'
|
||
},
|
||
{
|
||
title: 'Поступило',
|
||
key: 'recipients',
|
||
titleAlign: 'center',
|
||
children: [
|
||
{
|
||
title: 'Всего',
|
||
key: 'recipients.all',
|
||
width: 60,
|
||
titleAlign: 'center',
|
||
align: 'center'
|
||
},
|
||
{
|
||
title: 'План',
|
||
key: 'recipients.plan',
|
||
width: 60,
|
||
titleAlign: 'center',
|
||
align: 'center'
|
||
},
|
||
{
|
||
title: 'Экстр',
|
||
key: 'recipients.emergency',
|
||
width: 60,
|
||
titleAlign: 'center',
|
||
align: 'center'
|
||
},
|
||
{
|
||
title: 'Перевод',
|
||
key: 'recipients.transferred',
|
||
width: 84,
|
||
titleAlign: 'center',
|
||
align: 'center'
|
||
},
|
||
]
|
||
},
|
||
{
|
||
title: 'Выбыло',
|
||
key: 'outcome',
|
||
width: 84,
|
||
titleAlign: 'center',
|
||
align: 'center'
|
||
},
|
||
{
|
||
title: 'Состоит',
|
||
key: 'consist',
|
||
width: 84,
|
||
titleAlign: 'center',
|
||
align: 'center'
|
||
},
|
||
{
|
||
title: '% загруженности',
|
||
key: 'percentLoadedBeds',
|
||
width: 84,
|
||
titleAlign: 'center',
|
||
align: 'center'
|
||
},
|
||
{
|
||
title: 'Операции',
|
||
key: 'surgical',
|
||
titleAlign: 'center',
|
||
children: [
|
||
{
|
||
title: 'Э',
|
||
key: 'surgical.emergency',
|
||
width: 60,
|
||
titleAlign: 'center',
|
||
align: 'center'
|
||
},
|
||
{
|
||
title: 'П',
|
||
key: 'surgical.plan',
|
||
width: 60,
|
||
titleAlign: 'center',
|
||
align: 'center'
|
||
},
|
||
]
|
||
},
|
||
{
|
||
title: 'Умерло',
|
||
key: 'deceased',
|
||
width: 84,
|
||
titleAlign: 'center',
|
||
align: 'center'
|
||
},
|
||
])
|
||
|
||
const rowProps = (row) => {
|
||
if (row.isGroupHeader) return {
|
||
style: `--n-merged-td-color: var(--n-merged-th-color)`
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<template>
|
||
<AppLayout>
|
||
<template #headerExtra>
|
||
<DatePickerQuery :is-head-or-admin="isHeadOrAdmin" :date="date" :is-one-day="isOneDay" />
|
||
</template>
|
||
<NDataTable :columns="columns"
|
||
:data="data"
|
||
size="small"
|
||
:single-line="false"
|
||
striped
|
||
min-height="calc(100vh - 48px - 70px)"
|
||
max-height="calc(100vh - 48px - 70px)"
|
||
:row-props="rowProps"
|
||
>
|
||
|
||
</NDataTable>
|
||
</AppLayout>
|
||
</template>
|
||
|
||
<style scoped>
|
||
:deep(.n-data-table-th),
|
||
:deep(.n-data-table-td) {
|
||
font-size: var(--n-font-size);
|
||
}
|
||
</style>
|