no message

src/components/organization-ant.vue

 <template>
   <div style="position: relative;">
-    <!-- Loading遮罩层 - 覆盖整个组件 -->
+    <!-- Loading遮罩层 - 覆盖树的半透明效果 -->
     <div
-      class="component-loading-overlay"
-      :style="{ display: checkLoading ? 'flex' : 'none' }"
+      class="tree-loading-overlay"
+      :class="{ 'is-loading': checkLoading }"
     >
-      处理中...
+      <div class="tree-loading-content">
+        <q-spinner-orbit color="primary" size="40px" />
+        <span class="tree-loading-text">处理中...</span>
+      </div>
     </div>
 
-    <div v-show="treeData.length > 0">
+    <div class="tree-wrapper" :class="{ 'is-dimmed': checkLoading }">
       <div class="search-container">
         <div class="search-wrapper">
           <q-input
@@ -274,7 +277,7 @@
             this.checkLoading = false;
             // 恢复页面滚动
             this.restoreBodyScroll();
-          }, 200); // 最少显示200ms，让用户看到反馈
+          }, 500); // 最少显示200ms，让用户看到反馈
 
         } catch (error) {
           console.error('勾选处理出错:', error);
@@ -714,21 +717,42 @@
   background: rgba(0, 0, 0, 0.3);
 }
 
-/* 组件Loading遮罩层样式 - 覆盖整个组件 */
-.component-loading-overlay {
+/* 树组件的半透明Loading遮罩层 */
+.tree-loading-overlay {
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
-  background-color: rgba(255, 255, 255, 0.9);
-  backdrop-filter: blur(3px);
-  z-index: 1000;
+  background-color: rgba(255, 255, 255, 0.75);
+  backdrop-filter: blur(2px);
+  z-index: 100;
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 8px;
-  overflow: hidden; /* 防止遮罩层内部滚动 */
+  opacity: 0;
+  visibility: hidden;
+  transition: opacity 0.2s ease, visibility 0.2s ease;
+}
+
+.tree-loading-overlay.is-loading {
+  opacity: 1;
+  visibility: visible;
+}
+
+.tree-wrapper {
+  transition: opacity 0.2s ease;
+}
+
+.tree-wrapper.is-dimmed {
+  opacity: 0.3;
+}
+
+.tree-loading-text {
+  color: #666;
+  font-size: 14px;
+  font-weight: 500;
 }
 
 /* 响应式设计 */