smart-web.git - Gitblit

			@@ -2,7 +2,7 @@
			* @Author: lzhe lzhe@example.com
			* @Date: 2024-03-26 10:28:33
			* @LastEditors: lzhe lzhe@example.com
			* @LastEditTime: 2024-04-23 17:08:42
			* @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="perdata" 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: [] // 班次状态记录table
			records: [],
			recordData: [], // 班次状态记录table
			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() { //班次状态记录chart
			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>