feat: 超级管理员租户切换

This commit is contained in:
dap 2024-08-07 11:55:13 +08:00
parent 6ed3058689
commit 1e29c37036
6 changed files with 176 additions and 0 deletions

View File

@ -0,0 +1,28 @@
import { requestClient } from '#/api/request';
enum Api {
root = '/system/tenant',
tenantDynamic = '/system/tenant/dynamic',
tenantDynamicClear = '/system/tenant/dynamic/clear',
tenantExport = '/system/tenant/export',
tenantList = '/system/tenant/list',
tenantStatus = '/system/tenant/changeStatus',
tenantSyncPackage = '/system/tenant/syncTenantPackage',
}
/**
*
* @param tenantId ID
* @returns void
*/
export function tenantDynamicToggle(tenantId: string) {
return requestClient.get<void>(`${Api.tenantDynamic}/${tenantId}`);
}
/**
*
* @returns void
*/
export function tenantDynamicClear() {
return requestClient.get<void>(Api.tenantDynamicClear);
}

View File

@ -0,0 +1,16 @@
export interface Tenant {
accountCount: number;
address?: string;
companyName: string;
contactPhone: string;
contactUserName: string;
domain?: string;
expireTime?: string;
id: number;
intro: string;
licenseNumber?: any;
packageId?: string;
remark?: string;
status: string;
tenantId: string;
}

View File

@ -0,0 +1,88 @@
<script setup lang="ts">
import { computed, onMounted, ref, unref } from 'vue';
import { useRouter } from 'vue-router';
import { useAccess } from '@vben/access';
import { DEFAULT_HOME_PATH } from '@vben/constants';
import { useTabs } from '@vben/hooks';
import { message, Select } from 'ant-design-vue';
import { storeToRefs } from 'pinia';
import { tenantDynamicClear, tenantDynamicToggle } from '#/api/system/tenant';
import { useTenantStore } from '#/store/tenant';
const { hasAccessByRoles } = useAccess();
//
const lastSelected = ref<string>();
// id
const selected = ref<string>();
const tenantStore = useTenantStore();
const { initTenant, setChecked } = tenantStore;
const { tenantEnable, tenantList } = storeToRefs(tenantStore);
const showToggle = computed<boolean>(() => {
// &&
return hasAccessByRoles(['superadmin']) && unref(tenantEnable);
});
onMounted(async () => {
if (!hasAccessByRoles(['superadmin'])) {
return;
}
await initTenant();
});
const { closeAllTabs } = useTabs();
const router = useRouter();
function close(checked: boolean) {
// store
setChecked(checked);
//
closeAllTabs();
//
router.push(DEFAULT_HOME_PATH);
}
/**
* 为什么要用any ide报错😅 实际类型为string
*/
async function onSelected(tenantId: any, option: any) {
if (unref(lastSelected) === tenantId) {
// createMessage.info('');
return;
}
await tenantDynamicToggle(tenantId);
lastSelected.value = tenantId;
message.success(`切换当前租户为: ${option.title}`);
close(true);
}
async function onDeselect() {
await tenantDynamicClear();
message.success('还原为默认租户');
lastSelected.value = '';
close(false);
}
</script>
<template>
<div v-if="showToggle" class="mr-[8px] hidden md:block">
<Select
v-model:value="selected"
:field-names="{ label: 'companyName', value: 'tenantId' }"
:options="tenantList"
allow-clear
class="w-60"
placeholder="选择租户"
@deselect="onDeselect"
@select="onSelected"
>
<template #suffixIcon>
<span class="icon-mdi--company"></span>
</template>
</Select>
</div>
</template>

View File

@ -0,0 +1 @@
租户切换组件

View File

@ -16,6 +16,7 @@ import { openWindow } from '@vben/utils';
import { message } from 'ant-design-vue'; import { message } from 'ant-design-vue';
import TenantToggle from '#/components/TenantToggle/index.vue';
import { $t } from '#/locales'; import { $t } from '#/locales';
import { resetRoutes } from '#/router'; import { resetRoutes } from '#/router';
import { useAuthStore, useNotifyStore } from '#/store'; import { useAuthStore, useNotifyStore } from '#/store';
@ -77,6 +78,9 @@ function handleViewAll() {
<template> <template>
<BasicLayout @clear-preferences-and-logout="handleLogout"> <BasicLayout @clear-preferences-and-logout="handleLogout">
<template #header-right-1>
<TenantToggle />
</template>
<template #user-dropdown> <template #user-dropdown>
<UserDropdown <UserDropdown
:avatar :avatar

View File

@ -0,0 +1,39 @@
import { ref } from 'vue';
import { defineStore } from 'pinia';
import {
tenantList as tenantListApi,
type TenantOption,
} from '#/api/core/auth';
export const useTenantStore = defineStore('app-tenant', () => {
const checked = ref(false);
const tenantEnable = ref(true);
const tenantList = ref<TenantOption[]>([]);
async function initTenant() {
const { tenantEnabled, voList } = await tenantListApi();
tenantEnable.value = tenantEnabled;
tenantList.value = voList;
}
async function setChecked(_checked: boolean) {
checked.value = _checked;
}
function $reset() {
checked.value = false;
tenantEnable.value = true;
tenantList.value = [];
}
return {
$reset,
checked,
initTenant,
setChecked,
tenantEnable,
tenantList,
};
});