zc

src/api/yiLi.js

@@ -19,24 +19,24 @@ export function dashboardsFacilitiesStatusOverview(query) {
   })
 }
 
-// 设施使用率及二级单位统计
-export function dashboardsFacilitiesUsageStats(query) {
+// 设施列表信息
+export function dashboardsResearchUsage(query) {
   return request({
-    url: '/dashboards/facilities/usage-stats',
+    url: "/dashboards/research/usage?"+query,
     method: 'get',
-    params: query
   })
 }
 
-// 设施列表信息
-export function dashboardsResearchUsage(query) {
+// 设施类型概览
+export function dashboardsFacilitiesTypeOverview(query) {
   return request({
-    url: "/dashboards/research/usage?"+query,
+    url: "/dashboards/facilities/type-overview",
     method: 'get',
+    params: query
   })
 }
 
-// 设施列表信息
+// 媒体公告信息
 export function dashboardsMediaAnnouncements(query) {
   return request({
     url: "/dashboards/media-announcements",
@@ -53,3 +53,21 @@ export function dashboardsMonitorConfig(query) {
     params: query
   })
 }
+
+// 设施使用率及二级单位统计
+export function dashboardsFacilitiesUsageStats(query) {
+  return request({
+    url: "/dashboards/facilities/usage-stats",
+    method: 'get',
+    params: query
+  })
+}
+
+// 科研项目情况概览
+export function dashboardsResearchProjects(query) {
+  return request({
+    url: "/dashboards/research/projects",
+    method: 'get',
+    params: query
+  })
+}

src/utils/mapList.js

@@ -629,6 +629,7 @@ export function getFloorMaps(alarmList) {
         if(bigItem.floorId == item.floorId){
           item.list.forEach((minItem)=>{
             if(minItem.roomNumName == bigItem.roomNum){
+              bigItem.triggerUploadData = JSON.parse(bigItem.triggerUploadData)
               let obj = JSON.parse(JSON.stringify(minItem))
               obj.alarmType = true;
               obj.alarmData = bigItem;

src/views/components/components/alarmComponent.vue

@@ -9,23 +9,23 @@
         <div class="alarm-left-box">
           <div class="alarm-text-box">
             <div class="text-box">
-              <div class="colorType" :class="newData.status==1?'idle-color':(newData.status==2?'use-color':(newData.status==3?'maintenance-color':''))">
-                <p>{{newData.status==1?'空闲':(newData.status==2?'使用':(newData.status==3?'维修':''))}}</p>
+              <div class="colorType" :class="alarmData.status==1?'idle-color':(alarmData.status==2?'use-color':(alarmData.status==3?'maintenance-color':''))">
+                <p>{{alarmData.status==1?'空闲':(alarmData.status==2?'使用':(alarmData.status==3?'维修':''))}}</p>
               </div>
-              <p class="roomName">{{newData.roomNumName}}</p>
+              <p class="roomName">{{alarmData.roomNumName}}</p>
             </div>
             <div class="img-box">
               <img src="@/assets/ZDimages/icon_bjsj_tk@1x.png">
-              <p class="right-text">报警时间：{{parseTime(newData.alarmData.eventStartTime,"{y}-{m}-{d} {h}:{i}")}}</p>
+              <p class="right-text">报警时间：{{parseTime(alarmData.alarmData.eventStartTime,"{y}-{m}-{d} {h}:{i}")}}</p>
             </div>
             <div class="img-box">
               <img src="@/assets/ZDimages/icon_sslx_tk@1x.png">
-              <p class="right-text">设施类型：{{newData.equTypeValue}}</p>
+              <p class="right-text">设施类型：{{alarmData.equTypeValue}}</p>
             </div>
             <div class="img-box">
               <img src="@/assets/ZDimages/icon_lxr_tk@1x.png">
-              <p class="right-text" v-if="newData.status==2">使用人：{{newData.userName}}</p>
-              <p class="right-text" v-if="newData.status!=2">负责人：{{newData.headName}}</p>
+              <p class="right-text" v-if="alarmData.status==2">使用人：{{alarmData.userName}}</p>
+              <p class="right-text" v-if="alarmData.status!=2">负责人：{{alarmData.headName}}</p>
             </div>
             <div class="img-box">
               <img src="@/assets/ZDimages/icon_bjnr_tk@1x.png">
@@ -33,28 +33,35 @@
             </div>
           </div>
           <div class="alarm-sensor-box">
-            <div class="for-sensor-box" v-for="(item,index) in newData.sensor" :key="index">
+            <div class="for-sensor-box" v-for="(item,index) in alarmData.sensor" :key="index">
               <div class="sensor-img-box">
                 <svg-icon v-if="item.icon" class="svg-img" :icon-class="item.icon"/>
               </div>
               <p class="sensor-text-p">
                 <span class="span-1" v-if="item.code != 'yg'">{{item.deviceValue}}</span>
                 <span class="span-2" v-if="item.code != 'yg'">{{item.unit}}</span>
-                <span class="span-3" v-if="item.code == 'yg'">{{item.sensorAlarm?'异常':'正常'}}</span>
+                <span class="span-3" v-if="item.code == 'yg'">异常</span>
               </p>
               <p class="sensor-name-p">{{item.deviceName}}</p>
-
             </div>
           </div>
         </div>
         <div class="alarm-right-box">
-
+          <H5PlayerVideo class="alarm-video-max-big-box"
+                         :videoProps="alarmVideoData" v-if="alarmData.videoList[0]"></H5PlayerVideo>
+          <img v-if="!alarmData.videoList[0]" style="width:708px;height:450px;" src="@/assets/ZDimages/video_img.png">
         </div>
       </div>
       <audio class="waring_mp3" ref="audioPlayer" playsinline loop muted autoplay>
         <source src="@/assets/video/waringVoice1.mp3" type="audio/mpeg">
       </audio>
     </div>
+    <div class="alarm-position-right-top-box" v-if="alarmData.list[1]">
+      <div class="for-alarm-box" v-for="(item,index) in alarmData.list" :key="index">
+        <p>{{item.alarmData.buildName}} {{item.alarmData.floorName}} {{item.alarmData.roomNum?item.alarmData.subName+'('+item.alarmData.roomNum+')':item.alarmData.subName}} {{item.alarmData.eventName}}</p>
+        <p>负责人：{{item.alarmData.adminPhone?item.alarmData.adminName+'('+item.alarmData.adminPhone+')':item.alarmData.adminName}}</p>
+      </div>
+    </div>
   </div>
 </template>
 <script>
@@ -77,7 +84,6 @@
     methods:{
       openAlarm(){
         let self = this;
-        this.$set(this,'newData',this.alarmData);
         setTimeout(() => {
           /* 报警音频播放 */
           var audio = self.$refs.audioPlayer;
@@ -97,7 +103,7 @@
 </script>
 <style scoped lang="scss">
   .alarmComponent{
-    z-index:10000000;
+    z-index:100000000;
     position: absolute;
     width:100%;
     height:100%;
@@ -136,7 +142,6 @@
         height:450px;
         margin:38px 0 0 94px;
         .alarm-left-box{
-          background-color: #000000;
           width:455px;
           height:450px;
           margin-right:20px;
@@ -153,10 +158,10 @@
                 margin-right:10px;
                 p{
                   margin:3px;
-                  width:59px;
-                  height:26px;
+                  width:57px;
+                  height:25px;
                   text-align: center;
-                  line-height: 26px;
+                  line-height: 25px;
                   color: #fff;
                   border-radius: 50px;
                   border: 1px solid #fff;
@@ -205,6 +210,8 @@
             }
           }
           .alarm-sensor-box{
+            margin-top:14px;
+            display: flex;
             .for-sensor-box:nth-child(2){
               margin:0 11px;
             }
@@ -217,10 +224,11 @@
                 width:118px;
                 height:105px;
                 margin:0 11px;
+                background-image: url("../../../assets/ZDimages/icon_cgq_yc@1x.png");
                 .svg-img{
                   width:32px;
                   height:32px;
-                  margin:36px 0 0 44px;
+                  margin:43px 0 0 43px;
                   color: #FF2105;
                 }
               }
@@ -230,33 +238,35 @@
                 text-align: center;
                 .span-1 {
                   font-size: 24px;
-                  color: #00AC45;
+                  color: #FF2105;
                 }
                 .span-2 {
                   font-size: 24px;
-                  color: #fff;
+                  color: #FF2105;
                 }
                 .span-3 {
                   font-size: 20px;
-                  color: #00AC45;
+                  color: #FF2105;
                 }
               }
               .sensor-name-p {
                 height: 46px;
                 line-height: 46px;
                 text-align: center;
-                color: #fff;
+                color: #FF2105;
                 font-size: 16px;
               }
             }
           }
         }
         .alarm-right-box{
-          background-color: #000000;
           width:708px;
           height:450px;
           overflow: hidden;
           border-radius:4px;
+          .alarm-video-max-big-box{
+
+          }
         }
       }
       .waring_mp3{
@@ -266,5 +276,22 @@
         overflow: hidden;
       }
     }
+    .alarm-position-right-top-box{
+      position: absolute;
+      top:40px;
+      right:40px;
+      overflow: hidden;
+      .for-alarm-box{
+        background-color: rgba(232, 1, 1, 0.4);
+        padding:20px;
+        margin-bottom:30px;
+        p{
+          line-height:30px;
+          width:700px;
+          font-size:18px;
+          color:#FF2105;
+        }
+      }
+    }
   }
 </style>

src/views/components/facilityUtilizationRate.vue

@@ -3,84 +3,267 @@
   <div class="facilityUtilizationRate">
     <titleComponent :titleData="titleData"></titleComponent>
     <div class="eCharts-max-big-top-box">
-      <div class="eCharts-box" id="facilityUtilizationRate-eCharts-1">
-
-      </div>
-      <div class="eCharts-box" id="facilityUtilizationRate-eCharts-2">
-
-      </div>
-      <div class="eCharts-box" id="facilityUtilizationRate-eCharts-3">
-
-      </div>
-      <div class="eCharts-box" id="facilityUtilizationRate-eCharts-4">
-
-      </div>
-      <div class="eCharts-box" id="facilityUtilizationRate-eCharts-5">
-
-      </div>
-      <div class="eCharts-box" id="facilityUtilizationRate-eCharts-6">
-
-      </div>
-    </div>
-    <div class="eCharts-max-big-bottom-box" id="facilityUtilizationRate-eCharts-7">
-
+      <div class="eCharts-box" id="facilityUtilizationRate-eCharts-1"></div>
+      <div class="eCharts-box" id="facilityUtilizationRate-eCharts-2"></div>
+      <div class="eCharts-box" id="facilityUtilizationRate-eCharts-3"></div>
+      <div class="eCharts-box" id="facilityUtilizationRate-eCharts-4"></div>
+      <div class="eCharts-box" id="facilityUtilizationRate-eCharts-5"></div>
+      <div class="eCharts-box" id="facilityUtilizationRate-eCharts-6"></div>
     </div>
+    <div class="eCharts-max-big-bottom-box" id="facilityUtilizationRate-eCharts-7"></div>
+    <div class="position-shade-box"></div>
   </div>
 </template>
 <script>
+  import { dashboardsFacilitiesUsageStats } from '@/api/yiLi'
   import titleComponent from './components/titleComponent.vue'
+
   export default {
     name: 'facilityUtilizationRate',
     components: {
-      titleComponent,
+      titleComponent
     },
     data() {
       return {
-        titleData:{
-          name:'设施使用率及状态统计',
-          text:'Facility utilization rate and status statistics',
+        titleData: {
+          name: '设施使用率及状态统计',
+          text: 'Facility utilization rate and status statistics'
+        },
+        data1: {
+          name: '温室',
+          value: 0,
+          color1: '#FF3131',
+          color2: 'rgba(221, 111, 114, 1)',
+          color3: 'rgba(221, 111, 114, 0.2)'
+        },
+        data2: {
+          name: '温室附属房',
+          value: 0,
+          color1: '#FF8D12',
+          color2: 'rgba(255, 132, 0, 1)',
+          color3: 'rgba(255, 132, 0, 0.2)'
+        },
+        data3: {
+          name: '顶置光型人工气候室',
+          value: 0,
+          color1: '#17C700',
+          color2: 'rgba(104, 231, 88, 1)',
+          color3: 'rgba(104, 231, 88, 0.2)'
+        },
+        data4: {
+          name: '冷库',
+          value: 0,
+          color1: '#0B94F4',
+          color2: 'rgba(65, 177, 255, 1)',
+          color3: 'rgba(65, 177, 255, 0.2)'
+        },
+        data5: {
+          name: '种质资源库',
+          value: 0,
+          color1: '#AE7CF9',
+          color2: 'rgba(180, 130, 255, 1)',
+          color3: 'rgba(180, 130, 255, 0.2)'
+        },
+        data6: {
+          name: '培养架型人工气候室',
+          value: 0,
+          color1: '#00FFFF',
+          color2: 'rgba(68, 255, 255, 1)',
+          color3: 'rgba(68, 255, 255, 0.2)'
         },
-        //eCharts数据
-        eChartsData1:null,
-        eChartsData2:null,
-        eChartsData3:null,
-        eChartsData4:null,
-        eChartsData5:null,
-        eChartsData6:null,
-        eChartsData7:null,
         //学院统计数据
-        newData:{
-          deptName:['学院1','学院2','学院3','学院4','学院5'],
-          list1:[1,2,3,4,5],
-          list2:[2,3,4,5,6],
-          list3:[3,4,5,6,7],
-          list4:[4,5,6,7,8],
-          list5:[5,6,7,8,9],
-          list6:[6,7,8,9,10],
+        newData: {
+          deptName: ['暂无数据'],
+          list1: [0],
+          list2: [0],
+          list3: [0],
+          list4: [0],
+          list5: [0],
+          list6: [0]
         },
+        newList:[],
+        //eCharts数据
+        eChartsData1: null,
+        eChartsData2: null,
+        eChartsData3: null,
+        eChartsData4: null,
+        eChartsData5: null,
+        eChartsData6: null,
+        eChartsData7: null,
         //图标轮播
-        eChartsTimerData:null,
-        eChartsCarouselTime:2000,
-        eChartsCarouselIndex:0,
+        eChartsTimerData: null,
+        eChartsCarouselTime: 20000,
+        eChartsCarouselIndex: 0,
+        eChartsCarouselMaxIndex:0,
+        //定时拉取数据
+        getDataTimer:null,
+        getDataSwitchTime:360000,
       }
     },
     created() {
 
     },
     mounted() {
-      this.demo1();
-      this.eChartsListMethod();
+      this.getDataTimerFunction();
     },
     methods: {
-      demo1(){
-        this.eChartsMethod(this.eChartsData1,{ name:'温室',value:10,color1:'#FF3131',color2:'rgba(221, 111, 114, 1)',color3:'rgba(221, 111, 114, 0.2)' },'facilityUtilizationRate-eCharts-1')
-        this.eChartsMethod(this.eChartsData2,{ name:'温室附属房',value:25,color1:'#FF8D12',color2:'rgba(255, 132, 0, 1)',color3:'rgba(255, 132, 0, 0.2)' },'facilityUtilizationRate-eCharts-2')
-        this.eChartsMethod(this.eChartsData3,{ name:'顶置光型人工气候室',value:40,color1:'#17C700',color2:'rgba(104, 231, 88, 1)',color3:'rgba(104, 231, 88, 0.2)' },'facilityUtilizationRate-eCharts-3')
-        this.eChartsMethod(this.eChartsData4,{ name:'冷库',value:55,color1:'#0B94F4',color2:'rgba(65, 177, 255, 1)',color3:'rgba(65, 177, 255, 0.2)' },'facilityUtilizationRate-eCharts-4')
-        this.eChartsMethod(this.eChartsData5,{ name:'种质资源库',value:70,color1:'#AE7CF9',color2:'rgba(180, 130, 255, 1)',color3:'rgba(180, 130, 255, 0.2)' },'facilityUtilizationRate-eCharts-5')
-        this.eChartsMethod(this.eChartsData6,{ name:'培养架型人工气候室',value:85,color1:'#00FFFF',color2:'rgba(68, 255, 255, 1)',color3:'rgba(68, 255, 255, 0.2)' },'facilityUtilizationRate-eCharts-6')
+      getDataTimerFunction(){
+        this.dashboardsFacilitiesUsageStats();
+        this.getDataTimer = window.setInterval(() => {
+          this.dashboardsFacilitiesUsageStats();
+        }, this.getDataSwitchTime);
       },
-      eChartsMethod(eChartsData,item,boxId) {
+      //设施使用率及二级单位统计
+      dashboardsFacilitiesUsageStats() {
+        let self = this
+        clearInterval(this.eChartsTimerData)
+        dashboardsFacilitiesUsageStats().then(res => {
+          this.$set(this,'eChartsCarouselIndex',0);
+          this.$set(this,'eChartsCarouselMaxIndex',0);
+          if(!res.data.monthlyUsage[0]){
+            this.eChartsMethod(this.eChartsData1, this.data1, 'facilityUtilizationRate-eCharts-1')
+            this.eChartsMethod(this.eChartsData2, this.data2, 'facilityUtilizationRate-eCharts-2')
+            this.eChartsMethod(this.eChartsData3, this.data3, 'facilityUtilizationRate-eCharts-3')
+            this.eChartsMethod(this.eChartsData4, this.data4, 'facilityUtilizationRate-eCharts-4')
+            this.eChartsMethod(this.eChartsData5, this.data5, 'facilityUtilizationRate-eCharts-5')
+            this.eChartsMethod(this.eChartsData6, this.data6, 'facilityUtilizationRate-eCharts-6')
+            return
+          }
+          let max = 0
+          for (let i = 0; i < res.data.monthlyUsage.length; i++) {
+            max = self.precisionAdd(max,res.data.monthlyUsage[i].equCount)
+          }
+          for (let i = 0; i < res.data.monthlyUsage.length; i++) {
+            if (res.data.monthlyUsage[i].equTypeName == '温室') {
+              self.$set(self.data1, 'value', self.calculatePercentage(res.data.monthlyUsage[i].equCount,max,0))
+            } else if (res.data.monthlyUsage[i].equTypeName == '温室附属房') {
+              self.$set(self.data2, 'value', self.calculatePercentage(res.data.monthlyUsage[i].equCount,max,0))
+            } else if (res.data.monthlyUsage[i].equTypeName == '顶置光型人工气候室') {
+              self.$set(self.data3, 'value', self.calculatePercentage(res.data.monthlyUsage[i].equCount,max,0))
+            } else if (res.data.monthlyUsage[i].equTypeName == '冷库') {
+              self.$set(self.data4, 'value', self.calculatePercentage(res.data.monthlyUsage[i].equCount,max,0))
+            } else if (res.data.monthlyUsage[i].equTypeName == '种质资源库') {
+              self.$set(self.data5, 'value', self.calculatePercentage(res.data.monthlyUsage[i].equCount,max,0))
+            } else if (res.data.monthlyUsage[i].equTypeName == '培养架型人工气候室') {
+              self.$set(self.data6, 'value', self.calculatePercentage(res.data.monthlyUsage[i].equCount,max,0))
+            }
+          }
+          this.eChartsMethod(this.eChartsData1, this.data1, 'facilityUtilizationRate-eCharts-1')
+          this.eChartsMethod(this.eChartsData2, this.data2, 'facilityUtilizationRate-eCharts-2')
+          this.eChartsMethod(this.eChartsData3, this.data3, 'facilityUtilizationRate-eCharts-3')
+          this.eChartsMethod(this.eChartsData4, this.data4, 'facilityUtilizationRate-eCharts-4')
+          this.eChartsMethod(this.eChartsData5, this.data5, 'facilityUtilizationRate-eCharts-5')
+          this.eChartsMethod(this.eChartsData6, this.data6, 'facilityUtilizationRate-eCharts-6')
+          if(!res.data.unitStats[0]){
+            this.eChartsListMethod()
+            return
+          }
+          let dataList = ['温室','温室附属房','顶置光型人工气候室','冷库','种质资源库','培养架型人工气候室',];
+          let newData = {
+            deptName: [],
+            list1: [],
+            list2: [],
+            list3: [],
+            list4: [],
+            list5: [],
+            list6: [],
+          }
+          let list = [];
+          for(let i=0;i<res.data.unitStats.length;i++){
+            if(newData.deptName[4]){
+              list.push(JSON.parse(JSON.stringify(newData)))
+              newData = JSON.parse(JSON.stringify({deptName: [],list1: [],list2: [],list3: [],list4: [],list5: [],list6: []}))
+              newData.deptName.push(res.data.unitStats[i].unit);
+              for(let o=0;o<dataList.length;o++){
+                let num = 0;
+                for(let x=0;x<res.data.unitStats[i].types.length;x++){
+                  if(dataList[o] == res.data.unitStats[i].types[x].type){
+                    num++
+                    if(o==0){
+                      newData.list1.push(res.data.unitStats[i].types[x].count);
+                    }else if(o==1){
+                      newData.list2.push(res.data.unitStats[i].types[x].count);
+                    }else if(o==2){
+                      newData.list3.push(res.data.unitStats[i].types[x].count);
+                    }else if(o==3){
+                      newData.list4.push(res.data.unitStats[i].types[x].count);
+                    }else if(o==4){
+                      newData.list5.push(res.data.unitStats[i].types[x].count);
+                    }else if(o==5){
+                      newData.list6.push(res.data.unitStats[i].types[x].count);
+                    }
+                  }
+                }
+                if(num == 0){
+                  if(o==0){
+                    newData.list1.push(0);
+                  }else if(o==1){
+                    newData.list2.push(0);
+                  }else if(o==2){
+                    newData.list3.push(0);
+                  }else if(o==3){
+                    newData.list4.push(0);
+                  }else if(o==4){
+                    newData.list5.push(0);
+                  }else if(o==5){
+                    newData.list6.push(0);
+                  }
+                }
+              }
+            }else{
+              newData.deptName.push(res.data.unitStats[i].unit);
+              for(let o=0;o<dataList.length;o++){
+                let num = 0;
+                for(let x=0;x<res.data.unitStats[i].types.length;x++){
+                  if(dataList[o] == res.data.unitStats[i].types[x].type){
+                    num++
+                    if(o==0){
+                      newData.list1.push(res.data.unitStats[i].types[x].count);
+                    }else if(o==1){
+                      newData.list2.push(res.data.unitStats[i].types[x].count);
+                    }else if(o==2){
+                      newData.list3.push(res.data.unitStats[i].types[x].count);
+                    }else if(o==3){
+                      newData.list4.push(res.data.unitStats[i].types[x].count);
+                    }else if(o==4){
+                      newData.list5.push(res.data.unitStats[i].types[x].count);
+                    }else if(o==5){
+                      newData.list6.push(res.data.unitStats[i].types[x].count);
+                    }
+                  }
+                }
+                if(num == 0){
+                  if(o==0){
+                    newData.list1.push(0);
+                  }else if(o==1){
+                    newData.list2.push(0);
+                  }else if(o==2){
+                    newData.list3.push(0);
+                  }else if(o==3){
+                    newData.list4.push(0);
+                  }else if(o==4){
+                    newData.list5.push(0);
+                  }else if(o==5){
+                    newData.list6.push(0);
+                  }
+                }
+              }
+            }
+          }
+          if(!list[0]){
+            list.push(JSON.parse(JSON.stringify(newData)))
+          }else{
+            if(list[list.length-1] != newData.deptName[newData.deptName.length-1]){
+              list.push(JSON.parse(JSON.stringify(newData)))
+            }
+          }
+          this.$set(this,'newList',list);
+          this.$set(this,'newData',list[0]);
+          this.eChartsListMethod()
+
+        })
+      },
+      eChartsMethod(eChartsData, item, boxId) {
         var maxValue = 100
         let option = {
           title: [{
@@ -99,7 +282,7 @@
             textStyle: {
               fontSize: '28',
               color: item.color1,
-              fontWeight: '400',
+              fontWeight: '400'
             }
           }],
           angleAxis: {
@@ -156,107 +339,121 @@
             roundCap: true,
             z: 1
           }]
-        };
+        }
         eChartsData = this.$echarts.init(document.getElementById(boxId))
         eChartsData.clear()
         eChartsData.setOption(option)
       },
-      eChartsListMethod(){
+      eChartsListMethod() {
+        clearInterval(this.eChartsTimerData)
         let option = {
           legend: {
-            show:false,
+            show: false
           },
           color: [
             {
-            type: 'linear',
-            x: 0,
-            y: 0,
-            x2: 0,
-            y2: 1,
-            colorStops: [{
-              offset: 0,
-              color: 'rgba(221, 111, 114, 1)'
-            }, {
-              offset: 1,
-              color: 'rgba(221, 111, 114, 0.2)'
-            }]
-          },
+              type: 'linear',
+              x: 0,
+              y: 0,
+              x2: 0,
+              y2: 1,
+              colorStops: [{
+                offset: 0,
+                color: 'rgba(221, 111, 114, 1)'
+              }, {
+                offset: 1,
+                color: 'rgba(221, 111, 114, 0.2)'
+              }]
+            },
             {
-            type: 'linear',
-            x: 0,
-            y: 0,
-            x2: 0,
-            y2: 1,
-            colorStops: [{
-              offset: 0,
-              color: 'rgba(255, 132, 0, 1)'
-            }, {
-              offset: 1,
-              color: 'rgba(255, 132, 0, 0.2)'
-            }]
-          },
+              type: 'linear',
+              x: 0,
+              y: 0,
+              x2: 0,
+              y2: 1,
+              colorStops: [{
+                offset: 0,
+                color: 'rgba(255, 132, 0, 1)'
+              }, {
+                offset: 1,
+                color: 'rgba(255, 132, 0, 0.2)'
+              }]
+            },
             {
-            type: 'linear',
-            x: 0,
-            y: 0,
-            x2: 0,
-            y2: 1,
-            colorStops: [{
-              offset: 0,
-              color: 'rgba(104, 231, 88, 1)'
-            }, {
-              offset: 1,
-              color: 'rgba(104, 231, 88, 0.2)'
-            }]
-          },
+              type: 'linear',
+              x: 0,
+              y: 0,
+              x2: 0,
+              y2: 1,
+              colorStops: [{
+                offset: 0,
+                color: 'rgba(104, 231, 88, 1)'
+              }, {
+                offset: 1,
+                color: 'rgba(104, 231, 88, 0.2)'
+              }]
+            },
             {
-            type: 'linear',
-            x: 0,
-            y: 0,
-            x2: 0,
-            y2: 1,
-            colorStops: [{
-              offset: 0,
-              color: 'rgba(65, 177, 255, 1)'
-            }, {
-              offset: 1,
-              color: 'rgba(65, 177, 255, 0.2)'
-            }]
-          },
+              type: 'linear',
+              x: 0,
+              y: 0,
+              x2: 0,
+              y2: 1,
+              colorStops: [{
+                offset: 0,
+                color: 'rgba(65, 177, 255, 1)'
+              }, {
+                offset: 1,
+                color: 'rgba(65, 177, 255, 0.2)'
+              }]
+            },
             {
-            type: 'linear',
-            x: 0,
-            y: 0,
-            x2: 0,
-            y2: 1,
-            colorStops: [{
-              offset: 0,
-              color: 'rgba(180, 130, 255, 1)'
-            }, {
-              offset: 1,
-              color: 'rgba(180, 130, 255, 0.2)'
-            }]
-          },
+              type: 'linear',
+              x: 0,
+              y: 0,
+              x2: 0,
+              y2: 1,
+              colorStops: [{
+                offset: 0,
+                color: 'rgba(180, 130, 255, 1)'
+              }, {
+                offset: 1,
+                color: 'rgba(180, 130, 255, 0.2)'
+              }]
+            },
             {
-            type: 'linear',
-            x: 0,
-            y: 0,
-            x2: 0,
-            y2: 1,
-            colorStops: [{
-              offset: 0,
-              color: 'rgba(68, 255, 255, 1)'
-            }, {
-              offset: 1,
-              color: 'rgba(68, 255, 255, 0.2)'
-            }]
-          },
+              type: 'linear',
+              x: 0,
+              y: 0,
+              x2: 0,
+              y2: 1,
+              colorStops: [{
+                offset: 0,
+                color: 'rgba(68, 255, 255, 1)'
+              }, {
+                offset: 1,
+                color: 'rgba(68, 255, 255, 0.2)'
+              }]
+            }
           ],
           //浮窗
           tooltip: {
-            trigger: "axis",
+            trigger: 'axis',
+            position: (data) => {
+              if(this.eChartsCarouselIndex == 0){
+                return [162,50]
+              }else if(this.eChartsCarouselIndex == 1){
+                return [291,50]
+              }else if(this.eChartsCarouselIndex == 2){
+                return [420,50]
+              }else if(this.eChartsCarouselIndex == 3){
+                return [549,50]
+              }else if(this.eChartsCarouselIndex == 4){
+                return [457,50]
+              }
+            },
             axisPointer: {
-              type: "shadow"
+              type: 'shadow'
             },
             // 自定义提示框内容
             formatter: (data) => {
@@ -271,25 +468,25 @@
               return str
             },
             textStyle: {
-              color: "#ffffff",
-              fontSize: 16,
+              color: '#ffffff',
+              fontSize: 16
             },
-            backgroundColor: "rgba(0,0,0,0.7)",
-            borderColor: "rgba(0,0,0,0.7)",
+            backgroundColor: 'rgba(0,0,0,0.7)',
+            borderColor: 'rgba(0,0,0,0.7)'
           },
           grid: {
             left: '10%',
             right: '10%',
             top: '10%',
             bottom: '10%',
-            containLabel: true,
+            containLabel: true
           },
           xAxis: {
             //学院名称
             data: this.newData.deptName,
             axisLabel: {
-              color: "#fff",
-              fontSize: 16,
+              color: '#fff',
+              fontSize: 16
             },
             axisLine: {
               lineStyle: {
@@ -299,19 +496,19 @@
             },
             axisTick: {
               show: false
-            },
+            }
           },
           yAxis: {
             name: '',
             axisLabel: {
-              color: "#ffffff",
-              fontSize: 14,
+              color: '#ffffff',
+              fontSize: 14
             },
             axisLine: {
-              show:true,
+              show: true,
               lineStyle: {
                 color: '#fff',
-                type: 'solid',
+                type: 'solid'
               }
             },
             splitLine: {
@@ -320,165 +517,235 @@
                 color: ['rgba(65,164,255,0.3)'],
                 width: 1,
                 type: 'dashed'
-              },
-            },
+              }
+            }
           },
           series: [
             //温室
             {
-              name: "温室",
-              type: "bar",
-              stack: "total",
+              name: '温室',
+              type: 'bar',
+              stack: 'total',
               label: {
                 show: false,
-                color: "#FFFFFF",
-                formatter: "{a}",
+                color: '#FFFFFF',
+                formatter: '{a}'
               },
               emphasis: {
-                focus: "series",
+                focus: 'series'
               },
               barWidth: 16,
-              data: this.newData.list1,
+              data: this.newData.list1
             },
             //温室附属房
             {
-              name: "温室附属房",
-              type: "bar",
-              stack: "total",
+              name: '温室附属房',
+              type: 'bar',
+              stack: 'total',
               label: {
                 show: false,
-                color: "#FFFFFF",
-                formatter: "{a}",
+                color: '#FFFFFF',
+                formatter: '{a}'
               },
               emphasis: {
-                focus: "series",
+                focus: 'series'
               },
               barWidth: 16,
-              data: this.newData.list2,
+              data: this.newData.list2
             },
             //顶置光型人工气候室
             {
-              name: "顶置光型人工气候室",
-              type: "bar",
-              stack: "total",
+              name: '顶置光型人工气候室',
+              type: 'bar',
+              stack: 'total',
               label: {
                 show: false,
-                color: "#FFFFFF",
-                formatter: "{a}",
+                color: '#FFFFFF',
+                formatter: '{a}'
               },
               emphasis: {
-                focus: "series",
+                focus: 'series'
               },
               barWidth: 16,
-              data: this.newData.list3,
+              data: this.newData.list3
             },
             //冷库
             {
-              name: "冷库",
-              type: "bar",
-              stack: "total",
+              name: '冷库',
+              type: 'bar',
+              stack: 'total',
               label: {
                 show: false,
-                color: "#FFFFFF",
-                formatter: "{a}",
+                color: '#FFFFFF',
+                formatter: '{a}'
               },
               emphasis: {
-                focus: "series",
+                focus: 'series'
               },
               barWidth: 16,
-              data: this.newData.list4,
+              data: this.newData.list4
             },
             //种质资源库
             {
-              name: "种质资源库",
-              type: "bar",
-              stack: "total",
+              name: '种质资源库',
+              type: 'bar',
+              stack: 'total',
               label: {
                 show: false,
-                color: "#FFFFFF",
-                formatter: "{a}",
+                color: '#FFFFFF',
+                formatter: '{a}'
               },
               emphasis: {
-                focus: "series",
+                focus: 'series'
               },
               barWidth: 16,
-              data: this.newData.list5,
+              data: this.newData.list5
             },
             //培养架型人工气候室
             {
-              name: "培养架型人工气候室",
-              type: "bar",
-              stack: "total",
+              name: '培养架型人工气候室',
+              type: 'bar',
+              stack: 'total',
               label: {
                 show: false,
-                color: "#FFFFFF",
-                formatter: "{a}",
+                color: '#FFFFFF',
+                formatter: '{a}'
               },
               emphasis: {
-                focus: "series",
+                focus: 'series'
               },
               barWidth: 16,
-              data: this.newData.list6,
-            },
-          ],
-        };
+              data: this.newData.list6
+            }
+          ]
+        }
         this.eChartsData7 = this.$echarts.init(document.getElementById('facilityUtilizationRate-eCharts-7'))
         this.eChartsData7.clear()
         this.eChartsData7.setOption(option)
-        this.eChartsTimer();
+        this.eChartsTimer()
       },
-      eChartsTimer(){
-        let self = this;
-        self.eChartsTimerData = window.setInterval(eChartsCarousel, this.eChartsCarouselTime);
-        async function eChartsCarousel() {
-          self.eChartsData7.dispatchAction({
-            type: 'showTip',
-            seriesIndex: 0,
-            dataIndex: self.eChartsCarouselIndex
-          });
-          if(self.eChartsCarouselIndex<self.newData.deptName.length-1){
+      eChartsTimer() {
+        let self = this
+        self.eChartsData7.dispatchAction({
+          type: 'showTip',
+          seriesIndex: 0,
+          dataIndex: self.eChartsCarouselIndex
+        })
+        self.eChartsTimerData = window.setInterval(() => {
+          eChartsCarousel()
+        }, this.eChartsCarouselTime)
+        function eChartsCarousel() {
+          if (self.eChartsCarouselIndex < self.newData.deptName.length-1) {
             self.eChartsCarouselIndex++
-          }else{
-            self.$set(self,'eChartsCarouselIndex',0);
+            self.eChartsData7.dispatchAction({
+              type: 'showTip',
+              seriesIndex: 0,
+              dataIndex: self.eChartsCarouselIndex
+            })
+          } else {
+            self.$set(self, 'eChartsCarouselIndex', 0)
+            if(self.newList[self.eChartsCarouselMaxIndex+1]){
+              self.eChartsCarouselMaxIndex++
+            }else{
+              self.$set(self, 'eChartsCarouselMaxIndex', 0)
+            }
+            if(self.newList[0]){
+              self.$set(self,'newData',self.newList[self.eChartsCarouselMaxIndex]);
+              self.eChartsMethod(self.eChartsData1, self.data1, 'facilityUtilizationRate-eCharts-1')
+              self.eChartsMethod(self.eChartsData2, self.data2, 'facilityUtilizationRate-eCharts-2')
+              self.eChartsMethod(self.eChartsData3, self.data3, 'facilityUtilizationRate-eCharts-3')
+              self.eChartsMethod(self.eChartsData4, self.data4, 'facilityUtilizationRate-eCharts-4')
+              self.eChartsMethod(self.eChartsData5, self.data5, 'facilityUtilizationRate-eCharts-5')
+              self.eChartsMethod(self.eChartsData6, self.data6, 'facilityUtilizationRate-eCharts-6')
+              self.eChartsListMethod()
+            }
           }
         }
       },
+      // 处理浮点数精度的加法
+      precisionAdd(num1, num2) {
+        const multiplier = Math.pow(10, Math.max(this.getDecimalPlaces(num1), this.getDecimalPlaces(num2)));
+        return (Math.round(num1 * multiplier) + Math.round(num2 * multiplier)) / multiplier;
+      },
+      // 高精度百分比计算
+      calculatePercentage(value, total, decimalPlaces) {
+        // 使用高精度计算方法：先乘后除，减少精度损失
+        const percentage = this.precisionMultiply(value / total, 100);
+
+        if (decimalPlaces === 0) {
+          // 保留整数（四舍五入）
+          return Math.round(percentage);
+        } else {
+          // 保留小数
+          // 使用高精度toFixed替代方法
+          const factor = Math.pow(10, decimalPlaces);
+          const rounded = Math.round(percentage * factor) / factor;
+
+          // 确保小数点后位数正确
+          return rounded.toFixed(decimalPlaces);
+        }
+      },
+      // 处理浮点数精度的乘法
+      precisionMultiply(num1, num2) {
+        const num1DecimalPlaces = this.getDecimalPlaces(num1);
+        const num2DecimalPlaces = this.getDecimalPlaces(num2);
+        const multiplier = Math.pow(10, num1DecimalPlaces + num2DecimalPlaces);
+        return (Math.round(num1 * Math.pow(10, num1DecimalPlaces)) *
+          Math.round(num2 * Math.pow(10, num2DecimalPlaces))) / multiplier;
+      },
+      // 获取数字的小数位数
+      getDecimalPlaces(num) {
+        const str = num.toString();
+        const decimalIndex = str.indexOf('.');
+        return decimalIndex === -1 ? 0 : str.length - decimalIndex - 1;
+      },
     },
     beforeDestroy() {
       //清除定时器
-      clearInterval(this.eChartsTimerData);
-    },
+      clearInterval(this.getDataTimer);
+      clearInterval(this.eChartsTimerData)
+    }
+    ,
     destroyed() {
       //清除定时器
-      clearInterval(this.eChartsTimerData);
+      clearInterval(this.getDataTimer);
+      clearInterval(this.eChartsTimerData)
     }
   }
 </script>
 <style scoped lang="scss">
   .facilityUtilizationRate {
-    width:826px;
-    height:937px;
-    margin-top:21px;
+    width: 826px;
+    height: 937px;
+    margin-top: 21px;
     background-image: url("../../assets/ZDimages/img_sssyljzttj_bg@1x.png");
     background-size: 100% 100%;
     position: relative;
     overflow: hidden;
-    .eCharts-max-big-top-box{;
-      width:801px;
-      height:432px;
-      margin:42px 12px 0;
+    .eCharts-max-big-top-box {
+      width: 801px;
+      height: 432px;
+      margin: 42px 12px 0;
       overflow: hidden;
-      .eCharts-box{
+      .eCharts-box {
         display: inline-block;
-        width:267px;
-        height:216px;
+        width: 267px;
+        height: 216px;
         overflow: hidden;
       }
     }
-    .eCharts-max-big-bottom-box{
-      width:826px;
-      height:402px;
+    .eCharts-max-big-bottom-box {
+      width: 826px;
+      height: 402px;
       overflow: hidden;
     }
+    .position-shade-box{
+      width: 826px;
+      height: 937px;
+      position: absolute;
+      top:0;
+      left:0;
+      z-index:1;
+    }
   }
 </style>

src/views/components/headComponent.vue

@@ -43,7 +43,9 @@
       timeFunction(){
         let self = this;
         this.laboratoryWsBigViewGetTimeData();
-        this.timer = window.setInterval(self.laboratoryWsBigViewGetTimeData, 30000);
+        this.timer = window.setInterval(() => {
+          self.laboratoryWsBigViewGetTimeData();
+        }, 30000);
       },
       laboratoryWsBigViewGetTimeData(){
         laboratoryWsBigViewGetTimeData().then(res => {
@@ -54,7 +56,9 @@
       weatherFunction(){
         let self = this;
         this.laboratoryWsBigViewGetWeatherData();
-        this.weatherTimer = window.setInterval(self.laboratoryWsBigViewGetWeatherData, 360000);
+        this.weatherTimer = window.setInterval(() => {
+          self.laboratoryWsBigViewGetWeatherData();
+        }, 360000);
       },
       laboratoryWsBigViewGetWeatherData(){
         laboratoryWsBigViewGetWeatherData().then(res => {

src/views/components/overviewOfFacilityData.vue

@@ -16,9 +16,11 @@
       <p>总计</p>
       <p>{{maxNum}}</p>
     </div>
+    <img class="position-img" src="@/assets/ZDimages/719@1x.png">
   </div>
 </template>
 <script>
+  import { dashboardsFacilitiesTypeOverview } from "@/api/yiLi";
   import titleComponent from './components/titleComponent.vue'
   export default {
     name: 'overviewOfFacilityData',
@@ -31,61 +33,79 @@
           name:'设施数据概览',
           text:'Overview of facility data',
         },
-        optionsData:[
+        optionsData:[],
+        maxNum:0,
+        echartsBox1: null,
+        //定时拉取数据
+        getDataTimer:null,
+        getDataSwitchTime:3600000,
+      }
+    },
+    created() {
+
+    },
+    mounted() {
+      this.getDataTimerFunction();
+    },
+    methods: {
+      dashboardsFacilitiesTypeOverview(){
+        let list = [
           {
             name: '温室',
-            value: 110,
+            value: 0,
             itemStyle: {
               color: 'rgba(221, 111, 114, 1)'
             }
           },
           {
             name: '温室附属房',
-            value: 200,
+            value: 0,
             itemStyle: {
               color: 'rgba(255, 132, 0, 1)'
             }
           },
           {
             name: '顶置光型人工气候室',
-            value: 190,
+            value: 0,
             itemStyle: {
               color: 'rgba(104, 231, 88, 1)'
             }
           },
           {
             name: '冷库',
-            value: 190,
+            value: 0,
             itemStyle: {
               color: 'rgba(65, 177, 255, 1)'
             }
           },
           {
             name: '种质资源库',
-            value: 190,
+            value: 0,
             itemStyle: {
               color: 'rgba(180, 130, 255, 1)'
             }
           },
           {
             name: '培养架型人工气候室',
-            value: 190,
+            value: 0,
             itemStyle: {
               color: 'rgba(68, 255, 255, 1)'
             }
           }
-        ],
-        maxNum:900,
-        echartsBox1: null
-      }
-    },
-    created() {
-
-    },
-    mounted() {
-      this.eChartsMethod();
-    },
-    methods: {
+        ];
+        dashboardsFacilitiesTypeOverview().then(res => {
+          for(let i=0;i<res.data.types.length;i++){
+            for(let o=0;o<list.length;o++){
+              if(res.data.types[i].type == list[o].name){
+                list[o].value = res.data.types[i].count
+              }
+            }
+          }
+          this.$set(this,'maxNum',res.data.total);
+          this.$set(this,'optionsData',list);
+          this.eChartsMethod();
+        })
+      },
       eChartsMethod() {
         let self = this;
         // 生成扇形的曲面参数方程，用于 series-surface.parametricEquation
@@ -443,7 +463,7 @@
               distance: 220,
               alpha: 30,
               beta: 15,
-              autoRotate: false, // 自动旋转
+              autoRotate: true, // 自动旋转
               rotateSensitivity: 1,
               zoomSensitivity: 0,
               panSensitivity: 0
@@ -455,6 +475,20 @@
         this.echartsBox1.clear()
         this.echartsBox1.setOption(option)
       },
+      getDataTimerFunction(){
+        this.dashboardsFacilitiesTypeOverview();
+        this.getDataTimer = window.setInterval(() => {
+          this.dashboardsFacilitiesTypeOverview();
+        }, this.getDataSwitchTime);
+      },
+    },
+    beforeDestroy() {
+      //清除定时器
+      clearInterval(this.getDataTimer);
+    },
+    destroyed() {
+      //清除定时器
+      clearInterval(this.getDataTimer);
     }
   }
 </script>
@@ -525,5 +559,12 @@
         color: transparent;
       }
     }
+    .position-img{
+      position: absolute;
+      top: 130px;
+      left: 55px;
+      z-index: 0;
+      width: 390px;
+    }
   }
 </style>

src/views/components/personnelEntryRecord.vue

@@ -40,13 +40,16 @@
           evenRowBGC: 'rgba(0,0,0,0.1)',
           data: []
         },
+        //定时拉取数据
+        getDataTimer:null,
+        getDataSwitchTime:300000,
       }
     },
     created(){
 
     },
     mounted(){
-      this.laboratoryWsBigViewGetSafeAccessData();
+      this.getDataTimerFunction();
     },
     methods:{
       laboratoryWsBigViewGetSafeAccessData(){
@@ -66,7 +69,22 @@
           this.$set(this.config,'data',list);
         })
       },
+      getDataTimerFunction(){
+        this.laboratoryWsBigViewGetSafeAccessData();
+        this.getDataTimer = window.setInterval(() => {
+          this.laboratoryWsBigViewGetSafeAccessData();
+        }, this.getDataSwitchTime);
+      },
+
     },
+    beforeDestroy() {
+      //清除定时器
+      clearInterval(this.getDataTimer);
+    },
+    destroyed() {
+      //清除定时器
+      clearInterval(this.getDataTimer);
+    }
   }
 </script>
 <style scoped lang="scss">

src/views/components/scientificResearchProject.vue

@@ -9,10 +9,12 @@
         <div class="right-bottom-big-box" id="scientificResearchProject-eCharts-3"></div>
       </div>
       <p class="position-top-right-p">{{pieNum}}</p>
+      <img class="position-img" src="@/assets/ZDimages/705@1x.png">
     </div>
   </div>
 </template>
 <script>
+  import { dashboardsResearchProjects } from '@/api/yiLi'
   import titleComponent from './components/titleComponent.vue'
 
   export default {
@@ -30,101 +32,126 @@
         eChartsData2: null,
         eChartsData3: null,
         //柱状图数据
-        borderValueList: [
-          { value: 100 },
-          { value: 100 },
-          { value: 100 },
-          { value: 100 },
-          { value: 100 },
-          { value: 100 },
-          { value: 100 },
-          { value: 100 }
-        ],
-        numValueList: [
-          { value: 50 },
-          { value: 50 },
-          { value: 50 },
-          { value: 50 },
-          { value: 100 },
-          { value: 50 },
-          { value: 50 },
-          { value: 50 }
-        ],
-        nameValueList: [
-          { value: '农学院' },
-          { value: '资环学院' },
-          { value: '植保学院' },
-          { value: '水保学院' },
-          { value: '国重实验室' },
-          { value: '动科学院' },
-          { value: '水建学院' },
-          { value: '党政综合办公' }
-        ],
+        barMaxList:[],
+        barList:[],
         //饼图数据
-        pieData: [
-          {
-            value: 80,
-            name: '国家级'
-          }, {
-            value: 70,
-            name: '省部级'
-          }, {
-            value: 60,
-            name: '厅局级'
-          }, {
-            value: 50,
-            name: '县市区级'
-          }, {
-            value: 40,
-            name: '校级'
-          }, {
-            value: 30,
-            name: '横向'
-          }, {
-            value: 20,
-            name: '其他'
-          }
-        ],
-        pieNum: '9999',
+        pieData: [],
+        pieNum: '0',
         //雷达图数据--雷达图默认逆时针排序 所以数据需要倒序
-        radarNameList: [
-          {
-            max: 100,
-            name: '其他'
-          }, {
-            max: 100,
-            name: '横向'
-          }, {
-            max: 100,
-            name: '校级'
-          }, {
-            max: 100,
-            name: '县市区级'
-          }, {
-            max: 100,
-            name: '厅局级'
-          }, {
-            max: 100,
-            name: '省部级'
-          },
-          {
-            max: 100,
-            name: '国家级'
-          }
-        ],
-        radarDataList: [20, 30, 40, 50, 60, 70, 80]
+        radarNameList: [],
+        radarDataList: [],
+        //图标轮播
+        eChartsTimerData: null,
+        eChartsCarouselTime: 20000,
+        eChartsCarouselIndex: 0,
+        //定时拉取数据
+        getDataTimer: null,
+        getDataSwitchTime: 360000
       }
     },
     created() {
 
     },
     mounted() {
-      this.eChartsMethod2()
-      this.eChartsMethod3()
-      this.eChartsMethod1(this.borderValueList, this.numValueList, this.nameValueList)
+      this.getDataTimerFunction()
+
+      this.eChartsMethod1()
     },
     methods: {
-      eChartsMethod1(borderValueList, numValueList, nameValueList) {
+      getDataTimerFunction() {
+        this.dashboardsResearchProjects()
+        this.getDataTimer = window.setInterval(() => {
+          this.dashboardsResearchProjects()
+        }, this.getDataSwitchTime)
+      },
+      //科研项目情况概览
+      dashboardsResearchProjects() {
+        clearInterval(this.eChartsTimerData)
+        dashboardsResearchProjects().then(res => {
+          this.$set(this,'eChartsCarouselIndex',0);
+          //柱状图
+          let maxList = []
+          let list = []
+          for (let i = 0; i < res.data.collages.length; i++) {
+            if (list[7]) {
+              maxList.push(JSON.parse(JSON.stringify(list)))
+              list = []
+              list.push({
+                name: res.data.collages[i].type,
+                value: res.data.collages[i].count
+              })
+            } else {
+              list.push({
+                name: res.data.collages[i].type,
+                value: res.data.collages[i].count
+              })
+            }
+          }
+          if (!maxList[0]) {
+            maxList.push(JSON.parse(JSON.stringify(list)))
+          } else {
+            if (maxList[maxList.length - 1].name != list[list.length - 1].name) {
+              maxList.push(JSON.parse(JSON.stringify(list)))
+            }
+          }
+          this.$set(this, 'barMaxList', maxList)
+          this.$set(this, 'barList', maxList[0])
+          //雷达图/饼图
+          this.$set(this, 'pieNum', res.data.totalProjects)
+          let max = 0
+          for (let i = 0; i < res.data.projectLevels.length; i++) {
+            if (res.data.projectLevels[i].count > max) {
+              max = res.data.projectLevels[i].count
+            }
+          }
+          max = this.precisionAdd(max, this.preciseDivide(max, 6))
+          //雷达图数据
+          let radarNameList = []
+          let radarDataList = []
+          //饼图数据
+          let pieData = []
+          for (let i = 0; i < res.data.projectLevels.length; i++) {
+            radarNameList.unshift({
+              max: max,
+              name: res.data.projectLevels[i].type
+            })
+            radarDataList.unshift(res.data.projectLevels[i].count)
+            pieData.push({
+              value: res.data.projectLevels[i].count,
+              name: res.data.projectLevels[i].type
+            })
+          }
+          this.$set(this, 'radarNameList', radarNameList)
+          this.$set(this, 'radarDataList', radarDataList)
+          this.$set(this, 'pieData', pieData)
+          if(maxList[0]){
+            this.eChartsMethod1()
+          }
+          if(pieData[0]){
+            this.eChartsMethod2()
+            this.eChartsMethod3()
+          }
+        })
+      },
+      eChartsMethod1() {
+        let self = this;
+        clearInterval(this.eChartsTimerData)
+        let borderValueList = [
+          { value: 100 },
+          { value: 100 },
+          { value: 100 },
+          { value: 100 },
+          { value: 100 },
+          { value: 100 },
+          { value: 100 },
+          { value: 100 }
+        ]
+        let numValueList = []
+        let nameValueList = []
+        for (let i=0;i<self.barList.length;i++) {
+          nameValueList.push(self.barList[i].name)
+          numValueList.push(self.barList[i].value)
+        }
         let { borderData, total, numData, nameData } = {
           borderData: borderValueList,
           total: 100,
@@ -286,6 +313,26 @@
         this.eChartsData1 = this.$echarts.init(document.getElementById('scientificResearchProject-eCharts-1'))
         this.eChartsData1.clear()
         this.eChartsData1.setOption(option)
+        this.eChartsTimer()
+      },
+      eChartsTimer() {
+        let self = this
+        self.eChartsTimerData = window.setInterval(() => {
+          eChartsCarousel()
+        }, this.eChartsCarouselTime)
+        function eChartsCarousel() {
+          if (self.eChartsCarouselIndex < self.barMaxList.length-1) {
+            self.eChartsCarouselIndex++
+          }else{
+            self.$set(self, 'eChartsCarouselIndex', 0)
+          }
+          if(self.barList[0]){
+            self.$set(self,'barList',self.barMaxList[self.eChartsCarouselIndex]);
+            self.eChartsMethod1();
+            self.eChartsMethod2();
+            self.eChartsMethod3();
+          }
+        }
       },
       eChartsMethod2() {
         const colorList = ['#00B312', '#FFE019', '#FF9718', '#109BFF', '#00FFFF', '#9956FF', '#FF5D5D']
@@ -579,7 +626,34 @@
         this.eChartsData3 = this.$echarts.init(document.getElementById('scientificResearchProject-eCharts-3'))
         this.eChartsData3.clear()
         this.eChartsData3.setOption(option)
+      },
+      // 处理浮点数精度的加法
+      precisionAdd(num1, num2) {
+        const multiplier = Math.pow(10, Math.max(this.getDecimalPlaces(num1), this.getDecimalPlaces(num2)))
+        return (Math.round(num1 * multiplier) + Math.round(num2 * multiplier)) / multiplier
+      },
+      // 获取数字的小数位数
+      getDecimalPlaces(num) {
+        const str = num.toString()
+        const decimalIndex = str.indexOf('.')
+        return decimalIndex === -1 ? 0 : str.length - decimalIndex - 1
+      },
+      preciseDivide(dividend, divisor) {
+        const dividendStr = dividend.toString()
+        const divisorStr = divisor.toString()
+        const dividendDecimals = dividendStr.includes('.') ? dividendStr.split('.')[1].length : 0
+        const divisorDecimals = divisorStr.includes('.') ? divisorStr.split('.')[1].length : 0
+        const maxDecimals = Math.max(dividendDecimals, divisorDecimals)
+        const adjustedDividend = parseInt(dividendStr.replace('.', ''), 10) * Math.pow(10, maxDecimals - dividendDecimals)
+        const adjustedDivisor = parseInt(divisorStr.replace('.', ''), 10) * Math.pow(10, maxDecimals - divisorDecimals)
+        const result = adjustedDividend / adjustedDivisor
+        return result / Math.pow(10, maxDecimals * 2)
       }
+    },
+    destroyed() {
+      //清除定时器
+      clearInterval(this.getDataTimer)
+      clearInterval(this.eChartsTimerData)
     }
   }
 </script>
@@ -613,6 +687,7 @@
         }
       }
       .position-top-right-p {
+        z-index: 2;
         width: 100px;
         position: absolute;
         top: 145px;
@@ -627,6 +702,12 @@
         color: transparent;
         font-family: Alimama ShuHeiTi, Alimama ShuHeiTi;
       }
+      .position-img {
+        z-index: 1;
+        position: absolute;
+        top: 111px;
+        right: 178px;
+      }
     }
   }
 </style>

src/views/components/videoSurveillance.vue

@@ -37,6 +37,7 @@
         videoUrlList:[],
         videoType:false,
         videoNullType:false,
+        num:0,
       }
     },
     created(){
@@ -46,17 +47,26 @@
       this.dashboardsMonitorConfig();
     },
     methods:{
+      //拉取数据
       dashboardsMonitorConfig(){
+        clearInterval(this.videoTimer);
         dashboardsMonitorConfig().then(res => {
-          // this.$set(this,'videoRooms',res.data.rooms);
-          this.$set(this,'videoRooms',[]);
-          this.checkSubUpdates();
+          this.$set(this,'videoCheckIndex',0);
+          let list = res.data.rooms?res.data.rooms:[];
+          for(let i=0;i<list.length;i++){
+            list[0].subId = list[0].LabId
+          }
+          this.$set(this,'videoRooms',list);
           this.videoTimerFunction();
         })
       },
       videoTimerFunction(){
-        this.videoTimer = window.setInterval(this.checkSubUpdates, this.videoSwitchTime);
+        this.checkSubUpdates();
+        this.videoTimer = window.setInterval(() => {
+          this.checkSubUpdates();
+        }, this.videoSwitchTime);
       },
+      //切换
       checkSubUpdates() {
         const self = this;
         self.$set(self,'videoType',false);
@@ -70,19 +80,32 @@
             subIdList.push(self.videoRooms[self.videoCheckIndex].subId)
           }
         }else{
-          self.$set(self,'videoCheckIndex',0);
-          if(self.videoRooms[self.videoCheckIndex]){
-            subIdList.push(self.videoRooms[self.videoCheckIndex].subId)
-            if(self.videoRooms[self.videoCheckIndex+1]){
-              subIdList.push(self.videoRooms[self.videoCheckIndex+1].subId)
-            }else{
-              subIdList.push(self.videoRooms[self.videoCheckIndex].subId)
-            }
-          }else{
+          if(self.videoRooms[0]){
             self.$set(self,'videoNullType',true);
-            return
+            self.dashboardsMonitorConfig();
+          }else{
+            setTimeout(function() {
+              self.dashboardsMonitorConfig();
+            },10000)
           }
         }
+        //   self.$set(self,'videoCheckIndex',0);
+        //   if(self.videoRooms[self.videoCheckIndex]){
+        //     subIdList.push(self.videoRooms[self.videoCheckIndex].subId)
+        //     if(self.videoRooms[self.videoCheckIndex+1]){
+        //       subIdList.push(self.videoRooms[self.videoCheckIndex+1].subId)
+        //     }else{
+        //       subIdList.push(self.videoRooms[self.videoCheckIndex].subId)
+        //     }
+        //   }else{
+        //     self.$set(self,'videoNullType',true);
+        //     return
+        //   }
+        // }
+        if(!subIdList[0]){
+          self.$set(self,'videoNullType',true);
+          return
+        }
         let videoObj = {
           page:'1',
           pageSize:'10',

src/views/home.vue

@@ -66,6 +66,10 @@
         roomList:[],
         alarmType:false,
         alarmData:null,
+        //预案查询定时器
+        alarmTimer:null,
+        //预案查询定时
+        alarmSwitchTime:60000,
       }
     },
     created(){
@@ -127,6 +131,8 @@
           }
           this.$set(this, 'showPage', true)
           this.laboratoryBigViewSelectTriggerInfo();
+          //开启预案定时查询
+          this.alarmTimerFunction();
         })
       },
       /*************** 获取报警相关 ***************/
@@ -145,8 +151,13 @@
       dashboardsResearchUsage(list){
         dashboardsResearchUsage('roomNames='+list[0].roomNumName).then(res => {
           let obj = list[0];
+          obj.list = JSON.parse(JSON.stringify(list));
           if(res.data[0]){
             obj = {...obj,...res.data[0]};
+            obj.status = obj.runningStateName == '维修' ? '3':(obj.stateName == '租用'?'2':'1')
+            //假数据
+            obj.monitorVisable = true;
+            obj.subId = '1955554621449019392';
             this.iotSensorFindBySubId(obj);
           }
         });
@@ -154,22 +165,20 @@
       //查询传感器
       iotSensorFindBySubId(obj){
         let self = this;
-        //假数据
-        obj.monitorVisable = true;
-        obj.subId = '1955554621449019392';
         iotSensorFindBySubId({subId:obj.subId}).then(response => {
           obj.sensor = [];
           for(let i=0;i<obj.alarmData.triggerUploadData.length;i++){
             for(let o=0;o<response.data.length;o++){
               if(obj.alarmData.triggerUploadData[i].deviceNo == response.data[o].deviceNo){
                 response.data[i].icon = response.data[i].icon?localStorage.getItem('fileBrowseEnvironment')+response.data[i].icon:null;
+                // response.data[i].icon = 'http://192.168.1.8/statics/2025/08/25/9eec5108-2702-4ed0-942a-aced71fd1f57.svg';
                 obj.sensor.push(response.data[i])
               }
             }
           }
+          obj.videoList = [];
           //查询实验室监控
           if(obj.monitorVisable){
-            obj.videoList = [];
             let videoObj = {
               page:'1',
               pageSize:'10',
@@ -202,12 +211,22 @@
           }
         });
       },
+      //预案查询定时器
+      alarmTimerFunction(){
+        const self = this;
+        self.alarmTimer = window.setInterval(() => {
+          checkAlarmUpdates();
+        }, this.alarmSwitchTime);
+        async function checkAlarmUpdates() {
+          self.laboratoryBigViewSelectTriggerInfo();
+        }
+      },
     },
     beforeDestroy() {
-
+      clearInterval(this.alarmTimer);
     },
     destroyed() {
-
+      clearInterval(this.alarmTimer);
     }
   }
 </script>