冷端看板

.env.prod

@@ -21,7 +21,7 @@ VUE_APP_BASE_API = ''
 PUBLIC_PATH = ''
 
 # ws地址
-WSURL = '100.64.0.45:48080'
+VUE_APP_WS_API = 'ws://100.64.0.45:48080'
 
 # 二级部署路径
 VUE_APP_APP_NAME ='yudao-admin'

src/views/dashboard/coldDashboard/components/dataBox.vue

@@ -16,36 +16,36 @@
     <span class='rb' v-if='position == "rb"'></span>
     <div class="centerBox">
       <div class="centerBoxItem1">
-        <span class='num'>213,452片</span>
+        <span class='num'>{{msgData?.cut || '-'}}片</span>
         <span class='name'>- 预计切割片数 -</span>
       </div>
       <div class="centerBoxItem1">
-        <span class='num'>95.32%</span>
+        <span class='num'>{{msgData?.allRatio ? msgData?.allRatio*100:'-'}}%</span>
         <span class='name'>- 综合面积良品率 -</span>
       </div>
       <div class="centerBoxItem2">
         <span class='name'>掰边后片数：</span>
-        <span class='num'>23,452片</span>
+        <span class='num'>{{msgData?.bai || '-'}}片</span>
       </div>
       <div class="centerBoxItem2">
         <span class='name'>掰边后良品率：</span>
-        <span class='num'>98%</span>
+        <span class='num'>{{msgData?.baiRatio ? msgData?.baiRatio*100 : '-'}}%</span>
       </div>
       <div class="centerBoxItem2">
         <span class='name'>顶板后片数：</span>
-        <span class='num'>23,452片</span>
+        <span class='num'>{{msgData?.ding || '-'}}片</span>
       </div>
       <div class="centerBoxItem2">
         <span class='name'>顶板后良品率：</span>
-        <span class='num'>98%</span>
+        <span class='num'>{{msgData?.dingRatio ? msgData?.dingRatio*100 : '-'}}%</span>
       </div>
       <div class="centerBoxItem2">
         <span class='name'>下片片数：</span>
-        <span class='num'>23,452片</span>
+        <span class='num'>{{msgData?.xia || '-'}}片</span>
       </div>
       <div class="centerBoxItem2">
         <span class='name'>下片良品率：</span>
-        <span class='num'>98%</span>
+        <span class='num'>{{msgData?.xiaRatio ? msgData?.xiaRatio*100 : '-'}}%</span>
       </div>
     </div>
   </div>
@@ -61,6 +61,10 @@ export default {
     position:{
       type: String,
       default: ''
+    },
+    msgData: {
+      type: Object,
+      default: () => {}
     }
   },
   data() {

src/views/dashboard/coldDashboard/index.vue

@@ -5,10 +5,10 @@
 				:isFullScreen="isFullScreen"
 				@screenfullChange="screenfullChange"
 				topTitle="自贡冷端数据看板" />
-        <DataBox title='冷端1线' position='lt' class="box1"/>
+        <DataBox title='原片产线1' position='lt' :msgData='line1' class="box1"/>
-        <DataBox title='冷端2线' position='rt' class="box2"/>
+        <DataBox title='原片产线2' position='rt' :msgData='line2' class="box2"/>
-        <DataBox title='冷端3线' position='lb' class="box3"/>
+        <DataBox title='原片产线3' position='lb' :msgData='line3' class="box3"/>
-        <DataBox title='冷端4线' position='rb' class="box4"/>
+        <DataBox title='原片产线4' position='rb' :msgData='line4' class="box4"/>
     </div>
   </div>
 </template>
@@ -31,6 +31,10 @@ export default {
 			permission: false,
 			url: process.env.VUE_APP_WS_API,
 			websock: '',
+			line1:{},
+			line2:{},
+			line3:{},
+			line4:{}
     }
   },
 	created() {
@@ -52,6 +56,7 @@ export default {
 	},
 	destroyed() {
 		window.removeEventListener('resize', this.boxReset);
+		this.websocketclose();
 	},
   methods: {
     boxReset() {
@@ -126,42 +131,24 @@ export default {
 			this.initWebSocket();
 		},
 		websocketonmessage(e) {
-			let dataJson = JSON.parse(e.data);
+			let msgData = e.data
-			console.log(dataJson);
+			try {
-			// 数据接收
+				msgData = JSON.parse(e.data);
-			if ('DeepState' in dataJson) {
+			} catch (error) {
-				this.topData = dataJson.DeepState;
+				console.log("websocket: [unable to msgData] :  ", e.data);
-        if(!this.permission){
-          this.topData.yestodaySum = '***'
-          this.topData.monthSum = '***'
-          this.topData.monthAreaCost = '***'
 			}
-			}
+			if (!Object.prototype.toString.call(msgData).includes('Object')) return;
-			if ('DeepEnergyTableList' in dataJson) {
+			if (!this.permission) return
-				this.tableData1 = dataJson.DeepEnergyTableList;
+			msgData.originRatioTables && msgData.originRatioTables.forEach((item) => {
-        if(!this.permission){
+			  item.lineName.includes('1') && (this.line1 = item);
-          this.tableData1.forEach(item=>{
+			  item.lineName.includes('2') && (this.line2 = item);
-            item.elecPrice = null
+			  item.lineName.includes('3') && (this.line3 = item);
+			  item.lineName.includes('4') && (this.line4 = item);
 			})
-        }
+		},
-			}
+		websocketsend() {
-			if ('DeepCostTableList' in dataJson) {
+			// 数据发送
-				this.tableData2 = dataJson.DeepCostTableList;
+			this.websock.send('');
-        if(!this.permission){
-          this.tableData2.forEach(item=>{
-            item.priceD = null
-          })
-        }
-			}
-			if ('DeepPdTables' in dataJson) {
-				this.tableData3 = dataJson.DeepPdTables;
-			}
-			if ('DeepCostTrendList' in dataJson) {
-				this.echartData = dataJson.DeepCostTrendList;
-				this.$nextTick(() => {
-          this.$refs.chartRef.initChart(!this.permission);
-				});
-			}
 		},
 		websocketsend(val) {
 			// 数据发送
@@ -169,6 +156,7 @@ export default {
 		},
 		websocketclose(e) {
 			// 关闭
+			this.websock.close();
 			console.log('断开连接', e);
 		},
   }