update:新的需求显示更新

This commit is contained in:
2026-03-05 15:43:10 +08:00
parent b6d8124171
commit 80e07a1c69
6 changed files with 281 additions and 65 deletions

View File

@@ -72,14 +72,14 @@ const modelAttribute = ref<any>([
name: '所属阶段',
value: 'ownPhaseName',
},
{
name: '所属机台',
value: 'ownMachineName',
},
{
name: '所属工位',
value: 'ownWorkspaceName',
},
// {
// name: '所属机台',
// value: 'ownMachineName',
// },
// {
// name: '所属工位',
// value: 'ownWorkspaceName',
// },
{
name: '所属工况',
value: 'owntaskName',

View File

@@ -30,17 +30,24 @@
<div class="task-img-item">
<div class="img-box" @click="reviewFileFun(item_2.id)">
<img class="img-item" :src="getImgPathFun(item_2.id)" alt="" />
<div>{{ item_2.originalName }}</div>
<!-- <div>{{ item_2.originalName }}</div> -->
</div>
<div class="img-attribute">{{ getFIleSuffix(item_2.originalName) }}</div>
<div class="img-attribute">{{ item_2.formatFileSize }}</div>
<div class="img-attribute">{{ item_2.createTime }}</div>
<div class="img-attribute">{{ item_2.ownProjectName }}</div>
<div class="img-attribute">{{ item_2.ownPhaseName }}</div>
<div class="img-attribute">{{ item_2.runName }}</div>
<!-- <div class="img-attribute">{{ getFIleSuffix(item_2.originalName) }}</div> -->
<div class="img-attribute">{{ item_2.showName }}</div>
<div class="img-attribute">
<el-button type="primary" link @click="reviewFun(item_2)">预览</el-button>
<el-button type="primary" link @click="downLoadFun(item_2)">下载</el-button>
<el-popover placement="right" :width="400" trigger="click">
<template #reference>
<el-button type="primary" link>详情</el-button>
</template>
<!-- <div class="img-attribute">{{ item_2.createTime }}</div> -->
<div class="img-attribute">所属项目 {{ item_2.ownProjectName }}</div>
<div class="img-attribute">所属阶段{{ item_2.ownPhaseName }}</div>
<div class="img-attribute">所属算例{{ item_2.runName }}</div>
<div class="img-attribute">文件大小{{ item_2.formatFileSize }}</div>
</el-popover>
</div>
</div>
</el-card>
@@ -51,7 +58,6 @@
<script setup lang="ts">
import { ref, nextTick, watch } from 'vue';
import BaseTable from '@/components/common/table/baseTable.vue';
import { objectTypeArrayRemovesDuplicates } from '@/utils/common';
import FilePreview from '@/components/common/filePreview/index.vue';
import { downloadFileByStream } from '@/utils/file';
@@ -78,13 +84,6 @@ const env = import.meta.env;
const previewVisible = ref(false);
const fileId = ref<any>('');
const cloudTableRef = ref();
const showTableContent = ref(false);
const tableColumns = ref<any>([]);
const tableData = ref<any>([]);
const imgLists = ref<any>([]);
const getTableColumnFun = (data: any) => {
@@ -101,16 +100,35 @@ const getTableColumnFun = (data: any) => {
return item[key];
});
const checkNames: any = objectTypeArrayRemovesDuplicates(names, 1);
// for (let i = 0; i < checkNames?.length; i++) {
// const obj: any = {
// name: checkNames[i],
// img: [],
// };
for (let i = 0; i < checkNames?.length; i++) {
// for (let j = 0; j < data.length; j++) {
// if (checkNames[i] === data[j][key]) {
// obj.img.push(data[j]);
// }
// }
// imgLists.value.push(obj);
// }
const picNames = data.map((item: any) => {
return item.originalName;
});
const checkPicNames: any = objectTypeArrayRemovesDuplicates(picNames, 1);
for (let i = 0; i < checkPicNames.length; i++) {
const obj: any = {
name: checkNames[i],
name: checkPicNames[i],
img: [],
};
for (let j = 0; j < data.length; j++) {
if (checkNames[i] === data[j][key]) {
if (checkPicNames[i] === data[j].originalName) {
data[j].showName = data[j][key];
obj.img.push(data[j]);
}
}
@@ -118,6 +136,8 @@ const getTableColumnFun = (data: any) => {
imgLists.value.push(obj);
}
console.log(imgLists.value, 'imgLists');
return;
};
@@ -125,12 +145,6 @@ const getImgPathFun = (id: any) => {
return `${env.VITE_API_IMAGE_PREVIEW_URL}/data/previewImage?fileId=${id}`;
};
const getFIleSuffix = (name: any) => {
let suffix: any = '';
suffix = name.split('.').at(-1);
return suffix;
};
const reviewFileFun = (ids: any) => {
fileId.value = ids;
previewVisible.value = true;
@@ -147,6 +161,10 @@ const downLoadFun = (column: any) => {
downloadFileByStream(fileId.value);
};
const detailFun = (column: any) => {
console.log(column, 'column');
};
watch(
() => props.checkTaskInfo,
(newVal) => {

View File

@@ -1,7 +1,7 @@
<template>
<div class="model-file-page">
<BaseTable
v-if="showTableContent"
v-if="false"
:row-config="{
height: 400,
}"
@@ -18,6 +18,43 @@
</div>
</template>
</BaseTable>
<div class="show-csv-box">
<div class="csv-tree">
<div class="tree-title">对比曲线</div>
<div class="tree-file-item" v-for="item in tableData" :key="item.id">
<el-checkbox v-model="item.select" :label="item.originalName" @change="initCsvChartFun" />
<div>
<el-input
size="small"
class="num-input"
v-model="item.num"
@change="initCsvChartFun"
></el-input>
</div>
</div>
</div>
<div class="csv-chart-box">
<div class="csv-operate">
<el-form>
<el-form-item label="列数">
<el-input-number v-model="columnsNum" :min="1" :max="10" @change="handleChangeFun" />
</el-form-item>
</el-form>
</div>
<div class="csv-content">
<div
class="csv-content-item"
:style="{ width: `calc(100% / ${columnsNum})`, height: `calc(800px / ${columnsNum})` }"
v-for="item in csvContents"
:key="item.num"
>
<div class="chart-title">{{ item.num }}</div>
<div class="chart-inner" :id="'csv-chart-' + item.num"></div>
</div>
</div>
</div>
</div>
</div>
</template>
@@ -48,9 +85,19 @@ const showTableContent = ref(false);
const tableColumns = ref<any>([]);
const tableData = ref<any>([]);
const columnsNum = ref(1);
const getTableColumnFun = (data: any) => {
showTableContent.value = false;
tableData.value = data.map((item: any) => {
return {
...item,
select: false,
num: 1,
};
});
console.log(data, 'data');
return;
tableData.value = [];
tableColumns.value = [];
const list: any = data || [];
@@ -191,10 +238,59 @@ const getCsvFormatDataFun = (data: any, ids: any) => {
},
};
const elementId = 'curve-chart-' + ids;
const elementId = 'csv-chart-' + ids;
initEcharts(elementId, elementId, 'lineChart', options);
};
const handleChangeFun = () => {};
const csvContents = ref<any>([]);
const initCsvChartFun = async () => {
csvContents.value = [];
const selectFiles = tableData.value.filter((item: any) => {
return item.select;
});
let lineNum: any =
selectFiles.map((item: any) => {
return item.num;
}) || [];
lineNum = objectTypeArrayRemovesDuplicates(lineNum, 1);
for (let i = 0; i < lineNum.length; i++) {
const obj: any = {
num: lineNum[i],
files: [],
};
for (let j = 0; j < selectFiles.length; j++) {
if (selectFiles[j].num === lineNum[i]) {
obj.files.push(selectFiles[j]);
}
}
csvContents.value.push(obj);
}
for (let i = 0; i < csvContents.value.length; i++) {
let ids: any = csvContents.value[i].files.map((item: any) => {
return item.id;
});
ids = ids.join(',');
const res: any = await getCSVDataApi({ fileId: ids });
if (res && res.code === 200) {
const obj = {
xData: res.data?.xData,
yData: res.data?.yData,
};
getCsvFormatDataFun(obj, csvContents.value[i].num);
}
}
console.log(selectFiles, 'selectFiles');
console.log(csvContents.value, 'selectFiles');
};
watch(
() => props.checkTaskInfo,
(newVal) => {
@@ -223,5 +319,80 @@ watch(
min-height: 300px;
}
}
.show-csv-box {
width: 100%;
height: 100%;
display: flex;
justify-content: space-between;
.csv-tree {
width: 350px;
height: 100%;
overflow: auto;
.tree-title {
width: 100%;
height: 50px;
background-color: #f5f5f5;
line-height: 50px;
padding-left: 10px;
font-weight: 700;
}
.tree-file-item {
width: 100%;
min-height: 40px;
display: flex;
align-items: center;
justify-content: space-between;
padding-left: 10px;
padding-right: 10px;
}
}
.csv-chart-box {
width: calc(100% - 350px);
height: 100%;
overflow: auto;
.csv-operate {
width: 100%;
height: 50px;
display: flex;
align-items: center;
justify-content: flex-end;
}
.csv-content {
width: 100%;
display: flex;
flex-wrap: wrap;
overflow: auto;
.csv-content-item {
width: 100%;
height: 800px;
padding: 10px;
.chart-title {
width: 100%;
height: 30px;
display: flex;
align-items: flex-start;
}
.chart-inner {
width: 100%;
height: calc(100% - 30px);
}
}
}
}
}
.num-input {
width: 40px;
}
}
</style>

View File

@@ -71,14 +71,14 @@ const modelAttribute = ref<any>([
name: '所属阶段',
value: 'ownPhaseName',
},
{
name: '所属机台',
value: 'ownMachineName',
},
{
name: '所属工位',
value: 'ownWorkspaceName',
},
// {
// name: '所属机台',
// value: 'ownMachineName',
// },
// {
// name: '所属工位',
// value: 'ownWorkspaceName',
// },
{
name: '所属工况',
value: 'owntaskName',

View File

@@ -10,6 +10,20 @@
<template #performanceInfo="{ row }">
{{ row.performanceInfo }}
</template>
<template v-for="item in tableColumns" :key="item.key" #[item.key]="{ row }">
<div v-if="item.key === 'performanceInfo'">
{{ row.performanceInfo }}
</div>
<div class="num-box" v-else>
<StatusDot
v-if="row[item.key + '_completeStatus']"
:status="getTaskAchieveStyleClass(row[item.key + '_completeStatus'] || '0')"
:title="''"
/>
{{ row[item.key] || '--' }}
</div>
</template>
</BaseTable>
</div>
</template>
@@ -20,12 +34,10 @@ import BaseTable from '@/components/common/table/baseTable.vue';
import { objectTypeArrayRemovesDuplicates } from '@/utils/common';
import { useDict } from '@/utils/useDict';
// import { getTaskAchieveStyleClass } from '@/components/common/statusDot/statusMap';
// import StatusDot from '@/components/common/statusDot/index.vue';
import StatusDot from '@/components/common/statusDot/index.vue';
import { getTaskAchieveStyleClass } from '@/components/common/statusDot/statusMap';
const { PERFORMANCE_UNIT, RESULT_ACHIEVE_STATUS } = useDict(
'PERFORMANCE_UNIT',
'RESULT_ACHIEVE_STATUS'
);
const { PERFORMANCE_UNIT } = useDict('PERFORMANCE_UNIT');
const props = defineProps({
checkTaskInfo: {
@@ -75,6 +87,8 @@ const getTableColumnsFun = (data: any) => {
const method = item.method || '';
const targetValue = Number(item.targetValue) ?? '';
const unitLabel = PERFORMANCE_UNIT.value?.O?.[item.unit] || item.unit || '';
const completeStatus = getPerformanceSTatus(item) || 0;
const obj: any = {
name: `${nodeName} (${method} ${targetValue} ${unitLabel})`,
value: type ? item.taskId : item.runId,
@@ -82,6 +96,7 @@ const getTableColumnsFun = (data: any) => {
};
obj[type ? item.taskId : item.runId] = item.resultValue;
obj[type ? item.taskId : item.runId + '_completeStatus'] = completeStatus;
return obj;
});
@@ -125,6 +140,7 @@ const getTableColumnsFun = (data: any) => {
title: `${type ? list[i].taskName : list[i].runName}`,
key: `${type ? list[i].taskId : list[i].runId}`,
isShow: true,
align: 'center',
};
modelcolumns.push(obj);
}
@@ -144,11 +160,16 @@ const getTableColumnsFun = (data: any) => {
obj[tableColumns.value[j].key] = listData[i].name;
} else {
obj[tableColumns.value[j].key] = listData[i][tableColumns.value[j].key];
obj[tableColumns.value[j].key + '_completeStatus'] =
listData[i][tableColumns.value[j].key + '_completeStatus'];
}
}
tableData.value.push(obj);
}
console.log(tableData.value, 'tableData.value');
showTableContent.value = true;
nextTick(() => {
performanceTableRef.value.setDataFun(tableData.value);
@@ -163,13 +184,13 @@ const getPerformanceSTatus = (row: any) => {
}
if (row?.method && row?.resultValue && row?.targetValue) {
const resultValue = Number(row?.resultValue);
const targetValue = Number(row?.targetValue);
const highValue = Number(row?.targetValue);
const targetValue = Number(row?.resultValue);
const lowValue = Number(row?.lowValue);
// 小于等于
if (row.method === '≤') {
if (targetValue <= resultValue) {
if (targetValue <= highValue) {
status = 2;
} else {
status = 1;
@@ -178,7 +199,7 @@ const getPerformanceSTatus = (row: any) => {
// 小于
if (row.method === '<') {
if (targetValue < resultValue) {
if (targetValue < highValue) {
status = 2;
} else {
status = 1;
@@ -186,7 +207,7 @@ const getPerformanceSTatus = (row: any) => {
}
// 大于
if (row.method === '>') {
if (targetValue > resultValue) {
if (targetValue > highValue) {
status = 2;
} else {
status = 1;
@@ -194,7 +215,7 @@ const getPerformanceSTatus = (row: any) => {
}
// 大于等于
if (row.method === '≥') {
if (targetValue >= resultValue) {
if (targetValue >= highValue) {
status = 2;
} else {
status = 1;
@@ -202,7 +223,7 @@ const getPerformanceSTatus = (row: any) => {
}
// 包含
if (row.method === '[]') {
if (targetValue <= resultValue && targetValue >= lowValue) {
if (targetValue <= highValue && targetValue >= lowValue) {
status = 2;
} else {
status = 1;
@@ -229,5 +250,11 @@ watch(
.performance-page {
width: 100%;
height: 100%;
.num-box {
width: 100%;
display: flex;
justify-content: center;
}
}
</style>

View File

@@ -72,14 +72,14 @@ const modelAttribute = ref<any>([
name: '所属阶段',
value: 'ownPhaseName',
},
{
name: '所属机台',
value: 'ownMachineName',
},
{
name: '所属工位',
value: 'ownWorkspaceName',
},
// {
// name: '所属机台',
// value: 'ownMachineName',
// },
// {
// name: '所属工位',
// value: 'ownWorkspaceName',
// },
{
name: '所属工况',
value: 'owntaskName',