From 47547764cda5d64e321b475a9f25ccd1d0d06b0a Mon Sep 17 00:00:00 2001
From: Frost-ZX <30585462+Frost-ZX@users.noreply.github.com>
Date: Wed, 5 May 2021 19:22:08 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E7=89=88=E6=9C=AC=E5=8F=B7?=
 =?UTF-8?q?=E3=80=81=E6=B7=BB=E5=8A=A0=E5=8A=A0=E8=BD=BD=E5=8A=A8=E7=94=BB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/Tools.vue       |  3 ++-
 src/views/ToolsDetail.vue | 24 +++++++++++++++++++++---
 2 files changed, 23 insertions(+), 4 deletions(-)

diff --git a/src/views/Tools.vue b/src/views/Tools.vue
index 4ff3aff..35c137a 100644
--- a/src/views/Tools.vue
+++ b/src/views/Tools.vue
@@ -115,8 +115,9 @@ export default {
             // 更新页面标题
             this.utils.changeTitle(info.title);
             // 更新 drawer 标题
-            this.detail.title = info.title;
+            this.detail.title = `${info.title} [${info.version}_${info.update}]`;
             // 路由跳转
+            // 注：当前路由相同时也进行跳转，以更新 query
             this.$router.push({
                 name: 'ToolsDetail',
                 params: {
diff --git a/src/views/ToolsDetail.vue b/src/views/ToolsDetail.vue
index 9d03de7..cf66fb4 100644
--- a/src/views/ToolsDetail.vue
+++ b/src/views/ToolsDetail.vue
@@ -10,7 +10,6 @@ export default {
     data() {
         return {
             utils: this.$root.utils,
-            routeQuery: {},
             toolElem: null
         }
     },
@@ -18,16 +17,35 @@ export default {
         next(vm => {
             var params = vm.$route.params;
             var query = vm.$route.query;
+            var loading = null;
 
             console.log('[打开工具] params', params);
             console.log('[打开工具] query', query);
 
-            vm.toolElem = () => {
+            // 异步，防止找不到 target
+            setTimeout(() => {
+                // 开启 Loading
+                loading = vm.$loading({
+                    background: '#FFF',
+                    lock: true,
+                    // Loading 需要覆盖的 DOM 节点
+                    target: '.drawer-full .el-drawer__body'
+                });
+            }, 0);
+
+            vm.toolElem = (() => {
                 // 动态引入组件
                 var elem = import(`@/components/tools/${query.component}.vue`);
 
+                Promise.all([elem]).then(() => {
+                    setTimeout(() => {
+                        // 关闭 Loading
+                        loading.close();
+                    }, 200);
+                });
+
                 return elem;
-            };
+            });
         });
     }
 }