文件導(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&®.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' }) },
文件下載
前端實(shí)現(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/