<script setup>
|
import ComputeCard from "@/views/pp/glassOptimize/page/ComputeCard.vue";
|
import ComputeDetail from "@/views/pp/glassOptimize/page/ComputeDetail.vue";
|
import Compute from "@/views/pp/glassOptimize/page/Compute.vue";
|
import {onMounted, ref} from 'vue';
|
import {ElMessage, ElLoading} from "element-plus";
|
import request from "@/utils/request";
|
|
const props = defineProps({
|
projectNo : String
|
});
|
|
const computed = ref(null);
|
const computedCard = ref(null);
|
const computedData = ref({
|
// 要传递给子组件的数据
|
});
|
|
// 监听子组件ComputeCard的数据
|
|
|
|
|
|
const handleCardData = (data) => {
|
|
computedCard.value = data;
|
// 将 computed.value 合并到 computedCard.value 的最外层
|
computedCard.value = {
|
...computed.value,
|
...computedCard.value
|
};
|
};
|
|
// 监听子组件ComputeDetail的数据
|
const handleData = (data) => {
|
computed.value = data;
|
};
|
|
onMounted(() => {
|
if (props.projectNo) {
|
handleFetchData(props.projectNo);
|
handleTableData(data);
|
handleDataReceive(data);
|
}
|
});
|
|
// 在父组件中定义处理接收数据的函数
|
const handleDataReceive= async (data) => {
|
console.log('接收到子组件的数据2:', data);
|
// 处理数据，例如更新父组件的状态或调用后端API
|
|
}
|
|
|
// 用于存储从后端获取到的数据，初始化为空数组
|
const receivedData = ref([]);
|
|
|
console.log(receivedData)
|
const handleFetchData = async (projectNumber) => {
|
try {
|
const res = await request.post(`/glassOptimize/selectProjectCompute/${projectNumber}`);
|
if (Number(res.code) === 200 && res.data && res.data.data) {
|
receivedData.value = res.data.data;
|
} else {
|
console.error('请求出现问题，状态码：', res.code, '，错误信息：', res.msg);
|
if (res.code === 404) {
|
ElMessage.error('未找到对应工程号的数据，请检查输入是否正确');
|
} else if (res.code === 500) {
|
ElMessage.error('服务器内部出现错误，请稍后再试');
|
} else {
|
ElMessage.warning(res.msg);
|
}
|
}
|
} catch (error) {
|
console.error('请求出错', error);
|
ElMessage.error('请输入工程号！');
|
}
|
};
|
|
const handleTableData= async (data) => {
|
// 处理接收到的表格数据
|
console.log('父组件接收到的数据1:', data);
|
}
|
|
const handleSimulation = async () => {
|
const loading = ElLoading.service({
|
lock: true,
|
text: '正在计算中，请稍候...',
|
background: 'rgba(0, 0, 0, 0.7)'
|
});
|
console.log('发送到后端的数据',computedCard.value)
|
const mockData = {
|
code: 200,
|
data: [
|
{
|
"glass_details": [
|
{
|
"angle": 0.0,
|
"glass_type": 3,
|
"height": 862,
|
"layers_number": 2,
|
"order_number": 33,
|
"process_id": "NG24120028A005",
|
"technology_number": 2,
|
"tempering_feed_sequence": 14,
|
"tempering_layout_id": 15,
|
"width": 814,
|
"x_coordinate": 1582.0,
|
"y_coordinate": 3768.0
|
},
|
{
|
"angle": 0.1,
|
"glass_type": 4,
|
"height": 862,
|
"layers_number": 2,
|
"order_number": 33,
|
"process_id": "NG24120028A005",
|
"technology_number": 2,
|
"tempering_feed_sequence": 14,
|
"tempering_layout_id": 15,
|
"width": 814,
|
"x_coordinate": 1582.0,
|
"y_coordinate": 3768.0
|
}
|
],
|
"guidance": 15,
|
"rackinfos": [
|
"NG24120026A003-2",
|
"NG24120027A003-2",
|
"NG24120028A005-2"
|
],
|
"ratioResult": [
|
{
|
"area": 10.53,
|
"glass_total": 15,
|
"ratio": 0.74,
|
"tempering_layout_id": "13"
|
},
|
{
|
"area": 10.53,
|
"glass_total": 15,
|
"ratio": 0.74,
|
"tempering_layout_id": "14"
|
},
|
{
|
"area": 9.82,
|
"glass_total": 14,
|
"ratio": 0.69,
|
"tempering_layout_id": "15"
|
}
|
],
|
"resultSum": [15.0, 0.74]
|
}
|
]
|
};
|
if (mockData.code === 200) {
|
loading.close();
|
ElMessage.success('模拟计算成功!');
|
}
|
// 更新computedData
|
computedData.value = mockData;
|
// try {
|
// if (!computed.value ) {
|
// ElMessage.warning('请先加载数据再进行模拟计算');
|
// return;
|
// }
|
|
// // 显示加载提示
|
// const loading = ElLoading.service({
|
// lock: true,
|
// text: '正在计算中，请稍候...',
|
// background: 'rgba(0, 0, 0, 0.7)'
|
// });
|
|
// try {
|
// // 将数据提交到后端
|
// const response = await request.post('/glassOptimize/simulationCalculate', {
|
|
// data: computedCard.value
|
|
// });
|
|
// if (response.code === 200) {
|
// ElMessage.success('模拟计算成功!');
|
// } else {
|
// ElMessage.error(response.msg || '模拟计算失败');
|
// }
|
// } catch (error) {
|
// console.error('请求失败:', error);
|
// ElMessage.error('网络异常，请稍后再试');
|
// } finally {
|
// // 关闭加载提示
|
// loading.close();
|
// }
|
// } catch (error) {
|
// console.error('请求失败:', error);
|
// ElMessage.error('网络异常，请稍后再试');
|
// }
|
};
|
|
|
|
//接受子组件ComputeCard的流程卡号
|
let projectRow = ref({
|
processId:null,
|
})
|
const handleUpdateProcessId = newProcessId => {
|
projectRow.value.processId = newProcessId;
|
console.log('接收到子组件获取的流程卡号为',projectRow.value.processId)
|
};
|
|
</script>
|
|
<template>
|
<div style="width: 100%; height: 100%;">
|
|
<div id="compute">
|
<compute :data="computedData" @fetch-data="handleFetchData" :project-no="props.projectNo" @sendData="handleData" @simulate-click="handleSimulation" />
|
</div>
|
|
<div id="computeCard">
|
<compute-card :table-data="receivedData"
|
:process-id="projectRow.processId===null?null:projectRow.processId"
|
@upProcessId="handleUpdateProcessId" @sendData="handleCardData"
|
/>
|
</div>
|
|
<div id="computeDetail">
|
<compute-detail :process-id="projectRow.processId===null?null:projectRow.processId" />
|
</div>
|
|
</div>
|
</template>
|
|
<style scoped>
|
#compute{
|
float: left;
|
margin-top: -30px;
|
margin-bottom: 2%;
|
width: 100%;
|
height: 40%;
|
}
|
#computeCard{
|
margin-top: 90px;
|
width: 64%;
|
height: 40%;
|
float: left;
|
}
|
#computeDetail{
|
margin-top: 90px;
|
margin-left: 1%;
|
float: left;
|
width: 35%;
|
height: 40%;
|
}
|
</style>
|
