Добавил реанимацию

Правки окна операций

resources/js/Components/AppPanel.vue

@@ -76,7 +76,7 @@ watch(() => [props.minH, props.maxH], ([minH, maxH]) => {
 </template>
 
 <style scoped>
-.no-padding :deep(.n-card__content) {
+.no-padding :deep(.n-card-content) {
     padding: 0 !important;
 }
 </style>

resources/js/Pages/Report/Components/DataTableColumns/OperationsColumn.vue

@@ -5,13 +5,15 @@ const props = defineProps({
     operations: Array
 })
 
+const emits = defineEmits(['click'])
+
 const firstOperation = computed(() => props.operations[0])
 </script>
 
 <template>
     <NTooltip v-if="operations.length" :arrow="false">
         <template #trigger>
-            <div class="absolute inset-0 p-2 pt-2.5">
+            <div class="absolute inset-0 p-2 pt-2.5" @click="emits('click', operations)">
                 {{ firstOperation?.code_service }}
             </div>
         </template>

resources/js/Pages/Report/Components/OperationInfoModal.vue

@@ -6,14 +6,10 @@ import {format} from "date-fns";
 import AppPanel from "../../../Components/AppPanel.vue";
 
 const props = defineProps({
-    historyId: {
-        type: Number,
-        required: true
-    }
+    operations: Array
 })
 
 const show = defineModel('show')
-const operations = ref(null)
 const showInfoDrawer = ref(false)
 const showedOperation = ref(null)
 
@@ -21,39 +17,30 @@ const onShowInfoDrawer = (operation) => {
     showedOperation.value = {...operation}
     showInfoDrawer.value = true
 }
-
-watch(() => props.historyId, (value) => {
-    console.log(value)
-    axios.get(`/api/mis/operations`, {
-        params: {
-            historyId: value
-        }
-    })
-        .then(response => {
-            operations.value = response.data
-        })
-})
 </script>
 
 <template>
     <NModal v-model:show="show"
             title="Операции"
             :mask-closable="false"
-            class="max-w-xl overflow-clip min-h-[420px] max-h-[600px]"
+            :segmented="{ content: true }"
+            class="max-w-xl overflow-clip h-[400px]"
+            draggable
+            content-scrollable
             preset="card"
             id="modal-operation"
     >
-        <div class="h-full flex flex-col gap-y-4">
+        <div class="space-y-4">
             <NThing v-for="operation in operations">
                 <template #header>
-                    Операция №{{operation.num}}
+                    Операция №
                 </template>
                 <template #header-extra>
                     <NTag size="small" type="info" round :bordered="false">
                         <template #icon>
                             <TbClockCheck size="16" />
                         </template>
-                        {{operation.duration}} мин.
+                         мин.
                     </NTag>
                 </template>
                 <template #description>
@@ -62,17 +49,17 @@ watch(() => props.historyId, (value) => {
                             <template #icon>
                                 <TbCalendar size="18" />
                             </template>
-                            {{format(operation.startAt, 'dd.MM.yyyy')}}
+                            {{format(operation.start_date, 'dd.MM.yyyy')}}
                         </NTag>
                         <NTag type="success" round :bordered="false">
                             <template #icon>
                                 <TbTag size="18" />
                             </template>
-                            {{operation.service.ServiceMedicalCode}}
+                            {{operation.code_service}}
                         </NTag>
                     </NSpace>
                 </template>
-                {{operation.service.ServiceMedicalName}}
+                {{operation.name_service}}
                 <template #action>
                     <NButton type="primary" size="small" @click="onShowInfoDrawer(operation)">
                         Просмотреть
@@ -83,10 +70,10 @@ watch(() => props.historyId, (value) => {
         <NDrawer v-model:show="showInfoDrawer" width="100%" height="100%" to="#modal-operation" placement="bottom">
             <NDrawerContent closable>
                 <template #header>
-                    Операция №{{showedOperation.num}}
+                    Операция №
                 </template>
                 <AppPanel no-padding header="Описание" class="h-full!">
-                    <NInput type="textarea" :resizable="false" class="h-full" readonly v-model:value="showedOperation.description" />
+                    <NInput type="textarea" :resizable="false" class="h-full!" readonly v-model:value="showedOperation.description" />
                 </AppPanel>
             </NDrawerContent>
         </NDrawer>

resources/js/Pages/Report/Components/PatientDataTable.vue

@@ -39,7 +39,7 @@ const tableColumns = computed(() => {
 const searchArg = ref(null)
 
 const findPatient = (arg) => {
-    patients.value = patients.value.find(itm => itm.full_name === arg)
+    // TODO: сделать поиск пациента через БДц
 }
 
 const rowProps = (row) => {
@@ -69,8 +69,8 @@ const rowProps = (row) => {
         <NDataTable :columns="tableColumns"
                     :data="patients"
                     table-layout="fixed"
-                    max-height="280"
-                    min-height="280"
+                    max-height="234"
+                    min-height="234"
                     :loading="loading"
                     size="small"
                     :row-props="rowProps"

resources/js/Pages/Report/Index.vue

@@ -16,6 +16,7 @@ import TooltipColumn from "./Components/DataTableColumns/TooltipColumn.vue";
 import ActionsColumn from "./Components/DataTableColumns/ActionsColumn.vue";
 import OperationsColumn from "./Components/DataTableColumns/OperationsColumn.vue";
 import ReportWidget from "./Components/ReportWidget.vue";
+import OperationInfoModal from "./Components/OperationInfoModal.vue";
 
 const props = defineProps({
     department: {
@@ -63,6 +64,10 @@ const props = defineProps({
         type: Object,
         default: { data: [] }
     },
+    reanimationHistories: {
+        type: Object,
+        default: { data: [] }
+    },
     dates: {
         type: Array,
         default: []
@@ -73,6 +78,8 @@ const reportStore = useReportStore()
 const authStore = useAuthStore()
 const userDepartment = authStore.userDepartment
 const loading = ref(false)
+const operationsInModal = ref(null)
+const showOperationsModal = ref(false)
 
 const columns = [
     {
@@ -116,7 +123,7 @@ const columns = [
         key: 'latest_migration.operations',
         width: 140,
         className: 'relative',
-        render: (row) => h(OperationsColumn, { operations: row.latest_migration.operations })
+        render: (row) => h(OperationsColumn, { operations: row.latest_migration.operations, onClick: (operations) => onShowOperationsModal(operations) })
     },
     {
         title: '',
@@ -134,6 +141,11 @@ const columns = [
     }
 ]
 
+const onShowOperationsModal = (operations) => {
+    operationsInModal.value = operations
+    showOperationsModal.value = true
+}
+
 const syncPageProps = () => reportStore.initializeFromPage(props)
 
 onMounted(syncPageProps)
@@ -199,8 +211,8 @@ watch(() => props, (newProps) => {
                           <PatientTypeSectionItem label="Находятся на контроле" :counter="recipientHistories.data.length">
                               <PatientDataTable :data="recipientHistories.data" :columns="columns" />
                           </PatientTypeSectionItem>
-                          <PatientTypeSectionItem label="Находятся в реанимации" :counter="recipientHistories.data.length">
-                              <PatientDataTable :data="recipientHistories.data" :columns="columns" />
+                          <PatientTypeSectionItem label="Находятся в реанимации" :counter="reanimationHistories.data.length">
+                              <PatientDataTable :data="reanimationHistories.data" :columns="columns" />
                           </PatientTypeSectionItem>
                           <PatientTypeSectionItem label="Выбывшие" :counter="dischargedHistories.data.length + deceasedHistories.data.length">
                               <NTabs type="segment" animated>
@@ -247,4 +259,5 @@ watch(() => props, (newProps) => {
             </AppPanel>
         </AppContainer>
     </AppLayout>
+    <OperationInfoModal :operations="operationsInModal" v-model:show="showOperationsModal" />
 </template>