134 lines
3.1 KiB
Vue
134 lines
3.1 KiB
Vue
<template>
|
||
<div>
|
||
<DataTable :columns="columns" :data="rows" />
|
||
</div>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { ref, onMounted, onUnmounted } from 'vue';
|
||
import DataTable from '../components/DataTable.vue';
|
||
|
||
// 入库字段
|
||
const columns = [
|
||
{ key: 'vehicleId', title: '托盘号' },
|
||
{ key: 'matNo', title: '物料号' },
|
||
{ key: 'inspectStatus', title: '是否质检' },
|
||
{ key: 'inspectCode', title: '质检结果' },
|
||
];
|
||
|
||
const rows = ref([]);
|
||
let timer = null;
|
||
|
||
// 获取托盘号
|
||
async function getContainerNos() {
|
||
try {
|
||
// 获取114位置的托盘号
|
||
const response114 = await fetch('http://172.18.222.253:9980/api/upper/pub/getStandCode?standId=114');
|
||
const data114 = await response114.json();
|
||
const containerNo114 = data114.returnData || '';
|
||
|
||
// 获取116位置的托盘号
|
||
const response116 = await fetch('http://172.18.222.253:9980/api/upper/pub/getStandCode?standId=116');
|
||
const data116 = await response116.json();
|
||
const containerNo116 = data116.returnData || '';
|
||
|
||
return [containerNo114, containerNo116].filter(no => no !== '');
|
||
} catch (error) {
|
||
console.error('获取托盘号失败:', error);
|
||
return [];
|
||
}
|
||
}
|
||
|
||
// 获取质检数据（模拟实现，根据实际需求调整）
|
||
async function getQualityData(containerNos) {
|
||
const qualityData = [];
|
||
|
||
for (const containerNo of containerNos) {
|
||
try {
|
||
// 模拟数据结构，实际应根据接口文档调整
|
||
qualityData.push({
|
||
vehicleId: containerNo,
|
||
matNo: 'MAT-' + Math.floor(Math.random() * 10000),
|
||
inspectStatus: Math.random() > 0.5 ? '是' : '否',
|
||
inspectCode: Math.random() > 0.5 ? '合格' : '不合格'
|
||
});
|
||
} catch (error) {
|
||
console.error(`处理托盘${containerNo}数据失败:`, error);
|
||
}
|
||
}
|
||
|
||
return qualityData;
|
||
}
|
||
|
||
async function load() {
|
||
try {
|
||
// 获取托盘号
|
||
const containerNos = await getContainerNos();
|
||
|
||
if (containerNos.length > 0) {
|
||
// 获取质检数据
|
||
const qualityData = await getQualityData(containerNos);
|
||
rows.value = qualityData;
|
||
} else {
|
||
rows.value = [];
|
||
}
|
||
} catch (error) {
|
||
console.error('加载质检数据失败:', error);
|
||
rows.value = [];
|
||
}
|
||
}
|
||
|
||
onMounted(() => {
|
||
load();
|
||
timer = setInterval(load, 5000);
|
||
});
|
||
|
||
onUnmounted(() => {
|
||
if (timer) {
|
||
clearInterval(timer);
|
||
}
|
||
});
|
||
</script>
|
||
|
||
<style scoped>
|
||
.title-center {
|
||
text-align: center;
|
||
}
|
||
|
||
/* 增大表格整体字体 */
|
||
:deep(.table-wrapper) {
|
||
font-size: 40px;
|
||
}
|
||
|
||
:deep(thead th) {
|
||
font-size: 40px; /* 表头字体稍大 */
|
||
}
|
||
|
||
:deep(tbody td) {
|
||
font-size: 40px; /* 表格内容字体 */
|
||
padding: 16px 12px; /* 同时增加内边距使布局更舒适 */
|
||
}
|
||
/* 设置第一列（料箱号）宽度为30% */
|
||
:deep(th:nth-child(1)),
|
||
:deep(td:nth-child(1)) {
|
||
width: 40%;
|
||
}
|
||
|
||
/* 设置第二列（起点）宽度为10% */
|
||
:deep(th:nth-child(2)),
|
||
:deep(td:nth-child(2)) {
|
||
width: 20%;
|
||
}
|
||
/* 设置第三列（终点）宽度 */
|
||
:deep(th:nth-child(3)),
|
||
:deep(td:nth-child(3)) {
|
||
width: 15%;
|
||
}
|
||
|
||
/* 设置第四列（优先级）宽度 */
|
||
:deep(th:nth-child(4)),
|
||
:deep(td:nth-child(4)) {
|
||
width: 25%;
|
||
}
|
||
</style>
|