WL/laws_weilai
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

增加必填校验

Browse Source
This commit is contained in:
qq787203167
2022-02-12 15:00:38 +08:00
parent 8de6d281c9
commit 854495c7ad
2 changed files with 101 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files
jero-web/src/components/addForm/index.vue
+100 -44
View File
@@ -11,7 +11,7 @@
<a-col :span="12" v-if="item.type === 'INPUT'"> <a-col :span="12" v-if="item.type === 'INPUT'">
<div class="box-title-text"> <div class="box-title-text">
<div class="title-text"> <div class="title-text">
<span class="Required">*</span> <span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.enName}}</span><br> <span :class="{'title-text-text':false}">{{item.enName}}</span><br>
<span :class="{'title-text-text':false}">{{item.name}}</span> <span :class="{'title-text-text':false}">{{item.name}}</span>
</div> </div>
@@ -24,7 +24,7 @@
<a-col :span="12" v-else-if="item.type === 'CHECKBOX'"> <a-col :span="12" v-else-if="item.type === 'CHECKBOX'">
<div class="box-title-text"> <div class="box-title-text">
<div class="title-text"> <div class="title-text">
<span class="Required">*</span> <span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.enName}}</span><br> <span :class="{'title-text-text':false}">{{item.enName}}</span><br>
<span :class="{'title-text-text':false}">{{item.name}}</span> <span :class="{'title-text-text':false}">{{item.name}}</span>
</div> </div>
@@ -39,7 +39,7 @@
<a-col :span="12" v-else-if="item.type === 'SINGLETIME'"> <a-col :span="12" v-else-if="item.type === 'SINGLETIME'">
<div class="box-title-text"> <div class="box-title-text">
<div class="title-text"> <div class="title-text">
<span class="Required">*</span> <span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.enName}}</span><br> <span :class="{'title-text-text':false}">{{item.enName}}</span><br>
<span :class="{'title-text-text':false}">{{item.name}}</span> <span :class="{'title-text-text':false}">{{item.name}}</span>
</div> </div>
@@ -53,7 +53,7 @@
<a-col :span="12" v-else-if="item.type === 'SMULTITIME'"> <a-col :span="12" v-else-if="item.type === 'SMULTITIME'">
<div class="box-title-text"> <div class="box-title-text">
<div class="title-text"> <div class="title-text">
<span class="Required">*</span> <span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.enName}}</span><br> <span :class="{'title-text-text':false}">{{item.enName}}</span><br>
<span :class="{'title-text-text':false}">{{item.name}}</span> <span :class="{'title-text-text':false}">{{item.name}}</span>
</div> </div>
@@ -67,7 +67,7 @@
<a-col :span="12" v-else-if="item.type === 'NUMBER'"> <a-col :span="12" v-else-if="item.type === 'NUMBER'">
<div class="box-title-text"> <div class="box-title-text">
<div class="title-text"> <div class="title-text">
<span class="Required">*</span> <span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.enName}}</span><br> <span :class="{'title-text-text':false}">{{item.enName}}</span><br>
<span :class="{'title-text-text':false}">{{item.name}}</span> <span :class="{'title-text-text':false}">{{item.name}}</span>
</div> </div>
@@ -80,12 +80,13 @@
<a-col :span="12" v-else-if="item.type === 'SELECT'"> <a-col :span="12" v-else-if="item.type === 'SELECT'">
<div class="box-title-text"> <div class="box-title-text">
<div class="title-text"> <div class="title-text">
<span class="Required">*</span> <span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.enName}}</span><br> <span :class="{'title-text-text':false}">{{item.enName}}</span><br>
<span :class="{'title-text-text':false}">{{item.name}}</span> <span :class="{'title-text-text':false}">{{item.name}}</span>
</div> </div>
<a-form-model-item class="itemModel" :prop="item.attrModel"> <a-form-model-item class="itemModel" :prop="item.attrModel">
<j-dict-select-tag class="box-input" v-model="formInline[item.attrModel]" <j-dict-select-tag class="box-input" v-model="formInline[item.attrModel]"
@input="handleInput(item.attrModel)"
:placeholder="$t('selectStatus')" :type="'select'" :placeholder="$t('selectStatus')" :type="'select'"
:triggerChange="false" dictCode="valid_status"/> :triggerChange="false" dictCode="valid_status"/>
</a-form-model-item> </a-form-model-item>
@@ -95,7 +96,7 @@
<a-col :span="12" v-else-if="item.type === 'SELECTALL'"> <a-col :span="12" v-else-if="item.type === 'SELECTALL'">
<div class="box-title-text"> <div class="box-title-text">
<div class="title-text"> <div class="title-text">
<span class="Required">*</span> <span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.enName}}</span><br> <span :class="{'title-text-text':false}">{{item.enName}}</span><br>
<span :class="{'title-text-text':false}">{{item.name}}</span> <span :class="{'title-text-text':false}">{{item.name}}</span>
</div> </div>
@@ -110,12 +111,14 @@
<a-col :span="12" v-else-if="item.type === 'RADIO'"> <a-col :span="12" v-else-if="item.type === 'RADIO'">
<div class="box-title-text"> <div class="box-title-text">
<div class="title-text"> <div class="title-text">
<span class="Required">*</span> <span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.enName}}</span><br> <span :class="{'title-text-text':false}">{{item.enName}}</span><br>
<span :class="{'title-text-text':false}">{{item.name}}</span> <span :class="{'title-text-text':false}">{{item.name}}</span>
</div> </div>
<a-form-model-item class="itemModel" :prop="item.attrModel"> <a-form-model-item class="itemModel" :prop="item.attrModel">
<j-dict-select-tag v-model="formInline[item.attrModel]" :placeholder="$t('selectStatus')" <j-dict-select-tag v-model="formInline[item.attrModel]"
@input="handleInput(item.attrModel)"
:placeholder="$t('selectStatus')"
:type="'radio'" :triggerChange="false" dictCode="valid_status"/> :type="'radio'" :triggerChange="false" dictCode="valid_status"/>
</a-form-model-item> </a-form-model-item>
</div> </div>
@@ -124,7 +127,7 @@
<a-col :span="24" v-else-if="item.type === 'TEXTAREA'"> <a-col :span="24" v-else-if="item.type === 'TEXTAREA'">
<div class="box-title-text"> <div class="box-title-text">
<div class="title-text"> <div class="title-text">
<span class="Required">*</span> <span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.enName}}</span><br> <span :class="{'title-text-text':false}">{{item.enName}}</span><br>
<span :class="{'title-text-text':false}">{{item.name}}</span> <span :class="{'title-text-text':false}">{{item.name}}</span>
</div> </div>
@@ -137,7 +140,7 @@
<a-col :span="24" v-else-if="item.type === 'FILE'"> <a-col :span="24" v-else-if="item.type === 'FILE'">
<div class="box-title-text"> <div class="box-title-text">
<div class="title-text"> <div class="title-text">
<span class="Required">*</span> <span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.enName}}</span><br> <span :class="{'title-text-text':false}">{{item.enName}}</span><br>
<span :class="{'title-text-text':false}">{{item.name}}</span> <span :class="{'title-text-text':false}">{{item.name}}</span>
</div> </div>
@@ -155,7 +158,7 @@
<a-col :span="24" v-else-if="item.type === 'STANDARD'"> <a-col :span="24" v-else-if="item.type === 'STANDARD'">
<div class="box-title-text"> <div class="box-title-text">
<div class="title-text"> <div class="title-text">
<span class="Required">*</span> <span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.enName}}</span><br> <span :class="{'title-text-text':false}">{{item.enName}}</span><br>
<span :class="{'title-text-text':false}">{{item.name}}</span> <span :class="{'title-text-text':false}">{{item.name}}</span>
</div> </div>
@@ -174,7 +177,7 @@
<a-col :span="12" v-if="item.type === 'INPUT'"> <a-col :span="12" v-if="item.type === 'INPUT'">
<div class="box-title-text"> <div class="box-title-text">
<div class="title-text"> <div class="title-text">
<span class="Required">*</span> <span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.enName}}</span><br> <span :class="{'title-text-text':false}">{{item.enName}}</span><br>
<span :class="{'title-text-text':false}">{{item.name}}</span> <span :class="{'title-text-text':false}">{{item.name}}</span>
</div> </div>
@@ -187,7 +190,7 @@
<a-col :span="12" v-else-if="item.type === 'CHECKBOX'"> <a-col :span="12" v-else-if="item.type === 'CHECKBOX'">
<div class="box-title-text"> <div class="box-title-text">
<div class="title-text"> <div class="title-text">
<span class="Required">*</span> <span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.enName}}</span><br> <span :class="{'title-text-text':false}">{{item.enName}}</span><br>
<span :class="{'title-text-text':false}">{{item.name}}</span> <span :class="{'title-text-text':false}">{{item.name}}</span>
</div> </div>
@@ -202,7 +205,7 @@
<a-col :span="12" v-else-if="item.type === 'SINGLETIME'"> <a-col :span="12" v-else-if="item.type === 'SINGLETIME'">
<div class="box-title-text"> <div class="box-title-text">
<div class="title-text"> <div class="title-text">
<span class="Required">*</span> <span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.enName}}</span><br> <span :class="{'title-text-text':false}">{{item.enName}}</span><br>
<span :class="{'title-text-text':false}">{{item.name}}</span> <span :class="{'title-text-text':false}">{{item.name}}</span>
</div> </div>
@@ -216,7 +219,7 @@
<a-col :span="12" v-else-if="item.type === 'SMULTITIME'"> <a-col :span="12" v-else-if="item.type === 'SMULTITIME'">
<div class="box-title-text"> <div class="box-title-text">
<div class="title-text"> <div class="title-text">
<span class="Required">*</span> <span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.enName}}</span><br> <span :class="{'title-text-text':false}">{{item.enName}}</span><br>
<span :class="{'title-text-text':false}">{{item.name}}</span> <span :class="{'title-text-text':false}">{{item.name}}</span>
</div> </div>
@@ -229,7 +232,7 @@
<a-col :span="12" v-else-if="item.type === 'NUMBER'"> <a-col :span="12" v-else-if="item.type === 'NUMBER'">
<div class="box-title-text"> <div class="box-title-text">
<div class="title-text"> <div class="title-text">
<span class="Required">*</span> <span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.enName}}</span><br> <span :class="{'title-text-text':false}">{{item.enName}}</span><br>
<span :class="{'title-text-text':false}">{{item.name}}</span> <span :class="{'title-text-text':false}">{{item.name}}</span>
</div> </div>
@@ -242,7 +245,7 @@
<a-col :span="12" v-else-if="item.type === 'SELECT'"> <a-col :span="12" v-else-if="item.type === 'SELECT'">
<div class="box-title-text"> <div class="box-title-text">
<div class="title-text"> <div class="title-text">
<span class="Required">*</span> <span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.enName}}</span><br> <span :class="{'title-text-text':false}">{{item.enName}}</span><br>
<span :class="{'title-text-text':false}">{{item.name}}</span> <span :class="{'title-text-text':false}">{{item.name}}</span>
</div> </div>
@@ -257,7 +260,7 @@
<a-col :span="12" v-else-if="item.type === 'SELECTALL'"> <a-col :span="12" v-else-if="item.type === 'SELECTALL'">
<div class="box-title-text"> <div class="box-title-text">
<div class="title-text"> <div class="title-text">
<span class="Required">*</span> <span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.enName}}</span><br> <span :class="{'title-text-text':false}">{{item.enName}}</span><br>
<span :class="{'title-text-text':false}">{{item.name}}</span> <span :class="{'title-text-text':false}">{{item.name}}</span>
</div> </div>
@@ -272,7 +275,7 @@
<a-col :span="12" v-else-if="item.type === 'RADIO'"> <a-col :span="12" v-else-if="item.type === 'RADIO'">
<div class="box-title-text"> <div class="box-title-text">
<div class="title-text"> <div class="title-text">
<span class="Required">*</span> <span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.enName}}</span><br> <span :class="{'title-text-text':false}">{{item.enName}}</span><br>
<span :class="{'title-text-text':false}">{{item.name}}</span> <span :class="{'title-text-text':false}">{{item.name}}</span>
</div> </div>
@@ -286,7 +289,7 @@
<a-col :span="24" v-else-if="item.type === 'TEXTAREA'"> <a-col :span="24" v-else-if="item.type === 'TEXTAREA'">
<div class="box-title-text"> <div class="box-title-text">
<div class="title-text"> <div class="title-text">
<span class="Required">*</span> <span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.enName}}</span><br> <span :class="{'title-text-text':false}">{{item.enName}}</span><br>
<span :class="{'title-text-text':false}">{{item.name}}</span> <span :class="{'title-text-text':false}">{{item.name}}</span>
</div> </div>
@@ -299,7 +302,7 @@
<a-col :span="24" v-else-if="item.type === 'FILE'"> <a-col :span="24" v-else-if="item.type === 'FILE'">
<div class="box-title-text"> <div class="box-title-text">
<div class="title-text"> <div class="title-text">
<span class="Required">*</span> <span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.enName}}</span><br> <span :class="{'title-text-text':false}">{{item.enName}}</span><br>
<span :class="{'title-text-text':false}">{{item.name}}</span> <span :class="{'title-text-text':false}">{{item.name}}</span>
</div> </div>
@@ -317,7 +320,7 @@
<a-col :span="24" v-else-if="item.type === 'STANDARD'"> <a-col :span="24" v-else-if="item.type === 'STANDARD'">
<div class="box-title-text"> <div class="box-title-text">
<div class="title-text"> <div class="title-text">
<span class="Required">*</span> <span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.enName}}</span><br> <span :class="{'title-text-text':false}">{{item.enName}}</span><br>
<span :class="{'title-text-text':false}">{{item.name}}</span> <span :class="{'title-text-text':false}">{{item.name}}</span>
</div> </div>
@@ -359,11 +362,7 @@
return { return {
formInline: {}, formInline: {},
isFormInline: false, isFormInline: false,
rules: { rules: {},
title: [
{ required: true, message: 'Please input Activity name', trigger: 'blur' }
]
},
labelCol: { labelCol: {
xs: { span: 24 }, xs: { span: 24 },
sm: { span: 6 } sm: { span: 6 }
@@ -380,7 +379,8 @@
placeholder: '请输入名称', placeholder: '请输入名称',
attrModel: 'name', attrModel: 'name',
enName: 'Name', enName: 'Name',
text: '基本信息' text: '基本信息',
Required: true
}, },
{ {
id: 2, id: 2,
@@ -389,7 +389,8 @@
placeholder: '请输入标题', placeholder: '请输入标题',
attrModel: 'title', attrModel: 'title',
enName: 'title', enName: 'title',
text: '基本信息' text: '基本信息',
Required: true
}, },
{ {
id: 3, id: 3,
@@ -399,7 +400,8 @@
enName: 'Single choice', enName: 'Single choice',
validStatus: 'valid_status', validStatus: 'valid_status',
attrModel: 'radio', attrModel: 'radio',
text: '基本信息' text: '基本信息',
Required: true
}, },
{ {
id: 4, id: 4,
@@ -409,7 +411,8 @@
placeholder: '请输入标题', placeholder: '请输入标题',
attrModel: 'checkbox', attrModel: 'checkbox',
validStatus: 'valid_status', validStatus: 'valid_status',
text: '基本信息' text: '基本信息',
Required: true
}, },
{ {
id: 5, id: 5,
@@ -417,9 +420,10 @@
name: '下拉单选', name: '下拉单选',
enName: 'title', enName: 'title',
placeholder: '请输入标题', placeholder: '请输入标题',
attrModel: 'radio', attrModel: 'selete',
validStatus: 'valid_status', validStatus: 'valid_status',
text: '基本信息' text: '基本信息',
Required: true
}, },
{ {
id: 6, id: 6,
@@ -429,7 +433,8 @@
placeholder: '请输入标题', placeholder: '请输入标题',
validStatus: 'valid_status', validStatus: 'valid_status',
attrModel: 'selectAll', attrModel: 'selectAll',
text: '基本信息' text: '基本信息',
Required: true
}, },
{ {
id: 7, id: 7,
@@ -446,7 +451,7 @@
name: '文本框', name: '文本框',
enName: 'title', enName: 'title',
placeholder: '请输入文本框', placeholder: '请输入文本框',
attrModel: 'number', attrModel: 'textArea',
text: '基本信息' text: '基本信息'
}, },
{ {
@@ -506,8 +511,7 @@
} }
}, },
mounted() { mounted() {
this.isFormInline = false this.IntegrateData()
this.isFormInline = true
if (this.isDisplayType) { if (this.isDisplayType) {
this.headerText.forEach((res) => { this.headerText.forEach((res) => {
res.content = [] res.content = []
@@ -518,13 +522,14 @@
}) })
}) })
} }
console.log('dataheae',this.headerText)
}, },
methods: { methods: {
sumber() { sumber() {
console.log(this.formInline)
this.$refs.ruleForm.validate(valid => { this.$refs.ruleForm.validate(valid => {
if (valid) { if (valid) {
alert('submit!') console.log(valid)
console.log(this.formInline)
} else { } else {
console.log('error submit!!') console.log('error submit!!')
return false return false
@@ -549,7 +554,58 @@
this.formInline[this.uploadName] = attIdList.join(',') this.formInline[this.uploadName] = attIdList.join(',')
this.formInline = { ...this.formInline } this.formInline = { ...this.formInline }
}, },
handleInput(value) {
this.$nextTick(() => {
this.formInline = { ...this.formInline }
this.$refs.ruleForm.validateField([value])
})
},
IntegrateData() {
this.isFormInline = false
let rules = {}
this.dataList.forEach((res, index) => {
const rule = []
if (res.Required) {
if (res.type === 'INPUT') {
rule.push({
required: true,
message: res.name + '不能为空',
trigger: 'blur'
})
} else if (res.type === 'CHECKBOX' || res.type === 'SELECTALL' ||
res.type === 'SINGLETIME' || res.type === 'SMULTITIME') {
rule.push({
required: true,
message: res.name + '不能为空',
trigger: 'change'
})
} else if (res.type === 'NUMBER') {
rule.push({
required: true,
message: res.name + '不能为空',
trigger: 'blur'
})
} else if (res.type === 'TEXTAREA') {
rule.push({
required: true,
message: res.name + '不能为空',
trigger: 'blur'
})
} else if (res.type === 'RADIO' || res.type === 'SELECT') {
rule.push({
required: true,
message: res.name + '不能为空',
trigger: 'change'
})
}
}
if (rule.length > 0) {
rules[res.attrModel] = rule
}
})
this.$set(this, 'rules', rules)
this.isFormInline = true
}
} }
} }
</script> </script>
@@ -563,9 +619,9 @@
width: calc(100% - 130px); width: calc(100% - 130px);
} }
.formAdd .ant-form-item { /*.formAdd .ant-form-item {*/
margin-bottom: 20px; /* margin-bottom: 20px;*/
} /*}*/
.itemModel .ant-form-item-control-wrapper { .itemModel .ant-form-item-control-wrapper {
width: 100%; width: 100%;
jero-web/src/components/dict/JDictSelectTag.vue
+1 -1
View File
@@ -89,7 +89,7 @@
}else{ }else{
val = e val = e
} }
console.log(val); console.log(val)
if(this.triggerChange){ if(this.triggerChange){
this.$emit('change', val); this.$emit('change', val);
}else{ }else{