From aba493c846ad41be21f45f12185d61c8359206b3 Mon Sep 17 00:00:00 2001
From: lixiaobang <2547956374@qq.com>
Date: Wed, 9 Nov 2022 14:32:09 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BB=A3=E7=A0=81=E6=8F=90=E4=BA=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/index.js                   |  12 ++
 src/views/Home.vue                 | 115 +++++++++++++------
 src/views/HomePop/ringMainUnit.vue | 171 ++++++++++++++++++++++-------
 vue.config.js                      |   3 +-
 4 files changed, 229 insertions(+), 72 deletions(-)

diff --git a/src/api/index.js b/src/api/index.js
index 6d65199..2781189 100644
--- a/src/api/index.js
+++ b/src/api/index.js
@@ -33,4 +33,16 @@ export const getGdtj = (params) => {
     return axios.get('/Handler/gdtj.ashx', {
         params
     })
+};
+//查询单位本周故障
+export const getDwbzgz = (params) => {
+    return axios.get('/Handler/Dwbzgz.ashx', {
+        params
+    })
+};
+//查询供电所供电质量情况
+export const getGdsgdzl = (params) => {
+    return axios.get('/Handler/Gdsgdzl.ashx', {
+        params
+    })
 };
\ No newline at end of file
diff --git a/src/views/Home.vue b/src/views/Home.vue
index bf59a53..58451dd 100644
--- a/src/views/Home.vue
+++ b/src/views/Home.vue
@@ -326,7 +326,7 @@
 </template>
 
 <script>
-import { getCompanyInfo,getLine,getBanzugz,getGdtj} from "../api/index.js";
+import { getCompanyInfo,getLine,getBanzugz,getGdtj,getDwbzgz,getGdsgdzl} from "../api/index.js";
 import ringMainUnit from  "./HomePop/ringMainUnit.vue"
 export default {
   name: "home",
@@ -335,7 +335,7 @@ export default {
   },
   data() {
     return {
-      dataGzList:[],
+      dataGzList:[], //年故障数组
       dateList: ['周','月'],
       acolor: true,//是否展示颜色
       currentIndex : -1,
@@ -441,8 +441,17 @@ export default {
        this.dataGzList=res.data.data
         this.detailedFour(this.dataGzList);
     })
-    this.detailedOne();
-    this.detailedTwo();
+    //本周故障
+    getDwbzgz().then((res)=>{
+      let dataBzgz = []
+      dataBzgz = res.data.data;
+      this.detailedOne(dataBzgz);
+    })
+    getGdsgdzl().then((res)=>{
+      let dataGdzl = []
+      dataGdzl = res.data.data
+      this.detailedTwo(dataGdzl);
+    })
     this.detailedFive();
     this.handleDate(0);
     let that = this;
@@ -476,12 +485,18 @@ export default {
         }
       })
     },
-    detailedOne() {
-      let dataList = [1,1, 4, 6,5, 9, 4,5,0,3]
+    detailedOne(dataBzgz) {
+      let dataList = [];
+      let newArr = [20,20, 20, 20,20, 20, 20,20,20,20];
+      let dataDw = []
+      for (let i = 0; i < dataBzgz.length; i++) {
+        dataList.push(dataBzgz[i].gzcs);
+        dataDw.push(dataBzgz[i].dw)
+      }
       var myChart = this.$echarts.init(document.getElementById("detailedOne"));
       var option = {
         tooltip: {
-          show:false,
+          show:true,
           trigger: "axis",
           axisPointer: {
             type: "shadow",
@@ -497,7 +512,7 @@ export default {
         xAxis: [
           {
             type: "category",
-            data: ["工区", "三新", "盐都", "滨海", "大丰", "东台", "阜宁", "建湖", "射阳", "响水"],
+            data: dataDw,
             axisTick: {
               show:false,
               alignWithLabel: true,
@@ -527,6 +542,16 @@ export default {
             },
             splitLine:{
               show:true,
+               lineStyle: {
+                type: 'solid',
+                // color: 'rgba(66, 192, 255, .3)',
+                color: 'rgba(102,102,102,0.6)',
+                width: 1
+                // color: 'red'
+              },
+            },
+            splitArea: {
+              show: false
             }
           },
         ],
@@ -552,7 +577,7 @@ export default {
             },
             silent:true,
             barGap:'-100%',
-            data:[100,100,100,100,100,100,100,100,100,100]
+            data: newArr
           },
           {
             name: "Direct",
@@ -586,8 +611,18 @@ export default {
 
       myChart.setOption(option);
     },
-     detailedTwo(){
-     
+     detailedTwo(dataGdzl){
+       console.log(dataGdzl,'供电质量');
+       let gdsList = [];
+       let xlcczList =  [];
+       let pbcczList = [];
+       let ddyList = [];
+       for (let i = 0; i < dataGdzl.length; i++) {
+         gdsList.push(dataGdzl[i].gds)
+         xlcczList.push(dataGdzl[i].xlccz)
+         pbcczList.push(dataGdzl[i].pbccz)
+         ddyList.push(dataGdzl[i].ddy)
+       }
        let that = this;
       var myChart = this.$echarts.init(document.getElementById("detailedTwo"));
       var option = {
@@ -599,6 +634,12 @@ export default {
                 backgroundColor: '#6a7985'
             }
           }
+        },
+         grid: {
+          left: "1%",
+          right: "3%",
+          bottom: "10%",
+          containLabel: true,
         },
           legend: {
             icon:'rect',
@@ -611,7 +652,7 @@ export default {
           },
         xAxis: {
           type: "category",
-          data: ["盐都直属", "大冈", "大纵湖", "尚庄", "郭猛", "秦南", "西区","楼王","学富","潘黄","龙冈"],
+          data: gdsList,
           axisLine: {
             //  改变x轴颜色
             lineStyle: {
@@ -620,6 +661,7 @@ export default {
           },
       axisLabel: {
         //  改变x轴字体颜色和大小
+        interval:0,
         textStyle: {
           color: "#ffffff",
           fontSize: 16,
@@ -643,25 +685,25 @@ export default {
             color: "none",
           },
         },
-    axisLabel: {
-      //  改变y轴字体颜色和大小
-      //formatter: '{value} m³ ', //  给y轴添加单位
-      textStyle: {
-        color: "#ffffff",
-        fontSize: 16,
+      axisLabel: {
+        //  改变y轴字体颜色和大小
+        //formatter: '{value} m³ ', //  给y轴添加单位
+        textStyle: {
+          color: "#ffffff",
+          fontSize: 16,
+        },
       },
-    },
-    axisTick: {
-      show: false,
-    },
-    splitLine: {
-      show: true,
-      lineStyle: {
-        color: ["#315070"],
-        width: 1,
-        type: "solid",
+      axisTick: {
+        show: false,
+      },
+      splitLine: {
+        show: true,
+        lineStyle: {
+          color: ["#315070"],
+          width: 1,
+          type: "solid",
+        },
       },
-    },
   },
   series: [
     {
@@ -673,7 +715,7 @@ export default {
         symbol: "circle",
       },
       name: "线路重超载",
-      data: [0,6,5,7,5,6,9,10,9,11,11,13,15],
+      data: xlcczList,
       itemStyle: {
         normal: {
           color: "#3D7EEB",
@@ -718,7 +760,7 @@ export default {
       markPoint: {
         symbol: "circle",
       },
-      data: [0,5,4,6,4,5,8,5,8,9,9,10,12],
+      data: pbcczList,
       name: "配变重超载",
       itemStyle: {
         normal: {
@@ -764,7 +806,7 @@ export default {
       markPoint: {
         symbol: "circle",
       },
-      data: [0,4,3,5,2,4,7,4,7,8,7,9,10],
+      data: ddyList,
       name: "低电压",
       itemStyle: {
         normal: {
@@ -835,7 +877,7 @@ export default {
           if (param.data.type == null) {
             return param.data.name + ":" + param.value + "个";
           } else {
-            return param.data.type + ":" + param.value + "个";
+            return param.data.name + ":" + param.value + "个";
           }
         },
       },
@@ -956,7 +998,6 @@ export default {
         yearWchz.push(dataList[i].wchz)
         yearJieDi.push(dataList[i].jiedi)
       }
-      console.log(yearBzData);
         let that = this
       var myChart = this.$echarts.init(document.getElementById("detailedFour"));
       var option = {
@@ -1914,4 +1955,10 @@ export default {
     background-color: rgb(18,54,87) !important;
 }
 }
+/**
+表格有滚动效果但是不显示滚动条
+*/
+.table ::-webkit-scrollbar{
+   display:none;
+}
 </style>
diff --git a/src/views/HomePop/ringMainUnit.vue b/src/views/HomePop/ringMainUnit.vue
index 3e9bc00..aa0fe53 100644
--- a/src/views/HomePop/ringMainUnit.vue
+++ b/src/views/HomePop/ringMainUnit.vue
@@ -22,8 +22,8 @@
                 <div class="content">
                     <div class="information">
                             <div class="informationContent">环网柜名称&nbsp;&nbsp;&nbsp;&nbsp;{{ringMainUnit}}</div>
-                            <div class="informationContent">环网柜编号&nbsp;&nbsp;&nbsp;&nbsp;125-569-0321-0</div>
-                            <div class="informationContent">IP地址&nbsp;&nbsp;&nbsp;&nbsp;192.134.0.0</div>
+                            <div class="informationContent">环网柜编号&nbsp;&nbsp;&nbsp;&nbsp;{{deviceInformation.deivce_bianhao}}</div>
+                            <div class="informationContent">IP地址&nbsp;&nbsp;&nbsp;&nbsp;{{deviceInformation.deivce_ip}}</div>
                             <div class="informationContent">总间隔&nbsp;&nbsp;&nbsp;&nbsp;XXXXXXXX</div>
                     </div>
                 </div>
@@ -184,37 +184,109 @@ export default {
                 name:'',
                 phase:'A',
                 interval1:'25',
-                interval2:'25',
-                interval3:'25',
-                interval4:'25',
-                interval5:'25',
-                interval6:'25',
-                interval7:'25',
-                interval8:'25',
+                interval2:'20',
+                interval3:'24',
+                interval4:'23',
+                interval5:'24',
+                interval6:'22',
+                interval7:'21',
+                interval8:'29',
             },
              {
                 name:'电压/KV',
                 phase:'B',
                 interval1:'25',
+                interval2:'20',
+                interval3:'24',
+                interval4:'23',
+                interval5:'24',
+                interval6:'22',
+                interval7:'21',
+                interval8:'29',
+            },
+             {
+                name:'',
+                phase:'C',
+                interval1:'21',
                 interval2:'25',
-                interval3:'25',
-                interval4:'25',
-                interval5:'25',
-                interval6:'25',
-                interval7:'25',
-                interval8:'25',
+                interval3:'23',
+                interval4:'27',
+                interval5:'24',
+                interval6:'28',
+                interval7:'22',
+                interval8:'21',
+            },
+             {
+                name:'',
+                phase:'A',
+                interval1:'21',
+                interval2:'25',
+                interval3:'23',
+                interval4:'27',
+                interval5:'24',
+                interval6:'28',
+                interval7:'22',
+                interval8:'21',
+            },
+             {
+                name:'电流/A',
+                phase:'B',
+                interval1:'25',
+                interval2:'20',
+                interval3:'24',
+                interval4:'23',
+                interval5:'24',
+                interval6:'22',
+                interval7:'21',
+                interval8:'29',
+            },
+             {
+                name:'',
+                phase:'C',
+               interval1:'21',
+                interval2:'25',
+                interval3:'23',
+                interval4:'27',
+                interval5:'24',
+                interval6:'28',
+                interval7:'22',
+                interval8:'21',
+            },
+             {
+                name:'',
+                phase:'A',
+                interval1:'21',
+                interval2:'25',
+                interval3:'23',
+                interval4:'27',
+                interval5:'24',
+                interval6:'28',
+                interval7:'22',
+                interval8:'21',
+            },
+             {
+                name:'温度/℃',
+                phase:'B',
+                interval1:'25',
+                interval2:'20',
+                interval3:'24',
+                interval4:'23',
+                interval5:'24',
+                interval6:'22',
+                interval7:'21',
+                interval8:'29',
             },
              {
                 name:'',
                 phase:'C',
                 interval1:'25',
-                interval2:'25',
-                interval3:'25',
-                interval4:'25',
-                interval5:'25',
-                interval6:'25',
-                interval7:'25',
-                interval8:'25',
+                interval2:'20',
+                interval3:'24',
+                interval4:'23',
+                interval5:'24',
+                interval6:'22',
+                interval7:'21',
+                interval8:'29',
             },
         ],
         echartsData : {
@@ -259,37 +331,43 @@ export default {
           remainingTimeDisplay: false,
           fullscreenToggle: true // 全屏按钮
         }
-         }
+         },
+         deviceInformation:{}
     }
    },
    mounted(){
-       this.intervalShow()
-      console.log(this.ringMainUnit);
+       this.intervalShow(),
+        getDevice({
+              action : 'querydevice',
+              device_name : this.ringMainUnit
+            }).then((res)=>{
+              if (res.data.data != null) {
+                this.deviceInformation = res.data.data
+              }
+              
+          })
    },
    methods:{
        handleClick(tab) {
          let that = this;
         if (tab.index == 0) {
             this.activeName =  'first'
+            this.$nextTick(()=>{
+              this.intervalClick(tab)
+            })
+            
         }else if (tab.index == 1) {
             this.activeName =  'second'
             getDevice({
               action : 'querydevice',
               device_name : that.ringMainUnit
             }).then((res)=>{
-              console.log(res.data.data.device.devcie_id);
-              let deviceId = res.data.data.device.devcie_id
-              getDevice(
-              {
-                action : 'querymaterial',
-                device_id : deviceId
-              }).then((res)=>{
-                console.log(res.data.data,"素材");
-                this.photoList = Object.keys(res.data.data).map((item,index)=>{
-                  let photoUrl = 'http://172.16.1.254:3111'+ res.data.data[index].url
+              if (res.data.data.pic != null) {
+                this.photoList = Object.keys(res.data.data.pic).map((item,index)=>{
+                  let photoUrl = ' http://111.229.30.246:3111'+ res.data.data.pic[index].url
                 return {photo:photoUrl}
                 })
-              })
+              }
             })
             
             
@@ -298,6 +376,7 @@ export default {
       intervalClick(tab){
           if (tab.index == 0) {
             this.intervalName =  'first'
+            this.intervalShow()
         }else if (tab.index == 1) {
             this.intervalName =  'second'
             // this.echartsData.time = ['lala','momo']
@@ -462,6 +541,23 @@ export default {
 <style lang="less" scoped>
 //表格
 .user_skills {
+    /**
+  表格有滚动效果但是不显示滚动条
+  */
+  /deep/ .is-scrolling-none {
+      overflow: hidden;
+      overflow-y: auto;
+      overflow-x: scroll;
+    }
+    /deep/ .is-scrolling-none::-webkit-scrollbar {
+      display: none;
+    }
+    /deep/.el-table--scrollable-y ::-webkit-scrollbar {
+      display: none;
+    }
+    /deep/.el-table--scrollable-x ::-webkit-scrollbar {
+      display: none;
+    }
   /deep/ .el-table {
     background-color: transparent !important;
   }
@@ -504,7 +600,7 @@ export default {
     color: rgb(86,254,226);
   }
 /deep/.el-table .el-table__cell{
-    padding: 3px 0
+    padding: 5px 0
 }
   &::before {
     //去除底部白线
@@ -722,4 +818,5 @@ export default {
 .el-tabs__nav-wrap::after{
  background-color: rgb(38,114,120) !important;
 }
+
 </style>
diff --git a/vue.config.js b/vue.config.js
index 3472e4d..6be8979 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -15,7 +15,8 @@ module.exports = {
         // port: 8989, // 开发服务器运行端口号
         proxy: {
             '/api': { //代理的名字
-                target: 'http://172.16.1.254:3111/', 
+                target:' http://111.229.30.246:3111/',
+                // target: 'http://172.16.1.254:3111/', 
                 ws: true,
                 changeOrigin: true,
                 pathRewrite:{