From f1a51638a570d9519acf1dff7b805d3896c4d999 Mon Sep 17 00:00:00 2001
From: whyour <imwhyour@gmail.com>
Date: Mon, 16 May 2022 01:47:03 +0800
Subject: [PATCH] =?UTF-8?q?=E5=85=BC=E5=AE=B9antd=20Menu?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/layouts/index.tsx            | 10 ++--
 src/pages/crontab/index.tsx      | 48 +++++++----------
 src/pages/script/index.tsx       | 89 +++++++++++++++++++++-----------
 src/pages/setting/security.tsx   |  1 +
 src/pages/subscription/index.tsx | 35 ++++++-------
 5 files changed, 101 insertions(+), 82 deletions(-)

diff --git a/src/layouts/index.tsx b/src/layouts/index.tsx
index 7cf3108c..726b987a 100644
--- a/src/layouts/index.tsx
+++ b/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.Item key="1" icon={<LogoutOutlined />} onClick={logout}>
-        退出登录
-      </Menu.Item>
-    </Menu>
+    <Menu
+      className="side-menu-user-drop-menu"
+      items={[{ label: '退出登录', key: 'logout', icon: <LogoutOutlined /> }]}
+      onClick={logout}
+    />
   );
   return loading ? (
     <PageLoading />
diff --git a/src/pages/crontab/index.tsx b/src/pages/crontab/index.tsx
index 1015e5cf..23b2dde0 100644
--- a/src/pages/crontab/index.tsx
+++ b/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()}>
diff --git a/src/pages/script/index.tsx b/src/pages/script/index.tsx
index 8e71939e..4b96b970 100644
--- a/src/pages/script/index.tsx
+++ b/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.Item key="save" icon={<PlusOutlined />} onClick={saveFile}>
-        保存
-      </Menu.Item>
-      <Menu.Item key="exit" icon={<EditOutlined />} onClick={cancelEdit}>
-        退出编辑
-      </Menu.Item>
-    </Menu>
+    <Menu
+      items={[
+        { label: '保存', key: 'save', icon: <PlusOutlined /> },
+        { label: '退出编辑', key: 'exit', icon: <EditOutlined /> },
+      ]}
+      onClick={({ key, domEvent }) => {
+        domEvent.stopPropagation();
+        action(key);
+      }}
+    />
   ) : (
-    <Menu>
-      <Menu.Item key="add" icon={<PlusOutlined />} onClick={addFile}>
-        新建
-      </Menu.Item>
-      <Menu.Item
-        key="edit"
-        icon={<EditOutlined />}
-        onClick={editFile}
-        disabled={!select}
-      >
-        编辑
-      </Menu.Item>
-      <Menu.Item
-        key="delete"
-        icon={<DeleteOutlined />}
-        onClick={deleteFile}
-        disabled={!select}
-      >
-        删除
-      </Menu.Item>
-    </Menu>
+    <Menu
+      items={[
+        { label: '新建', key: 'add', icon: <PlusOutlined /> },
+        {
+          label: '编辑',
+          key: 'edit',
+          icon: <EditOutlined />,
+          disabled: !select,
+        },
+        {
+          label: '删除',
+          key: 'delete',
+          icon: <DeleteOutlined />,
+          disabled: !select,
+        },
+      ]}
+      onClick={({ key, domEvent }) => {
+        domEvent.stopPropagation();
+        menuAction(key);
+      }}
+    />
   );
 
   return (
diff --git a/src/pages/setting/security.tsx b/src/pages/setting/security.tsx
index 25a45226..8e3ab7e2 100644
--- a/src/pages/setting/security.tsx
+++ b/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();
     }
   };
 
diff --git a/src/pages/subscription/index.tsx b/src/pages/subscription/index.tsx
index b0f86d60..261524d9 100644
--- a/src/pages/subscription/index.tsx
+++ b/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()}>