import React, { PureComponent } from 'react'; import { Select, message, Drawer, List, Switch, Divider, Icon, Button } from 'antd'; import { formatMessage } from 'umi/locale'; import { CopyToClipboard } from 'react-copy-to-clipboard'; import { connect } from 'dva'; import styles from './index.less'; import ThemeColor from './ThemeColor'; import BlockChecbox from './BlockChecbox'; const Body = ({ children, title, style }) => (

{title}

{children}
); @connect(({ setting }) => ({ setting })) class SettingDarwer extends PureComponent { getLayOutSetting = () => { const { setting: { grid, fixedHeader, layout, autoHideHeader, fixSiderbar }, } = this.props; return [ { title: formatMessage({ id: 'app.setting.gridmode' }), action: [ , ], }, { title: formatMessage({ id: 'app.setting.fixedheader' }), action: [ this.changeSetting('fixedHeader', checked)} />, ], }, { title: formatMessage({ id: 'app.setting.hideheader' }), hide: !fixedHeader, action: [ this.changeSetting('autoHideHeader', checked)} />, ], }, { title: formatMessage({ id: 'app.setting.fixedsidebar' }), hide: layout === 'topmenu', action: [ this.changeSetting('fixSiderbar', checked)} />, ], }, ].filter(item => { return !item.hide; }); }; changeSetting = (key, value) => { const { setting } = this.props; const nextState = { ...setting }; nextState[key] = value; if (key === 'layout') { if (value === 'topmenu') { nextState.grid = 'Wide'; } else { nextState.grid = 'Fluid'; } } if (key === 'fixedHeader') { if (!value) { nextState.autoHideHeader = false; } } this.setState(nextState, () => { const { dispatch } = this.props; dispatch({ type: 'setting/changeSetting', payload: this.state, }); }); }; togglerContent = () => { const { setting } = this.props; this.changeSetting('collapse', !setting.collapse); }; render() { const { setting } = this.props; const { collapse, silderTheme, themeColor, layout, colorWeak } = setting; return ( {!collapse ? ( ) : ( )} } onHandleClick={this.togglerContent} style={{ zIndex: 999, }} >
this.changeSetting('silderTheme', value)} /> this.changeSetting('themeColor', color)} /> this.changeSetting('layout', value)} /> {item.title}} /> this.changeSetting('colorWeak', checked)} />, ]} > {formatMessage({ id: 'app.setting.weakmode' })} message.success(formatMessage({ id: 'app.setting.copyinfo' }))} >
{formatMessage({ id: 'app.setting.production.hint' })}
); } } export default SettingDarwer;