feat: 组织树刷新

# Reviewed, transaction id: 6975
TencentBlueKing · Apr 29, 2024 · f023458 · f023458
1 parent 3c193a1
commit f023458
Show file tree

Hide file tree

Showing 5 changed files with 21 additions and 3 deletions.
diff --git a/src/pages/src/store/app.ts b/src/pages/src/store/app.ts
@@ -7,8 +7,11 @@ export default defineStore('app', () => {
 
   const isSearchTree = ref(false);
 
+  const reloadIndex = ref(1);
+
   return {
     currentOrg,
     isSearchTree,
+    reloadIndex,
   };
 });
diff --git a/src/pages/src/views/organization/components/aside-collaboration.vue b/src/pages/src/views/organization/components/aside-collaboration.vue
@@ -1,5 +1,5 @@
 <template>
-  <section class="bg-white h-full pl-[6px]" ref="asideRef">
+  <section class="bg-white h-full pl-[6px]" v-bkloading="{ loading: loading }">
     <div class="leading-[36px] px-[6px] text-[#979BA5] text-[12px]">
       <span class="user-icon icon-tongbu pr-[4px]"></span>
       {{ $t('协同租户') }}
@@ -19,10 +19,13 @@ import CollaborationItem from './collaboration-item.vue';
 import { getCollaboration } from '@/http/organizationFiles';
 
 const collaborations = ref([]);
+const loading = ref(false);
 
 onBeforeMount(async () => {
+  loading.value = true;
   const tenantData = await getCollaboration();
   collaborations.value = tenantData?.data || [];
+  loading.value = false;
 });
 </script>
 
diff --git a/src/pages/src/views/organization/components/aside-tenant.vue b/src/pages/src/views/organization/components/aside-tenant.vue
@@ -1,6 +1,6 @@
 <template>
   <section class="bg-white h-full pl-[6px]">
-    <div class="">
+    <div v-bkloading="{ loading: loading }">
       <div
         class="leading-[36px] text-[14px] px-[6px] inline-flex items-center w-full cursor-pointer"
         :class="{ 'text-[#3A84FF] bg-[#ebf2ff]': appStore.currentOrg?.id === currentTenant?.id }"
@@ -62,6 +62,7 @@ import useAppStore from '@/store/app';
 const appStore = useAppStore();
 
 const currentTenant = ref();
+const loading = ref(false);
 
 const formatTreeData = (data = []) => {
   data.forEach((item) => {
@@ -74,11 +75,13 @@ const formatTreeData = (data = []) => {
 };
 
 onBeforeMount(async () => {
+  loading.value = true;
   const tenantData = await getCurrentTenant();
   currentTenant.value = tenantData?.data;
   appStore.currentOrg = tenantData?.data;
   const deptData = await getDepartmentsList(0, currentTenant.value?.id);
   treeData.value = formatTreeData(deptData?.data);
+  loading.value = false;
 });
 
 const organizationAsideHooks = useOrganizationAside(currentTenant);

diff --git a/src/pages/src/views/organization/components/search.vue b/src/pages/src/views/organization/components/search.vue
@@ -7,7 +7,10 @@
       @change="handleSearch"
       @clear="handleClear"
     ></bk-input>
-    <div class="user-icon icon-refresh bg-[#F0F1F5] h-[32px] w-[32px] ml-[8px] !leading-[32px] cursor-pointer">
+    <div 
+      class="user-icon icon-refresh bg-[#F0F1F5] h-[32px] w-[32px] ml-[8px] !leading-[32px] cursor-pointer"
+      @click="handleRefresh"
+    >
     </div>
     <div
       v-if="searchDialogVisible"
@@ -216,4 +219,9 @@ const handleBeforeClose = async () => {
     return Promise.resolve(enableLeave);
   }
 };
+
+const handleRefresh = () => {
+  handleClear();
+  appStore.reloadIndex += 1
+}
 </script>
diff --git a/src/pages/src/views/organization/index.vue b/src/pages/src/views/organization/index.vue
@@ -12,6 +12,7 @@
       </div>
       <bk-resize-layout
         v-show="!appStore.isSearchTree"
+        :key="appStore.reloadIndex"
         placement="top"
         style="height: calc(100vh - 106px);"
         :border="false"