Optimize code
This commit is contained in:
@@ -11,7 +11,7 @@ interface IndicatorProps {
|
|||||||
const Indicator: React.FC<IndicatorProps> = ({ total, current, onSwitch }) => {
|
const Indicator: React.FC<IndicatorProps> = ({ total, current, onSwitch }) => {
|
||||||
const handleClick = (index: number) => {
|
const handleClick = (index: number) => {
|
||||||
return () => {
|
return () => {
|
||||||
onSwitch && onSwitch(index)
|
onSwitch?.(index)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -16,7 +16,7 @@ const Item: React.FC<ItemProps> = (props) => {
|
|||||||
|
|
||||||
const showSubmenu = (e: React.MouseEvent) => {
|
const showSubmenu = (e: React.MouseEvent) => {
|
||||||
const parentElement = e.currentTarget.parentElement
|
const parentElement = e.currentTarget.parentElement
|
||||||
if (parentElement && parentElement.childElementCount === 2) {
|
if (parentElement?.childElementCount === 2) {
|
||||||
const parentClientRect = parentElement.getBoundingClientRect()
|
const parentClientRect = parentElement.getBoundingClientRect()
|
||||||
if (parentClientRect.top <= screen.height / 2) {
|
if (parentClientRect.top <= screen.height / 2) {
|
||||||
setSubmenuTop(parentClientRect.top)
|
setSubmenuTop(parentClientRect.top)
|
||||||
@@ -42,18 +42,16 @@ const Item: React.FC<ItemProps> = (props) => {
|
|||||||
}
|
}
|
||||||
>
|
>
|
||||||
<div className={'icon-box'}>
|
<div className={'icon-box'}>
|
||||||
{props.icon ? (
|
{props.icon && <Icon className={'icon'} component={props.icon} />}
|
||||||
<Icon className={'icon'} component={props.icon} />
|
|
||||||
) : undefined}
|
|
||||||
</div>
|
</div>
|
||||||
<span className={'text'}>{props.text}</span>
|
<span className={'text'}>{props.text}</span>
|
||||||
</NavLink>
|
</NavLink>
|
||||||
</div>
|
</div>
|
||||||
{props.children ? (
|
{props.children && (
|
||||||
<Submenu submenuTop={submenuTop} submenuLeft={submenuLeft}>
|
<Submenu submenuTop={submenuTop} submenuLeft={submenuLeft}>
|
||||||
{props.children}
|
{props.children}
|
||||||
</Submenu>
|
</Submenu>
|
||||||
) : undefined}
|
)}
|
||||||
</li>
|
</li>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -29,7 +29,7 @@ const Sidebar: React.FC<SidebarProps> & {
|
|||||||
const switchSidebar = () => {
|
const switchSidebar = () => {
|
||||||
setLocalStorage('HIDE_SIDEBAR', !hideSidebar ? 'true' : 'false')
|
setLocalStorage('HIDE_SIDEBAR', !hideSidebar ? 'true' : 'false')
|
||||||
setHideSidebar(!hideSidebar)
|
setHideSidebar(!hideSidebar)
|
||||||
props.onSidebarSwitch && props.onSidebarSwitch(hideSidebar)
|
props.onSidebarSwitch?.(hideSidebar)
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|||||||
@@ -529,9 +529,9 @@ const Group: React.FC = () => {
|
|||||||
}
|
}
|
||||||
suffix={
|
suffix={
|
||||||
<>
|
<>
|
||||||
{!isRegexLegal ? (
|
{!isRegexLegal && (
|
||||||
<span style={{ color: COLOR_ERROR_SECONDARY }}>非法表达式</span>
|
<span style={{ color: COLOR_ERROR_SECONDARY }}>非法表达式</span>
|
||||||
) : undefined}
|
)}
|
||||||
<AntdCheckbox checked={isUseRegex} onChange={handleOnUseRegexChange}>
|
<AntdCheckbox checked={isUseRegex} onChange={handleOnUseRegexChange}>
|
||||||
<AntdTooltip title={'正则表达式'}>.*</AntdTooltip>
|
<AntdTooltip title={'正则表达式'}>.*</AntdTooltip>
|
||||||
</AntdCheckbox>
|
</AntdCheckbox>
|
||||||
|
|||||||
@@ -538,9 +538,9 @@ const Role: React.FC = () => {
|
|||||||
}
|
}
|
||||||
suffix={
|
suffix={
|
||||||
<>
|
<>
|
||||||
{!isRegexLegal ? (
|
{!isRegexLegal && (
|
||||||
<span style={{ color: COLOR_ERROR_SECONDARY }}>非法表达式</span>
|
<span style={{ color: COLOR_ERROR_SECONDARY }}>非法表达式</span>
|
||||||
) : undefined}
|
)}
|
||||||
<AntdCheckbox checked={isUseRegex} onChange={handleOnUseRegexChange}>
|
<AntdCheckbox checked={isUseRegex} onChange={handleOnUseRegexChange}>
|
||||||
<AntdTooltip title={'正则表达式'}>.*</AntdTooltip>
|
<AntdTooltip title={'正则表达式'}>.*</AntdTooltip>
|
||||||
</AntdCheckbox>
|
</AntdCheckbox>
|
||||||
|
|||||||
@@ -123,7 +123,7 @@ const SensitiveWord: React.FC = () => {
|
|||||||
justifyContent: 'flex-end'
|
justifyContent: 'flex-end'
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{selectedKeys?.length === 1 ? (
|
{selectedKeys?.length === 1 && (
|
||||||
<AntdTooltip title={'删除选中项'}>
|
<AntdTooltip title={'删除选中项'}>
|
||||||
<Icon
|
<Icon
|
||||||
style={{ fontSize: '1.2em' }}
|
style={{ fontSize: '1.2em' }}
|
||||||
@@ -131,7 +131,7 @@ const SensitiveWord: React.FC = () => {
|
|||||||
onClick={handleOnDelete}
|
onClick={handleOnDelete}
|
||||||
/>
|
/>
|
||||||
</AntdTooltip>
|
</AntdTooltip>
|
||||||
) : undefined}
|
)}
|
||||||
备选
|
备选
|
||||||
</span>,
|
</span>,
|
||||||
'拦截'
|
'拦截'
|
||||||
|
|||||||
@@ -27,7 +27,7 @@ export const SettingsCard: React.FC<SettingsCardProps> = (props) => {
|
|||||||
<FlexBox direction={'horizontal'} className={'head'}>
|
<FlexBox direction={'horizontal'} className={'head'}>
|
||||||
<Icon component={props.icon} className={'icon'} />
|
<Icon component={props.icon} className={'icon'} />
|
||||||
<div className={'title'}>{props.title}</div>
|
<div className={'title'}>{props.title}</div>
|
||||||
{!props.loading ? (
|
{!props.loading && (
|
||||||
<Permission operationCode={props.modifyOperationCode}>
|
<Permission operationCode={props.modifyOperationCode}>
|
||||||
{props.expand}
|
{props.expand}
|
||||||
<AntdButton onClick={props.onReset} title={'重置'}>
|
<AntdButton onClick={props.onReset} title={'重置'}>
|
||||||
@@ -37,7 +37,7 @@ export const SettingsCard: React.FC<SettingsCardProps> = (props) => {
|
|||||||
<Icon component={IconOxygenSave} />
|
<Icon component={IconOxygenSave} />
|
||||||
</AntdButton>
|
</AntdButton>
|
||||||
</Permission>
|
</Permission>
|
||||||
) : undefined}
|
)}
|
||||||
</FlexBox>
|
</FlexBox>
|
||||||
<LoadingMask
|
<LoadingMask
|
||||||
maskContent={<AntdSkeleton active paragraph={{ rows: 6 }} />}
|
maskContent={<AntdSkeleton active paragraph={{ rows: 6 }} />}
|
||||||
|
|||||||
@@ -169,22 +169,20 @@ const User: React.FC = () => {
|
|||||||
<AntdTag color={'green'}>正常</AntdTag>
|
<AntdTag color={'green'}>正常</AntdTag>
|
||||||
) : (
|
) : (
|
||||||
<>
|
<>
|
||||||
{record.verify ? (
|
{record.verify && (
|
||||||
<>
|
<>
|
||||||
<AntdPopover content={record.verify} trigger={'click'}>
|
<AntdPopover content={record.verify} trigger={'click'}>
|
||||||
<AntdTag style={{ cursor: 'pointer' }}>未验证</AntdTag>
|
<AntdTag style={{ cursor: 'pointer' }}>未验证</AntdTag>
|
||||||
</AntdPopover>
|
</AntdPopover>
|
||||||
</>
|
</>
|
||||||
) : undefined}
|
)}
|
||||||
{record.locking ? <AntdTag>锁定</AntdTag> : undefined}
|
{record.locking && <AntdTag>锁定</AntdTag>}
|
||||||
{record.expiration && isPastTime(record.expiration) ? (
|
{record.expiration && isPastTime(record.expiration) && (
|
||||||
<AntdTag>过期</AntdTag>
|
<AntdTag>过期</AntdTag>
|
||||||
) : undefined}
|
)}
|
||||||
{record.credentialsExpiration &&
|
{record.credentialsExpiration &&
|
||||||
isPastTime(record.credentialsExpiration) ? (
|
isPastTime(record.credentialsExpiration) && <AntdTag>改密</AntdTag>}
|
||||||
<AntdTag>改密</AntdTag>
|
{!record.enable && <AntdTag>禁用</AntdTag>}
|
||||||
) : undefined}
|
|
||||||
{!record.enable ? <AntdTag>禁用</AntdTag> : undefined}
|
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
</AntdTooltip>
|
</AntdTooltip>
|
||||||
@@ -215,14 +213,14 @@ const User: React.FC = () => {
|
|||||||
</a>
|
</a>
|
||||||
</Permission>
|
</Permission>
|
||||||
<Permission operationCode={'system:user:delete:one'}>
|
<Permission operationCode={'system:user:delete:one'}>
|
||||||
{record.id !== '0' ? (
|
{record.id !== '0' && (
|
||||||
<a
|
<a
|
||||||
style={{ color: COLOR_PRODUCTION }}
|
style={{ color: COLOR_PRODUCTION }}
|
||||||
onClick={handleOnDeleteBtnClick(record)}
|
onClick={handleOnDeleteBtnClick(record)}
|
||||||
>
|
>
|
||||||
删除
|
删除
|
||||||
</a>
|
</a>
|
||||||
) : undefined}
|
)}
|
||||||
</Permission>
|
</Permission>
|
||||||
</AntdSpace>
|
</AntdSpace>
|
||||||
</>
|
</>
|
||||||
@@ -378,7 +376,7 @@ const User: React.FC = () => {
|
|||||||
>
|
>
|
||||||
<AntdInput.Password />
|
<AntdInput.Password />
|
||||||
</AntdForm.Item>
|
</AntdForm.Item>
|
||||||
{value.id !== '0' ? (
|
{value.id !== '0' && (
|
||||||
<AntdForm.Item
|
<AntdForm.Item
|
||||||
name={'needChangePassword'}
|
name={'needChangePassword'}
|
||||||
label={'需改密'}
|
label={'需改密'}
|
||||||
@@ -387,7 +385,7 @@ const User: React.FC = () => {
|
|||||||
>
|
>
|
||||||
<AntdSwitch />
|
<AntdSwitch />
|
||||||
</AntdForm.Item>
|
</AntdForm.Item>
|
||||||
) : undefined}
|
)}
|
||||||
</AntdForm>
|
</AntdForm>
|
||||||
),
|
),
|
||||||
onOk: () =>
|
onOk: () =>
|
||||||
@@ -803,7 +801,7 @@ const User: React.FC = () => {
|
|||||||
>
|
>
|
||||||
<AntdInput allowClear />
|
<AntdInput allowClear />
|
||||||
</AntdForm.Item>
|
</AntdForm.Item>
|
||||||
{!isDrawerEdit ? (
|
{!isDrawerEdit && (
|
||||||
<>
|
<>
|
||||||
<AntdForm.Item
|
<AntdForm.Item
|
||||||
name={'password'}
|
name={'password'}
|
||||||
@@ -813,7 +811,7 @@ const User: React.FC = () => {
|
|||||||
<AntdInput.Password allowClear />
|
<AntdInput.Password allowClear />
|
||||||
</AntdForm.Item>
|
</AntdForm.Item>
|
||||||
</>
|
</>
|
||||||
) : undefined}
|
)}
|
||||||
<AntdForm.Item name={'nickname'} label={'昵称'} rules={[{ whitespace: false }]}>
|
<AntdForm.Item name={'nickname'} label={'昵称'} rules={[{ whitespace: false }]}>
|
||||||
<AntdInput allowClear />
|
<AntdInput allowClear />
|
||||||
</AntdForm.Item>
|
</AntdForm.Item>
|
||||||
@@ -824,7 +822,7 @@ const User: React.FC = () => {
|
|||||||
>
|
>
|
||||||
<AntdInput type={'email'} allowClear />
|
<AntdInput type={'email'} allowClear />
|
||||||
</AntdForm.Item>
|
</AntdForm.Item>
|
||||||
{formValues?.id !== '0' ? (
|
{formValues?.id !== '0' && (
|
||||||
<>
|
<>
|
||||||
<AntdForm.Item name={'roleIds'} label={'角色'}>
|
<AntdForm.Item name={'roleIds'} label={'角色'}>
|
||||||
<AntdSelect
|
<AntdSelect
|
||||||
@@ -900,7 +898,7 @@ const User: React.FC = () => {
|
|||||||
<AntdSwitch />
|
<AntdSwitch />
|
||||||
</AntdForm.Item>
|
</AntdForm.Item>
|
||||||
</>
|
</>
|
||||||
) : undefined}
|
)}
|
||||||
</AntdForm>
|
</AntdForm>
|
||||||
)
|
)
|
||||||
|
|
||||||
@@ -943,9 +941,9 @@ const User: React.FC = () => {
|
|||||||
}
|
}
|
||||||
suffix={
|
suffix={
|
||||||
<>
|
<>
|
||||||
{!isRegexLegal ? (
|
{!isRegexLegal && (
|
||||||
<span style={{ color: COLOR_ERROR_SECONDARY }}>非法表达式</span>
|
<span style={{ color: COLOR_ERROR_SECONDARY }}>非法表达式</span>
|
||||||
) : undefined}
|
)}
|
||||||
<AntdCheckbox checked={isUseRegex} onChange={handleOnUseRegexChange}>
|
<AntdCheckbox checked={isUseRegex} onChange={handleOnUseRegexChange}>
|
||||||
<AntdTooltip title={'正则表达式'}>.*</AntdTooltip>
|
<AntdTooltip title={'正则表达式'}>.*</AntdTooltip>
|
||||||
</AntdCheckbox>
|
</AntdCheckbox>
|
||||||
|
|||||||
@@ -13,7 +13,8 @@ const SystemFramework: React.FC = () => {
|
|||||||
<Sidebar title={'系统配置'}>
|
<Sidebar title={'系统配置'}>
|
||||||
<Sidebar.ItemList>
|
<Sidebar.ItemList>
|
||||||
{getSystemRouteJson().map((value) => {
|
{getSystemRouteJson().map((value) => {
|
||||||
return value.menu ? (
|
return (
|
||||||
|
value.menu && (
|
||||||
<Sidebar.Item
|
<Sidebar.Item
|
||||||
end={value.id === 'system' ? true : undefined}
|
end={value.id === 'system' ? true : undefined}
|
||||||
path={value.absolutePath}
|
path={value.absolutePath}
|
||||||
@@ -21,7 +22,8 @@ const SystemFramework: React.FC = () => {
|
|||||||
text={value.name}
|
text={value.name}
|
||||||
key={value.id}
|
key={value.id}
|
||||||
/>
|
/>
|
||||||
) : undefined
|
)
|
||||||
|
)
|
||||||
})}
|
})}
|
||||||
</Sidebar.ItemList>
|
</Sidebar.ItemList>
|
||||||
</Sidebar>
|
</Sidebar>
|
||||||
|
|||||||
@@ -42,8 +42,8 @@ const ToolsFramework: React.FC = () => {
|
|||||||
text={tool.name}
|
text={tool.name}
|
||||||
key={tool.id}
|
key={tool.id}
|
||||||
>
|
>
|
||||||
{tool.children
|
{tool.children &&
|
||||||
? tool.children.map((subTool) => {
|
tool.children.map((subTool) => {
|
||||||
return (
|
return (
|
||||||
<Sidebar.Item
|
<Sidebar.Item
|
||||||
path={subTool.absolutePath}
|
path={subTool.absolutePath}
|
||||||
@@ -51,8 +51,7 @@ const ToolsFramework: React.FC = () => {
|
|||||||
key={subTool.id}
|
key={subTool.id}
|
||||||
/>
|
/>
|
||||||
)
|
)
|
||||||
})
|
})}
|
||||||
: undefined}
|
|
||||||
</Sidebar.Item>
|
</Sidebar.Item>
|
||||||
) : undefined
|
) : undefined
|
||||||
})}
|
})}
|
||||||
|
|||||||
@@ -15,13 +15,13 @@ const ToolsFramework: React.FC = () => {
|
|||||||
title={'个人中心'}
|
title={'个人中心'}
|
||||||
bottomFixed={
|
bottomFixed={
|
||||||
<Sidebar.ItemList>
|
<Sidebar.ItemList>
|
||||||
{hasPathPermission('/system') ? (
|
{hasPathPermission('/system') && (
|
||||||
<Sidebar.Item
|
<Sidebar.Item
|
||||||
path={'/system'}
|
path={'/system'}
|
||||||
icon={IconOxygenSetting}
|
icon={IconOxygenSetting}
|
||||||
text={'系统配置'}
|
text={'系统配置'}
|
||||||
/>
|
/>
|
||||||
) : undefined}
|
)}
|
||||||
<Sidebar.Item
|
<Sidebar.Item
|
||||||
path={'/'}
|
path={'/'}
|
||||||
icon={IconOxygenBack}
|
icon={IconOxygenBack}
|
||||||
@@ -32,15 +32,17 @@ const ToolsFramework: React.FC = () => {
|
|||||||
>
|
>
|
||||||
<Sidebar.ItemList>
|
<Sidebar.ItemList>
|
||||||
{user.map((value) => {
|
{user.map((value) => {
|
||||||
return value.menu ? (
|
return (
|
||||||
|
value.menu && (
|
||||||
<Sidebar.Item
|
<Sidebar.Item
|
||||||
end={value.id === 'user' ? true : undefined}
|
end={value.id === 'user' && true}
|
||||||
path={value.absolutePath}
|
path={value.absolutePath}
|
||||||
icon={value.icon}
|
icon={value.icon}
|
||||||
text={value.name}
|
text={value.name}
|
||||||
key={value.id}
|
key={value.id}
|
||||||
/>
|
/>
|
||||||
) : undefined
|
)
|
||||||
|
)
|
||||||
})}
|
})}
|
||||||
</Sidebar.ItemList>
|
</Sidebar.ItemList>
|
||||||
</Sidebar>
|
</Sidebar>
|
||||||
|
|||||||
@@ -7,8 +7,7 @@ export const getRedirectUrl = (path: string, redirectUrl: string): string => {
|
|||||||
|
|
||||||
export const getFullTitle = (data: _DataNode, preTitle?: string) => {
|
export const getFullTitle = (data: _DataNode, preTitle?: string) => {
|
||||||
data.fullTitle = `${preTitle ? `${preTitle}-` : ''}${data.title as string}`
|
data.fullTitle = `${preTitle ? `${preTitle}-` : ''}${data.title as string}`
|
||||||
data.children &&
|
data.children?.forEach((value) => {
|
||||||
data.children.forEach((value) => {
|
|
||||||
getFullTitle(value, data.fullTitle)
|
getFullTitle(value, data.fullTitle)
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user