update

src/views/equipment/timing-diagram/status/index.vue

@@ -147,7 +147,7 @@ var categories = [];
 var types = [
 	{ name: '运行', color: '#5ad8a6' },
 	{ name: '故障', color: '#fc9c91' },
-	{ name: '停机', color: '#000' },
+	{ name: '计划停机', color: '#000' },
 ];
 function getStartTime(timestamp) {
 	return new Date(new Date(timestamp).toLocaleDateString()).getTime();
@@ -157,7 +157,7 @@ function renderItem(params, api) {
 	var start = api.coord([api.value(1), categoryIndex]);
 	var end = api.coord([api.value(2), categoryIndex]);
 	// var height = api.size([0, 1])[1] * 0.8;
-	var height = 56
+	var height = 56;
 	var rectShape = echarts.graphic.clipRectByRect(
 		{
 			x: start[0],
@@ -252,7 +252,7 @@ export default {
 				lineId: null,
 				sectionId: null,
 				equipmentId: null,
-				recordTime: [],
+				recordTime: null,
 			},
 			graphList: [],
 			open: false,
@@ -299,8 +299,8 @@ export default {
 				},
 				xAxis: {
 					type: 'time',
-					min: getStartTime(1691568181000),
-					max: getStartTime(1691568181000 + 3600 * 24 * 1000),
+					min: getStartTime(1691568181000), // <===
+					max: getStartTime(1691568181000 + 3600 * 24 * 1000), // <===
 					splitNumber: 10,
 					axisLabel: {
 						// rotate: -15,
@@ -326,7 +326,6 @@ export default {
 						},
 						axisLabel: {
 							fontSize: 18,
-							
 						},
 						axisTick: {
 							show: false,
@@ -334,7 +333,7 @@ export default {
 						splitLine: {
 							show: true,
 						},
-						data: categories,
+						data: [], // <====
 					},
 					{
 						axisLine: {
@@ -357,7 +356,7 @@ export default {
 							x: [1, 2],
 							y: 0,
 						},
-						data: data,
+						data: [], // <===
 					},
 				],
 			},
@@ -395,6 +394,43 @@ export default {
 
 		handleGraphList() {
 			console.log('in handleGraphList:', this.graphList);
+			const min = this.queryParams.recordTime
+				? new Date(this.queryParams.recordTime).getTime()
+				: this.findMin();
+
+			console.log('min is', min);
+			this.chartOption.xAxis.min = getStartTime(min);
+			this.chartOption.xAxis.max = getStartTime(min + 3600 * 24 * 1000);
+			this.graphList.forEach((arr) => {
+				this.chartOption.yAxis[0].data.push(arr.key);
+				arr.forEach((item) => {
+					this.chartOption.series[0].data.push({
+						name: ['运行', '故障', '计划停机'][item.status],
+						value: [
+							0,
+							item.startTime,
+							item.startTime + item.duration * 60 * 1000,
+							item.duration * 60 * 1000,
+						],
+						itemStyle: {
+							normal: {
+								color: types[item.status].color,
+							},
+						},
+					});
+				});
+				console.log("chartOptions", this.chartOption)
+			});
+		},
+
+		findMin() {
+			let min = 0;
+			this.graphList.forEach((arr) => {
+				arr.forEach((item) => {
+					if (min < item.startTime) min = item.startTime;
+				});
+			});
+			return min;
 		},
 
 		initChart() {
@@ -407,7 +443,7 @@ export default {
 			this.queryParams.lineId = null;
 			this.queryParams.equipmentId = null;
 			this.queryParams.sectionId = null;
-			this.queryParams.recordTime = [];
+			this.queryParams.recordTime = null;
 		},
 
 		/** 对象到数组的转换 */