Board / HH-board-2026 · Files

<template>
	<div class="app-body">
		<Header title="智能综合立库管理平台" :sysInitTimeNum="sysTimeNum"></Header>
		<div class="dv-content-body">
			<!-- 顶部头表 -->
			<!-- <div class="dv-content-body-head-list">
				<headLeft ref="headLeft"></headLeft>
				<headCenter ref="headCenter"></headCenter>
				<headRight ref="headRight"></headRight>
			</div> -->
			<!-- 中间图表 -->
			<div class="dv-content-body-center-list">
				<!-- <bodyCenterLeft ref="bodyCenterLeft"></bodyCenterLeft> -->
				<!-- <bodyCenter ref="bodyCenter"></bodyCenter> -->
				<bodyCenter2 ref="bodyCenter2"></bodyCenter2>
				<bodyCenterRight ref="bodyCenterRight"></bodyCenterRight>
			</div>
			<!-- 底部图表 -->
			<div class="dv-content-body-bottom-list">
				<footerLeft ref="footerLeft"></footerLeft>
				<!-- <footerCenter ref="footerCenter"></footerCenter> -->
				<footerRight ref="footerRight"></footerRight>
			</div>
		</div>
	</div>
</template>

<script>
import Header from '@/layout/appHead'

// import headLeft from '@/components/headLeft'
// import headCenter from '@/components/headCenter'
// import headRight from '@/components/headRight'

// import bodyCenterLeft from '@/components/bodyCenterLeft'
// import bodyCenter from '@/components/bodyCenter'
import bodyCenterRight from '@/components/bodyCenterRight'
import bodyCenter2 from '@/components/bodyCenter2'

import footerLeft from '@/components/footerLeft'
// import footerCenter from '@/components/footerCenter'
import footerRight from '@/components/footerRight'

export default {
	data() {
		return {
			// baseUrlOff: 'https://m1.apifoxmock.com/m2/3849108-3482652-default/350116835',
			baseUrlOff: 'https://m1.apifoxmock.com/m2/3849108-3482652-default/454838033?apifoxApiId=454838033',
			baseUrlOnLine: window.appConfig.baseUrlOnLine2,

			sysData: {},
			sysInitTimeNum: 20,
			sysTimeNum: 20,
		}
	},
	components: {
		Header,

		// headLeft,
		// headCenter,
		// headRight,

		// bodyCenterLeft,
		bodyCenterRight,
		// bodyCenter,
		bodyCenter2,

		footerLeft,
		// footerCenter,
		footerRight,
	},

	methods: {
		getECSData() {
			let opt = {
				urlSuffix: window.baseOnLineOrOff ? this.baseUrlOnLine : this.baseUrlOff,
				logTitle: 'ECS',
				isUrlALL: true,
				headers: false,
			}
			let callBackFn = (res) => {
				console.log('返回数据：', res)
				if (!this.ajaxSuccessDataBefore(res, opt.logTitle)) return
				console.log('sysData1', this.sysData)
				// this.$refs.bodyCenter.bingDataSource(this.sysData.equipmentInfos)
				if (this.sysData.equipmentInfos) {
					this.sysData.equipmentInfos.sort((a, b) => {
						const numA = parseInt(a.equipmentCode.replace('SRM', ''), 10);
						const numB = parseInt(b.equipmentCode.replace('SRM', ''), 10);
						return numA - numB; // 升序：SRM01, SRM02, SRM03...
					});
				}
				this.$refs.bodyCenter2.getData(this.sysData.equipmentInfos)
				// 仓库运行(前24小时)
				this.$refs.bodyCenterRight.bingDataSource(this.sysData.srmStatusPieChart)

				// === 排序 srmTaskBarChart 各数组 ===
				if (this.sysData.srmTaskBarChart) {
					const chart = this.sysData.srmTaskBarChart;
					const { xSeries, in: inArr, out: outArr, shift: shiftArr, pick: pickArr } = chart;

					const records = xSeries.map((code, i) => ({
						code,
						in: inArr[i],
						out: outArr[i],
						shift: shiftArr[i],
						pick: pickArr[i]
					}));

					records.sort((a, b) => {
						const numA = parseInt(a.code.replace('SRM', ''), 10);
						const numB = parseInt(b.code.replace('SRM', ''), 10);
						return numA - numB;
					});

					chart.xSeries = records.map(r => r.code);
					chart.in = records.map(r => r.in);
					chart.out = records.map(r => r.out);
					chart.shift = records.map(r => r.shift);
					chart.pick = records.map(r => r.pick);
				}
				// 堆机任务
				this.$refs.footerLeft.bingDataSource(this.sysData.srmTaskBarChart, 'B')

				// 报警信息(前24小时)
				this.$refs.footerRight.bingDataSource(this.sysData.equipmentAlarms)
			}
			''.ajax(this, opt, callBackFn)
		},
		ajaxSuccessDataBefore(res, title) {
			if (res.data == null) {
				''.Log(title + '无数据', 'getData')
				return false
			}
			return true
		},

		getAllWMSData() {
			let dataTable = {
				header: ['巷道', '可存盘', '实际入盘', '使用率'],
				align: ['left'],
			}
			let flag = ''
			this.$refs.headLeft.getData(flag, 'B')
			this.$refs.headCenter.getData(flag)
			this.$refs.headRight.getData('')

			this.$refs.bodyCenterLeft.getData(flag, dataTable)
			this.$refs.footerCenter.getData(flag)
		},

		intInterval: function () {
			''.intInterval(this, this.sysInitTimeNum, () => {
				this.getECSData()
			})
			//WMS
			// setInterval(() => {
			// 	this.getAllWMSData()
			// }, 10000)
		},
	},
	mounted() {
		//eslint-disable-next-line no-debugger
		debugger
		this.getECSData()

		// this.getAllWMSData()

		// 【发布的时候要取消注释
		this.intInterval()
	},
}
</script>

<style lang="scss" scoped>
.app-body {
	height: 100%;
	width: 100%;

	.dv-content-body {
		height: 90%;
		width: 100%;
		// background: rebeccapurple;
	}

	.dv-content-body-head-list {
		display: flex;
		justify-content: space-between;
		align-items: center;
		height: 25%;
	}

	.dv-content-body-center-list {
		display: flex;
		justify-content: space-between;
		align-items: center;
		height: 49%;
	}

	.dv-content-body-bottom-list {
		display: flex;
		height: 49%;
		justify-content: space-between;
		align-items: center;
	}
}
</style>