feat: 排程支持下拉

package-lock.json

@@ -14,6 +14,7 @@
         "echarts": "^5.5.0",
         "element-ui": "^2.15.14",
         "net": "^1.0.2",
+        "pinyin-match": "^1.2.8",
         "stompjs": "^2.3.3",
         "vue": "^2.6.14",
         "vue-router": "^3.5.1",
@@ -9257,6 +9258,11 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/pinyin-match": {
+      "version": "1.2.8",
+      "resolved": "https://registry.npmjs.org/pinyin-match/-/pinyin-match-1.2.8.tgz",
+      "integrity": "sha512-5rBwNuOjnOtZNEgX4OlTLYsmBcE9XSV1oF/KN9mLEsVNr8HdqMb2YRhR6iqHMeU8ZBKbx/oYBgHr04uIvOlxGg=="
+    },
     "node_modules/pirates": {
       "version": "4.0.6",
       "resolved": "https://registry.npmjs.org/pirates/-/pirates-4.0.6.tgz",

package.json

@@ -15,6 +15,7 @@
     "echarts": "^5.5.0",
     "element-ui": "^2.15.14",
     "net": "^1.0.2",
+    "pinyin-match": "^1.2.8",
     "stompjs": "^2.3.3",
     "vue": "^2.6.14",
     "vue-router": "^3.5.1",

src/App.vue

@@ -13,22 +13,22 @@ export default {
   },
   methods: {
     enterFullscreen() {
-      // 请求全屏模式
+      // // 请求全屏模式
-      const element = document.documentElement;
+      // const element = document.documentElement;
-      if (!this.isLoding) {
+      // if (!this.isLoding) {
-        if (element.webkitRequestFullscreen) {
+      //   if (element.webkitRequestFullscreen) {
-          // Chrome, Safari and Opera
+      //     // Chrome, Safari and Opera
-          element.webkitRequestFullscreen();
+      //     element.webkitRequestFullscreen();
-        } else if (element.msRequestFullscreen) {
+      //   } else if (element.msRequestFullscreen) {
-          // IE/Edge
+      //     // IE/Edge
-          element.msRequestFullscreen();
+      //     element.msRequestFullscreen();
-        } else if (element.mozRequestFullScreen) {
+      //   } else if (element.mozRequestFullScreen) {
-          // Firefox
+      //     // Firefox
-          element.mozRequestFullScreen();
+      //     element.mozRequestFullScreen();
-        } else if (element.requestFullscreen) {
+      //   } else if (element.requestFullscreen) {
-          element.requestFullscreen();
+      //     element.requestFullscreen();
-        }
+      //   }
-      }
+      // }
     },
   },
 };
@@ -55,8 +55,20 @@ export default {
 
 * {
   color: #fff;
+
+  [class^="el-"] {
+    color: inherit;
+
+    * {
+      color: inherit;
+    }
+  }
+
   // 思源黑体 微软雅黑 无衬线字体
-  font-family: 'Source Han Sans', 'Microsoft YaHei', Arial, sans-serif;
+  font-family: 'Source Han Sans',
+  'Microsoft YaHei',
+  Arial,
+  sans-serif;
 }
 
 #app {

src/api/publishApi.js

@@ -27,6 +27,14 @@ export const getGlobeConfig = (params) => {
   });
 };
 
+// 获取部门列表
+export const getDepList = () => {
+  return _axios({
+    method: "get",
+    url: "/api/identity/departments/treelist",
+  });
+};
+
 // 获取音频数据
 export const getAudio = (data) => {
   return axios.post(

src/views/scheduleList/index.vue

@@ -21,16 +21,25 @@
       <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">
           <template v-for="item in colList">
-            <div class="font-semibold border-r truncate"
+            <div class="font-semibold border-r "
               :style="item['width'] ? `flex-basis:${item['width']}px` : `flex-grow: 1;`" :key="item['columnCode']"
               v-if="item['isShow']">
-              {{ item['columnName'] }}
+              <div class="h-full flex items-center selectBox" v-if="item['depFilter']">
+                <el-select v-model="selectDepList" class="flex-grow" filterable :filterMethod="onSelectDepFilter"
+                  multiple collapseTags :multipleLimit="1" :popperAppendToBody="false" @change="onSelectChange(item)">
+                  <template v-for="(subItem, index) in depList">
+                    <el-option :key="index" :label="subItem['DisplayName']" :value="subItem['Code']"
+                      v-if="subItem['isShow']" />
+                  </template>
+                </el-select>
+              </div>
+              <p @click="onDepFilter(item)" v-else class="truncate">{{ item['columnName'] }}</p>
             </div>
           </template>
         </div>
         <div :style="carouselWrap" class="border border-[#9A82FF] border-t-0" v-loading="isLoading">
           <template v-if="patientList['length']">
-            <el-carousel direction="vertical" :autoplay="true" indicatorPosition="none" ref="carousel"
+            <el-carousel direction="vertical" :autoplay="true" indicatorPosition="none" ref="carousel" :interval="0"
               @change="onCarouselChange">
               <el-carousel-item v-for="(item, index) in patientList" :key="index">
                 <section class="carouselItemBox">
@@ -88,10 +97,11 @@
 </template>
 
 <script>
-import { getDynamicTableHeader, getDynamicTableList, getGlobeConfig } from '@/api/publishApi';
+import { getDynamicTableHeader, getDynamicTableList, getGlobeConfig, getDepList } from '@/api/publishApi';
-import { Carousel, CarouselItem } from 'element-ui';
+import { Carousel, CarouselItem, Select, Option } from 'element-ui';
-import dayjs from 'dayjs';
 import { statusToTxt, textToColor } from '@/utils/common';
+import dayjs from 'dayjs';
+import PinyinMatch from "pinyin-match";
 
 export default {
   data() {
@@ -105,7 +115,7 @@ export default {
       patientList: [],
       currentDateTime: dayjs().format('YYYY-MM-DD HH:mm dddd'),
       dateTimer: null,
-      carouselCountDown: 10,
+      carouselCountDown: 20,
       carouselTimer: null,
       activeIndex: 0,
       getDataTimer: null,
@@ -115,6 +125,26 @@ export default {
       logoUrlBackup: "",
       groupIndex: -1,
       roomNameList: [],
+      stayTime: 30,
+      depList: [],
+      selectDepList: [],
+      options: [{
+        value: '选项1',
+        label: '黄金糕'
+      }, {
+        value: '选项2',
+        label: '双皮奶'
+      }, {
+        value: '选项3',
+        label: '蚵仔煎'
+      }, {
+        value: '选项4',
+        label: '龙须面'
+      }, {
+        value: '选项5',
+        label: '北京烤鸭'
+      }],
+      value: ''
     };
   },
   methods: {
@@ -136,9 +166,26 @@ export default {
       })
         .then(res => {
           this.patientList = [];
-          console.log(res['Data']['Data']);
-
           if (res['Data']['Data']['length']) {
+            // 过滤结束时间
+            const deadline = dayjs().valueOf() - (60 * this.stayTime * 1000);
+            res['Data']['Data'] = res['Data']['Data'].filter(item => {
+              if (item['ProcStatus'] == 35 && item['OutRoomDateTime']) {
+                return dayjs(item['OutRoomDateTime']).valueOf() > deadline
+              }
+              if (item['ProcStatus'] == 45 && item['OutPacuDateTime']) {
+                return dayjs(item['OutPacuDateTime']).valueOf() > deadline
+              }
+              return true
+            })
+
+            // 过滤部门
+            if (this.selectDepList.length) {
+              res['Data']['Data'] = res['Data']['Data'].filter(item => {
+                return this.selectDepList.includes(item['DeptCode'])
+              })
+            }
+            // 分区
             if (this.groupIndex >= 0) {
               if (this.roomNameList[this.groupIndex]) {
                 res['Data']['Data'] = res['Data']['Data'].filter(item => {
@@ -174,7 +221,7 @@ export default {
           this.carouselCountDown -= 1;
           if (this.carouselCountDown == 0) {
             this.$refs.carousel.next();
-            this.carouselCountDown = 10;
+            this.carouselCountDown = 20;
           }
         }, 1000);
       });
@@ -204,7 +251,6 @@ export default {
         res['Data']['Item'].forEach(item => {
           if (item['Key'] == 'HospitalLogo') {
             this.logoUrl = item['Value']
-
           }
           if (item['Key'] == "CorporateLogo") {
             this.logoUrlBackup = item['Value']
@@ -212,14 +258,62 @@ export default {
           if (item['Key'] == "RoomName") {
             this.roomNameList = JSON.parse(item['Value'])
           }
+          if (item['Key'] == "StayTime") {
+            this.stayTime = Number(item['Value'])
+          }
         })
       })
+    },
+    onGetDepList() {
+      getDepList().then(res => {
+        this.depList = res['Data'].map((item, index) => {
+          item['isShow'] = index < 30
+          return item
+        })
+      })
+    },
+    onDepFilter(rowData) {
+      if (rowData['columnCode'] == 'DeptName') {
+        rowData['depFilter'] = true
+        this.$nextTick(() => {
+          const selectBox = document.querySelector(".selectBox");
+          if (selectBox) {
+            const selectNode = selectBox.querySelector(".el-select");
+            if (selectNode) {
+              const instance = selectNode.__vue__;
+              if (instance && typeof instance.toggleMenu === "function") {
+                instance.toggleMenu();
+                return;
+              }
+            }
+          }
+        })
+      }
+    },
+    onSelectDepFilter(val) {
+      if (val) {
+        this.depList.map(item => {
+          item["isShow"] = PinyinMatch.match(item["DisplayName"], val);
+        })
+      }
+      else {
+        this.depList.map((item, index) => {
+          item["isShow"] = index < 30;
+        })
+      }
+    },
+    onSelectChange(rowData) {
+      if (!this.selectDepList.length) {
+        rowData['depFilter'] = false
+      }
+      this.onGetPageData()
     }
   },
   mounted() {
     this.$nextTick(() => {
       this.onCalculate();
       this.onGetblobe();
+      this.onGetDepList()
 
       // 每秒更新一次当前时间
       this.dateTimer = setInterval(() => {
@@ -231,13 +325,16 @@ export default {
       }).then(res => {
         if (res['Data']['Data']['length']) {
           res = res['Data']['Data'][0];
-          this.colList = JSON.parse(res['ReportHeadColumn']);
+          this.colList = JSON.parse(res['ReportHeadColumn']).map(item => {
+            item['depFilter'] = false
+            return item
+          });
           this.queryCondition = JSON.parse(res['QueryCondition']);
         }
         this.onGetPageData();
         this.getDataTimer = setInterval(() => {
           this.onGetPageData();
-        }, 35000);
+        }, 120000);
         window.addEventListener('resize', this.onCalculate);
       });
     });
@@ -245,6 +342,8 @@ export default {
   components: {
     'el-carousel': Carousel,
     'el-carousel-item': CarouselItem,
+    'el-select': Select,
+    'el-option': Option,
   },
   computed: {
     formatDate() {
@@ -314,4 +413,28 @@ export default {
     }
   }
 }
+
+.selectBox {
+  :deep(.el-select) {
+    .el-input__inner {
+      border: none;
+    }
+
+    .el-input__suffix {
+      visibility: hidden;
+    }
+
+    .el-select-dropdown {
+      text-align: left;
+
+      span {
+        font-size: 16px;
+      }
+    }
+
+    .el-select__tags-text {
+      font-size: 16px;
+    }
+  }
+}
 </style>