Обновление отчета

resources/js/Pages/Index.vue

@@ -41,7 +41,7 @@ const currentDate = computed(() => {
                              :icon="TbArticle"
                 />
                 <StartButton title="Статистика моего отделения"
-                             :description="`Ваше отделение в системе: ${authStore.user.current_department.departmentname}`"
+                             :description="`Ваше отделение в системе: ${authStore.userDepartment.name_short}`"
                              :href="`/statistic?sent_at=${reportStore.timestampCurrentRange}&groupId=1`"
                              :icon="TbChartTreemap"
                 />

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

@@ -1,5 +1,5 @@
 <script setup>
-import {NCard, NFlex, NFormItem, NForm, NInputNumber} from "naive-ui";
+import {NCard, NSkeleton, NFlex, NFormItem, NForm, NInputNumber} from "naive-ui";
 import {useReportStore} from "../../../Stores/report.js";
 
 const reportStore = useReportStore()
@@ -9,6 +9,11 @@ const reportStore = useReportStore()
     <NCard>
         <NForm>
             <NFlex>
+                <template v-if="reportStore.isLoadReportInfo">
+                    <NSkeleton class="w-[246px]! h-[60px]!" />
+                    <NSkeleton class="w-[246px]! h-[60px]!" />
+                    <NSkeleton class="w-[246px]! h-[60px]!" />
+                </template>
                 <template v-for="metrikaItem in reportStore.reportInfo?.metrikaItems">
                     <NFormItem :label="metrikaItem.name" :show-feedback="false">
                         <NInputNumber v-model:value="reportStore.reportForm[`metrika_item_${metrikaItem.metrika_item_id}`]"

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

@@ -1,5 +1,5 @@
 <script setup>
-import {NStatistic, NRow, NCol, NCard, NButton, NTag, NDatePicker, NFlex, NSelect, NText, NH2} from "naive-ui";
+import {NSkeleton, NStatistic, NRow, NCol, NCard, NButton, NTag, NDatePicker, NFlex, NSelect, NText, NH2} from "naive-ui";
 import {computed, ref} from "vue";
 import {format} from "date-fns";
 import {useNow} from "@vueuse/core";
@@ -65,10 +65,20 @@ const currentDate = computed(() => {
             <NFlex justify="space-between" align="center" :wrap="false">
                 <NRow class="grow">
                     <NCol :span="4">
-                        <NStatistic label="Коек" :value="reportStore.reportInfo?.department.beds" />
+                        <NStatistic label="Коек">
+                            <template #default>
+                                <NSkeleton v-if="reportStore.isLoadReportInfo" round class="w-[70px]! mt-2 h-[29px]!" />
+                                <span v-else>{{ reportStore.reportInfo?.department.beds }}</span>
+                            </template>
+                        </NStatistic>
                     </NCol>
                     <NCol :span="5">
-                        <NStatistic label="Загруженность" :value="`${reportStore.reportInfo?.department.percentLoadedBeds}%`" />
+                        <NStatistic label="Загруженность">
+                            <template #default>
+                                <NSkeleton v-if="reportStore.isLoadReportInfo" round class="w-[70px]! mt-2 h-[29px]!" />
+                                <span v-else>{{ reportStore.reportInfo?.department.percentLoadedBeds }}%</span>
+                            </template>
+                        </NStatistic>
                     </NCol>
                 </NRow>
 

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

@@ -107,18 +107,14 @@ const handleDrop = (e) => {
 }
 
 const fetchPatients = async () => {
-    if (props.status === 'plan' || props.status === 'emergency') {
-        isLoading.value = true
-        await axios.post('/api/mis/patients', {
-            status: props.status
-        }).then((res) => {
-            patientsData.value[props.status] = res.data
-        }).finally(() => {
-            isLoading.value = false
-        })
-    } else {
+    isLoading.value = true
+    await axios.post('/api/mis/patients', {
+        status: props.status
+    }).then((res) => {
+        patientsData.value[props.status] = res.data
+    }).finally(() => {
         isLoading.value = false
-    }
+    })
 }
 
 function rowProps(row) {

resources/js/Pages/Statistic/Index.vue

@@ -26,7 +26,7 @@ const columns = ref([
     },
     {
         title: 'Состояло',
-        key: 'beds',
+        key: '',
         width: 84,
         titleAlign: 'center',
         align: 'center'
@@ -112,24 +112,23 @@ const columns = ref([
 </script>
 
 <template>
-  <AppLayout>
-      <NDataTable :columns="columns"
-                  :data="data"
-                  size="small"
-                  :single-line="false"
-                  striped
-                  min-height="calc(100vh - 48px - 70px)"
-                  max-height="calc(100vh - 48px - 70px)"
-      >
+    <AppLayout>
+        <NDataTable :columns="columns"
+                    :data="data"
+                    size="small"
+                    :single-line="false"
+                    striped
+                    min-height="calc(100vh - 48px - 70px)"
+                    max-height="calc(100vh - 48px - 70px)"
+        >
 
-      </NDataTable>
-  </AppLayout>
+        </NDataTable>
+    </AppLayout>
 </template>
 
 <style scoped>
 :deep(.n-data-table-th),
 :deep(.n-data-table-td) {
-    //white-space: nowrap !important;
     font-size: var(--n-font-size);
 }
 </style>

resources/js/Stores/report.js

@@ -24,6 +24,7 @@ export const useReportStore = defineStore('reportStore', () => {
     const dataOnReport = ref(null)
 
     const reportInfo = ref(null)
+    const isLoadReportInfo = ref(false)
 
     const patientColumns = [
         {
@@ -94,9 +95,14 @@ export const useReportStore = defineStore('reportStore', () => {
     }
 
     const getReportInfo = async () => {
-        await axios.get('/api/report').then((res) => {
-            reportInfo.value = res.data
-        })
+        isLoadReportInfo.value = true
+        await axios.get('/api/report')
+            .then((res) => {
+                reportInfo.value = res.data
+            })
+            .finally(() => {
+                isLoadReportInfo.value = false
+            })
     }
 
     const getDataOnReportDate = async () => {
@@ -114,6 +120,7 @@ export const useReportStore = defineStore('reportStore', () => {
         timestampNow,
         timestampCurrent,
         timestampCurrentRange,
+        isLoadReportInfo,
         dataOnReport,
         patientColumns,
         patientsData,