亚洲精品亚洲人成在线观看麻豆,在线欧美视频一区,亚洲国产精品一区二区动图,色综合久久丁香婷婷

              當前位置:首頁 > IT技術(shù) > Web編程 > 正文

              vue elementui 文件導(dǎo)入/文件上傳/文件下載
              2021-10-15 15:02:47

              文件導(dǎo)入

               <el-upload style="display:inline-block"
                                class="upload-demo" :action="`/admin/upload/excle/purchase/plan/material/upload`"
                                :headers="myHeaders" :on-success="handleAvatarSuccess"
                                v-loading="loading2"
                                :on-error="handleAvatarError" :with-credentials="true"
                                :disabled="isfinish"
                                :on-change="uploadeStatus"
                                :show-file-list="false">
                                <el-button type="success" :disabled="isfinish">導(dǎo)入商品</el-button>
               </el-upload>
              action--------接口地址
              data
                loading2: false,
                    isfinish: false,
                    selectedGoodslist: [],
                       myHeaders: {
                     'userId': localStorage.getItem('userId'),
                     'token': localStorage.getItem('token')
                    },

              method

                uploadeStatus () {
                    this.isfinish = !this.isfinish
                    this.loading2 = !this.loading2
                  },
                    handleAvatarSuccess (res, file, fileList) {
                    console.log(fileList)
                      if (res.code != 200) {
                          if (res.data != null) {
                              this.$alert(`導(dǎo)入失敗,${res.data}`, '系統(tǒng)通知', { confirmButtonText: '確定', type: 'error' })
                          } else {
                              this.$alert(`導(dǎo)入失敗,${res.msg}`, '系統(tǒng)通知', { confirmButtonText: '確定', type: 'error' })
                              fileList = []
                              return false
                          }
                      } else {
                          this.errorList = res.data.errorList
                          this.errorListSize = res.data.errorListSize
                          this.successList = res.data.successList
                          this.successListSize = res.data.successListSize
                          this.loseStr = res.data.errorList.toString()
                          this.successStr = res.data.successList.toString()
                          this.$alert(`導(dǎo)入成功`, '系統(tǒng)通知', { confirmButtonText: '確定', type: 'success' })
              
              
              
              
                        // let allArr=fileList[0].response.data.successList;
                         let allArr=this.successList;
              
                         console.log("allArr")
                        console.log(allArr)
              
                        let goodsRedeemCodes = [];
                        let goodsRedeemCodesErro = this.goodsRedeemCodesErro;
                        let reg=/^[A-Za-z0-9]{4,30}$/;
              
                        allArr.map(item => {
                              if(goodsRedeemCodes.indexOf(item)==-1&&reg.test(item)&&this.goodsRedeemCodes.indexOf(item)==-1){
                                  goodsRedeemCodes.push(item);
              
                              }else{
                                goodsRedeemCodesErro.push(item)
              
                              }
              
                         });
              
                        this.goodsRedeemCodes=this.goodsRedeemCodes.concat(goodsRedeemCodes);
                        this.goodsRedeemCodesErro=goodsRedeemCodesErro;
                        this.ruleForm.stock=this.goodsRedeemCodes.length;
              
              
                      }
                    },
                    handleAvatarError (res) {
                        this.$alert(`導(dǎo)入失敗,${res.msg}`, '系統(tǒng)通知', { confirmButtonText: '知道了', type: 'error' })
                    },

              文件下載

              前端實現(xiàn)下載功能

               let obj = {}
                      templateDownLoad(obj)
                      .then(res => {
                        this.loading1 = false;
                        const content = res;
                        const blob = new Blob([content]);
                        const fileName = "模板.xlsx";
                        if ("download" in document.createElement("a")) {
                          // 非IE下載
                          const elink = document.createElement("a");
                          elink.download = fileName;
                          elink.style.display = "none";
                          elink.href = URL.createObjectURL(blob);
                          document.body.appendChild(elink);
                          elink.click();
                          URL.revokeObjectURL(elink.href); // 釋放URL 對象
                          document.body.removeChild(elink);
                        } else {
                          // IE10+下載
                          navigator.msSaveBlob(blob, fileName);
                        }
                      })
                      .catch(res => {
                        this.loading1 = false;
                      });
              export?function?templateDownLoad(obj)?{
              ??return?request({
              ????url:?`/admin/download/purcahse/template`,
              ????method:?'post',
              ????data:?obj,
              ????responseType:?'arraybuffer'
              ??})
              }

              本文摘自 :https://www.cnblogs.com/

              開通會員,享受整站包年服務(wù)立即開通 >