导入文件取消

src/views/drFPTX/Index.vue

@@ -517,9 +517,9 @@ import axios from 'axios'
 export default {
   name: 'drFPTX',
   components: {},
-  mounted() {
+  mounted () {
   },
-  data() {
+  data () {
     return {
       successCount: 0, // 成功条数
       failCount: 0, // 失败条数
@@ -569,7 +569,7 @@ export default {
       expandedRight: null, // 左边表格展开关闭标志
     }
   },
-  created() {
+  created () {
     let w1 = 1920
     let w2 = window.innerWidth
 
@@ -578,7 +578,7 @@ export default {
     this.fptxWidth3 = this.fptxWidth3 * w2 / w1
   },
   watch: {
-    drlx(newValue, oldValue) {
+    drlx (newValue, oldValue) {
       if (newValue == 3) {
         this.targetHead = '人员逻辑分库'
         this.targets = this.$store.state.ljk.targetOptions_ry
@@ -626,7 +626,7 @@ export default {
   },
   methods: {
     // 展开或关闭行
-    hadnlExpandChange1(row, expanded) {
+    hadnlExpandChange1 (row, expanded) {
       // console.log(row, expanded, "zhankaiguanbi")
       // 获取下标
       var i = this.datas.findIndex((table) => table.wjxh === row.wjxh)
@@ -666,7 +666,7 @@ export default {
       }
     },
     // 展开或关闭行
-    hadnlExpandChange2(row, expanded) {
+    hadnlExpandChange2 (row, expanded) {
       // console.log(row, expanded, "zhankaiguanbi")
       // 获取下标
       var i = this.selectArr.findIndex((table) => table.wjxh === row.wjxh)
@@ -706,11 +706,11 @@ export default {
       }
     },
     // 判断能不能选择
-    checkSelectable(row) {
+    checkSelectable (row) {
       return row.sonBarcode
     },
     // 导入成功,跳转详情
-    goList() {
+    goList () {
       if (this.drlx == 3) {
         this.dialogVisible = false
 
@@ -764,10 +764,11 @@ export default {
       }
     },
     // 取消上传
-    abort() {
+    abort () {
       this.nowSelectRightData = []
       this.dialogVisible = false
       // this.cancel()
+      this.UploadPercent = 0
       fHttp.cancel()
 
       // this.$refs.upload.clearFiles();  // 清空上传列表
@@ -775,23 +776,12 @@ export default {
 
     },
     // 上传进度
-    uploadProcess(event, file, fileList) {
-      // //console.log(event)
+    uploadProcess (event, file, fileList) {
       this.dialogVisible = true
-      // this.UploadPercent = Number(file.percentage.toFixed(0));
-      // this.UploadPercent = Number(event.percent.toFixed())
-      // if (this.UploadPercent == 99) {
-      //   // this.dialogVisible = false;
-      //   // this.$refs.upload.clearFiles()
-      //   // this.nowSelectRightData = []
-      //   // this.showProgress = false;
-      //   return
-      // }
     },
     // 获取文件列表
-    onChange(file, fileList) {
+    onChange (file, fileList) {
       // console.log(file.raw, 2222233333)
-
       // 重复文件过滤
       let existFile = fileList.slice(0, fileList.length - 1).find(f => f.name === file.name)
       if (existFile) {
@@ -1014,10 +1004,10 @@ export default {
       }, 100)
     },
     // 提交前钩子函数
-    beforeUpload() {
+    beforeUpload () {
       // //console.log('数据liebiao', this.$refs.upload.uploadFiles)
     },
-    submitUpload() {
+    submitUpload () {
       if (this.nowSelectRightData.length == 0) {
         this.$message.error('请选择要上传的文件')
       } else {
@@ -1042,7 +1032,7 @@ export default {
 
     },
     // 上传文件函数
-    upload() {
+    upload () {
       let that = this
       // 创建一个空的FormData对象:
       const formData = new FormData()
@@ -1060,144 +1050,53 @@ export default {
       this.dialogVisible = true
       NetUtil.drFptx.upload(formData, this.drlx, (progressEvent) => {
         logger.info('11111111111')
-      }).then()
+        that.UploadPercent = Number((((progressEvent.loaded / 10 * 10) / progressEvent.total) * 100).toFixed(2))
+      }).then(res => {
+        if (res.code === 0) {
+          if (this.drlx == 3 || this.drlx == 6) {
+            this.successCount = res.ret.successCount
+            this.failCount = res.ret.failCount
+            this.showProgress = false;
+            this.checkedTargets = ['1']
+            this.selectArr = [] // 右边列表
+            this.datas = []// 左边表格数据项
+            this.nowSelectData = [] // 左边选中列表数据
+            this.nowSelectRightData = [] // 右边选中列表数据
+            this.UploadPercent = 0
+
+          } else if (this.drlx == 9) {
+            this.successCount = res.ret.successCount
+            this.failCount = res.ret.failCount
+            this.showProgress = false;
+
+
+            this.selectArr = [] // 右边列表
+            this.datas = []// 左边表格数据项
+            this.nowSelectData = [] // 左边选中列表数据
+            this.nowSelectRightData = [] // 右边选中列表数据
+            this.checkedTargetsLeft = ['1'] // 选定逻辑库
+            this.checkedTargetsRight = ['1'] // 选定逻辑库
+            this.UploadPercent = 0
+          }
+          // this.$refs.upload.clearFiles()
+          this.showProgress = false;
+        } else {
+          this.$message.error(res.data.message);
+          this.dialogVisible = false// 进度条弹窗
+          this.UploadPercent = 0
+        }
+      })
     },
-    // 上传文件函数
-    // upload () {
-    //   let that = this
-    //   // 创建一个空的FormData对象:
-    //   const formData = new FormData()
-    //   // 可以使用FormData.append来添加键/值对到表单里面；
-    //   this.nowSelectRightData.forEach((file) => {
-    //     formData.append('file', file.raw)
-    //   })
-    //   // 添加自定义参数，不传可删除
-    //   if (this.drlx == 3 || this.drlx == 6) {
-    //     formData.append('logicList', this.logicList)
-    //   } else if (this.drlx == 9) {
-    //     formData.append('logicPsnList', this.logicPsnList)
-    //     formData.append('logicCaseList', this.logicCaseList)
-    //   }
-    //   this.dialogVisible = true;
-    //   // this.$axios({
-    //   //   method: 'post',
-    //   //   url: this.action,
-    //   //   data: formData,
-    //   //   loading: false,
-    //   //   onUploadProgress: function (progressEvent) {
-    //   //     // this.dialogVisible = true;
-    //   //     //console.log(progressEvent, 1);
-    //   //     that.UploadPercent = Number((((progressEvent.loaded / 10 * 9.9) / progressEvent.total) * 100).toFixed(2))
-    //   //     //console.log(that.UploadPercent, 123)
-    //   //     // Number(event.percent.toFixed())
-    //   //   },
-
-    //   // }).then(res => {
-    //   //   if (res.data.code === 0) {
-    //   //     if (this.drlx == 3 || this.drlx == 6) {
-    //   //       this.successCount = res.data.ret.successCount
-    //   //       this.failCount = res.data.ret.failCount
-    //   //       this.showProgress = false;
-
-    //   //       this.selectArr = [] // 右边列表
-    //   //       this.datas = []// 左边表格数据项
-    //   //       this.nowSelectData = [] // 左边选中列表数据
-    //   //       this.nowSelectRightData = [] // 右边选中列表数据
-    //   //       this.logicList = [] // 目标逻辑库
-    //   //       this.UploadPercent = 0
-
-    //   //     } else if (this.drlx == 9) {
-    //   //       this.successCount = res.data.ret.successCount
-    //   //       this.failCount = res.data.ret.failCount
-    //   //       this.showProgress = false;
-
-
-    //   //       this.selectArr = [] // 右边列表
-    //   //       this.datas = []// 左边表格数据项
-    //   //       this.nowSelectData = [] // 左边选中列表数据
-    //   //       this.nowSelectRightData = [] // 右边选中列表数据
-    //   //       this.UploadPercent = 0
-    //   //     }
-    //   //     // this.$refs.upload.clearFiles()
-    //   //     this.showProgress = false;
-    //   //   } else {
-    //   //     this.$message.error(res.data.message);
-
-    //   //     this.dialogVisible = false// 进度条弹窗
-    //   //     this.UploadPercent = 0
-    //   //   }
-    //   // });
-    //   let CancelToken = axios.CancelToken
-    //   let self = this
-    //   axios({
-    //     method: 'post',
-    //     url: this.action,
-    //     data: formData,
-    //     loading: false,
-    //     cancelToken: new CancelToken(function executor (c) {
-    //       self.cancel = c
-    //       console.log(c)
-    //       // 这个参数 c 就是CancelToken构造函数里面自带的取消请求的函数，这里把该函数当参数用
-    //     }),
-    //     headers: {
-    //       Authorization: localStorage.getItem("token"),
-    //       BrowserHeader: 'H5'
-    //     },
-    //     onUploadProgress: function (progressEvent) {
-    //       that.UploadPercent = Number((((progressEvent.loaded / 10 * 10) / progressEvent.total) * 100).toFixed(2))
-    //     },
-    //   }).then(res => {
-    //     if (res.code === 0) {
-    //       if (this.drlx == 3 || this.drlx == 6) {
-    //         this.successCount = res.ret.successCount
-    //         this.failCount = res.ret.failCount
-    //         this.showProgress = false;
-    //         this.checkedTargets = ['1']
-    //         this.selectArr = [] // 右边列表
-    //         this.datas = []// 左边表格数据项
-    //         this.nowSelectData = [] // 左边选中列表数据
-    //         this.nowSelectRightData = [] // 右边选中列表数据
-    //         this.UploadPercent = 0
-
-    //       } else if (this.drlx == 9) {
-    //         this.successCount = res.ret.successCount
-    //         this.failCount = res.ret.failCount
-    //         this.showProgress = false;
-
-
-    //         this.selectArr = [] // 右边列表
-    //         this.datas = []// 左边表格数据项
-    //         this.nowSelectData = [] // 左边选中列表数据
-    //         this.nowSelectRightData = [] // 右边选中列表数据
-    //         this.checkedTargetsLeft = ['1'] // 选定逻辑库
-    //         this.checkedTargetsRight = ['1'] // 选定逻辑库
-    //         this.UploadPercent = 0
-    //       }
-    //       // this.$refs.upload.clearFiles()
-    //       this.showProgress = false;
-    //     } else {
-    //       this.$message.error(res.data.message);
-    //       this.dialogVisible = false// 进度条弹窗
-    //       this.UploadPercent = 0
-    //     }
-    //   });
-    //   //手速够快就不用写这个定时器了，点击取消获取就可以看到效果了
-    //   // setTimeout(function () {
-    //   //   //只要我们去调用了这个cancel()方法，没有完成请求的接口便会停止请求
-    //   //   self.cancel()
-    //   // }, 1000)
-
-    // },
     // 删除文件
-    handleRemove(file, fileList) {
+    handleRemove (file, fileList) {
       //console.log(file, fileList);
     },
     // 点击文件列表
-    handlePreview(file) {
+    handlePreview (file) {
       //console.log('上传文件', file);
     },
     // 上传成功
-    uploadSuccess(res) {
+    uploadSuccess (res) {
       if (this.drlx == 3 || this.drlx == 6) {
         this.successCount = res.ret.successCount
         this.failCount = res.ret.failCount
@@ -1209,14 +1108,14 @@ export default {
       this.showProgress = false
     },
     // 选择上传文件
-    uploadFile() {
+    uploadFile () {
       // this.$refs.file.dispatchEvent(new MouseEvent("click"));
       this.$refs['upload'].$children[0].$refs.input.webkitdirectory = false
       this.$refs['upload'].$children[0].$refs.input.accept = '.fptx'
       this.$refs['upload'].$children[0].$refs.input.click()
     },
     // 上传文件夹
-    uploadFiles() {
+    uploadFiles () {
       // //console.log(this.$refs['upload'].$children[0].$refs.input)
       this.$refs['upload'].$children[0].$refs.input.webkitdirectory = true
       this.$refs['upload'].$children[0].$refs.input.accept = '.fptx'
@@ -1230,15 +1129,15 @@ export default {
       //console.log(fileDic, 111222)
     },
     // 表格穿梭框
-    checkAll1(val) {
+    checkAll1 (val) {
       this.nowSelectData = val
     },
-    checkRightAll(val) {
+    checkRightAll (val) {
       // //console.log('val111', val)
       this.nowSelectRightData = val
     },
     // 选中
-    handelSelect() {
+    handelSelect () {
 
       // let self = this
 
@@ -1270,17 +1169,17 @@ export default {
       this.nowSelectData = []
     },
     // 取消
-    handleRemoveSelect() {
+    handleRemoveSelect () {
       this.datas = this.handleConcatArr(this.datas, this.nowSelectRightData)
       this.handleRemoveTabList(this.nowSelectRightData, this.selectArr)
       this.nowSelectRightData = []
     },
-    handleConcatArr(selectArr, nowSelectData) {
+    handleConcatArr (selectArr, nowSelectData) {
       let arr = []
       arr = arr.concat(selectArr, nowSelectData)
       return arr
     },
-    handleRemoveTabList(isNeedArr, originalArr) {
+    handleRemoveTabList (isNeedArr, originalArr) {
       if (isNeedArr.length && originalArr.length) {
         for (let i = 0; i < isNeedArr.length; i++) {
           for (let k = 0; k < originalArr.length; k++) {
@@ -1293,7 +1192,7 @@ export default {
     }
   },
   filters: {
-    typeNum(val) {
+    typeNum (val) {
       //console.log(val);
       // if (!val) return;
       const data = {
@@ -1306,7 +1205,7 @@ export default {
     }
   },
   computed: {
-    roleArr() {
+    roleArr () {
       return this.$store.state.layout.Menu
     }
   },
@@ -1315,7 +1214,7 @@ export default {
 
 <!--table树-->
 <style scoped lang="scss">
-    /deep/ .children-count {
+/deep/ .children-count {
   width: 34px;
   font-size: 12px;
   text-align: center;
@@ -1325,25 +1224,25 @@ export default {
   right: 10px;
   top: 50%;
   transform: translate(0, -50%);
-    }
+}
 
-    .el-tree /deep/ .el-tree-node__expand-icon.expanded {
+.el-tree /deep/ .el-tree-node__expand-icon.expanded {
   -webkit-transform: rotate(0deg);
   transform: rotate(0deg);
-    }
+}
 
-    /*有子节点 且未展开*/
-    .el-table /deep/ .el-icon-arrow-right:before {
+/*有子节点 且未展开*/
+.el-table /deep/ .el-icon-arrow-right:before {
   content: "";
   display: block;
   width: 16px;
   height: 16px;
   font-size: 16px;
   background-size: 16px;
-    }
+}
 
-    /*有子节点 且已展开*/
-    .el-table /deep/ .el-table__expand-icon--expanded {
+/*有子节点 且已展开*/
+.el-table /deep/ .el-table__expand-icon--expanded {
   .el-icon-arrow-right:before {
     content: "";
     display: block;
@@ -1352,10 +1251,10 @@ export default {
     font-size: 18px;
     background-size: 21px;
   }
-    }
+}
 
-    /*没有子节点*/
-    .el-tree
+/*没有子节点*/
+.el-tree
   /deep/
   .el-tree-node__expand-icon.is-leaf::before
   .el-table
@@ -1368,14 +1267,14 @@ export default {
   height: 18px;
   font-size: 16px;
   background-size: 16px;
-    }
+}
 
-    /deep/ .el-table--enable-row-hover .el-table__body tr:hover {
+/deep/ .el-table--enable-row-hover .el-table__body tr:hover {
   cursor: pointer;
-    }
+}
 </style>
 <style lang="scss">
-    .el-table__expand-icon {
+.el-table__expand-icon {
   .el-icon-arrow-right {
     cursor: pointer !important;
   }
@@ -1394,9 +1293,9 @@ export default {
   background-position: center;
   background-size: 11px;
   background-repeat: no-repeat;
-    }
+}
 
-    .el-table__expand-icon.el-table__expand-icon--expanded {
+.el-table__expand-icon.el-table__expand-icon--expanded {
   width: 11px;
   height: 11px;
   background-image: url("../../assets/img/confirm/shrink.png");
@@ -1404,15 +1303,15 @@ export default {
   background-size: 11px;
   background-repeat: no-repeat;
   transform: rotate(180deg) !important;
-    }
+}
 </style>
 <style lang="scss" scoped>
-    // /deep/.el-dialog__wrapper {
-    //   background: rgba($color: #fff, $alpha: 0.65);
-    //   // filter: blur(2px);
-    // }
+// /deep/.el-dialog__wrapper {
+//   background: rgba($color: #fff, $alpha: 0.65);
+//   // filter: blur(2px);
+// }
 
-    /deep/ .el-dialog {
+/deep/ .el-dialog {
   margin-top: 30vh;
 
   .el-button {
@@ -1424,45 +1323,45 @@ export default {
   .el-button:hover {
     color: #055fe7;
   }
-    }
+}
 
-    /deep/ .el-dialog__header {
+/deep/ .el-dialog__header {
   display: none;
-    }
+}
 
-    /deep/ .el-dialog__body {
+/deep/ .el-dialog__body {
   text-align: center;
-    }
+}
 
-    /deep/ .el-checkbox__input.is-checked .el-checkbox__inner,
-    .el-checkbox__input.is-indeterminate .el-checkbox__inner {
+/deep/ .el-checkbox__input.is-checked .el-checkbox__inner,
+.el-checkbox__input.is-indeterminate .el-checkbox__inner {
   background-color: #055fe7;
   border-color: #055fe7;
-    }
+}
 
-    /deep/ .el-checkbox__input.is-checked .el-checkbox__inner,
-    /deep/ .el-checkbox__input.is-indeterminate .el-checkbox__inner {
+/deep/ .el-checkbox__input.is-checked .el-checkbox__inner,
+/deep/ .el-checkbox__input.is-indeterminate .el-checkbox__inner {
   background-color: #055fe7;
   border-color: #055fe7;
-    }
+}
 
-    /deep/ .el-checkbox__input.is-checked + .el-checkbox__label {
+/deep/ .el-checkbox__input.is-checked + .el-checkbox__label {
   color: #333333;
-    }
+}
 
-    /deep/ .el-table.el-table--fit.el-table--enable-row-hover {
+/deep/ .el-table.el-table--fit.el-table--enable-row-hover {
   height: 501px !important;
-    }
+}
 
-    /deep/ .el-table__body-wrapper.is-scrolling-none {
+/deep/ .el-table__body-wrapper.is-scrolling-none {
   height: 499px !important;
-    }
+}
 
-    .drFPTX {
+.drFPTX {
   padding: 25px;
-    }
+}
 
-    .drlx .el-radio {
+.drlx .el-radio {
   width: 86px;
   height: 32px;
   line-height: 32px;
@@ -1481,17 +1380,17 @@ export default {
   /deep/ .el-radio__input.is-checked + .el-radio__label {
     color: #055fe7;
   }
-    }
+}
 
-    /deep/ .drlx .is-checked {
+/deep/ .drlx .is-checked {
   background: #ddebff;
-    }
+}
 
-    .drlx /deep/ .el-radio__input {
+.drlx /deep/ .el-radio__input {
   display: none;
-    }
+}
 
-    .choose {
+.choose {
   width: 100%;
   display: flex;
   justify-content: space-between;
@@ -1574,16 +1473,16 @@ export default {
     border-radius: 4px;
     padding: 0;
   }
-    }
+}
 
-    .divider {
+.divider {
   width: 100%;
   height: 1px;
   background: #eeeeee;
   margin: 20px 0;
-    }
+}
 
-    .bottom {
+.bottom {
   display: flex;
 
   .left {
@@ -1710,9 +1609,9 @@ export default {
       }
     }
   }
-    }
+}
 
-    .bdbottom {
+.bdbottom {
   display: flex;
 
   .left {
@@ -1873,5 +1772,5 @@ export default {
       }
     }
   }
-    }
+}
 </style>