【修改】校验展示形式统一

This commit is contained in:
zhoulingpo
2023-04-26 14:41:20 +08:00
parent 7eaee0f584
commit 963754a29e
+39 -30
View File
@@ -2,16 +2,16 @@
<div> <div>
<el-dialog title="新增/编辑标签" :visible.sync="dialogVisible" width="30%" :before-close="handleClose"> <el-dialog title="新增/编辑标签" :visible.sync="dialogVisible" width="30%" :before-close="handleClose">
<div class="form"> <div class="form">
<el-form ref="form" :model="form" label-width="80px" :rules="rule"> <el-form ref="form" :model="form" label-width="80px" >
<el-form-item label="上级标签" prop="nodeLabel"> <el-form-item label="上级标签" prop="nodeLabel" required>
<el-cascader v-model="form.nodeLabel" placeholder="请选择上级标签" :options="cascaderOptions" filterable :props="{ checkStrictly: true }" clearable > <el-cascader v-model="form.nodeLabel" placeholder="请选择上级标签" :options="cascaderOptions" filterable :props="{ checkStrictly: true }" clearable >
</el-cascader> </el-cascader>
</el-form-item> </el-form-item>
<el-form-item label="标签名称" prop="label"> <el-form-item label="标签名称" prop="label" required>
<el-input v-model="form.label" max="100" placeholder="请输入标签名称"></el-input> <el-input v-model="form.label" max="100" placeholder="请输入标签名称"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="排序" prop="orderNum"> <el-form-item label="排序" prop="orderNum" required>
<el-input v-model="form.orderNum" placeholder="请输入排序"></el-input> <el-input v-model="form.orderNum" placeholder="请输入排序"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="备注" prop="remark"> <el-form-item label="备注" prop="remark">
@@ -36,16 +36,7 @@
export default { export default {
name: 'labelModal', name: 'labelModal',
data() { data() {
var checkNum = (rule, value, callback) => {
setTimeout(() => {
let test=/^[1-9]\d*$/
if (!test.test(value)) {
callback(new Error('请输入数字'));
} else {
callback()
}
}, 1000)
}
return { return {
dialogVisible: false, dialogVisible: false,
form: { form: {
@@ -58,22 +49,42 @@ export default {
cascaderOptions:[ cascaderOptions:[
], ],
rule: { // rule: {
label: [ // label: [
{ required: true, trigger: 'blur', message: '请输入标签名称' } // { required: true, trigger: 'blur', message: '请输入标签名称' }
], // ],
nodeLabel: [ // nodeLabel: [
{ required: true, trigger: 'change', message: '请选择上级标签' } // { required: true, trigger: 'change', message: '请选择上级标签' }
], // ],
orderNum: [ // orderNum: [
{ required: true, trigger: 'change', message: '请输入排序' }, // { required: true, trigger: 'change', message: '请输入排序' },
{ validator:checkNum , trigger: 'change'} // { validator:checkNum , trigger: 'change'}
], // ],
//
}, // },
}; };
}, },
methods: { methods: {
// 必填项
checkReportF() {
let test=/^[1-9]\d*$/
if (!this.form.label) {
return this.$message.warning('请检查标签名称') && false;
}
if (!this.form.nodeLabel) {
return this.$message.warning('请检查上级标签') && false;
}
if (!this.form.orderNum) {
return this.$message.warning('请检查排序') && false;
}
if (!this.form.orderNum) {
return this.$message.warning('请检查排序') && false;
}
if(!test.test(this.form.orderNum)){
return this.$message.warning('排序只能输入数字!') && false;
}
return true;
},
handleClose(done) { handleClose(done) {
// this.$confirm('确认关闭?') // this.$confirm('确认关闭?')
// .then(_ => { // .then(_ => {
@@ -119,8 +130,7 @@ export default {
this.dialogVisible = false this.dialogVisible = false
}, },
submitForm() { submitForm() {
this.$refs.form.validate((valid) => { if (this.checkReportF()) {
if (valid) {
this.form.parentId=this.form.nodeLabel[this.form.nodeLabel.length - 1] this.form.parentId=this.form.nodeLabel[this.form.nodeLabel.length - 1]
delete this.form.nodeLabel delete this.form.nodeLabel
if(!this.form.id){ if(!this.form.id){
@@ -147,7 +157,6 @@ export default {
} }
this.dialogVisible = false this.dialogVisible = false
} }
})
} }
} }
} }