<template>
  <a-upload
    name="multipartFile"
    :action="actionUrl"
    :multiple="true"
    :file-list="fileList"
    :headers="headers"
    @change="handleChange"
  >
    <a-button type="primary" icon="upload" :loading="iconLoading">导入 </a-button>
  </a-upload>
</template>
<script>
export default {
   props: {
    actionUrl: {
      type: String
    }
  },
  data() {
    return {
      fileList: [],
      iconLoading: false,
      selectedRows: [],
      selectedRowKeys: [],
      headers: {},
      videoUrlList: []
    };
  },
  created() {
    this.headers = { Authorization: "Bearer" + sessionStorage.getItem('token')}
  },
  computed: {},
  methods: {
    handleChange(info, data) {
      // console.log('info===>', info, info.fileList);
      let { fileList } = info
      const status = info.file.status
      this.iconLoading = true
      if (status !== 'uploading') {
      }
      if (status === 'done') {
        this.videoUrlList.push({ uid: fileList[fileList.length - 1].uid, url: info.file.response.message })
        this.iconLoading = false
        this.$emit("handleChange", info, data)
        if (info.file.response.success) {
          this.$message.success(info.file.response.message)
          this.$emit("actionDone")
        } else {
          this.$message.error(info.file.response.message)
        }
      }

      this.fileList = [...fileList]
    },
  },
};
</script>
<style lang="less">
.ant-upload-list-text {
  display: none;
}
</style>