feat: 优化全局模型参数页动态展示

This commit is contained in:
wkc
2026-03-16 13:42:00 +08:00
parent a40c44f8b8
commit 608f5b4488

View File

@@ -59,38 +59,53 @@ export default {
name: "ModelParam", name: "ModelParam",
data() { data() {
return { return {
// 模型参数数据(按模型分组)
modelGroups: [], modelGroups: [],
// 修改记录使用对象而非Map确保Vue能检测变化
modifiedParams: {}, modifiedParams: {},
// 加载状态 originalParamValues: {},
loading: false, loading: false,
// 保存状态
saving: false saving: false
}; };
}, },
computed: { computed: {
/** 计算已修改参数数量 */
modifiedCount() { modifiedCount() {
let count = 0; return Object.keys(this.modifiedParams).length;
Object.values(this.modifiedParams).forEach(params => {
count += params.size;
});
return count;
} }
}, },
created() { created() {
this.loadAllParams(); this.loadAllParams();
}, },
methods: { methods: {
/** 加载所有模型参数 */ buildModifiedKey(modelCode, paramCode) {
return `${modelCode}:${paramCode}`;
},
normalizeParamValue(value) {
return value === null || value === undefined ? '' : String(value);
},
normalizeModelGroups(models) {
if (!Array.isArray(models)) {
return [];
}
return models.map(model => ({
...model,
params: Array.isArray(model.params) ? model.params : []
}));
},
resetModifiedState() {
this.modifiedParams = {};
this.originalParamValues = {};
this.modelGroups.forEach(model => {
model.params.forEach(row => {
const key = this.buildModifiedKey(model.modelCode, row.paramCode);
this.$set(this.originalParamValues, key, this.normalizeParamValue(row.paramValue));
});
});
},
async loadAllParams() { async loadAllParams() {
this.loading = true; this.loading = true;
try { try {
const res = await listAllParams({ projectId: 0 }); const res = await listAllParams({ projectId: 0 });
this.modelGroups = res.data.models || []; this.modelGroups = this.normalizeModelGroups(res.data && res.data.models);
// 清空修改记录 this.resetModifiedState();
this.modifiedParams = {};
} catch (error) { } catch (error) {
this.$message.error('加载参数失败:' + error.message); this.$message.error('加载参数失败:' + error.message);
console.error('加载参数失败', error); console.error('加载参数失败', error);
@@ -99,58 +114,52 @@ export default {
} }
}, },
/** 标记参数为已修改 */
markAsModified(modelCode, row) { markAsModified(modelCode, row) {
// 使用 $set 确保 Vue 能检测到对象属性的新增 const modifiedKey = this.buildModifiedKey(modelCode, row.paramCode);
if (!this.modifiedParams[modelCode]) { const currentValue = this.normalizeParamValue(row.paramValue);
this.$set(this.modifiedParams, modelCode, new Set()); const originalValue = this.originalParamValues[modifiedKey];
}
this.modifiedParams[modelCode].add(row.paramCode);
// 强制更新视图 if (currentValue === originalValue) {
this.$forceUpdate(); if (this.modifiedParams[modifiedKey]) {
this.$delete(this.modifiedParams, modifiedKey);
}
return;
}
this.$set(this.modifiedParams, modifiedKey, {
modelCode,
paramCode: row.paramCode,
paramValue: row.paramValue
});
}, },
/** 保存所有修改 */
async handleSaveAll() { async handleSaveAll() {
// 验证是否有修改
if (this.modifiedCount === 0) { if (this.modifiedCount === 0) {
this.$message.info('没有需要保存的修改'); this.$message.info('没有需要保存的修改');
return; return;
} }
// 构造保存数据(只包含修改过的参数) const modelMap = {};
Object.values(this.modifiedParams).forEach(item => {
if (!modelMap[item.modelCode]) {
modelMap[item.modelCode] = {
modelCode: item.modelCode,
params: []
};
}
modelMap[item.modelCode].params.push({
paramCode: item.paramCode,
paramValue: item.paramValue
});
});
const saveDTO = { const saveDTO = {
projectId: 0, projectId: 0,
models: [] models: Object.values(modelMap)
}; };
Object.entries(this.modifiedParams).forEach(([modelCode, paramCodes]) => {
const modelGroup = this.modelGroups.find(m => m.modelCode === modelCode);
if (!modelGroup) return;
const modifiedParamList = modelGroup.params
.filter(p => paramCodes.has(p.paramCode))
.map(p => ({
paramCode: p.paramCode,
paramValue: p.paramValue
}));
if (modifiedParamList.length > 0) {
saveDTO.models.push({
modelCode: modelCode,
params: modifiedParamList
});
}
});
// 保存
this.saving = true; this.saving = true;
try { try {
await saveAllParams(saveDTO); await saveAllParams(saveDTO);
this.$modal.msgSuccess('保存成功'); this.$modal.msgSuccess('保存成功');
// 清空修改记录并重新加载
this.modifiedParams = {};
await this.loadAllParams(); await this.loadAllParams();
} catch (error) { } catch (error) {
if (error.response && error.response.data && error.response.data.msg) { if (error.response && error.response.data && error.response.data.msg) {