From 7cc49bc907e4d935cf6860b4e16260ec899b3045 Mon Sep 17 00:00:00 2001
From: fit2bot <68588906+fit2bot@users.noreply.github.com>
Date: Thu, 5 Nov 2020 10:50:38 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E6=B7=BB=E5=8A=A0Tree=E5=8A=A0=E8=BD=BD?=
 =?UTF-8?q?=E9=87=8D=E8=AF=95=E7=BB=84=E4=BB=B6=20(#477)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* fix: 添加409错误信息

* fix(perms): 用户授权树重建冲突时弹出提示信息，并保留之前的树

* fix: 添加Tree加载重试组件

Co-authored-by: Orange <orangemtony@gmail.com>
---
 package.json                                  |  1 +
 .../DataZTree/components/ZTree/index.vue      | 32 ++++++++++++++++---
 src/i18n/langs/cn.json                        |  1 +
 src/i18n/langs/en.json                        |  1 +
 src/utils/request.js                          | 10 ++++++
 5 files changed, 40 insertions(+), 5 deletions(-)

diff --git a/package.json b/package.json
index b79007184..bd9f4695f 100644
--- a/package.json
+++ b/package.json
@@ -20,6 +20,7 @@
   "dependencies": {
     "@ztree/ztree_v3": "3.5.44",
     "axios": "0.18.1",
+    "axios-retry": "^3.1.9",
     "deepmerge": "^4.2.2",
     "echarts": "^4.7.0",
     "element-ui": "2.13.2",
diff --git a/src/components/DataZTree/components/ZTree/index.vue b/src/components/DataZTree/components/ZTree/index.vue
index 5e7147e97..4dc65acc2 100644
--- a/src/components/DataZTree/components/ZTree/index.vue
+++ b/src/components/DataZTree/components/ZTree/index.vue
@@ -1,6 +1,9 @@
 <template>
   <div>
-    <div class="treebox">
+    <ul v-show="loading" class="ztree">
+      {{ this.$t('common.tree.Loading') }}...
+    </ul>
+    <div v-show="!loading" class="treebox">
       <ul :id="iZTreeID" class="ztree">
         {{ this.$t('common.tree.Loading') }}...
       </ul>
@@ -22,6 +25,7 @@
 import $ from '@/utils/jquery-vendor.js'
 import '@ztree/ztree_v3/js/jquery.ztree.all.min.js'
 import '@/styles/ztree.css'
+import axiosRetry from 'axios-retry'
 
 const defaultObject = {
   type: Object,
@@ -40,7 +44,8 @@ export default {
       iRMenuID: `rMenu_${this._uid}`,
       zTree: '',
       rMenu: '',
-      init: false
+      init: false,
+      loading: false
     }
   },
   computed: {
@@ -57,14 +62,26 @@ export default {
   },
   methods: {
     initTree: function() {
+      const vm = this
       let treeUrl
+      if (this.init) {
+        this.loading = true
+      }
       if (this.init && this.treeSetting.treeUrl.indexOf('/perms/') !== -1 && this.treeSetting.treeUrl.indexOf('rebuild_tree') === -1) {
         treeUrl = (this.treeSetting.treeUrl.indexOf('?') === -1) ? `${this.treeSetting.treeUrl}?rebuild_tree=1` : `${this.treeSetting.treeUrl}&rebuild_tree=1`
       } else {
         treeUrl = this.treeSetting.treeUrl
-        this.init = true
       }
-      this.$axios.get(treeUrl).then(res => {
+      this.$axios.get(treeUrl, {
+        'axios-retry': {
+          retries: 20,
+          retryCondition: e => {
+            return axiosRetry.isNetworkOrIdempotentRequestError(e) || e.response.status === 409
+          },
+          shouldResetTimeout: true,
+          retryDelay: () => { return 5000 }
+        }
+      }).then(res => {
         if (!res) {
           res = []
         }
@@ -74,6 +91,9 @@ export default {
           })
         }
         this.treeSetting.treeUrl = treeUrl
+        if (this.init) {
+          vm.zTree.destroy()
+        }
         this.zTree = $.fn.zTree.init($(`#${this.iZTreeID}`), this.treeSetting, res)
         if (this.treeSetting.showRefresh) {
           this.rootNodeAddDom(
@@ -88,6 +108,9 @@ export default {
         if (this.treeSetting.otherMenu) {
           $('.menu-actions').append(this.otherMenu)
         }
+      }).finally(_ => {
+        vm.loading = false
+        vm.init = true
       })
     },
     rootNodeAddDom: function(ztree, callback) {
@@ -104,7 +127,6 @@ export default {
       }
       const refreshIconRef = $('#tree-refresh')
       refreshIconRef.bind('click', function() {
-        ztree.destroy()
         const result = callback()
         if (result && result.then) {
           result.finally(() => {
diff --git a/src/i18n/langs/cn.json b/src/i18n/langs/cn.json
index 370985181..c50d5b6c1 100644
--- a/src/i18n/langs/cn.json
+++ b/src/i18n/langs/cn.json
@@ -190,6 +190,7 @@
     "Auth": "认证",
     "BadRequestErrorMsg": "请求错误，请检查填写内容",
     "BadRoleErrorMsg": "请求错误，无该操作权限",
+    "BadConflictErrorMsg": "正在刷新中，请稍后再试",
     "Basic": "基本",
     "BasicInfo": "基本信息",
     "Cancel": "取消",
diff --git a/src/i18n/langs/en.json b/src/i18n/langs/en.json
index 91b3e3a70..3d0173359 100644
--- a/src/i18n/langs/en.json
+++ b/src/i18n/langs/en.json
@@ -190,6 +190,7 @@
     "Auth": "Authorization",
     "BadRequestErrorMsg": "Bad request, please check again",
     "BadRoleErrorMsg": "Bad request, no permission for this operation",
+    "BadConflictErrorMsg": "Refreshing, please try again later",
     "Basic": "Basic",
     "BasicInfo": "Basic info",
     "Cancel": "Cancel",
diff --git a/src/utils/request.js b/src/utils/request.js
index 1b83fde4b..d87e11c77 100644
--- a/src/utils/request.js
+++ b/src/utils/request.js
@@ -4,6 +4,7 @@ import { getTokenFromCookie } from '@/utils/auth'
 import { refreshSessionIdAge } from '@/api/users'
 import { Message, MessageBox } from 'element-ui'
 import store from '@/store'
+import axiosRetry from 'axios-retry'
 
 // create an axios instance
 const service = axios.create({
@@ -75,6 +76,10 @@ function ifBadRequest({ response, error }) {
   if (response.status === 403) {
     error.message = i18n.t('common.BadRoleErrorMsg')
   }
+  if (response.status === 409) {
+    error.response.status = 409
+    error.message = i18n.t('common.BadConflictErrorMsg')
+  }
 }
 
 export function flashErrorMsg({ response, error }) {
@@ -141,4 +146,9 @@ service.interceptors.response.use(
   }
 )
 
+axiosRetry(service, {
+  // 默认不开启请求重试
+  retries: 0
+})
+
 export default service