feat: AI算法管理模块编辑回显修复，表格内容校验 (62561f07) · Commits · AI算法平台 / RuoYi-Vue-ui · GitLab

src/views/algorithm/base/index.vue

+110 −22

Original line number	Diff line number	Diff line
		@@ -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,13 +278,21 @@
		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() {
		if(this.checkFrom(this.form.types)){
		this.$refs["form"].validate(valid => {
		if (valid) {
		if (this.form.id != null) {
		@@ -252,6 +310,9 @@
		}
		}
		});
		}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>