fix(ui): 修复修改追踪不生效问题

- 将 Map 改为普通对象,确保 Vue 2 能检测变化
- 使用  添加新属性,触发响应式更新
- 使用  强制更新视图
- 同时修复全局配置和项目配置页面
This commit is contained in:
wkc
2026-03-09 09:17:26 +08:00
parent 1dd744041b
commit dbecc8667b
2 changed files with 30 additions and 18 deletions

View File

@@ -61,8 +61,8 @@ export default {
return {
// 模型参数数据(按模型分组)
modelGroups: [],
// 修改记录(记录哪些参数被修改过
modifiedParams: new Map(),
// 修改记录(使用对象而非Map确保Vue能检测变化
modifiedParams: {},
// 保存状态
saving: false
}
@@ -71,7 +71,7 @@ export default {
/** 计算已修改参数数量 */
modifiedCount() {
let count = 0;
this.modifiedParams.forEach(params => {
Object.values(this.modifiedParams).forEach(params => {
count += params.size;
});
return count;
@@ -96,7 +96,7 @@ export default {
const res = await listAllParams({ projectId: this.projectId });
this.modelGroups = res.data.models;
// 清空修改记录
this.modifiedParams.clear();
this.modifiedParams = {};
} catch (error) {
this.$message.error('加载参数失败:' + error.message);
console.error('加载参数失败', error);
@@ -105,10 +105,14 @@ export default {
/** 标记参数为已修改 */
markAsModified(modelCode, row) {
if (!this.modifiedParams.has(modelCode)) {
this.modifiedParams.set(modelCode, new Set());
// 使用 $set 确保 Vue 能检测到对象属性的新增
if (!this.modifiedParams[modelCode]) {
this.$set(this.modifiedParams, modelCode, new Set());
}
this.modifiedParams.get(modelCode).add(row.paramCode);
this.modifiedParams[modelCode].add(row.paramCode);
// 强制更新视图
this.$forceUpdate();
},
/** 保存所有修改 */
@@ -125,8 +129,10 @@ export default {
models: []
};
this.modifiedParams.forEach((paramCodes, modelCode) => {
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 => ({
@@ -148,7 +154,7 @@ export default {
await saveAllParams(saveDTO);
this.$message.success('保存成功');
// 清空修改记录并重新加载
this.modifiedParams.clear();
this.modifiedParams = {};
await this.loadAllParams();
} catch (error) {
if (error.response && error.response.data && error.response.data.msg) {