兼容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 isQQBrowser = navigator.userAgent.includes('QQBrowser');
const menu = ( 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 ? ( return loading ? (
<PageLoading /> <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<{ const MoreBtn: React.FC<{
record: any; record: any;
index: number; index: number;
@ -637,38 +655,12 @@ const Crontab = ({ headerStyle, isPhone, theme }: any) => {
trigger={['click']} trigger={['click']}
overlay={ overlay={
<Menu <Menu
items={getMenuItems(record)}
onClick={({ key, domEvent }) => { onClick={({ key, domEvent }) => {
domEvent.stopPropagation(); domEvent.stopPropagation();
action(key, record, index); 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()}> <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 ? ( 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 ( return (

View File

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

View File

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