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>
|