feat:http数据集参数添加校验

main
liu.shiyi 2 years ago
parent 8047055b0c
commit 99b611e7e8

@ -9,142 +9,104 @@
:before-close="handleClose" :before-close="handleClose"
class="bs-dialog-wrap bs-el-dialog" class="bs-dialog-wrap bs-el-dialog"
> >
<div class="bs-table-box"> <el-form
<el-table ref="form"
ref="singleTable" :model="form"
:data="params" :rules="formRules"
:border="true" >
align="center" <div class="bs-table-box">
class="bs-el-table" <el-table
> ref="singleTable"
<el-empty slot="empty" /> :data="form.params"
<el-table-column :border="true"
prop="name"
label="参数名称"
align="center"
>
<template slot-scope="scope">
<el-input
v-model="scope.row.name"
class="bs-el-input"
placeholder="请输入名称"
clearable
readonly
@change="checkParamsName(scope.row)"
/>
</template>
</el-table-column>
<!-- <el-table-column
prop="type"
label="参数类型"
align="center" align="center"
width="200" class="bs-el-table"
filterable
> >
<template slot-scope="scope"> <el-empty slot="empty" />
<el-select <el-table-column
v-model="scope.row.type" prop="name"
popper-class="bs-el-select" label="参数名称"
class="bs-el-select" align="center"
placeholder="请选择" >
> <template slot-scope="scope">
<el-option <el-input
v-for="item in typeOptions" v-model="scope.row.name"
:key="item.value" class="bs-el-input"
:label="item.value" placeholder="请输入名称"
:value="item.value" clearable
readonly
@change="checkParamsName(scope.row)"
/> />
</el-select> </template>
</template> </el-table-column>
</el-table-column> --> <el-table-column
<el-table-column prop="require"
prop="require" label="是否必填"
label="是否必填" align="center"
align="center" width="200"
width="200" filterable
filterable >
> <template slot-scope="scope">
<template slot-scope="scope"> <el-radio-group
<el-radio-group v-model="scope.row.require"
v-model="scope.row.require" :disabled="isUpdate"
:disabled="isUpdate" >
> <el-radio :label="1">
<el-radio :label="1">
</el-radio>
</el-radio> <el-radio :label="0">
<el-radio :label="0">
</el-radio>
</el-radio> </el-radio-group>
</el-radio-group> </template>
</template> </el-table-column>
</el-table-column> <el-table-column
<el-table-column prop="value"
prop="value" label="参数值"
label="参数值" align="center"
align="center" >
> <template slot-scope="scope">
<template slot-scope="scope"> <el-date-picker
<el-date-picker v-if="scope.row.type === 'Date'"
v-if="scope.row.type === 'Date'" v-model="scope.row.value"
v-model="scope.row.value" type="datetime"
type="datetime" value-format="yyyy-MM-dd HH:mm:ss"
value-format="yyyy-MM-dd HH:mm:ss" placeholder="选择日期时间"
placeholder="选择日期时间" />
/> <el-form-item
<el-input v-else
v-else :prop="'params.' + scope.$index + '.value'"
v-model="scope.row.value" :rules="scope.row.require ?formRules.value:null"
class="bs-el-input" >
clearable <el-input
placeholder="请输入值" v-model="scope.row.value"
/> class="bs-el-input"
</template> clearable
</el-table-column> placeholder="请输入值"
<el-table-column />
prop="remark" </el-form-item>
label="备注" </template>
align="center" </el-table-column>
> <el-table-column
<template slot-scope="scope"> prop="remark"
<el-input label="备注"
v-model="scope.row.remark" align="center"
clearable >
class="bs-el-input" <template slot-scope="scope">
placeholder="请输入备注" <el-input
rows="2" v-model="scope.row.remark"
:readonly="isUpdate" clearable
maxlength="200" class="bs-el-input"
/> placeholder="请输入备注"
</template> rows="2"
</el-table-column> :readonly="isUpdate"
<!-- <el-table-column--> maxlength="200"
<!-- label="操作"--> />
<!-- width="105"--> </template>
<!-- align="center"--> </el-table-column>
<!-- >--> </el-table>
<!-- <template slot="header">--> </div>
<!-- <el-button--> </el-form>
<!-- icon="el-icon-plus"-->
<!-- type="text"-->
<!-- class="no-border"-->
<!-- @click="addParam"-->
<!-- >-->
<!-- 添加-->
<!-- </el-button>-->
<!-- </template>-->
<!-- <template slot-scope="scope">-->
<!-- <el-button-->
<!-- type="text"-->
<!-- style="color: #e47470;"-->
<!-- class="no-border"-->
<!-- @click="delRow(scope.$index)"-->
<!-- >-->
<!-- 删除-->
<!-- </el-button>-->
<!-- </template>-->
<!-- </el-table-column>-->
</el-table>
</div>
<span <span
slot="footer" slot="footer"
class="dialog-footer" class="dialog-footer"
@ -182,18 +144,23 @@ export default {
}, },
data () { data () {
return { return {
params: [],
isUpdate: false, isUpdate: false,
dialogVisible: false dialogVisible: false,
form: {
params: []
},
formRules: {
value: [{ required: true, message: '参数值不能为空', trigger: 'blur' }]
}
} }
}, },
methods: { methods: {
open (isUpdate = false) { open (isUpdate = false) {
this.$emit('getPramsList') this.$emit('getPramsList')
if (isUpdate) { if (isUpdate) {
this.params = this.newParamsList this.form.params = this.newParamsList
} else { } else {
this.params = cloneDeep(this.paramsList) this.form.params = cloneDeep(this.paramsList)
} }
this.isUpdate = isUpdate this.isUpdate = isUpdate
this.dialogVisible = true this.dialogVisible = true
@ -205,7 +172,7 @@ export default {
this.dialogVisible = false this.dialogVisible = false
}, },
checkParamsName (value) { checkParamsName (value) {
const checkList = this.params.filter(item => item.fieldName === value.name) const checkList = this.form.params.filter(item => item.fieldName === value.name)
if (checkList.length) { if (checkList.length) {
this.$message.warning('参数名称不可以与字段名相同!') this.$message.warning('参数名称不可以与字段名相同!')
value.name = '' value.name = ''
@ -215,14 +182,18 @@ export default {
this.dialogVisible = false this.dialogVisible = false
}, },
confirm () { confirm () {
if (!this.isUpdate) { this.$refs.form.validate((valid) => {
this.$emit('saveParams', cloneDeep(this.params)) if (valid) {
} else { if (!this.isUpdate) {
console.log(this.params) this.$emit('saveParams', cloneDeep(this.form.params))
this.$emit('saveNewParams', cloneDeep(this.params)) } else {
} console.log(this.form.params)
this.$emit('getData') this.$emit('saveNewParams', cloneDeep(this.form.params))
this.dialogVisible = false }
this.$emit('getData')
this.dialogVisible = false
}
})
} }
} }
} }

Loading…
Cancel
Save