feat:对接护理排版人员接口

src/api/scheduling.js

@@ -0,0 +1,13 @@
+import _axios from '@/utils/_axios';
+
+/**
+ * 获取护理人员排班
+ */
+export const GetMonitorOperationNurseSchedule = date => {
+  return _axios({
+    url: '/api/QualityMicroservice/Monitor/GetMonitorOperationNurseSchedule',
+    params: {
+      date,
+    },
+  });
+};

src/router/index.js

@@ -23,7 +23,7 @@ const routes = [
       {
         path: '/scheduling',
         name: 'scheduling',
-        meta: { title: '运营监控数据可视化' },
+        meta: { title: '护理人员排班' },
         component: () => import('@/views/pageScheduling/index.vue'),
       },
       {

src/views/pageScheduling/index.vue

@@ -6,21 +6,21 @@
           <img class="h-full" src="@/assets/svg/Monitor/Triangle.svg" />
         </div>
         <span class="panmen text-[1.66vh]">白班</span>
-        <p class="panmen text-[1.66vh]">手术间: 178</p>
+        <p class="panmen text-[1.66vh]">手术间: {{ roomCount }}</p>
-        <p class="panmen text-[1.66vh]">护理人员: 135</p>
+        <p class="panmen text-[1.66vh]">护理人员: {{ nurseCount }}</p>
       </div>
     </div>
     <section class="w-[166.2vh] h-[77.12vh] absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2">
       <el-carousel direction="vertical" :autoplay="true" :interval="5000" indicatorPosition="none">
-        <el-carousel-item v-for="item in 3" :key="item">
+        <el-carousel-item v-for="item in schedulingList" :key="item['roomName']">
           <section class="carouselItemBox">
-            <template v-for="(item, index) in 39">
+            <template v-for="(subItem, index) in item">
               <div class="w-[54.25vh] h-[4.44vh] leading-[4.44vh] text-center" :class="index % 6 < 3 ? 'bgOdd' : 'bgEven'" :key="index">
                 <div class="inline-block w-[9.07vh] h-[1.66vh] leading-none">
-                  <span class="panmen text-[#8C5AFA] text-[1.48vh]">R-{{ String(index + 1).padStart(3, '0') }}</span>
+                  <span class="panmen text-[#8C5AFA] text-[1.48vh]">{{ subItem['roomName'] }}</span>
                 </div>
                 <div class="inline-block w-[23vh] h-[1.66vh] leading-none pl-[1.94vh] border-l border-dashed border-l-[rgba(213,209,228,0.24)]">
-                  <span class="text-[1.48vh]">陈宇、孙晨、邓一帆</span>
+                  <span class="text-[1.48vh]">{{ subItem['nurseNames'] }}</span>
                 </div>
               </div>
             </template>
@@ -33,11 +33,68 @@
 
 <script>
 import { Carousel, CarouselItem } from 'element-ui';
+import { GetMonitorOperationNurseSchedule } from '@/api/scheduling';
+import dayjs from 'dayjs';
+
 export default {
+  data() {
+    return {
+      toDate: dayjs().format('YYYY-MM-DD'),
+      roomCount: 178,
+      nurseCount: 135,
+      schedulingList: [],
+      redenTimer: null,
+    };
+  },
+  methods: {
+    onGetPageData() {
+      this.isLoading = true;
+      GetMonitorOperationNurseSchedule(this.toDate).then(res => {
+        if (res['data']['nurseScheduleDetails']['length']) {
+          this.roomCount = res['data']['roomCount'];
+          this.nurseCount = res['data']['nurseCount'];
+          this.schedulingList = [];
+          res['data']['nurseScheduleDetails'].forEach((item, index) => {
+            if (this.schedulingList[Math.floor(index / 39)]) {
+              this.schedulingList[Math.floor(index / 39)].push(item);
+            } else {
+              this.schedulingList[Math.floor(index / 39)] = [item];
+            }
+          });
+        } else {
+          this.schedulingList = [];
+          for (let index = 0; index < 100; index++) {
+            if (this.schedulingList[Math.floor(index / 39)]) {
+              this.schedulingList[Math.floor(index / 39)].push({
+                roomName: String(index + 1).padStart(3, '0'),
+                nurseNames: '陈宇、孙晨、邓一帆',
+              });
+            } else {
+              this.schedulingList[Math.floor(index / 39)] = [
+                {
+                  roomName: String(index + 1).padStart(3, '0'),
+                  nurseNames: '陈宇、孙晨、邓一帆',
+                },
+              ];
+            }
+          }
+        }
+      });
+    },
+  },
+  mounted() {
+    this.onGetPageData();
+    this.redenTimer = setInterval(() => {
+      this.onGetPageData();
+    }, 300000);
+  },
   components: {
     'el-carousel': Carousel,
     'el-carousel-item': CarouselItem,
   },
+  beforeRouteLeave() {
+    clearInterval(this.renderTimer);
+  },
 };
 </script>