fix: 修改功能模块

zhengyiming

6 天以前 c5025e19c37bcb0ec0d07e979ebe9c1ca7840753

 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,19 +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])?.buttons ?? [];
      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) {}
@@ -441,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[]) {
@@ -460,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(),
@@ -477,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);
@@ -518,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('保存成功');
@@ -549,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);