From eb3466d6542f066c5ebca207e9007c542e51d3ec Mon Sep 17 00:00:00 2001
From: "@0Melon0" <576788380@qq.com>
Date: Fri, 12 Jul 2024 15:59:45 +0800
Subject: [PATCH] =?UTF-8?q?feat:=E6=8E=A5=E5=85=A5=E5=8A=A8=E6=80=81?=
 =?UTF-8?q?=E8=A1=A8=E6=A0=BC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/publishApi.js            |  18 ++++++
 src/views/scheduleList/index.vue |  99 ++++++++++++++++++++---------
 src/views/waitList/index.vue     | 104 +++++++++++++++++++++----------
 3 files changed, 156 insertions(+), 65 deletions(-)
 create mode 100644 src/api/publishApi.js

diff --git a/src/api/publishApi.js b/src/api/publishApi.js
new file mode 100644
index 0000000..7cddfd3
--- /dev/null
+++ b/src/api/publishApi.js
@@ -0,0 +1,18 @@
+import _axios from '@/utils/_axios';
+
+// 获取动态表格列头
+export const getDynamicTableHeader = data => {
+  return _axios({
+    url: '/api/DoctorMicroservice/DictReportDataSource/QueryPageList',
+    params: data,
+  });
+};
+
+// 获取动态表格数据
+export const getDynamicTableList = data => {
+  return _axios({
+    method: 'post',
+    url: '/api/DoctorMicroservice/DictReportDataSource/GetHistoryAllData',
+    data,
+  });
+};
diff --git a/src/views/scheduleList/index.vue b/src/views/scheduleList/index.vue
index ab06ddb..5b68513 100644
--- a/src/views/scheduleList/index.vue
+++ b/src/views/scheduleList/index.vue
@@ -18,13 +18,11 @@
     <main class="h-[calc(100vh-18.51vh)] p-[24px] pb-0 relative" ref="mainRef">
       <div class="absolute top-[24px] left-1/2 -translate-x-1/2 w-[calc(100%-48px)]">
         <div class="bg-[#9A82FF] flex text-center" :style="carouselNav">
-          <div class="w-[7%] font-semibold border-r">手术间</div>
-          <div class="w-[7%] font-semibold border-r">台次</div>
-          <div class="w-[8%] font-semibold border-r truncate">患者姓名</div>
-          <div class="w-[16%] font-semibold border-r">科室</div>
-          <div class="w-[27%] font-semibold border-r">手术名称</div>
-          <div class="w-[27%] font-semibold border-r">手术医生</div>
-          <div class="w-[8%] font-semibold">状态</div>
+          <template v-for="item in colList">
+            <div class="font-semibold border-r truncate" :style="item['width'] ? `flex-basis:${item['width']}px` : `flex-grow: 1;`" :key="item['columnCode']" v-if="item['isShow']">
+              {{ item['columnName'] }}
+            </div>
+          </template>
         </div>
         <div :style="carouselWrap" class="border border-[#9A82FF] border-t-0" v-loading="isLoading">
           <template v-if="patientList['length']">
@@ -33,20 +31,38 @@
                 <section class="carouselItemBox">
                   <div v-for="(subItem, index) in item" :key="index" :style="carouselItemStyle">
                     <div class="flex text-center">
-                      <div class="w-[7%] border-r text-[#333] font-semibold truncate px-3">{{ subItem['RoomName'] }}</div>
-                      <div class="w-[7%] border-r text-[#333] font-semibold truncate px-3">{{ subItem['Sequence'] }}</div>
-                      <div class="w-[8%] border-r text-[#333] font-semibold truncate px-3">{{ subItem['PatientName'] }}</div>
-                      <div class="w-[16%] border-r text-[#333] font-semibold truncate px-3">{{ subItem['DeptName'] }}</div>
-                      <div class="w-[27%] border-r text-[#333] font-semibold px-3">
-                        <marquee scrollamount="3" class="text-[#333]" :style="carouselItemStyle">{{ subItem['OperationName'] }}</marquee>
-                      </div>
-                      <div class="w-[27%] border-r text-[#333] font-semibold px-3 truncate">
-                        <!-- <marquee scrollamount="2" class="text-[#333]" :style="carouselItemStyle">{{ subItem['SurgeonLists'] }}</marquee> -->
-                        {{ subItem['SurgeonLists'] }}
-                      </div>
-                      <div class="w-[8%] font-semibold text-[#333]" :style="{ color: `${textToColor(subItem['ProcStatusName'])}` }">
-                        {{ subItem['ProcStatusName'] }}
-                      </div>
+                      <template v-for="item in colList">
+                        <template v-if="item['columnCode'] == 'ProcStatusName'">
+                          <div
+                            class="border-r text-[#333] font-semibold truncate px-3"
+                            :style="{ color: `${textToColor(subItem['ProcStatusName'])}`, 'flex-basis': `${item['width']}px` }"
+                            :key="item['columnCode']"
+                            v-if="item['isShow']"
+                          >
+                            {{ subItem['ProcStatusName'] }}
+                          </div>
+                        </template>
+                        <template v-else-if="item['columnCode'] == 'IntendedOperationName'">
+                          <div
+                            class="border-r text-[#333] font-semibold truncate px-3"
+                            :style="item['width'] ? `flex-basis:${item['width']}px` : `flex-grow: 1;`"
+                            :key="item['columnCode']"
+                            v-if="item['isShow']"
+                          >
+                            <marquee scrollamount="3" class="text-[#333]" :style="carouselItemStyle">{{ subItem['IntendedOperationName'] }}</marquee>
+                          </div>
+                        </template>
+                        <template v-else>
+                          <div
+                            class="border-r text-[#333] font-semibold truncate px-3"
+                            :style="item['width'] ? `flex-basis:${item['width']}px` : `flex-grow: 1;`"
+                            :key="item['columnCode']"
+                            v-if="item['isShow']"
+                          >
+                            {{ subItem[item['columnCode']] }}
+                          </div>
+                        </template>
+                      </template>
                     </div>
                   </div>
                 </section>
@@ -74,7 +90,7 @@
 </template>
 
 <script>
-import { getOperationList } from '@/api/waitList';
+import { getDynamicTableHeader, getDynamicTableList } from '@/api/publishApi';
 import { Carousel, CarouselItem } from 'element-ui';
 import dayjs from 'dayjs';
 import { statusToTxt, textToColor } from '@/utils/common';
@@ -95,6 +111,8 @@ export default {
       carouselTimer: null,
       activeIndex: 0,
       getDataTimer: null,
+      colList: [],
+      queryCondition: [],
     };
   },
   methods: {
@@ -103,12 +121,22 @@ export default {
     onGetPageData() {
       let today = dayjs().format('YYYY-MM-DD');
       // today = '2024-06-06';
-      getOperationList(today)
+      const QueryFiledDic = {};
+      this.queryCondition.forEach(queryItem => {
+        if (queryItem['queryType'] == 'dateTime') {
+          QueryFiledDic[queryItem['queryFiled']] = today;
+        }
+      });
+      getDynamicTableList({
+        PageSize: 999,
+        GroupCode: 'SSPCDP',
+        QueryFiledDic,
+      })
         .then(res => {
           this.patientList = [];
-          if (res['Data']['length']) {
-            for (let index = 0; index < res['Data'].length; index++) {
-              const element = res['Data'][index];
+          if (res['Data']['Data']['length']) {
+            for (let index = 0; index < res['Data']['Data']['length']; index++) {
+              const element = res['Data']['Data'][index];
               const groupIndex = parseInt(index / this.showItemNum);
               if (this.patientList[groupIndex]) {
                 this.patientList[groupIndex].push(element);
@@ -116,7 +144,7 @@ export default {
                 this.patientList[groupIndex] = [element];
               }
             }
-            if (!this.carouselTimer && res['Data']['length'] > this.showItemNum) {
+            if (!this.carouselTimer && res['Data']['Data']['length'] > this.showItemNum) {
               this.onCarouselTimer();
             }
           } else {
@@ -168,11 +196,20 @@ export default {
         this.currentDateTime = dayjs().format('YYYY-MM-DD HH:mm dddd');
       }, 10000);
 
-      this.onGetPageData();
-      this.getDataTimer = setInterval(() => {
+      getDynamicTableHeader({
+        query: 'SSPCDP',
+      }).then(res => {
+        if (res['Data']['Data']['length']) {
+          res = res['Data']['Data'][0];
+          this.colList = JSON.parse(res['ReportHeadColumn']);
+          this.queryCondition = JSON.parse(res['QueryCondition']);
+        }
         this.onGetPageData();
-      }, 35000);
-      window.addEventListener('resize', this.onCalculate);
+        this.getDataTimer = setInterval(() => {
+          this.onGetPageData();
+        }, 35000);
+        window.addEventListener('resize', this.onCalculate);
+      });
     });
   },
   components: {
diff --git a/src/views/waitList/index.vue b/src/views/waitList/index.vue
index 7844a37..2235ffe 100644
--- a/src/views/waitList/index.vue
+++ b/src/views/waitList/index.vue
@@ -18,11 +18,11 @@
     <main class="h-[calc(100vh-18.51vh)] p-[15px] pb-0 relative overflow-hidden" ref="mainRef">
       <div class="absolute top-[24px] left-1/2 -translate-x-1/2 w-[calc(100%-30px)]">
         <div class="bg-[#9A82FF] flex text-center" :style="carouselNav">
-          <div class="w-[16%] font-semibold border-r">手术间</div>
-          <div class="w-[20%] font-semibold border-r">患者姓名</div>
-          <div class="w-[16%] font-semibold border-r">床号</div>
-          <div class="w-[28%] font-semibold border-r">科室</div>
-          <div class="w-[20%] font-semibold">状态</div>
+          <template v-for="item in colList">
+            <div class="font-semibold border-r truncate" :style="item['width'] ? `flex-basis:${item['width']}px` : `flex-grow: 1;`" :key="item['columnCode']" v-if="item['isShow']">
+              {{ item['columnName'] }}
+            </div>
+          </template>
         </div>
         <div :style="carouselWrap" class="border border-[#9A82FF] border-t-0" v-loading="isLoading">
           <template v-if="patientList['length']">
@@ -32,13 +32,28 @@
                   <template v-for="(subItem, index) in item">
                     <div :key="index" :style="carouselItemStyle">
                       <div class="flex text-center">
-                        <div class="w-[16%] border-r text-[#333] font-semibold truncate">{{ subItem['RoomName'] }}</div>
-                        <div class="w-[20%] border-r text-[#333] font-semibold truncate">{{ subItem['PatientName'] }}</div>
-                        <div class="w-[16%] border-r text-[#333] font-semibold truncate">{{ subItem['BedNo'] }}</div>
-                        <div class="w-[28%] border-r text-[#333] font-semibold truncate">{{ subItem['DeptName'] }}</div>
-                        <div class="w-[20%] text-[#333] font-semibold" :style="{ color: `${textWaitToColor(subItem['ProcStatusName'])}` }">
-                          {{ subItem['ProcStatusName'] }}
-                        </div>
+                        <template v-for="item in colList">
+                          <template v-if="item['columnCode'] == 'ProcStatusName'">
+                            <div
+                              class="border-r text-[#333] font-semibold truncate"
+                              :style="{ color: `${textWaitToColor(subItem['ProcStatusName'])}`, 'flex-basis': `${item['width']}px` }"
+                              :key="item['columnCode']"
+                              v-if="item['isShow']"
+                            >
+                              {{ subItem['ProcStatusName'] }}
+                            </div>
+                          </template>
+                          <template v-else>
+                            <div
+                              class="border-r text-[#333] font-semibold truncate"
+                              :style="item['width'] ? `flex-basis:${item['width']}px` : `flex-grow: 1;`"
+                              :key="item['columnCode']"
+                              v-if="item['isShow']"
+                            >
+                              {{ subItem[item['columnCode']] }}
+                            </div>
+                          </template>
+                        </template>
                       </div>
                     </div>
                   </template>
@@ -74,7 +89,7 @@
 </template>
 
 <script>
-import { getAnesPatientList } from '@/api/waitList';
+import { getDynamicTableHeader, getDynamicTableList } from '@/api/publishApi';
 import { Carousel, CarouselItem } from 'element-ui';
 import dayjs from 'dayjs';
 import { statusToTxt, textWaitToColor } from '@/utils/common';
@@ -104,6 +119,8 @@ export default {
       popupMag: [],
       popupTimer: null,
       synth: window.speechSynthesis,
+      colList: [],
+      queryCondition: [],
     };
   },
   methods: {
@@ -112,12 +129,22 @@ export default {
     onGetPageData() {
       let today = dayjs().format('YYYY-MM-DD');
       // today = '2024-06-06';
-      getAnesPatientList(today)
+      const QueryFiledDic = {};
+      this.queryCondition.forEach(queryItem => {
+        if (queryItem['queryType'] == 'dateTime') {
+          QueryFiledDic[queryItem['queryFiled']] = today;
+        }
+      });
+      getDynamicTableList({
+        PageSize: 999,
+        GroupCode: 'JSDHQDP',
+        QueryFiledDic,
+      })
         .then(res => {
           this.patientList = [];
-          if (res['Data']['length']) {
-            for (let index = 0; index < res['Data'].length; index++) {
-              const element = res['Data'][index];
+          if (res['Data']['Data']['length']) {
+            for (let index = 0; index < res['Data']['Data']['length']; index++) {
+              const element = res['Data']['Data'][index];
               const groupIndex = parseInt(index / this.showItemNum);
               if (this.patientList[groupIndex]) {
                 this.patientList[groupIndex].push(element);
@@ -125,7 +152,7 @@ export default {
                 this.patientList[groupIndex] = [element];
               }
             }
-            if (!this.carouselTimer && res['Data']['length'] > this.showItemNum) {
+            if (!this.carouselTimer && res['Data']['Data']['length'] > this.showItemNum) {
               this.onCarouselTimer();
             }
           } else {
@@ -189,11 +216,11 @@ export default {
           this.popupMsgList.push(data['msg'].replaceAll('，', ','));
         }
       } catch (e) {
-        console.log(e);
+        console.warn(e);
       }
     },
     onFailed: function (frame) {
-      console.log('MQ Failed: ' + frame);
+      console.warn('MQ Failed: ' + frame);
       setTimeout(() => {
         this.client = Stomp.client(MQTT_SERVICE);
         Stomp.over(this.client);
@@ -214,7 +241,7 @@ export default {
           if (selectedVoice) {
             utterance.voice = selectedVoice;
           } else {
-            console.log('voices not fount');
+            console.warn('voices not fount');
           }
 
           // 添加 onend 事件处理器
@@ -253,21 +280,30 @@ export default {
         this.currentDateTime = dayjs().format('YYYY-MM-DD HH:mm dddd');
       }, 10000);
 
-      this.onGetPageData();
-      this.getDataTimer = setInterval(() => {
+      getDynamicTableHeader({
+        query: 'JSDHQDP',
+      }).then(res => {
+        if (res['Data']['Data']['length']) {
+          res = res['Data']['Data'][0];
+          this.colList = JSON.parse(res['ReportHeadColumn']);
+          this.queryCondition = JSON.parse(res['QueryCondition']);
+        }
         this.onGetPageData();
-      }, 35000);
-      this.popupTimer = setInterval(() => {
-        this.onPopupPlay();
-      }, 2000);
-      window.addEventListener('resize', this.onCalculate);
-      this.setRabitMQ();
+        this.getDataTimer = setInterval(() => {
+          this.onGetPageData();
+        }, 35000);
+        this.popupTimer = setInterval(() => {
+          this.onPopupPlay();
+        }, 2000);
+        window.addEventListener('resize', this.onCalculate);
+        this.setRabitMQ();
 
-      // setTimeout(() => {
-      //   this.popupMsgList.push('请,金尧仙,的家属#到,手术室门口接病人');
-      //   this.popupMsgList.push('请,金尧仙,的家属#到,手术室门口接病人');
-      //   this.popupMsgList.push('请,金尧仙,的家属#到,手术室门口接病人');
-      // }, 3000);
+        // setTimeout(() => {
+        //   this.popupMsgList.push('请,金尧仙,的家属#到,手术室门口接病人');
+        //   this.popupMsgList.push('请,金尧仙,的家属#到,手术室门口接病人');
+        //   this.popupMsgList.push('请,金尧仙,的家属#到,手术室门口接病人');
+        // }, 3000);
+      });
     });
   },
   components: {