refactor: 优化非 CRUD 代码可读性
This commit is contained in:
@@ -3,6 +3,18 @@ import type { GeneratorPreviewItem, TableQueryParams, TableItem, GenConfigForm }
|
|||||||
|
|
||||||
const GENERATOR_BASE_URL = "/api/v1/codegen";
|
const GENERATOR_BASE_URL = "/api/v1/codegen";
|
||||||
|
|
||||||
|
// 构建预览和下载接口的查询参数
|
||||||
|
const buildCodegenParams = (pageType?: "classic" | "curd", type?: "ts" | "js") => {
|
||||||
|
const params: Record<string, string> = {};
|
||||||
|
if (pageType) {
|
||||||
|
params.pageType = pageType;
|
||||||
|
}
|
||||||
|
if (type) {
|
||||||
|
params.type = type;
|
||||||
|
}
|
||||||
|
return Object.keys(params).length ? params : undefined;
|
||||||
|
};
|
||||||
|
|
||||||
const GeneratorAPI = {
|
const GeneratorAPI = {
|
||||||
/** 获取数据表分页列表 */
|
/** 获取数据表分页列表 */
|
||||||
getTablePage(params: TableQueryParams) {
|
getTablePage(params: TableQueryParams) {
|
||||||
@@ -21,7 +33,7 @@ const GeneratorAPI = {
|
|||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
/** 获取代码生成配置 */
|
/** 保存代码生成配置 */
|
||||||
saveGenConfig(tableName: string, data: GenConfigForm) {
|
saveGenConfig(tableName: string, data: GenConfigForm) {
|
||||||
return request({
|
return request({
|
||||||
url: `${GENERATOR_BASE_URL}/${tableName}/config`,
|
url: `${GENERATOR_BASE_URL}/${tableName}/config`,
|
||||||
@@ -32,17 +44,10 @@ const GeneratorAPI = {
|
|||||||
|
|
||||||
/** 获取代码生成预览数据 */
|
/** 获取代码生成预览数据 */
|
||||||
getPreviewData(tableName: string, pageType?: "classic" | "curd", type?: "ts" | "js") {
|
getPreviewData(tableName: string, pageType?: "classic" | "curd", type?: "ts" | "js") {
|
||||||
const params: Record<string, string> = {};
|
|
||||||
if (pageType) {
|
|
||||||
params.pageType = pageType;
|
|
||||||
}
|
|
||||||
if (type) {
|
|
||||||
params.type = type;
|
|
||||||
}
|
|
||||||
return request<unknown, GeneratorPreviewItem[]>({
|
return request<unknown, GeneratorPreviewItem[]>({
|
||||||
url: `${GENERATOR_BASE_URL}/${tableName}/preview`,
|
url: `${GENERATOR_BASE_URL}/${tableName}/preview`,
|
||||||
method: "get",
|
method: "get",
|
||||||
params: Object.keys(params).length ? params : undefined,
|
params: buildCodegenParams(pageType, type),
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
@@ -54,23 +59,12 @@ const GeneratorAPI = {
|
|||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
||||||
/**
|
/** 下载代码生成 ZIP 文件 */
|
||||||
* 下载 ZIP 文件
|
|
||||||
* @param url
|
|
||||||
* @param fileName
|
|
||||||
*/
|
|
||||||
download(tableName: string, pageType?: "classic" | "curd", type?: "ts" | "js") {
|
download(tableName: string, pageType?: "classic" | "curd", type?: "ts" | "js") {
|
||||||
const params: Record<string, string> = {};
|
|
||||||
if (pageType) {
|
|
||||||
params.pageType = pageType;
|
|
||||||
}
|
|
||||||
if (type) {
|
|
||||||
params.type = type;
|
|
||||||
}
|
|
||||||
return request({
|
return request({
|
||||||
url: `${GENERATOR_BASE_URL}/${tableName}/download`,
|
url: `${GENERATOR_BASE_URL}/${tableName}/download`,
|
||||||
method: "get",
|
method: "get",
|
||||||
params: Object.keys(params).length ? params : undefined,
|
params: buildCodegenParams(pageType, type),
|
||||||
responseType: "blob",
|
responseType: "blob",
|
||||||
}).then((response) => {
|
}).then((response) => {
|
||||||
const contentDisposition = response?.headers?.["content-disposition"] as string | undefined;
|
const contentDisposition = response?.headers?.["content-disposition"] as string | undefined;
|
||||||
@@ -89,12 +83,12 @@ const GeneratorAPI = {
|
|||||||
|
|
||||||
const blob = new Blob([response.data], { type: "application/zip" });
|
const blob = new Blob([response.data], { type: "application/zip" });
|
||||||
const a = document.createElement("a");
|
const a = document.createElement("a");
|
||||||
const url = window.URL.createObjectURL(blob);
|
const downloadUrl = window.URL.createObjectURL(blob);
|
||||||
a.href = url;
|
a.href = downloadUrl;
|
||||||
a.download = fileName;
|
a.download = fileName;
|
||||||
|
|
||||||
a.click();
|
a.click();
|
||||||
window.URL.revokeObjectURL(url);
|
window.URL.revokeObjectURL(downloadUrl);
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -223,4 +223,3 @@ watch(
|
|||||||
}
|
}
|
||||||
);
|
);
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss" scoped></style>
|
|
||||||
|
|||||||
@@ -11,11 +11,11 @@ function createOnlineCountComposable() {
|
|||||||
|
|
||||||
let unsubscribe: (() => void) | null = null;
|
let unsubscribe: (() => void) | null = null;
|
||||||
|
|
||||||
|
// 处理在线人数变更消息
|
||||||
const handleOnlineCountMessage = (count: number) => {
|
const handleOnlineCountMessage = (count: number) => {
|
||||||
if (count !== undefined && !isNaN(count)) {
|
if (!Number.isFinite(count) || count < 0) return;
|
||||||
onlineUserCount.value = count;
|
onlineUserCount.value = count;
|
||||||
lastUpdateTime.value = Date.now();
|
lastUpdateTime.value = Date.now();
|
||||||
}
|
|
||||||
};
|
};
|
||||||
|
|
||||||
const initialize = () => {
|
const initialize = () => {
|
||||||
|
|||||||
@@ -184,7 +184,7 @@ function extractTopMenuPath(path: string): string {
|
|||||||
function handleTopMenuSelect(menuPath: string) {
|
function handleTopMenuSelect(menuPath: string) {
|
||||||
if (menuPath === activeTopMenuPath.value) return;
|
if (menuPath === activeTopMenuPath.value) return;
|
||||||
|
|
||||||
appStore.activeTopMenu(menuPath);
|
appStore.setActiveTopMenuPath(menuPath);
|
||||||
permissionStore.setMixLayoutSideMenus(menuPath);
|
permissionStore.setMixLayoutSideMenus(menuPath);
|
||||||
navigateToFirstMenu(permissionStore.mixLayoutSideMenus);
|
navigateToFirstMenu(permissionStore.mixLayoutSideMenus);
|
||||||
}
|
}
|
||||||
@@ -215,7 +215,7 @@ watch(
|
|||||||
const isTopMenuChanged = topMenuPath !== activeTopMenuPath.value;
|
const isTopMenuChanged = topMenuPath !== activeTopMenuPath.value;
|
||||||
|
|
||||||
if (isTopMenuChanged) {
|
if (isTopMenuChanged) {
|
||||||
appStore.activeTopMenu(topMenuPath);
|
appStore.setActiveTopMenuPath(topMenuPath);
|
||||||
}
|
}
|
||||||
|
|
||||||
// 切换布局(如左侧 -> 混合)时,activeTopMenuPath 可能已是正确值,
|
// 切换布局(如左侧 -> 混合)时,activeTopMenuPath 可能已是正确值,
|
||||||
|
|||||||
@@ -31,9 +31,9 @@ export function useLayout() {
|
|||||||
appStore.toggleDevice(device);
|
appStore.toggleDevice(device);
|
||||||
|
|
||||||
if (isDesktop.value) {
|
if (isDesktop.value) {
|
||||||
appStore.openSideBar();
|
appStore.openSidebar();
|
||||||
} else {
|
} else {
|
||||||
appStore.closeSideBar();
|
appStore.closeSidebar();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -82,7 +82,7 @@ export function useLayout() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function closeSidebar() {
|
function closeSidebar() {
|
||||||
appStore.closeSideBar();
|
appStore.closeSidebar();
|
||||||
}
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
|
|||||||
@@ -6,50 +6,104 @@ import { STORAGE_KEYS } from "@/constants";
|
|||||||
import { defaults } from "@/settings";
|
import { defaults } from "@/settings";
|
||||||
|
|
||||||
export const useAppStore = defineStore("app", () => {
|
export const useAppStore = defineStore("app", () => {
|
||||||
|
/**
|
||||||
|
* 当前设备类型
|
||||||
|
*/
|
||||||
const device = useStorage(STORAGE_KEYS.DEVICE, DeviceEnum.DESKTOP);
|
const device = useStorage(STORAGE_KEYS.DEVICE, DeviceEnum.DESKTOP);
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 组件默认尺寸
|
||||||
|
*/
|
||||||
const size = useStorage(STORAGE_KEYS.SIZE, defaults.size);
|
const size = useStorage(STORAGE_KEYS.SIZE, defaults.size);
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 当前语言
|
||||||
|
*/
|
||||||
const language = useStorage(STORAGE_KEYS.LANGUAGE, defaults.language);
|
const language = useStorage(STORAGE_KEYS.LANGUAGE, defaults.language);
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 侧边栏持久化状态
|
||||||
|
*/
|
||||||
const sidebarStatus = useStorage(STORAGE_KEYS.SIDEBAR_STATUS, SidebarStatus.CLOSED);
|
const sidebarStatus = useStorage(STORAGE_KEYS.SIDEBAR_STATUS, SidebarStatus.CLOSED);
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 侧边栏显示状态
|
||||||
|
*/
|
||||||
const sidebar = reactive({
|
const sidebar = reactive({
|
||||||
opened: sidebarStatus.value === SidebarStatus.OPENED,
|
opened: sidebarStatus.value === SidebarStatus.OPENED,
|
||||||
withoutAnimation: false,
|
withoutAnimation: false,
|
||||||
});
|
});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 当前激活的顶部菜单路径
|
||||||
|
*/
|
||||||
const activeTopMenuPath = useStorage(STORAGE_KEYS.ACTIVE_TOP_MENU_PATH, "");
|
const activeTopMenuPath = useStorage(STORAGE_KEYS.ACTIVE_TOP_MENU_PATH, "");
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 内容区是否全屏
|
||||||
|
*/
|
||||||
const contentFullscreen = ref(false);
|
const contentFullscreen = ref(false);
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Element Plus 当前语言包
|
||||||
|
*/
|
||||||
const locale = computed(() => (language?.value === "en" ? en : zhCn));
|
const locale = computed(() => (language?.value === "en" ? en : zhCn));
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 切换侧边栏展开状态
|
||||||
|
*/
|
||||||
function toggleSidebar() {
|
function toggleSidebar() {
|
||||||
sidebar.opened = !sidebar.opened;
|
sidebar.opened = !sidebar.opened;
|
||||||
sidebarStatus.value = sidebar.opened ? SidebarStatus.OPENED : SidebarStatus.CLOSED;
|
sidebarStatus.value = sidebar.opened ? SidebarStatus.OPENED : SidebarStatus.CLOSED;
|
||||||
}
|
}
|
||||||
|
|
||||||
function closeSideBar() {
|
/**
|
||||||
|
* 关闭侧边栏
|
||||||
|
*/
|
||||||
|
function closeSidebar() {
|
||||||
sidebar.opened = false;
|
sidebar.opened = false;
|
||||||
sidebarStatus.value = SidebarStatus.CLOSED;
|
sidebarStatus.value = SidebarStatus.CLOSED;
|
||||||
}
|
}
|
||||||
|
|
||||||
function openSideBar() {
|
/**
|
||||||
|
* 打开侧边栏
|
||||||
|
*/
|
||||||
|
function openSidebar() {
|
||||||
sidebar.opened = true;
|
sidebar.opened = true;
|
||||||
sidebarStatus.value = SidebarStatus.OPENED;
|
sidebarStatus.value = SidebarStatus.OPENED;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 切换设备类型
|
||||||
|
*/
|
||||||
function toggleDevice(val: string) {
|
function toggleDevice(val: string) {
|
||||||
device.value = val;
|
device.value = val;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 切换组件尺寸
|
||||||
|
*/
|
||||||
function changeSize(val: string) {
|
function changeSize(val: string) {
|
||||||
size.value = val;
|
size.value = val;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 切换语言
|
||||||
|
*/
|
||||||
function changeLanguage(val: string) {
|
function changeLanguage(val: string) {
|
||||||
language.value = val;
|
language.value = val;
|
||||||
}
|
}
|
||||||
|
|
||||||
function activeTopMenu(val: string) {
|
/**
|
||||||
activeTopMenuPath.value = val;
|
* 设置顶部菜单激活路径
|
||||||
|
*/
|
||||||
|
function setActiveTopMenuPath(path: string) {
|
||||||
|
activeTopMenuPath.value = path;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 切换内容区全屏状态
|
||||||
|
*/
|
||||||
function toggleContentFullscreen() {
|
function toggleContentFullscreen() {
|
||||||
contentFullscreen.value = !contentFullscreen.value;
|
contentFullscreen.value = !contentFullscreen.value;
|
||||||
}
|
}
|
||||||
@@ -60,14 +114,14 @@ export const useAppStore = defineStore("app", () => {
|
|||||||
language,
|
language,
|
||||||
locale,
|
locale,
|
||||||
size,
|
size,
|
||||||
activeTopMenu,
|
|
||||||
contentFullscreen,
|
contentFullscreen,
|
||||||
toggleDevice,
|
toggleDevice,
|
||||||
changeSize,
|
changeSize,
|
||||||
changeLanguage,
|
changeLanguage,
|
||||||
toggleSidebar,
|
toggleSidebar,
|
||||||
closeSideBar,
|
closeSidebar,
|
||||||
openSideBar,
|
openSidebar,
|
||||||
|
setActiveTopMenuPath,
|
||||||
toggleContentFullscreen,
|
toggleContentFullscreen,
|
||||||
activeTopMenuPath,
|
activeTopMenuPath,
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -12,5 +12,3 @@ import { useRoute } from "vue-router";
|
|||||||
// 获取query参数
|
// 获取query参数
|
||||||
const query = useRoute().query.type as string;
|
const query = useRoute().query.type as string;
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped></style>
|
|
||||||
|
|||||||
@@ -623,5 +623,3 @@ const curd = {
|
|||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped></style>
|
|
||||||
|
|||||||
@@ -1010,5 +1010,3 @@ onMounted(() => {
|
|||||||
fetchPlanOptions();
|
fetchPlanOptions();
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss"></style>
|
|
||||||
|
|||||||
@@ -495,5 +495,3 @@ onMounted(() => {
|
|||||||
fetchData();
|
fetchData();
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss"></style>
|
|
||||||
|
|||||||
@@ -528,5 +528,3 @@ onMounted(() => {
|
|||||||
handleQuery();
|
handleQuery();
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss"></style>
|
|
||||||
|
|||||||
Reference in New Issue
Block a user