<template>
  <div class="upload-widget">
    <el-upload
      :headers="headers"
      :data="dataObj"
      :multiple="false"
      :show-file-list="false"
      :file-list="item"
      :on-success="handleImageSuccess"
      class="upload-uploader"
      :action="action"
    >
      <img v-if="src" class="upload-images" :src="src" />
      <div
        v-else
        slot="trigger"
        class="upload-btn"
      >
        <i class="el-icon-upload"></i>
        <span class="upload-title">选择图片</span>
      </div>
    </el-upload>
  </div>
</template>
<script>
import db from '@/utils/localstorage'
import { Upload } from 'element-ui'
export default {
  components: {
    'el-upload': Upload
  },
  props: {
    item: {
      type: Array,
      default() {
        return []
      }
    },
    src: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      headers: {
        Authorization: ''
      },
      action: `${process.env.VUE_APP_DEV_REQUEST_DOMAIN_PREFIX}/file/upload`,
      dataObj: {
        folderId: 1
      }
    }
  },
  created() {
    this.headers.token = 'Bearer ' + db.get('TOKEN', '')
    this.headers.tenant = 'MDAwMA=='
  },
  methods: {
    handleImageSuccess(response, file, fileList) {
      ((response, file, fileList) => {
        this.$emit('success', response, file, fileList )
      })(response, file, fileList )
    }
  }
}
</script>
