兼容antd Menu

This commit is contained in:
whyour 2022-05-16 01:47:03 +08:00
parent 9dcc547ac7
commit f1a51638a5
5 changed files with 101 additions and 82 deletions

View File

@ -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 />

View File

@ -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()}>

View File

@ -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 (

View File

@ -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();
}
};

View File

@ -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()}>