拖拽加点击实现多文件上传

let that = this
new dragUpload({
  dragBox : '#drag_image'
});
function dragUpload(obj){
  var $dragBox = $(obj.dragBox),//jQuery对象
    JdragBox = $dragBox[0];//原生对象
  //阻止浏览器默认行。
  $(document).on({
    dragleave:function(e){//拖离
      e.preventDefault();
    },
    drop:function(e){//拖后放
      e.preventDefault();
    },
    dragenter:function(e){//拖进
      e.preventDefault();
    },
    dragover:function(e){//拖来拖去
      e.preventDefault();
    }
  });

  var dropper = document.getElementById("drag_image");
  dropper.ondragenter = function (e) {
    e.preventDefault();
  };
  dropper.ondragover = function (e) {
    e.preventDefault();
  };
  dropper.ondragleave = function (e) {

    e.preventDefault();
  };
  //携带目标释放
  JdragBox.addEventListener('drop', function(e){
    var fileList = e.dataTransfer.files;//获取文件对象
    //如果没有文件，直接结束方法
    if( fileList.length <= 0 ){
      return fasle;
    }else{
      uploadImage(fileList)
    }
  },false);
}
$('.upload-input').change(function (e) {
  uploadImage(e.target.files)
})
function uploadImage(fileObj) {
  let filepicTmp = []
  let filetypeArr = []
  for(let i = 0; i< fileObj.length; i++) {
    let obj = fileObj[i]
    let fileType = obj.type;
    let name = obj.name.slice(0, obj.name.lastIndexOf('.')) + '-1'
    let type = obj.name.slice(obj.name.lastIndexOf('.'))
    console.log(name)
    filepicTmp.push({
      picbefore: '',
      picafter: '',
      file: fileObj[i],
      stylefile: '',
      name: name,
      type: type
    })
    var reader = new FileReader();
    reader.readAsDataURL(obj)
    reader.onload = function (e) {    //成功读取文件
      let file = e.target.result
      filepicTmp[i].picbefore = file
    };
    filetypeArr.push(fileType)
  }
  //检查类型
  if(!/jpeg|png/i.test(filetypeArr.toString())){
    that.$message({
      showClose: true,
      message: '请上传正确的文件类型',
      type: 'warning'
    })
    return false;
  }
  that.fileList = that.fileList.concat(filepicTmp)
}