<template>
  <div class="file-contain">
    <div class="title">
      <span>相关附件</span>
    </div>
    <div class="file-wrap">
      <van-uploader v-model="fileList"
                    accept="image/*,.doc,.docx,.pdf,.msg,.xlsx,xls,.ppt,.pptx,"
                    :after-read="afterRead"
                    multiple
                    :max-count="maxcount" />
    </div>
  </div>
</template>

<script>
export default {
  name: 'upload-file',

  mounted () {

  },
  methods: {
    afterRead (file) {
      debugger
      let formData = new FormData()
      let files = []
      this.fileList.forEach((item, i) => {
        formData.append('file', item.file)
      })
      formData.append('busSystem', this.sysId)
      formData.append('busModel', this.buinessId)
      formData.append('userName', this.uid)
      console.log(formData.getAll('file'))

      let headers = { 'Content-Type': 'multiplart/form-data' }

      this.$axios.post({
        domain: 'attachUrl',
        url: 'uploadFile',
        data: formData,
        headers: headers,
        isShow: true,
        requestType: 'form',
        success: (res) => {
          debugger
          if (res.errorCode === 200) {

          } else {
            this.$toast.fail(res.msg)
          }
          console.log(res)
        },
        error: (err) => {
          this.$toast.fail(err)
        },
        complete: () => {

        }

      })
    }
  },
  computed: {

  },
  props: {
    sysId: { // //所属系统
      type: String,
      default: 'cloud-crm-project'
    },
    buinessId: { // 业务ID
      type: String,
      default: 'def',
      required: false
    },
    uid: { // 用户账号
      type: String,
      default: 'def',
      required: false
    },
    maxcount: { // 文件最大上传个数
      type: Number,
      default: 10
    }
  },
  data () {
    return {
      fileList: []
    }
  }

}
</script>

<style type="text/css" scoped lang="scss">
.file-contain {
  border: 1px solid #ddd;
  padding: 15px 20px;
  margin: 20px 0;
  .file-wrap {
    padding: 10px 0;
  }
}
</style>
<style type="text/css"  lang="scss">
.file-contain {
  .file-wrap {
    padding: 10px 0;
  }
  .van-uploader__upload,
  .van-uploader__preview {
    width: 200px;
    height: 200px;
  }
}
</style>
