From 8e94e3f60a91e536d69e643b4dc13804b79370bc Mon Sep 17 00:00:00 2001
From: wupengfei <834520024@qq.com>
Date: 星期二, 05 八月 2025 17:40:06 +0800
Subject: [PATCH] feat: 页面
---
src/views/System/ModuleManage.vue | 192 +++++++++++++++++++++++++++--------------------
1 files changed, 110 insertions(+), 82 deletions(-)
diff --git a/src/views/System/ModuleManage.vue b/src/views/System/ModuleManage.vue
index 40f8562..5a20161 100644
--- a/src/views/System/ModuleManage.vue
+++ b/src/views/System/ModuleManage.vue
@@ -3,6 +3,22 @@
<AppContainer>
<ProTableQueryFilterBar @on-reset="handleReset">
<template #query>
+ <QueryFilterItem>
+ <FieldRadio
+ v-model="state.clientType"
+ :value-enum="EnumClientTypeText"
+ buttonStyle
+ @change="getAllModule()"
+ />
+ </QueryFilterItem>
+ <QueryFilterItem>
+ <FieldRadio
+ v-model="state.userType"
+ :value-enum="EnumUserTypeText"
+ buttonStyle
+ @change="getAllModule()"
+ />
+ </QueryFilterItem>
<div class="query-filter-list-item">
<SearchInput
v-model="state.searchValue"
@@ -50,14 +66,14 @@
row.type=v?EnumMenuType.Menu:EnumMenuType.Page
}"
inline-prompt
- @change="(v: number) => handleChangeStatus(v, row, 'isMenu')"
+ @change="(v: boolean) => handleChangeStatus(v, row, 'isMenu')"
></el-switch>
</template>
<template v-else-if="column.property === 'enabledMark'">
<el-switch
:modelValue="!row.isDisabled"
:onUpdate:modelValue="(v: boolean) => row.isDisabled =!v"
- @change="(v: number) => handleChangeStatus(v, row, 'enabledMark')"
+ @change="(v: boolean) => handleChangeStatus(v, row, 'enabledMark')"
></el-switch>
</template>
</template>
@@ -94,6 +110,8 @@
LoadingLayout,
OperationBtnType,
SearchInput,
+ QueryFilterItem,
+ FieldRadio,
} from '@bole-core/components';
import { ModuleUtils, TreeModuleDtoGroupDto, Message, TreeStore, flattenTree } from '@/utils';
import { TableInstance } from 'element-plus';
@@ -104,6 +122,8 @@
FastBtn,
ModuleColumns,
EnumMenuType,
+ EnumClientTypeText,
+ EnumUserTypeText,
} from '@/constants';
import SubModuleEditDrawer from './components/SubModuleEditDrawer.vue';
import AddOrEditModuleDialog from './components/AddOrEditModuleDialog.vue';
@@ -111,6 +131,7 @@
import _ from 'lodash';
import { useReset } from '@bole-core/core';
import * as menuServices from '@/services/api/menu';
+import { DrawerTableDataItem } from './types';
defineOptions({
name: 'ModuleManage',
@@ -181,6 +202,9 @@
const BaseState = {
loading: true,
searchValue: '',
+ group: 'default',
+ userType: EnumUserType.Operation,
+ clientType: EnumClientType.PcWeb,
};
const state = reactive({ ...BaseState });
const moduleTreeStore = ref<TreeStore<TreeModuleDtoGroupDto>>();
@@ -210,9 +234,10 @@
//drawer
const drawerVisible = ref(false);
const currentDrawerModule = ref<API.GetMenuQueryResult>({});
+
const drawerState = reactive<{
type: SubModuleType;
- tableData: ValueOf<API.AllSubModule>;
+ tableData: DrawerTableDataItem[];
}>({
type: SubModuleType.PageButton,
tableData: [],
@@ -225,8 +250,8 @@
try {
let res = await menuServices.getMenus(
{
- userType: EnumUserType.Operation,
- clientType: EnumClientType.PcWeb,
+ userType: state.userType,
+ clientType: state.clientType,
},
{
showLoading: false,
@@ -239,23 +264,30 @@
}
type StatusEventType = {
isCache: boolean;
- isMenu: number;
- enabledMark: number;
+ isMenu: boolean;
+ enabledMark: boolean;
};
async function handleChangeStatus<T extends keyof StatusEventType>(
- value: StatusEventType[T],
+ value: boolean,
data: TreeModuleDtoGroupDto,
statusType: T
) {
try {
- // let params = {
- // ..._.omit(data, ['children', 'parentNode']),
- // [statusType]: value,
- // };
- // await baseModuleServices.addOrEditModule(params);
- } catch (error) {
- Message.errorMessage('鎿嶄綔澶辫触');
- }
+ let params: API.SetMenuSwitchCommand = {
+ ids: [data.id],
+ type: data.type,
+ isDisabled: data.isDisabled,
+ isCache: data.isCache,
+ };
+ if (statusType === 'isMenu') {
+ params.type = value ? EnumMenuType.Menu : EnumMenuType.Page;
+ } else if (statusType === 'isCache') {
+ params.isCache = value;
+ } else {
+ params.isDisabled = !value;
+ }
+ await menuServices.setMenuSwitch(params);
+ } catch (error) {}
}
async function getMenu(id: string) {
@@ -363,8 +395,8 @@
async function handleAddOrEditModule() {
try {
let params: API.SaveMenuCommand = {
- userType: EnumUserType.Operation,
- clientType: EnumClientType.PcWeb,
+ userType: state.userType,
+ clientType: state.clientType,
code: editForm.enCode,
name: editForm.name,
type: editForm.isMenu ? EnumMenuType.Menu : EnumMenuType.Page,
@@ -396,12 +428,7 @@
async function saveMenu(params: API.SaveMenuCommand) {
try {
const res = await menuServices.saveMenu(params);
- if (res) {
- Message.successMessage('淇濆瓨鎴愬姛');
- getAllModule();
- editDialogFormVisible.value = false;
- return res;
- }
+ return res;
} catch (error) {}
}
@@ -418,20 +445,36 @@
async function openDrawer(module: TreeModuleDtoGroupDto, type: SubModuleType) {
try {
drawerState.type = type;
- currentDrawerModule.value = await getMenu(module.id);
- await nextTick();
getBaseModuleGetAllSubModule(module, type);
} catch (error) {}
}
async function getBaseModuleGetAllSubModule(module: TreeModuleDtoGroupDto, type: SubModuleType) {
try {
- const defaultGroup = currentDrawerModule.value.groups.find((g) => g.group === 'default');
+ const menu = await getMenu(module.id);
+ currentDrawerModule.value = menu;
+ const currentGroup = menu.groups.find((g) => g.group === state.group) ?? {};
if (type === SubModuleType.Column) {
- drawerState.tableData = defaultGroup.fields;
+ drawerState.tableData = (currentGroup.fields ?? []).map((f) => ({
+ enCode: f.code,
+ name: f.name,
+ sortCode: f.sort,
+ width: f.width,
+ isEdit: false,
+ isShow: false,
+ id: f.id,
+ }));
} else {
- drawerState.tableData = defaultGroup.buttonLocations.find(
- (b) => b.location === SubModuleKey[type]
- );
+ drawerState.tableData = (
+ currentGroup.buttonLocations?.find((b) => b.location === SubModuleKey[type])?.buttons ?? []
+ ).map((b) => ({
+ enCode: b.code,
+ name: b.name,
+ sortCode: b.sort,
+ width: b.width,
+ isEdit: false,
+ isShow: false,
+ id: b.id,
+ }));
}
drawerVisible.value = true;
} catch (error) {}
@@ -442,17 +485,17 @@
enCode: '',
name: '',
sortCode: sortCode,
- width: 0,
+ width: 0 as any as string,
isEdit: true,
- apiName: '',
- realColumn: '',
+ // apiName: '',
+ // realColumn: '',
isShow: true,
};
drawerState.tableData?.push(baseData);
}
function getDefaultSortCode() {
return drawerState.tableData.length > 0
- ? drawerState.tableData[drawerState.tableData.length - 1].sort + 1
+ ? drawerState.tableData[drawerState.tableData.length - 1].sortCode + 1
: 0;
}
function handleBatchAddColumn(keys: string[]) {
@@ -461,13 +504,13 @@
enCode: key,
name: '',
sortCode: sortCode + index,
- width: 0,
+ width: 0 as any as string,
isEdit: true,
}));
drawerState.tableData?.push(...baseDataList);
}
function handleAddFastBtn(fastBtn: FastBtn) {
- let subModule: API.ModuleButtonDto | API.ModuleColumnDto = {
+ let subModule: DrawerTableDataItem = {
enCode: fastBtn.enCode,
name: fastBtn.name,
sortCode: getDefaultSortCode(),
@@ -478,37 +521,29 @@
}
handleSaveSubModule(subModule);
}
-async function handleSaveSubModule(subModule: API.ModuleButtonDto | API.ModuleColumnDto) {
+async function handleSaveSubModule(subModule: DrawerTableDataItem) {
try {
- let params = {
- moduleId: currentDrawerModule.value.id,
- enCode: subModule.enCode,
+ let params: API.SaveMenuFieldCommand = {
+ parentId: currentDrawerModule.value.id,
+ code: subModule.enCode,
name: subModule.name,
- sortCode: subModule.sortCode,
+ group: state.group,
+ // location: 'string',
+ width: subModule.width,
+ sort: subModule.sortCode,
};
if (subModule.id) {
- //@ts-ignore
params.id = subModule.id;
}
if (drawerState.type === SubModuleType.Column) {
- const _subModule = subModule as API.ModuleColumnDto;
- params = {
- ...params,
- //@ts-ignore
- width: _subModule.width,
- apiName: _subModule.apiName,
- realColumn: _subModule.realColumn,
- isShow: _subModule.isShow,
- };
} else {
- //@ts-ignore
- params.buttonType = drawerState.type;
+ params.location = SubModuleKey[drawerState.type];
}
let res = null;
if (drawerState.type === SubModuleType.Column) {
- res = await baseModuleServices.addOrEditModuleColumn(params);
+ res = await menuServices.saveMenuField(params);
} else {
- res = await baseModuleServices.addOrEditModuleButton(params);
+ res = await menuServices.saveMenuButton(params);
}
if (res) {
getBaseModuleGetAllSubModule(currentDrawerModule.value, drawerState.type);
@@ -519,28 +554,24 @@
async function handelBatchSaveColumn() {
try {
if (drawerState.type === SubModuleType.Column) {
- let columnModuleList = drawerState.tableData as (API.ModuleColumnDto & { isEdit: boolean })[]; //.filter((d) => d.isEdit);
+ let columnModuleList = drawerState.tableData; //.filter((d) => d.isEdit);
if (columnModuleList.length > 0) {
- let params = columnModuleList.map((columnModule) => {
- let columnItem = {
- moduleId: currentDrawerModule.value.id,
- enCode: columnModule.enCode,
- name: columnModule.name,
- sortCode: columnModule.sortCode,
- apiName: columnModule.apiName,
- realColumn: columnModule.realColumn,
- isShow: columnModule.isShow,
- width: columnModule.width,
- };
- if (columnModule.id) {
- //@ts-ignore
- columnItem.id = columnModule.id;
+ const groups = currentDrawerModule.value.groups.map((group) => {
+ if (group.group === state.group) {
+ group.fields = columnModuleList.map((c) => ({
+ code: c.enCode,
+ name: c.name,
+ width: c.width,
+ sort: c.sortCode,
+ }));
}
- return columnItem;
+ return group;
});
- let res = await baseModuleServices.addModuleColumnList(params, {
- getResponse: true,
- });
+ let params: API.SaveMenuCommand = {
+ ...currentDrawerModule.value,
+ groups: groups,
+ };
+ const res = await saveMenu(params);
if (res) {
getBaseModuleGetAllSubModule(currentDrawerModule.value, drawerState.type);
Message.successMessage('淇濆瓨鎴愬姛');
@@ -550,15 +581,12 @@
} catch (error) {}
}
-async function handleDeleteSubModule(subModule: API.ModuleButtonDto | API.ModuleColumnDto) {
+async function handleDeleteSubModule(subModule: DrawerTableDataItem) {
try {
await Message.deleteMessage();
- let res = null;
- if (drawerState.type === SubModuleType.Column) {
- res = await baseModuleServices.deleteModuleColumn({ id: subModule.id });
- } else {
- res = await baseModuleServices.deleteModuleButton({ id: subModule.id });
- }
+ let res = await menuServices.deleteMenu({
+ ids: [subModule.id],
+ });
if (res) {
Message.successMessage('鍒犻櫎鎴愬姛');
getBaseModuleGetAllSubModule(currentDrawerModule.value, drawerState.type);
--
Gitblit v1.9.1