Complete cancelling uploading feature

src/api/attachment.js

@@ -31,18 +31,14 @@ attachmentApi.CancelToken = axios.CancelToken
 attachmentApi.isCancel = axios.isCancel
 
 attachmentApi.upload = (formData, uploadProgress, cancelToken) => {
-  return service(
+  return service({
-    {
+    url: `${baseUrl}/upload`,
-      url: `${baseUrl}/upload`,
+    timeout: 8640000, // 24 hours
-      timeout: 8640000, // 24 hours
+    data: formData, // form data
-      data: formData, // form data
+    onUploadProgress: uploadProgress,
-      onUploadProgress: uploadProgress,
+    cancelToken: cancelToken,
-      method: 'post'
+    method: 'post'
-    },
+  })
-    {
-      cancelToken: cancelToken
-    }
-  )
 }
 
 export default attachmentApi

src/utils/service.js

@@ -29,6 +29,12 @@ service.interceptors.response.use(
   },
   error => {
     NProgress.done()
+
+    if (axios.isCancel(error)) {
+      Vue.$log.debug('Cancelled uploading by user.')
+      return Promise.reject(error)
+    }
+
     Vue.$log.error('Response failed', error)
 
     const response = error.response

src/views/attachment/AttachmentList.vue

@@ -127,6 +127,7 @@
 import { PageView } from '@/layouts'
 import { mixin, mixinDevice } from '@/utils/mixin.js'
 import attachmentApi from '@/api/attachment'
+import axios from 'axios'
 export default {
   components: {
     PageView
@@ -226,7 +227,7 @@ export default {
     },
     handleUpload(option) {
       this.$log.debug('Uploading option', option)
-      const CancelToken = attachmentApi.CancelToken
+      const CancelToken = axios.CancelToken
       const source = CancelToken.source()
 
       const data = new FormData()