update 设备实时
This commit is contained in:
		@@ -8,7 +8,6 @@
 | 
			
		||||
<template>
 | 
			
		||||
	<div>
 | 
			
		||||
		<div class="app-container">
 | 
			
		||||
			<!-- <small-title :size="'md'">{{ $t('module.factory.realtime.equipment.name') }}</small-title> -->
 | 
			
		||||
			<small-title :size="'md'">设备生产实时数据</small-title>
 | 
			
		||||
			<base-table v-if="loadTable" :table-head-configs="tableProps" :data="tableData.length ? tableData : []" :span-method="spanMethod" />
 | 
			
		||||
		</div>
 | 
			
		||||
@@ -19,9 +18,6 @@
 | 
			
		||||
import BaseTable from '@/components/base-table'
 | 
			
		||||
import SmallTitle from '@/components/small-title'
 | 
			
		||||
import moment from 'moment'
 | 
			
		||||
// import fetchList from '@/api/factory-manage/realtimeData'
 | 
			
		||||
 | 
			
		||||
const fetchList = () => {}
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
	name: 'RealtimeDataOfEquipment',
 | 
			
		||||
@@ -42,25 +38,23 @@ export default {
 | 
			
		||||
	},
 | 
			
		||||
	created() {
 | 
			
		||||
		this.clearData()
 | 
			
		||||
		this.fetchList('equipment').then(({data: res}) => {
 | 
			
		||||
		this.fetchList('equipment').then(({ data: res }) => {
 | 
			
		||||
			this.testData = res.data.filter(item => !!item.equDet)
 | 
			
		||||
			this.handleData()
 | 
			
		||||
		})
 | 
			
		||||
		// this.loadTable = true
 | 
			
		||||
		// this.intervalId = setInterval(() => {
 | 
			
		||||
		// 	this.$message({
 | 
			
		||||
		// 		// message: this.$t('module.factory.realtime.equipment.refresh'),
 | 
			
		||||
		// 		type: 'warning',
 | 
			
		||||
		// 		duration: 1500,
 | 
			
		||||
		// 		onClose: () => {
 | 
			
		||||
		// 			this.clearData()
 | 
			
		||||
		// 			fetchList('equipment').then(res => {
 | 
			
		||||
		// 				this.testData = res
 | 
			
		||||
		// 				this.handleData()
 | 
			
		||||
		// 			})
 | 
			
		||||
		// 		}
 | 
			
		||||
		// 	})
 | 
			
		||||
		// }, 1000 * 60 * 5)
 | 
			
		||||
		this.intervalId = setInterval(() => {
 | 
			
		||||
			this.$message({
 | 
			
		||||
				type: 'warning',
 | 
			
		||||
				duration: 1500,
 | 
			
		||||
				onClose: () => {
 | 
			
		||||
					this.clearData()
 | 
			
		||||
					fetchList('equipment').then(({ data: res }) => {
 | 
			
		||||
						this.testData = res.data.filter(item => !!item.equDet)
 | 
			
		||||
						this.handleData()
 | 
			
		||||
					})
 | 
			
		||||
				}
 | 
			
		||||
			})
 | 
			
		||||
		}, 1000 * 60 * 5)
 | 
			
		||||
	},
 | 
			
		||||
	beforeDestroy() {
 | 
			
		||||
		if (this.intervalId) clearInterval(this.intervalId)
 | 
			
		||||
@@ -81,7 +75,6 @@ export default {
 | 
			
		||||
		handleData() {
 | 
			
		||||
			this.expandDataStepOne()
 | 
			
		||||
			this.expandDataStepTwo()
 | 
			
		||||
			// console.log('span data: ', this.equipmentCount)
 | 
			
		||||
			this.loadTable = true
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
@@ -93,68 +86,52 @@ export default {
 | 
			
		||||
			})
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		testSpan({ row, column, rowIndex, columnIndex }) {
 | 
			
		||||
			if (columnIndex === 1 && rowIndex % 2 === 0) {
 | 
			
		||||
				return [2, 1]
 | 
			
		||||
			}
 | 
			
		||||
			if (columnIndex === 1 && rowIndex % 2 !== 0) {
 | 
			
		||||
				return [0, 0]
 | 
			
		||||
			}
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		expandDataStepOne() {
 | 
			
		||||
			console.log('testdata: ', this.testData)
 | 
			
		||||
			// this.stepOneArray = this.testData.data
 | 
			
		||||
			// 	.filter(item => item.equDet)
 | 
			
		||||
			// 	.map(item => {
 | 
			
		||||
			// 		if (item.equDet) {
 | 
			
		||||
			// 			item.equDet.forEach((equipment, index) => {
 | 
			
		||||
			// 				equipment.lineName = item.lineName
 | 
			
		||||
			// 			})
 | 
			
		||||
			// 		}
 | 
			
		||||
			// 		return item.equDet
 | 
			
		||||
			// 	})
 | 
			
		||||
			this.stepOneArray = this.testData.map(item => {
 | 
			
		||||
				if (item.equDet) {
 | 
			
		||||
					item.equDet.forEach((equipment, index) => {
 | 
			
		||||
						equipment.lineName = item.lineName
 | 
			
		||||
					})
 | 
			
		||||
				}
 | 
			
		||||
				return item.equDet
 | 
			
		||||
			})
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		expandDataStepTwo() {
 | 
			
		||||
			// 扩展服务器返回的数据第二阶段
 | 
			
		||||
			console.log('before step two: ', this.stepOneArray)
 | 
			
		||||
			this.rowNum = 0
 | 
			
		||||
 | 
			
		||||
			this.stepOneArray.forEach(arrayItem => {
 | 
			
		||||
				let count = 0
 | 
			
		||||
			this.stepOneArray.forEach(line => {
 | 
			
		||||
				let avaliableEquipmentCount = 0
 | 
			
		||||
 | 
			
		||||
				arrayItem.forEach(item => {
 | 
			
		||||
					// console.log('========= ', item.equName, ' ==========')
 | 
			
		||||
				line.forEach(equipment => {
 | 
			
		||||
					const newItem = {
 | 
			
		||||
						equId: item.equId,
 | 
			
		||||
						lineName: item.lineName,
 | 
			
		||||
						equName: item.equName,
 | 
			
		||||
						productSize: item.productSize,
 | 
			
		||||
						orderName: item.orderName,
 | 
			
		||||
						externalCode: item.externalCode,
 | 
			
		||||
						totalProduction: item.totalProduction ?? '-'
 | 
			
		||||
						equId: equipment.equId,
 | 
			
		||||
						lineName: equipment.lineName,
 | 
			
		||||
						equName: equipment.equName,
 | 
			
		||||
						externalCode: equipment.externalCode,
 | 
			
		||||
						totalProduction: equipment.totalProduction ?? '-'
 | 
			
		||||
					}
 | 
			
		||||
					if (item.det) {
 | 
			
		||||
						count += 1
 | 
			
		||||
						item.det.forEach(obj => {
 | 
			
		||||
							// Step2: 设置动态props
 | 
			
		||||
 | 
			
		||||
					if (equipment.det) {
 | 
			
		||||
						avaliableEquipmentCount += 1
 | 
			
		||||
						equipment.det.forEach(obj => {
 | 
			
		||||
							if (!this.dynamicPropSet) {
 | 
			
		||||
								this.tableProps.push({
 | 
			
		||||
									label: moment(obj.recordTime).format('YYYY-MM-DD HH:mm:ss'),
 | 
			
		||||
									children: [
 | 
			
		||||
										// { prop: obj.recordTime + '-inputNum', label: i18n.t('module.factory.realtime.equipment.input') },
 | 
			
		||||
										// { prop: obj.recordTime + '-outputNum', label: i18n.t('module.factory.realtime.equipment.output') },
 | 
			
		||||
										// { prop: obj.recordTime + '-scrapNum', label: i18n.t('module.factory.realtime.equipment.scrapNum') },
 | 
			
		||||
										// {
 | 
			
		||||
										//   prop: obj.recordTime + '-scrapRate',
 | 
			
		||||
										//   label: i18n.t('module.factory.realtime.equipment.scrapRate')
 | 
			
		||||
										// }
 | 
			
		||||
									]
 | 
			
		||||
								})
 | 
			
		||||
								if (obj.recordTime) {
 | 
			
		||||
									// 如果 obj.recordTime 是有效的
 | 
			
		||||
									this.tableProps.push({
 | 
			
		||||
										label: moment(obj.recordTime).format('YYYY-MM-DD HH:mm:ss'),
 | 
			
		||||
										children: [
 | 
			
		||||
											{ prop: obj.recordTime + '-inputNum', label: '进数据' },
 | 
			
		||||
											{ prop: obj.recordTime + '-outputNum', label: '出数据' },
 | 
			
		||||
											{ prop: obj.recordTime + '-scrapNum', label: '报废数据' },
 | 
			
		||||
											{ prop: obj.recordTime + '-scrapRate', label: '报废比例' }
 | 
			
		||||
										]
 | 
			
		||||
									})
 | 
			
		||||
								}
 | 
			
		||||
							}
 | 
			
		||||
 | 
			
		||||
							// console.log('==> ',obj.recordTime, obj.inputNum, obj.outputNum, obj.scrapNum, obj.scrapRate)
 | 
			
		||||
							Object.defineProperty(newItem, obj.recordTime + '-inputNum', {
 | 
			
		||||
								value: obj.inputNum ?? '-',
 | 
			
		||||
								enumerable: true,
 | 
			
		||||
@@ -186,28 +163,24 @@ export default {
 | 
			
		||||
						this.tableData.push(newItem)
 | 
			
		||||
					}
 | 
			
		||||
				})
 | 
			
		||||
 | 
			
		||||
				this.$set(this.equipmentCount, [this.rowNum], count)
 | 
			
		||||
				this.rowNum += count
 | 
			
		||||
				this.$set(this.equipmentCount, [this.rowNum], avaliableEquipmentCount)
 | 
			
		||||
				this.rowNum += avaliableEquipmentCount
 | 
			
		||||
			})
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		setStaticTableProps() {
 | 
			
		||||
			// Step1: 设置静态的 table props
 | 
			
		||||
			const staticTableProps = [
 | 
			
		||||
				// { prop: 'lineName', label: i18n.t('module.factory.realtime.equipment.pl'), fixed: true },
 | 
			
		||||
				// { prop: 'orderName', label: i18n.t('module.factory.realtime.equipment.currOrder'), fixed: true },
 | 
			
		||||
				// { prop: 'productSize', label: i18n.t('module.factory.realtime.equipment.pSpecs'), fixed: true },
 | 
			
		||||
				// { prop: 'equName', label: i18n.t('module.factory.realtime.equipment.eqName'), fixed: true },
 | 
			
		||||
				// { prop: 'totalProduction', label: i18n.t('module.factory.realtime.equipment.produceTotal'), fixed: true }
 | 
			
		||||
				{ prop: 'lineName', label: '产线', fixed: true },
 | 
			
		||||
				{ prop: 'equName', label: '设备', fixed: true },
 | 
			
		||||
				{ prop: 'totalProduction', label: '总产量', fixed: true }
 | 
			
		||||
			]
 | 
			
		||||
			this.tableProps = staticTableProps
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		spanMethod({ row, column, rowIndex, columnIndex }) {
 | 
			
		||||
			// 设置合并行列的方式
 | 
			
		||||
			if (columnIndex === 0 || columnIndex === 1 || columnIndex === 2) {
 | 
			
		||||
				// 前3列需要合并多行
 | 
			
		||||
 | 
			
		||||
			if (columnIndex === 0) {
 | 
			
		||||
				if (this.equipmentCount[rowIndex]) {
 | 
			
		||||
					// 如果找到需要合并的行号
 | 
			
		||||
					return {
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user