update dialog: 多上传组件分流

This commit is contained in:
g7hoo 2022-08-16 14:36:25 +08:00
parent 535004719c
commit 23e508916e
2 changed files with 43 additions and 10 deletions

View File

@ -45,10 +45,16 @@
<!-- extra components , like Markdown or RichEdit --> <!-- extra components , like Markdown or RichEdit -->
<template v-if="configs.extraComponents && configs.extraComponents.length > 0"> <template v-if="configs.extraComponents && configs.extraComponents.length > 0">
<el-form-item v-for="ec in configs.extraComponents" :key="ec.name" :label="ec.label" class="extra-components"> <el-form-item v-for="(ec, index) in configs.extraComponents" :key="ec.name + index" :label="ec.label" class="extra-components">
<component style="margin-top: 40px;" v-if="ec.hasModel" :is="ec.component" v-bind="ec.props" v-model="dataForm[ec.name]" @ready="handleEditorReady" /> <component style="margin-top: 40px;" v-if="ec.hasModel" :is="ec.component" v-bind="ec.props" v-model="dataForm[ec.name]" @ready="handleEditorReady" />
<!-- <component v-if="ec.hasModel" :is="ec.component" v-bind="ec.props" v-model="dataForm[ec.name]" /> --> <!-- <component v-if="ec.hasModel" :is="ec.component" v-bind="ec.props" v-model="dataForm[ec.name]" /> -->
<component v-else :is="ec.component" v-bind="ec.props" @uploader-update-filelist="handleUploadListUpdate" :uploader-inject-file-list="dataForm.files" /> <component
v-else
:is="ec.component"
v-bind="ec.props"
@uploader-update-filelist="handleUploadListUpdate($event, ec.props.extraParams.typeCode)"
:uploader-inject-file-list="dataForm.files"
/>
</el-form-item> </el-form-item>
</template> </template>
</el-form> </el-form>
@ -167,7 +173,8 @@ export default {
dataForm: {}, dataForm: {},
dataFormRules: {}, dataFormRules: {},
tempForm: [], // code tempForm: [], // code
shouldWait: null shouldWait: null,
fileForm: {} // typeCode
} }
}, },
computed: { computed: {
@ -373,6 +380,21 @@ export default {
/** 需要验证表单的操作 */ /** 需要验证表单的操作 */
this.$refs['dataForm'].validate(valid => { this.$refs['dataForm'].validate(valid => {
if (valid) { if (valid) {
/** 对于文件上传的单独处理(合并处理) */
if (Object.keys(this.fileForm).length) {
console.log('fileform 有值')
// LABEL: FILE_RELATED
let fileIds = []
for (const [key, item] of Object.entries(this.fileForm)) {
if (Array.isArray(item)) {
fileIds = fileIds.concat(item)
} else {
console.error('handleClick(): 上传文件数组类型不正确')
}
}
this.$set(this.dataForm, 'fileIds', fileIds)
}
console.log('before send: ', this.dataForm) console.log('before send: ', this.dataForm)
this.$http({ this.$http({
@ -422,14 +444,25 @@ export default {
} }
}, },
handleUploadListUpdate(filelist) { // LABEL: FILE_RELATED
// dataForm handleUploadListUpdate(filelist, typeCode = 'DefaultTypeCode') {
// typeCode: EquipmentTypeFile
// typeCode: EquipmentInfoFile | EquipmentInfoImage
// dataForm
// this.$set(
// this.dataForm,
// 'fileIds',
// filelist.map(item => item.id)
// )
// console.log('handleUploadListUpdate(): ', this.dataForm)
//
this.$set( this.$set(
this.dataForm, this.fileForm,
'fileIds', typeCode,
filelist.map(item => item.id) filelist.map(item => item.id)
) )
console.log('handleUploadListUpdate(): ', this.dataForm) console.log('handleUploadListUpdate(): ', this.fileForm)
}, },
handleClose() { handleClose() {

View File

@ -100,7 +100,7 @@ const addOrUpdateConfigs = {
props: { props: {
// props // props
url: '/monitoring/attachment/uploadFileFormData', url: '/monitoring/attachment/uploadFileFormData',
extraParams: { typeCode: 'EquipmentTypeFile' }, extraParams: { typeCode: 'EquipmentInfoFile' },
buttonContent: '点击上传', buttonContent: '点击上传',
tip: '上传文件大小不要超过 2mb (2048kb)' tip: '上传文件大小不要超过 2mb (2048kb)'
}, },
@ -117,7 +117,7 @@ const addOrUpdateConfigs = {
props: { props: {
// props // props
url: '/monitoring/attachment/uploadFileFormData', url: '/monitoring/attachment/uploadFileFormData',
extraParams: { typeCode: 'EquipmentTypeImage' }, extraParams: { typeCode: 'EquipmentInfoImage' },
buttonContent: '点击上传', buttonContent: '点击上传',
tip: '上传文件大小不要超过 2mb (2048kb)' tip: '上传文件大小不要超过 2mb (2048kb)'
}, },