feat: 优化项目模型参数页动态展示

ruoyi-ui/src/views/ccdiProject/components/detail/ParamConfig.vue

@@ -64,30 +64,26 @@ export default {
   },
   data() {
     return {
-      // 模型参数数据（按模型分组）
       modelGroups: [],
-      // 修改记录（使用对象而非Map，确保Vue能检测变化）
       modifiedParams: {},
-      // 加载状态
+      originalParamValues: {},
       loading: false,
-      // 保存状态
       saving: false
     }
   },
   computed: {
-    /** 计算已修改参数数量 */
     modifiedCount() {
-      let count = 0;
+      return Object.keys(this.modifiedParams).length;
-      Object.values(this.modifiedParams).forEach(params => {
-        count += params.size;
-      });
-      return count;
     }
   },
   watch: {
     projectId(newVal) {
       if (newVal) {
         this.loadAllParams();
+      } else {
+        this.modelGroups = [];
+        this.modifiedParams = {};
+        this.originalParamValues = {};
       }
     }
   },
@@ -97,14 +93,37 @@ export default {
     }
   },
   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() {
       this.loading = true;
       try {
         const res = await listAllParams({ projectId: this.projectId });
-        this.modelGroups = res.data.models || [];
+        this.modelGroups = this.normalizeModelGroups(res.data && res.data.models);
-        // 清空修改记录
+        this.resetModifiedState();
-        this.modifiedParams = {};
       } catch (error) {
         this.$message.error('加载参数失败：' + error.message);
         console.error('加载参数失败', error);
@@ -113,58 +132,52 @@ export default {
       }
     },
 
-    /** 标记参数为已修改 */
     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() {
-      // 验证是否有修改
       if (this.modifiedCount === 0) {
         this.$message.info('没有需要保存的修改');
         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 = {
         projectId: this.projectId,
-        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;
       try {
         await saveAllParams(saveDTO);
-        this.$message.success('保存成功');
+        this.$modal.msgSuccess('保存成功');
-        // 清空修改记录并重新加载
-        this.modifiedParams = {};
         await this.loadAllParams();
       } catch (error) {
         if (error.response && error.response.data && error.response.data.msg) {