| | |
| | | <template> |
| | | <div> |
| | | <div class="config-uploader" > |
| | | <div class="config-uploader1" v-if="oss"> |
| | | <div v-for="group in (oss.groups || [])" :key="group.busiFieldGroup"> |
| | | <zt-form-item v-for="field in group.fields" :prop="field.busiField" |
| | | :key="field.busiField" :rules="field.isRequired ? 'required':''" style="width: 100%;margin-bottom: 0"> |
| | | <zt-uploader v-model="dataForm[field.busiField]" multiple :limit="field.fileLimit" :file-type="field.fileType" |
| | | :accept="field.accept" :file-size="field.fileSize" @input="change(field.busiField)"/> |
| | | </zt-form-item> |
| | | <!-- <el-table :data="group.fields" :show-header="false">--> |
| | | <!-- <el-table-column width="250" style="text-align: left;white-space:nowrap;">--> |
| | | <!-- <template slot-scope="scope">--> |
| | | <!-- <span v-html="scope.row.busiFieldName"></span>--> |
| | | <!-- </template>--> |
| | | <!-- </el-table-column>--> |
| | | <!-- <el-table-column align="left">--> |
| | | <!-- <template slot-scope="scope">--> |
| | | <!-- <zt-uploader v-model="dataForm[scope.row.busiField]" multiple :limit="scope.row.fileLimit" :file-type="scope.row.fileType"--> |
| | | <!-- :accept="scope.row.accept" :file-size="scope.row.fileSize" @getUploaderImg="getUploaderImg" @input="change(scope.row.busiField)"/>--> |
| | | <!-- </template>--> |
| | | <!-- </el-table-column>--> |
| | | <!-- </el-table>--> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | ...this.getOss(), |
| | | ...(val || {}) |
| | | } |
| | | console.log(this.oss,"this.oss") |
| | | // this.dataForm.files = this.oss |
| | | this.$set(this.dataForm, 'files', this.oss) |
| | | |
| | | // 分解到每个字段给dataForm赋值 |
| | | this.fields.forEach(field => { |
| | | // this.dataForm[field.busiField] = field.files |
| | | this.$set(this.dataForm, field.busiField, field.files) |
| | | }) |
| | | console.log(this.dataForm,'this.dataForm') |
| | | } |
| | | } |
| | | }, |
| | | mounted() { |
| | | |
| | | this.oss = this.getOss() |
| | | if (this.oss) { |
| | | this.oss.groups.forEach(group => { |
| | |
| | | }, |
| | | change(busiField) { |
| | | console.log(busiField,'busiField busiField') |
| | | |
| | | this.fields.forEach(field => { |
| | | if (field.busiField === busiField) { |
| | | field.files.length = 0 |
| | | this.dataForm[busiField].forEach(file => field.files.push(file)) |
| | | this.dataForm[busiField].forEach(file => { |
| | | console.log(file,"change file") |
| | | field.files.push(file) |
| | | }) |
| | | } |
| | | }) |
| | | }, |
| | |
| | | } |
| | | </script> |
| | | <style> |
| | | .config-uploader label { |
| | | width: 260px !important; |
| | | .config-uploader1 label { |
| | | width: 30px !important; |
| | | } |
| | | .config-uploader1 a{ |
| | | overflow: hidden; |
| | | text-overflow: ellipsis; |
| | | white-space: nowrap; |
| | | width: 180px; |
| | | } |
| | | .config-uploader1 .zt-upload { |
| | | line-height: 0; |
| | | } |
| | | .zt .el-upload-list__item .el-progress{ |
| | | top:15px !important; |