fixBug

src/views/bigScreen/bigScreenLayout.vue

@@ -3,7 +3,7 @@
     <div class="digScreenLayout">
       <div class="bg1"></div>
       <bigScreenHead></bigScreenHead>
-      <router-view class="content"/>
+      <router-view v-if="refresh" class="content" />
     </div>
   </scalseBox>
 
@@ -12,12 +12,105 @@
 <script>
 import scalseBox from './components/scaleBox.vue'
 import bigScreenHead from "./components/bigScreenHead/index.vue";
-
+import { debounce } from "lodash";
 export default {
   name: 'DigScreenLayout',
   components: {
     scalseBox,
     bigScreenHead,
+  },
+  data () {
+    return {
+      socket: '',
+      path: '',
+      isRefresh: false,
+      refresh: true,
+      timer: null,
+    }
+  },
+  mounted () {
+    this.getUrl()
+    this.timer = setInterval(() => {
+      this.canRefresh();
+    }, 5 * 60 * 1e3);
+  },
+  methods: {
+    canRefresh () {
+      console.log('this.isRefresh',this.isRefresh);
+      if (this.isRefresh) {
+        this.refresh = false;
+        this.$forceUpdate();
+        setTimeout(() => {
+          this.refresh = true;
+          this.isRefresh = false;
+        }, 0)
+      }
+    },
+    getUrl () {
+      this.request({
+        url: '/getSocketUrl',
+        method: 'get',
+      }).then(res => {
+        if (200 == res.code) {
+          this.path = res.msg;
+          this.init()
+        }
+      })
+    },
+    init: function () {
+      if (typeof WebSocket === 'undefined') {
+        alert('您的浏览器不支持socket')
+      } else {
+        // 实例化socket
+        this.socket = new WebSocket(this.path)
+        console.log(this.socket)
+        // 监听socket连接
+        this.socket.onopen = this.open
+        // 监听socket错误信息
+        this.socket.onerror = this.error
+        // 监听socket消息
+        this.socket.onmessage = this.getMessage
+      }
+    },
+    open () {
+      console.log('socket连接成功')
+    },
+    error: function () {
+      console.log('连接错误')
+    },
+    getMessage (msg) {
+      console.log('getMessage')
+      const data = JSON.parse(msg.data)
+      console.log(data)
+      if (data.isRefresh) {
+        console.log('服务端数据更新');
+        this.isRefresh = true;
+        this.canRefresh();
+
+        // debounce(this.canRefresh, 1000 , true);
+      }
+      if (data.isConnect) {
+        console.log('链接成功');
+      }
+    },
+    close: function () {
+      console.log('socket已经关闭')
+    },
+    // debounce(fn, delay) {
+    // 	const delays = delay || 1 * 1e3
+    // 	let timer
+    // 	return function () {
+    // 		const th = this
+    // 		const args = arguments
+    // 		if (timer) {
+    // 			clearTimeout(timer)
+    // 		}
+    // 		timer = setTimeout(function () {
+    // 			timer = null
+    // 			fn.apply(th, args)
+    // 		}, delays)
+    // 	}
+    // },
   }
 }
 </script>
@@ -27,7 +120,7 @@ export default {
   position: relative;
   width: 1920px;
   height: 1080px;
-  background-color: #0D1049;
+  background-color: #0d1049;
   // background-image: url("../img/bg.png");
   background-size: cover;
   display: flex;

src/views/bigScreen/drivingCabin/left1.vue

@@ -161,7 +161,7 @@ export default {
 					titData.push(item.month);
 					COMPLETEDREVENUE.push(item.COMPLETEDREVENUE);
 					FORECASTREVENUE.push(item.FORECASTREVENUE);
-					TARGETREVENUE.push(item.COMPLETEDREVENUE/item.TARGETREVENUE * 100);
+					TARGETREVENUE.push((item.COMPLETEDREVENUE/item.TARGETREVENUE * 100).toFixed(2));
 				}
 				this.setOptions2(titData,COMPLETEDREVENUE,FORECASTREVENUE,TARGETREVENUE)
 			})
@@ -181,7 +181,7 @@ export default {
 				},
 				grid: {
 					containLabel: true,
-					left: 20,
+					left: 30,
 					right: 10,
 					top: 30,
 					bottom: 50,

src/views/bigScreen/drivingCabin/right2.vue

@@ -74,6 +74,9 @@ export default {
               color: '#fff'
             },
           },
+				tooltip: {
+					trigger: 'axis',
+				},
           grid: {
             left: '3%',
             right: '6%',

src/views/bigScreen/management/center.vue

@@ -158,7 +158,7 @@ export default {
         method: 'get',
         params: { type: type }
       }).then(res => {
-        if (200 == res.code) {
+        if (200 == res.code && res.data) {
           this.resData = res.data;
         }
       })
@@ -327,7 +327,7 @@ export default {
           let { list, rate } = res.data;
           this.chart2 = echarts.init(this.$refs.chart2, 'macarons')
           this.setOptions2(list);
-		  this.initChart3(rate);
+		      this.initChart3(rate);
         }
       })
 
@@ -350,20 +350,7 @@ export default {
         xAxis: [
           {
             type: 'category',
-            data: [
+            data: list.map(e=>e.month),
-              '2021-01',
-              '2021-02',
-              '2021-03',
-              '2021-04',
-              '2021-05',
-              '2021-06',
-              '2021-07',
-              '2021-08',
-              '2021-09',
-              '2021-10',
-              '2021-11',
-              '2021-12',
-            ],
             // axisPointer: {
             // 	type: 'shadow',
             // },
@@ -411,7 +398,9 @@ export default {
             type: 'line',
             yAxisIndex: 0,
             smooth: false,
-            data: [80, 70, 80, 70, 80, 70, 80, 70, 80, 70, 80, 70],
+            // 
+            data: list.map(e=>e.rate),
+            // data: [80, 70, 80, 70, 80, 70, 80, 70, 80, 70, 80, 70],
             itemStyle: {
               color: '#1098FF',
             },
@@ -433,6 +422,9 @@ export default {
       })
     },
     initChart3 (rate) {
+      if(!rate) {
+        return;
+      }
       this.chart3 = echarts.init(this.$refs.chart3, 'macarons')
       this.setOptions3(rate)
     },

src/views/bigScreen/management/right1.vue

@@ -16,7 +16,7 @@
           </el-date-picker>
           <div class="box"><span style="font-size: 25px">·</span><span style="font-size: 18px">总体完成率</span></div>
           <progressBar :percentage="rate.comprehensiveRate" style="margin: 10px 0 20px" />
-          <i class="num">80%</i>
+          <i class="num">{{rate.comprehensiveRate.toFixed(2) || 0}}%</i>
         </div>
       </div>
       <div style="display: flex; height: 100%" v-else>
@@ -203,7 +203,9 @@ export default {
       }).then(res => {
         if (200 == res.code) {
           let { rate, list } = res.data;
-          this.rate = rate;
+          if(rate) {
+            this.rate = rate;
+          }
           this.chart = echarts.init(this.$refs.chart)
           this.chart.setOption({
             tooltip: {

src/views/bigScreen/management/right2.vue

@@ -16,7 +16,7 @@
           </div>
           <div class="tag">
             <div class="title">新签合同额</div>
-            <i style="font-size: 24px; font-weight: bold; color: #91d5fe">300/<i style="font-size: 18px">{{total.newContractAmount}}</i></i>
+            <i style="font-size: 24px; font-weight: bold; color: #91d5fe">{{total.newContractAmount}}<i style="font-size: 18px"></i></i>
             万
           </div>
         </div>

src/views/bigScreen/securityManage/center.vue

@@ -96,57 +96,32 @@ export default {
         },
         {
           "name": "三级",
-          "COUNTNUMBER": 1
+          "COUNTNUMBER": 0
         },
         {
           "name": "一级",
-          "COUNTNUMBER": 1
+          "COUNTNUMBER": 0
         }
       ],
       sourceLevelCount: [
         {
           "name": "二级",
-          "COUNTNUMBER": 2
+          "COUNTNUMBER": 0
         },
         {
           "name": "三级",
-          "COUNTNUMBER": 1
+          "COUNTNUMBER": 0
         },
         {
           "name": "四级",
-          "COUNTNUMBER": 1
+          "COUNTNUMBER": 0
         },
         {
           "name": "一级",
-          "COUNTNUMBER": 1
+          "COUNTNUMBER": 0
         }
       ],
-      points: [
+      points: []
-        {
-          "id": 1,
-          "pointName": "1号大门",
-          "deptName": "部门七",
-          "level": "一级",
-          "status": "运行中",
-          "abscissa": "55%",
-          "ordinate": "65%",
-          "rtmpAddress": "baiddakdnkad",
-          "remark": "没有备注",
-          "createTime": null
-        },
-        {
-          "id": 2,
-          "pointName": "爆炸点",
-          "deptName": "人事部",
-          "level": "三级",
-          "status": "运作中",
-          "abscissa": "0.65",
-          "ordinate": "0.65",
-          "rtmpAddress": "dhuiagduadad",
-          "remark": "这是备注",
-          "createTime": "2021-12-09 14:32:55"
-        }
-      ]
     }
   },
   mounted () {

src/views/bigScreen/securityManage/left1.vue

@@ -89,69 +89,10 @@ export default {
   },
   data () {
     return {
-      data: [
-        { value: 154, name: '类别一' },
-        { value: 775, name: '类别二' },
-        { value: 679, name: '类别三' },
-        { value: 679, name: '类别四' },
-        { value: 679, name: '类别五' },
-        { value: 679, name: '类别六' },
-        { value: 679, name: '类别七' },
-        { value: 679, name: '类别八' },
-      ],
       colorList,
       listData: [1, 2, 3, 4,5,6,7,8],
       rate: 0,
-      points: [
+      points: [],
-        {
-          "id": 1,
-          "pointName": "1号大门",
-          "deptName": "部门七",
-          "level": "一级",
-          "status": "运行中",
-          "abscissa": "55%",
-          "ordinate": "65%",
-          "rtmpAddress": "baiddakdnkad",
-          "remark": "没有备注",
-          "createTime": null
-        },
-        {
-          "id": 2,
-          "pointName": "1号大门",
-          "deptName": "部门七",
-          "level": "一级",
-          "status": "运行中",
-          "abscissa": "55%",
-          "ordinate": "65%",
-          "rtmpAddress": "baiddakdnkad",
-          "remark": "没有备注",
-          "createTime": null
-        },
-        {
-          "id": 3,
-          "pointName": "1号大门",
-          "deptName": "部门七",
-          "level": "一级",
-          "status": "运行中",
-          "abscissa": "55%",
-          "ordinate": "65%",
-          "rtmpAddress": "baiddakdnkad",
-          "remark": "没有备注",
-          "createTime": null
-        },
-        {
-          "id": 4,
-          "pointName": "1号大门",
-          "deptName": "部门七",
-          "level": "一级",
-          "status": "运行中",
-          "abscissa": "55%",
-          "ordinate": "65%",
-          "rtmpAddress": "baiddakdnkad",
-          "remark": "没有备注",
-          "createTime": null
-        },
-      ],
       flvPlayer: null,
     }
   },

src/views/bigScreen/securityManage/left2.vue

@@ -85,19 +85,7 @@ export default {
       colorList,
 
       listData: [1, 2, 3, 4, 5, 6, 7, 8],
-      scrollList: [
+      scrollList: [],
-        {
-          "id": 1,
-          "month": "2021-01",
-          "workshopName": "车间一",
-          "dangerContent": "没有灭火器",
-          "category": "一类",
-          "measures": "已整改",
-          "personLiable": "小明",
-          "remark": "小明xxx",
-          "createTime": null
-        },
-      ],
 
       dateRange: [],
       chart1: null,