71 lines
2.9 KiB
TypeScript
71 lines
2.9 KiB
TypeScript
import React from 'react'
|
|
import Icon from '@ant-design/icons'
|
|
import '@/assets/css/pages/system/settings.scss'
|
|
import FitFullscreen from '@/components/common/FitFullscreen'
|
|
import HideScrollbar from '@/components/common/HideScrollbar'
|
|
import Card from '@/components/common/Card'
|
|
import FlexBox from '@/components/common/FlexBox'
|
|
import LoadingMask from '@/components/common/LoadingMask'
|
|
import Permission from '@/components/common/Permission'
|
|
import BaseSettings from '@/pages/system/settings/BaseSettings'
|
|
import MailSettings from '@/pages/system/settings/MailSettings'
|
|
|
|
interface SettingsCardProps extends React.PropsWithChildren {
|
|
icon: IconComponent
|
|
title: string
|
|
loading?: boolean
|
|
modifyOperationCode?: string
|
|
expand?: React.ReactNode
|
|
onReset?: () => void
|
|
onSave?: () => void
|
|
}
|
|
export const SettingsCard: React.FC<SettingsCardProps> = (props) => {
|
|
return (
|
|
<Card>
|
|
<FlexBox className={'settings-card'}>
|
|
<FlexBox direction={'horizontal'} className={'head'}>
|
|
<Icon component={props.icon} className={'icon'} />
|
|
<div className={'title'}>{props.title}</div>
|
|
{!props.loading ? (
|
|
<Permission operationCode={props.modifyOperationCode}>
|
|
{props.expand}
|
|
<AntdButton onClick={props.onReset} title={'重置'}>
|
|
<Icon component={IconOxygenBack} />
|
|
</AntdButton>
|
|
<AntdButton className={'bt-save'} onClick={props.onSave} title={'保存'}>
|
|
<Icon component={IconOxygenSave} />
|
|
</AntdButton>
|
|
</Permission>
|
|
) : undefined}
|
|
</FlexBox>
|
|
<LoadingMask hidden={!props.loading}>{props.children}</LoadingMask>
|
|
</FlexBox>
|
|
</Card>
|
|
)
|
|
}
|
|
|
|
const Settings: React.FC = () => {
|
|
return (
|
|
<>
|
|
<FitFullscreen data-component={'system-settings'}>
|
|
<HideScrollbar isShowVerticalScrollbar autoHideWaitingTime={500}>
|
|
<FlexBox direction={'horizontal'} className={'root-content'}>
|
|
<FlexBox className={'root-col'}>
|
|
<Permission operationCode={'system:settings:query:base'}>
|
|
<BaseSettings />
|
|
</Permission>
|
|
</FlexBox>
|
|
<FlexBox className={'root-col'}>
|
|
<Permission operationCode={'system:settings:query:mail'}>
|
|
<MailSettings />
|
|
</Permission>
|
|
</FlexBox>
|
|
</FlexBox>
|
|
</HideScrollbar>
|
|
</FitFullscreen>
|
|
</>
|
|
)
|
|
}
|
|
|
|
export default Settings
|