vue下载以及上传base64位上传

 <div
                    class="img_border"
                    v-if="!fileOkImgName"
                    @click="okFileClick('ok')"
                  >
  <input
                      style="display:none"
                      type="file"
                      id="okUploadFile"
                      v-on:change="okReadLocalFile('ok')"
                    />
<el-button > 下载</el-button>

data:() {
	retrun {
	fileOkImgName: null,
	}
},
methods: {
  /**
     * 下载
     */
    download() {
      let a = document.createElement("a");
      // a.href = 'http://10.172.225.59/file_store/description/20200925/97a073f72f9443a5b802339ca938f8a3.xlsx';
      a.href = `${this.$store.state.settings.HttpHost}/${
        this.fileObject.fileAll
      }`;
      a.click();
    },


    // 图片click
    okFileClick(type) {
      if (type === "ok") {
        // ok图片
        document.getElementById("okUploadFile").click();
      } else if ("no") {
        // on图片
        document.getElementById("noUploadFile").click();
      }
    },
    
    /**
     * 图片上传
     * @base64 base64位
     * @module 模块名
     * @type 类型 1.图片 2.附件
     * @filename 上传名字
     * @types 上传类型 Ok NO
     */
    UploadFile(params, types) {
      this.$store
        .dispatch("description/UploadImgFile", params)
        .then(res => {
          if (types === "ok") {
            this.fileOkImgName = res.msg;
            this.ruleForm.OKPart = res.data;
          } else if (types === "no") {
            this.fileFailureImgName = res.msg;
            this.ruleForm.NOKPart = res.data;
          } else if (types === "allFile") {
            this.ruleForm.OptionaLAsAppendix = res.data;
            this.fileObject.fileAll = res.msg;
            this.fileObject.fileType = type; // 附件类型 1图片 5附件
          }
        })
        .catch(error => {
          // console.log(error);
        });
    },

   // 点击选择文件
    okReadLocalFile: function(type) {
      var that = this;
      var localFile = null;
      if (type === "ok") {
        localFile = document.getElementById("okUploadFile").files[0];
      } else if (type === "no") {
        localFile = document.getElementById("noUploadFile").files[0];
      }
      if (!!localFile) {
        var filepath = localFile.name;
        var fileend = filepath.substring(filepath.indexOf(".")).toLowerCase();
        if (fileend == ".jpg" || fileend == ".png") {
          // base64
          var reader = new FileReader();
          reader.readAsDataURL(localFile);
          let params = {
            base64: null,
            module: null,
            type: 1,
            filename: null
          };
          reader.onload = function(e) {
            // 读取到的图片base64 数据编码 将此编码字符串传给后台即可
            if (type === "ok") {
              let result = e.target.result
                .substring(e.target.result.indexOf("base64,"))
                .substring(7);
              params = {
                base64: result,
                module: "description",
                type: 1,
                filename: filepath
              };
              that.UploadFile(params, "ok");
            } else if (type === "no") {
              let result = e.target.result
                .substring(e.target.result.indexOf("base64,"))
                .substring(7);
              params = {
                base64: result,
                module: "description",
                type: 1,
                filename: filepath
              };
              that.UploadFile(params, "no");
            }
          };
          return;
        } else {
          that.$message({
            message: "file type : .jpg .png",
            type: "warning"
          });
          document.getElementById("okUploadFile").value = ''
          return;
        }
      }
    },
}