fix:设备管理看板

src/views/system/jbdHome/board/component/equipment/CarouselTabl.vue

@@ -8,7 +8,7 @@
 </template>
 
 <script>
-import { create } from "@/api/platform/job/job";
+// import { create } from "@/api/platform/job/job";
 export default {
   data() {
     return {};
@@ -22,28 +22,6 @@ export default {
       type: String,
       default: "",
     },
-    isup: {
-      type: Boolean,
-      default: false,
-    },
-  },
-  watch: {
-    isup: {
-      async function(news, olds) {
-        console.log(news, olds, "心志");
-      },
-      immediate:true
-    },
-    info: {
-      async function(news, olds) {
-        console.log(news, olds, "心志");
-      },
-      // immediate:true,
-      deep:true
-    },
-  },
-  create() {
-    console.log(info, "create");
   },
 };
 </script>

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

@@ -7,6 +7,7 @@
             <div class="label">{{ v.label }}</div>
             <div class="count">
               <div v-if=" v.label.includes('计划')||v.label.includes('申请')" :style="{color:'#9966FF'}" style="font-weight:bold;font-size: 27px;">{{v.value}}</div>
+              <div v-else-if="v.label.includes('故障率')" :style="{color:'#f9210b'}" style="font-weight:bold;font-size: 27px;">{{v.value}}</div>
               <div v-else-if="v.label.includes('报废/停用')" :style="{color:'#FF0066'}" style="font-weight:bold;font-size: 27px;">{{v.value}}</div>
               <div v-else-if="v.label.includes('受限')" :style="{color:'#CCFF33'}" style="font-weight:bold;font-size: 27px;">{{v.value}}</div>
               <div v-else-if="v.label.includes('已')||v.label.includes('完成')||v.label.includes('正常')||v.label.includes('率')" :style="{color:'#00b56a'}" style="font-weight:bold;font-size: 27px;">{{v.value}}</div>

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

@@ -21,6 +21,13 @@ export default {
       default: {},
     },
   },
+  mounted() {
+    let this_ = this;
+    this.$nextTick(()=>{
+      this_.getMiddleLeft();
+    })
+    
+  },
   methods: {
     getMiddleLeft() {
       var chartDom = document.getElementById(this.info.config.idSelector);
@@ -60,6 +67,7 @@ export default {
             },
             axisLabel: {
               fontSize: 12,
+              rotate: 25,
               formatter:function(value){  
                 var str = ""; 
                 var num = 6; //每行显示字数 
@@ -114,7 +122,7 @@ export default {
             itemStyle: {
             normal: {
                 color: function(params) {
-                    var colorList = ['#5c7bd9', '#9fe080', '#ffdc60', '#ff7070','#7ed3f4', '#ff915a'];
+                    var colorList = ['#5c7bd9', '#9fe080', '#339933', '#ffdc60','#f9210b', '#ff915a'];
                     return colorList[params.dataIndex]
                 }
             }

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

@@ -23,17 +23,17 @@
         <dv-decoration-10 style="height:1%;width: 96%;display:flex;margin: 0 auto;" />
         <div class="middleCard">
           <div style="width:100%;height: 100%;overflow: hidden;box-sizing: border-box;">
-            <div class="middleCardLeft">
+            <!-- <div class="middleCardLeft">
               <middleCard v-if="MiddleLeftPieViewList.data.length" :info="MiddleLeftPieViewList" ref="middleCardLeft" />
-            </div>
+            </div> -->
             <!-- <dv-decoration-2 v-if="MiddleLeftPieViewList.data.length" :reverse="true" style="width:2%;height:100%;overflow: hidden;box-sizing: border-box;" /> -->
-            <!-- <div class="middleCardCenter">
+            <div class="middleCardCenter">
               <middleCard v-if="eBgRateData.data.length" :info="eBgRateData" ref="middleCardCenter" />
-            </div> -->
+            </div>
             <dv-decoration-2 v-if="eBgRateData.data.length" :reverse="true" style="width:2%;height:100%;overflow: hidden;box-sizing: border-box;" />
 
             <div class="middleCardRight1">
-              <CarouselTabl v-if="MiddleLeftPieViewList.data.length" :info="shiyonglvConfig" title="设备使用记录" isup=isup />
+              <CarouselTabl v-if="shiyonglvConfig.data.length" :info="shiyonglvConfig" title="设备使用记录" />
             </div>
             <dv-decoration-2 v-if="eBgRateData.data.length" :reverse="true" style="width:2%;height:100%;overflow: hidden;box-sizing: border-box;" />
             <div class="middleCardRight" v-if="eBgRateData.data.length">
@@ -44,37 +44,40 @@
         </div>
         <dv-decoration-10 style="height:1%;width: 96%;display:flex;margin: 0 auto;        " />
         <div class="bottomCard">
-          <div style="width:28%;display:flex;overflow: hidden;">
+          <div style="width:25%;display:flex;overflow: hidden;">
             <div class="bottomCardLeft0">
-              <middleCard v-if="weiHuSheBeiData.data.length" :info="weiHuSheBeiData" ref="sheBeiWeiHuRef" />
+              <middleCard v-if="weiHuSheBeiDataShow" :info="weiHuSheBeiData" ref="sheBeiWeiHuRef" />
             </div>
             <!-- <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 v-if="bottomData.data.length" :reverse="true" style="width:2%;height:100%;" />
-          <div style="width:49%;display:flex;overflow: hidden;">
-            <div style="width:40%">
+          <div style="width:25%;display:flex;overflow: hidden;">
+            <!-- <div style="width:40%">
               <zhuzhuangtu v-if="zhuantaiEData.data.length" :info="zhuantaiEData" ref="zhuantaiEDataref" />
-            </div>
-            <dv-decoration-2 v-if="jianDingjiaoZhunSheBeiData.data.length" :reverse="true" style="width:4%;height:100%;" />
+            </div> -->
+            <!-- <dv-decoration-2 v-if="jianDingjiaoZhunSheBeiData.data.length" :reverse="true" style="width:4%;height:100%;" /> -->
             <div class="bottomCardright">
-              <middleCard v-if="jianDingjiaoZhunSheBeiData.data.length" :info="jianDingjiaoZhunSheBeiData" ref="jiandingRef" />
+              <middleCard v-if="jianDingjiaoZhunSheBeiDataShow" :info="jianDingjiaoZhunSheBeiData" ref="jiandingRef" />
             </div>
-
           </div>
-          <dv-decoration-2 v-if="sheBeiweiHuData.data.length" :reverse="true" style="width:2%;height:100%;" />
+          <dv-decoration-2 v-if="sheBeiHeChaDataShow" :reverse="true" style="width:2%;height:100%;" />
           <div style="width:25%;display:flex;overflow: hidden;">
-            <!-- <div class="bottomCardLeft">
-              <middleCard v-if="sheBeiHeChaData.data.length" :info="sheBeiHeChaData" ref="sheBeiHeChaRef" />
-            </div> -->
+            <div class="bottomCardLeft">
+              <middleCard v-if="sheBeiHeChaDataShow" :info="sheBeiHeChaData" ref="sheBeiHeChaRef" />
+            </div>
             <!-- <dv-decoration-2 v-if="sheBeiHeChaData.data.length" :reverse="true" style="width:2%;height:100%;" /> -->
-            <div style="width:100%">
+            <!-- <div style="width:100%">
               <zhuzhuangtu v-if="bottomData.data.length" :info="bottomData" ref="bottomCardLeft" />
-            </div>
+            </div> -->
+          </div>
+          <dv-decoration-2 v-if="bottomData.data.length" :reverse="true" style="width:2%;height:100%;" />
+          <div style="width:25%">
+            <zhuzhuangtu v-if="sheBeiData.data.length" :info="sheBeiData" ref="sheBeiDataDataref" />
           </div>
-
         </div>
       </dv-border-box-1>
     </dv-full-screen-container>
@@ -98,7 +101,6 @@ export default {
   data() {
     const d = new Date();
     return {
-      isup: false,
       titleName: "设备管理看板",
       year: d.toJSON().slice(0, 4),
       month: d.toJSON().slice(0, 7),
@@ -118,6 +120,7 @@ export default {
         data: [],
         config: {},
       },
+      sheBeiHeChaDataShow:false,
       jianDingjiaoZhunSheBeiData: {
         data: [],
         config: {},
@@ -126,8 +129,11 @@ export default {
         data: [],
         config: {},
       },
+      weiHuSheBeiDataShow:false,
+      jianDingjiaoZhunSheBeiDataShow:false,
       bottomData: { xData: [], data: [], config: { idSelector: "" } },
       zhuantaiEData: { xData: [], data: [], config: { idSelector: "" } },
+      sheBeiData: { xData: [], data: [], config: { idSelector: "" } },
       sheBeiweiHuData: { xData: [], data: [], config: { idSelector: "" } },
       config: {
         header: ["设备名称", "编号", "规格型号", "状态"],
@@ -149,7 +155,7 @@ export default {
     if (screenfull.isEnabled && !screenfull.isFullscreen) {
       this.allView();
     }
-    this.createAll();
+    this.updateAll();
   },
   beforeDestroy() {
     if (screenfull.isFullscreen) {
@@ -180,7 +186,11 @@ export default {
       // this.getbottomData();
     },
     async getTopBarData() {
+     
       let this_ = this;
+      this_.sheBeiHeChaDataShow = false;
+      this_.weiHuSheBeiDataShow = false;
+      this_.jianDingjiaoZhunSheBeiDataShow = false;
       let sql1 = `select fei_yong_ as feiyong from t_mjsbxzqrb where shi_fou_guo_shen_ ='1'`;
       let zichan;
       await curdPost("sql", sql1).then((res) => {
@@ -205,25 +215,37 @@ export default {
       from  
       (select count(*) as Equipments from t_sbdj) as a,
       (select bei_zhu_ as mony FROM t_sbdj) as a1,
-      (select count(*) as addEquipments  from t_sbdj where gou_jin_ri_qi_ LIKE '${this_.month}') as b,
-      (select count(*) as testEquipments from t_mjsbxzqrb where shi_fou_guo_shen_ ='1') as c,
-      (select count(*) as testNoEquipments from t_mjsbjdxzjhzb) as c1,
-      (select count(*) as checkEquipments from t_mjyqsbwxsqb where create_time_ LIKE '${this_.month}' ) as d,
-      (select count(*) as checkNoEquipments from t_mjsbwxqrb where create_time_ LIKE '${this_.month}' and shi_fou_guo_shen_ ='1') as d1,
-      (select count(*) as goodEquipments  from t_sbdj where she_bei_zhuang_ta ='正常使用') as e,
+      (select count(*) as addEquipments  from t_sbdj where gou_jin_ri_qi_ LIKE '${this_.month}%') as b,
+      (select count(*) as testEquipments from t_mjsbxzqrb where  shi_fou_guo_shen_ ='1') as c,
+      (select count(*) as testNoEquipments from t_mjsbjdxzjhzb where create_time_ LIKE '${this_.month}%') as c1,
+      (select count(*) as checkEquipments from t_mjyqsbwxsqb where create_time_ LIKE '${this_.month}%') as d,
+      (select count(*) as checkNoEquipments from t_mjsbwxqrb where create_time_ LIKE '${this_.month}%' and shi_fou_guo_shen_ ='1') 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 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`;
+      (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) => {
+          console.log(sql)
+          
           const data = res.variables.data;
+          // if(data.length <=0){
+          //   this.eBgRateData.data.push([])
+          //   this.sheBeiHeChaData.data.push([]);
+          //   this.jianDingjiaoZhunSheBeiData.push([]);
+          //   this.weiHuSheBeiData.data.push([]);
+          //   return
+          // }
           // let zichan = '待确认';
-          let eIntactnessRate = Number(((data[0].goodEquipments / data[0].Equipments).toFixed(3) + "").slice(2, 4));
+          let eIntactnessRate = Number(
+            (
+              (data[0].goodEquipments / data[0].Equipments).toFixed(3) + ""
+            ).slice(2, 4)
+          );
           this_.MiddleLeftPieViewList.data = [];
           let eBadRate = 100 - eIntactnessRate;
           let obj = {};
-          debugger
           obj.value = data[0].goodEquipments;
           obj.name = "正常设备数";
           this_.MiddleLeftPieViewList.data.push(obj);
@@ -239,11 +261,11 @@ export default {
           this_.MiddleLeftPieViewList.color = ["#339933", "#FFFF66", "#FF0033"];
           this_.MiddleLeftPieViewList.config.title = "设备状态工作分布率";
           this_.MiddleLeftPieViewList.config.idSelector = "main2";
-          this_.$nextTick(() => {
-            setTimeout(() => {
-              this_.$refs.middleCardLeft.getMiddleLeft(); // hhhh xxxx
-            }, 1000);
-          });
+          // this_.$nextTick(() => {
+          //   setTimeout(() => {
+          //     this_.$refs.middleCardLeft.getMiddleLeft(); // hhhh xxxx
+          //   }, 1000);
+          // });
           obj = {};
           let result = [
             {
@@ -260,7 +282,7 @@ export default {
                   danwei: "",
                 },
                 {
-                  label: "正常数",
+                  label: "良好数",
                   value: data[0].goodEquipments,
                   danwei: "",
                 },
@@ -353,16 +375,29 @@ export default {
               ],
             },
           ];
-          //
+          //设备数量统计
+          this_.sheBeiData.xData = [
+            "设备总数",
+            "新增数",
+            "良好数",
+            "受限数",
+            "报废停用数",
+          ];
+          
+          this_.sheBeiData.data.push(data[0].Equipments);
+          this_.sheBeiData.data.push(data[0].addEquipments);
+          this_.sheBeiData.data.push(data[0].goodEquipments);
+          this_.sheBeiData.data.push(data[0].limitedEquipments);
+          this_.sheBeiData.data.push(data[0].scrapEquipments);
+          this_.sheBeiData.config.title = "设备数量情况一览";
+          this_.sheBeiData.config.idSelector = "main8";
+          this_.bottomData.data=[];
           this_.bottomData.xData = ["计划核查数", "本月已核查数"];
           this_.bottomData.data.push(data[0].checkNoEquipments);
           this_.bottomData.data.push(data[0].checkEquipments);
           this_.bottomData.config.title = "期间核查设备完成图";
           this_.bottomData.config.idSelector = "main4";
-          this_.zhuantaiEData.xData = [
-            "计划检定/校准数",
-            "已完成检定/校准数",
-          ];
+          this_.zhuantaiEData.xData = ["计划检定/校准数", "已完成检定/校准数"];
           this_.zhuantaiEData.data.push(data[0].testNoEquipments);
           this_.zhuantaiEData.data.push(data[0].testEquipments);
           this_.zhuantaiEData.config.title = "设备检定/校准设备完成图";
@@ -373,21 +408,22 @@ export default {
           this_.sheBeiweiHuData.data.push(data[0].weiHuEquipments);
           this_.sheBeiweiHuData.config.title = "设备维护柱状图";
           this_.sheBeiweiHuData.config.idSelector = "mainWeiHuZ";
-          this_.$nextTick(() => {
-            // setTimeout(() => {
-            this_.$refs.zhuantaiEDataref.getMiddleLeft
-              ? this_.$refs.zhuantaiEDataref.getMiddleLeft()
-              : ""; // hhhh xxxx
-            this_.$refs.bottomCardLeft.getMiddleLeft
-              ? this_.$refs.bottomCardLeft.getMiddleLeft()
-              : ""; // hhhh xxxx
-            // this_.$refs.sheBeiWeiHuDataref.getMiddleLeft
-            //   ? this_.$refs.sheBeiWeiHuDataref.getMiddleLeft()
-            //   : "";
-            // }, 1000);
-          });
+          // this_.$nextTick(() => {
+          // setTimeout(() => {
+          // this_.$refs.zhuantaiEDataref.getMiddleLeft
+          //   ? this_.$refs.zhuantaiEDataref.getMiddleLeft()
+          //   : ""; // hhhh xxxx
+          // this_.$refs.bottomCardLeft.getMiddleLeft
+          //   ? this_.$refs.bottomCardLeft.getMiddleLeft()
+          //   : ""; // hhhh xxxx
+          // this_.$refs.sheBeiWeiHuDataref.getMiddleLeft
+          //   ? this_.$refs.sheBeiWeiHuDataref.getMiddleLeft()
+          //   : "";
+          // }, 1000);
+          // });
 
           let objRate = {};
+       
           objRate.name = "完好率";
           objRate.value = eIntactnessRate;
           this_.eBgRateData.data.push(objRate);
@@ -396,10 +432,11 @@ export default {
           objRate.name = "故障率";
           this_.eBgRateData.data.push(objRate);
           this_.eBgRateData.color = ["#339933", "#FF0033"];
-          // this_.eBgRateData.config.title = "设备完好率分布";
-          // this_.eBgRateData.config.idSelector = "main1";
+          this_.eBgRateData.config.title = "设备工作状态情况";
+          this_.eBgRateData.config.idSelector = "main1";
           //设备维护
           let objweihu = {};
+          this_.weiHuSheBeiData.data = [];
           objweihu.name = "计划维护数";
           objweihu.value = data[0].weiHuNoEquipments;
           this_.weiHuSheBeiData.data.push(objweihu);
@@ -410,20 +447,26 @@ export default {
           this_.weiHuSheBeiData.color = ["#5470c6", "#38a838"];
           this_.weiHuSheBeiData.config.title = "设备维护完成图";
           this_.weiHuSheBeiData.config.idSelector = "mainWeiHu";
+          this_.weiHuSheBeiDataShow = true;
           //设备核查
           let objHeCha = {}; //核查改维修
-          objHeCha.name = "维修申请";
+          this_.sheBeiHeChaData.data =[];
+          debugger
+          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";
+          this_.sheBeiHeChaDataShow = true;
           //设备检定校准
           let objJianding = {};
+          this_.jianDingjiaoZhunSheBeiData.data =[];
+          
           objJianding.name = "计划检定/校准数";
           objJianding.value = data[0].testNoEquipments;
           this_.jianDingjiaoZhunSheBeiData.data.push(objJianding);
@@ -434,17 +477,18 @@ export default {
           this_.jianDingjiaoZhunSheBeiData.color = ["#5470c6", "#38a838"];
           this_.jianDingjiaoZhunSheBeiData.config.title = "设备检定校准分布率";
           this_.jianDingjiaoZhunSheBeiData.config.idSelector = "mainJianDing";
-          setTimeout(() => {
-            // this_.$refs.middleCardCenter.getMiddleLeft
-            //   ? this_.$refs.middleCardCenter.getMiddleLeft()
-            //   : ""; // hhhh xxxx
-            // this_.$refs.sheBeiHeChaRef.getMiddleLeft
-            //   ? this_.$refs.sheBeiHeChaRef.getMiddleLeft()
-            //   : ""; //
-            // this_.$refs.jiandingRef.getMiddleLeft
-            //   ? this_.$refs.jiandingRef.getMiddleLeft()
-            //   : "";
-          }, 1000);
+          this_.jianDingjiaoZhunSheBeiDataShow = true;
+          // setTimeout(() => {
+          // this_.$refs.middleCardCenter.getMiddleLeft
+          //   ? this_.$refs.middleCardCenter.getMiddleLeft()
+          //   : ""; // hhhh xxxx
+          // this_.$refs.sheBeiHeChaRef.getMiddleLeft
+          //   ? this_.$refs.sheBeiHeChaRef.getMiddleLeft()
+          //   : ""; //
+          // this_.$refs.jiandingRef.getMiddleLeft
+          //   ? this_.$refs.jiandingRef.getMiddleLeft()
+          //   : "";
+          // }, 1000);
           objRate = {};
           this_.topBarData = result;
         })
@@ -461,6 +505,7 @@ export default {
       const sql =
         "select * from t_sbdj where she_bei_zhuang_ta ='禁止使用' or she_bei_zhuang_ta ='报废/停用'";
       let data1 = [];
+
       await curdPost("sql", sql)
         .then((res) => {
           const result = res.variables.data;
@@ -481,29 +526,30 @@ export default {
     async getCarouselShiYonglvTable() {
       let this_ = this;
       const sql = `select she_bei_ming_chen,she_bei_bian_hao_ ,create_time_,she_bei_zhuang_ku,COUNT(*) AS pinlv FROM t_mjsbsy GROUP BY she_bei_bian_hao_  HAVING create_time_ LIKE '${this.month}%' ORDER BY pinlv DESC`;
-      console.log(sql, "设备使用");
       let data1 = [];
       let res1 = [];
-      this_.shiyonglvConfig.data = [];
+      this.shiyonglvConfig.data = [];
       await curdPost("sql", sql)
         .then((res) => {
           const result = res.variables.data;
-          result.forEach((item) => {
-            data1 = [];
-            data1.push(item.she_bei_ming_chen);
-            data1.push(this_.timestampToTime(item.create_time_ / 1000));
-            data1.push(item.she_bei_zhuang_ku);
-            data1.push(item.pinlv);
-            this_.shiyonglvConfig.data.push(data1);
-            // this_.$forceUpdate()
-          });
-
+          if (result.length > 0) {
+            result.forEach((item) => {
+              data1 = [];
+              data1.push(item.she_bei_ming_chen);
+              data1.push(this_.timestampToTime(item.create_time_ / 1000));
+              data1.push(item.she_bei_zhuang_ku);
+              data1.push(item.pinlv);
+              this_.shiyonglvConfig.data.push(data1);
+              // this_.$forceUpdate()
+            });
+          }else{
+            this_.shiyonglvConfig.data.push(["无数据"])
+          }
           // console.log(this_.shiyonglvConfig.data);
         })
         .catch((err) => {
           console.log(err);
         });
-      this.isup = true;
     },
     timestampToTime(timestamp) {
       var date = new Date(timestamp * 1000);
@@ -654,12 +700,12 @@ export default {
       overflow: hidden;
       box-sizing: border-box;
     }
-    // .middleCardCenter {
-    //   width: 20%;
-    //   height: 100%;
-    //   overflow: hidden;
-    //   box-sizing: border-box;
-    // }
+    .middleCardCenter {
+      width: 28%;
+      height: 100%;
+      overflow: hidden;
+      box-sizing: border-box;
+    }
     .middleCardRight {
       width: 34%;
       height: 100%;
@@ -683,10 +729,10 @@ export default {
       width: 100%;
     }
     .bottomCardLeft {
-      width: 70%;
+      width: 100%;
     }
     .bottomCardright {
-      width: 56%;
+      width: 100%;
     }
   }
 }