Merge branch 'qianpw' into wuxichen

2025-10-17 17:48:26 +08:00
parent 263a7d3e20 2821e864da
commit 5163e4dee8
14 changed files with 1737 additions and 59 deletions
--- a/src/pages/system/dict/config.tsx
+++ b/src/pages/system/dict/config.tsx
@@ -2,10 +2,12 @@ import type {
  ProColumns,
  ProFormColumnsType,
 } from '@ant-design/pro-components';
-import { Tag } from 'antd';
+
 import dayjs from 'dayjs';
+import DictTag from '@/components/XTag';
 import { tenantStatus } from '@/constants';
 import type { DictTypeVO } from '@/services/system/dict/dict.type';
+import { DICT_TYPE } from '@/utils/dict';

 export const baseDictTypeColumns: ProColumns<DictTypeVO>[] = [
  {
@@ -29,14 +31,12 @@ export const baseDictTypeColumns: ProColumns<DictTypeVO>[] = [
    title: '状态',
    dataIndex: 'status',
    width: 100,
-    render: (_, record) => (
-      <Tag
-        key={record.status}
-        color={record.status === 1 ? 'default' : 'processing'}
-      >
-        {record.status === 1 ? '正常' : '禁用'}
-      </Tag>
-    ),
+    valueType: 'select',
+    render: (_, record) => {
+      return (
+        <DictTag type={DICT_TYPE.COMMON_STATUS} value={record.status}></DictTag>
+      );
+    },
  },
  {
    title: '备注',
--- a/src/pages/system/dict/data/config.tsx
+++ b/src/pages/system/dict/data/config.tsx
@@ -19,6 +19,9 @@ export const baseDictDataColumns: ProColumns<DictDataVO>[] = [
    title: '字典标签',
    dataIndex: 'label',
    width: 120,
+    render: (_, record) => (
+      <Tag color={record.cssClass || record.colorType}>{record.label}</Tag>
+    ),
  },
  {
    title: '字典键值',
@@ -44,9 +47,13 @@ export const baseDictDataColumns: ProColumns<DictDataVO>[] = [
    title: '颜色类型',
    dataIndex: 'colorType',
    width: 80,
+    render: (_, record) => (
+      <Tag color={record.colorType}>{record.colorType}</Tag>
+    ),
  },
  {
    title: 'CSS Class',
+
    dataIndex: 'cssClass',
    width: 120,
  },
@@ -133,11 +140,11 @@ export const formColumns = (_type: string): ProFormColumnsType[] => [
      options: [
        {
          label: '启用',
-          value: 1,
+          value: 0,
        },
        {
          label: '禁用',
-          value: 0,
+          value: 1,
        },
      ],
    },
@@ -156,23 +163,23 @@ export const formColumns = (_type: string): ProFormColumnsType[] => [
    fieldProps: {
      options: [
        {
-          label: '默认(waiting)',
-          value: 'waiting',
+          label: <Tag color="default">默认(default)</Tag>,
+          value: 'default',
        },
        {
-          label: '成功(success)',
+          label: <Tag color="success">成功(success)</Tag>,
          value: 'success',
        },
        {
-          label: '信息(processing)',
+          label: <Tag color="processing">信息(processing)</Tag>,
          value: 'processing',
        },
        {
-          label: '失败(error)',
+          label: <Tag color="error">失败(error)</Tag>,
          value: 'error',
        },
        {
-          label: '警告(warning)',
+          label: <Tag color="warning">警告(warning)</Tag>,
          value: 'warning',
        },
      ],
@@ -181,6 +188,7 @@ export const formColumns = (_type: string): ProFormColumnsType[] => [
  {
    title: 'CSS Class',
    dataIndex: 'cssClass',
+    tooltip: '输入rgb颜色值或#16进制颜色值',
  },
  {
    title: '备注',
--- a/src/pages/system/menu/config.tsx
+++ b/src/pages/system/menu/config.tsx
@@ -1,10 +1,27 @@
 // src/pages/system/menu/config.tsx
-import type {
-  ProColumns,
-  ProFormColumnsType,
+import {
+  type ProColumns,
+  type ProFormColumnsType,
+  ProFormRadio,
+  ProFormText,
 } from '@ant-design/pro-components';
 import { Switch } from 'antd';
-import type { MenuVO } from '@/services/system/menu';
+import { CommonStatusEnum } from '@/constants';
+import { useMessage } from '@/hooks/antd/useMessage';
+import {
+  getSimpleMenusList,
+  type MenuVO,
+  updateMenu,
+} from '@/services/system/menu';
+import { handleTree } from '@/utils/tree';
+
+const handleStatus = async (record: MenuVO) => {
+  const message = useMessage(); // 消息弹窗
+  const text = record.status === CommonStatusEnum.ENABLE ? '停用' : '启用';
+  await message.confirm(`确认要"${text}""${record.name}"菜单吗?`);
+  const status = record.status === 0 ? 1 : 0;
+  await updateMenu({ ...record, status });
+};

 export const baseMenuColumns: ProColumns<MenuVO>[] = [
  {
@@ -16,6 +33,7 @@ export const baseMenuColumns: ProColumns<MenuVO>[] = [
    title: '图标',
    dataIndex: 'icon',
    width: 60,
+    hideInSearch: true,
    render: (_, record: MenuVO) => (
      <span>
        {record.icon ? <i className={`anticon ${record.icon}`} /> : '—'}
@@ -26,36 +44,59 @@ export const baseMenuColumns: ProColumns<MenuVO>[] = [
    title: '排序',
    dataIndex: 'sort',
    width: 80,
+    hideInSearch: true,
  },
  {
    title: '权限标识',
    dataIndex: 'permission',
    width: 150,
+    hideInSearch: true,
  },
  {
    title: '组件路径',
    dataIndex: 'component',
    width: 150,
+    hideInSearch: true,
  },
  {
    title: '组件名称',
    dataIndex: 'componentName',
    width: 150,
+    hideInSearch: true,
  },
  {
    title: '状态',
    dataIndex: 'status',
    width: 80,
-    render: (_, record: MenuVO) => (
+    render: (_dom, record: MenuVO, _: any, action: any) => (
      <Switch
-        checked={record.status === 1}
-        disabled={true} // 可后续改为可编辑
+        onClick={async () => {
+          await handleStatus(record);
+          action?.reload();
+        }}
+        checked={record.status === 0}
      />
    ),
  },
 ];

 export const formColumns = (_type: string): ProFormColumnsType[] => [
+  {
+    title: '上级菜单',
+    dataIndex: 'parentId',
+    valueType: 'treeSelect',
+    request: async () => {
+      const res = await getSimpleMenusList();
+      console.log(res);
+      const menu: Tree = { id: 0, name: '主类目', children: [] };
+      menu.children = handleTree(res);
+      return [menu];
+    },
+    fieldProps: {
+      fieldNames: { label: 'name', value: 'id', children: 'children' },
+      placeholder: '请选择上级菜单',
+    },
+  },
  {
    title: '菜单名称',
    dataIndex: 'name',
@@ -69,39 +110,105 @@ export const formColumns = (_type: string): ProFormColumnsType[] => [
    },
  },
  {
-    title: '图标',
-    dataIndex: 'icon',
-    valueType: 'select',
+    title: '菜单类型',
+    dataIndex: 'type',
+    valueType: 'radioButton',
    fieldProps: {
-      placeholder: '请选择图标',
+      placeholder: '请选择菜单类型',
      options: [
-        { label: '商品', value: 'icon-product' },
-        { label: '系统', value: 'icon-system' },
-        { label: '用户', value: 'icon-user' },
-        { label: '设置', value: 'icon-setting' },
+        { label: '目录', value: 1 },
+        { label: '菜单', value: 2 },
+        { label: '按钮', value: 3 },
+      ],
+    },
+    formItemProps: {
+      rules: [
+        {
+          required: true,
+          message: '请输入菜单类型',
+        },
      ],
    },
  },
  {
-    title: '排序',
-    dataIndex: 'sort',
-    valueType: 'digit',
+    title: '菜单图标',
+    dataIndex: 'icon',
    fieldProps: {
-      placeholder: '请输入排序值',
+      placeholder: '请选择图标',
+    },
+    dependencies: ['type'],
+    renderFormItem: (_schema, _config, form) => {
+      const type = form.getFieldValue('type');
+      if (type === 3) return null;
+      return (
+        <ProFormText
+          formItemProps={{
+            style: {
+              marginBottom: 0,
+            },
+          }}
+        />
+      );
    },
  },
  {
-    title: '权限标识',
-    dataIndex: 'permission',
+    title: '路由地址',
+    dataIndex: 'path',
+    tooltip:
+      '访问的路由地址，如：`user`。如需外网地址时，则以 `http(s)://` 开头',
    fieldProps: {
-      placeholder: '请输入权限标识',
+      placeholder: '请输入路由地址',
+    },
+    formItemProps: {
+      rules: [
+        {
+          required: true,
+          message: '请输入菜单路径',
+        },
+      ],
+    },
+    dependencies: ['type'],
+    renderFormItem: (_schema, _config, form) => {
+      const type = form.getFieldValue('type');
+      if (type === 3) return null;
+      return (
+        <ProFormText
+          formItemProps={{
+            style: {
+              marginBottom: 0,
+            },
+          }}
+        />
+      );
    },
  },
  {
-    title: '组件路径',
+    title: '组件地址',
    dataIndex: 'component',
    fieldProps: {
-      placeholder: '请输入组件路径',
+      placeholder: '请输入组件地址',
+    },
+    formItemProps: {
+      rules: [
+        {
+          required: true,
+          message: '请输入组件地址',
+        },
+      ],
+    },
+    dependencies: ['type'],
+    renderFormItem: (_schema, _config, form) => {
+      const type = form.getFieldValue('type');
+      if (type !== 2) return null;
+      return (
+        <ProFormText
+          formItemProps={{
+            style: {
+              marginBottom: 0,
+            },
+          }}
+        />
+      );
    },
  },
  {
@@ -110,16 +217,152 @@ export const formColumns = (_type: string): ProFormColumnsType[] => [
    fieldProps: {
      placeholder: '请输入组件名称',
    },
+    dependencies: ['type'],
+    renderFormItem: (_schema, _config, form) => {
+      const type = form.getFieldValue('type');
+      if (type !== 2) return null;
+
+      return (
+        <ProFormText
+          formItemProps={{
+            style: {
+              marginBottom: 0,
+            },
+          }}
+        />
+      );
+    },
  },
  {
-    title: '状态',
-    dataIndex: 'status',
-    valueType: 'select',
+    title: '权限标识',
+    dataIndex: 'permission',
+    tooltip:
+      "Controller 方法上的权限字符，如：@PreAuthorize(`@ss.hasPermission('system:user:list')`)",
    fieldProps: {
-      options: [
-        { label: '启用', value: 1 },
-        { label: '禁用', value: 0 },
+      placeholder: '请输入权限标识',
+    },
+    dependencies: ['type'],
+    renderFormItem: (_schema, _config, form) => {
+      const type = form.getFieldValue('type');
+      if (type === 1) return null;
+      return (
+        <ProFormText
+          formItemProps={{
+            style: {
+              marginBottom: 0,
+            },
+          }}
+        />
+      );
+    },
+  },
+  {
+    title: '显示排序',
+    dataIndex: 'sort',
+    valueType: 'digit',
+    fieldProps: {
+      style: {
+        width: '100%',
+      },
+      placeholder: '请输入排序值',
+    },
+    formItemProps: {
+      rules: [
+        {
+          required: true,
+          message: '请输入排序值',
+        },
      ],
    },
  },
+
+  {
+    title: '菜单状态',
+    dataIndex: 'status',
+    valueType: 'radio',
+    fieldProps: {
+      options: [
+        { label: '启用', value: 0 },
+        { label: '禁用', value: 1 },
+      ],
+    },
+  },
+  {
+    title: '显示状态',
+    dataIndex: 'visible',
+    valueType: 'radio',
+    tooltip: '选择隐藏时，路由将不会出现在侧边栏，但仍然可以访问',
+    fieldProps: {
+      options: [
+        { label: '显示', value: true },
+        { label: '隐藏', value: false },
+      ],
+    },
+    dependencies: ['type'],
+    renderFormItem: (_schema, _config, form) => {
+      const type = form.getFieldValue('type');
+      if (type === 3) return null;
+      return (
+        <ProFormRadio.Group
+          formItemProps={{
+            style: {
+              marginBottom: 0,
+            },
+          }}
+        />
+      );
+    },
+  },
+  {
+    title: '总是显示',
+    dataIndex: 'alwaysShow',
+    valueType: 'radio',
+    tooltip: '选择不是时，当该菜单只有一个子菜单时，不展示自己，直接展示子菜单',
+    fieldProps: {
+      options: [
+        { label: '总是', value: true },
+        { label: '不是', value: false },
+      ],
+    },
+    dependencies: ['type'],
+    renderFormItem: (_schema, _config, form) => {
+      const type = form.getFieldValue('type');
+      if (type === 3) return null;
+      return (
+        <ProFormRadio.Group
+          formItemProps={{
+            style: {
+              marginBottom: 0,
+            },
+          }}
+        />
+      );
+    },
+  },
+  {
+    dataIndex: 'keepAlive',
+    title: '缓存状态',
+    valueType: 'radio',
+    tooltip: '选择缓存时，则会被 `keep-alive` 缓存，必须填写「组件名称」字段',
+    fieldProps: {
+      options: [
+        { label: '总是', value: true },
+        { label: '不是', value: false },
+      ],
+    },
+    dependencies: ['type'],
+    renderFormItem: (_schema, _config, form) => {
+      const type = form.getFieldValue('type');
+      if (type === 3) return null;
+      return (
+        <ProFormRadio.Group
+          formItemProps={{
+            style: {
+              marginBottom: 0,
+            },
+          }}
+        />
+      );
+    },
+  },
 ];
--- a/src/pages/system/menu/index.tsx
+++ b/src/pages/system/menu/index.tsx
@@ -1,8 +1,9 @@
 // src/pages/system/menu/index.tsx

-import { PlusOutlined } from '@ant-design/icons';
+import { PlusOutlined, ReloadOutlined } from '@ant-design/icons';
 import type { ActionType, ProColumns } from '@ant-design/pro-components';
-import { Popconfirm } from 'antd';
+import { useModel } from '@umijs/max';
+import { Modal, Popconfirm } from 'antd';
 import React, { useCallback, useRef, useState } from 'react';
 import ConfigurableDrawerForm, {
  type ConfigurableDrawerFormRef,
@@ -10,6 +11,8 @@ import ConfigurableDrawerForm, {
 import EnhancedProTable from '@/components/EnhancedProTable';
 import type { ToolbarAction } from '@/components/EnhancedProTable/types';
 import { formStatusType } from '@/constants';
+import { useMessage } from '@/hooks/antd/useMessage';
+import { CACHE_KEY, useCache } from '@/hooks/web/useCache';
 import {
  createMenu,
  deleteMenu,
@@ -24,10 +27,11 @@ import { baseMenuColumns, formColumns } from './config';
 const SystemMenu = () => {
  const configurableDrawerRef = useRef<ConfigurableDrawerFormRef>(null);
  const tableRef = useRef<ActionType>(null);
-
+  const { wsCache } = useCache();
+  const message = useMessage(); // 消息弹窗
  const [type, setType] = useState<'create' | 'update'>('create');
  const [id, setId] = useState<number>(0);
-
+  const { initialState, setInitialState } = useModel('@@initialState');
  const handleEdit = (record: MenuVO) => {
    setType('update');
    setId(record.id);
@@ -47,7 +51,19 @@ const SystemMenu = () => {
  };
  const handleAdd = () => {
    setType('create');
-    configurableDrawerRef.current?.open({});
+    configurableDrawerRef.current?.open({ type: 1 });
+  };
+
+  const handleReload = async () => {
+    try {
+      await message.confirm('即将更新缓存刷新浏览器！', '刷新菜单缓存');
+      // 清空，从而触发刷新
+      // wsCache.delete(CACHE_KEY.USER);
+      // wsCache.delete(CACHE_KEY.ROLE_ROUTERS);
+      await initialState?.fetchUserInfo?.();
+      // 刷新浏览器
+      location.reload();
+    } catch {}
  };

  const handleSubmit = useCallback(
@@ -74,6 +90,13 @@ const SystemMenu = () => {
      icon: <PlusOutlined />,
      onClick: handleAdd,
    },
+    {
+      key: 'reload',
+      label: '刷新菜单缓存',
+      type: 'primary',
+      icon: <ReloadOutlined />,
+      onClick: handleReload,
+    },
  ];

  const actionColumns: ProColumns<MenuVO> = {
@@ -108,7 +131,7 @@ const SystemMenu = () => {
        columns={columns}
        request={onFetch}
        toolbarActions={toolbarActions}
-        headerTitle="租户列表"
+        headerTitle="菜单管理"
        showIndex={false}
        showSelection={false}
      />
@@ -118,6 +141,7 @@ const SystemMenu = () => {
        title={formStatusType[type]}
        columns={formColumns(type)}
        onSubmit={handleSubmit}
+        width={900}
      />
    </>
  );
--- a/src/pages/system/tenant/list/config.tsx
+++ b/src/pages/system/tenant/list/config.tsx
@@ -2,10 +2,10 @@ import type {
  ProColumns,
  ProFormColumnsType,
 } from '@ant-design/pro-components';
-import { DatePicker, Modal, Popconfirm } from 'antd';
-import { FormInstance } from 'antd/lib';
+import { Tag } from 'antd';
+
 import dayjs from 'dayjs';
-import { deleteTenant, type TenantVO } from '@/services/system/tenant/list';
+import type { TenantVO } from '@/services/system/tenant/list';
 import { getTenantPackageList } from '@/services/system/tenant/package';

 export const baseTenantColumns: ProColumns<TenantVO>[] = [
@@ -29,8 +29,22 @@ export const baseTenantColumns: ProColumns<TenantVO>[] = [
    request: async () => {
      const packageList: { id: number; name: string }[] =
        await getTenantPackageList();
-      packageList.map((item) => ({ label: item.name, value: item.id }));
-      return packageList.map((item) => ({ label: item.name, value: item.id }));
+      const newData = packageList.map((item) => ({
+        label: item.name,
+        value: item.id,
+      }));
+      const defData = [{ value: 0, label: '系统' }];
+      return [...defData, ...newData];
+    },
+    render: (dom, record) => {
+      return (
+        <Tag
+          key={record.id}
+          color={record.packageId === 0 ? 'error' : 'success'}
+        >
+          {dom}
+        </Tag>
+      );
    },
    // valueEnum: {
    //   all: { text: "全部", status: "Default" },