From fae941098d1cb83ee48b94c7af403244bbd76a6b Mon Sep 17 00:00:00 2001
From: lzhe <lzhe@example.com>
Date: 星期五, 17 五月 2024 16:42:04 +0800
Subject: [PATCH] 1

---
 src/views/mdc/station-live.vue |  234 ++++++++++++++++++++++++++++++++++++++++++++++++++--------
 1 files changed, 201 insertions(+), 33 deletions(-)

diff --git a/src/views/mdc/station-live.vue b/src/views/mdc/station-live.vue
index 4a63168..70027b6 100644
--- a/src/views/mdc/station-live.vue
+++ b/src/views/mdc/station-live.vue
@@ -2,7 +2,7 @@
  * @Author: lzhe lzhe@example.com
  * @Date: 2024-03-26 10:28:33
  * @LastEditors: lzhe lzhe@example.com
- * @LastEditTime: 2024-05-15 09:44:50
+ * @LastEditTime: 2024-05-15 16:25:52
  * @FilePath: /smart-web/src/views/master/person/main/index.vue
  * @Description: 杩欐槸榛樿璁剧疆,璇疯缃甡customMade`, 鎵撳紑koroFileHeader鏌ョ湅閰嶇疆 杩涜璁剧疆: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 -->
@@ -81,13 +81,21 @@
 							<div id="wcs-log" style="width: 100%;height:200px;"></div>
 							<el-table ref="multipleTableRef1" :data="recordData" border style="width: 100%;">
 								<el-table-column prop="shiftIndexName" label="鐝"></el-table-column>
-								<el-table-column prop="temdata" label="璋冭瘯"></el-table-column>
-								<el-table-column prop="temdata" label="绂荤嚎"></el-table-column>
-								<el-table-column prop="temdata" label="寰呮満"></el-table-column>
-								<el-table-column prop="temdata" label="鎶ヨ"></el-table-column>
-								<el-table-column prop="temdata" label="杩愯"></el-table-column>
-								<el-table-column prop="oee" label="绋煎姩鐜�%"></el-table-column>
-								<el-table-column prop="perdata" label="鎶ヨ鐜�%"></el-table-column>
+								<el-table-column prop="5" label="璋冭瘯"></el-table-column>
+								<el-table-column prop="4" label="绂荤嚎"></el-table-column>
+								<el-table-column prop="3" label="寰呮満"></el-table-column>
+								<el-table-column prop="1" label="鎶ヨ"></el-table-column>
+								<el-table-column prop="2" label="杩愯"></el-table-column>
+								<el-table-column prop="oee" label="绋煎姩鐜�%">
+									<template #default="scope">
+										<span>{{(Number(scope.row.oee) * 100).toFixed(2)}}</span>
+									</template>
+								</el-table-column>
+								<el-table-column prop="perdata" label="鎶ヨ鐜�%">
+									<template #default="scope">
+										<span>{{(Number(scope.row.fault) * 100).toFixed(2)}}</span>
+									</template>
+								</el-table-column>
 							</el-table>
 						</div>
 					</div>
@@ -240,20 +248,7 @@
 						type: 'category',
 						data: ['1', '2']
 					},
-					series: [
-						{	
-		                    name: 'wcsLog',  
-		                    type: 'bar',   
-		                    data: [],  
-		                    emphasis: {  
-		                        itemStyle: {  
-		                            shadowBlur: 10,  
-		                            shadowOffsetX: 0,  
-		                            shadowColor: 'rgba(0, 0, 0, 0.5)'  
-		                        }  
-		                    }  
-						}
-					]
+					series: []
 				},
 				dmpList: [],
 				stationForm: {
@@ -290,7 +285,9 @@
 					current: "1",
 					size: "15"
 				},
-				recordData: [] // 鐝鐘舵�佽褰晅able
+				records: [],
+				recordData: [], // 鐝鐘舵�佽褰晅able
+				allwcs: []
 			}
 		},
 		created(){
@@ -344,27 +341,109 @@
 				}
 				this.$HTTP.post(`/api/blade-mdc/status-record/shift-index-status-record-table`,obj).then(res=> {
 					if(res.code == 200) {
-						res.data.forEach(item=> {
-							item.temdata = "00:00:00";
-							item.perdata = "0";
-						})
+						var defaultValues = {  
+							oee: 0,  
+							fault: 0,  
+							'1': "00:00:00",  
+							'2': "00:00:00",  
+							'3': "00:00:00",  
+							'4': "00:00:00",  
+							'5': "00:00:00"  
+						};  
+						res.data.forEach(item => {  
+							Object.keys(defaultValues).forEach(key => {  
+								if (!item[key]) {  
+								item[key] = defaultValues[key];  
+								}  
+							});  
+						});
 						this.recordData = res.data;
 					}
 				})
 			},
+			renderItem(params, api) {
+				var categoryIndex = api.value(0);
+				var start = api.coord([api.value(1), categoryIndex]);
+				var end = api.coord([api.value(2), categoryIndex]);
+				var height = api.size([0, 1])[1] * 0.6;
+				var rectShape = echarts.graphic.clipRectByRect(
+					{
+						x: start[0],
+						y: start[1] - height / 2,
+						width: end[0] - start[0],
+						height: height
+					},
+					{
+						x: params.coordSys.x,
+						y: params.coordSys.y,
+						width: params.coordSys.width,
+						height: params.coordSys.height
+					}
+				);
+				return (
+						rectShape && {
+						type: 'rect',
+						transition: ['shape'],
+						shape: rectShape,
+						style: api.style()
+					}
+				);
+			},
+			getColor(name) {
+				var color = '';
+				this.achievements.forEach(item=> {
+					if(item.code == name) {
+						color = item.color;
+					}
+				})
+				return color;
+			},
+			getStatus(name) {
+				var stauts = {};
+				this.allwcs.forEach(item=> {
+					if(item.code == name) {
+						stauts.name= item.name;
+						stauts.type= item.type;
+					}
+				})
+				return stauts;
+			},
 			getlogcart() {  //鐝鐘舵�佽褰昪hart
 				var obj = {
-					date: this.wcsDate,
+					//date: this.wcsDate,
+					date : "2024-05-15",
 					humanFeedback: true,
 					workstationId: this.lastLevelId
 				}
-				this.$HTTP.post(`/api/blade-mdc/status-record/shift-index-status-record-table`,obj).then(res=> {
+				this.$HTTP.post(`/api/blade-mdc/status-record/shift-index-status-record-chart`,obj).then(res=> {
 					if(res.code == 200) {
-						var myChart = echarts.init(document.getElementById('wcs-log')); 
-						res.data.forEach(item => {
-							item.value = 0;
+						var yAxisData = [];
+						var newData = [];
+						this.records = res.data.reverse();
+						res.data.forEach((item,index)=> {
+							yAxisData.push(item.shiftIndex);
+							//璁$畻寮�濮嬫椂闂达紝鏄剧ず鏃堕棿
+							if(item.statusRecordList == null) item.statusRecordList = [];
+							item.statusRecordList.forEach(item1=> {
+								var initstart = item1.startTime.split(" ")[0];  //鏍规嵁鏃ユ湡璁$畻宸��
+								var startTime = moment(item1.startTime).diff(moment(initstart + " 00:00:00"), 'minutes');
+								var endTime = moment(item1.endTime).diff(moment(initstart + " 00:00:00"), 'minutes');
+								var diff = moment(item1.endTime).diff(moment(item1.startTime), 'minutes') //寮�濮嬩簡澶氫箙
+								var color = this.getColor(item1.wcs);
+								item1.value = [index,startTime,endTime,diff];
+								item1.itemStyle = {"normal": {"color": color}};
+								item1.statusName = this.getStatus(item1.wcs).name;
+                            	item1.statusType = this.getStatus(item1.wcs).type;
+							})
+							newData.push(...item.statusRecordList);
 						})
-						this.wcsOptionLog.series[0].data = res.data;
+						//娓叉煋鍥捐〃
+						this.setCharts(yAxisData,newData);
+
+						var nowTime = moment().format("HH:mm:ss");  //11:37:54
+						var spaceTime = moment(obj.date + " " + nowTime).diff(moment(obj.date + " 00:00:00"), 'hours');  //绂诲綋澶�00:00:00杩囦簡澶氬皯灏忔椂
+						console.log(spaceTime,obj.date + " " + nowTime,234)
+						return;
 						//璁$畻鏃堕棿
 						var startOfDay = moment().startOf('day'); //00:00:00
 						var now = moment();  //褰撳墠鏃堕棿
@@ -386,6 +465,88 @@
 						myChart.setOption(this.wcsOptionLog);
 					}
 				})
+			},
+			setCharts(yAxisData,data) {
+				var option = {
+					tooltip: {
+						formatter: function (params) {
+							if(params.data.statusType == 4) {
+								var dom = `<span class="tipdesc">宸ヤ綅:</span>${params.data.name}</br>
+											<span class="tipdesc">鐘舵��:</span>${params.data.wcsDesc}</br>
+											<span class="tipdesc">鎻忚堪:</span>${params.data.feedbackDesc}</br>
+											<span class="tipdesc">鐘舵�佹椂闂�:</span>${params.data.startTime} 锝� ${params.data.endTime}</br>
+											<span class="tipdesc">鍙嶉鏃堕棿:</span>${params.data.feedbackTime}</br>
+											<span class="tipdesc">鍙嶉浜�:</span>${params.data.feedUser}</br>`
+							}else {
+								var dom = `<span class="tipstatus">${params.data.statusName}</span></br>
+											<span class="tipdesc">鏃舵:</span><span>${params.data.startTime.split(" ")[1]} 锝� ${params.data.endTime.split(" ")[1]}</span></br>`
+							}
+							return dom;
+						}
+					},
+					grid: {
+						top: 10,
+						left: 70,
+						bottom: 120
+					},
+					xAxis: {
+						min: 0,
+						max: 1440,  // 鍗曚綅鍒嗛挓
+						interval: 1440/6,  //姣忛殧澶氬皯鍒嗛挓鏄剧ず涓�涓埢搴�
+						axisLabel: {
+							formatter: (value)=> {
+								console.log(value,111)
+								if(value == 0) {
+									return "00:00:00";
+								}else if(value == 240) {
+									return "04:00:00";
+								}else if(value == 480) {
+									return "08:00:00";
+								}else if(value == 720) {
+									return "12:00:00";
+								}else if(value == 960) {
+									return "16:00:00";
+								}else if(value == 1200) {
+									return "18:00:00";
+								}else if(value == 1440) {
+									return "00:00:00";
+								}
+							}
+						}
+					},
+					yAxis: {
+						type: 'category',
+						axisLabel: {
+							formatter: function (value) {
+								return value;
+							},
+							rich: {
+								a: {
+									color: '#409eff',
+									cursor: 'pointer',
+									fontSize: '12px'
+								}
+							}
+						},
+						data: yAxisData
+					},
+					series: [
+						{
+						type: 'custom',
+						renderItem: this.renderItem,
+						itemStyle: {
+							opacity: 0.8
+						},
+						encode: {
+							x: [1, 2],
+							y: 0
+						},
+						data: data
+						}
+					]
+				};
+				var myChart = echarts.init(document.getElementById('wcs-log')); 
+				myChart.setOption(option);
 			},
 			getwscLvalue() {
 				var obj = {
@@ -477,6 +638,7 @@
 				this.$HTTP.get(`/api/blade-cps/workstation/get-dmp-variables?machineId=${machineId}&workstationId=${lastLevelId}`).then(res=> {
 					if(res.code == 200) {
 						this.dmpList = res.data;
+						console.log(this.dmpList,111)
 					}
 				})
 			},
@@ -580,6 +742,7 @@
 						})
 						this.achievements = achievements;
 						this.collectionstatus = collectionstatus;
+						this.allwcs = res.data;
 					}
 				})
 			},
@@ -823,4 +986,9 @@
 .status-wrap /deep/ .el-checkbox.el-checkbox--large {
     color: #409eff;
 }
+#record /deep/ .tipstatus {
+	width: 100%;
+	display: inline-block;
+	border-bottom: 1px solid #eee;
+}
 </style>
\ No newline at end of file

--
Gitblit v1.9.3