From bd02645e26e9f3ef72b9efa009c50ad627c7e4b2 Mon Sep 17 00:00:00 2001
From: xingyu4j <xingyu4j@vip.qq.com>
Date: Tue, 6 May 2025 15:44:31 +0800
Subject: [PATCH] =?UTF-8?q?perf:=20=E4=BC=98=E5=8C=96=20=E7=A7=9F=E6=88=B7?=
 =?UTF-8?q?=E5=88=87=E6=8D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../layouts/components/tenant-dropdown.vue    | 75 ++++++++++---------
 .../src/locales/langs/en-US/page.json         |  4 +
 .../src/locales/langs/zh-CN/page.json         |  4 +
 packages/stores/src/modules/access.ts         |  9 +--
 4 files changed, 47 insertions(+), 45 deletions(-)

diff --git a/apps/web-antd/src/layouts/components/tenant-dropdown.vue b/apps/web-antd/src/layouts/components/tenant-dropdown.vue
index 013958d4..a272d562 100644
--- a/apps/web-antd/src/layouts/components/tenant-dropdown.vue
+++ b/apps/web-antd/src/layouts/components/tenant-dropdown.vue
@@ -1,63 +1,64 @@
 <script lang="ts" setup>
-import { computed, onMounted, ref } from 'vue';
+import type { SelectValue } from 'ant-design-vue/es/select';
+
+import { onMounted, ref } from 'vue';
 
 import { useAccess } from '@vben/access';
-import { isTenantEnable, useRefresh } from '@vben/hooks';
+import { isTenantEnable, useTabs } from '@vben/hooks';
 import { useAccessStore } from '@vben/stores';
 
-import { Button, Dropdown, Menu } from 'ant-design-vue';
+import { message, Select } from 'ant-design-vue';
 
 import { getTenantList } from '#/api/system/tenant';
+import { $t } from '#/locales';
+import { resetRoutes } from '#/router';
+import { useAuthStore } from '#/store';
 
-const { refresh } = useRefresh();
+const { closeOtherTabs, refreshTab, closeAllTabs } = useTabs();
 
 const { hasAccessByCodes } = useAccess();
 const accessStore = useAccessStore();
 
+const authStore = useAuthStore();
+
 const tenantEnable = isTenantEnable();
 
-const visitTenantList = computed(() => {
-  if (tenantEnable) {
-    const list = accessStore.visitTenantId.map((item) => ({
-      label: item.name,
-      id: item.id,
-    }));
-    return list;
-  }
-  return [];
-});
+const visitTenantList = accessStore.visitTenantId;
 
-const tenant = ref<string>(
-  visitTenantList.value.find((item) => item.id === accessStore.tenantId)
-    ?.label || '切换租户',
-);
+const tenant = ref<SelectValue>(accessStore.tenantId ?? 0);
 
-function handleClick(id: number | undefined) {
-  if (id) {
-    accessStore.setTenantId(id);
-    refresh();
-    window.location.reload();
-  }
+async function handleClick(id: SelectValue) {
+  accessStore.setTenantId(Number(id));
+  await authStore.fetchUserInfo();
+  await resetRoutes();
+  await closeOtherTabs();
+  await closeAllTabs();
+  await refreshTab();
+  message.success($t('page.tenant.success'));
 }
 
 onMounted(async () => {
   if (tenantEnable) {
     const resp = await getTenantList();
-    accessStore.setVisitTenantId(resp);
+    accessStore.setVisitTenantId(
+      resp
+        .map((item) => ({ id: item.id, name: item.name }))
+        .filter((item): item is { id: number; name: string } => !!item.id),
+    );
   }
 });
 </script>
 <template>
-  <Dropdown v-if="tenantEnable && hasAccessByCodes(['system:tenant:visit'])">
-    <template #overlay>
-      <Menu>
-        <template v-for="item in visitTenantList" :key="item.key">
-          <Menu.Item @click="handleClick(item.id)">
-            {{ item.label }}
-          </Menu.Item>
-        </template>
-      </Menu>
-    </template>
-    <Button> {{ tenant }} </Button>
-  </Dropdown>
+  <div v-if="tenantEnable && hasAccessByCodes(['system:tenant:visit'])">
+    <Select
+      v-model:value="tenant"
+      :field-names="{ label: 'name', value: 'id' }"
+      :options="visitTenantList"
+      :placeholder="$t('page.tenant.placeholder')"
+      :dropdown-style="{ position: 'fixed', zIndex: 1666 }"
+      allow-clear
+      class="w-40"
+      @change="handleClick"
+    />
+  </div>
 </template>
diff --git a/apps/web-antd/src/locales/langs/en-US/page.json b/apps/web-antd/src/locales/langs/en-US/page.json
index c1d49ed7..e889bfc1 100644
--- a/apps/web-antd/src/locales/langs/en-US/page.json
+++ b/apps/web-antd/src/locales/langs/en-US/page.json
@@ -24,5 +24,9 @@
     "confirm": "Confirm",
     "reset": "Reset",
     "search": "Search"
+  },
+  "tenant": {
+    "placeholder": "Please select tenant",
+    "success": "Switch tenant success"
   }
 }
diff --git a/apps/web-antd/src/locales/langs/zh-CN/page.json b/apps/web-antd/src/locales/langs/zh-CN/page.json
index b3613d8a..a7781960 100644
--- a/apps/web-antd/src/locales/langs/zh-CN/page.json
+++ b/apps/web-antd/src/locales/langs/zh-CN/page.json
@@ -24,5 +24,9 @@
     "confirm": "确认",
     "reset": "重置",
     "search": "搜索"
+  },
+  "tenant": {
+    "placeholder": "请选择租户",
+    "success": "切换租户成功"
   }
 }
diff --git a/packages/stores/src/modules/access.ts b/packages/stores/src/modules/access.ts
index b8183f01..605e78dd 100644
--- a/packages/stores/src/modules/access.ts
+++ b/packages/stores/src/modules/access.ts
@@ -7,15 +7,8 @@ import { acceptHMRUpdate, defineStore } from 'pinia';
 type AccessToken = null | string;
 
 type VisitTenantId = {
-  accountCount: number;
-  contactMobile: string;
-  contactName: string;
-  expireTime: Date;
-  id?: number;
+  id: number;
   name: string;
-  packageId: number;
-  status: number;
-  website: string;
 };
 
 interface AccessState {