fix:设备管理看板

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

@@ -5,11 +5,11 @@
       <div class="bar">
         <div v-for="(item, index) in topBarData" :key="index" class="item">
           <!-- <div class="title">{{ item.title }}</div> -->
-          <div v-for="(v, i) in item.children" :key="i" class="box">
+          <div v-for="(v, i) in item.children" :key="i" class="box1">
             <div class="label">{{ v.label }}</div>
             <div class="count">
-              <dv-digital-flop :config="v.data" class="flop"   v-if="v.unit !='元'"/>
-              <dv-digital-flop :config="v.data" class="flops"   v-else/>
+              <dv-digital-flop :config="v.data" class="flop" v-if="v.unit !='元'" />
+              <dv-digital-flop :config="v.data" class="flops" v-else />
               <div class="unit">{{ v.unit }}</div>
             </div>
           </div>
@@ -72,6 +72,7 @@ export default {
           i.data = {
             number: [i.value],
             content: "{nt}",
+            toFixed: i.danwei == "%" ? 2 : 0,
             textAlign: "center",
             style: {
               fill: this.fontColor[this.getRandom(0, 11)],
@@ -82,77 +83,108 @@ export default {
         });
       });
       this.topBarData = JSON.parse(JSON.stringify(this.info));
+      console.log(this.topBarData);
     },
   },
 };
 </script>
 <style lang="scss" scoped>
-.content{
-  height: 90%;
-  // background-color: rgba(6, 30, 93, 0.5);
-  // .title{
-  //   // width: 100%;
-  //   margin: 20px 2%;
-    
-  // }
+.content {
+  height: 96%;
+  width: 96%;
+  margin-left: 30px;
+  padding: 10px;
+  min-height: 0px;
+  overflow: hidden;
 }
 .bar {
+  width: 100%;
   position: relative;
-  margin: 20px 2%;
+  margin: 0 5px 11px;
   height: 150px;
   display: flex;
   justify-content: space-between;
   align-items: center;
+  border: none;
   background-color: rgba(6, 30, 93, 0.5);
+  .box1{
+    text-align: center;
+    font-size: 12px;
+    display: inline-block;
+      width: 33%;
+    .label {
+        text-align: center;
+        font-size: 14px;
+      }
+    .count{
+      display: flex;
+        align-items: center;
+        justify-content: center;
+        .flop {
+          width: 80px;
+          height: 40px;
+          font-size: 10px;
+        }
+        .flops {
+          width: 160px;
+          height: 40px;
+          font-size: 10px;
+        }
+        .unit {
+          margin-left: 10px;
+          box-sizing: border-box;
+        }
+    }
+    
+  }
   .item {
     width: 20%;
-    // width: calc(100% / 13);
-    height: 60%;
-    padding: 12px 20px;
+    // height: 60%;
+    padding: 1px 15px;
     border-left: 5px solid rgb(6, 30, 93);
     &:first-child {
-      width: 35%;
+      width: 28%;
       display: flex;
       justify-content: space-around;
       align-items: center;
-      .box {
-        width: 35%;
+      .box1 {
+        width: 19%;
       }
     }
     &:nth-child(2) {
-      width: 10%;
+      width: 15%;
       display: flex;
       justify-content: space-around;
       align-items: center;
-      .box {
-        width: 180px;
+      .box1 {
+        width: 48%;
       }
     }
     &:nth-child(3) {
-      width: 10%;
+      width: 15%;
       display: flex;
       justify-content: space-around;
       align-items: center;
-      .box {
-        width: 150px;
+      .box1 {
+        width: 48%;
       }
     }
     &:nth-child(4) {
-      width: 10%;
+      width: 15%;
       display: flex;
       justify-content: space-around;
       align-items: center;
-      .box {
-        width: 150px;
+      .box1 {
+        width: 48%;
       }
     }
     &:last-child {
-      width: 24%;
+      width: 26%;
       display: flex;
       justify-content: space-around;
       align-items: center;
-      .box {
-        width: 150px;
+      .box1 {
+        width: 33%;
       }
     }
     .title {
@@ -161,33 +193,33 @@ export default {
       font-weight: bold;
       margin-bottom: 20px;
     }
-    .box {
-      display: inline-block;
-      width: 33%;
-      .label {
-        text-align: center;
-        font-size: 14px;
-      }
-      .count {
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        .flop {
-          width: 60px;
-          height: 40px;
-          font-size: 18px;
-        }
-        .flops{
-          width: 180px;
-          height: 40px;
-          font-size: 10px;
-        }
-        .unit {
-          margin-left: 10px;
-          box-sizing: border-box;
-        }
-      }
-    }
+    // .box {
+    //   display: inline-block;
+    //   width: 33%;
+    //   .label {
+    //     text-align: center;
+    //     font-size: 14px;
+    //   }
+    //   .count {
+    //     display: flex;
+    //     align-items: center;
+    //     justify-content: center;
+    //     .flop {
+    //       width: 80px;
+    //       height: 40px;
+    //       font-size: 10px;
+    //     }
+    //     .flops {
+    //       width: 160px;
+    //       height: 40px;
+    //       font-size: 10px;
+    //     }
+    //     .unit {
+    //       margin-left: 10px;
+    //       box-sizing: border-box;
+    //     }
+    //   }
+    // }
   }
 }
 
@@ -196,7 +228,7 @@ export default {
 }
 .dv-decoration-10 {
   width: 96%;
-  margin: 7px 2% 0;
+  margin: -20px 40px 0;
   height: 5px;
 }
 </style>

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

@@ -48,7 +48,8 @@ export default {
         },
         color:this.info.color,
         tooltip: {
-          trigger: 'item'
+          trigger: 'item',
+          formatter: '{b} : {c} %'
         },
         legend: {
           orient: 'vertical',

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

@@ -98,31 +98,15 @@ export default {
       today: d.toJSON().slice(0, 10),
       topBarData: [],
       timer: null,
-      MiddleLeftPieViewList:{
-        data:[],
-        config:{idSelector:"main"}, //{name:,value}
-        color:[]
-      },
-      eBgRateData:{
-        data:[],
-        config:{}
-      },
-      sheBeiHeChaData:{
-        data:[],
-        config:{}
-      },
-      jianDingjiaoZhunSheBeiData:{
-        data:[],
-        config:{}
-      },
-      weiHuSheBeiData:{
-        data:[],
-        config:{}
-      },
-      bottomData:{xData:[],data:[],config:{idSelector:""}},
-      zhuantaiEData:{xData:[],data:[],config:{idSelector:""}},
-      sheBeiweiHuData:{xData:[],data:[],config:{idSelector:""}},
-      config:{ header:['设备名称','设备编号','规格型号','最近检定/校准日期','设备状态'],data:[]},
+      MiddleLeftPieViewList:{},
+      eBgRateData:{},
+      sheBeiHeChaData:{},
+      jianDingjiaoZhunSheBeiData:{},
+      weiHuSheBeiData:{},
+      bottomData:{},
+      zhuantaiEData:{},
+      sheBeiweiHuData:{},
+      config:{},
       zichan:0,
     };
   },
@@ -153,6 +137,15 @@ export default {
     },
     async getTopBarData(){
       let this_ = this;
+      
+      this.MiddleLeftPieViewList={  data:[],  config:{idSelector:"main"}, color:[]};
+      this.eBgRateData = { data:[],config:{}};
+      this.sheBeiHeChaData = { data:[], config:{}};
+      this.jianDingjiaoZhunSheBeiData = { data:[],  config:{}};
+      this.weiHuSheBeiData = {data:[],config:{}};
+      this.bottomData = {xData:[],data:[],config:{idSelector:""}};
+      this.zhuantaiEData = {xData:[],data:[],config:{idSelector:""}};
+      this.sheBeiweiHuData ={xData:[],data:[],config:{idSelector:""}};
       let sql =`select a.Equipments,a1.mony,b.addEquipments,c.testEquipments,c1.testNoEquipments,d.checkEquipments,
       d1.checkNoEquipments,e.goodEquipments,f.scrapEquipments,g.limitedEquipments,h.weiHuNoEquipments,h1.weiHuEquipments
       from  
@@ -164,29 +157,29 @@ export default {
       (select count(*) as checkEquipments from t_sbhcjlb where create_time_ LIKE '${this_.month}' and shi_fou_guo_shen_ ='1') as d,
       (select count(*) as checkNoEquipments from t_sbhcjlb where create_time_ LIKE '${this_.month}') as d1,
       (select count(*) as goodEquipments  from t_sbdj where she_bei_zhuang_ta ='正常') as e,
-      (select count(*) as scrapEquipments  from t_sbdj where she_bei_zhuang_ta ='停用' or she_bei_zhuang_ta ='报废/停用') as f,
-      (select count(*) as limitedEquipments  from t_sbdj where she_bei_zhuang_ta ='限制使用') as g,
+      (select count(*) as scrapEquipments  from t_sbdj where she_bei_zhuang_ta ='停用' or she_bei_zhuang_ta ='报废' or she_bei_zhuang_ta ='报废/停用') as f,
+      (select count(*) as limitedEquipments  from t_sbdj where she_bei_zhuang_ta ='限制使用' or she_bei_zhuang_ta ='备用') as g,
       (select count(*) as weiHuNoEquipments  from t_mjsbwhjhzb where create_time_ LIKE '${this_.month}') as h,
       (select count(*) as weiHuEquipments  from t_mjsbwhbyjlby where create_time_ LIKE '${this_.month}' and shi_fou_guo_shen_ ='1') as h1`;
      await curdPost("sql",sql).then(res=>{
         const data = res.variables.data
         let zichan = this_.getAllMonyInt(data);
-        let eIntactnessRate = Number(((data[0].goodEquipments/data[0].Equipments).toFixed(3)+"").slice(2,4));
-        let eBadRate = 100 - parseInt(eIntactnessRate);
+        let eIntactnessRate = Number((((data[0].goodEquipments/data[0].Equipments).toFixed(4))*100+"").slice(0,5));
+        let eBadRate =Number((( (100 - eIntactnessRate).toFixed(4))+"").slice(0,4));
         let obj ={};
-        obj.value = data[0].goodEquipments;
+        obj.value = Number(((data[0].goodEquipments/data[0].Equipments).toFixed(4)*100+"").slice(0,5));
         obj.name = "正常设备";
         this_.MiddleLeftPieViewList.data.push(obj);
         obj ={};
-        obj.value = data[0].limitedEquipments;
+        obj.value =Number(((data[0].limitedEquipments/data[0].Equipments).toFixed(4)*100+"").slice(0,5));
         obj.name = "备用设备";
         this_.MiddleLeftPieViewList.data.push(obj);
         obj ={};
-        obj.value = data[0].scrapEquipments;
+        obj.value = Number(((data[0].scrapEquipments/data[0].Equipments).toFixed(4)*100+"").slice(0,5));
         obj.name = "停用/报废";
         this_.MiddleLeftPieViewList.data.push(obj);
         this_.MiddleLeftPieViewList.color = ['#339933','#FFFF66','#FF0033'];
-        this_.MiddleLeftPieViewList.config.title = "设备状态工作分布";
+        this_.MiddleLeftPieViewList.config.title = "设备工作状态分布";
         this_.MiddleLeftPieViewList.config.idSelector = "main2";
         this_.$nextTick(()=>{
         setTimeout(() => {
@@ -204,24 +197,24 @@ export default {
               danwei:'台'
             },
             {
-              label: '本月新增设备数',
+              label: '本月新增设备',
               value: data[0].addEquipments,
-              danwei:'件'
+              danwei:'台'
             },
             {
-              label: '正常设备数',
+              label: '正常设备',
               value: data[0].goodEquipments,
-              danwei:'件'
+              danwei:'台'
             },            
             {
-              label: '报废/停用设备数',
+              label: '报废/停用设备',
               value: data[0].scrapEquipments,
-              danwei:'件'
+              danwei:'台'
             },
             {
-              label: '受限设备数',
+              label: '受限设备',
               value: data[0].limitedEquipments,
-              danwei:'件'
+              danwei:'台'
             }
           ]
         },
@@ -229,12 +222,12 @@ export default {
           title: '',
           children: [
             {
-              label: '本月计划维护设备数',
+              label: '本月计划维护设备',
               value: data[0].weiHuNoEquipments,
               danwei:'台'
             },
             {
-              label: '本月已维护设备数',
+              label: '本月已维护设备',
               value: data[0].weiHuEquipments,
               danwei:'台'
             }
@@ -244,12 +237,12 @@ export default {
           title: '',
           children: [
             {
-              label: '本月计划检定/校准设备数',
+              label: '本月计划检定/校准设备',
               value: data[0].testNoEquipments,
               danwei:'台'
             },
             {
-              label: '本月已检定/校准设备数',
+              label: '本月已检定/校准设备',
               value: data[0].testEquipments,
               danwei:'台'
             }
@@ -259,14 +252,14 @@ export default {
           title: '',
           children: [
             {
-              label: '本月计划核查设备数',
+              label: '本月计划核查设备',
               value: data[0].checkNoEquipments,
               danwei:'台'
             },
             {
-              label: '本月已核查设备数',
+              label: '本月已核查设备',
               value: data[0].checkEquipments,
-              danwei:'件'
+              danwei:'台'
             }
           ]
         },
@@ -292,7 +285,7 @@ export default {
         }
        ];
        //
-      this_.bottomData.xData =["计划核查设备数","已核查设备数"];
+      this_.bottomData.xData =["计划核查设备","已核查设备"];
       this_.bottomData.data.push(data[0].checkNoEquipments);
       this_.bottomData.data.push(data[0].checkEquipments);
       this_.bottomData.config.title ="核查设备柱状图";
@@ -302,13 +295,13 @@ export default {
 					
 			// 	}, 1000)
       // })
-      this_.zhuantaiEData.xData =["计划检定/校准设备数","已完成检定/校准设备数",];
+      this_.zhuantaiEData.xData =["计划检定/校准设备","已完成检定/校准设备",];
       this_.zhuantaiEData.data.push(data[0].testNoEquipments);
       this_.zhuantaiEData.data.push(data[0].testEquipments);
       this_.zhuantaiEData.config.title ="设备检定/校准设备柱状图";
       this_.zhuantaiEData.config.idSelector ="main3"; 
       //维护设备柱状图
-      this_.sheBeiweiHuData.xData =["计划维护设备数","已完成设备数",];
+      this_.sheBeiweiHuData.xData =["计划维护设备","已完成设备",];
       this_.sheBeiweiHuData.data.push(data[0].weiHuNoEquipments);
       this_.sheBeiweiHuData.data.push(data[0].weiHuEquipments);
       this_.sheBeiweiHuData.config.title ="设备维护柱状图";
@@ -330,40 +323,40 @@ export default {
       objRate.name = "设备故障率";
       this_.eBgRateData.data.push(objRate);
       this_.eBgRateData.color = ['#339933','#FF0033'];
-      this_.eBgRateData.config.title = "设备完好率分布";
+      this_.eBgRateData.config.title = "设备工作状态分布";
       this_.eBgRateData.config.idSelector = "main1";
       //设备维护
       let objweihu ={};
-      objweihu.name ="计划维护设备数";
+      objweihu.name ="计划维护设备";
       objweihu.value = data[0].weiHuNoEquipments;
       this_.weiHuSheBeiData.data.push(objweihu);
       objweihu ={};
       objweihu.value =  data[0].weiHuEquipments;
-      objweihu.name = "已维护设备数";
+      objweihu.name = "已维护设备";
       this_.weiHuSheBeiData.data.push(objweihu);
       this_.weiHuSheBeiData.color = ['#5470c6','#38a838'];
       this_.weiHuSheBeiData.config.title = "设备维护分布";
       this_.weiHuSheBeiData.config.idSelector = "mainWeiHu";
       //设备核查
       let objHeCha ={};
-      objHeCha.name ="计划核查设备数";
+      objHeCha.name ="计划核查设备";
       objHeCha.value = data[0].checkNoEquipments;
       this_.sheBeiHeChaData.data.push(objHeCha);
       objHeCha ={};
       objHeCha.value =  data[0].checkEquipments;
-      objHeCha.name = "已核查设备数";
+      objHeCha.name = "已核查设备";
       this_.sheBeiHeChaData.data.push(objHeCha);
       this_.sheBeiHeChaData.color = ['#5470c6','#38a838'];
       this_.sheBeiHeChaData.config.title = "设备核查分布";
       this_.sheBeiHeChaData.config.idSelector = "mainHeCha";
       //设备检定校准
       let objJianding ={};
-      objJianding.name ="计划检定/校准设备数";
+      objJianding.name ="计划检定/校准设备";
       objJianding.value = data[0].testNoEquipments;
       this_.jianDingjiaoZhunSheBeiData.data.push(objJianding);
       objJianding ={};
       objJianding.value =  data[0].testEquipments;
-      objJianding.name = "已完成设备数";
+      objJianding.name = "已完成设备";
       this_.jianDingjiaoZhunSheBeiData.data.push(objJianding);
       this_.jianDingjiaoZhunSheBeiData.color = ['#5470c6','#38a838'];
       this_.jianDingjiaoZhunSheBeiData.config.title = "设备检定校准分布";
@@ -386,8 +379,10 @@ export default {
       console.log(1)
     },
     async getCarouselTable() {
+      this.config={ header:['设备名称','设备编号','规格型号','设备状态'],data:[]};
+
       let this_ = this;
-      const sql = "select * from t_sbdj where she_bei_zhuang_ta ='停用' or she_bei_zhuang_ta ='报废/停用'";
+      const sql = "select * from t_sbdj where she_bei_zhuang_ta ='停用' or she_bei_zhuang_ta ='报废' or she_bei_zhuang_ta ='报废/停用'";
       let data1 = [];
       await curdPost("sql", sql)
         .then((res) => {
@@ -397,7 +392,6 @@ export default {
             data1.push(item.she_bei_ming_cheng_);
             data1.push(item.she_bei_shi_bie_h);
             data1.push(item.gui_ge_xing_hao_);
-            data1.push(item.zhuang_tai_fen_xi || "");
             data1.push(item.she_bei_zhuang_ta);
             this_.config.data.push(data1);
           });