zc

src/api/index.js

@@ -160,3 +160,27 @@ export function reportReportBigDataCountStatistics (query) {
     params: query
   })
 }
+//人员设备安全
+export function reportReportBigDataPersonDeviceSafety (query) {
+  return request({
+    url: '/report/report/bigData/personDeviceSafety',
+    method: 'get',
+    params: query
+  })
+}
+//安全隐患分布
+export function reportReportBigDataDangerDistribution (query) {
+  return request({
+    url: '/report/report/bigData/dangerDistribution',
+    method: 'get',
+    params: query
+  })
+}
+//安全隐患排行
+export function reportReportBigDataDangerSort (query) {
+  return request({
+    url: '/report/report/bigData/dangerSort',
+    method: 'get',
+    params: query
+  })
+}

src/assets/styles/index.scss

@@ -1,6 +1,9 @@
 @import './element/element-ui';
 
-
+//loding加载隐藏
+.circular{
+  display: none !important;
+}
 *{
   margin:0;
   padding:0;

src/utils/debugRequest.js

@@ -6,11 +6,11 @@ import { tansParams,judgmentNetworkReturnAddress } from "@/utils/ruoyi";
 //判定http或者https
 let urlText = window.location.href.split('://')[0]+'://';
 
-// 弹层数据
+// 公共接口加载弹层数据
 let loadingInstance = {};
 let options = {
   spinner:"",
-  background: 'rgba(255, 255, 255, 0.1)'
+  background: 'rgba(255, 255, 255, 0)'
 };
 let loadingCount = 0;
 

src/utils/request.js

@@ -15,11 +15,11 @@ let potType = false;
 //弹窗状态开关
 let messageData = null;
 
-// 弹层数据
+// 公共接口加载弹层数据
 let loadingInstance = {};
 let options = {
   spinner:"",
-  background: 'rgba(255, 255, 255, 0.1)'
+  background: 'rgba(255, 255, 255, 0)'
 };
 let loadingCount = 0;
 

src/views/safetyOverview/pageComponent/dangerComponents.vue

@@ -46,7 +46,7 @@
       return {
         propsData:{
           title:'危险源总数排行',
-          checkType:'dangerComponents',
+          // checkType:'dangerComponents', //后续列表未对接 暂时注销
         },
         //eCharts定时器
         eChartsTimer:null,
@@ -86,7 +86,9 @@
       //滚动数据
       setData(){
         this.$set(this,'dataList',this.maxData[this.dataIndex]);
-        this.eChartsMethod();
+        this.$nextTick(()=>{
+          this.eChartsMethod();
+        })
       },
       //获取数据
       getData(){

src/views/safetyOverview/pageComponent/hazardousComponents.vue

@@ -48,7 +48,7 @@
       return {
         propsData:{
           title:'危化品存量排行',
-          checkType:'hazardousComponents',
+          // checkType:'hazardousComponents', //后续列表未对接 暂时注销
         },
         totalNumber:0,
         totalAmount:0,
@@ -139,7 +139,9 @@
               })
             }
           }
-          this.eChartsMethod(nameList,dataList,imgList);
+          this.$nextTick(()=>{
+            this.eChartsMethod(nameList,dataList,imgList);
+          })
         });
       },
       eChartsMethod(nameList,dataList,imgList){

src/views/safetyOverview/pageComponent/subComponents.vue

@@ -44,7 +44,7 @@
       return {
         propsData:{
           title:'实验室状态统计',
-          checkType:'subComponents',
+          // checkType:'subComponents', //后续列表未对接 暂时注销
         },
         //eCharts定时器
         eChartsTimer:null,

src/views/safetyOverview/pageComponent/troubleDistributionComponents.vue

@@ -16,6 +16,10 @@
   </div>
 </template>
 <script>
+  import {
+    getDeptDropList,
+    reportReportBigDataDangerDistribution,
+  } from "@/api/index";
   import checkSelectComponents from "@/components/checkSelectComponents.vue";
   import titlePageImgComponents from '@/components/titlePageImgComponents.vue'
   export default {
@@ -28,7 +32,7 @@
       return {
         propsData:{
           title:'安全隐患分布',
-          checkType:'troubleDistributionComponents',
+          // checkType:'troubleDistributionComponents', //后续列表未对接 暂时注销
         },
         //eCharts定时器
         eChartsTimerLeft:null,
@@ -45,43 +49,74 @@
           {label:'资源环境',value:'7'},
           {label:'国重楼',value:'8'},
         ],
+        deptId:0,
       }
     },
     created () {
 
     },
     mounted () {
-      this.eChartsMethodLeft();
-      this.eChartsMethodRight();
+      this.getDeptDropList();
+      this.timedRefresh();
     },
     methods: {
+      timedRefresh(){
+        let self = this;
+        self.getData();
+        //定时动画
+        clearInterval(self.eChartsTimer);
+        self.eChartsTimer = setInterval(function(){
+          self.getData();
+        },1000*30);
+      },
+      getData(){
+        reportReportBigDataDangerDistribution({deptId:this.deptId}).then( response => {
+          let leftNameList = [];
+          let leftDataList = [];
+          let leftTextList = [];
+          let rightNameList = [];
+          let rightDataList = [];
+          let rightTextList = [];
+          let leftMax = 0;
+          let rightMax = 0;
+          for(let i=0;i<response.data.dangerOneList.length;i++){
+            if(leftMax < response.data.dangerOneList[i].indicatorCount){
+              leftMax = response.data.dangerOneList[i].indicatorCount;
+            }
+          }
+          for(let i=0;i<response.data.dangerNoRectifyList.length;i++){
+            if(rightMax < response.data.dangerNoRectifyList[i].indicatorCount){
+              rightMax = response.data.dangerNoRectifyList[i].indicatorCount;
+            }
+          }
+          for(let i=0;i<response.data.dangerOneList.length;i++){
+            leftNameList.push({
+              text:response.data.dangerOneList[i].indicatorName,
+              max:leftMax,
+            })
+            leftDataList.push(response.data.dangerOneList[i].indicatorCount)
+            leftTextList.push(response.data.dangerOneList[i].indicatorRate+'%')
+          }
+          for(let i=0;i<response.data.dangerNoRectifyList.length;i++){
+            rightNameList.push({
+              text:response.data.dangerNoRectifyList[i].indicatorName,
+              max:rightMax,
+            })
+            rightDataList.push(response.data.dangerNoRectifyList[i].indicatorCount)
+            rightTextList.push(response.data.dangerNoRectifyList[i].indicatorRate+'%')
+          }
+          this.eChartsMethodLeft(leftNameList,leftDataList,leftTextList);
+          this.eChartsMethodRight(rightNameList,rightDataList,rightTextList);
+        });
+      },
       //组件方法
       checkSelectData(value){
+        this.$set(this,'deptId',value);
+        this.getData();
       },
-      eChartsMethodLeft() {
-        const indicatorList = [
-          {
-            text: "化学安全",
-            max: 100
-          },
-          {
-            text: "实验场所",
-            max: 100
-          },
-          {
-            text: "安全设施",
-            max: 100
-          },
-          {
-            text: "基础安全",
-            max: 100
-          },
-          {
-            text: "生物安全",
-            max: 100
-          },
-        ];
-        let dataValue = [55, 48, 61, 31, 86]
+      eChartsMethodLeft(leftNameList,leftDataList,leftTextList) {
+        const indicatorList = leftNameList;
+        let dataValue = leftDataList
         let option = {
           color: [
             "#FF6A00"
@@ -111,7 +146,7 @@
                 formatter: function (name, indicator) {
                   const text = indicator.text
                   const index = indicatorList.findIndex(item => item.text === text)
-                  return `{a| ${name}}\n{b| ${dataValue[index]}}`
+                  return `{a| ${name}}\n{b| ${leftTextList[index]}}`
                 },
               },
               nameGap: 8,
@@ -180,38 +215,12 @@
         };
 
         let echartsBox = this.$echarts.init(document.getElementById('troubleDistributionEChartsLeft'));
+        echartsBox.clear();
         echartsBox.setOption(option);
-        //定时动画
-        clearInterval(this.eChartsTimerLeft);
-        this.eChartsTimerLeft = setInterval(function(){
-          echartsBox.clear();
-          echartsBox.setOption(option);
-        },1000*30);
       },
-      eChartsMethodRight() {
-        const indicatorList = [
-          {
-            text: "化学安全",
-            max: 100
-          },
-          {
-            text: "实验场所",
-            max: 100
-          },
-          {
-            text: "安全设施",
-            max: 100
-          },
-          {
-            text: "基础安全",
-            max: 100
-          },
-          {
-            text: "生物安全",
-            max: 100
-          },
-        ];
-        let dataValue = [32, 67, 23, 54, 14]
+      eChartsMethodRight(rightNameList,rightDataList,rightTextList) {
+        const indicatorList = rightNameList;
+        let dataValue = rightDataList
         let option = {
           color: [
             "#00F6FF"
@@ -241,7 +250,7 @@
                 formatter: function (name, indicator) {
                   const text = indicator.text
                   const index = indicatorList.findIndex(item => item.text === text)
-                  return `{a| ${name}}\n{b| ${dataValue[index]}}`
+                  return `{a| ${name}}\n{b| ${rightTextList[index]}}`
                 },
               },
               nameGap: 8,
@@ -309,15 +318,21 @@
           ]
         };
         let echartsBox = this.$echarts.init(document.getElementById('troubleDistributionEChartsRight'));
+        echartsBox.clear();
         echartsBox.setOption(option);
-        //定时动画
-        clearInterval(this.eChartsTimerRight);
-        this.eChartsTimerRight = setInterval(function(){
-          echartsBox.clear();
-          echartsBox.setOption(option);
-        },1000*30);
-
-      }
+      },
+      getDeptDropList(){
+        getDeptDropList({level: 2, deptType: 1 }).then(response => {
+          let list = [{label:'全校',value:'0'}];
+          for(let i=0;i<response.data.length;i++){
+            list.push({
+              label:response.data[i].deptShortName,
+              value:response.data[i].deptId,
+            })
+          }
+          this.$set(this,'propsOption',list);
+        });
+      },
     },
     beforeDestroy() {
       //清除定时器

src/views/safetyOverview/pageComponent/troubleRankingComponents.vue

@@ -4,9 +4,9 @@
     <title-page-img-components :propsData="propsData"></title-page-img-components>
     <div class="eCharts-max-big-box">
       <div class="position-button-left">
-        <p @click="checkButton(1)" :class="buttonType == 1?'left-border-1':'left-border-2'">年度</p>
-        <p @click="checkButton(2)" :class="buttonType == 1?'center-border-2':(buttonType == 2?'center-border-1':(buttonType == 3?'center-border-3':''))">季度</p>
-        <p @click="checkButton(3)" :class="buttonType == 3?'right-border-1':'right-border-2'">月度</p>
+        <p @click="checkButton(0)" :class="buttonType == 0?'left-border-1':'left-border-2'">年度</p>
+        <p @click="checkButton(1)" :class="buttonType == 0?'center-border-2':(buttonType == 1?'center-border-1':(buttonType == 2?'center-border-3':''))">季度</p>
+        <p @click="checkButton(2)" :class="buttonType == 2?'right-border-1':'right-border-2'">月度</p>
       </div>
       <div class="position-button-right">
         <div>
@@ -27,6 +27,9 @@
   </div>
 </template>
 <script>
+import {
+  reportReportBigDataDangerSort,
+} from "@/api/index";
   import titlePageImgComponents from '@/components/titlePageImgComponents.vue'
   export default {
     name: 'troubleRankingComponents',
@@ -37,27 +40,59 @@
       return {
         propsData:{
           title:'安全隐患排行',
-          checkType:'troubleRankingComponents',
+          // checkType:'troubleRankingComponents', //后续列表未对接 暂时注销
         },
         eChartsTimer:null,
-        buttonType:1,
+        buttonType:0,
       }
     },
     created () {
 
     },
     mounted () {
-      this.eChartsMethod();
+      this.timedRefresh();
     },
     methods: {
+      timedRefresh(){
+        let self = this;
+        this.getData();
+        //定时动画
+        clearInterval(self.eChartsTimer);
+        self.eChartsTimer = setInterval(function(){
+          self.getData();
+        },1000*30);
+      },
+      getData(){
+        console.log('111')
+        reportReportBigDataDangerSort({type:this.buttonType}).then( response => {
+          let deptSortName = [];
+          let notRectifyNum = [];
+          let rectifyNum = [];
+          let tempNum = [];
+          if (response.data[0]){
+            for(let i=0;i<response.data.length;i++){
+              deptSortName.push(response.data[i].deptSortName)
+              notRectifyNum.push(response.data[i].notRectifyNum)
+              rectifyNum.push(response.data[i].rectifyNum)
+              tempNum.push(response.data[i].tempNum)
+            }
+          } else {
+            deptSortName = [''];
+            notRectifyNum = [0];
+            rectifyNum = [0];
+            tempNum = [0];
+          }
+          this.eChartsMethod(deptSortName,notRectifyNum,rectifyNum,tempNum);
+        });
+      },
       checkButton(type){
         if(this.buttonType != type){
           this.$set(this,'buttonType',type);
+          this.getData();
         }
       },
       //
-      eChartsMethod(){
-        let xData = ['农学院', '理学院', '生命科学', '园林艺术', '植物保护', '化学与药物', '资源环境', '国重楼'];
+      eChartsMethod(deptSortName,notRectifyNum,rectifyNum,tempNum){
         let option = {
           tooltip: {
             trigger: "axis",
@@ -103,7 +138,7 @@
               splitArea: {
                 show: false,
               },
-              data: xData,
+              data: deptSortName,
             },
           ],
           yAxis: [
@@ -171,7 +206,7 @@
                   },
                 },
               },
-              data: [709, 1917, 2455, 2610, 1719, 1433,709, 1917, 2455, 2610, 1719, 1433],
+              data:rectifyNum,
             },
 
             {
@@ -201,7 +236,7 @@
                   barBorderRadius: 0,
                 },
               },
-              data: [327, 1776, 507, 1200, 800, 482,327, 1776, 507, 1200, 800, 482],
+              data: tempNum,
             },
 
             {
@@ -231,18 +266,13 @@
                   barBorderRadius: 0,
                 },
               },
-              data: [327, 1776, 507, 1200, 800, 482,327, 1776, 507, 1200, 800, 482],
+              data: notRectifyNum,
             },
           ],
         };
         let echartsBox = this.$echarts.init(document.getElementById('troubleRankingComponentsECharts'));
+        echartsBox.clear();
         echartsBox.setOption(option);
-        //定时动画
-        clearInterval(this.eChartsTimer);
-        this.eChartsTimer = setInterval(function(){
-          echartsBox.clear();
-          echartsBox.setOption(option);
-        },1000*30);
       },
     },
     beforeDestroy() {

src/views/safetyOverview/pageComponent/userEquipmentComponents.vue

@@ -13,11 +13,11 @@
         </div>
         <div class="userEquipment-for-max-box" ref="scrollDiv" @mouseleave="tableTimerFun" @mouseenter="tableTimerOff">
           <div class="userEquipment-for-box" v-for="(item,index) in dataList" :key="index">
-            <p>{{item.data1}}</p>
-            <p>{{item.data2}}</p>
-            <p>{{item.data3}}</p>
-            <p>{{item.data4}}</p>
-            <p>{{item.data5}}</p>
+            <p>{{item.deptSortName}}</p>
+            <p>{{item.labCount}}</p>
+            <p>{{item.dutyCount}}</p>
+            <p>{{item.checkCount}}</p>
+            <p>{{item.overdueDevice}}</p>
           </div>
         </div>
       </div>
@@ -25,6 +25,9 @@
   </div>
 </template>
 <script>
+  import {
+    reportReportBigDataPersonDeviceSafety,
+  } from "@/api/index";
   import titlePageImgComponents from '@/components/titlePageImgComponents.vue'
   export default {
     name: 'userEquipmentComponents',
@@ -35,19 +38,11 @@
       return {
         propsData:{
           title:'人员设备安全',
-          checkType:'userEquipmentComponents',
+          // checkType:'userEquipmentComponents', //后续列表未对接 暂时注销
         },
-        dataList:[
-          { data1:'农学院', data2:'978', data3:'67', data4:'37', data5:'17', },
-          { data1:'理学院', data2:'657', data3:'46', data4:'21', data5:'14', },
-          { data1:'生命科学', data2:'821', data3:'54', data4:'27', data5:'18', },
-          { data1:'园林艺术', data2:'468', data3:'32', data4:'14', data5:'9', },
-          { data1:'植物保护', data2:'678', data3:'41', data4:'24', data5:'4', },
-          { data1:'化学与药物', data2:'987', data3:'62', data4:'65', data5:'32', },
-          { data1:'资源环境', data2:'201', data3:'17', data4:'11', data5:'3', },
-          { data1:'国重楼', data2:'156', data3:'12', data4:'9', data5:'8', },
-        ],
+        dataList:[],
         tableTimer:null,
+        eChartsTimer:null,
       }
     },
     created () {
@@ -55,8 +50,25 @@
     },
     mounted () {
       this.tableTimerFun();
+      this.timedRefresh();
     },
     methods: {
+      timedRefresh(){
+        let self = this;
+        self.getData();
+        //定时动画
+        clearInterval(self.eChartsTimer);
+        self.eChartsTimer = setInterval(function(){
+          clearInterval(self.tableTimer)
+          self.getData();
+        },1000*30);
+      },
+      getData(){
+        reportReportBigDataPersonDeviceSafety().then( response => {
+          this.$set(this,'dataList',response.data);
+          this.tableTimerFun();
+        });
+      },
       //开始滚动
       tableTimerFun() {
         this.tableTimer = window.setInterval(() => {
@@ -81,10 +93,12 @@
     beforeDestroy() {
       //清除定时器
       clearInterval(this.tableTimer);
+      clearInterval(this.eChartsTimer);
     },
     destroyed() {
       //清除定时器
       clearInterval(this.tableTimer);
+      clearInterval(this.eChartsTimer);
     }
   }
 </script>

src/views/safetyOverview/pageComponent/userNumComponents.vue

@@ -53,14 +53,14 @@ import {
     methods: {
       timedRefresh(){
         let self = this;
-        this.getList();
+        this.getData();
         //定时动画
         clearInterval(self.eChartsTimer);
         self.eChartsTimer = setInterval(function(){
-          this.getList();
+          self.getData();
         },1000*30);
       },
-      getList(){
+      getData(){
         reportReportBigDataCountStatistics().then( response => {
           this.$set(this,'userData',response.data);
         });