refactor(tenant): refine menu scope boundaries and document plan/tenant menu design
This commit is contained in:
@@ -1,6 +1,3 @@
|
|||||||
# ============================================
|
|
||||||
# 🌐 网络配置
|
|
||||||
# ============================================
|
|
||||||
# 应用端口
|
# 应用端口
|
||||||
VITE_APP_PORT=3000
|
VITE_APP_PORT=3000
|
||||||
# 项目名称
|
# 项目名称
|
||||||
@@ -9,25 +6,19 @@ VITE_APP_TITLE=vue3-element-admin
|
|||||||
VITE_APP_BASE_API=/dev-api
|
VITE_APP_BASE_API=/dev-api
|
||||||
|
|
||||||
# 接口地址
|
# 接口地址
|
||||||
VITE_APP_API_URL=https://api.youlai.tech/v2 # 线上
|
# VITE_APP_API_URL=https://api.youlai.tech/v2 # 线上
|
||||||
# VITE_APP_API_URL=http://localhost:8000 # 本地
|
VITE_APP_API_URL=http://localhost:8000 # 本地
|
||||||
|
|
||||||
# WebSocket 端点(不配置则关闭)
|
# WebSocket 端点(不配置则关闭)
|
||||||
# 线上: ws://api.youlai.tech/ws
|
# 线上: ws://api.youlai.tech/ws
|
||||||
# 本地: ws://localhost:8000/ws
|
# 本地: ws://localhost:8000/ws
|
||||||
VITE_APP_WS_ENDPOINT=
|
VITE_APP_WS_ENDPOINT=
|
||||||
|
|
||||||
# ============================================
|
|
||||||
# 🔧 开发工具
|
|
||||||
# ============================================
|
|
||||||
# 启用 Mock 服务
|
# 启用 Mock 服务
|
||||||
VITE_MOCK_DEV_SERVER=false
|
VITE_MOCK_DEV_SERVER=false
|
||||||
|
|
||||||
# ============================================
|
|
||||||
# 🎛️ 功能开关
|
# 多租户开关(true:开启 false:关闭)
|
||||||
# ============================================
|
|
||||||
# 多租户(需与后端 youlai.tenant.enabled 保持一致)
|
|
||||||
VITE_APP_TENANT_ENABLED=false
|
VITE_APP_TENANT_ENABLED=false
|
||||||
|
|
||||||
# AI 助手(系统级开关,用户可在设置中单独控制)
|
|
||||||
VITE_ENABLE_AI_ASSISTANT=true
|
|
||||||
|
|||||||
@@ -14,5 +14,3 @@ VITE_APP_TITLE=vue3-element-admin
|
|||||||
# 多租户(需与后端 app.tenant.enabled 保持一致)
|
# 多租户(需与后端 app.tenant.enabled 保持一致)
|
||||||
VITE_APP_TENANT_ENABLED=false
|
VITE_APP_TENANT_ENABLED=false
|
||||||
|
|
||||||
# AI 助手(系统级开关)
|
|
||||||
VITE_ENABLE_AI_ASSISTANT=true
|
|
||||||
|
|||||||
@@ -17,11 +17,11 @@ const MenuAPI = {
|
|||||||
});
|
});
|
||||||
},
|
},
|
||||||
/** 获取菜单下拉数据源 */
|
/** 获取菜单下拉数据源 */
|
||||||
getOptions(onlyParent?: boolean) {
|
getOptions(onlyParent?: boolean, scope?: number) {
|
||||||
return request<any, OptionItem[]>({
|
return request<any, OptionItem[]>({
|
||||||
url: `${MENU_BASE_URL}/options`,
|
url: `${MENU_BASE_URL}/options`,
|
||||||
method: "get",
|
method: "get",
|
||||||
params: { onlyParent },
|
params: { onlyParent, scope },
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
/** 获取菜单表单数据 */
|
/** 获取菜单表单数据 */
|
||||||
|
|||||||
70
src/api/system/tenant-plan.ts
Normal file
70
src/api/system/tenant-plan.ts
Normal file
@@ -0,0 +1,70 @@
|
|||||||
|
import request from "@/utils/request";
|
||||||
|
import type { OptionItem, PageResult } from "@/types/api";
|
||||||
|
import type {
|
||||||
|
TenantPlanForm,
|
||||||
|
TenantPlanItem,
|
||||||
|
TenantPlanQueryParams,
|
||||||
|
} from "@/types/api/tenant-plan";
|
||||||
|
|
||||||
|
const TENANT_PLAN_BASE_URL = "/api/v1/tenant-plans";
|
||||||
|
|
||||||
|
const TenantPlanAPI = {
|
||||||
|
/** 获取租户套餐分页数据 */
|
||||||
|
getPage(queryParams?: TenantPlanQueryParams) {
|
||||||
|
return request<any, PageResult<TenantPlanItem>>({
|
||||||
|
url: `${TENANT_PLAN_BASE_URL}`,
|
||||||
|
method: "get",
|
||||||
|
params: queryParams,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
/** 获取租户套餐表单数据 */
|
||||||
|
getFormData(planId: string) {
|
||||||
|
return request<any, TenantPlanForm>({
|
||||||
|
url: `${TENANT_PLAN_BASE_URL}/${planId}/form`,
|
||||||
|
method: "get",
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
/** 新增租户套餐 */
|
||||||
|
create(data: TenantPlanForm) {
|
||||||
|
return request({ url: `${TENANT_PLAN_BASE_URL}`, method: "post", data });
|
||||||
|
},
|
||||||
|
|
||||||
|
/** 修改租户套餐 */
|
||||||
|
update(planId: string, data: TenantPlanForm) {
|
||||||
|
return request({ url: `${TENANT_PLAN_BASE_URL}/${planId}`, method: "put", data });
|
||||||
|
},
|
||||||
|
|
||||||
|
/** 删除租户套餐 */
|
||||||
|
deleteByIds(ids: string) {
|
||||||
|
return request({ url: `${TENANT_PLAN_BASE_URL}/${ids}`, method: "delete" });
|
||||||
|
},
|
||||||
|
|
||||||
|
/** 获取租户方案下拉选项 */
|
||||||
|
getOptions() {
|
||||||
|
return request<any, OptionItem[]>({
|
||||||
|
url: `${TENANT_PLAN_BASE_URL}/options`,
|
||||||
|
method: "get",
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
/** 获取方案菜单ID集合 */
|
||||||
|
getPlanMenuIds(planId: number) {
|
||||||
|
return request<any, number[]>({
|
||||||
|
url: `${TENANT_PLAN_BASE_URL}/${planId}/menuIds`,
|
||||||
|
method: "get",
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
/** 更新方案菜单 */
|
||||||
|
updatePlanMenus(planId: number, menuIds: number[]) {
|
||||||
|
return request({
|
||||||
|
url: `${TENANT_PLAN_BASE_URL}/${planId}/menus`,
|
||||||
|
method: "put",
|
||||||
|
data: menuIds,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
export default TenantPlanAPI;
|
||||||
@@ -38,7 +38,7 @@ const tenantStore = useTenantStoreHook();
|
|||||||
|
|
||||||
const tenantList = computed(() => tenantStore.tenantList);
|
const tenantList = computed(() => tenantStore.tenantList);
|
||||||
|
|
||||||
const currentTenantIdRef = computed<number | null>({
|
const currentTenantId = computed<number | null>({
|
||||||
get: () => tenantStore.currentTenantId,
|
get: () => tenantStore.currentTenantId,
|
||||||
set: (val) => {
|
set: (val) => {
|
||||||
tenantStore.currentTenantId = val;
|
tenantStore.currentTenantId = val;
|
||||||
@@ -46,13 +46,13 @@ const currentTenantIdRef = computed<number | null>({
|
|||||||
});
|
});
|
||||||
|
|
||||||
const currentTenantName = computed(() => {
|
const currentTenantName = computed(() => {
|
||||||
const currentId = currentTenantIdRef.value;
|
const currentId = currentTenantId.value;
|
||||||
const fromList = tenantList.value.find((t) => t.id === currentId)?.name;
|
const fromList = tenantList.value.find((t) => t.id === currentId)?.name;
|
||||||
return fromList || tenantStore.currentTenant?.name || "切换租户";
|
return fromList || tenantStore.currentTenant?.name || "切换租户";
|
||||||
});
|
});
|
||||||
|
|
||||||
function onCommand(tenantId: number) {
|
function onCommand(tenantId: number) {
|
||||||
if (tenantId === currentTenantIdRef.value) {
|
if (tenantId === currentTenantId.value) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
emit("change", tenantId);
|
emit("change", tenantId);
|
||||||
|
|||||||
@@ -18,6 +18,14 @@ export const APP_PREFIX = "vea";
|
|||||||
*/
|
*/
|
||||||
export const ROLE_ROOT = "ROOT";
|
export const ROLE_ROOT = "ROOT";
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 平台租户ID
|
||||||
|
*
|
||||||
|
* @description
|
||||||
|
* 用于前端识别平台租户(不参与套餐/菜单配置)
|
||||||
|
*/
|
||||||
|
export const PLATFORM_TENANT_ID = 0;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 存储键名常量
|
* 存储键名常量
|
||||||
*
|
*
|
||||||
|
|||||||
@@ -14,6 +14,14 @@ export enum MenuTypeEnum {
|
|||||||
BUTTON = "B", // 按钮
|
BUTTON = "B", // 按钮
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 菜单范围枚举
|
||||||
|
*/
|
||||||
|
export enum MenuScopeEnum {
|
||||||
|
PLATFORM = 1, // 平台菜单
|
||||||
|
TENANT = 2, // 业务菜单
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 用户性别枚举
|
* 用户性别枚举
|
||||||
*/
|
*/
|
||||||
|
|||||||
@@ -28,7 +28,7 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- 租户选择(如果启用多租户)-->
|
<!-- 租户选择(如果启用多租户)-->
|
||||||
<div v-if="showTenantSelect" class="navbar-actions__item">
|
<div v-if="showTenantSwitcher" class="navbar-actions__item">
|
||||||
<TenantSwitcher @change="handleTenantChange" />
|
<TenantSwitcher @change="handleTenantChange" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@@ -72,7 +72,6 @@ import { useRoute, useRouter } from "vue-router";
|
|||||||
import { defaults } from "@/settings";
|
import { defaults } from "@/settings";
|
||||||
import { DeviceEnum, SidebarColor, ThemeMode, LayoutMode } from "@/enums/settings";
|
import { DeviceEnum, SidebarColor, ThemeMode, LayoutMode } from "@/enums/settings";
|
||||||
import { useAppStore, useSettingsStore, useUserStore } from "@/store";
|
import { useAppStore, useSettingsStore, useUserStore } from "@/store";
|
||||||
import { hasPerm } from "@/utils/auth";
|
|
||||||
|
|
||||||
// 导入子组件
|
// 导入子组件
|
||||||
import CommandPalette from "@/components/CommandPalette/index.vue";
|
import CommandPalette from "@/components/CommandPalette/index.vue";
|
||||||
@@ -95,21 +94,14 @@ const router = useRouter();
|
|||||||
// 是否为桌面设备
|
// 是否为桌面设备
|
||||||
const isDesktop = computed(() => appStore.device === DeviceEnum.DESKTOP);
|
const isDesktop = computed(() => appStore.device === DeviceEnum.DESKTOP);
|
||||||
|
|
||||||
const isPlatformUser = computed(() => {
|
const canSwitchTenant = computed(() => userStore.userInfo?.canSwitchTenant === true);
|
||||||
return (userStore.userInfo?.tenantScope || "").toUpperCase() === "PLATFORM";
|
|
||||||
});
|
|
||||||
|
|
||||||
const canSwitchTenant = computed(() => hasPerm("sys:tenant:switch", "button"));
|
// 是否显示租户选择
|
||||||
|
const showTenantSwitcher = computed(() => {
|
||||||
// 是否显示租户选择(仅平台用户可显式切换租户)
|
if (!canSwitchTenant.value) {
|
||||||
const showTenantSelect = computed(() => {
|
|
||||||
if (!isPlatformUser.value || !canSwitchTenant.value) {
|
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
if (tenantStore.tenantList.length <= 1) {
|
return tenantStore.tenantList.length > 1;
|
||||||
return false;
|
|
||||||
}
|
|
||||||
return true;
|
|
||||||
});
|
});
|
||||||
|
|
||||||
function handleTenantChange(tenantId: number) {
|
function handleTenantChange(tenantId: number) {
|
||||||
@@ -117,10 +109,10 @@ function handleTenantChange(tenantId: number) {
|
|||||||
.switchTenant(tenantId)
|
.switchTenant(tenantId)
|
||||||
.then(() => {
|
.then(() => {
|
||||||
ElMessage.success("切换租户成功");
|
ElMessage.success("切换租户成功");
|
||||||
window.location.reload();
|
window.location.href = "/";
|
||||||
})
|
})
|
||||||
.catch((error: any) => {
|
.catch((error: any) => {
|
||||||
ElMessage.error(error?.message || "切换租户失败");
|
ElMessage.error(error.message || "切换租户失败");
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -234,7 +226,7 @@ function handleSettingsClick() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
background: rgba(0, 0, 0, 0.04);
|
background: var(--el-fill-color-light);
|
||||||
|
|
||||||
:deep([class^="i-svg:"]) {
|
:deep([class^="i-svg:"]) {
|
||||||
color: var(--el-color-primary);
|
color: var(--el-color-primary);
|
||||||
@@ -269,35 +261,35 @@ function handleSettingsClick() {
|
|||||||
.navbar-actions--white-text {
|
.navbar-actions--white-text {
|
||||||
.navbar-actions__item {
|
.navbar-actions__item {
|
||||||
:deep([class^="i-svg:"]) {
|
:deep([class^="i-svg:"]) {
|
||||||
color: rgba(255, 255, 255, 0.85);
|
color: color-mix(in srgb, var(--el-color-white) 85%, transparent);
|
||||||
}
|
}
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
background: rgba(255, 255, 255, 0.1);
|
background: color-mix(in srgb, var(--el-color-white) 10%, transparent);
|
||||||
|
|
||||||
:deep([class^="i-svg:"]) {
|
:deep([class^="i-svg:"]) {
|
||||||
color: #fff;
|
color: var(--el-color-white);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.user-profile__name {
|
.user-profile__name {
|
||||||
color: rgba(255, 255, 255, 0.85);
|
color: color-mix(in srgb, var(--el-color-white) 85%, transparent);
|
||||||
}
|
}
|
||||||
|
|
||||||
// 租户选择器在白色文字模式下的样式
|
// 租户选择器在白色文字模式下的样式
|
||||||
::v-deep(.tenant-switcher__trigger) {
|
::v-deep(.tenant-switcher__trigger) {
|
||||||
color: rgba(255, 255, 255, 0.85);
|
color: color-mix(in srgb, var(--el-color-white) 85%, transparent);
|
||||||
}
|
}
|
||||||
::v-deep(.tenant-switcher__trigger .tenant-switcher__icon) {
|
::v-deep(.tenant-switcher__trigger .tenant-switcher__icon) {
|
||||||
color: rgba(255, 255, 255, 0.85);
|
color: color-mix(in srgb, var(--el-color-white) 85%, transparent);
|
||||||
}
|
}
|
||||||
::v-deep(.tenant-switcher__trigger:hover) {
|
::v-deep(.tenant-switcher__trigger:hover) {
|
||||||
color: #fff;
|
color: var(--el-color-white);
|
||||||
background: rgba(255, 255, 255, 0.1);
|
background: color-mix(in srgb, var(--el-color-white) 10%, transparent);
|
||||||
}
|
}
|
||||||
::v-deep(.tenant-switcher__trigger:hover .tenant-switcher__icon) {
|
::v-deep(.tenant-switcher__trigger:hover .tenant-switcher__icon) {
|
||||||
color: #fff;
|
color: var(--el-color-white);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -330,7 +322,7 @@ function handleSettingsClick() {
|
|||||||
}
|
}
|
||||||
::v-deep(.tenant-switcher__trigger:hover) {
|
::v-deep(.tenant-switcher__trigger:hover) {
|
||||||
color: var(--el-color-primary) !important;
|
color: var(--el-color-primary) !important;
|
||||||
background: rgba(0, 0, 0, 0.04);
|
background: var(--el-fill-color-light);
|
||||||
}
|
}
|
||||||
::v-deep(.tenant-switcher__trigger:hover .tenant-switcher__icon) {
|
::v-deep(.tenant-switcher__trigger:hover .tenant-switcher__icon) {
|
||||||
color: var(--el-color-primary) !important;
|
color: var(--el-color-primary) !important;
|
||||||
|
|||||||
@@ -3,7 +3,7 @@ import NProgress from "@/plugins/nprogress";
|
|||||||
import router from "@/router";
|
import router from "@/router";
|
||||||
import { usePermissionStore, useUserStore } from "@/store";
|
import { usePermissionStore, useUserStore } from "@/store";
|
||||||
import { useTenantStoreHook } from "@/store/modules/tenant";
|
import { useTenantStoreHook } from "@/store/modules/tenant";
|
||||||
import { appConfig } from "@/settings";
|
import { isTenantEnabled } from "@/utils/tenant";
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 路由权限守卫
|
* 路由权限守卫
|
||||||
@@ -89,7 +89,8 @@ export function setupPermissionGuard() {
|
|||||||
|
|
||||||
/** 初始化多租户上下文,未启用或失败时静默跳过 */
|
/** 初始化多租户上下文,未启用或失败时静默跳过 */
|
||||||
async function initTenantContext(): Promise<void> {
|
async function initTenantContext(): Promise<void> {
|
||||||
if (!appConfig.tenantEnabled) return;
|
// 多租户关闭时不初始化租户上下文
|
||||||
|
if (!isTenantEnabled()) return;
|
||||||
|
|
||||||
try {
|
try {
|
||||||
await useTenantStoreHook().loadTenant();
|
await useTenantStoreHook().loadTenant();
|
||||||
|
|||||||
@@ -40,17 +40,10 @@ export const useTenantStore = defineStore("tenant", () => {
|
|||||||
/**
|
/**
|
||||||
* 获取用户租户列表
|
* 获取用户租户列表
|
||||||
*/
|
*/
|
||||||
function fetchTenantList() {
|
async function fetchTenantList(): Promise<TenantInfo[]> {
|
||||||
return new Promise<TenantInfo[]>((resolve, reject) => {
|
const data = await TenantAPI.getTenantList();
|
||||||
TenantAPI.getTenantList()
|
|
||||||
.then((data) => {
|
|
||||||
tenantList.value = data || [];
|
tenantList.value = data || [];
|
||||||
resolve(data || []);
|
return data || [];
|
||||||
})
|
|
||||||
.catch((error) => {
|
|
||||||
reject(error);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -78,25 +71,18 @@ export const useTenantStore = defineStore("tenant", () => {
|
|||||||
!tenantList.value.some((t) => t.id === currentTenantId.value)
|
!tenantList.value.some((t) => t.id === currentTenantId.value)
|
||||||
) {
|
) {
|
||||||
console.debug("[Tenant] 本地租户已不可用,清除并重新选择:", currentTenantId.value);
|
console.debug("[Tenant] 本地租户已不可用,清除并重新选择:", currentTenantId.value);
|
||||||
currentTenantId.value = null;
|
clearLocalTenant();
|
||||||
currentTenant.value = null;
|
|
||||||
localStorage.removeItem(STORAGE_KEYS.TENANT_ID);
|
|
||||||
localStorage.removeItem(STORAGE_KEYS.TENANT_INFO);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// 3. 如果已有租户列表,则保证一定有一个默认租户被选中
|
// 3. 如果已有租户列表,则保证一定有一个默认租户被选中
|
||||||
if (tenantList.value.length > 0) {
|
if (tenantList.value.length > 0) {
|
||||||
// 3.1 优先后端当前租户
|
// 3.1 优先后端当前租户
|
||||||
if (currentTenantId.value == null) {
|
if (currentTenantId.value == null) {
|
||||||
try {
|
const currentTenantInfo = await safeGetCurrentTenant();
|
||||||
const currentTenantInfo = await TenantAPI.getCurrentTenant();
|
|
||||||
if (currentTenantInfo) {
|
if (currentTenantInfo) {
|
||||||
setCurrentTenant(currentTenantInfo);
|
setCurrentTenant(currentTenantInfo);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
} catch (error) {
|
|
||||||
console.debug("[Tenant] 获取当前租户失败,尝试本地/默认选择:", error);
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// 3.2 本地已有 tenantId,但 currentTenant 为空时,从列表补全 tenantInfo(保持展示名称一致)
|
// 3.2 本地已有 tenantId,但 currentTenant 为空时,从列表补全 tenantInfo(保持展示名称一致)
|
||||||
@@ -136,48 +122,28 @@ export const useTenantStore = defineStore("tenant", () => {
|
|||||||
* @param tenantId 目标租户ID
|
* @param tenantId 目标租户ID
|
||||||
*/
|
*/
|
||||||
async function switchTenant(tenantId: number): Promise<void> {
|
async function switchTenant(tenantId: number): Promise<void> {
|
||||||
try {
|
await refreshTokenIfSupported(tenantId);
|
||||||
// 优先使用“切换租户并返回新 token”的接口(平台管理员跨租户切换需要更新 token 的 tenantId)
|
|
||||||
try {
|
|
||||||
const token = await AuthAPI.switchTenant(tenantId);
|
|
||||||
if (token?.accessToken && token?.refreshToken) {
|
|
||||||
AuthStorage.setTokens(token.accessToken, token.refreshToken, AuthStorage.getRememberMe());
|
|
||||||
}
|
|
||||||
} catch {
|
|
||||||
// 忽略:非平台用户或后端未启用该接口时,回退到旧接口
|
|
||||||
}
|
|
||||||
|
|
||||||
// 调用后端切换接口(用于获取当前租户信息/兼容旧逻辑)
|
|
||||||
const tenantInfo = await TenantAPI.switchTenant(tenantId);
|
const tenantInfo = await TenantAPI.switchTenant(tenantId);
|
||||||
|
|
||||||
// 后端返回切换后的租户信息
|
|
||||||
if (tenantInfo) {
|
if (tenantInfo) {
|
||||||
setCurrentTenant(tenantInfo);
|
setCurrentTenant(tenantInfo);
|
||||||
} else {
|
return;
|
||||||
// 如果后端未返回,从租户列表中找到对应的租户信息
|
|
||||||
const tenant = tenantList.value.find((t) => t.id === tenantId);
|
|
||||||
if (tenant) {
|
|
||||||
setCurrentTenant(tenant);
|
|
||||||
} else {
|
|
||||||
// 如果列表中没有,重新获取租户信息
|
|
||||||
try {
|
|
||||||
const info = await TenantAPI.getCurrentTenant();
|
|
||||||
if (info) {
|
|
||||||
setCurrentTenant(info);
|
|
||||||
} else {
|
|
||||||
throw new Error("无法获取租户信息");
|
|
||||||
}
|
}
|
||||||
} catch (error) {
|
|
||||||
console.error("获取租户信息失败:", error);
|
const matched = tenantList.value.find((t) => t.id === tenantId);
|
||||||
|
if (matched) {
|
||||||
|
setCurrentTenant(matched);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const fallback = await safeGetCurrentTenant();
|
||||||
|
if (fallback) {
|
||||||
|
setCurrentTenant(fallback);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
throw new Error("切换租户后无法获取租户信息");
|
throw new Error("切换租户后无法获取租户信息");
|
||||||
}
|
}
|
||||||
}
|
|
||||||
}
|
|
||||||
} catch (error) {
|
|
||||||
console.error("切换租户失败:", error);
|
|
||||||
throw error;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 清除租户信息
|
* 清除租户信息
|
||||||
@@ -186,10 +152,34 @@ export const useTenantStore = defineStore("tenant", () => {
|
|||||||
currentTenantId.value = null;
|
currentTenantId.value = null;
|
||||||
currentTenant.value = null;
|
currentTenant.value = null;
|
||||||
tenantList.value = [];
|
tenantList.value = [];
|
||||||
|
clearLocalTenant();
|
||||||
|
}
|
||||||
|
|
||||||
|
function clearLocalTenant() {
|
||||||
localStorage.removeItem(STORAGE_KEYS.TENANT_ID);
|
localStorage.removeItem(STORAGE_KEYS.TENANT_ID);
|
||||||
localStorage.removeItem(STORAGE_KEYS.TENANT_INFO);
|
localStorage.removeItem(STORAGE_KEYS.TENANT_INFO);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async function safeGetCurrentTenant(): Promise<TenantInfo | null> {
|
||||||
|
try {
|
||||||
|
return await TenantAPI.getCurrentTenant();
|
||||||
|
} catch (error) {
|
||||||
|
console.debug("[Tenant] 获取当前租户失败,尝试本地/默认选择:", error);
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
async function refreshTokenIfSupported(tenantId: number): Promise<void> {
|
||||||
|
try {
|
||||||
|
const token = await AuthAPI.switchTenant(tenantId);
|
||||||
|
if (token?.accessToken && token?.refreshToken) {
|
||||||
|
AuthStorage.setTokens(token.accessToken, token.refreshToken, AuthStorage.getRememberMe());
|
||||||
|
}
|
||||||
|
} catch {
|
||||||
|
// 忽略:非平台用户或后端未启用该接口时,回退到旧接口
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 设置租户列表
|
* 设置租户列表
|
||||||
*/
|
*/
|
||||||
|
|||||||
@@ -16,6 +16,7 @@ export * from "./log";
|
|||||||
export * from "./statistics";
|
export * from "./statistics";
|
||||||
export * from "./notice";
|
export * from "./notice";
|
||||||
export * from "./tenant";
|
export * from "./tenant";
|
||||||
|
export * from "./tenant-plan";
|
||||||
|
|
||||||
// 其他模块
|
// 其他模块
|
||||||
export * from "./ai";
|
export * from "./ai";
|
||||||
|
|||||||
@@ -34,6 +34,8 @@ export interface MenuItem {
|
|||||||
type?: string;
|
type?: string;
|
||||||
/** 菜单是否可见(1:显示;0:隐藏) */
|
/** 菜单是否可见(1:显示;0:隐藏) */
|
||||||
visible?: number;
|
visible?: number;
|
||||||
|
/** 菜单范围(1=平台 2=业务) */
|
||||||
|
scope?: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 菜单表单对象 */
|
/** 菜单表单对象 */
|
||||||
@@ -62,6 +64,8 @@ export interface MenuForm {
|
|||||||
sort?: number;
|
sort?: number;
|
||||||
/** 菜单是否可见 */
|
/** 菜单是否可见 */
|
||||||
visible?: number;
|
visible?: number;
|
||||||
|
/** 菜单范围(1=平台 2=业务) */
|
||||||
|
scope?: number;
|
||||||
/** 按钮权限标识 */
|
/** 按钮权限标识 */
|
||||||
perm?: string;
|
perm?: string;
|
||||||
/** 路由参数(用于表单编辑 params) */
|
/** 路由参数(用于表单编辑 params) */
|
||||||
|
|||||||
35
src/types/api/tenant-plan.ts
Normal file
35
src/types/api/tenant-plan.ts
Normal file
@@ -0,0 +1,35 @@
|
|||||||
|
/**
|
||||||
|
* Tenant Plan 租户套餐类型定义
|
||||||
|
*/
|
||||||
|
|
||||||
|
import type { BaseQueryParams } from "./common";
|
||||||
|
|
||||||
|
/** 租户套餐分页查询参数 */
|
||||||
|
export interface TenantPlanQueryParams extends BaseQueryParams {
|
||||||
|
/** 关键字(套餐名称/套餐编码) */
|
||||||
|
keywords?: string;
|
||||||
|
/** 状态(1-启用 0-停用) */
|
||||||
|
status?: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 租户套餐分页对象 */
|
||||||
|
export interface TenantPlanItem {
|
||||||
|
id?: number;
|
||||||
|
name?: string;
|
||||||
|
code?: string;
|
||||||
|
status?: number;
|
||||||
|
sort?: number;
|
||||||
|
remark?: string;
|
||||||
|
createTime?: string;
|
||||||
|
updateTime?: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
/** 租户套餐表单对象 */
|
||||||
|
export interface TenantPlanForm {
|
||||||
|
id?: number;
|
||||||
|
name?: string;
|
||||||
|
code?: string;
|
||||||
|
status?: number;
|
||||||
|
sort?: number;
|
||||||
|
remark?: string;
|
||||||
|
}
|
||||||
@@ -32,6 +32,7 @@ export interface TenantItem {
|
|||||||
contactEmail?: string;
|
contactEmail?: string;
|
||||||
domain?: string;
|
domain?: string;
|
||||||
logo?: string;
|
logo?: string;
|
||||||
|
planId?: number;
|
||||||
status?: number;
|
status?: number;
|
||||||
remark?: string;
|
remark?: string;
|
||||||
expireTime?: string;
|
expireTime?: string;
|
||||||
@@ -49,6 +50,7 @@ export interface TenantForm {
|
|||||||
contactEmail?: string;
|
contactEmail?: string;
|
||||||
domain?: string;
|
domain?: string;
|
||||||
logo?: string;
|
logo?: string;
|
||||||
|
planId?: number;
|
||||||
status?: number;
|
status?: number;
|
||||||
remark?: string;
|
remark?: string;
|
||||||
expireTime?: string;
|
expireTime?: string;
|
||||||
@@ -63,6 +65,7 @@ export interface TenantCreateForm {
|
|||||||
contactEmail?: string;
|
contactEmail?: string;
|
||||||
domain?: string;
|
domain?: string;
|
||||||
logo?: string;
|
logo?: string;
|
||||||
|
planId?: number;
|
||||||
remark?: string;
|
remark?: string;
|
||||||
expireTime?: string;
|
expireTime?: string;
|
||||||
adminUsername?: string;
|
adminUsername?: string;
|
||||||
|
|||||||
@@ -14,8 +14,8 @@ export interface UserInfo {
|
|||||||
nickname?: string;
|
nickname?: string;
|
||||||
/** 头像URL */
|
/** 头像URL */
|
||||||
avatar?: string;
|
avatar?: string;
|
||||||
/** 租户身份标识(PLATFORM/TENANT) */
|
/** 租户切换权限(true 可切换租户) */
|
||||||
tenantScope?: string;
|
canSwitchTenant?: boolean;
|
||||||
/** 角色集合 */
|
/** 角色集合 */
|
||||||
roles: string[];
|
roles: string[];
|
||||||
/** 权限集合 */
|
/** 权限集合 */
|
||||||
@@ -66,8 +66,6 @@ export interface UserForm {
|
|||||||
id?: string;
|
id?: string;
|
||||||
/** 用户头像 */
|
/** 用户头像 */
|
||||||
avatar?: string;
|
avatar?: string;
|
||||||
/** 租户身份标识(PLATFORM/TENANT) */
|
|
||||||
tenantScope?: string;
|
|
||||||
/** 部门ID */
|
/** 部门ID */
|
||||||
deptId?: string;
|
deptId?: string;
|
||||||
/** 用户邮箱 */
|
/** 用户邮箱 */
|
||||||
|
|||||||
16
src/utils/tenant.ts
Normal file
16
src/utils/tenant.ts
Normal file
@@ -0,0 +1,16 @@
|
|||||||
|
import { appConfig } from "@/settings";
|
||||||
|
import { PLATFORM_TENANT_ID } from "@/constants";
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 是否启用多租户
|
||||||
|
*/
|
||||||
|
export const isTenantEnabled = () => appConfig.tenantEnabled;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 判断是否平台租户
|
||||||
|
*
|
||||||
|
* @description
|
||||||
|
* 平台租户不参与套餐与菜单配置
|
||||||
|
*/
|
||||||
|
export const isPlatformTenantId = (tenantId?: string | number) =>
|
||||||
|
Number(tenantId) === PLATFORM_TENANT_ID;
|
||||||
@@ -74,6 +74,13 @@
|
|||||||
<el-table-column label="路由路径" align="left" width="150" prop="routePath" />
|
<el-table-column label="路由路径" align="left" width="150" prop="routePath" />
|
||||||
<el-table-column label="组件路径" align="left" width="250" prop="component" />
|
<el-table-column label="组件路径" align="left" width="250" prop="component" />
|
||||||
<el-table-column label="权限标识" align="center" width="200" prop="perm" />
|
<el-table-column label="权限标识" align="center" width="200" prop="perm" />
|
||||||
|
<el-table-column v-if="showMenuScope" label="范围" align="center" width="100">
|
||||||
|
<template #default="scope">
|
||||||
|
<el-tag v-if="scope.row.scope === MenuScopeEnum.PLATFORM" type="danger">平台</el-tag>
|
||||||
|
<el-tag v-else type="success">业务</el-tag>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
|
||||||
<el-table-column label="状态" align="center" width="80">
|
<el-table-column label="状态" align="center" width="80">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<el-tag v-if="scope.row.visible === 1" type="success">显示</el-tag>
|
<el-tag v-if="scope.row.visible === 1" type="success">显示</el-tag>
|
||||||
@@ -262,6 +269,17 @@
|
|||||||
</div>
|
</div>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item
|
||||||
|
v-if="formData.type !== MenuTypeEnum.BUTTON && showMenuScope"
|
||||||
|
prop="scope"
|
||||||
|
label="菜单范围"
|
||||||
|
>
|
||||||
|
<el-radio-group v-model="formData.scope">
|
||||||
|
<el-radio :value="MenuScopeEnum.PLATFORM">平台菜单</el-radio>
|
||||||
|
<el-radio :value="MenuScopeEnum.TENANT">业务菜单</el-radio>
|
||||||
|
</el-radio-group>
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
<el-form-item v-if="formData.type !== MenuTypeEnum.BUTTON" prop="visible" label="显示状态">
|
<el-form-item v-if="formData.type !== MenuTypeEnum.BUTTON" prop="visible" label="显示状态">
|
||||||
<el-radio-group v-model="formData.visible">
|
<el-radio-group v-model="formData.visible">
|
||||||
<el-radio :value="1">显示</el-radio>
|
<el-radio :value="1">显示</el-radio>
|
||||||
@@ -346,7 +364,8 @@ import { DeviceEnum } from "@/enums/settings";
|
|||||||
|
|
||||||
import MenuAPI from "@/api/system/menu";
|
import MenuAPI from "@/api/system/menu";
|
||||||
import type { MenuQueryParams, MenuForm, MenuItem } from "@/types/api";
|
import type { MenuQueryParams, MenuForm, MenuItem } from "@/types/api";
|
||||||
import { MenuTypeEnum } from "@/enums/business";
|
import { MenuScopeEnum, MenuTypeEnum } from "@/enums/business";
|
||||||
|
import { isTenantEnabled } from "@/utils/tenant";
|
||||||
|
|
||||||
defineOptions({
|
defineOptions({
|
||||||
name: "SysMenu",
|
name: "SysMenu",
|
||||||
@@ -367,6 +386,8 @@ const dialog = reactive({
|
|||||||
const drawerSize = computed(() => (appStore.device === DeviceEnum.DESKTOP ? "600px" : "90%"));
|
const drawerSize = computed(() => (appStore.device === DeviceEnum.DESKTOP ? "600px" : "90%"));
|
||||||
// 查询参数
|
// 查询参数
|
||||||
const queryParams = reactive<MenuQueryParams>({});
|
const queryParams = reactive<MenuQueryParams>({});
|
||||||
|
// 多租户关闭时,隐藏菜单范围(避免单租户误配置)
|
||||||
|
const showMenuScope = computed(() => isTenantEnabled());
|
||||||
// 菜单表格数据
|
// 菜单表格数据
|
||||||
const menuTableData = ref<MenuItem[]>([]);
|
const menuTableData = ref<MenuItem[]>([]);
|
||||||
// 顶级菜单下拉选项
|
// 顶级菜单下拉选项
|
||||||
@@ -376,6 +397,7 @@ const initialMenuFormData = ref<MenuForm>({
|
|||||||
id: undefined,
|
id: undefined,
|
||||||
parentId: "0",
|
parentId: "0",
|
||||||
visible: 1,
|
visible: 1,
|
||||||
|
scope: MenuScopeEnum.TENANT,
|
||||||
sort: 1,
|
sort: 1,
|
||||||
type: MenuTypeEnum.MENU, // 默认菜单
|
type: MenuTypeEnum.MENU, // 默认菜单
|
||||||
alwaysShow: 0,
|
alwaysShow: 0,
|
||||||
@@ -549,6 +571,7 @@ function resetForm() {
|
|||||||
id: undefined,
|
id: undefined,
|
||||||
parentId: "0",
|
parentId: "0",
|
||||||
visible: 1,
|
visible: 1,
|
||||||
|
scope: MenuScopeEnum.TENANT,
|
||||||
sort: 1,
|
sort: 1,
|
||||||
type: MenuTypeEnum.MENU, // 默认菜单
|
type: MenuTypeEnum.MENU, // 默认菜单
|
||||||
alwaysShow: 0,
|
alwaysShow: 0,
|
||||||
|
|||||||
454
src/views/system/tenant-plan/index.vue
Normal file
454
src/views/system/tenant-plan/index.vue
Normal file
@@ -0,0 +1,454 @@
|
|||||||
|
<template>
|
||||||
|
<div class="app-container">
|
||||||
|
<!-- 搜索区域 -->
|
||||||
|
<div class="filter-section">
|
||||||
|
<el-form ref="queryFormRef" :model="queryParams" :inline="true">
|
||||||
|
<el-form-item label="关键字" prop="keywords">
|
||||||
|
<el-input
|
||||||
|
v-model="queryParams.keywords"
|
||||||
|
placeholder="套餐名称/套餐编码"
|
||||||
|
clearable
|
||||||
|
@keyup.enter="handleQuery"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item label="状态" prop="status">
|
||||||
|
<el-select v-model="queryParams.status" placeholder="全部" clearable style="width: 120px">
|
||||||
|
<el-option label="启用" :value="1" />
|
||||||
|
<el-option label="停用" :value="0" />
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item class="search-buttons">
|
||||||
|
<el-button type="primary" icon="search" @click="handleQuery">搜索</el-button>
|
||||||
|
<el-button icon="refresh" @click="handleResetQuery">重置</el-button>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<el-card shadow="hover" class="table-section">
|
||||||
|
<div class="table-section__toolbar">
|
||||||
|
<div class="table-section__toolbar--actions">
|
||||||
|
<el-button
|
||||||
|
v-hasPerm="['sys:tenant-plan:create']"
|
||||||
|
type="success"
|
||||||
|
icon="plus"
|
||||||
|
@click="handleOpenDialog()"
|
||||||
|
>
|
||||||
|
新增
|
||||||
|
</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<el-table
|
||||||
|
ref="dataTableRef"
|
||||||
|
v-loading="loading"
|
||||||
|
:data="pageData"
|
||||||
|
highlight-current-row
|
||||||
|
border
|
||||||
|
class="table-section__content"
|
||||||
|
>
|
||||||
|
<el-table-column type="index" label="序号" width="60" />
|
||||||
|
<el-table-column label="套餐名称" prop="name" min-width="120" />
|
||||||
|
<el-table-column label="套餐编码" prop="code" width="160" />
|
||||||
|
<el-table-column label="状态" width="100" align="center">
|
||||||
|
<template #default="scope">
|
||||||
|
<el-tag v-if="scope.row.status === 1" type="success">启用</el-tag>
|
||||||
|
<el-tag v-else type="info">停用</el-tag>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="排序" prop="sort" width="80" align="center" />
|
||||||
|
<el-table-column label="备注" prop="remark" min-width="140" />
|
||||||
|
<el-table-column label="创建时间" prop="createTime" width="180" />
|
||||||
|
<el-table-column fixed="right" label="操作" width="240">
|
||||||
|
<template #default="scope">
|
||||||
|
<el-button
|
||||||
|
v-hasPerm="['sys:tenant-plan:assign']"
|
||||||
|
type="primary"
|
||||||
|
size="small"
|
||||||
|
link
|
||||||
|
icon="menu"
|
||||||
|
@click="handleOpenPlanMenuDialog(scope.row)"
|
||||||
|
>
|
||||||
|
菜单配置
|
||||||
|
</el-button>
|
||||||
|
<el-button
|
||||||
|
v-hasPerm="['sys:tenant-plan:update']"
|
||||||
|
type="primary"
|
||||||
|
size="small"
|
||||||
|
link
|
||||||
|
icon="edit"
|
||||||
|
@click="handleOpenDialog(scope.row.id)"
|
||||||
|
>
|
||||||
|
编辑
|
||||||
|
</el-button>
|
||||||
|
<el-button
|
||||||
|
v-hasPerm="['sys:tenant-plan:delete']"
|
||||||
|
type="danger"
|
||||||
|
size="small"
|
||||||
|
link
|
||||||
|
icon="delete"
|
||||||
|
@click="handleDelete(scope.row.id)"
|
||||||
|
>
|
||||||
|
删除
|
||||||
|
</el-button>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
|
||||||
|
<pagination
|
||||||
|
v-if="total > 0"
|
||||||
|
v-model:total="total"
|
||||||
|
v-model:page="queryParams.pageNum"
|
||||||
|
v-model:limit="queryParams.pageSize"
|
||||||
|
@pagination="fetchData"
|
||||||
|
/>
|
||||||
|
</el-card>
|
||||||
|
|
||||||
|
<!-- 租户套餐表单弹窗 -->
|
||||||
|
<el-dialog
|
||||||
|
v-model="dialog.visible"
|
||||||
|
:title="dialog.title"
|
||||||
|
width="520px"
|
||||||
|
@close="handleCloseDialog"
|
||||||
|
>
|
||||||
|
<el-form ref="dataFormRef" :model="formData" :rules="rules" label-width="100px">
|
||||||
|
<el-form-item label="套餐名称" prop="name">
|
||||||
|
<el-input v-model="formData.name" placeholder="请输入套餐名称" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="套餐编码" prop="code">
|
||||||
|
<el-input v-model="formData.code" placeholder="请输入套餐编码" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="状态" prop="status">
|
||||||
|
<el-radio-group v-model="formData.status">
|
||||||
|
<el-radio :value="1">启用</el-radio>
|
||||||
|
<el-radio :value="0">停用</el-radio>
|
||||||
|
</el-radio-group>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="排序" prop="sort">
|
||||||
|
<el-input-number
|
||||||
|
v-model="formData.sort"
|
||||||
|
controls-position="right"
|
||||||
|
:min="0"
|
||||||
|
style="width: 120px"
|
||||||
|
/>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="备注" prop="remark">
|
||||||
|
<el-input v-model="formData.remark" type="textarea" :rows="3" placeholder="可选" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
<template #footer>
|
||||||
|
<div class="dialog-footer">
|
||||||
|
<el-button type="primary" @click="handleSubmit">确定</el-button>
|
||||||
|
<el-button @click="handleCloseDialog">取消</el-button>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-dialog>
|
||||||
|
|
||||||
|
<!-- 方案菜单配置 -->
|
||||||
|
<el-drawer
|
||||||
|
v-model="planMenuDialogVisible"
|
||||||
|
:title="'【' + checkedPlan.name + '】菜单配置'"
|
||||||
|
size="600px"
|
||||||
|
@close="handleClosePlanMenuDialog"
|
||||||
|
>
|
||||||
|
<div class="flex-x-between">
|
||||||
|
<el-input v-model="menuKeywords" clearable class="w-[150px]" placeholder="菜单名称">
|
||||||
|
<template #prefix>
|
||||||
|
<Search />
|
||||||
|
</template>
|
||||||
|
</el-input>
|
||||||
|
|
||||||
|
<div class="flex-center ml-5">
|
||||||
|
<el-button type="primary" size="small" plain @click="toggleMenuTree">
|
||||||
|
<template #icon>
|
||||||
|
<Switch />
|
||||||
|
</template>
|
||||||
|
{{ menuExpanded ? "收缩" : "展开" }}
|
||||||
|
</el-button>
|
||||||
|
<el-checkbox v-model="menuParentChildLinked" class="ml-5" @change="handleMenuLinkChange">
|
||||||
|
父子联动
|
||||||
|
</el-checkbox>
|
||||||
|
|
||||||
|
<el-tooltip placement="bottom">
|
||||||
|
<template #content>
|
||||||
|
如果只需勾选菜单权限,不需要勾选子菜单或者按钮权限,请关闭父子联动
|
||||||
|
</template>
|
||||||
|
<el-icon class="ml-1 color-[--el-color-primary] inline-block cursor-pointer">
|
||||||
|
<QuestionFilled />
|
||||||
|
</el-icon>
|
||||||
|
</el-tooltip>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<el-tree
|
||||||
|
ref="menuTreeRef"
|
||||||
|
node-key="value"
|
||||||
|
show-checkbox
|
||||||
|
:data="menuPermOptions"
|
||||||
|
:filter-node-method="handleMenuFilter"
|
||||||
|
:default-expand-all="true"
|
||||||
|
:check-strictly="!menuParentChildLinked"
|
||||||
|
class="mt-5"
|
||||||
|
>
|
||||||
|
<template #default="{ data }">
|
||||||
|
{{ data.label }}
|
||||||
|
</template>
|
||||||
|
</el-tree>
|
||||||
|
|
||||||
|
<template #footer>
|
||||||
|
<div class="dialog-footer">
|
||||||
|
<el-button
|
||||||
|
v-hasPerm="['sys:tenant-plan:assign']"
|
||||||
|
type="primary"
|
||||||
|
@click="handlePlanMenuSubmit"
|
||||||
|
>
|
||||||
|
确定
|
||||||
|
</el-button>
|
||||||
|
<el-button @click="planMenuDialogVisible = false">取消</el-button>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-drawer>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
defineOptions({
|
||||||
|
name: "TenantPlan",
|
||||||
|
inheritAttrs: false,
|
||||||
|
});
|
||||||
|
|
||||||
|
import { ElMessage, ElMessageBox } from "element-plus";
|
||||||
|
import { useDebounceFn } from "@vueuse/core";
|
||||||
|
|
||||||
|
import MenuAPI from "@/api/system/menu";
|
||||||
|
import TenantPlanAPI from "@/api/system/tenant-plan";
|
||||||
|
import type {
|
||||||
|
TenantPlanForm,
|
||||||
|
TenantPlanItem,
|
||||||
|
TenantPlanQueryParams,
|
||||||
|
OptionItem,
|
||||||
|
} from "@/types/api";
|
||||||
|
import { MenuScopeEnum } from "@/enums/business";
|
||||||
|
|
||||||
|
const queryFormRef = ref();
|
||||||
|
const dataFormRef = ref();
|
||||||
|
const dataTableRef = ref();
|
||||||
|
const menuTreeRef = ref();
|
||||||
|
|
||||||
|
const loading = ref(false);
|
||||||
|
const total = ref(0);
|
||||||
|
|
||||||
|
const queryParams = reactive<TenantPlanQueryParams>({
|
||||||
|
pageNum: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
keywords: "",
|
||||||
|
});
|
||||||
|
|
||||||
|
const pageData = ref<TenantPlanItem[]>([]);
|
||||||
|
const menuPermOptions = ref<OptionItem[]>([]);
|
||||||
|
|
||||||
|
const dialog = reactive({
|
||||||
|
title: "",
|
||||||
|
visible: false,
|
||||||
|
});
|
||||||
|
|
||||||
|
const formData = reactive<TenantPlanForm>({
|
||||||
|
id: undefined,
|
||||||
|
name: "",
|
||||||
|
code: "",
|
||||||
|
status: 1,
|
||||||
|
sort: 1,
|
||||||
|
remark: "",
|
||||||
|
});
|
||||||
|
|
||||||
|
const rules = reactive({
|
||||||
|
name: [{ required: true, message: "请输入套餐名称", trigger: "blur" }],
|
||||||
|
code: [{ required: true, message: "请输入套餐编码", trigger: "blur" }],
|
||||||
|
status: [{ required: true, message: "请选择状态", trigger: "change" }],
|
||||||
|
});
|
||||||
|
|
||||||
|
const planMenuDialogVisible = ref(false);
|
||||||
|
const checkedPlan = ref<{ id?: number; name?: string }>({});
|
||||||
|
const menuKeywords = ref("");
|
||||||
|
const menuExpanded = ref(true);
|
||||||
|
const menuParentChildLinked = ref(true);
|
||||||
|
|
||||||
|
function fetchData() {
|
||||||
|
loading.value = true;
|
||||||
|
TenantPlanAPI.getPage(queryParams)
|
||||||
|
.then((res) => {
|
||||||
|
pageData.value = res.data;
|
||||||
|
total.value = res.page?.total ?? 0;
|
||||||
|
})
|
||||||
|
.finally(() => {
|
||||||
|
loading.value = false;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleQuery() {
|
||||||
|
queryParams.pageNum = 1;
|
||||||
|
fetchData();
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleResetQuery() {
|
||||||
|
queryFormRef.value?.resetFields();
|
||||||
|
queryParams.pageNum = 1;
|
||||||
|
fetchData();
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handleOpenDialog(planId?: number) {
|
||||||
|
dialog.visible = true;
|
||||||
|
if (planId) {
|
||||||
|
dialog.title = "修改套餐";
|
||||||
|
const data = await TenantPlanAPI.getFormData(String(planId));
|
||||||
|
Object.assign(formData, data);
|
||||||
|
if (formData.status == null) {
|
||||||
|
formData.status = 1;
|
||||||
|
}
|
||||||
|
if (formData.sort == null) {
|
||||||
|
formData.sort = 1;
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
dialog.title = "新增套餐";
|
||||||
|
Object.assign(formData, {
|
||||||
|
id: undefined,
|
||||||
|
name: "",
|
||||||
|
code: "",
|
||||||
|
status: 1,
|
||||||
|
sort: 1,
|
||||||
|
remark: "",
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleCloseDialog() {
|
||||||
|
dialog.visible = false;
|
||||||
|
dataFormRef.value?.resetFields();
|
||||||
|
dataFormRef.value?.clearValidate();
|
||||||
|
Object.assign(formData, {
|
||||||
|
id: undefined,
|
||||||
|
name: "",
|
||||||
|
code: "",
|
||||||
|
status: 1,
|
||||||
|
sort: 1,
|
||||||
|
remark: "",
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
const handleSubmit = useDebounceFn(async () => {
|
||||||
|
const valid = await dataFormRef.value?.validate().catch(() => false);
|
||||||
|
if (!valid) return;
|
||||||
|
|
||||||
|
loading.value = true;
|
||||||
|
try {
|
||||||
|
if (formData.id) {
|
||||||
|
await TenantPlanAPI.update(String(formData.id), formData);
|
||||||
|
ElMessage.success("修改成功");
|
||||||
|
} else {
|
||||||
|
await TenantPlanAPI.create(formData);
|
||||||
|
ElMessage.success("新增成功");
|
||||||
|
}
|
||||||
|
handleCloseDialog();
|
||||||
|
handleResetQuery();
|
||||||
|
} finally {
|
||||||
|
loading.value = false;
|
||||||
|
}
|
||||||
|
}, 300);
|
||||||
|
|
||||||
|
function handleDelete(planId?: number) {
|
||||||
|
if (!planId) return;
|
||||||
|
ElMessageBox.confirm("确认删除该租户套餐吗?", "警告", {
|
||||||
|
confirmButtonText: "确定",
|
||||||
|
cancelButtonText: "取消",
|
||||||
|
type: "warning",
|
||||||
|
}).then(() => {
|
||||||
|
loading.value = true;
|
||||||
|
TenantPlanAPI.deleteByIds(String(planId))
|
||||||
|
.then(() => {
|
||||||
|
ElMessage.success("删除成功");
|
||||||
|
handleResetQuery();
|
||||||
|
})
|
||||||
|
.finally(() => {
|
||||||
|
loading.value = false;
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handleOpenPlanMenuDialog(row: TenantPlanItem) {
|
||||||
|
if (!row.id) return;
|
||||||
|
planMenuDialogVisible.value = true;
|
||||||
|
loading.value = true;
|
||||||
|
checkedPlan.value = { id: row.id, name: row.name };
|
||||||
|
|
||||||
|
try {
|
||||||
|
// 套餐菜单仅允许业务菜单
|
||||||
|
const menuOptions = await MenuAPI.getOptions(false, MenuScopeEnum.TENANT);
|
||||||
|
menuPermOptions.value = menuOptions;
|
||||||
|
const menuIds = await TenantPlanAPI.getPlanMenuIds(row.id);
|
||||||
|
await nextTick();
|
||||||
|
menuTreeRef.value?.setCheckedKeys([], false);
|
||||||
|
menuIds.forEach((menuId) => menuTreeRef.value?.setChecked(menuId, true, false));
|
||||||
|
} finally {
|
||||||
|
loading.value = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleClosePlanMenuDialog() {
|
||||||
|
planMenuDialogVisible.value = false;
|
||||||
|
menuKeywords.value = "";
|
||||||
|
menuExpanded.value = true;
|
||||||
|
menuParentChildLinked.value = true;
|
||||||
|
menuTreeRef.value?.setCheckedKeys([], false);
|
||||||
|
}
|
||||||
|
|
||||||
|
function toggleMenuTree() {
|
||||||
|
menuExpanded.value = !menuExpanded.value;
|
||||||
|
if (menuTreeRef.value) {
|
||||||
|
Object.values(menuTreeRef.value.store.nodesMap).forEach((node: any) => {
|
||||||
|
if (menuExpanded.value) {
|
||||||
|
node.expand();
|
||||||
|
} else {
|
||||||
|
node.collapse();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleMenuLinkChange(val: boolean) {
|
||||||
|
menuParentChildLinked.value = val;
|
||||||
|
}
|
||||||
|
|
||||||
|
watch(menuKeywords, (val) => {
|
||||||
|
menuTreeRef.value?.filter(val);
|
||||||
|
});
|
||||||
|
|
||||||
|
function handleMenuFilter(value: string, data: { [key: string]: any }) {
|
||||||
|
if (!value) return true;
|
||||||
|
return data.label.includes(value);
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handlePlanMenuSubmit() {
|
||||||
|
const planId = checkedPlan.value.id;
|
||||||
|
if (!planId) return;
|
||||||
|
|
||||||
|
const checkedMenuIds: number[] = menuTreeRef
|
||||||
|
.value!.getCheckedNodes(false, true)
|
||||||
|
.map((node: any) => node.value);
|
||||||
|
|
||||||
|
loading.value = true;
|
||||||
|
try {
|
||||||
|
await TenantPlanAPI.updatePlanMenus(planId, checkedMenuIds);
|
||||||
|
ElMessage.success("菜单配置成功");
|
||||||
|
planMenuDialogVisible.value = false;
|
||||||
|
} finally {
|
||||||
|
loading.value = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
fetchData();
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss"></style>
|
||||||
@@ -57,9 +57,19 @@
|
|||||||
class="table-section__content"
|
class="table-section__content"
|
||||||
@selection-change="handleSelectionChange"
|
@selection-change="handleSelectionChange"
|
||||||
>
|
>
|
||||||
<el-table-column type="selection" width="55" align="center" />
|
<el-table-column
|
||||||
|
type="selection"
|
||||||
|
width="55"
|
||||||
|
align="center"
|
||||||
|
:selectable="isTenantSelectable"
|
||||||
|
/>
|
||||||
<el-table-column label="租户名称" prop="name" min-width="160" />
|
<el-table-column label="租户名称" prop="name" min-width="160" />
|
||||||
<el-table-column label="租户编码" prop="code" width="140" />
|
<el-table-column label="租户编码" prop="code" width="140" />
|
||||||
|
<el-table-column label="租户套餐" min-width="140">
|
||||||
|
<template #default="scope">
|
||||||
|
<span>{{ resolvePlanLabel(scope.row.planId) }}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
<el-table-column label="域名" prop="domain" min-width="160" />
|
<el-table-column label="域名" prop="domain" min-width="160" />
|
||||||
<el-table-column label="联系人" prop="contactName" width="120" />
|
<el-table-column label="联系人" prop="contactName" width="120" />
|
||||||
<el-table-column label="电话" prop="contactPhone" width="140" />
|
<el-table-column label="电话" prop="contactPhone" width="140" />
|
||||||
@@ -73,11 +83,7 @@
|
|||||||
inactive-text="禁用"
|
inactive-text="禁用"
|
||||||
:active-value="1"
|
:active-value="1"
|
||||||
:inactive-value="0"
|
:inactive-value="0"
|
||||||
@change="
|
@change="handleStatusChange(scope.row.id, $event)"
|
||||||
(val) => {
|
|
||||||
pageData.length > 0 && handleChangeStatus(scope.row.id, Number(val));
|
|
||||||
}
|
|
||||||
"
|
|
||||||
/>
|
/>
|
||||||
<el-tag v-else :type="scope.row.status === 1 ? 'success' : 'info'">
|
<el-tag v-else :type="scope.row.status === 1 ? 'success' : 'info'">
|
||||||
{{ scope.row.status === 1 ? "正常" : "禁用" }}
|
{{ scope.row.status === 1 ? "正常" : "禁用" }}
|
||||||
@@ -86,8 +92,19 @@
|
|||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="过期时间" prop="expireTime" width="180" />
|
<el-table-column label="过期时间" prop="expireTime" width="180" />
|
||||||
<el-table-column label="创建时间" prop="createTime" width="180" />
|
<el-table-column label="创建时间" prop="createTime" width="180" />
|
||||||
<el-table-column fixed="right" label="操作" width="180">
|
<el-table-column fixed="right" label="操作" width="260">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
|
<el-button
|
||||||
|
v-if="!isPlatformTenantId(scope.row.id)"
|
||||||
|
v-hasPerm="['sys:tenant:update']"
|
||||||
|
type="primary"
|
||||||
|
size="small"
|
||||||
|
link
|
||||||
|
icon="menu"
|
||||||
|
@click="handleOpenPlanMenuDialog(scope.row)"
|
||||||
|
>
|
||||||
|
方案菜单
|
||||||
|
</el-button>
|
||||||
<el-button
|
<el-button
|
||||||
v-hasPerm="['sys:tenant:update']"
|
v-hasPerm="['sys:tenant:update']"
|
||||||
type="primary"
|
type="primary"
|
||||||
@@ -99,6 +116,7 @@
|
|||||||
编辑
|
编辑
|
||||||
</el-button>
|
</el-button>
|
||||||
<el-button
|
<el-button
|
||||||
|
v-if="!isPlatformTenantId(scope.row.id)"
|
||||||
v-hasPerm="['sys:tenant:delete']"
|
v-hasPerm="['sys:tenant:delete']"
|
||||||
type="danger"
|
type="danger"
|
||||||
size="small"
|
size="small"
|
||||||
@@ -145,6 +163,17 @@
|
|||||||
<el-input v-model="formData.domain" placeholder="demo.youlai.tech(可选)" />
|
<el-input v-model="formData.domain" placeholder="demo.youlai.tech(可选)" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item v-if="!isPlatformTenant" label="租户套餐" prop="planId">
|
||||||
|
<el-select v-model="formData.planId" placeholder="请选择租户套餐" style="width: 100%">
|
||||||
|
<el-option
|
||||||
|
v-for="item in planOptions"
|
||||||
|
:key="item.value"
|
||||||
|
:label="item.label"
|
||||||
|
:value="item.value"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
<el-form-item label="联系人" prop="contactName">
|
<el-form-item label="联系人" prop="contactName">
|
||||||
<el-input v-model="formData.contactName" placeholder="可选" />
|
<el-input v-model="formData.contactName" placeholder="可选" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
@@ -198,6 +227,71 @@
|
|||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</el-dialog>
|
</el-dialog>
|
||||||
|
|
||||||
|
<!-- 方案菜单配置 -->
|
||||||
|
<el-drawer
|
||||||
|
v-model="planMenuDialogVisible"
|
||||||
|
:title="'【' + checkedPlan.name + '】方案菜单配置'"
|
||||||
|
size="600px"
|
||||||
|
@close="handleClosePlanMenuDialog"
|
||||||
|
>
|
||||||
|
<div class="flex-x-between">
|
||||||
|
<el-input v-model="menuKeywords" clearable class="w-[150px]" placeholder="菜单名称">
|
||||||
|
<template #prefix>
|
||||||
|
<Search />
|
||||||
|
</template>
|
||||||
|
</el-input>
|
||||||
|
|
||||||
|
<div class="flex-center ml-5">
|
||||||
|
<el-button type="primary" size="small" plain @click="toggleMenuTree">
|
||||||
|
<template #icon>
|
||||||
|
<Switch />
|
||||||
|
</template>
|
||||||
|
{{ menuExpanded ? "收缩" : "展开" }}
|
||||||
|
</el-button>
|
||||||
|
<el-checkbox v-model="menuParentChildLinked" class="ml-5" @change="handleMenuLinkChange">
|
||||||
|
父子联动
|
||||||
|
</el-checkbox>
|
||||||
|
|
||||||
|
<el-tooltip placement="bottom">
|
||||||
|
<template #content>
|
||||||
|
如果只需勾选菜单权限,不需要勾选子菜单或者按钮权限,请关闭父子联动
|
||||||
|
</template>
|
||||||
|
<el-icon class="ml-1 color-[--el-color-primary] inline-block cursor-pointer">
|
||||||
|
<QuestionFilled />
|
||||||
|
</el-icon>
|
||||||
|
</el-tooltip>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<el-tree
|
||||||
|
ref="menuTreeRef"
|
||||||
|
node-key="value"
|
||||||
|
show-checkbox
|
||||||
|
:data="menuPermOptions"
|
||||||
|
:filter-node-method="handleMenuFilter"
|
||||||
|
:default-expand-all="true"
|
||||||
|
:check-strictly="!menuParentChildLinked"
|
||||||
|
class="mt-5"
|
||||||
|
>
|
||||||
|
<template #default="{ data }">
|
||||||
|
{{ data.label }}
|
||||||
|
</template>
|
||||||
|
</el-tree>
|
||||||
|
|
||||||
|
<template #footer>
|
||||||
|
<div class="dialog-footer">
|
||||||
|
<el-button
|
||||||
|
v-hasPerm="['sys:tenant-plan:assign']"
|
||||||
|
type="primary"
|
||||||
|
@click="handlePlanMenuSubmit"
|
||||||
|
>
|
||||||
|
确定
|
||||||
|
</el-button>
|
||||||
|
<el-button @click="planMenuDialogVisible = false">取消</el-button>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-drawer>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -212,10 +306,15 @@ import { useDebounceFn } from "@vueuse/core";
|
|||||||
import { hasPerm } from "@/utils/auth";
|
import { hasPerm } from "@/utils/auth";
|
||||||
|
|
||||||
import TenantAPI from "@/api/system/tenant";
|
import TenantAPI from "@/api/system/tenant";
|
||||||
|
import TenantPlanAPI from "@/api/system/tenant-plan";
|
||||||
|
import MenuAPI from "@/api/system/menu";
|
||||||
import type { TenantCreateForm, TenantForm, TenantQueryParams, TenantItem } from "@/types/api";
|
import type { TenantCreateForm, TenantForm, TenantQueryParams, TenantItem } from "@/types/api";
|
||||||
|
import { MenuScopeEnum } from "@/enums/business";
|
||||||
|
import { isPlatformTenantId } from "@/utils/tenant";
|
||||||
|
|
||||||
const queryFormRef = ref();
|
const queryFormRef = ref();
|
||||||
const dataFormRef = ref();
|
const dataFormRef = ref();
|
||||||
|
const menuTreeRef = ref();
|
||||||
|
|
||||||
const loading = ref(false);
|
const loading = ref(false);
|
||||||
const ids = ref<number[]>([]);
|
const ids = ref<number[]>([]);
|
||||||
@@ -229,11 +328,21 @@ const queryParams = reactive<TenantQueryParams>({
|
|||||||
|
|
||||||
const pageData = ref<TenantItem[]>([]);
|
const pageData = ref<TenantItem[]>([]);
|
||||||
|
|
||||||
|
const menuPermOptions = ref<OptionItem[]>([]);
|
||||||
|
|
||||||
const dialog = reactive({
|
const dialog = reactive({
|
||||||
title: "",
|
title: "",
|
||||||
visible: false,
|
visible: false,
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const planMenuDialogVisible = ref(false);
|
||||||
|
const checkedPlan = ref<{ id?: number; name?: string }>({});
|
||||||
|
const menuKeywords = ref("");
|
||||||
|
const menuExpanded = ref(true);
|
||||||
|
const menuParentChildLinked = ref(true);
|
||||||
|
|
||||||
|
const planOptions = ref<OptionItem[]>([]);
|
||||||
|
|
||||||
const formData = reactive<TenantForm & TenantCreateForm>({
|
const formData = reactive<TenantForm & TenantCreateForm>({
|
||||||
id: undefined,
|
id: undefined,
|
||||||
name: "",
|
name: "",
|
||||||
@@ -242,24 +351,57 @@ const formData = reactive<TenantForm & TenantCreateForm>({
|
|||||||
contactName: "",
|
contactName: "",
|
||||||
contactPhone: "",
|
contactPhone: "",
|
||||||
contactEmail: "",
|
contactEmail: "",
|
||||||
|
planId: undefined,
|
||||||
remark: "",
|
remark: "",
|
||||||
expireTime: undefined,
|
expireTime: undefined,
|
||||||
status: 1,
|
status: 1,
|
||||||
adminUsername: "",
|
adminUsername: "",
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const isPlatformTenant = computed(() => isPlatformTenantId(formData.id));
|
||||||
|
|
||||||
|
// 平台租户不允许批量删除
|
||||||
|
const isTenantSelectable = (row: TenantItem) => !isPlatformTenantId(row.id);
|
||||||
|
|
||||||
const rules = reactive({
|
const rules = reactive({
|
||||||
name: [{ required: true, message: "请输入租户名称", trigger: "blur" }],
|
name: [{ required: true, message: "请输入租户名称", trigger: "blur" }],
|
||||||
code: [{ required: true, message: "请输入租户编码", trigger: "blur" }],
|
code: [{ required: true, message: "请输入租户编码", trigger: "blur" }],
|
||||||
|
planId: [
|
||||||
|
{
|
||||||
|
// 平台租户不绑定套餐
|
||||||
|
validator: (_: unknown, value: number | undefined, callback: (error?: Error) => void) => {
|
||||||
|
if (isPlatformTenant.value) return callback();
|
||||||
|
if (value == null) return callback(new Error("请选择租户套餐"));
|
||||||
|
return callback();
|
||||||
|
},
|
||||||
|
trigger: "change",
|
||||||
|
},
|
||||||
|
],
|
||||||
});
|
});
|
||||||
|
|
||||||
const hasPermChangeStatus = computed(() => hasPerm("sys:tenant:change-status"));
|
const hasPermChangeStatus = computed(() => hasPerm("sys:tenant:change-status"));
|
||||||
|
|
||||||
|
function handleStatusChange(tenantId: string | number | undefined, val: string | number | boolean) {
|
||||||
|
if (tenantId == null) return;
|
||||||
|
if (pageData.value.length > 0) {
|
||||||
|
handleChangeStatus(String(tenantId), Number(val));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function resolvePlanLabel(planId?: number) {
|
||||||
|
if (planId == null) return "-";
|
||||||
|
const matched = planOptions.value.find((item) => Number(item.value) === planId);
|
||||||
|
return matched?.label || String(planId);
|
||||||
|
}
|
||||||
|
|
||||||
function fetchData() {
|
function fetchData() {
|
||||||
loading.value = true;
|
loading.value = true;
|
||||||
TenantAPI.getPage(queryParams)
|
TenantAPI.getPage(queryParams)
|
||||||
.then((res) => {
|
.then((res) => {
|
||||||
pageData.value = res.data;
|
pageData.value = res.data.map((item) => ({
|
||||||
|
...item,
|
||||||
|
planId: item.planId != null ? Number(item.planId) : undefined,
|
||||||
|
}));
|
||||||
total.value = res.page?.total ?? 0;
|
total.value = res.page?.total ?? 0;
|
||||||
})
|
})
|
||||||
.finally(() => {
|
.finally(() => {
|
||||||
@@ -267,6 +409,85 @@ function fetchData() {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
async function handleOpenPlanMenuDialog(row: TenantItem) {
|
||||||
|
if (isPlatformTenantId(row.id)) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const planId = row.planId;
|
||||||
|
if (!planId) {
|
||||||
|
ElMessage.warning("请先为租户选择套餐");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
planMenuDialogVisible.value = true;
|
||||||
|
loading.value = true;
|
||||||
|
checkedPlan.value = { id: planId, name: resolvePlanLabel(planId) };
|
||||||
|
|
||||||
|
try {
|
||||||
|
// 套餐菜单只允许配置业务菜单
|
||||||
|
const menuOptions = await MenuAPI.getOptions(false, MenuScopeEnum.TENANT);
|
||||||
|
menuPermOptions.value = menuOptions;
|
||||||
|
const menuIds = await TenantPlanAPI.getPlanMenuIds(planId);
|
||||||
|
await nextTick();
|
||||||
|
menuTreeRef.value?.setCheckedKeys([], false);
|
||||||
|
menuIds.forEach((menuId) => menuTreeRef.value?.setChecked(menuId, true, false));
|
||||||
|
} finally {
|
||||||
|
loading.value = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleClosePlanMenuDialog() {
|
||||||
|
planMenuDialogVisible.value = false;
|
||||||
|
menuKeywords.value = "";
|
||||||
|
menuExpanded.value = true;
|
||||||
|
menuParentChildLinked.value = true;
|
||||||
|
menuTreeRef.value?.setCheckedKeys([], false);
|
||||||
|
}
|
||||||
|
|
||||||
|
function toggleMenuTree() {
|
||||||
|
menuExpanded.value = !menuExpanded.value;
|
||||||
|
if (menuTreeRef.value) {
|
||||||
|
Object.values(menuTreeRef.value.store.nodesMap).forEach((node: any) => {
|
||||||
|
if (menuExpanded.value) {
|
||||||
|
node.expand();
|
||||||
|
} else {
|
||||||
|
node.collapse();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleMenuLinkChange(val: boolean) {
|
||||||
|
menuParentChildLinked.value = val;
|
||||||
|
}
|
||||||
|
|
||||||
|
watch(menuKeywords, (val) => {
|
||||||
|
menuTreeRef.value?.filter(val);
|
||||||
|
});
|
||||||
|
|
||||||
|
function handleMenuFilter(value: string, data: { [key: string]: any }) {
|
||||||
|
if (!value) return true;
|
||||||
|
return data.label.includes(value);
|
||||||
|
}
|
||||||
|
|
||||||
|
async function handlePlanMenuSubmit() {
|
||||||
|
const planId = checkedPlan.value.id;
|
||||||
|
if (!planId) return;
|
||||||
|
|
||||||
|
const checkedMenuIds: number[] = menuTreeRef
|
||||||
|
.value!.getCheckedNodes(false, true)
|
||||||
|
.map((node: any) => node.value);
|
||||||
|
|
||||||
|
loading.value = true;
|
||||||
|
try {
|
||||||
|
await TenantPlanAPI.updatePlanMenus(planId, checkedMenuIds);
|
||||||
|
ElMessage.success("方案菜单配置成功");
|
||||||
|
planMenuDialogVisible.value = false;
|
||||||
|
} finally {
|
||||||
|
loading.value = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
function handleQuery() {
|
function handleQuery() {
|
||||||
queryParams.pageNum = 1;
|
queryParams.pageNum = 1;
|
||||||
fetchData();
|
fetchData();
|
||||||
@@ -289,6 +510,10 @@ async function handleOpenDialog(tenantId?: string) {
|
|||||||
const data = await TenantAPI.getFormData(tenantId);
|
const data = await TenantAPI.getFormData(tenantId);
|
||||||
Object.assign(formData, data);
|
Object.assign(formData, data);
|
||||||
formData.adminUsername = "";
|
formData.adminUsername = "";
|
||||||
|
formData.planId = formData.planId != null ? Number(formData.planId) : undefined;
|
||||||
|
if (isPlatformTenant.value) {
|
||||||
|
formData.planId = undefined;
|
||||||
|
}
|
||||||
} else {
|
} else {
|
||||||
dialog.title = "新增租户";
|
dialog.title = "新增租户";
|
||||||
Object.assign(formData, {
|
Object.assign(formData, {
|
||||||
@@ -299,6 +524,7 @@ async function handleOpenDialog(tenantId?: string) {
|
|||||||
contactName: "",
|
contactName: "",
|
||||||
contactPhone: "",
|
contactPhone: "",
|
||||||
contactEmail: "",
|
contactEmail: "",
|
||||||
|
planId: undefined,
|
||||||
remark: "",
|
remark: "",
|
||||||
expireTime: undefined,
|
expireTime: undefined,
|
||||||
status: 1,
|
status: 1,
|
||||||
@@ -319,6 +545,7 @@ function handleCloseDialog() {
|
|||||||
contactName: "",
|
contactName: "",
|
||||||
contactPhone: "",
|
contactPhone: "",
|
||||||
contactEmail: "",
|
contactEmail: "",
|
||||||
|
planId: undefined,
|
||||||
remark: "",
|
remark: "",
|
||||||
expireTime: undefined,
|
expireTime: undefined,
|
||||||
status: 1,
|
status: 1,
|
||||||
@@ -342,6 +569,7 @@ const handleSubmit = useDebounceFn(async () => {
|
|||||||
contactName: formData.contactName,
|
contactName: formData.contactName,
|
||||||
contactPhone: formData.contactPhone,
|
contactPhone: formData.contactPhone,
|
||||||
contactEmail: formData.contactEmail,
|
contactEmail: formData.contactEmail,
|
||||||
|
planId: formData.planId,
|
||||||
remark: formData.remark,
|
remark: formData.remark,
|
||||||
expireTime: formData.expireTime,
|
expireTime: formData.expireTime,
|
||||||
status: formData.status,
|
status: formData.status,
|
||||||
@@ -356,6 +584,7 @@ const handleSubmit = useDebounceFn(async () => {
|
|||||||
contactName: formData.contactName,
|
contactName: formData.contactName,
|
||||||
contactPhone: formData.contactPhone,
|
contactPhone: formData.contactPhone,
|
||||||
contactEmail: formData.contactEmail,
|
contactEmail: formData.contactEmail,
|
||||||
|
planId: formData.planId,
|
||||||
remark: formData.remark,
|
remark: formData.remark,
|
||||||
expireTime: formData.expireTime,
|
expireTime: formData.expireTime,
|
||||||
adminUsername: formData.adminUsername,
|
adminUsername: formData.adminUsername,
|
||||||
@@ -413,7 +642,20 @@ async function handleChangeStatus(id: string | undefined, status: number) {
|
|||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
fetchData();
|
fetchData();
|
||||||
|
fetchPlanOptions();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
async function fetchPlanOptions() {
|
||||||
|
try {
|
||||||
|
const options = await TenantPlanAPI.getOptions();
|
||||||
|
planOptions.value = options.map((item) => ({
|
||||||
|
...item,
|
||||||
|
value: item.value != null ? Number(item.value) : item.value,
|
||||||
|
}));
|
||||||
|
} catch {
|
||||||
|
planOptions.value = [];
|
||||||
|
}
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss"></style>
|
<style scoped lang="scss"></style>
|
||||||
|
|||||||
@@ -185,17 +185,6 @@
|
|||||||
<el-input v-model="formData.nickname" placeholder="请输入用户昵称" />
|
<el-input v-model="formData.nickname" placeholder="请输入用户昵称" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
|
|
||||||
<el-form-item v-if="canManageTenantScope" label="租户身份" prop="tenantScope">
|
|
||||||
<el-select v-model="formData.tenantScope" placeholder="请选择租户身份">
|
|
||||||
<el-option
|
|
||||||
v-for="item in tenantScopeOptions"
|
|
||||||
:key="item.value"
|
|
||||||
:label="item.label"
|
|
||||||
:value="item.value"
|
|
||||||
/>
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<el-form-item label="所属部门" prop="deptId">
|
<el-form-item label="所属部门" prop="deptId">
|
||||||
<el-tree-select
|
<el-tree-select
|
||||||
v-model="formData.deptId"
|
v-model="formData.deptId"
|
||||||
@@ -268,7 +257,6 @@ import type { UserForm, UserQueryParams, UserItem } from "@/types/api";
|
|||||||
|
|
||||||
// ==================== 3.5 工具函数 ====================
|
// ==================== 3.5 工具函数 ====================
|
||||||
import { downloadFile, VALIDATORS } from "@/utils";
|
import { downloadFile, VALIDATORS } from "@/utils";
|
||||||
import { hasPerm } from "@/utils/auth";
|
|
||||||
// ==================== 4. API 服务 ====================
|
// ==================== 4. API 服务 ====================
|
||||||
import UserAPI from "@/api/system/user";
|
import UserAPI from "@/api/system/user";
|
||||||
import DeptAPI from "@/api/system/dept";
|
import DeptAPI from "@/api/system/dept";
|
||||||
@@ -324,7 +312,6 @@ const dialogState = reactive({
|
|||||||
// 初始表单数据
|
// 初始表单数据
|
||||||
const initialFormData: UserForm = {
|
const initialFormData: UserForm = {
|
||||||
status: CommonStatus.ENABLED,
|
status: CommonStatus.ENABLED,
|
||||||
tenantScope: undefined,
|
|
||||||
};
|
};
|
||||||
|
|
||||||
// 表单数据
|
// 表单数据
|
||||||
@@ -344,19 +331,6 @@ const importDialogVisible = ref(false);
|
|||||||
*/
|
*/
|
||||||
const drawerSize = computed(() => (appStore.device === DeviceEnum.DESKTOP ? "600px" : "90%"));
|
const drawerSize = computed(() => (appStore.device === DeviceEnum.DESKTOP ? "600px" : "90%"));
|
||||||
|
|
||||||
const isPlatformUser = computed(() => {
|
|
||||||
return (userStore.userInfo?.tenantScope || "").toUpperCase() === "PLATFORM";
|
|
||||||
});
|
|
||||||
|
|
||||||
const canManageTenantScope = computed(
|
|
||||||
() => isPlatformUser.value && hasPerm("sys:tenant:switch", "button")
|
|
||||||
);
|
|
||||||
|
|
||||||
const tenantScopeOptions = [
|
|
||||||
{ label: "平台", value: "PLATFORM" },
|
|
||||||
{ label: "租户", value: "TENANT" },
|
|
||||||
];
|
|
||||||
|
|
||||||
// ==================== 表单验证规则 ====================
|
// ==================== 表单验证规则 ====================
|
||||||
|
|
||||||
const rules = reactive({
|
const rules = reactive({
|
||||||
@@ -471,13 +445,6 @@ async function handleOpenDialog(id?: string): Promise<void> {
|
|||||||
dialogState.title = "新增用户";
|
dialogState.title = "新增用户";
|
||||||
dialogState.mode = DialogMode.CREATE;
|
dialogState.mode = DialogMode.CREATE;
|
||||||
}
|
}
|
||||||
|
|
||||||
// 仅平台用户可设置租户身份;无权限时避免提交该字段
|
|
||||||
if (canManageTenantScope.value) {
|
|
||||||
formData.tenantScope = formData.tenantScope || "TENANT";
|
|
||||||
} else {
|
|
||||||
formData.tenantScope = undefined;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|||||||
Reference in New Issue
Block a user