From 645d6ed4fd27c6fab55cbf64d2fb2995018bddcb Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=99=88=E5=B8=85?= Date: Wed, 22 Dec 2021 16:21:23 +0800 Subject: [PATCH] =?UTF-8?q?=F0=9F=8C=B7=20UI:=20alway=20set=20theme=20(#94?= =?UTF-8?q?58)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * 🌷 UI: alway set theme * 🌷 UI: support dynamic theme * merge master --- .github/workflows/deploy.yml | 2 +- config/config.ts | 3 +-- package.json | 8 +++---- src/app.tsx | 28 +++++++++++++++++++---- src/components/HeaderDropdown/index.less | 2 +- src/components/HeaderSearch/index.less | 2 +- src/components/NoticeIcon/NoticeList.less | 2 +- src/components/NoticeIcon/index.less | 2 +- src/components/RightContent/index.less | 2 +- src/global.less | 2 +- src/pages/Welcome.less | 2 +- src/pages/Welcome.tsx | 1 + src/pages/user/Login/index.less | 2 +- 13 files changed, 38 insertions(+), 20 deletions(-) diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml index 12397635..b82bed81 100644 --- a/.github/workflows/deploy.yml +++ b/.github/workflows/deploy.yml @@ -15,7 +15,7 @@ jobs: run: yarn - name: plugins - run: yarn add umi-plugin-antd-theme umi-plugin-pro umi-plugin-setting-drawer + run: yarn add umi-plugin-pro - name: fetch-blocks run: yarn run pro fetch-blocks diff --git a/config/config.ts b/config/config.ts index 33bdfd4b..34d14151 100644 --- a/config/config.ts +++ b/config/config.ts @@ -38,8 +38,7 @@ export default defineConfig({ routes, // Theme for antd: https://ant.design/docs/react/customize-theme-cn theme: { - 'primary-color': defaultSettings.primaryColor, - 'root-entry-name': 'default', + 'root-entry-name': 'variable', }, // esbuild is father build tools // https://umijs.org/plugins/plugin-esbuild diff --git a/package.json b/package.json index 9e541ee2..b88c7015 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "ant-design-pro", - "version": "5.1.0", + "version": "5.2.0", "private": true, "description": "An out-of-box UI solution for enterprise applications", "scripts": { @@ -57,10 +57,10 @@ "@ant-design/icons": "^4.5.0", "@ant-design/pro-descriptions": "^1.9.0", "@ant-design/pro-form": "^1.43.0", - "@ant-design/pro-layout": "^6.26.0", + "@ant-design/pro-layout": "^6.32.0-beta.4", "@ant-design/pro-table": "^2.56.0", - "@umijs/route-utils": "^2.0.3", - "antd": "4.16.13", + "@umijs/route-utils": "^2.0.4", + "antd": "^4.17.0", "classnames": "^2.2.6", "lodash": "^4.17.11", "moment": "^2.25.3", diff --git a/src/app.tsx b/src/app.tsx index 27d41419..71db29c4 100644 --- a/src/app.tsx +++ b/src/app.tsx @@ -1,4 +1,5 @@ import type { Settings as LayoutSettings } from '@ant-design/pro-layout'; +import { SettingDrawer } from '@ant-design/pro-layout'; import { PageLoading } from '@ant-design/pro-layout'; import type { RunTimeLayoutConfig } from 'umi'; import { history, Link } from 'umi'; @@ -21,6 +22,7 @@ export const initialStateConfig = { export async function getInitialState(): Promise<{ settings?: Partial; currentUser?: API.CurrentUser; + loading?: boolean; fetchUserInfo?: () => Promise; }> { const fetchUserInfo = async () => { @@ -48,7 +50,7 @@ export async function getInitialState(): Promise<{ } // ProLayout 支持的api https://procomponents.ant.design/components/layout -export const layout: RunTimeLayoutConfig = ({ initialState }) => { +export const layout: RunTimeLayoutConfig = ({ initialState, setInitialState }) => { return { rightContentRender: () => , disableContentMargin: false, @@ -79,10 +81,26 @@ export const layout: RunTimeLayoutConfig = ({ initialState }) => { // 自定义 403 页面 // unAccessible:
unAccessible
, // 增加一个 loading 的状态 - // childrenRender: (children) => { - // if (initialState.loading) return ; - // return children; - // }, + childrenRender: (children, props) => { + // if (initialState?.loading) return ; + return ( + <> + {children} + {!props.location?.pathname?.includes('/login') && ( + { + setInitialState((preInitialState) => ({ + ...preInitialState, + settings, + })); + }} + /> + )} + + ); + }, ...initialState?.settings, }; }; diff --git a/src/components/HeaderDropdown/index.less b/src/components/HeaderDropdown/index.less index 004b53eb..f583513f 100644 --- a/src/components/HeaderDropdown/index.less +++ b/src/components/HeaderDropdown/index.less @@ -1,4 +1,4 @@ -@import '~antd/es/style/themes/default.less'; +@import (reference) '~antd/es/style/themes/index'; .container > * { background-color: @popover-bg; diff --git a/src/components/HeaderSearch/index.less b/src/components/HeaderSearch/index.less index 15060bdc..7dc3eaa0 100644 --- a/src/components/HeaderSearch/index.less +++ b/src/components/HeaderSearch/index.less @@ -1,4 +1,4 @@ -@import '~antd/es/style/themes/default.less'; +@import (reference) '~antd/es/style/themes/index'; .headerSearch { display: inline-flex; diff --git a/src/components/NoticeIcon/NoticeList.less b/src/components/NoticeIcon/NoticeList.less index 65e0c407..c87fece4 100755 --- a/src/components/NoticeIcon/NoticeList.less +++ b/src/components/NoticeIcon/NoticeList.less @@ -1,4 +1,4 @@ -@import '~antd/es/style/themes/default.less'; +@import (reference) '~antd/es/style/themes/index'; .list { max-height: 400px; diff --git a/src/components/NoticeIcon/index.less b/src/components/NoticeIcon/index.less index 45251cdd..253ccda5 100644 --- a/src/components/NoticeIcon/index.less +++ b/src/components/NoticeIcon/index.less @@ -1,4 +1,4 @@ -@import '~antd/es/style/themes/default.less'; +@import (reference) '~antd/es/style/themes/index'; .popover { position: relative; diff --git a/src/components/RightContent/index.less b/src/components/RightContent/index.less index 486e80c9..6d6f1986 100644 --- a/src/components/RightContent/index.less +++ b/src/components/RightContent/index.less @@ -1,4 +1,4 @@ -@import '~antd/es/style/themes/default.less'; +@import (reference) '~antd/es/style/themes/index'; @pro-header-hover-bg: rgba(0, 0, 0, 0.025); diff --git a/src/global.less b/src/global.less index 21a21f5e..0d6158c7 100644 --- a/src/global.less +++ b/src/global.less @@ -1,4 +1,4 @@ -@import '~antd/es/style/themes/default.less'; +@import '~antd/es/style/variable.less'; html, body, diff --git a/src/pages/Welcome.less b/src/pages/Welcome.less index 914c40d8..224a7932 100644 --- a/src/pages/Welcome.less +++ b/src/pages/Welcome.less @@ -1,4 +1,4 @@ -@import '~antd/lib/style/themes/default.less'; +@import (reference) '~antd/es/style/themes/index'; .pre { margin: 12px 0; diff --git a/src/pages/Welcome.tsx b/src/pages/Welcome.tsx index ed10f13d..9041b181 100644 --- a/src/pages/Welcome.tsx +++ b/src/pages/Welcome.tsx @@ -14,6 +14,7 @@ const CodePreview: React.FC = ({ children }) => ( const Welcome: React.FC = () => { const intl = useIntl(); + return ( diff --git a/src/pages/user/Login/index.less b/src/pages/user/Login/index.less index 84c5fddd..f6ecf00d 100644 --- a/src/pages/user/Login/index.less +++ b/src/pages/user/Login/index.less @@ -1,4 +1,4 @@ -@import '~antd/es/style/themes/default.less'; +@import (reference) '~antd/es/style/themes/index'; .container { display: flex;