fix：设备管理看板，明鉴检测档案

src/views/platform/bpmn/bpmInstHis/listType/CMAjiancedangan.vue

@@ -1,6 +1,6 @@
  <template>
   <div>
-    <div class="heads">CNAS/CMA检测档案</div>
+    <div class="heads">CNASCMA检测档案</div>
     <div class="top-box">
       <span class="t-span">年份</span
       ><el-input

src/views/platform/bpmn/bpmInstHis/listType/feijiancedangan.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <div class="heads">非CNAS/CMA检测档案</div>
+    <div class="heads">非CNASCMA检测档案</div>
     <div class="top-box">
       <span class="t-span">年份</span
       ><el-input

src/views/system/jbdHome/board/component/equipmentBoardTopcard.vue

@@ -89,6 +89,7 @@ export default {
 <style lang="scss" scoped>
 .content{
   height: 90%;
+  width: 100%;
   // background-color: rgba(6, 30, 93, 0.5);
   // .title{
   //   // width: 100%;
@@ -99,6 +100,7 @@ export default {
 .bar {
   position: relative;
   margin: 20px 2%;
+  width: 96%;
   height: 150px;
   display: flex;
   justify-content: space-between;
@@ -111,46 +113,51 @@ export default {
     padding: 12px 20px;
     border-left: 5px solid rgb(6, 30, 93);
     &:first-child {
-      width: 35%;
+      width: 34%;
       display: flex;
       justify-content: space-around;
       align-items: center;
+      box-sizing: border-box;
       .box {
-        width: 180px;
+        width: 25%;
       }
     }
     &:nth-child(2) {
-      width: 11%;
+      width: 13%;
       display: flex;
       justify-content: space-around;
       align-items: center;
+      box-sizing: border-box;
       .box {
-        width: 33%;
+        width: 50%;
       }
     }
     &:nth-child(3) {
-      width: 16%;
+      width: 20%;
       display: flex;
       justify-content: space-around;
       align-items: center;
+      box-sizing: border-box;
       .box {
-        width: 50%;
+        width: 33%;
       }
     }
     &:nth-child(4) {
-      width: 16%;
+      width: 20%;
       display: flex;
       justify-content: space-around;
       align-items: center;
+      box-sizing: border-box;
       .box {
-        width: 33%;
+        width: 50%;
       }
     }
     &:last-child {
-      width: 10%;
+      width: 13%;
       display: flex;
       justify-content: space-around;
       align-items: center;
+      box-sizing: border-box;
       .box {
         width: 50%;
       }
@@ -193,6 +200,7 @@ export default {
 
 #top-bar {
   height: 180px;
+  width: 100%;
 }
 .dv-decoration-10 {
   width: 96%;

src/views/system/jbdHome/board/component/getPieView.vue

@@ -1,8 +1,8 @@
 <template>
   <div class="pieView">
-    <div style="height: 30px;line-height: 30px;text-align: left;padding-left: 10px;">{{info.config.title||""}}</div>   
-    <div style="width:100%;height:320px;display: inline-block;">
-      <div :id="info.config.idSelector" style="width:100%;height:320px;"> </div>
+    <div style="height: 20%;line-height: 30px;text-align: left;padding-left: 10px;">{{info.config.title||""}}</div>   
+    <div style="width:100%;height:80%;display: inline-block; overflow: hidden;">
+      <div :id="info.config.idSelector" style="width:100%;height:95%;overflow: hidden;"> </div>
     </div>
   </div>
 </template>
@@ -30,27 +30,30 @@ export default {
   methods:{
     getMiddleLeft(){ 
       let chartDom = document.getElementById(this.info.config.idSelector);
-      const setEchartWH = {
-        //设置控制图表大小变量
-        width: 350,
-        height: 320,
-      };
-      var myChart = echarts.init(chartDom, null, setEchartWH);
+      // const setEchartWH = {
+      //   //设置控制图表大小变量
+      //   width: 350,
+      //   height: 320,
+      // };
+      var myChart = echarts.init(chartDom);
       var option;
       option = {
         title: {
-          subtext: '',
+          show: true,
           left: 'center',
-         
-          textStyle:{
-            color:"#fff"
-          }
+          textStyle: {
+            color: '#fff',
+            fontSize: 20,
+            fontWeight: '600'
+        },
         },
         color:this.info.color,
         tooltip: {
           trigger: 'item'
         },
         legend: {
+          show: true,
+          z: 3,
           orient: 'vertical',
           left: 'right',
           textStyle:{
@@ -60,7 +63,7 @@ export default {
         series: [{
           type: 'pie',
           radius: '50%',
-          
+          center: ['50%', '50%'],
           data:this.info.data,
           emphasis: {
             itemStyle: {
@@ -68,10 +71,11 @@ export default {
               shadowOffsetX: 0,
               shadowColor: 'rgba(0, 0, 0, 0.5)'
             }
-          }
+          },
+          
         }]
       };
-      option && myChart.setOption(option);
+      myChart.setOption(option);
     },
 
   }
@@ -81,6 +85,8 @@ export default {
 .pieView{
   display: flex;
   width: 100%;
+  height: 100%;
+  overflow: hidden;
   background-color: rgba(6,30,93,.5);
 }
 </style>

src/views/system/jbdHome/board/component/zhuzhuangtu.vue

@@ -1,8 +1,8 @@
 <template>
   <div class="pieView">
-    <div style="height: 30px;line-height: 30px;text-align: left;padding-left: 10px;width: 100%;">{{info.config.title}}</div>   
-    <div style="width:100%;height:320px;display: inline-block;">
-      <div :id="info.config.idSelector" style="width:100%;height:320px;"> </div>
+    <div style="height: 15%;line-height: 30px;text-align: left;padding-left: 10px;width: 100%;">{{info.config.title}}</div>   
+    <div style="width:100%;height:85%;display: inline-block;">
+      <div :id="info.config.idSelector" style="width:100%;height:100%;"> </div>
     </div>
   </div>
 </template>
@@ -23,12 +23,12 @@ export default {
     getMiddleLeft() {
       var chartDom = document.getElementById(this.info.config.idSelector);
       var myChart = echarts.init(chartDom);
-      const setEchartWH = {
-        //设置控制图表大小变量
-        width: 250,
-        height: 300,
-      };
-      var myChart = echarts.init(chartDom, null, setEchartWH);
+      // const setEchartWH = {
+      //   //设置控制图表大小变量
+      //   width: 250,
+      //   height: 300,
+      // };
+      var myChart = echarts.init(chartDom);
       var option;
       option = {
         tooltip: {
@@ -118,7 +118,7 @@ export default {
           
         ],
       };
-      option && myChart.setOption(option);
+      myChart.setOption(option);
     },
   },
 };
@@ -127,6 +127,7 @@ export default {
 .pieView {
   display: flex;
   width: 100%;
+  height: 100%;
   background-color: rgba(6,30,93,.5);
 }
 </style>

src/views/system/jbdHome/board/equipmentBoard.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="content">
+  <div class="content" >
     <dv-full-screen-container>
       <!-- 头部内容 -->
       <div class="header">
@@ -15,57 +15,59 @@
           <dv-border-box-8>返回</dv-border-box-8>
         </div>
       </div>
-      <dv-border-box-1>
+      <div style="height:80%"></div>
+      <dv-border-box-1 v-if="MiddleLeftPieViewList.data.length">
         <!-- 顶部数据 -->
         <div class="topCard">
           <top-bar v-if="topBarData.length" :info="topBarData" />
         </div>
         <div class="middleCard" >
-          <div style="width:100%">
-          <div class="middleCardLeft" >
+          <div style="width:100%;height: 95%;">
+          <div class="middleCardLeft"  >
             <middleCard v-if="MiddleLeftPieViewList.data.length" :info="MiddleLeftPieViewList" ref="middleCardLeft"/>
           </div>
-          <dv-decoration-2 :reverse="true" style="width:5px;height:350px;margin:0 15px;" />
+          <dv-decoration-2 v-if="MiddleLeftPieViewList.data.length" :reverse="true" style="width:2%;height:350px;" />
           <div class="middleCardCenter">
             <middleCard v-if="eBgRateData.data.length" :info="eBgRateData" ref="middleCardCenter"/>
           </div>
-          <dv-decoration-2 :reverse="true" style="width:5px;height:350px;margin:0 15px;" />
-          <div class="middleCardRight">
-            <CarouselTabl v-if="config.data.length" :info="config"/>
+          <dv-decoration-2 v-if="eBgRateData.data.length"  :reverse="true" style="width:2%;height:350px;" />
+          <div class="middleCardRight" v-if="eBgRateData.data.length" >
+            <CarouselTabl v-if="config.data.length" :info="config" title="设备报废记录"/>
           </div>
-          <dv-decoration-2 :reverse="true" style="width:5px;height:350px;margin:0 15px;" />
+          <dv-decoration-2 v-if="eBgRateData.data.length" :reverse="true" style="width:2%;height:350px;" />
           <div class="middleCardRight1">
-            <CarouselTabl v-if="shiyonglvConfig.data.length" :info="shiyonglvConfig"/>
+            <CarouselTabl v-if="MiddleLeftPieViewList.data.length" :info="shiyonglvConfig" title="设备使用记录"/>
           </div>
         </div>
+        <dv-decoration-10  v-if="MiddleLeftPieViewList.data.length" style="height: 5%;"/>
         </div>
-        <dv-decoration-10 />
+        
         <div class="bottomCard">
           <div style="width:31%;display:flex;">
             <div class="bottomCardLeft0">
               <middleCard v-if="weiHuSheBeiData.data.length" :info="weiHuSheBeiData" ref="sheBeiWeiHuRef"/>
             </div>
-            <dv-decoration-2 :reverse="true" style="width:3%;height:330px;margin: 0 10px;" />
+            <dv-decoration-2 v-if="weiHuSheBeiData.data.length" :reverse="true" style="width:3%;height:330px;margin: 0 10px;" />
             <div style="width:37%">
               <zhuzhuangtu v-if="sheBeiweiHuData.data.length" :info="sheBeiweiHuData"  ref="sheBeiWeiHuDataref"/>          
             </div>
           </div>
-          <dv-decoration-2 :reverse="true" style="width:5px;height:330px;margin: 0 10px;" />
+          <dv-decoration-2 v-if="sheBeiweiHuData.data.length" :reverse="true" style="width:5px;height:330px;margin: 0 10px;" />
           <div style="width:31%;display:flex;">
             <div class="bottomCardLeft">
               <middleCard v-if="sheBeiHeChaData.data.length" :info="sheBeiHeChaData" ref="sheBeiHeChaRef"/>
             </div>
-            <dv-decoration-2 :reverse="true" style="width:5px;height:330px;margin: 0 10px;" />
+            <dv-decoration-2 v-if="sheBeiHeChaData.data.length" :reverse="true" style="width:5px;height:330px;margin: 0 10px;" />
             <div style="width:37%">
               <zhuzhuangtu v-if="bottomData.data.length" :info="bottomData"  ref="bottomCardLeft"/>          
             </div>
           </div>
-          <dv-decoration-2 :reverse="true" style="width:5px;height:330px;margin: 0 10px;" />
+          <dv-decoration-2 v-if="bottomData.data.length" :reverse="true" style="width:5px;height:330px;margin: 0 10px;" />
           <div style="width:31%;display:flex;">
             <div class="bottomCardright">
               <middleCard v-if="jianDingjiaoZhunSheBeiData.data.length" :info="jianDingjiaoZhunSheBeiData" ref="jiandingRef"/>
             </div>
-            <dv-decoration-2 :reverse="true" style="width:3%;height:330px;margin: 0 10px;" />
+            <dv-decoration-2 v-if="jianDingjiaoZhunSheBeiData.data.length" :reverse="true" style="width:3%;height:330px;margin: 0 10px;" />
             <div style="width:40%">
               <zhuzhuangtu v-if="zhuantaiEData.data.length" :info="zhuantaiEData"  ref="zhuantaiEDataref"/>
             </div>
@@ -123,9 +125,10 @@ export default {
       bottomData:{xData:[],data:[],config:{idSelector:""}},
       zhuantaiEData:{xData:[],data:[],config:{idSelector:""}},
       sheBeiweiHuData:{xData:[],data:[],config:{idSelector:""}},
-      config:{ header:['设备名称','设备编号','规格型号','设备状态'],data:[]},
-      shiyonglvConfig:{ header:['设备名称','设备编号','设备状态','频率'],data:[]},
+      config:{ header:['设备名称','设备编号','规格型号','设备状态'],data:[],columnWidth:['100','110','85','85'],rowNum:4,},
+      shiyonglvConfig:{ header:['设备名称','设备状态','频率'],data:[],columnWidth:['120','120','50'],rowNum:4},
       zichan:0,
+      loading:true
     };
   },
   created() {
@@ -133,6 +136,7 @@ export default {
       this.allView();
     }
     this.updateAll();
+
   },
   beforeDestroy() {
     if (screenfull.isFullscreen) {
@@ -444,7 +448,7 @@ export default {
           result.forEach((item) => {
             data1 = [];
             data1.push(item.she_bei_ming_chen);
-            data1.push(item.she_bei_bian_hao_);
+            // data1.push(item.she_bei_bian_hao_);
             data1.push(item.she_bei_zhuang_ku);
             data1.push(item.pinlv);
             this_.shiyonglvConfig.data.push(data1);
@@ -456,7 +460,7 @@ export default {
         });
     },
     getAllMonyInt (monyArr){
-      debugger
+      
       let mony = 0;
       let filterMony = 0
       monyArr.forEach(item=>{      
@@ -513,10 +517,12 @@ export default {
   .header {
     position: relative;
     width: 100%;
-    height: 100px;
+    height: 7%;
     display: flex;
     justify-content: space-between;
     flex-shrink: 0;
+    box-sizing: border-box;
+    overflow: hidden;
     .left,
     .right {
       width: 25%;
@@ -559,6 +565,19 @@ export default {
   }  
   .topCard{
     width: 100%;
+    height: 20%;
+    box-sizing: border-box;
+    overflow: hidden;
+  }
+ .bottomCard{
+  height: 37%;
+  overflow: hidden;
+  box-sizing: border-box;
+  }
+  .middleCard{
+    height: 39%;
+    overflow: hidden;
+    box-sizing: border-box;
   }
   .middleCard,.bottomCard{
     width: 100%;
@@ -569,15 +588,17 @@ export default {
     }
     .middleCardLeft{
       width: 19%;
+      height: 100%;
     }
     .middleCardCenter{
       width: 19%;
+      height: 100%;
     }
     .middleCardRight{
       width: 28%;
     }
     .middleCardRight1{
-      width: 25%;
+      width: 24%;
     }
     padding: 10px;
   }
@@ -611,7 +632,7 @@ export default {
 }
 .dv-decoration-10 {
   width: 96%;
-  margin: 7px 2% 0;
+  margin: 7px 0 0;
   height: 5px;
 }
 </style>