feat: AI算法管理模块 编辑回显修复，表格内容校验

src/views/algorithm/base/index.vue

@@ -101,8 +101,8 @@
       />
   
       <!-- 添加或修改算法对话框 -->
-      <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
-        <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+      <el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
+        <el-form ref="form" :model="form" :rules="rules" label-width="100px">
           <el-form-item label="算法名称" prop="algorithmName">
             <el-input v-model="form.algorithmName" placeholder="请输入算法名称" />
           </el-form-item>
@@ -110,7 +110,56 @@
             <el-input v-model="form.algorithmKey" placeholder="请输入算法唯一标识" />
           </el-form-item>
           <el-form-item label="排序" prop="sort">
-            <el-input v-model="form.sort" placeholder="请输入排序" />
+            <el-input-number v-model="form.sort" :min="0" :max="100"></el-input-number>
+          </el-form-item>
+          <el-form-item label="算法块" prop="types">
+            <el-table v-loading="loading" :data="form.types" >
+              <el-table-column label="预警名称" align="center" prop="typeName"> 
+                <template slot-scope="scope">
+                  <div v-if="!scope.row.isEdit">{{ scope.row.typeName }}</div>
+                  <div v-else>
+                    <el-input v-model="scope.row.typeName"></el-input>
+                  </div>
+                </template>
+              </el-table-column>
+              <el-table-column label="预警唯一标识" align="center" prop="typeKey" >
+                <template slot-scope="scope">
+                  <div v-if="!scope.row.isEdit">{{ scope.row.typeKey }}</div>
+                  <div v-else>
+                    <el-input v-model="scope.row.typeKey"></el-input>
+                  </div>
+                </template>
+              </el-table-column>
+              <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+                <template slot-scope="scope">
+                  <el-button
+                    v-if="!scope.row.isEdit"
+                    size="mini"
+                    type="text"
+                    icon="el-icon-edit"
+                    @click="handleAlgUpdate(scope.row)"
+                    v-hasPermi="['system:base:edit']"
+                  >修改</el-button>
+                  <el-button
+                    v-if="scope.row.isEdit"
+                    size="mini"
+                    type="text"
+                    icon="el-icon-edit"
+                    @click="handleAlgSave(scope.row)"
+                    v-hasPermi="['system:base:edit']"
+                  >保存</el-button>
+                  <el-button
+                    v-if="scope.row.isEdit"
+                    size="mini"
+                    type="text"
+                    icon="el-icon-delete"
+                    @click="handleAlgDelete(scope.$index,scope.row)"
+                    v-hasPermi="['system:base:remove']"
+                  >删除</el-button>
+                </template>
+              </el-table-column>
+            </el-table>
+            <el-button style="width: 100%;" type="primary" plain @click="algAdd">+新增算法块</el-button>
           </el-form-item>
         </el-form>
         <div slot="footer" class="dialog-footer">
@@ -196,7 +245,8 @@
           createTime: null,
           updateBy: null,
           updateTime: null,
-          remark: null
+          remark: null,
+          types:[]
         };
         this.resetForm("form");
       },
@@ -228,30 +278,41 @@
         this.reset();
         const id = row.id || this.ids
         getBase(id).then(response => {
-          this.form = response.data;
+          var arr =[]
+          this.form =JSON.parse(JSON.stringify(response.data)) 
+          arr = response.data.types
+          this.form.types=[]
+          arr.forEach(item => {
+            item.isEdit=false
+            this.form.types.push(item)
+          });
           this.open = true;
           this.title = "修改算法";
         });
       },
       /** 提交按钮 */
       submitForm() {
-        this.$refs["form"].validate(valid => {
-          if (valid) {
-            if (this.form.id != null) {
-              updateBase(this.form).then(response => {
-                this.$modal.msgSuccess("修改成功");
-                this.open = false;
-                this.getList();
-              });
-            } else {
-              addBase(this.form).then(response => {
-                this.$modal.msgSuccess("新增成功");
-                this.open = false;
-                this.getList();
-              });
+        if(this.checkFrom(this.form.types)){
+          this.$refs["form"].validate(valid => {
+            if (valid) {
+              if (this.form.id != null) {
+                updateBase(this.form).then(response => {
+                  this.$modal.msgSuccess("修改成功");
+                  this.open = false;
+                  this.getList();
+                });
+              } else {
+                addBase(this.form).then(response => {
+                  this.$modal.msgSuccess("新增成功");
+                  this.open = false;
+                  this.getList();
+                });
+              }
             }
-          }
-        });
+          });
+        }else{
+          this.$message.error('请保存表格内容');
+        }
       },
       /** 删除按钮操作 */
       handleDelete(row) {
@@ -268,7 +329,34 @@
         this.download('system/base/export', {
           ...this.queryParams
         }, `base_${new Date().getTime()}.xlsx`)
-      }
+      },
+      //表格内校验
+      checkFrom(data){
+        var state=true
+        data.forEach(item=>{
+          if(item.isEdit){
+            state = false
+          }
+        })
+        return state
+      },
+      
+      handleAlgUpdate(row) {
+        row.isEdit=true
+      },
+      handleAlgSave(row) {
+        row.isEdit=false
+      },
+      handleAlgDelete(index,row) {
+        this.form.types.splice(index, 1)
+      },
+      algAdd(){
+        this.form.types.push({
+          typeKey:'',
+          typeName:'',
+          isEdit:true,
+        })
+      },
     }
   };
   </script>