<template>
   <cube-upload
    ref="upload"
    v-model="files"
    :action="action"
    @file-success="successHandler"
    @file-removed="removeHandler"
    @files-added="addedHandler"
    @file-error="errHandler"
>
    <div class="clear-fix">
      <cube-upload-file v-for="(file, i) in files" :file="file" :key="i"/>
      <cube-upload-btn :multiple="false">
        <div style="color:#E58E45;">
           <svg class="icon icon-add" aria-hidden="true">
               <use xlink:href="#icon-xinzeng"/>
           </svg>
          <p>点击上传</p>
        </div>
      </cube-upload-btn>
    </div>
  </cube-upload>
</template>

<script>
//import { mapState } from 'vuex'
import api from "@/api/index.js";
export default {
  name: "this",
  props: ["imgType"],
  components: {
    //addPane
  },
  computed: {
    // ...mapState({
          
    // })
  },
  mounted() {
      
  },
  data: function(){
    return {
      action: {
        target: api.getURL("uploader/safeUpload"),
        data: {
          inputId: "file"
        }
      },
      files: []
    };
  },
  methods: {
    addedHandler() {
      // const file = this.files[0]
      // file && this.$refs.upload.removeFile(file)
    },
    successHandler(file) {
      
      this.$emit("updateFiles", file, this.imgType, true);
    },
    removeHandler(file) {
      
      this.$emit("updateFiles", file, this.imgType, false);
    },
    errHandler(file) {
      // const msg = file.response.message
      this.$createToast({
        type: "warn",
        txt: "上传失败",
        time: 2000
      }).show();
    }
  }
};
</script>
<style scoped lang='less'>
    .icon-add {
      font-size: 27.12px;
    }
</style>