iview上传图片控制格式、文件大小、宽高

<template>
 <Upload id="Upload"
          ref="upload"
         :before-upload='beforeUpload'
         type="drag"
         action='#'
         style="display: inline-block;width:97px;">
          <div style="width: 97px;height:90px;line-height: 90px;"
               v-show="imageUrl == false">
                <Icon type="md-camera"
                      size="20"></Icon>
          </div>
          <div style="width: 97px;height:90px;line-height: 90px;"
               v-show="imageUrl == true">
               <img style='width:100%;height:100%'
                    :src="seriesImage"
                     alt="">
           </div>
  </Upload>
</template>

<script>
import gifLoading from ../assets/icon/loading.gif'
export default {
 data(){
    imageUrl: false,
    seriesImage: gifLoading,
    imgSize: 800,                               // 上传图片大小限制，单位 kb
    imgTypeArr: ["image/png", "image/jpg", "image/jpeg"],//上传图片类型限制
 },
 methods:{
    //上传文件之前钩子函数
    beforeUpload (res) {
      let that = this
      // 控制文件上传格式
      var imgType = this.imgTypeArr.indexOf(res.type) !== -1
      if (!imgType) {
        this.$Message.warning({
          content: '文件  ' + res.name + '  格式不正确, 请选择jpg或png.',
          duration: 5
        });
        return false
      }
      // 控制文件上传大小
      var Maxsize = res.size / 1024 < this.imgSize
      if (!Maxsize) {
        this.$Message.warning({
          content: '文件  ' + res.name + ' 体积过大, 最大不能超过800K.',
          duration: 5
        });
        return false
      }
      this.file = res
      this.checkImageWH(res, 750, 422)
      return false
    },
    //判断照片尺寸大小
    checkImageWH (file, width, height) {
      let self = this;
      return new Promise(function (resolve, reject) {
        let filereader = new FileReader();
        filereader.onload = e => {
          let src = e.target.result;
          var status = 0
          const image = new Image();
          image.onload = () => {
            if (width && image.width > width) {
              self.$Message.error(
                '高度不得大于' + width
              );
              status = -1
              reject();
            } else if (height && image.height > height) {
              self.$Message.error(
                '宽度不得大于' + height
              );
              status = -1
              reject();
            } else {
              resolve();
            }
            if (status == 0) {
              // 图片base64化   可以在这里设置路径预览图片
              self.DetailsObj.seriesImage = src;
            }
          };
          image.onerror = reject;
          image.src = src;
        };
        filereader.readAsDataURL(file);
      });
    },
 }
}
</script>

<style lang="scss" scoped>

</style>