Commit 22718f23 authored by chencheng's avatar chencheng Committed by Yu

feat: remove SettingDrawer

parent cc7f8f1d
import React from 'react';
import { Tooltip, Icon } from 'antd';
import { formatMessage } from 'umi/locale';
import styles from './ThemeColor.less';
const Tag = ({ color, check, ...rest }) => (
<div
{...rest}
style={{
backgroundColor: color,
}}
>
{check ? <Icon type="check" /> : ''}
</div>
);
const ThemeColor = ({ colors, title, value, onChange }) => {
let colorList = colors;
if (!colors) {
colorList = [
{
key: 'dust',
color: '#F5222D',
},
{
key: 'volcano',
color: '#FA541C',
},
{
key: 'sunset',
color: '#FAAD14',
},
{
key: 'cyan',
color: '#13C2C2',
},
{
key: 'green',
color: '#52C41A',
},
{
key: 'daybreak',
color: '#1890FF',
},
{
key: 'geekblue',
color: '#2F54EB',
},
{
key: 'purple',
color: '#722ED1',
},
];
}
return (
<div className={styles.themeColor}>
<h3 className={styles.title}>{title}</h3>
<div className={styles.content}>
{colorList.map(({ key, color }) => (
<Tooltip key={color} title={formatMessage({ id: `app.setting.themecolor.${key}` })}>
<Tag
className={styles.colorBlock}
color={color}
check={value === color}
onClick={() => onChange && onChange(color)}
/>
</Tooltip>
))}
</div>
</div>
);
};
export default ThemeColor;
.themeColor {
overflow: hidden;
margin-top: 24px;
.title {
font-size: 14px;
color: rgba(0, 0, 0, 0.65);
line-height: 22px;
margin-bottom: 12px;
}
.colorBlock {
width: 20px;
height: 20px;
border-radius: 2px;
float: left;
cursor: pointer;
margin-right: 8px;
text-align: center;
color: #fff;
font-weight: bold;
}
}
@import '~antd/lib/style/themes/default.less';
.content {
min-height: 100%;
background: #fff;
position: relative;
}
.blockChecbox {
display: flex;
.item {
margin-right: 16px;
position: relative;
// box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1);
border-radius: @border-radius-base;
cursor: pointer;
img {
width: 48px;
}
}
.selectIcon {
position: absolute;
top: 0;
right: 0;
width: 100%;
padding-top: 15px;
padding-left: 24px;
height: 100%;
color: @primary-color;
font-size: 14px;
font-weight: bold;
}
}
.color_block {
width: 38px;
height: 22px;
margin: 4px;
border-radius: 4px;
cursor: pointer;
margin-right: 12px;
display: inline-block;
vertical-align: middle;
}
.title {
font-size: 14px;
color: @heading-color;
line-height: 22px;
margin-bottom: 12px;
}
.handle {
position: absolute;
top: 240px;
background: @primary-color;
width: 48px;
height: 48px;
right: 300px;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
pointer-events: auto;
z-index: 0;
text-align: center;
font-size: 16px;
border-radius: 4px 0 0 4px;
}
.productionHint {
font-size: 12px;
margin-top: 16px;
}
import React, { Suspense } from 'react'; import React from 'react';
import { Layout } from 'antd'; import { Layout } from 'antd';
import DocumentTitle from 'react-document-title'; import DocumentTitle from 'react-document-title';
import isEqual from 'lodash/isEqual'; import isEqual from 'lodash/isEqual';
...@@ -14,14 +14,10 @@ import logo from '../assets/logo.svg'; ...@@ -14,14 +14,10 @@ import logo from '../assets/logo.svg';
import Footer from './Footer'; import Footer from './Footer';
import Header from './Header'; import Header from './Header';
import Context from './MenuContext'; import Context from './MenuContext';
import PageLoading from '@/components/PageLoading';
import SiderMenu from '@/components/SiderMenu'; import SiderMenu from '@/components/SiderMenu';
import { title } from '../defaultSettings'; import { title } from '../defaultSettings';
import styles from './BasicLayout.less'; import styles from './BasicLayout.less';
// lazy load SettingDrawer
const SettingDrawer = React.lazy(() => import('@/components/SettingDrawer'));
const { Content } = Layout; const { Content } = Layout;
const Exception403 = <p>Exception403</p>; const Exception403 = <p>Exception403</p>;
...@@ -145,15 +141,6 @@ class BasicLayout extends React.PureComponent { ...@@ -145,15 +141,6 @@ class BasicLayout extends React.PureComponent {
}); });
}; };
renderSettingDrawer = () => {
// Do not render SettingDrawer in production
// unless it is deployed in preview.pro.ant.design as demo
if (process.env.NODE_ENV === 'production' && APP_TYPE !== 'site') {
return null;
}
return <SettingDrawer />;
};
render() { render() {
const { const {
navTheme, navTheme,
...@@ -215,7 +202,6 @@ class BasicLayout extends React.PureComponent { ...@@ -215,7 +202,6 @@ class BasicLayout extends React.PureComponent {
)} )}
</ContainerQuery> </ContainerQuery>
</DocumentTitle> </DocumentTitle>
<Suspense fallback={<PageLoading />}>{this.renderSettingDrawer()}</Suspense>
</React.Fragment> </React.Fragment>
); );
} }
......
import globalHeader from './en-US/globalHeader'; import globalHeader from './en-US/globalHeader';
import menu from './en-US/menu'; import menu from './en-US/menu';
import settingDrawer from './en-US/settingDrawer';
import settings from './en-US/settings'; import settings from './en-US/settings';
import pwa from './en-US/pwa';
export default { export default {
'navBar.lang': 'Languages', 'navBar.lang': 'Languages',
...@@ -12,7 +10,5 @@ export default { ...@@ -12,7 +10,5 @@ export default {
'app.home.introduce': 'introduce', 'app.home.introduce': 'introduce',
...globalHeader, ...globalHeader,
...menu, ...menu,
...settingDrawer,
...settings, ...settings,
...pwa,
}; };
export default {
'app.pwa.offline': 'You are offline now',
'app.pwa.serviceworker.updated': 'New content is available',
'app.pwa.serviceworker.updated.hint': 'Please press the "Refresh" button to reload current page',
'app.pwa.serviceworker.updated.ok': 'Refresh',
};
export default {
'app.setting.pagestyle': 'Page style setting',
'app.setting.pagestyle.dark': 'Dark style',
'app.setting.pagestyle.light': 'Light style',
'app.setting.content-width': 'Content Width',
'app.setting.content-width.fixed': 'Fixed',
'app.setting.content-width.fluid': 'Fluid',
'app.setting.themecolor': 'Theme Color',
'app.setting.themecolor.dust': 'Dust Red',
'app.setting.themecolor.volcano': 'Volcano',
'app.setting.themecolor.sunset': 'Sunset Orange',
'app.setting.themecolor.cyan': 'Cyan',
'app.setting.themecolor.green': 'Polar Green',
'app.setting.themecolor.daybreak': 'Daybreak Blue (default)',
'app.setting.themecolor.geekblue': 'Geek Glue',
'app.setting.themecolor.purple': 'Golden Purple',
'app.setting.navigationmode': 'Navigation Mode',
'app.setting.sidemenu': 'Side Menu Layout',
'app.setting.topmenu': 'Top Menu Layout',
'app.setting.fixedheader': 'Fixed Header',
'app.setting.fixedsidebar': 'Fixed Sidebar',
'app.setting.fixedsidebar.hint': 'Works on Side Menu Layout',
'app.setting.hideheader': 'Hidden Header when scrolling',
'app.setting.hideheader.hint': 'Works when Hidden Header is enabled',
'app.setting.othersettings': 'Other Settings',
'app.setting.weakmode': 'Weak Mode',
'app.setting.copy': 'Copy Setting',
'app.setting.copyinfo': 'copy success,please replace defaultSettings in src/models/setting.js',
'app.setting.production.hint':
'Setting panel shows in development environment only, please manually modify',
};
import globalHeader from './pt-BR/globalHeader'; import globalHeader from './pt-BR/globalHeader';
import menu from './pt-BR/menu'; import menu from './pt-BR/menu';
import settingDrawer from './pt-BR/settingDrawer';
import settings from './pt-BR/settings'; import settings from './pt-BR/settings';
import pwa from './pt-BR/pwa';
export default { export default {
'navBar.lang': 'Idiomas', 'navBar.lang': 'Idiomas',
...@@ -12,7 +10,5 @@ export default { ...@@ -12,7 +10,5 @@ export default {
'app.home.introduce': 'introduzir', 'app.home.introduce': 'introduzir',
...globalHeader, ...globalHeader,
...menu, ...menu,
...settingDrawer,
...settings, ...settings,
...pwa,
}; };
export default {
'app.pwa.offline': 'Você está offline agora',
'app.pwa.serviceworker.updated': 'Novo conteúdo está disponível',
'app.pwa.serviceworker.updated.hint':
'Por favor, pressione o botão "Atualizar" para recarregar a página atual',
'app.pwa.serviceworker.updated.ok': 'Atualizar',
};
export default {
'app.setting.pagestyle': 'Configuração de estilo da página',
'app.setting.pagestyle.dark': 'Dark style',
'app.setting.pagestyle.light': 'Light style',
'app.setting.content-width': 'Largura do conteúdo',
'app.setting.content-width.fixed': 'Fixo',
'app.setting.content-width.fluid': 'Fluido',
'app.setting.themecolor': 'Cor do Tema',
'app.setting.themecolor.dust': 'Dust Red',
'app.setting.themecolor.volcano': 'Volcano',
'app.setting.themecolor.sunset': 'Sunset Orange',
'app.setting.themecolor.cyan': 'Cyan',
'app.setting.themecolor.green': 'Polar Green',
'app.setting.themecolor.daybreak': 'Daybreak Blue (default)',
'app.setting.themecolor.geekblue': 'Geek Glue',
'app.setting.themecolor.purple': 'Golden Purple',
'app.setting.navigationmode': 'Modo de Navegação',
'app.setting.sidemenu': 'Layout do Menu Lateral',
'app.setting.topmenu': 'Layout do Menu Superior',
'app.setting.fixedheader': 'Cabeçalho fixo',
'app.setting.fixedsidebar': 'Barra lateral fixa',
'app.setting.fixedsidebar.hint': 'Funciona no layout do menu lateral',
'app.setting.hideheader': 'Esconder o cabeçalho quando rolar',
'app.setting.hideheader.hint': 'Funciona quando o esconder cabeçalho está abilitado',
'app.setting.othersettings': 'Outras configurações',
'app.setting.weakmode': 'Weak Mode',
'app.setting.copy': 'Copiar Configuração',
'app.setting.copyinfo':
'copiado com sucesso,por favor trocar o defaultSettings em src/models/setting.js',
'app.setting.production.hint':
'O painel de configuração apenas é exibido no ambiente de desenvolvimento, por favor modifique manualmente o',
};
import globalHeader from './zh-CN/globalHeader'; import globalHeader from './zh-CN/globalHeader';
import menu from './zh-CN/menu'; import menu from './zh-CN/menu';
import settingDrawer from './zh-CN/settingDrawer';
import settings from './zh-CN/settings'; import settings from './zh-CN/settings';
import pwa from './zh-CN/pwa';
export default { export default {
'navBar.lang': '语言', 'navBar.lang': '语言',
...@@ -12,7 +10,5 @@ export default { ...@@ -12,7 +10,5 @@ export default {
'app.home.introduce': '介绍', 'app.home.introduce': '介绍',
...globalHeader, ...globalHeader,
...menu, ...menu,
...settingDrawer,
...settings, ...settings,
...pwa,
}; };
export default {
'app.pwa.offline': '当前处于离线状态',
'app.pwa.serviceworker.updated': '有新内容',
'app.pwa.serviceworker.updated.hint': '请点击“刷新”按钮或者手动刷新页面',
'app.pwa.serviceworker.updated.ok': '刷新',
};
export default {
'app.setting.pagestyle': '整体风格设置',
'app.setting.pagestyle.dark': '暗色菜单风格',
'app.setting.pagestyle.light': '亮色菜单风格',
'app.setting.content-width': '内容区域宽度',
'app.setting.content-width.fixed': '定宽',
'app.setting.content-width.fluid': '流式',
'app.setting.themecolor': '主题色',
'app.setting.themecolor.dust': '薄暮',
'app.setting.themecolor.volcano': '火山',
'app.setting.themecolor.sunset': '日暮',
'app.setting.themecolor.cyan': '明青',
'app.setting.themecolor.green': '极光绿',
'app.setting.themecolor.daybreak': '拂晓蓝(默认)',
'app.setting.themecolor.geekblue': '极客蓝',
'app.setting.themecolor.purple': '酱紫',
'app.setting.navigationmode': '导航模式',
'app.setting.sidemenu': '侧边菜单布局',
'app.setting.topmenu': '顶部菜单布局',
'app.setting.fixedheader': '固定 Header',
'app.setting.fixedsidebar': '固定侧边菜单',
'app.setting.fixedsidebar.hint': '侧边菜单布局时可配置',
'app.setting.hideheader': '下滑时隐藏 Header',
'app.setting.hideheader.hint': '固定 Header 时可配置',
'app.setting.othersettings': '其他设置',
'app.setting.weakmode': '色弱模式',
'app.setting.copy': '拷贝设置',
'app.setting.copyinfo': '拷贝成功,请到 src/defaultSettings.js 中替换默认配置',
'app.setting.production.hint':
'配置栏只在开发环境用于预览,生产环境不会展现,请拷贝后手动修改配置文件',
};
import globalHeader from './zh-TW/globalHeader'; import globalHeader from './zh-TW/globalHeader';
import menu from './zh-TW/menu'; import menu from './zh-TW/menu';
import settingDrawer from './zh-TW/settingDrawer';
import settings from './zh-TW/settings'; import settings from './zh-TW/settings';
import pwa from './zh-TW/pwa';
export default { export default {
'navBar.lang': '語言', 'navBar.lang': '語言',
...@@ -15,7 +13,5 @@ export default { ...@@ -15,7 +13,5 @@ export default {
'表單頁用於向用戶收集或驗證信息,基礎表單常見於數據項較少的表單場景。', '表單頁用於向用戶收集或驗證信息,基礎表單常見於數據項較少的表單場景。',
...globalHeader, ...globalHeader,
...menu, ...menu,
...settingDrawer,
...settings, ...settings,
...pwa,
}; };
export default {
'app.pwa.offline': '當前處於離線狀態',
'app.pwa.serviceworker.updated': '有新內容',
'app.pwa.serviceworker.updated.hint': '請點擊“刷新”按鈕或者手動刷新頁面',
'app.pwa.serviceworker.updated.ok': '刷新',
};
export default {
'app.setting.pagestyle': '整體風格設置',
'app.setting.pagestyle.dark': '暗色菜單風格',
'app.setting.pagestyle.light': '亮色菜單風格',
'app.setting.content-width': '內容區域寬度',
'app.setting.content-width.fixed': '定寬',
'app.setting.content-width.fluid': '流式',
'app.setting.themecolor': '主題色',
'app.setting.themecolor.dust': '薄暮',
'app.setting.themecolor.volcano': '火山',
'app.setting.themecolor.sunset': '日暮',
'app.setting.themecolor.cyan': '明青',
'app.setting.themecolor.green': '極光綠',
'app.setting.themecolor.daybreak': '拂曉藍(默認)',
'app.setting.themecolor.geekblue': '極客藍',
'app.setting.themecolor.purple': '醬紫',
'app.setting.navigationmode': '導航模式',
'app.setting.sidemenu': '側邊菜單布局',
'app.setting.topmenu': '頂部菜單布局',
'app.setting.fixedheader': '固定 Header',
'app.setting.fixedsidebar': '固定側邊菜單',
'app.setting.fixedsidebar.hint': '側邊菜單布局時可配置',
'app.setting.hideheader': '下滑時隱藏 Header',
'app.setting.hideheader.hint': '固定 Header 時可配置',
'app.setting.othersettings': '其他設置',
'app.setting.weakmode': '色弱模式',
'app.setting.copy': '拷貝設置',
'app.setting.copyinfo': '拷貝成功,請到 src/defaultSettings.js 中替換默認配置',
'app.setting.production.hint':
'配置欄只在開發環境用於預覽,生產環境不會展現,請拷貝後手動修改配置文件',
};
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment