业务场景:
多选项必选一个,选了的输入框必填


-
"20"> - <el-col :span="12">
- <el-form-item label="捆绑终端硬件标识" prop="terminalCodeList">
- <el-checkbox-group
- v-model="form.terminalCodeList"
- style="display: flex; flex-direction: column"
- >
- <el-row
- :gutter="20"
- style="margin-top: 20px"
- v-for="item in terminalList"
- >
- <el-col :span="24">
- <el-checkbox :label="item.value" :key="item.value">
- <el-form-item
- label-width="80px"
- :label="item.label"
- :prop="item.value"
- >
- <el-input
- style="width: 200px"
- v-model="form[item.value]"
- :placeholder="`请输入` + item.label"
- />
- el-form-item>
- el-checkbox>
- el-col>
- el-row>
- el-checkbox-group>
- el-form-item>
- el-col>
-
- let terminalList = $ref([
- {
- label: '机顶盒mac',
- value: 'mac',
- },
- {
- label: '机顶盒stbId',
- value: 'stbId',
- },
- {
- label: '电视账号',
- value: 'tVAccount',
- },
- {
- label: '手机号码',
- value: 'mobileNum',
- },
- {
- label: '网关mac',
- value: 'wMac',
- },
- {
- label: '授权码',
- value: 'liscense',
- },
- {
- label: '网关stbId',
- value: 'wStbId',
- },
- ])
- let getMacValidator = (rule, value, callback) => {
- if (
- dialogOperateType == 'update' &&
- form.terminalCodeList.some((item) => item == 'mac') &&
- value == ''
- ) {
- callback(new Error('请输入机顶盒mac'))
- } else {
- callback()
- }
- }
- let getStbIdValidator = (rule, value, callback) => {
- if (
- dialogOperateType == 'update' &&
- form.terminalCodeList.some((item) => item == 'stbId') &&
- value == ''
- ) {
- callback(new Error('请输入机顶盒stbId'))
- } else {
- callback()
- }
- }
- let gettVAccountValidator = (rule, value, callback) => {
- if (
- dialogOperateType == 'update' &&
- form.terminalCodeList.some((item) => item == 'tVAccount') &&
- value == ''
- ) {
- callback(new Error('请输入电视账号'))
- } else {
- callback()
- }
- }
- let getMobileNumValidator = (rule, value, callback) => {
- if (
- dialogOperateType == 'update' &&
- form.terminalCodeList.some((item) => item == 'mobileNum') &&
- value == ''
- ) {
- callback(new Error('请输入手机号码'))
- } else {
- callback()
- }
- }
- let getwMacValidator = (rule, value, callback) => {
- if (
- dialogOperateType == 'update' &&
- form.terminalCodeList.some((item) => item == 'wMac') &&
- value == ''
- ) {
- callback(new Error('请输入网关mac'))
- } else {
- callback()
- }
- }
- let getwStbIdValidator = (rule, value, callback) => {
- if (
- dialogOperateType == 'update' &&
- form.terminalCodeList.some((item) => item == 'wStbId') &&
- value == ''
- ) {
- callback(new Error('请输入网关stbId'))
- } else {
- callback()
- }
- }
- let getLiscenseValidator = (rule, value, callback) => {
- if (
- dialogOperateType == 'update' &&
- form.terminalCodeList.some((item) => item == 'liscense') &&
- value == ''
- ) {
- callback(new Error('请输入授权码'))
- } else {
- callback()
- }
- }
- let getCodeListValidator = (rule, value, callback) => {
- if (value.length == 0) {
- callback(new Error('至少选择一个捆绑终端硬件标识'))
- } else {
- callback()
- }
- }
- let rules = $ref({
- terminalCodeList: [
- {
- required: true,
- validator: getCodeListValidator,
- trigger: 'blur',
- },
- ],
- vendorCode: [{ required: true, validator: getValidator, trigger: 'blur' }],
- serviceCode: [{ required: true, validator: getValidator, trigger: 'blur' }],
- mac: [{ validator: getMacValidator, trigger: 'blur' }],
- stbId: [{ validator: getStbIdValidator, trigger: 'blur' }],
- tVAccount: [{ validator: gettVAccountValidator, trigger: 'blur' }],
- mobileNum: [{ validator: getMobileNumValidator, trigger: 'blur' }],
- wMac: [{ validator: getwMacValidator, trigger: 'blur' }],
- wStbId: [{ validator: getwStbIdValidator, trigger: 'blur' }],
- liscense: [{ validator: getLiscenseValidator, trigger: 'blur' }],
-
- })