174 lines
4.5 KiB
Vue
174 lines
4.5 KiB
Vue
<script setup>
|
|
import {
|
|
NModal,
|
|
NList,
|
|
NListItem,
|
|
NThing,
|
|
NAvatar,
|
|
NIcon,
|
|
NText,
|
|
NDivider,
|
|
NFlex,
|
|
NButton,
|
|
NScrollbar,
|
|
NEmpty,
|
|
NDataTable,
|
|
NBadge,
|
|
NForm,
|
|
NDrawerContent,
|
|
NInput,
|
|
NSpin,
|
|
NDrawer
|
|
} from 'naive-ui'
|
|
import {useReportStore} from "../../../Stores/report.js";
|
|
import {TbAlertCircle, TbCheck, TbEye, TbGripVertical, TbPencil, TbTrashX, TbX} from 'vue-icons-plus/tb'
|
|
import {computed, h, ref, watch} from "vue";
|
|
|
|
const props = defineProps({
|
|
departmentId: {
|
|
required: true
|
|
},
|
|
startAt: {
|
|
required: true
|
|
},
|
|
endAt: {
|
|
required: true
|
|
}
|
|
})
|
|
|
|
const reportStore = useReportStore()
|
|
const open = defineModel('open')
|
|
const loading = ref(true)
|
|
const baseColumns = reportStore.getColumnsByKey(['num', 'fullname', 'age', 'birth_date', 'mkb.ds'])
|
|
|
|
const currentPatient = ref(null)
|
|
const showMoveDrawer = ref(false)
|
|
|
|
const columns = computed(() => {
|
|
// if (!isFillableMode.value) return baseColumns
|
|
|
|
const newColumns = []
|
|
|
|
const expandColumn = {
|
|
title: '',
|
|
width: '30',
|
|
render: (rowData) => {
|
|
return h(
|
|
NIcon,
|
|
{
|
|
onClick: () => {
|
|
currentPatient.value = rowData
|
|
showMoveDrawer.value = true
|
|
}
|
|
},
|
|
{
|
|
default: h(TbEye)
|
|
}
|
|
)
|
|
}
|
|
}
|
|
|
|
const fillableColumn = {
|
|
title: '',
|
|
key: 'fillable',
|
|
width: '20',
|
|
render: (row) => h(
|
|
NBadge,
|
|
{
|
|
dot: true,
|
|
color: (row.comment && row.comment.trim()) ? '#7fe7c4' : '#e88080'
|
|
}
|
|
)
|
|
}
|
|
|
|
newColumns.push(expandColumn)
|
|
newColumns.push(fillableColumn)
|
|
newColumns.push(...baseColumns)
|
|
|
|
return newColumns
|
|
})
|
|
|
|
const observablePatients = ref([])
|
|
const fetchUnwantedEvents = () => {
|
|
loading.value = true
|
|
const data = {
|
|
status: 'observation',
|
|
startAt: props.startAt,
|
|
endAt: props.endAt,
|
|
departmentId: props.departmentId
|
|
}
|
|
axios.post('/api/mis/patients', data).then((res) => {
|
|
observablePatients.value = reportStore.addRowNumbers(res.data)
|
|
}).finally(() => {
|
|
loading.value = false
|
|
})
|
|
}
|
|
|
|
watch(() => [props.departmentId, props.endAt, props.startAt], () => {
|
|
if (props.departmentId && props.endAt && props.startAt) {
|
|
fetchUnwantedEvents()
|
|
}
|
|
}, {
|
|
immediate: true,
|
|
deep: true
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<NModal v-model:show="open"
|
|
title="Пациенты на контроле"
|
|
preset="card"
|
|
:mask-closable="false"
|
|
:close-on-esc="false"
|
|
class="max-w-4xl overflow-clip h-[calc(100vh-220px)]"
|
|
id="modal-observation-patients"
|
|
>
|
|
<template v-if="loading">
|
|
<div class="flex items-center justify-center h-full">
|
|
<NSpin />
|
|
</div>
|
|
</template>
|
|
<template v-else-if="observablePatients.length">
|
|
<NDataTable :columns="columns"
|
|
ref="tableRef"
|
|
:data="observablePatients"
|
|
size="small"
|
|
:loading="loading"
|
|
max-height="200"
|
|
min-height="200"
|
|
:row-key="(row, index) => row.id"
|
|
class="text-sm!">
|
|
</NDataTable>
|
|
</template>
|
|
<template v-else>
|
|
<div class="h-full flex items-center justify-center">
|
|
<NEmpty description="Пациентов на контроле не найдено!" />
|
|
</div>
|
|
</template>
|
|
|
|
<NDrawer
|
|
v-model:show="showMoveDrawer"
|
|
placement="bottom"
|
|
:min-height="400"
|
|
:max-height="600"
|
|
:default-height="400"
|
|
resizable
|
|
:trap-focus="false"
|
|
:block-scroll="false"
|
|
to="#modal-observation-patients"
|
|
>
|
|
<NDrawerContent title="Причина постановки на контроль" closable>
|
|
<NInput type="textarea" readonly :rows="8" v-model:value="currentPatient.comment" />
|
|
</NDrawerContent>
|
|
</NDrawer>
|
|
</NModal>
|
|
</template>
|
|
|
|
<style scoped>
|
|
:deep(.n-data-table-th),
|
|
:deep(.n-data-table-td) {
|
|
white-space: nowrap !important;
|
|
font-size: var(--n-font-size);
|
|
}
|
|
</style>
|