From 6112dc83ef0779f0788a8c99ebdff483d938a4c2 Mon Sep 17 00:00:00 2001
From: LH_R <song.lhlh@gmail.com>
Date: Tue, 19 Aug 2025 18:34:44 +0800
Subject: [PATCH] feat(ui): tree views - add page initialization loading

---
 .../src/modules/cmdb/views/tree_views/index.vue  | 16 ++++++++++++++--
 1 file changed, 14 insertions(+), 2 deletions(-)

diff --git a/cmdb-ui/src/modules/cmdb/views/tree_views/index.vue b/cmdb-ui/src/modules/cmdb/views/tree_views/index.vue
index 05f6dfa..a4db406 100644
--- a/cmdb-ui/src/modules/cmdb/views/tree_views/index.vue
+++ b/cmdb-ui/src/modules/cmdb/views/tree_views/index.vue
@@ -1,6 +1,9 @@
 <template>
   <div :style="{ marginBottom: '-24px' }">
-    <div v-if="!subscribeTreeViewCiTypesLoading && subscribeTreeViewCiTypes.length === 0">
+    <div v-if="subscribeTreeViewCiTypesLoading" class="page-loading">
+      <a-spin size="large" />
+    </div>
+    <div v-else-if="subscribeTreeViewCiTypes.length === 0">
       <a-alert banner>
         <template #message>
           <span>{{ $t('cmdb.preference.tips1') }}</span>
@@ -638,7 +641,11 @@ export default {
     },
     columnDrop() {
       this.$nextTick(() => {
-        const xTable = this.$refs.xTable.getVxetableRef()
+        const xTable = this.$refs?.xTable?.getVxetableRef?.()
+        if (!xTable) {
+          return
+        }
+
         this.sortable = Sortable.create(
           xTable.$el.querySelector('.body--wrapper>.vxe-table--header .vxe-header--row'),
           {
@@ -1015,6 +1022,11 @@ export default {
 
 <style lang="less">
 @import '../index.less';
+.page-loading {
+  text-align: center;
+  padding-top: 150px;
+}
+
 .tree-views {
   width: 100%;
   height: calc(100% - 32px);