diff --git a/src/components/SettingDrawer/index.js b/src/components/SettingDrawer/index.js index 72f72976054743160ee2bca3d2aacf72afdb1ff2..91ce41204f09db778697322ffe7ee336f5ffad96 100644 --- a/src/components/SettingDrawer/index.js +++ b/src/components/SettingDrawer/index.js @@ -1,5 +1,5 @@ import React, { PureComponent } from 'react'; -import { Select, message, Drawer, List, Switch, Divider, Icon, Button, Alert } from 'antd'; +import { Select, message, Drawer, List, Switch, Divider, Icon, Button, Alert, Tooltip } from 'antd'; import { formatMessage } from 'umi/locale'; import { CopyToClipboard } from 'react-copy-to-clipboard'; import { connect } from 'dva'; @@ -8,6 +8,8 @@ import styles from './index.less'; import ThemeColor from './ThemeColor'; import BlockChecbox from './BlockChecbox'; +const { Option } = Select; + const Body = ({ children, title, style }) => (
this.changeSetting('contentWidth', value)} style={{ width: 80 }} > - - {formatMessage({ id: 'app.setting.content-width.fixed' })} - - + {layout === 'sidemenu' ? null : ( + + )} + - , - ], + + + ), }, { title: formatMessage({ id: 'app.setting.fixedheader' }), - action: [ + action: ( this.changeSetting('fixedHeader', checked)} - />, - ], + /> + ), }, { title: formatMessage({ id: 'app.setting.hideheader' }), - hide: !fixedHeader, - action: [ + disabled: !fixedHeader, + disabledReason: '固定 Header 时有效', + action: ( this.changeSetting('autoHideHeader', checked)} - />, - ], + /> + ), }, { title: formatMessage({ id: 'app.setting.fixedsidebar' }), - hide: layout === 'topmenu', - action: [ + disabled: layout === 'topmenu', + disabledReason: '侧边菜单布局时有效', + action: ( this.changeSetting('fixSiderbar', checked)} - />, - ], + /> + ), }, - ].filter(item => !item.hide); + ]; }; changeSetting = (key, value) => { @@ -107,6 +113,19 @@ class SettingDrawer extends PureComponent { this.setState({ collapse: !collapse }); }; + renderLayoutSettingItem = item => { + const action = React.cloneElement(item.action, { + disabled: item.disabled, + }); + return ( + + + {item.title} + + + ); + }; + render() { const { setting } = this.props; const { navTheme, primaryColor, layout, colorWeak } = setting; @@ -183,7 +202,7 @@ class SettingDrawer extends PureComponent { {item.title}} + renderItem={this.renderLayoutSettingItem} />