jinlin
2024-01-02 adc8607684261c94b71bc17c1994ada4612a9a9d
web/src/components/table-uploader/src/table-uploader.vue
@@ -1,25 +1,12 @@
<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>
@@ -60,18 +47,20 @@
          ...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 => {
@@ -91,10 +80,14 @@
    },
    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)
          })
        }
      })
    },
@@ -109,8 +102,17 @@
}
</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;