兼容antd Menu

src/layouts/index.tsx

@@ -213,11 +213,11 @@ export default function (props: any) {
   const isQQBrowser = navigator.userAgent.includes('QQBrowser');
 
   const menu = (
-    <Menu className="side-menu-user-drop-menu">
+    <Menu
-      <Menu.Item key="1" icon={<LogoutOutlined />} onClick={logout}>
+      className="side-menu-user-drop-menu"
-        退出登录
+      items={[{ label: '退出登录', key: 'logout', icon: <LogoutOutlined /> }]}
-      </Menu.Item>
+      onClick={logout}
-    </Menu>
+    />
   );
   return loading ? (
     <PageLoading />

src/pages/crontab/index.tsx

@@ -627,6 +627,24 @@ const Crontab = ({ headerStyle, isPhone, theme }: any) => {
     });
   };
 
+  const getMenuItems = (record: any) => {
+    return [
+      { label: '编辑', key: 'edit', icon: <EditOutlined /> },
+      {
+        label: record.isDisabled === 1 ? '启用' : '禁用',
+        key: 'enableOrDisable',
+        icon:
+          record.isDisabled === 1 ? <CheckCircleOutlined /> : <StopOutlined />,
+      },
+      { label: '删除', key: 'delete', icon: <DeleteOutlined /> },
+      {
+        label: record.isPinned === 1 ? '取消置顶' : '置顶',
+        key: 'pinOrUnPin',
+        icon: record.isPinned === 1 ? <StopOutlined /> : <PushpinOutlined />,
+      },
+    ];
+  };
+
   const MoreBtn: React.FC<{
     record: any;
     index: number;
@@ -637,38 +655,12 @@ const Crontab = ({ headerStyle, isPhone, theme }: any) => {
       trigger={['click']}
       overlay={
         <Menu
+          items={getMenuItems(record)}
           onClick={({ key, domEvent }) => {
             domEvent.stopPropagation();
             action(key, record, index);
           }}
-        >
+        />
-          <Menu.Item key="edit" icon={<EditOutlined />}>
-            编辑
-          </Menu.Item>
-          <Menu.Item
-            key="enableOrDisable"
-            icon={
-              record.isDisabled === 1 ? (
-                <CheckCircleOutlined />
-              ) : (
-                <StopOutlined />
-              )
-            }
-          >
-            {record.isDisabled === 1 ? '启用' : '禁用'}
-          </Menu.Item>
-          <Menu.Item key="delete" icon={<DeleteOutlined />}>
-            删除
-          </Menu.Item>
-          <Menu.Item
-            key="pinOrUnPin"
-            icon={
-              record.isPinned === 1 ? <StopOutlined /> : <PushpinOutlined />
-            }
-          >
-            {record.isPinned === 1 ? '取消置顶' : '置顶'}
-          </Menu.Item>
-        </Menu>
       }
     >
       <a onClick={(e) => e.stopPropagation()}>

src/pages/script/index.tsx

@@ -367,37 +367,68 @@ const Script = ({ headerStyle, isPhone, theme, socketMessage }: any) => {
     }
   }, []);
 
+  const action = (key: string | number) => {
+    switch (key) {
+      case 'save':
+        saveFile();
+        break;
+      case 'exit':
+        cancelEdit();
+        break;
+      default:
+        break;
+    }
+  };
+
+  const menuAction = (key: string | number) => {
+    switch (key) {
+      case 'save':
+        addFile();
+        break;
+      case 'edit':
+        editFile();
+        break;
+      case 'delete':
+        deleteFile();
+        break;
+      default:
+        break;
+    }
+  };
+
   const menu = isEditing ? (
-    <Menu>
+    <Menu
-      <Menu.Item key="save" icon={<PlusOutlined />} onClick={saveFile}>
+      items={[
-        保存
+        { label: '保存', key: 'save', icon: <PlusOutlined /> },
-      </Menu.Item>
+        { label: '退出编辑', key: 'exit', icon: <EditOutlined /> },
-      <Menu.Item key="exit" icon={<EditOutlined />} onClick={cancelEdit}>
+      ]}
-        退出编辑
+      onClick={({ key, domEvent }) => {
-      </Menu.Item>
+        domEvent.stopPropagation();
-    </Menu>
+        action(key);
+      }}
+    />
   ) : (
-    <Menu>
+    <Menu
-      <Menu.Item key="add" icon={<PlusOutlined />} onClick={addFile}>
+      items={[
-        新建
+        { label: '新建', key: 'add', icon: <PlusOutlined /> },
-      </Menu.Item>
+        {
-      <Menu.Item
+          label: '编辑',
-        key="edit"
+          key: 'edit',
-        icon={<EditOutlined />}
+          icon: <EditOutlined />,
-        onClick={editFile}
+          disabled: !select,
-        disabled={!select}
+        },
-      >
+        {
-        编辑
+          label: '删除',
-      </Menu.Item>
+          key: 'delete',
-      <Menu.Item
+          icon: <DeleteOutlined />,
-        key="delete"
+          disabled: !select,
-        icon={<DeleteOutlined />}
+        },
-        onClick={deleteFile}
+      ]}
-        disabled={!select}
+      onClick={({ key, domEvent }) => {
-      >
+        domEvent.stopPropagation();
-        删除
+        menuAction(key);
-      </Menu.Item>
+      }}
-    </Menu>
+    />
   );
 
   return (

src/pages/setting/security.tsx

@@ -93,6 +93,7 @@ const SecuritySettings = ({ user, userChange }: any) => {
   const onChange = (e) => {
     if (e.file && e.file.response) {
       setAvatar(`/api/static/${e.file.response.data}`);
+      userChange();
     }
   };
 

src/pages/subscription/index.tsx

@@ -393,30 +393,25 @@ const Subscription = ({ headerStyle, isPhone, theme }: any) => {
       trigger={['click']}
       overlay={
         <Menu
+          items={[
+            { label: '编辑', key: 'edit', icon: <EditOutlined /> },
+            {
+              label: record.is_disabled === 1 ? '启用' : '禁用',
+              key: 'enableOrDisable',
+              icon:
+                record.is_disabled === 1 ? (
+                  <CheckCircleOutlined />
+                ) : (
+                  <StopOutlined />
+                ),
+            },
+            { label: '删除', key: 'delete', icon: <DeleteOutlined /> },
+          ]}
           onClick={({ key, domEvent }) => {
             domEvent.stopPropagation();
             action(key, record, index);
           }}
-        >
+        />
-          <Menu.Item key="edit" icon={<EditOutlined />}>
-            编辑
-          </Menu.Item>
-          <Menu.Item
-            key="enableOrDisable"
-            icon={
-              record.is_disabled === 1 ? (
-                <CheckCircleOutlined />
-              ) : (
-                <StopOutlined />
-              )
-            }
-          >
-            {record.is_disabled === 1 ? '启用' : '禁用'}
-          </Menu.Item>
-          <Menu.Item key="delete" icon={<DeleteOutlined />}>
-            删除
-          </Menu.Item>
-        </Menu>
       }
     >
       <a onClick={(e) => e.stopPropagation()}>