fix 提示填写必填项,应展开显示,不然看不到必填的位置
This commit is contained in:
@@ -2,10 +2,13 @@
|
|||||||
<a-table
|
<a-table
|
||||||
v-bind="$attrs"
|
v-bind="$attrs"
|
||||||
v-on="$listeners"
|
v-on="$listeners"
|
||||||
|
:row-key="rowKey"
|
||||||
:bordered="bordered"
|
:bordered="bordered"
|
||||||
:scroll="{x: '100%'}"
|
:scroll="{x: '100%'}"
|
||||||
:row-class-name="lineCanExpand"
|
:row-class-name="lineCanExpand"
|
||||||
:columns="columns"
|
:columns="columns"
|
||||||
|
:expandedRowKeys.sync="expandedRowKeys"
|
||||||
|
:pagination="ipagination"
|
||||||
:data-source="dataSource">
|
:data-source="dataSource">
|
||||||
<!-- 如果插槽是作用域插槽,将作用域插槽的props包装成对象传递给slot -->
|
<!-- 如果插槽是作用域插槽,将作用域插槽的props包装成对象传递给slot -->
|
||||||
<template v-for="(_, slotName) in $scopedSlots" :slot="slotName" slot-scope="text, record, index">
|
<template v-for="(_, slotName) in $scopedSlots" :slot="slotName" slot-scope="text, record, index">
|
||||||
@@ -26,7 +29,7 @@
|
|||||||
<template v-if="formIsDepend">
|
<template v-if="formIsDepend">
|
||||||
<template v-for="(value, key) in extraForm">
|
<template v-for="(value, key) in extraForm">
|
||||||
<template v-if="record[formIsDepend] === key">
|
<template v-if="record[formIsDepend] === key">
|
||||||
<a-form-model :key="key" :model="record" :rules="value.rules" :ref="`ruleForm${index}`">
|
<a-form-model :key="key" :model="record" :rules="value.rules" :ref="`ruleForm${record[rowKey]}`">
|
||||||
<a-form-model-item v-for="form in value.formArr"
|
<a-form-model-item v-for="form in value.formArr"
|
||||||
:key="form.dbFieldName"
|
:key="form.dbFieldName"
|
||||||
:labelCol="labelCol"
|
:labelCol="labelCol"
|
||||||
@@ -235,6 +238,27 @@ export default {
|
|||||||
type: [String, Number],
|
type: [String, Number],
|
||||||
required: false,
|
required: false,
|
||||||
default: null
|
default: null
|
||||||
|
},
|
||||||
|
// 表格行数据的主键
|
||||||
|
rowKey: {
|
||||||
|
type: String,
|
||||||
|
required: false,
|
||||||
|
default: 'id'
|
||||||
|
},
|
||||||
|
// 分页参数
|
||||||
|
pagination: {
|
||||||
|
type: [Boolean, Object],
|
||||||
|
required: false,
|
||||||
|
default: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
pagination: {
|
||||||
|
handler (val) {
|
||||||
|
this.ipagination = Object.assign({}, val)
|
||||||
|
},
|
||||||
|
deep: true,
|
||||||
|
immediate: true
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
data () {
|
data () {
|
||||||
@@ -246,25 +270,25 @@ export default {
|
|||||||
sm: 16
|
sm: 16
|
||||||
},
|
},
|
||||||
// 本系统限制可以上传的文件格式
|
// 本系统限制可以上传的文件格式
|
||||||
canUploadType: 'pdf,docx,doc,xlsx,xls,ppt,pptx,rar,zip,jpg,jpeg,png,avi,wmv,mov,rm,mp4,cad'
|
canUploadType: 'pdf,docx,doc,xlsx,xls,ppt,pptx,rar,zip,jpg,jpeg,png,avi,wmv,mov,rm,mp4,cad',
|
||||||
|
ipagination: {},
|
||||||
|
expandedRowKeys: []
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
submit () {
|
submit () {
|
||||||
|
console.log(this.rowKey)
|
||||||
const arr = []
|
const arr = []
|
||||||
for (const i in this.dataSource) {
|
for (const i in this.dataSource) {
|
||||||
if (this.$refs[`ruleForm${i}`] && this.$refs[`ruleForm${i}`][0]) {
|
if (this.$refs[`ruleForm${i}`] && this.$refs[`ruleForm${i}`][0]) {
|
||||||
this.$refs[`ruleForm${i}`][0].validate(valid => {
|
this.$refs[`ruleForm${i}`][0].validate(valid => {
|
||||||
arr[i] = valid
|
arr[i] = { valid, rowKey: this.dataSource[i][this.rowKey], index: i }
|
||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
// arr[i] = false
|
|
||||||
// 表单都没有渲染,说明没有展开过,也就是未填状态
|
// 表单都没有渲染,说明没有展开过,也就是未填状态
|
||||||
if (this.formIsDepend) {
|
if (this.formIsDepend) {
|
||||||
if (this.dataSource[i][this.formIsDepend]) {
|
if (this.dataSource[i][this.formIsDepend]) {
|
||||||
// 需要依赖某个字段,获取当前行该字段时,扩展表单是否有必填项
|
// 需要依赖某个字段,获取当前行该字段时,扩展表单是否有必填项
|
||||||
// console.log(this.dataSource[i])
|
|
||||||
// console.log(this.extraForm[this.dataSource[i][this.formIsDepend]])
|
|
||||||
const currRowExtraFormFormArr = this.extraForm[this.dataSource[i][this.formIsDepend]].formArr
|
const currRowExtraFormFormArr = this.extraForm[this.dataSource[i][this.formIsDepend]].formArr
|
||||||
const currRowExtraFormRules = this.extraForm[this.dataSource[i][this.formIsDepend]].rules
|
const currRowExtraFormRules = this.extraForm[this.dataSource[i][this.formIsDepend]].rules
|
||||||
let isHaveRequired = false
|
let isHaveRequired = false
|
||||||
@@ -274,24 +298,18 @@ export default {
|
|||||||
isHaveRequired = true
|
isHaveRequired = true
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
// for (const item in currRowExtraFormRules) {
|
|
||||||
// if (currRowExtraFormRules[item].required === true) {
|
|
||||||
// // 有任意一个字段有必填,但没有内容
|
|
||||||
// isHaveRequired = true
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
if (isHaveRequired) {
|
if (isHaveRequired) {
|
||||||
// 任意一个字段有必填,她又没展开过,校验不通过
|
// 任意一个字段有必填,她又没展开过,校验不通过
|
||||||
arr[i] = false
|
arr[i] = { valid: false, rowKey: this.dataSource[i][this.rowKey], index: i }
|
||||||
} else {
|
} else {
|
||||||
arr[i] = true
|
arr[i] = { valid: true, rowKey: this.dataSource[i][this.rowKey], index: i }
|
||||||
}
|
}
|
||||||
} else if (this.lineCanExpandField && this.dataSource[i][this.lineCanExpandField] !== this.lineCanExpandValue) {
|
} else if (this.lineCanExpandField && this.dataSource[i][this.lineCanExpandField] !== this.lineCanExpandValue) {
|
||||||
// 如果这行数据本身不需要填写
|
// 如果这行数据本身不需要填写
|
||||||
arr[i] = true
|
arr[i] = { valid: true, rowKey: this.dataSource[i][this.rowKey], index: i }
|
||||||
} else {
|
} else {
|
||||||
// 依赖的字段都没有填
|
// 依赖的字段都没有填
|
||||||
arr[i] = false
|
arr[i] = { valid: false, rowKey: this.dataSource[i][this.rowKey], index: i }
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
// 没有依赖的字段
|
// 没有依赖的字段
|
||||||
@@ -302,23 +320,35 @@ export default {
|
|||||||
isHaveRequired = true
|
isHaveRequired = true
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
// for (const item in this.extraForm.rules) {
|
|
||||||
// if (this.extraForm.rules[item].required === true) {
|
|
||||||
// // 有任意一个字段有必填
|
|
||||||
// isHaveRequired = true
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
if (isHaveRequired) {
|
if (isHaveRequired) {
|
||||||
// 任意一个字段有必填,她又没展开过,校验不通过
|
// 任意一个字段有必填,她又没展开过,校验不通过
|
||||||
arr[i] = false
|
arr[i] = { valid: false, rowKey: this.dataSource[i][this.rowKey], index: i }
|
||||||
} else {
|
} else {
|
||||||
arr[i] = true
|
arr[i] = { valid: true, rowKey: this.dataSource[i][this.rowKey], index: i }
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
console.log(arr)
|
if (arr.some(tt => !tt.valid)) {
|
||||||
if (arr.includes(false)) {
|
const errorRows = arr.filter(tt => !tt.valid)
|
||||||
|
const errorIndex = errorRows.map(tt => tt.index)
|
||||||
|
const firstIndex = errorRows[0].index
|
||||||
|
const firstPage = parseInt((Number(firstIndex) + 1) / this.ipagination.pageSize) + 1
|
||||||
|
this.ipagination.current = firstPage
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.expandedRowKeys = [...this.expandedRowKeys, ...errorRows.map(tt => tt.rowKey)]
|
||||||
|
let timer = setTimeout(() => {
|
||||||
|
this.$nextTick(() => {
|
||||||
|
errorIndex.forEach(index => {
|
||||||
|
if (this.$refs[`ruleForm${index}`] && this.$refs[`ruleForm${index}`][0]) {
|
||||||
|
this.$refs[`ruleForm${index}`][0].validate()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
clearTimeout(timer)
|
||||||
|
timer = null
|
||||||
|
}, 100)
|
||||||
|
})
|
||||||
return false
|
return false
|
||||||
} else {
|
} else {
|
||||||
return true
|
return true
|
||||||
|
|||||||
+2
-3
@@ -1222,7 +1222,7 @@ export default {
|
|||||||
* @param record
|
* @param record
|
||||||
* @param index
|
* @param index
|
||||||
*/
|
*/
|
||||||
handleEvaluationFeedBackChange (value, record, index) {
|
handleEvaluationFeedBackChange (value, record) {
|
||||||
record.evaluationFeedback = value
|
record.evaluationFeedback = value
|
||||||
// 处理变化之后清空之前的数据
|
// 处理变化之后清空之前的数据
|
||||||
const extraFormKeys = Object.keys(this.extraForm)
|
const extraFormKeys = Object.keys(this.extraForm)
|
||||||
@@ -1236,7 +1236,6 @@ export default {
|
|||||||
for (const fieldName of deleteField) {
|
for (const fieldName of deleteField) {
|
||||||
delete record[fieldName]
|
delete record[fieldName]
|
||||||
}
|
}
|
||||||
this.$set(this.dataSource, index, record)
|
|
||||||
},
|
},
|
||||||
dealFormData () {
|
dealFormData () {
|
||||||
let formData = {}, basicTaskInfoDTO = {}, flag = true
|
let formData = {}, basicTaskInfoDTO = {}, flag = true
|
||||||
@@ -1526,7 +1525,7 @@ export default {
|
|||||||
obj.props.disabled = true
|
obj.props.disabled = true
|
||||||
}
|
}
|
||||||
return obj
|
return obj
|
||||||
},
|
}
|
||||||
|
|
||||||
},
|
},
|
||||||
beforeRouteLeave (to, form, next) {
|
beforeRouteLeave (to, form, next) {
|
||||||
|
|||||||
Reference in New Issue
Block a user