tt/vue3-element-admin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: 项目结构优化调整

Browse Source
This commit is contained in:
Ray.Hao
2025-12-20 21:56:48 +08:00
parent 5851976c5d
commit 65ad4fe59f
68 changed files with 2463 additions and 1761 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/views/ai/command-record/index.vue
View File

@@ -1,7 +1,7 @@
<template>
<div class="app-container">
<!-- 搜索区域 -->
<div class="search-container">
<div class="filter-section">
<el-form ref="queryFormRef" :model="queryParams" :inline="true">
<el-form-item prop="keywords" label="关键字">
<el-input
@@ -83,13 +83,13 @@
</div>
<!-- 数据表格 -->
<el-card shadow="hover" class="data-table">
<el-card shadow="hover" class="table-section">
<el-table
v-loading="loading"
:data="pageData"
highlight-current-row
border
class="data-table__content"
class="table-section__content"
>
<el-table-column label="创建时间" prop="createTime" width="180" />
<el-table-column label="用户名" prop="username" width="120" />
@@ -263,7 +263,8 @@ defineOptions({
inheritAttrs: false,
});
import AiCommandApi, { AiCommandRecordVO, AiCommandRecordPageQuery } from "@/api/ai";
import AiCommandApi from "@/api/ai";
import type { AiCommandRecordVo, AiCommandRecordPageQuery } from "@/types/api";
import { onMounted, reactive, ref } from "vue";
const queryFormRef = ref();
@@ -282,10 +283,10 @@ const queryParams = reactive<AiCommandRecordPageQuery>({
createTime: ["", ""],
});
const pageData = ref<AiCommandRecordVO[]>([]);
const pageData = ref<AiCommandRecordVo[]>([]);
const detailDialogVisible = ref(false);
const currentRow = ref<AiCommandRecordVO>();
const currentRow = ref<AiCommandRecordVo>();
function getExecuteStatusText(status: number): string {
switch (status) {
@@ -315,7 +316,7 @@ function getExecuteStatusTagType(status: number): "info" | "success" | "danger"
function fetchData() {
loading.value = true;
AiCommandApi.getCommandRecordPage(queryParams)
AiCommandApi.getPage(queryParams)
.then((data) => {
pageData.value = data.list || [];
total.value = data.total || 0;
@@ -336,7 +337,7 @@ function handleResetQuery() {
fetchData();
}
function handleViewDetail(row: AiCommandRecordVO) {
function handleViewDetail(row: AiCommandRecordVo) {
currentRow.value = row;
detailDialogVisible.value = true;
}
@@ -363,7 +364,7 @@ onMounted(() => {
</script>
<style lang="scss" scoped>
.search-container {
.filter-section {
margin-bottom: 20px;
}

186
src/views/codegen/index.vue
View File

@@ -524,12 +524,8 @@ import type { EditorConfiguration } from "codemirror";
import { FormTypeEnum, QueryTypeEnum } from "@/enums/codegen";
import GeneratorAPI, {
TablePageVO,
GenConfigForm,
TablePageQuery,
FieldConfig,
} from "@/api/codegen";
import GeneratorAPI from "@/api/codegen";
import type { FieldConfig, GenConfigForm, TablePageQuery, TablePageVo } from "@/api/types";
import { ElLoading } from "element-plus";
import DictAPI from "@/api/system/dict";
@@ -586,7 +582,7 @@ const queryParams = reactive<TablePageQuery>({
const loading = ref(false);
const loadingText = ref("loading...");
const pageData = ref<TablePageVO[]>([]);
const pageData = ref<TablePageVo[]>([]);
const total = ref(0);
const formTypeOptions: Record<string, OptionType> = FormTypeEnum;
@@ -630,7 +626,7 @@ watch(
);
const { copy, copied } = useClipboard();
const code = ref();
const code = ref<string>("");
const cmRef = ref<CmComponentRef>();
const cmOptions: EditorConfiguration = {
mode: "text/javascript",
@@ -640,7 +636,7 @@ const prevBtnText = ref("");
const nextBtnText = ref("下一步，字段配置");
const active = ref(0);
const currentTableName = ref("");
const sortFlag = ref<object>();
const sortFlag = ref<Sortable | null>(null);
// ================= 本地写盘（可选） =================
const supportsFSAccess = typeof (window as any).showDirectoryPicker === "function";
@@ -677,12 +673,24 @@ watch(active, (val) => {
} else if (val === 1) {
prevBtnText.value = "上一步，基础配置";
nextBtnText.value = "下一步，确认生成";
nextTick(() => {
initSort();
});
} else if (val === 2) {
prevBtnText.value = "上一步，字段配置";
nextBtnText.value = "下载代码";
}
});
watch(
() => dialog.visible,
(visible) => {
if (!visible) {
destroySort();
}
}
);
watch(copied, () => {
if (copied.value) {
ElMessage.success("复制成功");
@@ -696,7 +704,8 @@ watch(
if (
fieldConfig.fieldType &&
fieldConfig.fieldType.includes("Date") &&
fieldConfig.isShowInQuery === 1
fieldConfig.isShowInQuery === 1 &&
fieldConfig.queryType == null
) {
fieldConfig.queryType = QueryTypeEnum.BETWEEN.value as number;
}
@@ -705,12 +714,17 @@ watch(
{ deep: true, immediate: true }
);
function destroySort() {
if (!sortFlag.value) return;
sortFlag.value.destroy();
sortFlag.value = null;
}
const initSort = () => {
if (sortFlag.value) {
return;
}
if (sortFlag.value) return;
const table = document.querySelector(".elTableCustom .el-table__body-wrapper tbody");
sortFlag.value = Sortable.create(<HTMLElement>table, {
if (!table) return;
sortFlag.value = Sortable.create(table as HTMLElement, {
group: "shared",
animation: 150,
ghostClass: "sortable-ghost", //拖拽样式
@@ -724,20 +738,6 @@ const initSort = () => {
});
};
const setNodeSort = (oldIndex: number, newIndex: number) => {
// 使用arr复制一份表格数组数据
const arr = Object.assign([], genConfigFormData.value.fieldConfigs);
const currentRow = arr.splice(oldIndex, 1)[0];
arr.splice(newIndex, 0, currentRow);
arr.forEach((item: FieldConfig, index) => {
item.fieldSort = index + 1;
});
genConfigFormData.value.fieldConfigs = [];
nextTick(async () => {
genConfigFormData.value.fieldConfigs = arr;
});
};
/** 上一步 */
function handlePrevClick() {
if (active.value === 2) {
@@ -755,7 +755,6 @@ function handlePrevClick() {
loading.value = false;
});
});
initSort();
}
if (active.value-- <= 0) active.value = 0;
}
@@ -770,7 +769,6 @@ function handleNextClick() {
ElMessage.error("表名、业务名、包名、模块名、实体名不能为空");
return;
}
initSort();
}
if (active.value === 1) {
// 保存生成配置
@@ -783,7 +781,7 @@ function handleNextClick() {
loadingText.value = "代码生成中，请稍后...";
GeneratorAPI.saveGenConfig(tableName, genConfigFormData.value)
.then(() => {
handlePreview(tableName);
return handlePreview(tableName);
})
.then(() => {
if (active.value++ >= 2) active.value = 2;
@@ -833,36 +831,34 @@ function handleResetQuery() {
async function handleOpenDialog(tableName: string) {
dialog.visible = true;
active.value = 0;
menuOptions.value = await MenuAPI.getOptions(true);
currentTableName.value = tableName;
// 获取字典数据
DictAPI.getList().then((data) => {
dictOptions.value = data;
loading.value = true;
GeneratorAPI.getGenConfig(tableName)
.then((data) => {
dialog.title = `${tableName} 代码生成`;
genConfigFormData.value = data;
loading.value = true;
try {
const [menuList, dictList, config] = await Promise.all([
MenuAPI.getOptions(true),
DictAPI.getList(),
GeneratorAPI.getGenConfig(tableName),
]);
checkAllSelected("isShowInQuery", isCheckAllQuery);
checkAllSelected("isShowInList", isCheckAllList);
checkAllSelected("isShowInForm", isCheckAllForm);
menuOptions.value = menuList;
dictOptions.value = dictList;
dialog.title = `${tableName} 代码生成`;
genConfigFormData.value = config;
// 如果已经配置过，直接跳转到预览页面
if (genConfigFormData.value.id) {
active.value = 2;
handlePreview(tableName);
} else {
// 如果没有配置过，跳转到基础配置页面
active.value = 0;
}
})
.finally(() => {
loading.value = false;
});
});
checkAllSelected("isShowInQuery", isCheckAllQuery);
checkAllSelected("isShowInList", isCheckAllList);
checkAllSelected("isShowInForm", isCheckAllForm);
if (genConfigFormData.value.id) {
active.value = 2;
await handlePreview(tableName);
}
} catch {
ElMessage.error("获取生成配置失败");
dialog.visible = false;
} finally {
loading.value = false;
}
}
/** 重置配置 */
@@ -896,27 +892,26 @@ const checkAllSelected = (key: keyof FieldConfig, isCheckAllRef: any) => {
};
/** 获取生成预览 */
function handlePreview(tableName: string) {
async function handlePreview(tableName: string) {
treeData.value = [];
GeneratorAPI.getPreviewData(tableName, (genConfigFormData.value.pageType as any) || "classic")
.then((data) => {
dialog.title = `代码生成 ${tableName}`;
// 组装树形结构完善代码
const tree = buildTree(data);
// 缓存原始数据用于写盘
lastPreviewFiles.value = data || [];
// 去掉根节点“前后端代码”，直接展示其 children 作为一级目录
treeData.value = tree?.children ? [...tree.children] : [];
try {
const data = await GeneratorAPI.getPreviewData(
tableName,
(genConfigFormData.value.pageType as any) || "classic"
);
dialog.title = `代码生成 ${tableName}`;
const tree = buildTree(data);
lastPreviewFiles.value = data || [];
treeData.value = tree?.children ? [...tree.children] : [];
// 默认选中第一个叶子节点并设置 code 值
const firstLeafNode = findFirstLeafNode(tree);
if (firstLeafNode) {
code.value = firstLeafNode.content || "";
}
})
.catch(() => {
active.value = 0;
});
const firstLeafNode = findFirstLeafNode(tree);
if (firstLeafNode) {
code.value = firstLeafNode.content || "";
}
} catch {
active.value = 0;
throw new Error("preview_failed");
}
}
/**
@@ -1065,27 +1060,11 @@ const pickBackendDir = async () => {
}
};
async function ensureDir(root: any, path: string[], force = true) {
async function ensureDir(root: any, path: string[], create = true) {
let current = root;
for (const segment of path) {
try {
// @ts-ignore
current = await current.getDirectoryHandle(segment, { create: true });
} catch (err: any) {
// 若同名文件阻塞目录创建，尝试强制删除后重建
if (force && err?.name === "TypeMismatchError") {
try {
// @ts-ignore
await current.removeEntry(segment, { recursive: true });
// @ts-ignore
current = await current.getDirectoryHandle(segment, { create: true });
} catch {
throw err;
}
} else {
throw err;
}
}
// @ts-ignore
current = await current.getDirectoryHandle(segment, { create });
}
return current;
}
@@ -1103,15 +1082,8 @@ async function writeFile(dirHandle: any, filePath: string, content: string) {
fileHandle = await targetDir.getFileHandle(fileName, { create: true });
} catch (err: any) {
if (err?.name === "TypeMismatchError") {
// 存在同名目录，尝试删除后重建文件
try {
// @ts-ignore
await targetDir.removeEntry(fileName, { recursive: true });
// @ts-ignore
fileHandle = await targetDir.getFileHandle(fileName, { create: true });
} catch {
throw err;
}
// 存在同名目录(或其它类型冲突)，为安全起见不自动删除
throw err;
} else {
throw err;
}
@@ -1319,6 +1291,10 @@ async function confirmWrite() {
/** 组件挂载后执行 */
onMounted(() => {
handleQuery();
});
onBeforeUnmount(() => {
cmRef.value?.destroy();
destroySort();
});
</script>

50
src/views/login/components/Login.vue
View File

@@ -90,14 +90,17 @@
<el-dialog
v-model="tenantDialogVisible"
title="选择登录租户"
width="500px"
:width="isSmallScreen ? '92vw' : '500px'"
:fullscreen="isSmallScreen"
append-to-body
:teleported="true"
:close-on-click-modal="false"
:close-on-press-escape="false"
:show-close="false"
>
<div class="tenant-select-content">
<div class="tenant-select-content" :style="tenantDialogBodyStyle">
<p class="tenant-select-tip">检测到你的账号属于多个租户，请选择登录租户：</p>
<TenantSwitcher @change="(id: number) => (selectedTenantId = id)" />
<TenantSwitcher @change="handleTenantSwitcherChange" />
</div>
<template #footer>
<el-button @click="tenantDialogVisible = false">取消</el-button>
@@ -154,6 +157,7 @@ const loginFormRef = ref<FormInstance>();
const loading = ref(false);
// 是否大写锁定
const isCapsLock = ref(false);
const isSmallScreen = useMediaQuery("(max-width: 768px)");
// 验证码图片Base64字符串
const captchaBase64 = ref();
// 记住我
@@ -162,6 +166,26 @@ const rememberMe = AuthStorage.getRememberMe();
const tenantDialogVisible = ref(false);
const selectedTenantId = ref<number | null>(null);
function handleTenantSwitcherChange(id: number) {
selectedTenantId.value = id;
tenantStore.currentTenantId = id;
const matched = tenantStore.tenantList?.find((t) => t.id === id) || null;
tenantStore.currentTenant = matched;
}
const tenantDialogBodyStyle = computed(() => {
if (isSmallScreen.value) {
return {
maxHeight: "calc(100vh - 160px)",
overflow: "auto",
};
}
return {
maxHeight: "60vh",
overflow: "auto",
};
});
const loginFormData = ref<LoginRequest>({
username: "admin",
password: "123456",
@@ -232,10 +256,19 @@ async function handleLoginSubmit() {
await router.push(decodeURIComponent(redirectPath));
} catch (error: any) {
// 检查是否是 choose_tenant 响应
if (error?.code === ApiCodeEnum.CHOOSE_TENANT && error?.data?.tenants) {
if (
error?.code === ApiCodeEnum.CHOOSE_TENANT &&
Array.isArray(error?.data) &&
error.data.length > 0
) {
// 需要选择租户
tenantStore.setTenantList(error.data.tenants);
selectedTenantId.value = error.data.tenants[0]?.id || null;
tenantStore.setTenantList(error.data);
selectedTenantId.value = error.data[0]?.id || null;
if (selectedTenantId.value) {
tenantStore.currentTenantId = selectedTenantId.value;
tenantStore.currentTenant =
error.data.find((t: any) => t.id === selectedTenantId.value) || null;
}
tenantDialogVisible.value = true;
return; // 等待用户选择租户
}
@@ -263,7 +296,10 @@ async function handleTenantSelected() {
try {
loading.value = true;
// 使用选中的租户ID重新登录（将 tenantId 设置到表单数据中）
const loginData = { ...loginFormData.value, tenantId: selectedTenantId.value };
const loginData = {
...loginFormData.value,
tenantId: selectedTenantId.value,
};
await userStore.login(loginData);
// 登录成功，关闭对话框并跳转
tenantDialogVisible.value = false;

32
src/views/login/index.vue
View File

@@ -29,6 +29,10 @@
<span>⦿</span>
统一身份认证与权限管理
</li>
<li>
<span>⦿</span>
支持多租户模式与租户隔离
</li>
<li>
<span>⦿</span>
数据安全与操作审计
@@ -49,9 +53,14 @@
<div class="auth-panel__title-row">
<span class="auth-panel__title">{{ defaultSettings.title }}</span>
</div>
<div v-if="defaultSettings.version" class="auth-panel__version-row">
<span class="auth-panel__version-label">Version</span>
<span class="auth-panel__version-pill">v{{ defaultSettings.version }}</span>
<div v-if="defaultSettings.version || tenantEnabled" class="auth-panel__version-row">
<el-text size="small" type="info">VERSION</el-text>
<el-tag v-if="defaultSettings.version" size="small" effect="light" round>
{{ `v${defaultSettings.version}` }}
</el-tag>
<el-tag v-if="tenantEnabled" type="success" size="small" effect="light" round>
多租户
</el-tag>
</div>
</div>
</div>
@@ -82,6 +91,8 @@ type LayoutMap = "login" | "register" | "resetPwd";
const { t } = useI18n();
const component = ref<LayoutMap>("login");
const tenantEnabled = import.meta.env.VITE_APP_TENANT_ENABLED === "true";
const formComponents = {
login: defineAsyncComponent(() => import("./components/Login.vue")),
register: defineAsyncComponent(() => import("./components/Register.vue")),
@@ -425,21 +436,6 @@ onBeforeUnmount(() => {
font-size: 0.78rem;
}
.auth-panel__version-label {
color: var(--el-text-color-placeholder);
text-transform: uppercase;
letter-spacing: 0.08em;
}
.auth-panel__version-pill {
padding: 0.1rem 0.55rem;
font-weight: 500;
color: var(--el-color-primary);
background: linear-gradient(135deg, rgba(22, 93, 255, 0.12), rgba(64, 150, 255, 0.18));
border: 1px solid rgba(22, 93, 255, 0.18);
border-radius: 999px;
}
.auth-panel__form {
width: 100%;
max-width: 100%;

5
src/views/system/config/index.vue
View File

@@ -141,7 +141,8 @@ defineOptions({
inheritAttrs: false,
});
import ConfigAPI, { ConfigPageVO, ConfigForm, ConfigPageQuery } from "@/api/system/config";
import ConfigAPI from "@/api/system/config";
import type { ConfigPageVo, ConfigForm, ConfigPageQuery } from "@/api/types";
import { ElMessage, ElMessageBox } from "element-plus";
import { useDebounceFn } from "@vueuse/core";
@@ -159,7 +160,7 @@ const queryParams = reactive<ConfigPageQuery>({
});
// 系统配置表格数据
const pageData = ref<ConfigPageVO[]>([]);
const pageData = ref<ConfigPageVo[]>([]);
const dialog = reactive({
title: "",

5
src/views/system/dept/index.vue
View File

@@ -163,7 +163,8 @@ defineOptions({
inheritAttrs: false,
});
import DeptAPI, { DeptVO, DeptForm, DeptQuery } from "@/api/system/dept";
import DeptAPI from "@/api/system/dept";
import type { DeptVo, DeptForm, DeptQuery } from "@/api/types";
const queryFormRef = ref();
const deptFormRef = ref();
@@ -177,7 +178,7 @@ const dialog = reactive({
visible: false,
});
const deptList = ref<DeptVO[]>();
const deptList = ref<DeptVo[]>();
const deptOptions = ref<OptionType[]>();
const formData = reactive<DeptForm>({
status: 1,

7
src/views/system/dict/dict-item.vue
View File

@@ -155,7 +155,8 @@
<script setup lang="ts">
import type { TagProps } from "element-plus";
import DictAPI, { DictItemPageQuery, DictItemPageVO, DictItemForm } from "@/api/system/dict";
import DictAPI from "@/api/system/dict";
import type { DictItemPageQuery, DictItemPageVo, DictItemForm } from "@/api/types";
const route = useRoute();
@@ -173,7 +174,7 @@ const queryParams = reactive<DictItemPageQuery>({
pageSize: 10,
});
const tableData = ref<DictItemPageVO[]>();
const tableData = ref<DictItemPageVo[]>();
const dialog = reactive({
title: "",
@@ -226,7 +227,7 @@ function handleSelectionChange(selection: any) {
}
// 打开弹窗
function handleOpenDialog(row?: DictItemPageVO) {
function handleOpenDialog(row?: DictItemPageVo) {
dialog.visible = true;
dialog.title = row ? "编辑字典项" : "新增字典项";

7
src/views/system/dict/index.vue
View File

@@ -137,7 +137,8 @@ defineOptions({
inherititems: false,
});
import DictAPI, { DictPageQuery, DictPageVO, DictForm } from "@/api/system/dict";
import DictAPI from "@/api/system/dict";
import type { DictPageQuery, DictPageVo, DictForm } from "@/api/types";
import router from "@/router";
@@ -153,7 +154,7 @@ const queryParams = reactive<DictPageQuery>({
pageSize: 10,
});
const tableData = ref<DictPageVO[]>();
const tableData = ref<DictPageVo[]>();
const dialog = reactive({
title: "",
@@ -285,7 +286,7 @@ function handleDelete(id?: number) {
}
// 打开字典项
function handleOpenDictData(row: DictPageVO) {
function handleOpenDictData(row: DictPageVo) {
router.push({
path: "/system/dict-item",
query: { dictCode: row.dictCode, title: "【" + row.name + "】字典数据" },

5
src/views/system/log/index.vue
View File

@@ -68,7 +68,8 @@ defineOptions({
inheritAttrs: false,
});
import LogAPI, { LogPageVO, LogPageQuery } from "@/api/system/log";
import LogAPI from "@/api/system/log";
import type { LogPageVo, LogPageQuery } from "@/api/types";
const queryFormRef = ref();
@@ -83,7 +84,7 @@ const queryParams = reactive<LogPageQuery>({
});
// 日志表格数据
const pageData = ref<LogPageVO[]>();
const pageData = ref<LogPageVo[]>();
/** 获取数据 */
function fetchData() {

52
src/views/system/menu/index.vue
View File

@@ -47,15 +47,19 @@
>
<el-table-column label="菜单名称" min-width="200">
<template #default="scope">
<template v-if="scope.row.icon && scope.row.icon.startsWith('el-icon')">
<el-icon style="vertical-align: -0.15em">
<component :is="scope.row.icon.replace('el-icon-', '')" />
</el-icon>
</template>
<template v-else-if="scope.row.icon">
<div :class="`i-svg:${scope.row.icon}`" />
</template>
{{ scope.row.name }}
<div class="menu-name-cell">
<span class="menu-name-cell__icon">
<template v-if="scope.row.icon && scope.row.icon.startsWith('el-icon')">
<el-icon style="vertical-align: -0.15em">
<component :is="scope.row.icon.replace('el-icon-', '')" />
</el-icon>
</template>
<template v-else-if="scope.row.icon">
<span :class="`i-svg:${scope.row.icon}`" />
</template>
</span>
<span class="menu-name-cell__text">{{ scope.row.name }}</span>
</div>
</template>
</el-table-column>
@@ -340,7 +344,8 @@
import { useAppStore } from "@/store/modules/app-store";
import { DeviceEnum } from "@/enums/settings";
import MenuAPI, { MenuQuery, MenuForm, MenuVO } from "@/api/system/menu";
import MenuAPI from "@/api/system/menu";
import type { MenuQuery, MenuForm, MenuVo } from "@/api/types";
import { MenuTypeEnum } from "@/enums/business";
defineOptions({
@@ -363,7 +368,7 @@ const drawerSize = computed(() => (appStore.device === DeviceEnum.DESKTOP ? "600
// 查询参数
const queryParams = reactive<MenuQuery>({});
// 菜单表格数据
const menuTableData = ref<MenuVO[]>([]);
const menuTableData = ref<MenuVo[]>([]);
// 顶级菜单下拉选项
const menuOptions = ref<OptionType[]>([]);
// 初始菜单表单数据
@@ -432,7 +437,7 @@ function handleResetQuery() {
}
// 行点击事件
function handleRowClick(row: MenuVO) {
function handleRowClick(row: MenuVo) {
selectedMenuId.value = row.id;
}
@@ -562,3 +567,26 @@ onMounted(() => {
handleQuery();
});
</script>
<style scoped>
.menu-name-cell {
display: inline-flex;
align-items: center;
max-width: 100%;
}
.menu-name-cell__icon {
display: inline-flex;
align-items: center;
justify-content: center;
width: 18px;
min-width: 18px;
margin-right: 6px;
}
.menu-name-cell__text {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
</style>

12
src/views/system/notice/index.vue
View File

@@ -260,12 +260,8 @@ defineOptions({
inheritAttrs: false,
});
import NoticeAPI, {
NoticePageVO,
NoticeForm,
NoticePageQuery,
NoticeDetailVO,
} from "@/api/system/notice";
import NoticeAPI from "@/api/system/notice";
import type { NoticePageVo, NoticeForm, NoticePageQuery, NoticeDetailVo } from "@/api/types";
import UserAPI from "@/api/system/user";
const queryFormRef = ref();
@@ -282,7 +278,7 @@ const queryParams = reactive<NoticePageQuery>({
const userOptions = ref<OptionType[]>([]);
// 通知公告表格数据
const pageData = ref<NoticePageVO[]>([]);
const pageData = ref<NoticePageVo[]>([]);
// 弹窗
const dialog = reactive({
@@ -319,7 +315,7 @@ const rules = reactive({
const detailDialog = reactive({
visible: false,
});
const currentNotice = ref<NoticeDetailVO>({});
const currentNotice = ref<NoticeDetailVo>({});
// 查询通知公告
function handleQuery() {

7
src/views/system/role/index.vue
View File

@@ -215,7 +215,8 @@
import { useAppStore } from "@/store/modules/app-store";
import { DeviceEnum } from "@/enums/settings";
import RoleAPI, { RolePageVO, RoleForm, RolePageQuery } from "@/api/system/role";
import RoleAPI from "@/api/system/role";
import type { RolePageVo, RoleForm, RolePageQuery } from "@/api/types";
import MenuAPI from "@/api/system/menu";
defineOptions({
@@ -239,7 +240,7 @@ const queryParams = reactive<RolePageQuery>({
});
// 角色表格数据
const roleList = ref<RolePageVO[]>();
const roleList = ref<RolePageVo[]>();
// 菜单权限下拉
const menuPermOptions = ref<OptionType[]>([]);
@@ -389,7 +390,7 @@ function handleDelete(roleId?: number) {
}
// 打开分配菜单权限弹窗
async function handleOpenAssignPermDialog(row: RolePageVO) {
async function handleOpenAssignPermDialog(row: RolePageVo) {
const roleId = row.id;
if (roleId) {
assignPermDialogVisible.value = true;

411
src/views/system/tenant/index.vue Normal file
View File

@@ -0,0 +1,411 @@
<template>
<div class="app-container">
<!-- 搜索区域 -->
<div class="filter-section">
<el-form ref="queryFormRef" :model="queryParams" :inline="true">
<el-form-item prop="keywords" label="关键字">
<el-input
v-model="queryParams.keywords"
placeholder="租户名称/租户编码/域名"
clearable
@keyup.enter="handleQuery"
/>
</el-form-item>
<el-form-item prop="status" label="状态">
<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:create']"
type="success"
icon="plus"
@click="handleOpenDialog()"
>
新增
</el-button>
<el-button
v-hasPerm="['sys:tenant:delete']"
type="danger"
icon="delete"
:disabled="ids.length === 0"
@click="handleDelete()"
>
删除
</el-button>
</div>
</div>
<el-table
v-loading="loading"
:data="pageData"
highlight-current-row
border
class="table-section__content"
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="租户名称" prop="name" min-width="160" />
<el-table-column label="租户编码" prop="code" width="140" />
<el-table-column label="域名" prop="domain" min-width="160" />
<el-table-column label="联系人" prop="contactName" width="120" />
<el-table-column label="电话" prop="contactPhone" width="140" />
<el-table-column label="状态" width="120" align="center">
<template #default="scope">
<el-switch
v-if="hasPermChangeStatus"
v-model="scope.row.status"
inline-prompt
active-text="正常"
inactive-text="禁用"
:active-value="1"
:inactive-value="0"
@change="
(val) => {
pageData.length > 0 && handleChangeStatus(scope.row.id, Number(val));
}
"
/>
<el-tag v-else :type="scope.row.status === 1 ? 'success' : 'info'">
{{ scope.row.status === 1 ? "正常" : "禁用" }}
</el-tag>
</template>
</el-table-column>
<el-table-column label="过期时间" prop="expireTime" width="180" />
<el-table-column label="创建时间" prop="createTime" width="180" />
<el-table-column fixed="right" label="操作" width="180">
<template #default="scope">
<el-button
v-hasPerm="['sys:tenant:update']"
type="primary"
size="small"
link
icon="edit"
@click="handleOpenDialog(scope.row.id)"
>
编辑
</el-button>
<el-button
v-hasPerm="['sys:tenant: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="600px"
@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="请输入租户编码"
:disabled="!!formData.id"
/>
</el-form-item>
<el-form-item label="域名" prop="domain">
<el-input v-model="formData.domain" placeholder="demo.youlai.tech（可选）" />
</el-form-item>
<el-form-item label="联系人" prop="contactName">
<el-input v-model="formData.contactName" placeholder="可选" />
</el-form-item>
<el-form-item label="联系电话" prop="contactPhone">
<el-input v-model="formData.contactPhone" placeholder="可选" />
</el-form-item>
<el-form-item label="联系邮箱" prop="contactEmail">
<el-input v-model="formData.contactEmail" placeholder="可选" />
</el-form-item>
<el-form-item label="过期时间" prop="expireTime">
<el-date-picker
v-model="formData.expireTime"
type="datetime"
placeholder="不填表示永不过期"
value-format="YYYY-MM-DD HH:mm:ss"
style="width: 100%"
/>
</el-form-item>
<el-form-item v-if="!formData.id" label="管理员账号" prop="adminUsername">
<el-input v-model="formData.adminUsername" placeholder="为空则系统生成" />
</el-form-item>
<el-form-item v-if="formData.id" 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="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>
</div>
</template>
<script setup lang="ts">
defineOptions({
name: "Tenant",
inheritAttrs: false,
});
import { ElMessage, ElMessageBox } from "element-plus";
import { useDebounceFn } from "@vueuse/core";
import { hasPerm } from "@/utils/auth";
import TenantAPI from "@/api/system/tenant";
import type { TenantCreateForm, TenantForm, TenantPageQuery, TenantPageVo } from "@/api/types";
const queryFormRef = ref();
const dataFormRef = ref();
const loading = ref(false);
const ids = ref<number[]>([]);
const total = ref(0);
const queryParams = reactive<TenantPageQuery>({
pageNum: 1,
pageSize: 10,
keywords: "",
});
const pageData = ref<TenantPageVo[]>([]);
const dialog = reactive({
title: "",
visible: false,
});
const formData = reactive<TenantForm & TenantCreateForm>({
id: undefined,
name: "",
code: "",
domain: "",
contactName: "",
contactPhone: "",
contactEmail: "",
remark: "",
expireTime: undefined,
status: 1,
adminUsername: "",
});
const rules = reactive({
name: [{ required: true, message: "请输入租户名称", trigger: "blur" }],
code: [{ required: true, message: "请输入租户编码", trigger: "blur" }],
});
const hasPermChangeStatus = computed(() => hasPerm("sys:tenant:change-status"));
function fetchData() {
loading.value = true;
TenantAPI.getPage(queryParams)
.then((data) => {
pageData.value = data.list;
total.value = data.total;
})
.finally(() => {
loading.value = false;
});
}
function handleQuery() {
queryParams.pageNum = 1;
fetchData();
}
function handleResetQuery() {
queryFormRef.value?.resetFields();
queryParams.pageNum = 1;
fetchData();
}
function handleSelectionChange(selection: any) {
ids.value = selection.map((item: any) => Number(item.id));
}
async function handleOpenDialog(tenantId?: string) {
dialog.visible = true;
if (tenantId) {
dialog.title = "修改租户";
const data = await TenantAPI.getFormData(tenantId);
Object.assign(formData, data);
formData.adminUsername = "";
} else {
dialog.title = "新增租户";
Object.assign(formData, {
id: undefined,
name: "",
code: "",
domain: "",
contactName: "",
contactPhone: "",
contactEmail: "",
remark: "",
expireTime: undefined,
status: 1,
adminUsername: "",
});
}
}
function handleCloseDialog() {
dialog.visible = false;
dataFormRef.value?.resetFields();
dataFormRef.value?.clearValidate();
Object.assign(formData, {
id: undefined,
name: "",
code: "",
domain: "",
contactName: "",
contactPhone: "",
contactEmail: "",
remark: "",
expireTime: undefined,
status: 1,
adminUsername: "",
});
}
const handleSubmit = useDebounceFn(async () => {
const valid = await dataFormRef.value?.validate().catch(() => false);
if (!valid) return;
loading.value = true;
try {
const tenantId = formData.id;
if (tenantId) {
const payload: TenantForm = {
id: formData.id,
name: formData.name,
code: formData.code,
domain: formData.domain,
contactName: formData.contactName,
contactPhone: formData.contactPhone,
contactEmail: formData.contactEmail,
remark: formData.remark,
expireTime: formData.expireTime,
status: formData.status,
};
await TenantAPI.update(String(tenantId), payload);
ElMessage.success("修改成功");
} else {
const payload: TenantCreateForm = {
name: formData.name,
code: formData.code,
domain: formData.domain,
contactName: formData.contactName,
contactPhone: formData.contactPhone,
contactEmail: formData.contactEmail,
remark: formData.remark,
expireTime: formData.expireTime,
adminUsername: formData.adminUsername,
};
const result = await TenantAPI.create(payload);
ElMessage.success(`新增成功：管理员账号 ${result?.adminUsername || ""}`);
}
handleCloseDialog();
handleResetQuery();
} catch {
ElMessage.error(formData.id ? "修改失败" : "新增失败");
} finally {
loading.value = false;
}
}, 300);
function handleDelete(tenantId?: string) {
const tenantIds = tenantId ? tenantId : ids.value.join(",");
if (!tenantIds) {
ElMessage.warning("请勾选删除项");
return;
}
ElMessageBox.confirm("确认删除选中的租户吗？", "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(async () => {
loading.value = true;
try {
await TenantAPI.deleteByIds(tenantIds);
ElMessage.success("删除成功");
handleResetQuery();
} finally {
loading.value = false;
}
})
.catch(() => {
// 用户取消
});
}
async function handleChangeStatus(id: string | undefined, status: number) {
if (!id) return;
try {
await TenantAPI.updateStatus(String(id), status);
ElMessage.success("状态更新成功");
} catch {
ElMessage.error("状态更新失败");
fetchData();
}
}
onMounted(() => {
fetchData();
});
</script>
<style scoped lang="scss"></style>

8
src/views/system/user/index.vue
View File

@@ -253,7 +253,7 @@ import { useDebounceFn } from "@vueuse/core";
import { ElMessage, ElMessageBox, type FormInstance } from "element-plus";
// ==================== 3. 类型定义 ====================
import type { UserForm, UserPageQuery, UserPageVO } from "@/api/system/user";
import type { UserForm, UserPageQuery, UserPageVo } from "@/api/types";
// ==================== 3.5 工具函数 ====================
import { downloadFile } from "@/utils";
@@ -299,7 +299,7 @@ const queryParams = reactive<UserPageQuery>({
});
// 列表数据
const userList = ref<UserPageVO[]>([]);
const userList = ref<UserPageVo[]>([]);
const total = ref(0);
const loading = ref(false);
@@ -363,7 +363,7 @@ async function fetchUserList(): Promise<void> {
}
// ==================== 表格选择 ====================
const { selectedIds, hasSelection, handleSelectionChange } = useTableSelection<UserPageVO>();
const { selectedIds, hasSelection, handleSelectionChange } = useTableSelection<UserPageVo>();
// ==================== 查询操作 ====================
@@ -390,7 +390,7 @@ function handleResetQuery(): void {
* 重置用户密码
* @param row 用户数据
*/
function handleResetPassword(row: UserPageVO): void {
function handleResetPassword(row: UserPageVo): void {
ElMessageBox.prompt(`请输入用户【${row.username}】的新密码`, "重置密码", {
confirmButtonText: "确定",
cancelButtonText: "取消",