feat: 增加租户切换功能

src/components/Nav.vue

@@ -13,6 +13,7 @@
         <span>{{ item.meta?.title }}</span>
       </div>
     </nav>
+    <SwitchTenant />
     <div class="platform__right">
       <div class="platform__right__search">
         <el-input v-model="searchValue" placeholder="搜索您想了解的" class="input-with-icon" clearable>
@@ -42,6 +43,7 @@
   import UserInfo from '@/components/UserInfo.vue';
   import { useGlobSetting } from '@/hooks/setting';
   import { useUserStore } from '@/store/modules/user';
+  import SwitchTenant from '@/layout/components/SwitchTenant.vue';
 
   const userStore = useUserStore();
   const activeNav = ref(NAV_LIST[0].name);

src/layout/components/SwitchTenant.vue

@@ -0,0 +1,100 @@
+<!-- 切换租户 -->
+<template>
+  <div class="switchTenantLable-wrapper" v-if="optionsShown">
+    <el-tree-select
+      :model-value="currentTenant"
+      :data="options"
+      size="small"
+      check-strictly
+      show-all-levels
+      default-expand-all
+      placeholder="请选择租户"
+      @change="handleChange"
+    />
+  </div>
+</template>
+<script lang="ts" setup>
+  import { ref, computed, onMounted } from 'vue';
+  import { ElMessageBox, ElMessage } from 'element-plus';
+  import { useUserStore } from '@/store/modules/user';
+  import { queryListTenant } from '@/api/tenant';
+  import { SYS_TENANT_ID, useTargetTenantIdSetting } from '@/utils/useTargetTenantIdSetting';
+  import { replaceParams } from '@/utils/helper/treeHelper';
+  import router from '@/router';
+  import { useRoute } from 'vue-router';
+
+  interface TenantOption {
+    label: string;
+    value: string;
+    children?: TenantOption[];
+  }
+
+  const userStore = useUserStore();
+  const { setValue, getValue } = useTargetTenantIdSetting();
+  const localTId = getValue();
+  const tenantId = computed(() => {
+    return userStore.info.tenantId;
+  });
+  const currentTenant = ref(localTId ? Number(localTId) : Number(tenantId.value));
+  const options = ref<TenantOption[]>([]);
+
+  const route = useRoute();
+
+  const optionsShown = computed(() => {
+    return userStore.info.tenantId === SYS_TENANT_ID;
+  });
+
+  onMounted(() => {
+    const routeTenantId = route.query.targetTenantId as string;
+    if (routeTenantId && routeTenantId !== 'undefined') {
+      const nextTenantId = Number(routeTenantId);
+      currentTenant.value = nextTenantId;
+      setValue(routeTenantId);
+    }
+    queryListTenant().then((res) => {
+      if (!res) return;
+      options.value = replaceParams(res || [], 'tenantName', 'id');
+    });
+  });
+
+  /* 选择租户添加二次确认弹窗 */
+  const handleChange = (targetTenantId: string) => {
+    ElMessageBox.confirm('是否切换租户？', '提示', {
+      confirmButtonText: '确定',
+      cancelButtonText: '取消',
+      type: 'warning',
+    })
+      .then(async () => {
+        setValue(targetTenantId);
+        currentTenant.value = Number(targetTenantId);
+        // 统一返回首页
+        await router.push('/');
+        window.location.reload();
+      })
+      .catch(() => {
+        ElMessage({
+          type: 'info',
+          message: '取消切换',
+        });
+      });
+  };
+</script>
+<style scoped>
+  .switchTenantLable {
+    margin-right: 15px;
+    display: inline-block;
+    width: 100px;
+  }
+
+  .switchTenantWrapper {
+    margin-right: 20px;
+  }
+
+  .switchTenantLable-wrapper {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 110px;
+    margin-left: 10px;
+  }
+</style>

src/utils/useTargetTenantIdSetting.ts

@@ -1,5 +1,5 @@
 import { useUserStore } from '@/store/modules/user';
-import { computed, watch } from 'vue';
+import { watch } from 'vue';
 
 export const SYS_TENANT_ID = 0;
 
@@ -18,7 +18,6 @@ export function useTargetTenantIdSetting() {
 
   function setValue(tenantId: string | string) {
     if (!fullKey) {
-      
       return;
     }
     localStorage.setItem(fullKey, String(tenantId));
@@ -26,7 +25,6 @@ export function useTargetTenantIdSetting() {
 
   function getValue() {
     if (!fullKey) {
-      
       return;
     }
     return localStorage.getItem(fullKey);

tsconfig.node.json

@@ -3,23 +3,24 @@
     "composite": true,
     "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
     "target": "ES2022",
-    "lib": ["ES2023"],
+    "lib": [
+      "esnext"
+    ],
     "module": "ESNext",
     "skipLibCheck": true,
-
     /* Bundler mode */
     "moduleResolution": "bundler",
-    "allowImportingTsExtensions": true,
     "isolatedModules": true,
     "moduleDetection": "force",
     "emitDeclarationOnly": true,
-
     /* Linting */
     "strict": true,
     "noUnusedLocals": true,
     "noUnusedParameters": true,
     "noFallthroughCasesInSwitch": true,
-    "noUncheckedSideEffectImports": true
   },
-  "include": ["vite.config.ts", "build/**/*.ts", "src/utils/**/*.ts"]
-}
+  "include": [
+    "vite.config.ts",
+    "build/**/*.ts",
+  ]
+}