bump version: 5.5.0

chore dep: use puppeteer-core because npm install easy to fail
chore dep: little mistake
2026-10-20 08:16:39 +00:00 · 2026-02-19 22:06:42 +08:00 · 2026-02-19 22:03:32 +08:00 · 2026-02-19 21:43:23 +08:00 · 2026-02-19 21:30:25 +08:00 · 2026-02-19 21:28:07 +08:00
142 changed files with 3183 additions and 2218 deletions
@@ -1,23 +1,18 @@
 language: node_js
 node_js:
- node
+  - node
 script:
- npm run build
+  - npm run build
 before_install:
- |
-    if [ "$TRAVIS_BRANCH" = "develop" ]; then
-      for prefixed_envvar in ${!DEV_*}; do
-        eval export ${prefixed_envvar#DEV_}="${!prefixed_envvar}"
-      done
-    elif [ "$TRAVIS_BRANCH" = "master" ]; then
-      for prefixed_envvar in ${!PROD_*}; do
-        eval export ${prefixed_envvar#PROD_}="${!prefixed_envvar}"
-      done
-    fi
- openssl aes-256-cbc -K $encrypted_18b2305b78c9_key -iv $encrypted_18b2305b78c9_iv -in config/id_rsa.enc -out ~/.ssh/id_rsa -d
- chmod 600 ~/.ssh/id_rsa
- echo -e "Host $HOST\n\tStrictHostKeyChecking no\n" >> ~/.ssh/config
- yarn global add now
+  - yarn global add now
 after_script:
- scp -o stricthostkeychecking=no -r ./dist root@$HOST:$BUILD_DIR
- cd ./docs && now -A $DOC_NOW_CONFIG -t $NOW_TOKEN && now alias -A $DOC_NOW_CONFIG -t $NOW_TOKEN
+  - |
+    if [[ $TRAVIS_BRANCH == 'master' ]]; then
+      echo $PROD_SITE_NOW_CONFIG >> dist/vercel.json && echo $PROD_DOC_NOW_CONFIG >> docs/vercel.json;
+    else
+      echo $DEV_SITE_NOW_CONFIG >> dist/vercel.json && echo $DEV_DOC_NOW_CONFIG >> docs/vercel.json;
+    fi
+  - cd ./dist
+  - now -A vercel.json -t $NOW_TOKEN --prod -c
+  - cd ../docs
+  - now -A vercel.json -t $NOW_TOKEN --prod -c
@@ -1,88 +1,35 @@
 // https://umijs.org/config/
 import { resolve } from 'path'
-import { i18n } from './src/utils/config'
+const fs = require('fs')
+const path = require('path')
+const lessToJs = require('less-vars-to-js')
+const isDevelopment = process.env.NODE_ENV === 'development'

+const { theme } = require('antd')
+
+const mapToken = theme.defaultAlgorithm(theme.defaultSeed)
+const v4Token = Object.fromEntries(
+  Object.entries(mapToken).map(([k, v]) => [k, typeof v === 'string' ? v : String(v)])
+)
+
+// how to speed compile: https://umijs.org/guide/boost-compile-speed
 export default {
-  ignoreMomentLocale: true,
-  targets: { ie: 9 },
-  plugins: [
-    [
-      // https://umijs.org/plugin/umi-plugin-react.html
-      'umi-plugin-react',
-      {
-        dva: { immer: true },
-        antd: true,
-        dynamicImport: {
-          webpackChunkName: true,
-          loadingComponent: './components/Loader/Loader',
-        },
-        routes: {
-          exclude: [
-            /model\.(j|t)sx?$/,
-            /service\.(j|t)sx?$/,
-            /models\//,
-            /components\//,
-            /services\//,
-            /chart\/Container\.js$/,
-            /chart\/ECharts\/.+Component\.js$/,
-            /chart\/ECharts\/.+ComPonent\.js$/,
-            /chart\/ECharts\/theme\/.+\.js$/,
-            /chart\/highCharts\/.+Component\.js$/,
-            /chart\/highCharts\/mapdata\/.+\.js$/,
-            /chart\/Recharts\/.+Component\.js$/,
-            /chart\/Recharts\/Container\.js$/,
-          ],
-          update: routes => {
-            if (!i18n) return routes
-
-            const newRoutes = []
-            for (const item of routes[0].routes) {
-              newRoutes.push(item)
-              if (item.path) {
-                newRoutes.push(
-                  Object.assign({}, item, {
-                    path:
-                      `/:lang(${i18n.languages
-                        .map(item => item.key)
-                        .join('|')})` + item.path,
-                  })
-                )
-              }
-            }
-            routes[0].routes = newRoutes
-
-            return routes
-          },
-        },
-        dll: {
-          include: ['dva', 'dva/router', 'dva/saga', 'dva/fetch', 'antd/es'],
-        },
-        hardSource: /* isMac */ process.platform === 'darwin',
-      },
-    ],
-  ],
-  // Theme for antd
-  // https://ant.design/docs/react/customize-theme
-  theme: './config/theme.config.js',
-  // Webpack Configuration
-  proxy: {
-    '/api/v1/weather': {
-      target: 'https://api.seniverse.com/',
-      changeOrigin: true,
-      pathRewrite: { '^/api/v1/weather': '/v3/weather' },
-    },
-  },
+  // IMPORTANT! change next line to yours or delete. And hide in dev
+  publicPath: isDevelopment ? '/' : 'https://cdn.antd-admin.zuiidea.com/',
  alias: {
    api: resolve(__dirname, './src/services/'),
    components: resolve(__dirname, './src/components'),
    config: resolve(__dirname, './src/utils/config'),
-    models: resolve(__dirname, './src/models'),
-    routes: resolve(__dirname, './src/routes'),
-    services: resolve(__dirname, './src/services'),
    themes: resolve(__dirname, './src/themes'),
    utils: resolve(__dirname, './src/utils'),
  },
-  extraBabelPresets: ['@lingui/babel-preset-react'],
+  antd: false,
+  // a lower cost way to genereate sourcemap, default is cheap-module-source-map, could save 60% time in dev hotload
+  devtool: 'eval',
+  dva: { immer: true },
+  dynamicImport: {
+    loading: 'components/Loader/Loader',
+  },
  extraBabelPlugins: [
    [
      'import',
@@ -93,5 +40,106 @@ export default {
      },
      'lodash',
    ],
+    [
+      'import',
+      {
+        libraryName: '@ant-design/icons',
+        libraryDirectory: 'es/icons',
+        camel2DashComponentName: false,
+      },
+      'ant-design-icons',
+    ],
+    [
+      'macros'
+    ]
  ],
+  hash: true,
+  ignoreMomentLocale: true,
+  // umi3 comple node_modules by default, could be disable
+  nodeModulesTransform: {
+    type: 'none',
+    exclude: [],
+  },
+  // Webpack Configuration
+  proxy: {
+    '/api/v1/weather': {
+      target: 'https://api.seniverse.com/',
+      changeOrigin: true,
+      pathRewrite: { '^/api/v1/weather': '/v3/weather' },
+    },
+  },
+  // Theme for antd
+  // https://ant.design/docs/react/customize-theme
+  theme: {
+    ...v4Token,
+    ...lessToJs(
+    fs.readFileSync(path.join(__dirname, './src/themes/default.less'), 'utf8')
+    )
+  },
+  webpack5: {},
+  mfsu: {},
+  chainWebpack: function (config, { webpack }) {
+    !isDevelopment && config.merge({
+      optimization: {
+        minimize: false,
+        splitChunks: {
+          chunks: 'all',
+          minSize: 30000,
+          minChunks: 3,
+          automaticNameDelimiter: '.',
+          cacheGroups: {
+            react: {
+              name: 'react',
+              priority: 20,
+              test: /[\\/]node_modules[\\/](react|react-dom|react-router-dom)[\\/]/,
+            },
+            antd: {
+              name: 'antd',
+              priority: 20,
+              test: /[\\/]node_modules[\\/](antd|@ant-design\/icons)[\\/]/,
+            },
+            'echarts-gl': {
+              name: 'echarts-gl',
+              priority: 30,
+              test: /[\\/]node_modules[\\/]echarts-gl[\\/]/,
+            },
+            zrender: {
+              name: 'zrender',
+              priority: 30,
+              test: /[\\/]node_modules[\\/]zrender[\\/]/,
+            },
+            echarts: {
+              name: 'echarts',
+              priority: 20,
+              test: /[\\/]node_modules[\\/](echarts|echarts-for-react|echarts-liquidfill)[\\/]/,
+            },
+            highcharts: {
+              name: 'highcharts',
+              priority: 20,
+              test: /[\\/]node_modules[\\/]highcharts[\\/]/,
+            },
+            recharts: {
+              name: 'recharts',
+              priority: 20,
+              test: /[\\/]node_modules[\\/]recharts[\\/]/,
+            },
+            draftjs: {
+              name: 'draftjs',
+              priority: 30,
+              test: /[\\/]node_modules[\\/](draft-js|react-draft-wysiwyg|draftjs-to-html|draftjs-to-markdown)[\\/]/,
+            },
+            async: {
+              chunks: 'async',
+              minChunks: 2,
+              name: 'async',
+              maxInitialRequests: 1,
+              minSize: 0,
+              priority: 5,
+              reuseExistingChunk: true,
+            },
+          },
+        },
+      },
+    })
+  },
 }
@@ -38,7 +38,7 @@

 ## 使用

-1. 下载项目代码。
+1. 下载项目代码。

 ```bash
 git clone https://github.com/zuiidea/antd-admin.git my-project
@@ -65,17 +65,18 @@ npm run start

 4. 启动完成后打开浏览器访问 [http://localhost:7000](http://localhost:7000)，如果需要更改启动端口，可在 `.env` 文件中配置。

+5. 登录账号有2个，一个账号admin 密码admin;另一个账号guest 密码guest

 > 更多信息请参考 [使用文档](https://doc.antd-admin.zuiidea.com/#/zh-cn/)。


 ## 支持环境

-现代浏览器及 IE9。
+现代浏览器。

 | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="IE / Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>IE / Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Safari | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/opera/opera_48x48.png" alt="Opera" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Opera |
 | --------- | --------- | --------- | --------- | --------- | 
-| IE9, IE10, IE11, Edge| last 2 versions| last 2 versions| last 2 versions| last 2 versions
+|IE11, Edge| last 2 versions| last 2 versions| last 2 versions| last 2 versions

 ## 参与贡献  

@@ -84,4 +85,4 @@ npm run start
 - 通过 [Issue](http://github.com/zuiidea/antd-admin/issues) 报告 bug 或进行咨询。
 - 提交 [Pull Request](http://github.com/zuiidea/antd-admin/pulls) 改进代码。

-> 强烈推荐阅读 [《提问的智慧》](https://github.com/ryanhanwu/How-To-Ask-Questions-The-Smart-Way)、[《如何向开源社区提问题》](https://github.com/seajs/seajs/issues/545) 和 [《如何有效地报告 Bug》](http://www.chiark.greenend.org.uk/%7Esgtatham/bugs-cn.html)、[《如何向开源项目提交无法解答的问题》](https://zhuanlan.zhihu.com/p/25795393)，更好的问题更容易获得帮助。
+> 强烈推荐阅读 [《提问的智慧》](https://github.com/ryanhanwu/How-To-Ask-Questions-The-Smart-Way)、[《如何向开源社区提问题》](https://github.com/seajs/seajs/issues/545) 和 [《如何有效地报告 Bug》](http://www.chiark.greenend.org.uk/%7Esgtatham/bugs-cn.html)、[《如何向开源项目提交无法解答的问题》](https://zhuanlan.zhihu.com/p/25795393)，更好的问题更容易获得帮助。
@@ -9,9 +9,9 @@

 <div align="center">

-A excellent front-end solution for enterprise applications.
+An excellent front-end solution for enterprise applications.

-[![antd](https://img.shields.io/badge/antd-^3.10.0-blue.svg?style=flat-square)](https://github.com/ant-design/ant-design)
+[![antd](https://img.shields.io/badge/antd-^4.0.0-blue.svg?style=flat-square)](https://github.com/ant-design/ant-design)
 [![umi](https://img.shields.io/badge/umi-^2.2.1-orange.svg?style=flat-square)](https://github.com/umijs/umi)
 [![GitHub issues](https://img.shields.io/github/issues/zuiidea/antd-admin.svg?style=flat-square)](https://github.com/zuiidea/antd-admin/issues)
 [![MIT](https://img.shields.io/dub/l/vibe-d.svg?style=flat-square)](http://opensource.org/licenses/MIT)
@@ -22,7 +22,7 @@ A excellent front-end solution for enterprise applications.
 </div>

 - Preview - [https://antd-admin.zuiidea.com](https://antd-admin.zuiidea.com)
- Documentation - [https://doc.antd-admin.zuiidea.com](https://doc.antd-admin.zuiidea.com)
+- Documentation - [https://superlbr.gitee.io/antd-admin](https://superlbr.gitee.io/antd-admin)
 - FAQ - [https://doc.antd-admin.zuiidea.com/#/faq](https://doc.antd-admin.zuiidea.com/#/faq)
 - ChangeLog - [https://doc.antd-admin.zuiidea.com/#/change-log](https://doc.antd-admin.zuiidea.com/#/change-log)

@@ -65,17 +65,18 @@ npm run start

 4. After the startup is complete, open a browser and visit [http://localhost:7000](http://localhost:7000), If you need to change the startup port, you can configure it in the `.env` file.

+5. For login page, there're two account. Username: admin Password: admin / Username: guest Password: guest

 > More instructions at [documentation](https://doc.antd-admin.zuiidea.com)。


 ## Browsers support

-Modern browsers and IE9.
+Modern browsers.

 | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="IE / Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>IE / Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Safari | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/opera/opera_48x48.png" alt="Opera" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Opera |
 | --------- | --------- | --------- | --------- | --------- | 
-| IE9, IE10, IE11, Edge| last 2 versions| last 2 versions| last 2 versions| last 2 versions
+|IE11, Edge| last 2 versions| last 2 versions| last 2 versions| last 2 versions

 ## Contributing

@@ -1,8 +0,0 @@
-const fs = require('fs')
-const path = require('path')
-const lessToJs = require('less-vars-to-js')
-
-module.exports = () => {
-  const themePath = path.join(__dirname, '../src/themes/default.less')
-  return lessToJs(fs.readFileSync(themePath, 'utf8'))
-}
@@ -0,0 +1,86 @@
+# API configuration
+
+## Why
+
+In the use of `redux` or `dva` projects, we often write functions like the following `service` layer to make the code structure clearer, but it is easy to see that we will write a lot of similar code in `antd -admin@5.0`, using the more concise configuration method to achieve the same function.
+
+```javascript
+export async function login(data) {
+  return request({
+    url: '/api/v1/user/login',
+    method: 'post',
+    data,
+  })
+}
+```
+
+## Configuration and use
+
+In the `src/services/api.js` file, you will see the following configuration object, the object's key is used to call the function name, the object's value is the requested `url`, the default request method is `GET`, The format of the value of the other request mode object is `'method url'`.
+
+```javascript
+export default {
+  ...
+  queryUser: '/user/:id',
+  queryUserList: '/users',
+  updateUser: 'Patch /user/:id',
+  createUser: 'POST /user/:id',
+  removeUser: 'DELETE /user/:id',
+  removeUserList: 'POST /users/delete',
+  ...
+}
+```
+
+Used in other files
+
+```javascript
+import { queryUser } from 'api'
+
+// in the general file
+...
+queryUser(option).then(data => console.log(data))
+...
+
+/ / Model file
+...
+yield call(queryUser, option)
+...
+```
+
+## Method to realize
+
+Refer to the `src/services/index.js` file to traverse the api configuration. Each property returns the corresponding encapsulated request function.
+
+```javascript
+import request from 'utils/request'
+import { apiPrefix } from 'utils/config'
+
+import api from './api'
+
+const gen = params => {
+  let url = apiPrefix + params
+  let method = 'GET'
+
+  const paramsArray = params.split(' ')
+  if (paramsArray.length === 2) {
+    method = paramsArray[0]
+    url = apiPrefix + paramsArray[1]
+  }
+
+  return function(data) {
+    return request({
+      url,
+      data,
+      method,
+    })
+  }
+}
+
+const APIFunction = {}
+for (const key in api) {
+  APIFunction[key] = gen(api[key])
+}
+
+module.exports = APIFunction
+
+```
@@ -8,7 +8,7 @@

 <div align="center">

-A excellent front-end solution for enterprise applications.
+An excellent front-end solution for enterprise applications.

 [![antd](https://img.shields.io/badge/antd-^3.10.0-blue.svg?style=flat-square)](https://github.com/ant-design/ant-design)
 [![umi](https://img.shields.io/badge/umi-^2.2.1-orange.svg?style=flat-square)](https://github.com/umijs/umi)
@@ -68,11 +68,11 @@ npm run start

 ## Browsers support

-Modern browsers and IE9.
+Modern browsers.

 | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="IE / Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>IE / Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Safari | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/opera/opera_48x48.png" alt="Opera" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Opera |
 | --------- | --------- | --------- | --------- | --------- | 
-| IE9, IE10, IE11, Edge| last 2 versions| last 2 versions| last 2 versions| last 2 versions
+|IE11, Edge| last 2 versions| last 2 versions| last 2 versions| last 2 versions

 ## Contributing

@@ -2,6 +2,11 @@
  - [Quick Start](getting-started.md)
 - Customization
  - [Configuration](configuration.md)
+  - [API Configuration](API-configuration.md)
+  - [I18n](i18n.md)
+  - [Layout](layout.md)
+  - [Request](request.md)
 - Guide
  - [Deploy](deploy.md)
 - [Change Log](change-log.md)
+- [FAQ](faq.md)
@@ -28,7 +28,7 @@

 - Support internationalization, extract source fields from source code, load language packs on demand, and automatically translate online.

- Support for the introduction of `ant-design-pro` components, `lodash` functions on demand.
+- Support for the introduction `lodash` functions on demand.
   
 - Support multiple layouts, which rules can be used according to the rules.

@@ -12,7 +12,7 @@ You can do some custom configuration in `/src/utils/config.js`:

 - Type： `String`

-  Configure the copyright notice to apply to the login page, at the bottom of the `Primay` layout.
+  Configure the copyright notice to apply to the login page, at the bottom of the `Primary` layout.

 ## logoPath

@@ -24,7 +24,7 @@ You can do some custom configuration in `/src/utils/config.js`:

 - Type： `String`

-  Configure the prefix of the interface in the project. The interface related documents can be viewed [API configuration]()
+  Configure the prefix of the interface in the project. The interface related documents can be viewed [API configuration](API-configuration.md)

 ## fixedHeader

@@ -39,25 +39,25 @@ You can do some custom configuration in `/src/utils/config.js`:
  Configuration? Which routes use which layout, unspecified route uses the default layout `Public`, the project currently has `Primary` and `Public` layouts,
      The default configuration is as follows：
  
-    ```js
+    ```javascript
        layouts: [
            {
                name: 'primary',
                include: [/.*/],
-                exlude: [/(\/(en|zh))*\/login/],
+                exclude: [/(\/(en|zh))*\/login/],
            },
        ],
    ```

    The object properties for each layout are as follows:

-    - `name` - The name of the layout;
+    - `name` - The name of the layout;
  
    - `include` - Specifies a list of routing rules that use this layout, which can be a regular expression or a string;
  
-    - `exlude` - Specifies a list of routing rules that do not use this layout, which can be a regular expression or a string.
+    - `exclude` - Specifies a list of routing rules that do not use this layout, which can be a regular expression or a string.
  
- > Note: `exlude` takes precedence over `include`, and the layout behind it has a higher priority than the previous layout. The development process may need to be combined with the layout in the `src/layouts` directory. For details, see [Using Layout]().
+ > Note: `exclude` takes precedence over `include`, and the layout previous it has a higher priority than the behind layout. The development process may need to be combined with the layout in the `src/layouts` directory. For details, see [Using Layout](./layout.md).

 ## i18n

@@ -65,7 +65,7 @@ You can do some custom configuration in `/src/utils/config.js`:

  Configure internationalization, the default configuration is as follows:

-  ```js
+  ```javascript
  i18n: {
      languages: [
        {
@@ -91,9 +91,9 @@ You can do some custom configuration in `/src/utils/config.js`:

    - `key` - The `key` of the language is applied to the page url to distinguish the language, and also corresponds to the language package folder name in the `src/locales` directory;

-    - `title` - The name of the language, at the bottom of the login page, at the top of the `Primay` layout, the language switch is displayed;
+    - `title` - The name of the language, at the bottom of the login page, at the top of the `Primary` layout, the language switch is displayed;

-    - `flag` - The path of the flag icon of the language, the language switching display at the top of the `Primay` layout.
+    - `flag` - The path of the flag icon of the language, the language switching display at the top of the `Primary` layout.

 ### i18n.defaultLanguage
   
@@ -2,6 +2,8 @@

 After the development is completed and verified in the development environment, it needs to be deployed to our users.

+![i18n](./_media/term_build.svg)
+
 ## Build

 First execute the following command,
@@ -0,0 +1,9 @@
+# FAQ
+
+Most asked
+
+## create new page
+
+    1. just copy a page in /src/pages (route here auto generated by [umi](https://umijs.org/guide/router.html#basic-routing))
+    2. modify namespace/pathToRegexp in model.js
+    3. modify mock route.js to add a route
@@ -0,0 +1,75 @@
+# globalization
+
+## Add language
+
+Take Japanese as an example.
+
+![i18n](../_media/term_i18n.svg)
+
+1. Add a language pack local file, `ja` is the Japanese language code, and a list of languages that support translation [有道智云](http://ai.youdao.com/docs/doc-trans-api.s#p05), the `src/locales/ja/messages.json` file will be generated after running the following command.
+
+   ```bash 
+   npm run add-locale ja
+   ```
+
+2. Extract the fields in the code that need to be translated, ie `<Trans>?message</Trans>`, `` t`message `` in the `message` field, run the following command after `src/locales/ja /messages.json` will appear after the extracted field configuration.
+
+   ```bash 
+   npm run extract
+   ```
+
+   You will see the following information:
+
+   ```bash
+   Catalog statistics:
+   ┌─────────────┬─────────────┬─────────┐
+   │ Language    │ Total count │ Missing │
+   ├─────────────┼─────────────┼─────────┤
+   │ en (source) │     52      │    -    │
+   │ ja          │     52      │   52    │
+   │ zh          │     52      │    0    │
+   └─────────────┴─────────────┴─────────┘
+   ```
+
+3. At the same time, we have added the relevant configuration in `src/utils/config.js`.
+
+   ```javascript
+   {
+       ...
+       i18n: {
+           languages: [
+               ...
+               {
+                   key:'ja',
+                   title: '日本語',
+                   flag: '/japanese.svg',
+               },
+           ],
+       },
+   }
+   ```
+
+   > Routing related effects, after the configuration `npm run start` takes effect after restart.
+
+4. Use the built-in commands for automatic translation. You will see the translated configuration in `src/locales/ja/messages.json`.
+
+   ```bash
+   npm run trans:only
+   ```
+
+   You will see the following information:
+
+   ```bash
+   start: en -> ja
+   ...
+   youdao: en -> ja: Unpublished -> 未発表
+   youdao: en -> ja: Update -> 更新
+   youdao: en -> ja: Update User -> ユーザーの更新
+   youdao: en -> ja: Username -> 名
+   ...
+   All translations have been completed.
+   ```
+
+   > `npm run trans` will execute `npm run extract` and `npm run trans:only` in order.
+
+5. Finally, you can adjust the inaccurate fields in `src/locales/ja/messages.json`. Start the development mode `npm run start`, open [http://localhost:7000/ja/login](http://localhost:7000/ja/login) and you will see the Japanese version of the app.
@@ -0,0 +1,60 @@
+# Layout
+
+## Add a new layout
+
+Take a new layout named `secondary` as an example to make the route starting with `secondary` use this layout.
+
+1. Add related configuration in `src/utils/config.js`. For details, please refer to [layouts](/configuration?id=layouts).
+
+```javascript
+   layouts: [
+           {
+               name: 'primary',
+               include: [/.*/],
+               exclude: [/(\/(en|zh))*\/login/, /(\/(en|zh))*\/secondary\/(.*)/],
+           },
+           {
+               name: 'secondary',
+               include: [/(\/(en|zh))*\/secondary\/(.*)/],
+           },
+   ],
+```
+
+2. Add the `secondary` layout component to the `src/layouts/BaseLayout.js` file.
+
+```javascript
+   import SecondaryLayout from './SecondaryLayout'
+
+   const LayoutMap = {
+     primary: PrimaryLayout,
+     public: PublicLayout,
+     secondary: SecondaryLayout,
+   }
+```
+
+3. Add the `SecondaryLayout.js` file to the `src/layouts/` directory.
+
+```javascript
+   import React from 'react'
+
+   export default ({ children }) => {
+     return (
+       <div>
+         <h1>Secondary</h1>
+         {children}
+       </div>
+     )
+   }
+```
+
+4. Add a `secondary/index.js` file to the `src/pages/` directory.
+
+```javascript
+   import React from 'react'
+
+   export default ({ children }) => {
+     Return <div>Secondary page Content</div>
+   }
+```
+
+5. Finally, start the development mode `npm run start`, open [http://localhost:7000/secondary/](http://localhost:7000/secondary/) and you will see the page for the `secondary` layout.
@@ -1,6 +0,0 @@
-{
-  "name": "antd-admin-devdoc",
-  "alias": ["devdoc-antd-admin.now.sh", "devdoc.antd-admin.zuiidea.com"],
-  "type": "static",
-  "public": true
-}
@@ -1,6 +0,0 @@
-{
-  "name": "antd-admin-doc",
-  "alias": ["doc-antd-admin.now.sh", "doc.antd-admin.zuiidea.com"],
-  "type": "static",
-  "public": true
-}
@@ -0,0 +1,22 @@
+# HTTP request
+
+this project use axios for http service, file located in src/utils/request.js
+
+## Custom Header
+
+As for privilege access or modify cookie, you could add header param by yourself
+
+```
+axios.defaults.headers.common['Authorization'] = 'token'
+```
+
+Or
+
+```
+axios.interceptors.request.use(function (config) {
+  config.headers.token = window.localStorage.getItem('token');
+  return config;
+}, function (error) {
+  return Promise.reject(error);
+});
+```
@@ -0,0 +1,86 @@
+# 接口配置
+
+## 为什么
+
+在使用了`redux`或者`dva`项目中，我们经常会写类似下面的`service`层的函数，使代码结构更清晰，但是很容易看出，我们会写很多相似的代码，在`antd-admin@5.0`中，使用了更加简洁的配置方式实现了相同的功能。
+
+```javascript
+export async function login(data) {
+  return request({
+    url: '/api/v1/user/login',
+    method: 'post',
+    data,
+  })
+}
+```
+
+## 配置和使用
+
+在`src/services/api.js`文件中，你会看到如下配置对象，对象的键用于调用时的函数名称，对象的值为请求的`url`，默认请求方式为`GET`，如果是其他请求方式对象的值的格式则为`'method url'`。
+
+```javascript
+export default {
+  ...
+  queryUser: '/user/:id',
+  queryUserList: '/users',
+  updateUser: 'Patch /user/:id',
+  createUser: 'POST /user/:id',
+  removeUser: 'DELETE /user/:id',
+  removeUserList: 'POST /users/delete',
+  ...
+}
+```
+
+在其他文件中使用
+
+```javascript
+import { queryUser } from 'api'
+
+// 一般文件中
+...
+queryUser(option).then(data => console.log(data))
+...
+
+// model文件中
+...
+yield call(queryUser, option)
+...
+```
+
+## 实现方式
+
+参考`src/services/index.js`文件，对api配置进行遍历，每个属性都返回对应的封装后的request函数。
+
+```javascript
+import request from 'utils/request'
+import { apiPrefix } from 'utils/config'
+
+import api from './api'
+
+const gen = params => {
+  let url = apiPrefix + params
+  let method = 'GET'
+
+  const paramsArray = params.split(' ')
+  if (paramsArray.length === 2) {
+    method = paramsArray[0]
+    url = apiPrefix + paramsArray[1]
+  }
+
+  return function(data) {
+    return request({
+      url,
+      data,
+      method,
+    })
+  }
+}
+
+const APIFunction = {}
+for (const key in api) {
+  APIFunction[key] = gen(api[key])
+}
+
+module.exports = APIFunction
+
+```
@@ -68,11 +68,11 @@ npm run start

 ## 支持环境

-现代浏览器及 IE9。
+现代浏览器。

 | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="IE / Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>IE / Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Safari | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/opera/opera_48x48.png" alt="Opera" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Opera |
 | --------- | --------- | --------- | --------- | --------- | 
-| IE9, IE10, IE11, Edge| last 2 versions| last 2 versions| last 2 versions| last 2 versions
+|IE11, Edge| last 2 versions| last 2 versions| last 2 versions| last 2 versions

 ## 参与贡献  

@@ -2,6 +2,10 @@
  - [快速上手](zh-cn/getting-started.md)
 - 定制化
  - [配置项](zh-cn/configuration.md)
+  - [接口配置](zh-cn/API-configuration.md)
+  - [国际化](zh-cn/i18n.md)
+  - [布局](zh-cn/layout.md)
+  - [http 请求](zh-cn/request.md)
 - 指南
  - [部署](zh-cn/deploy.md)
 - [更新日志](zh-cn/change-log.md)
@@ -28,7 +28,7 @@

 - 支持国际化，源码中抽离翻译字段，按需加载语言包，自动在线翻译。

- 支持按需引入 `ant-design-pro` 组件、`lodash` 函数。
+- 支持按需引入 `lodash` 函数。
  
 - 支持多布局，可根据规则规定哪些路由使用哪种布局。

@@ -24,7 +24,7 @@

 - 类型： `String`

-  配置项目中接口的前缀，接口相关文档可查看 [接口配置化]()
+  配置项目中接口的前缀，接口相关文档可查看 [接口配置](API-configuration.md)

 ## fixedHeader

@@ -39,12 +39,12 @@
    配置哪些路由使用哪种布局，未指定路由使用默认布局 `Public`，项目中目前有 `Primary` 和 `Public` 两种布局，
    默认配置如下：
  
-    ```js
+    ```javascript
        layouts: [
            {
                name: 'primary',
                include: [/.*/],
-                exlude: [/(\/(en|zh))*\/login/],
+                exclude: [/(\/(en|zh))*\/login/],
            },
        ],
    ```
@@ -55,9 +55,9 @@
  
    - `include` - 指定使用该布局的路由规则列表，规则可为正则表达式或者字符串；
  
-    - `exlude` - 指定不使用该布局的路由规则列表，规则可为正则表达式或者字符串。
+    - `exclude` - 指定不使用该布局的路由规则列表，规则可为正则表达式或者字符串。
  
- > 注意：`exlude` 优先级高于 `include`，后面的布局优先级高于前面的布局。开发过程中可能需要结合`src/layouts`目录下的布局使用，具体方法可查看 [使用布局]()。
+ > 注意：`exclude` 优先级高于 `include`，前面的布局优先级高于后面的布局。开发过程中可能需要结合`src/layouts`目录下的布局使用，具体方法可查看 [使用布局](./layout.md)。

 ## i18n

@@ -65,7 +65,7 @@

  配置国际化，默认配置如下：

-  ```js
+  ```javascript
  i18n: {
      languages: [
        {
@@ -2,6 +2,8 @@

 完成开发并且在开发环境验证之后，就需要部署给我们的用户了。

+![i18n](../_media/term_build.svg)
+
 ## 构建

 先执行下面的命令，
@@ -34,7 +36,7 @@ File sizes after gzip:

 `build` 命令会打包所有的资源，包含 JavaScript, CSS, web fonts, images, html 等。你可以在 `dist/` 目录下找到这些文件。

-> 如果  有使用 HashHistory 、 部署 html 到非根目录、静态化等需求，请查看[Umi 部署](https://umijs.org/zh/guide/deploy.html)。
+> 如果有使用 HashHistory 、 部署 html 到非根目录、静态化等需求，请查看[Umi 部署](https://umijs.org/zh/guide/deploy.html)。

 ## 本地验证

@@ -0,0 +1,7 @@
+# 问题集锦
+
+## 新建页面
+
+    1. 直接从/src/pages复制一个page (会自动创建路由[umi](https://umijs.org/zh/guide/router.html#%E7%BA%A6%E5%AE%9A%E5%BC%8F%E8%B7%AF%E7%94%B1))
+    2. 修改 namespace/pathToRegexp 在 model.js
+    3. 修改 mock中route.js增加一条route
@@ -0,0 +1,75 @@
+# 国际化
+
+## 新增应用语言
+
+以新增日语为例。
+
+![i18n](../_media/term_i18n.svg)
+
+1. 添加语言包本地文件，`ja` 为日语的语言代码，支持翻译的语言列表参考 [有道智云](http://ai.youdao.com/docs/doc-trans-api.s#p05)，运行下面命令后会生成 `src/locales/ja/messages.json` 文件。
+
+   ```bash
+   npm run add-locale ja
+   ```
+
+2. 提取代码中需要翻译的字段，即 `<Trans>message</Trans>`、`` intl.formatMessage({ id: 'message `` 中 `message` 字段，运行下面命令后 `src/locales/ja/messages.json' }) 将会出现提取后的字段配置。
+
+   ```bash
+   npm run extract
+   ```
+
+   你将看到如下信息：
+
+   ```bash
+    Catalog statistics:
+    ┌─────────────┬─────────────┬─────────┐
+    │ Language    │ Total count │ Missing │
+    ├─────────────┼─────────────┼─────────┤
+    │ en (source) │     52      │    -    │
+    │ ja          │     52      │   52    │
+    │ zh          │     52      │    0    │
+    └─────────────┴─────────────┴─────────┘
+   ```
+
+3. 与此同时，我们在 `src/utils/config.js` 新增相关配置。
+
+   ```javascript
+   {
+       ...
+       i18n: {
+           languages: [
+               ...
+               {
+                   key:'ja',
+                   title: '日本語',
+                   flag: '/japanese.svg',
+               },
+           ],
+       },
+   }
+   ```
+
+   >  路由相关效果，配置后 `npm run start` 重启后生效。
+
+4. 使用内置的命令进行自动翻译，在 `src/locales/ja/messages.json` 中将会看到翻译后的配置。
+
+   ```bash
+   npm run trans:only
+   ```
+
+   你将看到如下信息：
+
+   ```bash
+   start: en -> ja
+   ...
+   youdao: en -> ja: Unpublished -> 未発表
+   youdao: en -> ja: Update -> 更新
+   youdao: en -> ja: Update User -> ユーザーの更新
+   youdao: en -> ja: Username -> 名
+   ...
+   All translations have been completed.
+   ```
+
+   > `npm run trans` 将会依次执行 `npm run extract` 和 `npm run trans:only`
+
+5. 最后，可以在 `src/locales/ja/messages.json` 中对翻译不准确的的字段进行调整。启动开发模式 `npm run start`，打开 [http://localhost:7000/ja/login](http://localhost:7000/ja/login)，你将看到日语版本的应用。
@@ -0,0 +1,60 @@
+# 布局
+
+## 新增布局
+
+以新增名为 `secondary` 的布局为例，使以 `secondary` 开头的路由都使用该布局。
+
+1. 在 `src/utils/config.js` 新增相关配置，参数详细请查看 [layouts](/zh-cn/configuration?id=layouts)。
+
+   ```javascript
+   layouts: [
+           {
+               name: 'primary',
+               include: [/.*/],
+               exclude: [/(\/(en|zh))*\/login/, /(\/(en|zh))*\/secondary\/(.*)/],
+           },
+           {
+               name: 'secondary',
+               include: [/(\/(en|zh))*\/secondary\/(.*)/],
+           },
+   ],
+   ```
+
+2. 在`src/layouts/BaseLayout.js` 文件中新增 `secondary` 布局组件。
+
+   ```javascript
+   import SecondaryLayout from './SecondaryLayout'
+
+   const LayoutMap = {
+     primary: PrimaryLayout,
+     public: PublicLayout,
+     secondary: SecondaryLayout,
+   }
+   ```
+
+3. 在`src/layouts/` 目录中新增 `SecondaryLayout.js` 文件。
+
+   ```javascript
+   import React from 'react'
+
+   export default ({ children }) => {
+     return (
+       <div>
+         <h1>Secondary</h1>
+         {children}
+       </div>
+     )
+   }
+   ```
+
+4. 在`src/pages/` 目录中新增 `secondary/index.js` 文件。
+
+   ```javascript
+   import React from 'react'
+
+   export default ({ children }) => {
+     return <div>Secondary page Content</div>
+   }
+   ```
+
+5. 最后，启动开发模式 `npm run start`，打开 [http://localhost:7000/secondary/](http://localhost:7000/secondary/)，你将看到 `secondary` 布局的页面。
@@ -0,0 +1,24 @@
+# HTTP请求
+
+本项目使用了axios提供http请求服务，文件在src/utils/request.js
+
+## 自定义Header
+
+为了提供鉴权、修改cookie等服务，可以手动修改Header
+
+```
+axios.defaults.headers.common['Authorization'] = 'token'
+```
+
+或者
+
+```
+// 添加请求拦截器
+axios.interceptors.request.use(function (config) {
+  // 在发送请求之前做些什么
+  config.headers.token = window.localStorage.getItem('token');
+  return config;
+}, function (error) {
+  return Promise.reject(error);
+});
+```
@@ -0,0 +1,21 @@
+import { formatter } from "@lingui/format-json"
+
+export default {
+  fallbackLocales: {
+    default: "en",
+  },
+  sourceLocale: "en",
+  locales: ["en", "zh", "pt-br"],
+  catalogs: [
+    {
+      path: "src/locales/{locale}/messages",
+      include: [
+        "src/pages",
+        "src/layouts",
+        "src/components",
+        "src/layouts",
+      ],
+    },
+  ],
+  format: formatter({ style: "minimal" }),
+}
@@ -0,0 +1,36 @@
+{
+  "name": "Antd-Admin",
+  "start_url": ".",
+  "display": "standalone",
+  "background_color": "#fff",
+  "description": "A front-end solution for enterprise applications built upon Ant Design and UmiJS",
+  "icons": [{
+      "src": "logo/logo@96.png",
+      "sizes": "72x72"
+    },
+    {
+      "src": "logo/logo@128.png",
+      "sizes": "128x128"
+    },
+    {
+      "src": "logo/logo@144.png",
+      "sizes": "144x144"
+    },
+    {
+      "src": "logo/logo@152.png",
+      "sizes": "152x152"
+    },
+    {
+      "src": "logo/logo@192.png",
+      "sizes": "192x192"
+    },
+    {
+      "src": "logo/logo@384.png",
+      "sizes": "384x384"
+    },
+    {
+      "src": "logo/logo@512.png",
+      "sizes": "512x512"
+    }
+  ]
+}
@@ -17,25 +17,22 @@ export function randomNumber(min, max) {
 }

 export function randomAvatar() {
-  // https://uifaces.co
  const avatarList = [
-    'https://randomuser.me/api/portraits/men/32.jpg',
-    'https://images.pexels.com/photos/415829/pexels-photo-415829.jpeg?h=350&auto=compress&cs=tinysrgb',
-    'https://d3iw72m71ie81c.cloudfront.net/female-17.jpg',
-    'https://randomuser.me/api/portraits/men/35.jpg',
-    'https://pbs.twimg.com/profile_images/835224725815246848/jdMBCxHS.jpg',
-    'https://pbs.twimg.com/profile_images/584098247641300992/N25WgvW_.png',
-    'https://d3iw72m71ie81c.cloudfront.net/male-5.jpg',
-    'https://images.pexels.com/photos/413723/pexels-photo-413723.jpeg?h=350&auto=compress&cs=tinysrgb',
-    'https://randomuser.me/api/portraits/women/44.jpg',
-    'https://randomuser.me/api/portraits/women/68.jpg',
-    'https://randomuser.me/api/portraits/women/65.jpg',
-    'https://randomuser.me/api/portraits/men/43.jpg',
-    'https://tinyfac.es/data/avatars/475605E3-69C5-4D2B-8727-61B7BB8C4699-500w.jpeg',
-    'https://pbs.twimg.com/profile_images/943227488292962306/teiNNAiy.jpg',
-    'https://randomuser.me/api/portraits/men/46.jpg'
+    'photo-1549492864-2ec7d66ffb04.jpeg',
+    'photo-1480535339474-e083439a320d.jpeg',
+    'photo-1523419409543-a5e549c1faa8.jpeg',
+    'photo-1519648023493-d82b5f8d7b8a.jpeg',
+    'photo-1523307730650-594bc63f9d67.jpeg',
+    'photo-1522962506050-a2f0267e4895.jpeg',
+    'photo-1489779162738-f81aed9b0a25.jpeg',
+    'photo-1534308143481-c55f00be8bd7.jpeg',
+    'photo-1519336555923-59661f41bb45.jpeg',
+    'photo-1551438632-e8c7d9a5d1b7.jpeg',
+    'photo-1525879000488-bff3b1c387cf.jpeg',
+    'photo-1487412720507-e7ab37603c6f.jpeg',
+    'photo-1510227272981-87123e259b17.jpeg'
  ]
-  return avatarList[randomNumber(0, avatarList.length - 1)]
+  return `//image.zuiidea.com/${avatarList[randomNumber(0, avatarList.length - 1)]}?imageView2/1/w/200/h/200/format/webp/q/75|imageslim`
 }

 export const Constant = {
@@ -105,7 +105,7 @@ const Dashboard = Mock.mock({
    content:
      "I'm selfish, impatient and a little insecure. I make mistakes, I am out of control and at times hard to handle. But if you can't handle me at my worst, then you sure as hell don't deserve me at my best.",
    avatar:
-      'http://img.hb.aicdn.com/bc442cf0cc6f7940dcc567e465048d1a8d634493198c4-sPx5BR_fw236',
+      '//cdn.antd-admin.zuiidea.com/bc442cf0cc6f7940dcc567e465048d1a8d634493198c4-sPx5BR_fw236',
  },
  numbers: [
    {
@@ -6,14 +6,24 @@ const database = [
    id: '1',
    icon: 'dashboard',
    name: 'Dashboard',
-    zhName: '仪表盘',
+    zh: {
+      name: '仪表盘'
+    },
+    'pt-br': {
+      name: 'Dashboard'
+    },
    route: '/dashboard',
  },
  {
    id: '2',
    breadcrumbParentId: '1',
    name: 'Users',
-    zhName: '用户管理',
+    zh: {
+      name: '用户管理'
+    },
+    'pt-br': {
+      name: 'Usuário'
+    },
    icon: 'user',
    route: '/user',
  },
@@ -21,7 +31,12 @@ const database = [
    id: '7',
    breadcrumbParentId: '1',
    name: 'Posts',
-    zhName: '文章管理',
+    zh: {
+      name: '用户管理'
+    },
+    'pt-br': {
+      name: 'Posts'
+    },
    icon: 'shopping-cart',
    route: '/post',
  },
@@ -30,14 +45,24 @@ const database = [
    menuParentId: '-1',
    breadcrumbParentId: '2',
    name: 'User Detail',
-    zhName: '用户详情',
+    zh: {
+      name: '用户详情'
+    },
+    'pt-br': {
+      name: 'Detalhes do usuário'
+    },
    route: '/user/:id',
  },
  {
    id: '3',
    breadcrumbParentId: '1',
    name: 'Request',
-    zhName: 'Request',
+    zh: {
+      name: 'Request'
+    },
+    'pt-br': {
+      name: 'Requisição'
+    },
    icon: 'api',
    route: '/request',
  },
@@ -45,7 +70,12 @@ const database = [
    id: '4',
    breadcrumbParentId: '1',
    name: 'UI Element',
-    zhName: 'UI组件',
+    zh: {
+      name: 'UI组件'
+    },
+    'pt-br': {
+      name: 'Elementos UI'
+    },
    icon: 'camera-o',
  },
  {
@@ -53,15 +83,25 @@ const database = [
    breadcrumbParentId: '4',
    menuParentId: '4',
    name: 'Editor',
-    zhName: 'Editor',
+    zh: {
+      name: 'Editor'
+    },
+    'pt-br': {
+      name: 'Editor'
+    },
    icon: 'edit',
-    route: '/UIElement/editor',
+    route: '/editor',
  },
  {
    id: '5',
    breadcrumbParentId: '1',
    name: 'Charts',
-    zhName: 'Charts',
+    zh: {
+      name: 'Charts'
+    },
+    'pt-br': {
+      name: 'Graficos'
+    },
    icon: 'code-o',
  },
  {
@@ -69,7 +109,12 @@ const database = [
    breadcrumbParentId: '5',
    menuParentId: '5',
    name: 'ECharts',
-    zhName: 'ECharts',
+    zh: {
+      name: 'ECharts'
+    },
+    'pt-br': {
+      name: 'ECharts'
+    },
    icon: 'line-chart',
    route: '/chart/ECharts',
  },
@@ -78,7 +123,12 @@ const database = [
    breadcrumbParentId: '5',
    menuParentId: '5',
    name: 'HighCharts',
-    zhName: 'HighCharts',
+    zh: {
+      name: 'HighCharts'
+    },
+    'pt-br': {
+      name: 'HighCharts'
+    },
    icon: 'bar-chart',
    route: '/chart/highCharts',
  },
@@ -87,7 +137,12 @@ const database = [
    breadcrumbParentId: '5',
    menuParentId: '5',
    name: 'Rechartst',
-    zhName: 'Rechartst',
+    zh: {
+      name: 'Rechartst'
+    },
+    'pt-br': {
+      name: 'Rechartst'
+    },
    icon: 'area-chart',
    route: '/chart/Recharts',
  },
@@ -1,4 +1,5 @@
-import { Mock, Constant, qs, randomAvatar } from './_utils'
+import { Mock, Constant, randomAvatar } from './_utils'
+import qs from 'qs'

 const { ApiPrefix } = Constant

@@ -1,73 +1,85 @@
 {
  "name": "antd-admin",
-  "version": "5.0.0-beta",
-  "private": true,
+  "version": "5.5.0",
+  "license": "MIT",
  "description": "An admin dashboard application demo built upon Ant Design and UmiJS",
  "dependencies": {
-    "@lingui/react": "^2.7.0",
-    "ant-design-pro": "^2.1.0",
-    "antd": "^3.10.0",
-    "axios": "^0.18.0",
-    "babel-core": "7.0.0-bridge.0",
-    "classnames": "^2.2.6",
-    "d3-shape": "^1.2.2",
-    "draftjs-to-html": "^0.8.4",
-    "draftjs-to-markdown": "^0.5.1",
+    "@ant-design/icons": "^4.8.3",
+    "@lingui/react": "^5.0.0",
+    "@rc-component/picker": "^1.9.0",
+    "antd": "^6.0.0",
+    "axios": "^1.0.0",
+    "classnames": "^2.5.1",
+    "d3-shape": "^2.1.0",
+    "dayjs": "^1.11.10",
+    "draft-js": "^0.11.7",
+    "draftjs-to-html": "^0.9.1",
+    "draftjs-to-markdown": "^0.6.0",
    "dva-model-extend": "^0.1.2",
-    "echarts": "^4.2.0-rc.2",
-    "echarts-for-react": "^2.0.15-beta.0",
-    "echarts-gl": "^1.1.1",
-    "echarts-liquidfill": "^2.0.2",
+    "echarts": "^5.5.0",
+    "echarts-for-react": "^3.0.2",
+    "echarts-gl": "^2.0.9",
+    "echarts-liquidfill": "^3.1.0",
    "enquire-js": "^0.2.1",
-    "highcharts-exporting": "^0.1.7",
-    "highcharts-more": "^0.1.7",
+    "highcharts": "^11.2.0",
+    "highcharts-react-official": "^3.2.3",
    "json-format": "^1.0.1",
-    "lodash": "^4.17.11",
-    "md5": "^2.2.1",
+    "lodash": "^4.17.21",
+    "make-plural": "^7.3.0",
+    "md5": "^2.3.0",
    "nprogress": "^0.2.0",
-    "path-to-regexp": "^2.4.0",
-    "prop-types": "^15.6.2",
-    "qs": "^6.5.2",
-    "rc-tween-one": "^2.2.8",
-    "react-adsense": "^0.0.6",
-    "react-countup": "^4.0.0-alpha.6",
-    "react-draft-wysiwyg": "^1.12.13",
-    "react-helmet": "^5.2.0",
-    "react-highcharts": "^16.0.2",
-    "react-perfect-scrollbar": "^1.4.0",
-    "recharts": "^1.3.0",
+    "path-to-regexp": "^6.2.2",
+    "prop-types": "^15.8.1",
+    "qs": "^6.12.0",
+    "react": "^18.2.0",
+    "react-adsense": "^0.1.0",
+    "react-countup": "^4.4.0",
+    "react-dom": "^18.2.0",
+    "react-draft-wysiwyg": "^1.15.0",
+    "react-helmet": "^6.1.0",
+    "react-perfect-scrollbar": "^1.5.8",
+    "recharts": "^2.12.4",
    "store": "^2.0.12"
  },
  "devDependencies": {
-    "@lingui/babel-preset-react": "^2.7.0",
-    "@lingui/cli": "^2.7.0",
-    "@lingui/loader": "^2.7.0",
-    "babel-eslint": "^10.0.1",
-    "babel-plugin-dev-expression": "^0.2.1",
-    "babel-plugin-import": "^1.10.0",
-    "babel-plugin-macros": "^2.4.2",
-    "babel-plugin-module-resolver": "^3.1.1",
-    "cross-env": "^5.2.0",
-    "eslint": "^5.7.0",
-    "eslint-config-react-app": "^3.0.4",
-    "eslint-plugin-flowtype": "^3.0.0",
-    "eslint-plugin-import": "^2.6.0",
-    "eslint-plugin-jsx-a11y": "^6.1.1",
-    "eslint-plugin-react": "^7.1.0",
-    "husky": "^1.1.1",
+    "@babel/core": "^7.29.0",
+    "@babel/preset-react": "^7.24.1",
+    "@lingui/cli": "^5.0.0",
+    "@lingui/core": "^5.0.0",
+    "@lingui/format-json": "^5.9.1",
+    "@umijs/preset-react": "^1.8.32",
+    "@lingui/macro": "^5.0.0",
+    "babel-eslint": "^10.1.0",
+    "babel-plugin-dev-expression": "^0.2.3",
+    "babel-plugin-import": "^1.13.8",
+    "babel-plugin-macros": "^3.1.0",
+    "babel-plugin-module-resolver": "^4.1.0",
+    "cross-env": "^7.0.3",
+    "eslint": "^7.32.0",
+    "eslint-config-react-app": "^6.0.0",
+    "eslint-plugin-flowtype": "^5.10.0",
+    "eslint-plugin-import": "^2.29.1",
+    "eslint-plugin-jsx-a11y": "^6.8.0",
+    "eslint-plugin-react": "^7.34.1",
+    "eslint-plugin-react-hooks": "^4.6.0",
+    "husky": "^4.3.8",
    "less-vars-to-js": "^1.3.0",
-    "lint-staged": "^7.3.0",
-    "mockjs": "^1.0.1-beta3",
+    "puppeteer-core": "^24.37.2",
+    "lint-staged": "^10.5.4",
+    "mockjs": "^1.1.0",
    "module": "^1.2.5",
-    "prettier": "^1.14.3",
-    "stylelint": "^9.6.0",
-    "stylelint-config-prettier": "^4.0.0",
-    "stylelint-config-standard": "^18.2.0",
-    "umi": "^2.2.1",
-    "umi-plugin-react": "^1.2.0"
+    "prettier": "^2.8.8",
+    "stylelint": "^13.13.1",
+    "stylelint-config-prettier": "^8.0.2",
+    "stylelint-config-standard": "^21.0.0",
+    "typescript": "^4.9.5",
+    "umi": "^3.5.41"
  },
-  "optionalDependencies": {
-    "puppeteer": "^1.9.0"
+  "overrides": {
+    "@babel/core": "^7.29.0"
+  },
+  "engines": {
+    "node": ">= 10.0.0"
  },
  "lint-staged": {
    "src/**/*.js": [
@@ -82,30 +94,37 @@
    ]
  },
  "lingui": {
-    "fallbackLocale": "en",
+    "fallbackLocales": {
+      "default": "en"
+    },
    "sourceLocale": "en",
-    "localeDir": "src/locales",
-    "srcPathDirs": [
-      "src/pages",
-      "src/layouts",
-      "src/components",
-      "src/layouts"
+    "locales": [
+      "en",
+      "zh",
+      "pt-br"
    ],
-    "format": "minimal",
-    "extractBabelOptions": {
-      "presets": [
-        "umi/babel"
-      ]
-    }
+    "catalogs": [
+      {
+        "path": "src/locales/{locale}/messages",
+        "include": [
+          "src/pages",
+          "src/layouts",
+          "src/components",
+          "src/layouts"
+        ]
+      }
+    ]
  },
  "scripts": {
    "analyze": "cross-env ANALYZE=1 umi build",
-    "build": "umi build",
+    "build": "cross-env NODE_OPTIONS=--openssl-legacy-provider umi build",
+    "check:model": "umi dva list model",
    "lint:js": "eslint --ext .js src",
    "lint:style": "stylelint \"src/**/*.less\" --syntax less",
-    "start": "umi dev",
+    "start": "cross-env NODE_OPTIONS=--openssl-legacy-provider umi dev",
    "test": "cross-env BABELRC=none umi test",
-    "prettier": "prettier --write 'src/**/*.(js|less)'",
+    "prettier": "prettier --write 'src/**/*.{js,less}'",
+    "test:e2e": "node ./src/e2e/run-puppeteer.js",
    "precommit": "lint-staged",
    "add-locale": "lingui add-locale",
    "extract": "lingui extract",
@@ -0,0 +1,40 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
+<rect style="fill:#D80027;" width="512" height="512"/>
+<polygon style="fill:#6DA544;" points="196.641,0 196.641,264.348 196.641,512 0,512 0,0 "/>
+<circle style="fill:#FFDA44;" cx="196.641" cy="256" r="96"/>
+<path style="fill:#D80027;" d="M142.638,208v60c0,29.823,24.178,54,54,54s54-24.178,54-54v-60H142.638z"/>
+<path style="fill:#F0F0F0;" d="M196.638,286c-9.925,0-18-8.075-18-18v-24.001h36V268C214.638,277.925,206.563,286,196.638,286z"/>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>
@@ -56,9 +56,21 @@ const transform = async ({ from, to, locales, outputPath }) => {
      let res = key
      let way = 'youdao'
      if (key.indexOf('/') !== 0) {
-        res = await youdao({
-          q: key,
-        })
+        const reg = '{([^{}]*)}'
+        const tasks = key
+          .match(new RegExp(`${reg}|((?<=(${reg}|^)).*?(?=(${reg}|$)))`, 'g'))
+          .map(item => {
+            if (new RegExp(reg).test(item)) {
+              return Promise.resolve(item)
+            }
+            return youdao({
+              q: item,
+              from,
+              to,
+            })
+          })
+
+        res = (await Promise.all(tasks)).join('')
      } else {
        res = `/${to + key}`
        way = 'link'
@@ -1,6 +1,7 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import { Dropdown, Button, Icon, Menu } from 'antd'
+import { BarsOutlined, DownOutlined } from '@ant-design/icons'
+import { Dropdown, Button, Menu } from 'antd'

 const DropOption = ({
  onMenuClick,
@@ -8,17 +9,13 @@ const DropOption = ({
  buttonStyle,
  dropdownProps,
 }) => {
-  const menu = menuOptions.map(item => (
-    <Menu.Item key={item.key}>{item.name}</Menu.Item>
-  ))
+  const items = menuOptions.map(item => ({ key: item.key, label: item.name }))
+
  return (
-    <Dropdown
-      overlay={<Menu onClick={onMenuClick}>{menu}</Menu>}
-      {...dropdownProps}
-    >
+    <Dropdown overlay={<Menu onClick={onMenuClick} items={items} />} {...dropdownProps}>
      <Button style={{ border: 'none', ...buttonStyle }}>
-        <Icon style={{ marginRight: 2 }} type="bars" />
-        <Icon type="down" />
+        <BarsOutlined style={{ marginRight: 2 }} />
+        <DownOutlined />
      </Button>
    </Dropdown>
  )
@@ -0,0 +1,21 @@
+import React from 'react';
+import { TooltipProps } from 'antd/lib/tooltip';
+
+export interface EllipsisTooltipProps extends TooltipProps {
+  title?: undefined;
+  overlayStyle?: undefined;
+}
+
+export interface EllipsisProps {
+  tooltip?: boolean | EllipsisTooltipProps;
+  length?: number;
+  lines?: number;
+  style?: React.CSSProperties;
+  className?: string;
+  fullWidthRecognition?: boolean;
+}
+
+export function getStrFullLength(str: string): number;
+export function cutStrByFullLength(str: string, maxLength: number): string;
+
+export default class Ellipsis extends React.Component<EllipsisProps, any> {}
@@ -0,0 +1,272 @@
+import React, { Component } from 'react';
+import { Tooltip } from 'antd';
+import classNames from 'classnames';
+import styles from './index.less';
+
+/* eslint react/no-did-mount-set-state: 0 */
+/* eslint no-param-reassign: 0 */
+
+const isSupportLineClamp = document.body.style.webkitLineClamp !== undefined;
+
+const TooltipOverlayStyle = {
+  overflowWrap: 'break-word',
+  wordWrap: 'break-word',
+};
+
+export const getStrFullLength = (str = '') =>
+  str.split('').reduce((pre, cur) => {
+    const charCode = cur.charCodeAt(0);
+    if (charCode >= 0 && charCode <= 128) {
+      return pre + 1;
+    }
+    return pre + 2;
+  }, 0);
+
+export const cutStrByFullLength = (str = '', maxLength) => {
+  let showLength = 0;
+  return str.split('').reduce((pre, cur) => {
+    const charCode = cur.charCodeAt(0);
+    if (charCode >= 0 && charCode <= 128) {
+      showLength += 1;
+    } else {
+      showLength += 2;
+    }
+    if (showLength <= maxLength) {
+      return pre + cur;
+    }
+    return pre;
+  }, '');
+};
+
+const getTooltip = ({ tooltip, overlayStyle, title, children }) => {
+  if (tooltip) {
+    const base = tooltip === true ? {} : { ...tooltip };
+    const styleProp = overlayStyle ? { styles: { root: overlayStyle } } : {};
+    const props = { ...base, ...styleProp, title };
+    return <Tooltip {...props}>{children}</Tooltip>;
+  }
+  return children;
+};
+
+const EllipsisText = ({ text, length, tooltip, fullWidthRecognition, ...other }) => {
+  if (typeof text !== 'string') {
+    throw new Error('Ellipsis children must be string.');
+  }
+  const textLength = fullWidthRecognition ? getStrFullLength(text) : text.length;
+  if (textLength <= length || length < 0) {
+    return <span {...other}>{text}</span>;
+  }
+  const tail = '...';
+  let displayText;
+  if (length - tail.length <= 0) {
+    displayText = '';
+  } else {
+    displayText = fullWidthRecognition ? cutStrByFullLength(text, length) : text.slice(0, length);
+  }
+
+  const spanAttrs = tooltip ? {} : { ...other };
+      return getTooltip({
+        tooltip,
+        overlayStyle: TooltipOverlayStyle,
+        title: text,
+        children: (
+          <span {...spanAttrs}>
+            {displayText}
+            {tail}
+          </span>
+        ),
+      });
+};
+
+export default class Ellipsis extends Component {
+  state = {
+    text: '',
+    targetCount: 0,
+  };
+
+  componentDidMount() {
+    if (this.node) {
+      this.computeLine();
+    }
+  }
+
+  componentDidUpdate(perProps) {
+    const { lines } = this.props;
+    if (lines !== perProps.lines) {
+      this.computeLine();
+    }
+  }
+
+  computeLine = () => {
+    const { lines } = this.props;
+    if (lines && !isSupportLineClamp) {
+      const text = this.shadowChildren.innerText || this.shadowChildren.textContent;
+      const lineHeight = parseInt(getComputedStyle(this.root).lineHeight, 10);
+      const targetHeight = lines * lineHeight;
+      this.content.style.height = `${targetHeight}px`;
+      const totalHeight = this.shadowChildren.offsetHeight;
+      const shadowNode = this.shadow.firstChild;
+
+      if (totalHeight <= targetHeight) {
+        this.setState({
+          text,
+          targetCount: text.length,
+        });
+        return;
+      }
+
+      // bisection
+      const len = text.length;
+      const mid = Math.ceil(len / 2);
+
+      const count = this.bisection(targetHeight, mid, 0, len, text, shadowNode);
+
+      this.setState({
+        text,
+        targetCount: count,
+      });
+    }
+  };
+
+  bisection = (th, m, b, e, text, shadowNode) => {
+    const suffix = '...';
+    let mid = m;
+    let end = e;
+    let begin = b;
+    shadowNode.innerHTML = text.substring(0, mid) + suffix;
+    let sh = shadowNode.offsetHeight;
+
+    if (sh <= th) {
+      shadowNode.innerHTML = text.substring(0, mid + 1) + suffix;
+      sh = shadowNode.offsetHeight;
+      if (sh > th || mid === begin) {
+        return mid;
+      }
+      begin = mid;
+      if (end - begin === 1) {
+        mid = 1 + begin;
+      } else {
+        mid = Math.floor((end - begin) / 2) + begin;
+      }
+      return this.bisection(th, mid, begin, end, text, shadowNode);
+    }
+    if (mid - 1 < 0) {
+      return mid;
+    }
+    shadowNode.innerHTML = text.substring(0, mid - 1) + suffix;
+    sh = shadowNode.offsetHeight;
+    if (sh <= th) {
+      return mid - 1;
+    }
+    end = mid;
+    mid = Math.floor((end - begin) / 2) + begin;
+    return this.bisection(th, mid, begin, end, text, shadowNode);
+  };
+
+  handleRoot = n => {
+    this.root = n;
+  };
+
+  handleContent = n => {
+    this.content = n;
+  };
+
+  handleNode = n => {
+    this.node = n;
+  };
+
+  handleShadow = n => {
+    this.shadow = n;
+  };
+
+  handleShadowChildren = n => {
+    this.shadowChildren = n;
+  };
+
+  render() {
+    const { text, targetCount } = this.state;
+    const {
+      children,
+      lines,
+      length,
+      className,
+      tooltip,
+      fullWidthRecognition,
+      ...restProps
+    } = this.props;
+
+    const cls = classNames(styles.ellipsis, className, {
+      [styles.lines]: lines && !isSupportLineClamp,
+      [styles.lineClamp]: lines && isSupportLineClamp,
+    });
+
+    if (!lines && !length) {
+      return (
+        <span className={cls} {...restProps}>
+          {children}
+        </span>
+      );
+    }
+
+    // length
+    if (!lines) {
+      return (
+        <EllipsisText
+          className={cls}
+          length={length}
+          text={children || ''}
+          tooltip={tooltip}
+          fullWidthRecognition={fullWidthRecognition}
+          {...restProps}
+        />
+      );
+    }
+
+    const id = `antd-pro-ellipsis-${`${new Date().getTime()}${Math.floor(Math.random() * 100)}`}`;
+
+    // support document.body.style.webkitLineClamp
+    if (isSupportLineClamp) {
+      const style = `#${id}{-webkit-line-clamp:${lines};-webkit-box-orient: vertical;}`;
+
+      const node = (
+        <div id={id} className={cls} {...restProps}>
+          <style>{style}</style>
+          {children}
+        </div>
+      );
+
+      return getTooltip({
+        tooltip,
+        overlayStyle: TooltipOverlayStyle,
+        title: children,
+        children: node,
+      });
+    }
+
+    const childNode = (
+      <span ref={this.handleNode}>
+        {targetCount > 0 && text.substring(0, targetCount)}
+        {targetCount > 0 && targetCount < text.length && '...'}
+      </span>
+    );
+
+    return (
+      <div {...restProps} ref={this.handleRoot} className={cls}>
+        <div ref={this.handleContent}>
+          {getTooltip({
+            tooltip,
+            overlayStyle: TooltipOverlayStyle,
+            title: text,
+            children: childNode,
+          })}
+          <div className={styles.shadow} ref={this.handleShadowChildren}>
+            {children}
+          </div>
+          <div className={styles.shadow} ref={this.handleShadow}>
+            <span>{text}</span>
+          </div>
+        </div>
+      </div>
+    );
+  }
+}
@@ -0,0 +1,24 @@
+.ellipsis {
+  display: inline-block;
+  width: 100%;
+  overflow: hidden;
+  word-break: break-all;
+}
+
+.lines {
+  position: relative;
+  .shadow {
+    position: absolute;
+    z-index: -999;
+    display: block;
+    color: transparent;
+    opacity: 0;
+  }
+}
+
+.lineClamp {
+  position: relative;
+  display: -webkit-box;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
@@ -0,0 +1,17 @@
+---
+title: Ellipsis
+subtitle: 文本自动省略号
+cols: 1
+order: 10
+---
+
+文本过长自动处理省略号，支持按照文本长度和最大行数两种方式截取。
+
+## API
+
+| 参数                 | 说明                                             | 类型    | 默认值 |
+| -------------------- | ------------------------------------------------ | ------- | ------ |
+| tooltip              | 移动到文本展示完整内容的提示                     | boolean | -      |
+| length               | 在按照长度截取下的文本最大字符数，超过则截取省略 | number  | -      |
+| lines                | 在按照行数截取下最大的行数，超过则截取省略       | number  | `1`    |
+| fullWidthRecognition | 是否将全角字符的长度视为 2 来计算字符串长度      | boolean | -      |
@@ -0,0 +1,13 @@
+import { getStrFullLength, cutStrByFullLength } from './index';
+
+describe('test calculateShowLength', () => {
+  it('get full length', () => {
+    expect(getStrFullLength('一二，a,')).toEqual(8);
+  });
+  it('cut str by full length', () => {
+    expect(cutStrByFullLength('一二，a,', 7)).toEqual('一二，a');
+  });
+  it('cut str when length small', () => {
+    expect(cutStrByFullLength('一22三', 5)).toEqual('一22');
+  });
+});
@@ -6,7 +6,7 @@ const FilterItem = ({ label = '', children }) => {
  const labelArray = label.split('')
  return (
    <div className={styles.filterItem}>
-      {labelArray.length > 0 ? (
+      {labelArray.length > 0 && (
        <div className={styles.labelWrap}>
          {labelArray.map((item, index) => (
            <span className="labelText" key={index}>
@@ -14,8 +14,6 @@ const FilterItem = ({ label = '', children }) => {
            </span>
          ))}
        </div>
-      ) : (
-        ''
      )}
      <div className={styles.item}>{children}</div>
    </div>
@@ -0,0 +1,14 @@
+import React from 'react';
+export interface GlobalFooterProps {
+  links?: Array<{
+    key?: string;
+    title: React.ReactNode;
+    href: string;
+    blankTarget?: boolean;
+  }>;
+  copyright?: React.ReactNode;
+  style?: React.CSSProperties;
+  className?: string;
+}
+
+export default class GlobalFooter extends React.Component<GlobalFooterProps, any> {}
@@ -0,0 +1,29 @@
+import React from 'react';
+import classNames from 'classnames';
+import styles from './index.less';
+
+const GlobalFooter = ({ className, links, copyright }) => {
+  const clsString = classNames(styles.globalFooter, className);
+  return (
+    <footer className={clsString}>
+      {links && (
+        <div className={styles.links}>
+          {links.map(link => (
+            <a
+              key={link.key}
+              title={link.key}
+              target={link.blankTarget ? '_blank' : '_self'}
+              rel={link.blankTarget ? 'noreferrer noopener' : undefined}
+              href={link.href}
+            >
+              {link.title}
+            </a>
+          ))}
+        </div>
+      )}
+      {copyright && <div className={styles.copyright}>{copyright}</div>}
+    </footer>
+  );
+};
+
+export default GlobalFooter;
@@ -0,0 +1,29 @@
+/* @import '~antd/lib/style/themes/default.less'; */
+
+.globalFooter {
+  margin: 48px 0 24px 0;
+  padding: 0 16px;
+  text-align: center;
+
+  .links {
+    margin-bottom: 8px;
+
+    a {
+      color: @text-color-secondary;
+      transition: all 0.3s;
+
+      &:not(:last-child) {
+        margin-right: 40px;
+      }
+
+      &:hover {
+        color: @text-color;
+      }
+    }
+  }
+
+  .copyright {
+    color: @text-color-secondary;
+    font-size: @font-size-base;
+  }
+}
@@ -0,0 +1,15 @@
+---
+title: GlobalFooter
+subtitle: 全局页脚
+cols: 1
+order: 7
+---
+
+页脚属于全局导航的一部分，作为对顶部导航的补充，通过传递数据控制展示内容。
+
+## API
+
+| 参数      | 说明     | 类型                                                             | 默认值 |
+| --------- | -------- | ---------------------------------------------------------------- | ------ |
+| links     | 链接数据 | array<{ title: ReactNode, href: string, blankTarget?: boolean }> | -      |
+| copyright | 版权信息 | ReactNode                                                        | -      |
@@ -1,43 +1,40 @@
 import React, { PureComponent, Fragment } from 'react'
 import PropTypes from 'prop-types'
-import { Breadcrumb, Icon } from 'antd'
-import Link from 'umi/navlink'
-import withRouter from 'umi/withRouter'
-import { withI18n } from '@lingui/react'
-import { pathMatchRegexp, queryAncestors } from 'utils'
+import { Breadcrumb } from 'antd'
+import { Link, withRouter } from 'umi'
+import { i18n } from '@lingui/core'
+import iconMap from 'utils/iconMap'
+import { pathToRegexp } from 'path-to-regexp'
+import { queryAncestors } from 'utils'
 import styles from './Bread.less'

-@withI18n()
@withRouter
 class Bread extends PureComponent {
-  generateBreadcrumbs = paths => {
-    return paths.map((item, key) => {
-      const content = (
-        <Fragment>
-          {item.icon ? (
-            <Icon type={item.icon} style={{ marginRight: 4 }} />
-          ) : null}
-          {item.name}
-        </Fragment>
-      )
+  generateBreadcrumbItems = paths => {
+    return paths
+      .map((item, key) => {
+        if (!item) return null

-      return (
-        <Breadcrumb.Item key={key}>
-          {paths.length - 1 !== key ? (
-            <Link to={item.route || '#'}>{content}</Link>
-          ) : (
-            content
-          )}
-        </Breadcrumb.Item>
-      )
-    })
+        const content = (
+          <Fragment>
+            {item.icon && <span style={{ marginRight: 4 }}>{iconMap[item.icon]}</span>}
+            {item.name}
+          </Fragment>
+        )
+
+        return ({
+          key: item.id || key,
+          title: paths.length - 1 !== key ? <Link to={item.route || '#'}>{content}</Link> : content,
+        })
+      })
+      .filter(Boolean)
  }
  render() {
-    const { routeList, location, i18n } = this.props
+    const { routeList, location } = this.props

    // Find a route that matches the pathname.
    const currentRoute = routeList.find(
-      _ => _.route && pathMatchRegexp(_.route, location.pathname)
+      (_) => _.route && pathToRegexp(_.route).exec(location.pathname)
    )

    // Find the breadcrumb navigation of the current route match and all its ancestors.
@@ -47,15 +44,13 @@ class Bread extends PureComponent {
          routeList[0],
          {
            id: 404,
-            name: i18n.t`Not Found`,
+            name: i18n._('Not Found'),
          },
        ]

-    return (
-      <Breadcrumb className={styles.bread}>
-        {this.generateBreadcrumbs(paths)}
-      </Breadcrumb>
-    )
+    const items = this.generateBreadcrumbItems(paths)
+
+    return <Breadcrumb className={styles.bread} items={items} />
  }
 }

@@ -1,24 +1,28 @@
 import React, { PureComponent, Fragment } from 'react'
 import PropTypes from 'prop-types'
-import { Menu, Icon, Layout, Avatar, Popover, Badge, List } from 'antd'
-import { Ellipsis } from 'ant-design-pro'
-import { Trans, withI18n } from '@lingui/react'
-import { setLocale } from 'utils'
-import moment from 'moment'
+import { Menu, Layout, Avatar, Popover, Badge, List } from 'antd'
+import { Ellipsis } from 'components'
+import {
+  BellOutlined,
+  RightOutlined,
+  MenuFoldOutlined,
+  MenuUnfoldOutlined,
+} from '@ant-design/icons'
+import { i18n } from '@lingui/core'
+import { getLocale, setLocale } from 'utils'
+import dayjs from 'dayjs'
 import classnames from 'classnames'
 import config from 'config'
 import styles from './Header.less'

-const { SubMenu } = Menu

-@withI18n()
+
 class Header extends PureComponent {
  handleClickMenu = e => {
    e.key === 'SignOut' && this.props.onSignOut()
  }
  render() {
    const {
-      i18n,
      fixed,
      avatar,
      username,
@@ -28,32 +32,52 @@ class Header extends PureComponent {
      onAllNotificationsRead,
    } = this.props

-    const rightContent = [
-      <Menu key="user" mode="horizontal" onClick={this.handleClickMenu}>
-        <SubMenu
-          title={
-            <Fragment>
-              <span style={{ color: '#999', marginRight: 4 }}>
-                <Trans>Hi,</Trans>
-              </span>
-              <span>{username}</span>
-              <Avatar style={{ marginLeft: 8 }} src={avatar} />
-            </Fragment>
-          }
-        >
-          <Menu.Item key="SignOut">
-            <Trans>Sign out</Trans>
-          </Menu.Item>
-        </SubMenu>
-      </Menu>,
+    const userMenuItems = [
+      {
+        key: 'user',
+        label: (
+          <Fragment>
+            <span style={{ color: '#999', marginRight: 4 }}>
+              {i18n._('Hi,')}
+            </span>
+            <span>{username}</span>
+            <Avatar style={{ marginLeft: 8 }} src={avatar} />
+          </Fragment>
+        ),
+            children: [
+          {
+            key: 'SignOut',
+            label: i18n._('Sign out'),
+          },
+        ],
+      },
    ]

+    const rightContent = [<Menu key="user" mode="horizontal" onClick={this.handleClickMenu} items={userMenuItems} />]
+
    if (config.i18n) {
      const { languages } = config.i18n
+      const language = getLocale()
      const currentLanguage = languages.find(
-        item => item.key === i18n._language
+        item => item.key === language
      )

+      const languageItems = [
+        {
+          key: 'language',
+          label: <Avatar size="small" src={currentLanguage.flag} />,
+          children: languages.map(item => ({
+            key: item.key,
+            label: (
+              <>
+                <Avatar size="small" style={{ marginRight: 8 }} src={item.flag} />
+                {item.title}
+              </>
+            ),
+          })),
+        },
+      ]
+
      rightContent.unshift(
        <Menu
          key="language"
@@ -62,20 +86,8 @@ class Header extends PureComponent {
            setLocale(data.key)
          }}
          mode="horizontal"
-        >
-          <SubMenu title={<Avatar size="small" src={currentLanguage.flag} />}>
-            {languages.map(item => (
-              <Menu.Item key={item.key}>
-                <Avatar
-                  size="small"
-                  style={{ marginRight: 8 }}
-                  src={item.flag}
-                />
-                {item.title}
-              </Menu.Item>
-            ))}
-          </SubMenu>
-        </Menu>
+          items={languageItems}
+        />
      )
    }

@@ -85,14 +97,14 @@ class Header extends PureComponent {
        trigger="click"
        key="notifications"
        overlayClassName={styles.notificationPopover}
-        getPopupContainer={() => document.querySelector('#layoutHeader')}
+        getPopupContainer={() => document.querySelector('#primaryLayout')}
        content={
          <div className={styles.notification}>
            <List
              itemLayout="horizontal"
              dataSource={notifications}
              locale={{
-                emptyText: <Trans>You have viewed all notifications.</Trans>,
+                emptyText: i18n._('You have viewed all notifications.'),
              }}
              renderItem={item => (
                <List.Item className={styles.notificationItem}>
@@ -102,13 +114,9 @@ class Header extends PureComponent {
                        {item.title}
                      </Ellipsis>
                    }
-                    description={moment(item.date).fromNow()}
-                  />
-                  <Icon
-                    style={{ fontSize: 10, color: '#ccc' }}
-                    type="right"
-                    theme="outlined"
+                    description={dayjs(item.date).fromNow()}
                  />
+                  <RightOutlined style={{ fontSize: 10, color: '#ccc' }} />
                </List.Item>
              )}
            />
@@ -117,7 +125,7 @@ class Header extends PureComponent {
                onClick={onAllNotificationsRead}
                className={styles.clearButton}
              >
-                <Trans>Clear notifications</Trans>
+                {i18n._('Clear notifications')}
              </div>
            ) : null}
          </div>
@@ -129,7 +137,7 @@ class Header extends PureComponent {
          offset={[-10, 10]}
          className={styles.iconButton}
        >
-          <Icon className={styles.iconFont} type="bell" />
+          <BellOutlined className={styles.iconFont} />
        </Badge>
      </Popover>
    )
@@ -140,20 +148,15 @@ class Header extends PureComponent {
          [styles.fixed]: fixed,
          [styles.collapsed]: collapsed,
        })}
+        style={{height: 72, backgroundColor: 'white', paddingInline: 0}}
        id="layoutHeader"
      >
        <div
          className={styles.button}
          onClick={onCollapseChange.bind(this, !collapsed)}
        >
-          <Icon
-            type={classnames({
-              'menu-unfold': collapsed,
-              'menu-fold': !collapsed,
-            })}
-          />
+          {collapsed ? <MenuUnfoldOutlined /> : <MenuFoldOutlined />}
        </div>
-
        <div className={styles.rightContainer}>{rightContent}</div>
      </Layout.Header>
    )
@@ -16,7 +16,7 @@
    top: 0;
    right: 0;
    width: ~'calc(100% - 256px)';
-    z-index: 9;
+    z-index: 29;
    transition: width 0.2s;

    &.collapsed {
@@ -27,6 +27,8 @@
  :global {
    .ant-menu-submenu-title {
      height: 72px;
+      display: flex;
+      align-items: center;
    }

    .ant-menu-horizontal {
@@ -1,17 +1,13 @@
 import React, { PureComponent, Fragment } from 'react'
 import PropTypes from 'prop-types'
-import { Menu, Icon } from 'antd'
-import Navlink from 'umi/navlink'
-import withRouter from 'umi/withRouter'
-import {
-  arrayToTree,
-  queryAncestors,
-  pathMatchRegexp,
-  addLangPrefix,
-} from 'utils'
+import { Menu } from 'antd'
+import { NavLink, withRouter } from 'umi'
+import { pathToRegexp } from 'path-to-regexp'
+import { arrayToTree, queryAncestors } from 'utils'
+import iconMap from 'utils/iconMap'
 import store from 'store'

-const { SubMenu } = Menu
+// Use `items` prop for Menu (avoid JSX children like Menu.Item/SubMenu)

@withRouter
 class SiderMenu extends PureComponent {
@@ -38,31 +34,30 @@ class SiderMenu extends PureComponent {
    store.set('openKeys', newOpenKeys)
  }

-  generateMenus = data => {
+  generateMenuItems = data => {
    return data.map(item => {
      if (item.children) {
-        return (
-          <SubMenu
-            key={item.id}
-            title={
-              <Fragment>
-                {item.icon && <Icon type={item.icon} />}
-                <span>{item.name}</span>
-              </Fragment>
-            }
-          >
-            {this.generateMenus(item.children)}
-          </SubMenu>
-        )
+        return {
+          key: item.id,
+          label: (
+            <Fragment>
+              {item.icon && iconMap[item.icon]}
+              <span>{item.name}</span>
+            </Fragment>
+          ),
+          children: this.generateMenuItems(item.children),
+        }
      }
-      return (
-        <Menu.Item key={item.id}>
-          <Navlink to={addLangPrefix(item.route) || '#'}>
-            {item.icon && <Icon type={item.icon} />}
+
+      return {
+        key: item.id,
+        label: (
+          <NavLink to={item.route || '#'}>
+            {item.icon && iconMap[item.icon]}
            <span>{item.name}</span>
-          </Navlink>
-        </Menu.Item>
-      )
+          </NavLink>
+        ),
+      }
    })
  }

@@ -81,7 +76,7 @@ class SiderMenu extends PureComponent {

    // Find a menu that matches the pathname.
    const currentMenu = menus.find(
-      _ => _.route && pathMatchRegexp(_.route, location.pathname)
+      _ => _.route && pathToRegexp(_.route).exec(location.pathname)
    )

    // Find the key that should be selected according to the current menu.
@@ -89,13 +84,19 @@ class SiderMenu extends PureComponent {
      ? queryAncestors(menus, currentMenu, 'menuParentId').map(_ => _.id)
      : []

+    const menuProps = collapsed
+      ? {}
+      : {
+          openKeys: this.state.openKeys,
+        }
+
+    const items = this.generateMenuItems(menuTree)
+
    return (
      <Menu
        mode="inline"
        theme={theme}
        onOpenChange={this.onOpenChange}
-        openKeys={this.state.openKeys}
-        inlineCollapsed={collapsed}
        selectedKeys={selectedKeys}
        onClick={
          isMobile
@@ -104,9 +105,9 @@ class SiderMenu extends PureComponent {
              }
            : undefined
        }
-      >
-        {this.generateMenus(menuTree)}
-      </Menu>
+        items={items}
+        {...menuProps}
+      />
    )
  }
 }
@@ -115,7 +116,6 @@ SiderMenu.propTypes = {
  menus: PropTypes.array,
  theme: PropTypes.string,
  isMobile: PropTypes.bool,
-  collapsed: PropTypes.bool,
  onCollapseChange: PropTypes.func,
 }

@@ -1,17 +1,16 @@
 import React, { PureComponent } from 'react'
 import PropTypes from 'prop-types'
-import { Icon, Switch, Layout } from 'antd'
-import { withI18n, Trans } from '@lingui/react'
+import { Switch, Layout } from 'antd'
+import { i18n } from '@lingui/core'
+import { BulbOutlined } from '@ant-design/icons'
 import ScrollBar from '../ScrollBar'
 import { config } from 'utils'
 import SiderMenu from './Menu'
 import styles from './Sider.less'

-@withI18n()
 class Sider extends PureComponent {
  render() {
    const {
-      i18n,
      menus,
      theme,
      isMobile,
@@ -28,19 +27,19 @@ class Sider extends PureComponent {
        trigger={null}
        collapsible
        collapsed={collapsed}
-        onBreakpoint={isMobile ? null : onCollapseChange}
+        onBreakpoint={!isMobile ? onCollapseChange : (broken) => {}}
        className={styles.sider}
      >
        <div className={styles.brand}>
          <div className={styles.logo}>
            <img alt="logo" src={config.logoPath} />
-            {collapsed ? null : <h1>{config.siteName}</h1>}
+            {!collapsed && <h1>{config.siteName}</h1>}
          </div>
        </div>

        <div className={styles.menuContainer}>
          <ScrollBar
-            option={{
+            options={{
              // Disabled horizontal scrolling, https://github.com/utatti/perfect-scrollbar#options
              suppressScrollX: true,
            }}
@@ -54,11 +53,11 @@ class Sider extends PureComponent {
            />
          </ScrollBar>
        </div>
-        {collapsed ? null : (
+        {!collapsed && (
          <div className={styles.switchTheme}>
            <span>
-              <Icon type="bulb" />
-              <Trans>Switch Theme</Trans>
+              <BulbOutlined />
+              {i18n._('Switch Theme')}
            </span>
            <Switch
              onChange={onThemeChange.bind(
@@ -66,8 +65,8 @@ class Sider extends PureComponent {
                theme === 'dark' ? 'light' : 'dark'
              )}
              defaultChecked={theme === 'dark'}
-              checkedChildren={i18n.t`Dark`}
-              unCheckedChildren={i18n.t`Light`}
+              checkedChildren={i18n._('Dark')}
+              unCheckedChildren={i18n._('Light')}
            />
          </div>
        )}
@@ -3,7 +3,7 @@ import PropTypes from 'prop-types'
 import classNames from 'classnames'
 import styles from './Loader.less'

-const Loader = ({ spinning = true, fullScreen }) => {
+const Loader = ({ spinning = false, fullScreen }) => {
  return (
    <div
      className={classNames(styles.loader, {
@@ -3,7 +3,9 @@ import FilterItem from './FilterItem'
 import DropOption from './DropOption'
 import Loader from './Loader'
 import ScrollBar from './ScrollBar'
+import GlobalFooter from './GlobalFooter'
+import Ellipsis from './Ellipsis'
 import * as MyLayout from './Layout/index.js'
 import Page from './Page'

-export { MyLayout, Editor, FilterItem, DropOption, Loader, Page, ScrollBar }
+export { MyLayout, Editor, GlobalFooter, Ellipsis, FilterItem, DropOption, Loader, Page, ScrollBar }
@@ -1,41 +0,0 @@
-import puppeteer from 'puppeteer'
-
-describe('Login', () => {
-  let browser
-  let page
-
-  beforeAll(async () => {
-    browser = await puppeteer.launch({ args: ['--no-sandbox'] })
-  })
-
-  beforeEach(async () => {
-    page = await browser.newPage()
-    await page.goto('http://localhost:8000/en/login', {
-      waitUntil: 'networkidle2',
-    })
-  })
-
-  afterEach(() => page.close())
-
-  it('should login with failure', async () => {
-    await page.waitFor(selector => !!document.querySelector('#username'), {
-      timeout: 3000,
-    })
-    await page.type('#username', 'wrong_user')
-    await page.type('#password', 'wrong_password')
-    await page.click('button[type="button"]')
-    await page.waitForSelector('.anticon-close-circle') // should display error
-  })
-
-  it('should login successfully', async () => {
-    await page.waitForSelector('#username', { timeout: 3000 })
-    await page.type('#username', 'admin')
-    await page.type('#password', 'admin')
-    await page.click('button[type="button"]')
-    await page.waitForSelector('.ant-layout-footer')
-    const text = await page.evaluate(() => document.body.innerHTML)
-    expect(text).toContain('Ant Design Admin')
-  })
-
-  afterAll(() => browser.close())
-})
@@ -0,0 +1,26 @@
+#!/usr/bin/env node
+const puppeteer = require('puppeteer-core');
+
+(async () => {
+  // Use CHROME_PATH env var if provided, otherwise default macOS Chrome path
+  const executablePath = process.env.CHROME_PATH || '/Applications/Google Chrome.app/Contents/MacOS/Google Chrome';
+  const url = process.env.E2E_URL || 'http://localhost:7000';
+
+  try {
+    const browser = await puppeteer.launch({
+      executablePath,
+      headless: true,
+      args: ['--no-sandbox', '--disable-setuid-sandbox'],
+    });
+    const page = await browser.newPage();
+    await page.goto(url, { waitUntil: 'networkidle2' });
+    const title = await page.title();
+    console.log('E2E: page title =>', title);
+    await browser.close();
+    if (!/antd-admin/i.test(title)) process.exit(1);
+    process.exit(0);
+  } catch (err) {
+    console.error('E2E error:', err);
+    process.exit(1);
+  }
+})();
@@ -1,12 +1,12 @@
 import React, { PureComponent, Fragment } from 'react'
 import PropTypes from 'prop-types'
-import { connect } from 'dva'
+import { connect } from 'umi'
 import { Helmet } from 'react-helmet'
 import { Loader } from 'components'
 import { queryLayout } from 'utils'
 import NProgress from 'nprogress'
 import config from 'utils/config'
-import withRouter from 'umi/withRouter'
+import { withRouter } from 'umi'

 import PublicLayout from './PublicLayout'
 import PrimaryLayout from './PrimaryLayout'
@@ -1,16 +1,15 @@
-/* global window */
-/* global document */
 import React, { PureComponent, Fragment } from 'react'
 import PropTypes from 'prop-types'
-import withRouter from 'umi/withRouter'
-import { connect } from 'dva'
-import { MyLayout } from 'components'
-import { BackTop, Layout, Drawer } from 'antd'
-import { GlobalFooter } from 'ant-design-pro'
+import { withRouter } from 'umi'
+import { connect } from 'umi'
+import { MyLayout, GlobalFooter } from 'components'
+import { Drawer, FloatButton, Layout } from 'antd';
 import { enquireScreen, unenquireScreen } from 'enquire-js'
-import { config, pathMatchRegexp, langFromPath } from 'utils'
+import { pathToRegexp } from 'path-to-regexp'
+import { config, getLocale } from 'utils'
 import Error from '../pages/404'
 import styles from './PrimaryLayout.less'
+import store from 'store'

 const { Content } = Layout
 const { Header, Bread, Sider } = MyLayout
@@ -46,32 +45,30 @@ class PrimaryLayout extends PureComponent {

  render() {
    const { app, location, dispatch, children } = this.props
-    const {
-      user,
-      theme,
-      routeList,
-      collapsed,
-      permissions,
-      notifications,
-    } = app
+    const { theme, collapsed, notifications } = app
+    const user = store.get('user') || {}
+    const permissions = store.get('permissions') || {}
+    const routeList = store.get('routeList') || []
    const { isMobile } = this.state
    const { onCollapseChange } = this

    // Localized route name.
+
+    const lang = getLocale()
    const newRouteList =
-      langFromPath(location.pathname) === 'zh'
+      lang !== 'en'
        ? routeList.map(item => {
-            const { zhName, ...other } = item
+            const { name, ...other } = item
            return {
              ...other,
-              name: zhName,
+              name: (item[lang] || {}).name || name,
            }
          })
        : routeList

    // Find a route that matches the pathname.
    const currentRoute = newRouteList.find(
-      _ => _.route && pathMatchRegexp(_.route, location.pathname)
+      _ => _.route && pathToRegexp(_.route).exec(location.pathname)
    )

    // Query whether you have permission to enter this page
@@ -113,17 +110,17 @@ class PrimaryLayout extends PureComponent {
    }

    return (
-      <Fragment>
+      (<Fragment>
        <Layout>
          {isMobile ? (
            <Drawer
-              maskClosable
+              mask={{ closable: true }}
              closable={false}
              onClose={onCollapseChange.bind(this, !collapsed)}
-              visible={!collapsed}
+              open={!collapsed}
              placement="left"
              width={200}
-              style={{
+              rootStyle={{
                padding: 0,
                height: '100vh',
              }}
@@ -143,9 +140,9 @@ class PrimaryLayout extends PureComponent {
              <Bread routeList={newRouteList} />
              {hasPermission ? children : <Error />}
            </Content>
-            <BackTop
+            <FloatButton.BackTop
              className={styles.backTop}
-              target={() => document.querySelector('#primaryLayout>div')}
+              target={() => document.querySelector('#primaryLayout')}
            />
            <GlobalFooter
              className={styles.footer}
@@ -153,8 +150,8 @@ class PrimaryLayout extends PureComponent {
            />
          </div>
        </Layout>
-      </Fragment>
-    )
+      </Fragment>)
+    );
  }
 }

@@ -1,3 +1,3 @@
-export default ({ children }) => {
-  return children
-}
+const PublicLayout = ({ children }) => children
+
+export default PublicLayout
@@ -1,73 +1,92 @@
 import React, { Component } from 'react'
-import withRouter from 'umi/withRouter'
-import { LocaleProvider } from 'antd'
+import { withRouter } from 'umi'
+import { ConfigProvider } from 'antd'
+import { i18n } from "@lingui/core"
 import { I18nProvider } from '@lingui/react'
-import { langFromPath, defaultLanguage } from 'utils'
-import zh_CN from 'antd/lib/locale-provider/zh_CN'
-import en_US from 'antd/lib/locale-provider/en_US'
+import { getLocale } from 'utils'
+import config from 'utils/config'
+import { zh, en, pt } from 'make-plural/plurals'
+import enMessages from '../locales/en/messages.json'
+import zhMessages from '../locales/zh/messages.json'
+import ptMessages from '../locales/pt-br/messages.json'
+import zhCN from 'antd/locale/zh_CN'
+import enUS from 'antd/locale/en_US'
+import ptBR from 'antd/locale/pt_BR'

 import BaseLayout from './BaseLayout'

-const languages = {
-  zh: zh_CN,
-  en: en_US,
+i18n.loadLocaleData({
+  en: { plurals: en },
+  zh: { plurals: zh },
+  'pt-br': { plurals: pt }
+})
+
+// Activate the default language synchronously so I18nProvider doesn't render `null` in dev.
+// Avoid activating the user-selected language here because its messages may not be loaded yet.
+const configuredDefault = (config && config.i18n && config.i18n.defaultLanguage) || 'en'
+const _catalogs = {
+  en: enMessages,
+  zh: zhMessages,
+  'pt-br': ptMessages,
 }
+try {
+  const initialCatalog = _catalogs[configuredDefault]
+  if (initialCatalog) {
+    i18n.load(configuredDefault, initialCatalog)
+  }
+  i18n.activate(configuredDefault)
+} catch (e) {
+  // ignore activation errors during bootstrap
+}
+
+// antd
+const languages = {
+  zh: zhCN,
+  en: enUS,
+  'pt-br': ptBR
+}
+
+// remove unused defaultLanguage

@withRouter
 class Layout extends Component {
  state = {
-    catalogs: {},
  }

-  language = defaultLanguage
-
  componentDidMount() {
-    const language = langFromPath(this.props.location.pathname)
-    this.language = language
-    this.loadCatalog(language)
+    let language = getLocale()
+    if (!languages[language]) language = configuredDefault
+    this.loadCatalog(language).catch(() => {})
  }

-  shouldComponentUpdate(nextProps, nextState) {
-    const language = langFromPath(nextProps.location.pathname)
-    const preLanguage = this.language
-    const { catalogs } = nextState
+  loadCatalog = async (lan) => {
+    const language = lan || i18n.defaultLanguage
+    try {
+      const catalogModule = await import(`../locales/${language}/messages.json`)
+      const catalog = catalogModule && catalogModule.default ? catalogModule.default : catalogModule

-    if (preLanguage !== language && !catalogs[language]) {
-      this.loadCatalog(language)
-      this.language = language
-      return false
+      i18n.load(language, catalog)
+      i18n.activate(language)
+    } catch (err) {
+      // If loading fails, fall back to default language and log a warning.
+      // eslint-disable-next-line no-console
+      console.warn(`Failed to load messages for locale "${language}":`, err)
    }
-    this.language = language
-
-    return true
-  }
-
-  loadCatalog = async language => {
-    const catalog = await import(/* webpackMode: "lazy", webpackChunkName: "i18n-[index]" */
-    `@lingui/loader!../locales/${language}/messages.json`)
-
-    this.setState(state => ({
-      catalogs: {
-        ...state.catalogs,
-        [language]: catalog,
-      },
-    }))
  }

  render() {
-    const { location, children } = this.props
-    const { catalogs } = this.state
+    const { children } = this.props

-    let language = langFromPath(location.pathname)
-    // If the language pack is not loaded or is loading, use the default language
-    if (!catalogs[language]) language = defaultLanguage
+    let language = getLocale()
+
+    if (!languages[language]) language = configuredDefault

    return (
-      <LocaleProvider locale={languages[language]}>
-        <I18nProvider language={language} catalogs={catalogs}>
+      <ConfigProvider locale={languages[language]}>
+        <I18nProvider i18n={i18n}>
          <BaseLayout>{children}</BaseLayout>
        </I18nProvider>
-      </LocaleProvider>
+      </ConfigProvider>
    )
  }
 }
@@ -1,4 +1,5 @@
 {
+  "Password": "Password",
  "/dashboard": "/dashboard",
  "Add Param": "Add Param",
  "Address": "Address",
@@ -26,7 +27,6 @@
  "Not Found": "Not Found",
  "Operation": "Operation",
  "Params": "Params",
-  "Password": "Password",
  "Phone": "Phone",
  "Pick an address": "Pick an address",
  "Please pick an address": "Please pick an address",
@@ -0,0 +1,54 @@
+{
+  "Password": "Senha",
+  "/dashboard": "/dashboard",
+  "Add Param": "Add Parametro",
+  "Address": "Endereço",
+  "Age": "Ano",
+  "Are you sure delete this record?": "Tem certeza de excluir este registro?",
+  "Author": "Autor",
+  "Avatar": "Avatar",
+  "Categories": "Categorias",
+  "Clear notifications": "limpar notificações",
+  "Comments": "Comentarios",
+  "Create": "Criar",
+  "Create User": "Criar Usuário",
+  "CreateTime": "CreateTime",
+  "Dark": "Escuro",
+  "Delete": "Deletar",
+  "Email": "Email",
+  "Female": "Feminino",
+  "Gender": "Genero",
+  "Hi,": "Olá,",
+  "Image": "Imagem",
+  "Light": "Claro",
+  "Male": "masculino",
+  "Name": "Nome",
+  "NickName": "NickName",
+  "Not Found": "Não Encontrado",
+  "Operation": "Operation",
+  "Params": "Parametros",
+  "Phone": "Fone",
+  "Pick an address": "Escolha um endereço",
+  "Please pick an address": "Por favor, escolha um endereço",
+  "Publised": "Publicado",
+  "Publish Date": "Data de publicação",
+  "Reset": "Reset",
+  "Search": "procurar",
+  "Search Name": "Search Name",
+  "Send": "Enviar",
+  "Sign in": "Sign in",
+  "Sign out": "Sign out",
+  "Switch Theme": "Trocar tema",
+  "Tags": "Tags",
+  "The input is not valid E-mail!": "Não é um E-mail valido!",
+  "The input is not valid phone!": "Não é um telefone Valido!",
+  "Title": "Titulo",
+  "Total {total} Items": "Total {total} Items",
+  "Unpublished": "Não publicado",
+  "Update": "Atualizar",
+  "Update User": "Atualizar Usuário",
+  "Username": "Usuário",
+  "Views": "visualizações",
+  "Visibility": "Visibilidade",
+  "You have viewed all notifications.": "Você visualizou todas as notificações."
+}
@@ -1,4 +1,5 @@
 {
+  "Password": "密码",
  "/dashboard": "/zh/dashboard",
  "Add Param": "添加参数",
  "Address": "地址",
@@ -26,7 +27,6 @@
  "Not Found": "未找到",
  "Operation": "操作",
  "Params": "参数",
-  "Password": "密码",
  "Phone": "电话",
  "Pick an address": "选择地址",
  "Please pick an address": "选择地址",
@@ -1,21 +1,26 @@
-/* global window */
-
-import { router } from 'utils'
+import { history } from 'umi'
 import { stringify } from 'qs'
 import store from 'store'
+import { pathToRegexp } from 'path-to-regexp'
 import { ROLE_TYPE } from 'utils/constant'
-import { queryLayout, pathMatchRegexp } from 'utils'
+import { queryLayout } from 'utils'
 import { CANCEL_REQUEST_MESSAGE } from 'utils/constant'
-import { queryRouteList, logoutUser, queryUserInfo } from 'api'
+import api from 'api'
 import config from 'config'

-export default {
+const { queryRouteList, logoutUser, queryUserInfo } = api
+
+const goDashboard = () => {
+  if (pathToRegexp(['/', '/login']).exec(window.location.pathname)) {
+    history.push({
+      pathname: '/dashboard',
+    })
+  }
+}
+
+const appModel = {
  namespace: 'app',
  state: {
-    user: {},
-    permissions: {
-      visit: [],
-    },
    routeList: [
      {
        id: '1',
@@ -41,6 +46,9 @@ export default {
    ],
  },
  subscriptions: {
+    setup({ dispatch }) {
+      dispatch({ type: 'query' })
+    },
    setupHistory({ dispatch, history }) {
      history.listen(location => {
        dispatch({
@@ -59,22 +67,23 @@ export default {

        cancelRequest.forEach((value, key) => {
          if (value.pathname !== window.location.pathname) {
-            value.cancel(CANCEL_REQUEST_MESSAGE)
+            value.abort(CANCEL_REQUEST_MESSAGE)
            cancelRequest.delete(key)
          }
        })
      })
    },
-
-    setup({ dispatch }) {
-      dispatch({ type: 'query' })
-    },
  },
  effects: {
    *query({ payload }, { call, put, select }) {
-      const { success, user } = yield call(queryUserInfo, payload)
+      // store isInit to prevent query trigger by refresh
+      const isInit = store.get('isInit')
+      if (isInit) {
+        goDashboard()
+        return
+      }
      const { locationPathname } = yield select(_ => _.app)
-
+      const { success, user } = yield call(queryUserInfo, payload)
      if (success && user) {
        const { list } = yield call(queryRouteList)
        const { permissions } = user
@@ -96,21 +105,13 @@ export default {
            return cases.every(_ => _)
          })
        }
-        yield put({
-          type: 'updateState',
-          payload: {
-            user,
-            permissions,
-            routeList,
-          },
-        })
-        if (pathMatchRegexp('/login', window.location.pathname)) {
-          router.push({
-            pathname: '/dashboard',
-          })
-        }
+        store.set('routeList', routeList)
+        store.set('permissions', permissions)
+        store.set('user', user)
+        store.set('isInit', true)
+        goDashboard()
      } else if (queryLayout(config.layouts, locationPathname) !== 'public') {
-        router.push({
+        history.push({
          pathname: '/login',
          search: stringify({
            from: locationPathname,
@@ -122,22 +123,10 @@ export default {
    *signOut({ payload }, { call, put }) {
      const data = yield call(logoutUser)
      if (data.success) {
-        yield put({
-          type: 'updateState',
-          payload: {
-            user: {},
-            permissions: { visit: [] },
-            menu: [
-              {
-                id: '1',
-                icon: 'laptop',
-                name: 'Dashboard',
-                zhName: '仪表盘',
-                router: '/dashboard',
-              },
-            ],
-          },
-        })
+        store.set('routeList', [])
+        store.set('permissions', { visit: [] })
+        store.set('user', {})
+        store.set('isInit', false)
        yield put({ type: 'query' })
      } else {
        throw data
@@ -167,3 +156,5 @@ export default {
    },
  },
 }
+
+export default appModel
@@ -1,12 +1,12 @@
 import React from 'react'
-import { Icon } from 'antd'
+import { FrownOutlined } from '@ant-design/icons'
 import { Page } from 'components'
 import styles from './404.less'

 const Error = () => (
  <Page inner>
    <div className={styles.error}>
-      <Icon type="frown-o" />
+      <FrownOutlined />
      <h1>404 Not Found</h1>
    </div>
  </Page>
@@ -1,27 +0,0 @@
-import React from 'react'
-import PropTypes from 'prop-types'
-import { ResponsiveContainer } from 'recharts'
-import styles from './Container.less'
-
-const Container = ({
-  children,
-  ratio = 5 / 2,
-  minHeight = 250,
-  maxHeight = 350,
-}) => (
-  <div className={styles.container} style={{ minHeight, maxHeight }}>
-    <div style={{ marginTop: `${100 / ratio}%` || '100%' }} />
-    <div className={styles.content} style={{ minHeight, maxHeight }}>
-      <ResponsiveContainer>{children}</ResponsiveContainer>
-    </div>
-  </div>
-)
-
-Container.propTypes = {
-  children: PropTypes.element.isRequired,
-  ratio: PropTypes.number,
-  minHeight: PropTypes.number,
-  maxHeight: PropTypes.number,
-}
-
-export default Container
@@ -1,20 +0,0 @@
-.container {
-  width: 100%;
-  position: relative;
-  display: inline-block;
-
-  :global {
-    .recharts-responsive-container {
-      width: e('calc(100% + 56px)') !important;
-      margin-left: -32px;
-    }
-  }
-}
-
-.content {
-  position: absolute;
-  left: 0;
-  right: 0;
-  top: 0;
-  bottom: 0;
-}
@@ -1,321 +0,0 @@
-import React from 'react'
-import ReactEcharts from 'echarts-for-react'
-
-require('echarts/map/js/china.js')
-
-const AirportCoordComponent = () => {
-  let geoCoordMap = {
-    上海: [121.4648, 31.2891],
-    东莞: [113.8953, 22.901],
-    东营: [118.7073, 37.5513],
-    中山: [113.4229, 22.478],
-    临汾: [111.4783, 36.1615],
-    临沂: [118.3118, 35.2936],
-    丹东: [124.541, 40.4242],
-    丽水: [119.5642, 28.1854],
-    乌鲁木齐: [87.9236, 43.5883],
-    佛山: [112.8955, 23.1097],
-    保定: [115.0488, 39.0948],
-    兰州: [103.5901, 36.3043],
-    包头: [110.3467, 41.4899],
-    北京: [116.4551, 40.2539],
-    北海: [109.314, 21.6211],
-    南京: [118.8062, 31.9208],
-    南宁: [108.479, 23.1152],
-    南昌: [116.0046, 28.6633],
-    南通: [121.1023, 32.1625],
-    厦门: [118.1689, 24.6478],
-    台州: [121.1353, 28.6688],
-    合肥: [117.29, 32.0581],
-    呼和浩特: [111.4124, 40.4901],
-    咸阳: [108.4131, 34.8706],
-    哈尔滨: [127.9688, 45.368],
-    唐山: [118.4766, 39.6826],
-    嘉兴: [120.9155, 30.6354],
-    大同: [113.7854, 39.8035],
-    大连: [122.2229, 39.4409],
-    天津: [117.4219, 39.4189],
-    太原: [112.3352, 37.9413],
-    威海: [121.9482, 37.1393],
-    宁波: [121.5967, 29.6466],
-    宝鸡: [107.1826, 34.3433],
-    宿迁: [118.5535, 33.7775],
-    常州: [119.4543, 31.5582],
-    广州: [113.5107, 23.2196],
-    廊坊: [116.521, 39.0509],
-    延安: [109.1052, 36.4252],
-    张家口: [115.1477, 40.8527],
-    徐州: [117.5208, 34.3268],
-    德州: [116.6858, 37.2107],
-    惠州: [114.6204, 23.1647],
-    成都: [103.9526, 30.7617],
-    扬州: [119.4653, 32.8162],
-    承德: [117.5757, 41.4075],
-    拉萨: [91.1865, 30.1465],
-    无锡: [120.3442, 31.5527],
-    日照: [119.2786, 35.5023],
-    昆明: [102.9199, 25.4663],
-    杭州: [119.5313, 29.8773],
-    枣庄: [117.323, 34.8926],
-    柳州: [109.3799, 24.9774],
-    株洲: [113.5327, 27.0319],
-    武汉: [114.3896, 30.6628],
-    汕头: [117.1692, 23.3405],
-    江门: [112.6318, 22.1484],
-    沈阳: [123.1238, 42.1216],
-    沧州: [116.8286, 38.2104],
-    河源: [114.917, 23.9722],
-    泉州: [118.3228, 25.1147],
-    泰安: [117.0264, 36.0516],
-    泰州: [120.0586, 32.5525],
-    济南: [117.1582, 36.8701],
-    济宁: [116.8286, 35.3375],
-    海口: [110.3893, 19.8516],
-    淄博: [118.0371, 36.6064],
-    淮安: [118.927, 33.4039],
-    深圳: [114.5435, 22.5439],
-    清远: [112.9175, 24.3292],
-    温州: [120.498, 27.8119],
-    渭南: [109.7864, 35.0299],
-    湖州: [119.8608, 30.7782],
-    湘潭: [112.5439, 27.7075],
-    滨州: [117.8174, 37.4963],
-    潍坊: [119.0918, 36.524],
-    烟台: [120.7397, 37.5128],
-    玉溪: [101.9312, 23.8898],
-    珠海: [113.7305, 22.1155],
-    盐城: [120.2234, 33.5577],
-    盘锦: [121.9482, 41.0449],
-    石家庄: [114.4995, 38.1006],
-    福州: [119.4543, 25.9222],
-    秦皇岛: [119.2126, 40.0232],
-    绍兴: [120.564, 29.7565],
-    聊城: [115.9167, 36.4032],
-    肇庆: [112.1265, 23.5822],
-    舟山: [122.2559, 30.2234],
-    苏州: [120.6519, 31.3989],
-    莱芜: [117.6526, 36.2714],
-    菏泽: [115.6201, 35.2057],
-    营口: [122.4316, 40.4297],
-    葫芦岛: [120.1575, 40.578],
-    衡水: [115.8838, 37.7161],
-    衢州: [118.6853, 28.8666],
-    西宁: [101.4038, 36.8207],
-    西安: [109.1162, 34.2004],
-    贵阳: [106.6992, 26.7682],
-    连云港: [119.1248, 34.552],
-    邢台: [114.8071, 37.2821],
-    邯郸: [114.4775, 36.535],
-    郑州: [113.4668, 34.6234],
-    鄂尔多斯: [108.9734, 39.2487],
-    重庆: [107.7539, 30.1904],
-    金华: [120.0037, 29.1028],
-    铜川: [109.0393, 35.1947],
-    银川: [106.3586, 38.1775],
-    镇江: [119.4763, 31.9702],
-    长春: [125.8154, 44.2584],
-    长沙: [113.0823, 28.2568],
-    长治: [112.8625, 36.4746],
-    阳泉: [113.4778, 38.0951],
-    青岛: [120.4651, 36.3373],
-    韶关: [113.7964, 24.7028],
-  }
-
-  let BJData = [
-    [{ name: '北京' }, { name: '上海', value: 95 }],
-    [{ name: '北京' }, { name: '广州', value: 90 }],
-    [{ name: '北京' }, { name: '大连', value: 80 }],
-    [{ name: '北京' }, { name: '南宁', value: 70 }],
-    [{ name: '北京' }, { name: '南昌', value: 60 }],
-    [{ name: '北京' }, { name: '拉萨', value: 50 }],
-    [{ name: '北京' }, { name: '长春', value: 40 }],
-    [{ name: '北京' }, { name: '包头', value: 30 }],
-    [{ name: '北京' }, { name: '重庆', value: 20 }],
-    [{ name: '北京' }, { name: '常州', value: 10 }],
-  ]
-
-  let SHData = [
-    [{ name: '上海' }, { name: '包头', value: 95 }],
-    [{ name: '上海' }, { name: '昆明', value: 90 }],
-    [{ name: '上海' }, { name: '广州', value: 80 }],
-    [{ name: '上海' }, { name: '郑州', value: 70 }],
-    [{ name: '上海' }, { name: '长春', value: 60 }],
-    [{ name: '上海' }, { name: '重庆', value: 50 }],
-    [{ name: '上海' }, { name: '长沙', value: 40 }],
-    [{ name: '上海' }, { name: '北京', value: 30 }],
-    [{ name: '上海' }, { name: '丹东', value: 20 }],
-    [{ name: '上海' }, { name: '大连', value: 10 }],
-  ]
-
-  let GZData = [
-    [{ name: '广州' }, { name: '福州', value: 95 }],
-    [{ name: '广州' }, { name: '太原', value: 90 }],
-    [{ name: '广州' }, { name: '长春', value: 80 }],
-    [{ name: '广州' }, { name: '重庆', value: 70 }],
-    [{ name: '广州' }, { name: '西安', value: 60 }],
-    [{ name: '广州' }, { name: '成都', value: 50 }],
-    [{ name: '广州' }, { name: '常州', value: 40 }],
-    [{ name: '广州' }, { name: '北京', value: 30 }],
-    [{ name: '广州' }, { name: '北海', value: 20 }],
-    [{ name: '广州' }, { name: '海口', value: 10 }],
-  ]
-
-  let planePath =
-    'path://M1705.06,1318.313v-89.254l-319.9-221.799l0.073-208.063c0.521-84.662-26.629-121.796-63.961-121.491c-37.332-0.305-64.482,36.829-63.961,121.491l0.073,208.063l-319.9,221.799v89.254l330.343-157.288l12.238,241.308l-134.449,92.931l0.531,42.034l175.125-42.917l175.125,42.917l0.531-42.034l-134.449-92.931l12.238-241.308L1705.06,1318.313z'
-
-  let convertData = function(data) {
-    let res = []
-    for (let i = 0; i < data.length; i += 1) {
-      let dataItem = data[i]
-      let fromCoord = geoCoordMap[dataItem[0].name]
-      let toCoord = geoCoordMap[dataItem[1].name]
-      if (fromCoord && toCoord) {
-        res.push({
-          fromName: dataItem[0].name,
-          toName: dataItem[1].name,
-          coords: [fromCoord, toCoord],
-        })
-      }
-    }
-    return res
-  }
-
-  let color = ['#a6c84c', '#ffa022', '#46bee9']
-  let series = []
-  ;[['北京', BJData], ['上海', SHData], ['广州', GZData]].forEach((item, i) => {
-    series.push(
-      {
-        name: `${item[0]} Top10`,
-        type: 'lines',
-        zlevel: 1,
-        effect: {
-          show: true,
-          period: 6,
-          trailLength: 0.7,
-          color: '#fff',
-          symbolSize: 3,
-        },
-        lineStyle: {
-          normal: {
-            color: color[i],
-            width: 0,
-            curveness: 0.2,
-          },
-        },
-        data: convertData(item[1]),
-      },
-      {
-        name: `${item[0]} Top10`,
-        type: 'lines',
-        zlevel: 2,
-        symbol: ['none', 'arrow'],
-        symbolSize: 10,
-        effect: {
-          show: true,
-          period: 6,
-          trailLength: 0,
-          symbol: planePath,
-          symbolSize: 15,
-        },
-        lineStyle: {
-          normal: {
-            color: color[i],
-            width: 1,
-            opacity: 0.6,
-            curveness: 0.2,
-          },
-        },
-        data: convertData(item[1]),
-      },
-      {
-        name: `${item[0]} Top10`,
-        type: 'effectScatter',
-        coordinateSystem: 'geo',
-        zlevel: 2,
-        rippleEffect: {
-          brushType: 'stroke',
-        },
-        label: {
-          normal: {
-            show: true,
-            position: 'right',
-            formatter: '{b}',
-          },
-        },
-        symbolSize(val) {
-          return val[2] / 8
-        },
-        itemStyle: {
-          normal: {
-            color: color[i],
-          },
-        },
-        data: item[1].map(dataItem => {
-          return {
-            name: dataItem[1].name,
-            value: geoCoordMap[dataItem[1].name].concat([dataItem[1].value]),
-          }
-        }),
-      }
-    )
-  })
-
-  let option = {
-    backgroundColor: '#404a59',
-    title: {
-      text: '模拟迁徙',
-      subtext: '数据纯属虚构',
-      left: 'center',
-      textStyle: {
-        color: '#fff',
-      },
-    },
-    tooltip: {
-      trigger: 'item',
-    },
-    legend: {
-      orient: 'vertical',
-      top: 'bottom',
-      left: 'right',
-      data: ['北京 Top10', '上海 Top10', '广州 Top10'],
-      textStyle: {
-        color: '#fff',
-      },
-      selectedMode: 'single',
-    },
-    geo: {
-      map: 'china',
-      label: {
-        emphasis: {
-          show: false,
-        },
-      },
-      roam: true,
-      itemStyle: {
-        normal: {
-          areaColor: '#323c48',
-          borderColor: '#404a59',
-        },
-        emphasis: {
-          areaColor: '#2a333d',
-        },
-      },
-    },
-    series,
-  }
-
-  return (
-    <div className="examples">
-      <div className="parent">
-        <label> render a airport chart. </label>
-        <ReactEcharts
-          option={option}
-          style={{ height: '700px', width: '100%' }}
-          className="react_for_echarts"
-        />
-      </div>
-    </div>
-  )
-}
-
-export default AirportCoordComponent
@@ -1,6 +1,6 @@
 import React from 'react'
 import ReactEcharts from 'echarts-for-react'
-import echarts from 'echarts'
+import * as echarts from 'echarts'

 const currentData = [
  [
@@ -88,8 +88,8 @@ const option = {
      symbolSize(data) {
        return Math.sqrt(data[2]) / 5e2
      },
-      label: {
-        emphasis: {
+      emphasis: {
+        label: {
          show: true,
          formatter(param) {
            return param.data[3]
@@ -98,21 +98,19 @@ const option = {
        },
      },
      itemStyle: {
-        normal: {
-          shadowBlur: 10,
-          shadowColor: 'rgba(120, 36, 50, 0.5)',
-          shadowOffsetY: 5,
-          color: new echarts.graphic.RadialGradient(0.4, 0.3, 1, [
-            {
-              offset: 0,
-              color: 'rgb(251, 118, 123)',
-            },
-            {
-              offset: 1,
-              color: 'rgb(204, 46, 72)',
-            },
-          ]),
-        },
+        shadowBlur: 10,
+        shadowColor: 'rgba(120, 36, 50, 0.5)',
+        shadowOffsetY: 5,
+        color: new echarts.graphic.RadialGradient(0.4, 0.3, 1, [
+          {
+            offset: 0,
+            color: 'rgb(251, 118, 123)',
+          },
+          {
+            offset: 1,
+            color: 'rgb(204, 46, 72)',
+          },
+        ]),
      },
    },
    {
@@ -122,8 +120,8 @@ const option = {
      symbolSize(data) {
        return Math.sqrt(data[2]) / 5e2
      },
-      label: {
-        emphasis: {
+      emphasis: {
+        label: {
          show: true,
          formatter(param) {
            return param.data[3]
@@ -132,21 +130,19 @@ const option = {
        },
      },
      itemStyle: {
-        normal: {
-          shadowBlur: 10,
-          shadowColor: 'rgba(25, 100, 150, 0.5)',
-          shadowOffsetY: 5,
-          color: new echarts.graphic.RadialGradient(0.4, 0.3, 1, [
-            {
-              offset: 0,
-              color: 'rgb(129, 227, 238)',
-            },
-            {
-              offset: 1,
-              color: 'rgb(25, 183, 207)',
-            },
-          ]),
-        },
+        shadowBlur: 10,
+        shadowColor: 'rgba(25, 100, 150, 0.5)',
+        shadowOffsetY: 5,
+        color: new echarts.graphic.RadialGradient(0.4, 0.3, 1, [
+          {
+            offset: 0,
+            color: 'rgb(129, 227, 238)',
+          },
+          {
+            offset: 1,
+            color: 'rgb(25, 183, 207)',
+          },
+        ]),
      },
    },
  ],
@@ -1,6 +1,6 @@
 import React from 'react'
 import ReactEcharts from 'echarts-for-react'
-import echarts from 'echarts'
+import * as echarts from 'echarts'

 const CalendarComponent = () => {
  const getVirtulData = year => {
@@ -29,23 +29,19 @@ class ChartAPIComponent extends React.Component {
          left: '10%',
          width: '80%',
          label: {
-            normal: {
-              formatter: '{b}预期',
-            },
-            emphasis: {
+            formatter: '{b}预期',
+          },
+          emphasis: {
+            label: {
              position: 'inside',
              formatter: '{b}预期: {c}%',
            },
          },
          labelLine: {
-            normal: {
-              show: false,
-            },
+            show: false,
          },
          itemStyle: {
-            normal: {
-              opacity: 0.7,
-            },
+            opacity: 0.7,
          },
          data: [
            { value: 60, name: '访问' },
@@ -62,24 +58,20 @@ class ChartAPIComponent extends React.Component {
          width: '80%',
          maxSize: '80%',
          label: {
-            normal: {
-              position: 'inside',
-              formatter: '{c}%',
-              textStyle: {
-                color: '#fff',
-              },
-            },
-            emphasis: {
+            position: 'inside',
+            formatter: '{c}%',
+            color: '#fff',
+          },
+          emphasis: {
+            label: {
              position: 'inside',
              formatter: '{b}实际: {c}%',
            },
          },
          itemStyle: {
-            normal: {
-              opacity: 0.5,
-              borderColor: '#fff',
-              borderWidth: 2,
-            },
+            opacity: 0.5,
+            borderColor: '#fff',
+            borderWidth: 2,
          },
          data: [
            { value: 30, name: '访问' },
@@ -29,13 +29,15 @@ class ChartShowLoadingComponent extends React.Component {
        },
        radar: {
          indicator: [
-            { name: '销售（sales）', max: 6500 },
+            { name: '销售（sales）', max: 7000 },
            { name: '管理（Administration）', max: 16000 },
            { name: '信息技术（Information Techology）', max: 30000 },
            { name: '客服（Customer Support）', max: 38000 },
            { name: '研发（Development）', max: 52000 },
            { name: '市场（Marketing）', max: 25000 },
          ],
+          splitNumber: 5,
+          alignTicks: false,
        },
        series: [
          {
@@ -3,14 +3,22 @@ import ReactEcharts from 'echarts-for-react'

 const ChartWithEventComponent = () => {
  const onChartReady = echart => {
-    /* eslint-disable */
-    console.log('echart is ready', echart)
+    if (process.env.NODE_ENV !== 'production') {
+      // eslint-disable-next-line no-console
+      console.log('echart is ready', echart)
+    }
  }
  const onChartLegendselectchanged = (param, echart) => {
-    console.log(param, echart)
+    if (process.env.NODE_ENV !== 'production') {
+      // eslint-disable-next-line no-console
+      console.log(param, echart)
+    }
  }
  const onChartClick = (param, echart) => {
-    console.log(param, echart)
+    if (process.env.NODE_ENV !== 'production') {
+      // eslint-disable-next-line no-console
+      console.log(param, echart)
+    }
  }
  const getOtion = () => {
    const option = {
@@ -41,8 +49,9 @@ const ChartWithEventComponent = () => {
            { value: 135, name: '视频广告' },
            { value: 1548, name: '搜索引擎' },
          ],
-          itemStyle: {
-            emphasis: {
+          itemStyle: {},
+          emphasis: {
+            itemStyle: {
              shadowBlur: 10,
              shadowOffsetX: 0,
              shadowColor: 'rgba(0, 0, 0, 0.5)',
@@ -4,6 +4,7 @@ import ReactEcharts from 'echarts-for-react'
 class DynamicChartComponent extends React.Component {
  constructor(props) {
    super(props)
+    this.echartsRef = React.createRef()
    this.timeTicket = null
    this.count = 51

@@ -99,6 +100,7 @@ class DynamicChartComponent extends React.Component {
          name: '价格',
          max: 20,
          min: 0,
+          alignTicks: false,
          boundaryGap: [0.2, 0.2],
        },
        {
@@ -107,6 +109,7 @@ class DynamicChartComponent extends React.Component {
          name: '预购量',
          max: 1200,
          min: 0,
+          alignTicks: false,
          boundaryGap: [0.2, 0.2],
        },
      ],
@@ -117,9 +120,7 @@ class DynamicChartComponent extends React.Component {
          xAxisIndex: 1,
          yAxisIndex: 1,
          itemStyle: {
-            normal: {
-              barBorderRadius: 4,
-            },
+            borderRadius: 4,
          },
          animationEasing: 'elasticOut',
          animationDelay(idx) {
@@ -193,17 +194,13 @@ class DynamicChartComponent extends React.Component {

  render() {
    let code =
-      "<ReactEcharts ref='echartsInstance' \n" +
+      "<ReactEcharts ref={this.echartsRef} \n" +
      '    option={this.state.option} />\n'
    return (
      <div className="examples">
        <div className="parent">
          <label> use React state to render dynamic chart</label>
-          <ReactEcharts
-            ref="echarts_react"
-            option={this.state.option}
-            style={{ height: 400 }}
-          />
+          <ReactEcharts ref={this.echartsRef} option={this.state.option} style={{ height: 400 }} />
          <label> code below: use state of react to render dynamic chart</label>
          <pre>
            <code>{code}</code>
@@ -7,10 +7,8 @@ import ThemeChartComponent from './ThemeChartComponent'
 import ChartShowLoadingComponent from './ChartShowLoadingComponent'
 import ChartAPIComponent from './ChartAPIComponent'
 import DynamicChartComponent from './DynamicChartComponent'
-import MapChartComponent from './MapChartComponent'

-// v1.2.0 add 7 demo.
-import AirportCoordComponent from './AirportCoordComponent'
+// removed MapChartComponent and AirportCoordComponent
 import CalendarComponent from './CalendarComponent'
 import GaugeComponent from './GaugeComponent'
 import GCalendarComponent from './GCalendarComponent'
@@ -28,8 +26,7 @@ const EchartsComponent = ({ type }) => {
  if (type === 'events') return <ChartWithEventComponent />
  if (type === 'theme') return <ThemeChartComponent />
  if (type === 'dynamic') return <DynamicChartComponent />
-  if (type === 'map') return <MapChartComponent />
-  if (type === 'airport') return <AirportCoordComponent />
+  // map and airport chart types removed
  if (type === 'graph') return <GraphComponent />
  if (type === 'calendar') return <CalendarComponent />
  if (type === 'treemap') return <TreemapComponent />
@@ -1,6 +1,6 @@
 import React from 'react'
 import ReactEcharts from 'echarts-for-react'
-import echarts from 'echarts'
+import * as echarts from 'echarts'

 const GCalendarComponent = () => {
  const getVirtulData = year => {
@@ -37,13 +37,10 @@ class GaugeComponent extends React.Component {
          },
          axisLabel: {
            // 坐标轴小标记
-            textStyle: {
-              // 属性lineStyle控制线条样式
-              fontWeight: 'bolder',
-              color: '#fff',
-              shadowColor: '#fff', // 默认透明
-              shadowBlur: 10,
-            },
+            fontWeight: 'bolder',
+            color: '#fff',
+            shadowColor: '#fff', // 默认透明
+            shadowBlur: 10,
          },
          axisTick: {
            // 坐标轴小标记
@@ -89,11 +86,9 @@ class GaugeComponent extends React.Component {
            shadowColor: '#fff', // 默认透明
            shadowBlur: 5,
            offsetCenter: [0, '50%'], // x, y，单位px
-            textStyle: {
-              // 其余属性默认使用全局文本样式，详见TEXTSTYLE
-              fontWeight: 'bolder',
-              color: '#fff',
-            },
+            // 其余属性默认使用全局文本样式，详见TEXTSTYLE
+            fontWeight: 'bolder',
+            color: '#fff',
          },
          data: [{ value: 40, name: 'km/h' }],
        },
@@ -118,13 +113,10 @@ class GaugeComponent extends React.Component {
          },
          axisLabel: {
            // 坐标轴小标记
-            textStyle: {
-              // 属性lineStyle控制线条样式
-              fontWeight: 'bolder',
-              color: '#fff',
-              shadowColor: '#fff', // 默认透明
-              shadowBlur: 10,
-            },
+            fontWeight: 'bolder',
+            color: '#fff',
+            shadowColor: '#fff', // 默认透明
+            shadowBlur: 10,
          },
          axisTick: {
            // 坐标轴小标记
@@ -172,11 +164,9 @@ class GaugeComponent extends React.Component {
            width: 80,
            height: 30,
            offsetCenter: [25, '20%'], // x, y，单位px
-            textStyle: {
-              // 其余属性默认使用全局文本样式，详见TEXTSTYLE
-              fontWeight: 'bolder',
-              color: '#fff',
-            },
+            // 其余属性默认使用全局文本样式，详见TEXTSTYLE
+            fontWeight: 'bolder',
+            color: '#fff',
          },
          data: [{ value: 1.5, name: 'x1000 r/min' }],
        },
@@ -211,13 +201,10 @@ class GaugeComponent extends React.Component {
            },
          },
          axisLabel: {
-            textStyle: {
-              // 属性lineStyle控制线条样式
-              fontWeight: 'bolder',
-              color: '#fff',
-              shadowColor: '#fff', // 默认透明
-              shadowBlur: 10,
-            },
+            fontWeight: 'bolder',
+            color: '#fff',
+            shadowColor: '#fff', // 默认透明
+            shadowBlur: 10,
            formatter(v) {
              switch (`${v}`) {
                case '0':
@@ -280,13 +267,10 @@ class GaugeComponent extends React.Component {
            show: false,
          },
          axisLabel: {
-            textStyle: {
-              // 属性lineStyle控制线条样式
-              fontWeight: 'bolder',
-              color: '#fff',
-              shadowColor: '#fff', // 默认透明
-              shadowBlur: 10,
-            },
+            fontWeight: 'bolder',
+            color: '#fff',
+            shadowColor: '#fff', // 默认透明
+            shadowBlur: 10,
            formatter(v) {
              switch (`${v}`) {
                case '0':
@@ -1325,10 +1325,8 @@ const GraphComponent = () => {
          layout: 'force',
          animation: false,
          label: {
-            normal: {
-              position: 'right',
-              formatter: '{b}',
-            },
+            position: 'right',
+            formatter: '{b}',
          },
          draggable: true,
          data: webkitDep.nodes.map((node, idx) => {
@@ -1,7 +1,7 @@
 import React from 'react'
 import ReactEcharts from 'echarts-for-react'
-
-require('echarts-liquidfill')
+import * as echarts from 'echarts'
+import 'echarts-liquidfill'

 const LiquidfillComponent = () => {
  const option = {
@@ -17,6 +17,7 @@ const LiquidfillComponent = () => {
      <div className="parent">
        <label>render a Liquidfill chart:</label>
        <ReactEcharts
+          echarts={echarts}
          option={option}
          style={{
            height: '400px',
@@ -1,6 +1,6 @@
 import React from 'react'
 import ReactEcharts from 'echarts-for-react'
-import echarts from 'echarts'
+import * as echarts from 'echarts'

 const LunarCalendarComponent = () => {
  const getOtion = () => {
@@ -430,16 +430,12 @@ const LunarCalendarComponent = () => {
          coordinateSystem: 'calendar',
          symbolSize: 1,
          label: {
-            normal: {
-              show: true,
-              formatter(params) {
-                let d = echarts.number.parseDate(params.value[0])
-                return `${d.getDate()}\n\n${params.value[2]}\n\n`
-              },
-              textStyle: {
-                color: '#000',
-              },
+            show: true,
+            formatter(params) {
+              let d = echarts.number.parseDate(params.value[0])
+              return `${d.getDate()}\n\n${params.value[2]}\n\n`
            },
+            color: '#000',
          },
          data: lunarData,
        },
@@ -448,17 +444,13 @@ const LunarCalendarComponent = () => {
          coordinateSystem: 'calendar',
          symbolSize: 1,
          label: {
-            normal: {
-              show: true,
-              formatter(params) {
-                return `\n\n\n${params.value[3] || ''}`
-              },
-              textStyle: {
-                fontSize: 14,
-                fontWeight: 700,
-                color: '#a00',
-              },
+            show: true,
+            formatter(params) {
+              return `\n\n\n${params.value[3] || ''}`
            },
+            fontSize: 14,
+            fontWeight: 700,
+            color: '#a00',
          },
          data: lunarData,
        },
@@ -1,6 +1,6 @@
 import React from 'react'
 import AdSense from 'react-adsense'
-import { Link } from 'react-router'
+import { Link } from 'umi'
 import DynamicChartComponent from './DynamicChartComponent.js'

 const MainPageComponent = () => {
@@ -1,209 +0,0 @@
-import React from 'react'
-import ReactEcharts from 'echarts-for-react'
-
-require('echarts/map/js/china.js')
-
-class MapChartComponent extends React.Component {
-  constructor() {
-    super()
-    this.timeTicket = null
-    const randomData = () => {
-      return Math.round(Math.random() * 1000)
-    }
-    const option = {
-      title: {
-        text: 'iphone销量',
-        subtext: '纯属虚构',
-        left: 'center',
-      },
-      tooltip: {
-        trigger: 'item',
-      },
-      legend: {
-        orient: 'vertical',
-        left: 'left',
-        data: ['iphone3', 'iphone4', 'iphone5'],
-      },
-      visualMap: {
-        min: 0,
-        max: 2500,
-        left: 'left',
-        top: 'bottom',
-        text: ['高', '低'], // 文本，默认为数值文本
-        calculable: true,
-      },
-      toolbox: {
-        show: true,
-        orient: 'vertical',
-        left: 'right',
-        top: 'center',
-        feature: {
-          dataView: { readOnly: false },
-          restore: {},
-          saveAsImage: {},
-        },
-      },
-      series: [
-        {
-          name: 'iphone3',
-          type: 'map',
-          mapType: 'china',
-          roam: false,
-          label: {
-            normal: {
-              show: true,
-            },
-            emphasis: {
-              show: true,
-            },
-          },
-          data: [
-            { name: '北京', value: randomData() },
-            { name: '天津', value: randomData() },
-            { name: '上海', value: randomData() },
-            { name: '重庆', value: randomData() },
-            { name: '河北', value: randomData() },
-            { name: '河南', value: randomData() },
-            { name: '云南', value: randomData() },
-            { name: '辽宁', value: randomData() },
-            { name: '黑龙江', value: randomData() },
-            { name: '湖南', value: randomData() },
-            { name: '安徽', value: randomData() },
-            { name: '山东', value: randomData() },
-            { name: '新疆', value: randomData() },
-            { name: '江苏', value: randomData() },
-            { name: '浙江', value: randomData() },
-            { name: '江西', value: randomData() },
-            { name: '湖北', value: randomData() },
-            { name: '广西', value: randomData() },
-            { name: '甘肃', value: randomData() },
-            { name: '山西', value: randomData() },
-            { name: '内蒙古', value: randomData() },
-            { name: '陕西', value: randomData() },
-            { name: '吉林', value: randomData() },
-            { name: '福建', value: randomData() },
-            { name: '贵州', value: randomData() },
-            { name: '广东', value: randomData() },
-            { name: '青海', value: randomData() },
-            { name: '西藏', value: randomData() },
-            { name: '四川', value: randomData() },
-            { name: '宁夏', value: randomData() },
-            { name: '海南', value: randomData() },
-            { name: '台湾', value: randomData() },
-            { name: '香港', value: randomData() },
-            { name: '澳门', value: randomData() },
-          ],
-        },
-        {
-          name: 'iphone4',
-          type: 'map',
-          mapType: 'china',
-          label: {
-            normal: {
-              show: true,
-            },
-            emphasis: {
-              show: true,
-            },
-          },
-          data: [
-            { name: '北京', value: randomData() },
-            { name: '天津', value: randomData() },
-            { name: '上海', value: randomData() },
-            { name: '重庆', value: randomData() },
-            { name: '河北', value: randomData() },
-            { name: '安徽', value: randomData() },
-            { name: '新疆', value: randomData() },
-            { name: '浙江', value: randomData() },
-            { name: '江西', value: randomData() },
-            { name: '山西', value: randomData() },
-            { name: '内蒙古', value: randomData() },
-            { name: '吉林', value: randomData() },
-            { name: '福建', value: randomData() },
-            { name: '广东', value: randomData() },
-            { name: '西藏', value: randomData() },
-            { name: '四川', value: randomData() },
-            { name: '宁夏', value: randomData() },
-            { name: '香港', value: randomData() },
-            { name: '澳门', value: randomData() },
-          ],
-        },
-        {
-          name: 'iphone5',
-          type: 'map',
-          mapType: 'china',
-          label: {
-            normal: {
-              show: true,
-            },
-            emphasis: {
-              show: true,
-            },
-          },
-          data: [
-            { name: '北京', value: randomData() },
-            { name: '天津', value: randomData() },
-            { name: '上海', value: randomData() },
-            { name: '广东', value: randomData() },
-            { name: '台湾', value: randomData() },
-            { name: '香港', value: randomData() },
-            { name: '澳门', value: randomData() },
-          ],
-        },
-      ],
-    }
-    this.state = {
-      option,
-    }
-  }
-
-  componentDidMount() {
-    if (this.timeTicket) {
-      clearInterval(this.timeTicket)
-    }
-    this.timeTicket = setInterval(() => {
-      const { option } = this.state
-      const r = new Date().getSeconds()
-      option.title.text = `iphone销量${r}`
-      option.series[0].name = `iphone销量${r}`
-      option.legend.data[0] = `iphone销量${r}`
-      this.setState({ option })
-    }, 1000)
-  }
-
-  componentWillUnmount() {
-    if (this.timeTicket) {
-      clearInterval(this.timeTicket)
-    }
-  }
-
-  render() {
-    let code =
-      "require('echarts/map/js/china.js'); \n" +
-      '<ReactEcharts \n' +
-      '    option={this.state.option || {}} \n' +
-      "    style={{height: '350px', width: '100%'}}  \n" +
-      "    className='react_for_echarts' />"
-    return (
-      <div className="examples">
-        <div className="parent">
-          <label>
-            {' '}
-            render a china map. <strong>MAP charts</strong>:{' '}
-          </label>
-          <ReactEcharts
-            option={this.state.option}
-            style={{ height: '500px', width: '100%' }}
-            className="react_for_echarts"
-          />
-          <label> code below: </label>
-          <pre>
-            <code>{code}</code>
-          </pre>
-        </div>
-      </div>
-    )
-  }
-}
-
-export default MapChartComponent
@@ -41,21 +41,21 @@ const SimpleChartComponent = () => {
        name: '邮件营销',
        type: 'line',
        stack: '总量',
-        areaStyle: { normal: {} },
+        areaStyle: {},
        data: [120, 132, 101, 134, 90, 230, 210],
      },
      {
        name: '联盟广告',
        type: 'line',
        stack: '总量',
-        areaStyle: { normal: {} },
+        areaStyle: {},
        data: [220, 182, 191, 234, 290, 330, 310],
      },
      {
        name: '视频广告',
        type: 'line',
        stack: '总量',
-        areaStyle: { normal: {} },
+        areaStyle: {},
        data: [150, 232, 201, 154, 190, 330, 410],
      },
    ],
@@ -1,7 +1,7 @@
 import React from 'react'
 import ReactEcharts from 'echarts-for-react'

-import echarts from 'echarts'
+import * as echarts from 'echarts'

 const ThemeChartComponent = () => {
  const option = {
@@ -52,12 +52,12 @@ const ThemeChartComponent = () => {
        type: 'bar',
        stack: '总量',
        itemStyle: {
-          normal: {
-            barBorderColor: 'rgba(0,0,0,0)',
-            color: 'rgba(0,0,0,0)',
-          },
-          emphasis: {
-            barBorderColor: 'rgba(0,0,0,0)',
+          borderColor: 'rgba(0,0,0,0)',
+          color: 'rgba(0,0,0,0)',
+        },
+        emphasis: {
+          itemStyle: {
+            borderColor: 'rgba(0,0,0,0)',
            color: 'rgba(0,0,0,0)',
          },
        },
@@ -68,10 +68,8 @@ const ThemeChartComponent = () => {
        type: 'bar',
        stack: '总量',
        label: {
-          normal: {
-            show: true,
-            position: 'top',
-          },
+          show: true,
+          position: 'top',
        },
        data: [900, 345, 393, '-', '-', 135, 178, 286, '-', '-', '-'],
      },
@@ -80,10 +78,8 @@ const ThemeChartComponent = () => {
        type: 'bar',
        stack: '总量',
        label: {
-          normal: {
-            show: true,
-            position: 'bottom',
-          },
+          show: true,
+          position: 'bottom',
        },
        data: ['-', '-', '-', 108, 154, '-', '-', '-', 119, 361, 203],
      },
@@ -264,10 +264,8 @@ const option = {

      label: {
        show: false,
-        textStyle: {
-          fontSize: 16,
-          borderWidth: 1,
-        },
+        fontSize: 16,
+        borderWidth: 1,
      },

      itemStyle: {
@@ -276,10 +274,8 @@ const option = {

      emphasis: {
        label: {
-          textStyle: {
-            fontSize: 20,
-            color: '#900',
-          },
+          fontSize: 20,
+          color: '#900',
        },
        itemStyle: {
          color: '#900',
@@ -1,6 +1,6 @@
 import React from 'react'
 import ReactEcharts from 'echarts-for-react'
-import echarts from 'echarts'
+import * as echarts from 'echarts'

 const TreemapComponent = () => {
  let diskData = [
@@ -190,26 +190,20 @@ const TreemapComponent = () => {
    return [
      {
        itemStyle: {
-          normal: {
-            borderWidth: 0,
-            gapWidth: 5,
-          },
+          borderWidth: 0,
+          gapWidth: 5,
        },
      },
      {
        itemStyle: {
-          normal: {
-            gapWidth: 1,
-          },
+          gapWidth: 1,
        },
      },
      {
        colorSaturation: [0.35, 0.5],
        itemStyle: {
-          normal: {
-            gapWidth: 1,
-            borderColorSaturation: 0.6,
-          },
+          gapWidth: 1,
+          borderColorSaturation: 0.6,
        },
      },
    ]
@@ -248,9 +242,7 @@ const TreemapComponent = () => {
          formatter: '{b}',
        },
        itemStyle: {
-          normal: {
-            borderColor: '#fff',
-          },
+          borderColor: '#fff',
        },
        levels: getLevelOption(),
        data: diskData,
@@ -31,14 +31,6 @@ const chartList = [
    label: 'DynamicChart',
    value: 'dynamic',
  },
-  {
-    label: 'MapChart',
-    value: 'map',
-  },
-  {
-    label: 'AirportCoord',
-    value: 'airport',
-  },
  {
    label: 'Graph',
    value: 'graph',
@@ -101,7 +93,7 @@ class Chart extends React.Component {
        <div className={styles.chart}>
          <EchartsComponent type={this.state.type} />
        </div>
-        <div style={{ pading: 24, marginTop: 24 }}>
+        <div style={{ padding: 24, marginTop: 24 }}>
          All demos from{' '}
          <a href="https://github.com/hustcc/echarts-for-react">
            https://github.com/hustcc/echarts-for-react
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
baorong	9989aa4de5	bump version: 5.5.0	2026-02-19 22:06:42 +08:00
baorong	f983533d59	chore dep: use puppeteer-core because npm install easy to fail	2026-02-19 22:03:32 +08:00
baorong	2182759d47	chore dep: little mistake	2026-02-19 21:43:23 +08:00
baorong	4d1851ddd2	chore deps: upgrade axios to 1.x	2026-02-19 21:30:25 +08:00
baorong	0d82eca735	chore lint: code sth.	2026-02-19 21:28:07 +08:00
baorong	cfb6b271ee	chore code: clear some warnings and remove MapChart & AirportCoord	2026-02-19 21:19:40 +08:00
baorong	0b97964457	fix i18n: lingui not work	2026-02-18 19:28:50 +08:00
baorong	edfbfcf5db	chore(code): adapt code to antd v6	2026-02-18 19:28:00 +08:00
baorong	e5172432df	chore dep: use highcharts-react-official	2026-02-18 19:04:53 +08:00
baorong	741b04f120	chore deps: upgrade lingui to v5	2026-02-18 15:53:34 +08:00
baorong	83f2cc1344	chore dep: upgrade antd v6	2026-02-13 17:56:40 +08:00
baorong	152556d582	chore dep: upgrade to lingui v4	2026-02-13 17:39:53 +08:00
Baorong Li	67fc31a008	Merge pull request #1165 from baocang/codex/find-and-fix-two-bugs fix: correct typos in build config and demo	2025-05-29 22:23:18 +08:00
Baocang Nie	23eace8350	fix: correct typos in build config and demo	2025-05-28 11:13:32 +08:00
Baorong	93817e4840	fix: dep mis with pnpm	2024-04-13 12:50:58 +08:00
Baorong	bb97d982e4	fix: npm run start not work #1152	2024-04-13 12:49:16 +08:00
Baorong Li	700f58015d	Merge pull request #1156 from XyanZhang/master fix: clicking on the sidebar collapse button results in a blank screen.	2023-06-14 15:17:56 +08:00
XyanZhang	872ce3a825	fix: can't scroll when the media is mobile	2023-06-14 14:47:06 +08:00
XyanZhang	385b31e7bb	fix: clicking on the sidebar collapse button results in a blank screen.	2023-06-14 14:16:33 +08:00
Baorong Li	3d66a616ff	chore readme: change documentation url	2023-02-21 10:36:16 +08:00
superlbr	b7e18a1214	fix locale: change locale filepath due to antd5 #1146	2023-01-22 20:44:28 +08:00
Baorong Li	3b0bae9c70	chore umirc: set antd to false since v5	2022-12-22 10:14:27 +08:00
Baorong Li	8b9343a320	Merge pull request #1142 from vagusX/feat/upgrade-antd-v5 feat: upgrade antd v5	2022-11-27 17:32:40 +08:00
vagusx	8618c75459	feat: replace moment to dayjs	2022-11-27 16:29:42 +08:00
vagusx	711d2077e2	feat: import BackTop from FloatButton	2022-11-27 16:17:07 +08:00
vagusx	b25646b033	feat: rename modal open	2022-11-27 15:54:25 +08:00
vagusx	02bf7784b1	feat: upgrade antd v5	2022-11-26 22:15:15 +08:00
Baorong Li	c164d60643	Merge pull request #1132 from SuperRay3/master fix: 修复 antd 组件无法国际化的问题	2022-05-23 15:59:15 +08:00
leijialiang	1bd4cfe73c	fix: 修复 antd 组件无法国际化的问题	2022-05-23 14:43:09 +08:00
superlbr	f4e1eeb21c	fix login: form mis password	2021-12-24 15:19:15 +08:00
superlbr	4b5fe62014	fix i18n: t not work use Trans instead	2021-12-23 20:09:35 +08:00
superlbr	36c2be61ae	chore readme: add account/password desc.	2021-11-16 16:08:26 +08:00
superlbr	e9206a9448	fix dev: loading chunk mf-dep_async failed	2021-08-03 18:31:03 +08:00
superlbr	0bf28879c4	chore umi: enable mfsu	2021-08-03 17:47:27 +08:00
superlbr	7c936712b9	fix dev: #1108 #1109	2021-07-15 08:15:51 +08:00
Baorong Li	e32a19fe3b	chore dep: normal	2021-03-26 22:22:33 +08:00
Baorong Li	c6382c6221	chore umi: use default targets no ie support	2021-03-26 22:20:53 +08:00
Baorong Li	02280fbed9	Merge pull request #1091 from jaywhen/patch-1 fix garbled characters in README-zh_CN.md	2021-03-17 17:46:29 +08:00
zainchen	d897eb205d	fix: adding babel preset to fixing extract command	2021-03-17 17:44:38 +08:00
Baorong Li	b1f290ea32	upgrade dep: echarts@5.x	2021-03-17 17:28:05 +08:00
Baorong Li	0e36b6b7a0	fix utils: remove params to close #1067 in request	2021-03-17 17:03:14 +08:00
Baorong Li	d92f121cf4	upgrade lingui: 3.x	2021-03-17 16:50:49 +08:00
Xiang Jaywhen	0a73ba0f12	fix garbled characters in README-zh_CN.md	2021-02-19 23:19:51 +08:00
Baorong Li	9e4e0efbab	Merge pull request #1082 from AmagiDDmxh/master Fix en layout doc typo, same as before #1081	2020-12-21 23:27:57 -06:00
amagiddmxh	524dff07d2	Fix en layout doc typo	2020-12-21 16:05:47 +08:00
Baorong Li	8b3e5c08f7	Merge pull request #1081 from AmagiDDmxh/master There were some type in the API-config doc, https://doc.antd-admin.zuiidea.com/#/API-configuration	2020-12-21 00:23:22 -06:00
amagiddmxh	c17444f5d6	Fix API config uppercase typo	2020-12-21 12:55:26 +08:00
Baorong Li	df85ecdfff	Merge pull request #1080 from karlhorky/patch-1 Fix typo	2020-12-15 08:24:21 -06:00
Karl Horky	b8824141d6	Fix typo	2020-12-15 15:21:29 +01:00
Karl Horky	aedd2ec3db	Fix typo	2020-12-15 15:20:49 +01:00
zuiidea	5abad21082	✨ Optimization Split Chunks, Antd Icon, CI.	2020-08-20 14:16:32 +08:00
Baorong Li	1ae41c7ae5	Merge pull request #1060 from mlboy/patch-1 Update README.md	2020-06-03 14:46:44 +08:00
mlboy	e41671dbf9	Update README.md 调整antd版本	2020-05-13 07:42:01 +08:00
Baorong Li	eaeb9092e4	bump antd-admin@5.3.0	2020-05-10 21:05:23 +08:00
Baorong Li	2f3ca0a006	Merge branch 'develop'	2020-05-10 21:04:40 +08:00
Baorong Li	1b65351be4	upgrade umi@3 fin.	2020-03-24 15:17:57 +08:00
Baorong Li	0422f6d51e	upgrade umi@3 partly	2020-03-24 12:12:20 +08:00
Baorong Li	8d050d4040	fix pathToRegexp not work	2020-03-20 11:59:04 +08:00
zuiidea	82b3a4b384	⚡️ Exclude node_modules by babel-loader.	2020-03-19 22:26:55 +08:00
Baorong Li	d2f391a881	upgrade umi@3 partly	2020-03-19 17:06:31 +08:00
Baorong Li	9e778487d9	upgrade umi@3 partly	2020-03-19 12:50:12 +08:00
Baorong Li	7938d71f2f	upgrade umi@3 partly	2020-03-19 00:05:44 +08:00
Baorong Li	422a6fed30	upgrade umi@3 partly	2020-03-18 16:17:25 +08:00
Baorong Li	c6ea0454b3	upgrade umi@3 partly	2020-03-15 08:24:05 +08:00
Baorong Li	467767a6c5	upgrade umi@3 partly	2020-03-05 23:22:02 +08:00
Baorong Li	cf795c512a	bump antd-admin@5.2.0	2020-03-05 20:21:22 +08:00
Baorong Li	18b499030d	upgrade antd@4.0.0	2020-02-29 22:47:45 +08:00
zuiidea	d800d6f3ce	Merge branch 'master' into develop	2020-01-08 09:31:45 +08:00
zuiidea	185f706107	💚 Fixing now config.	2020-01-07 17:17:57 +08:00
zuiidea	5a4661cdad	Merge branch 'develop' of https://github.com/zuiidea/antd-admin into develop	2020-01-07 16:02:51 +08:00
zuiidea	7abdd94a0e	🚀 Optimize deployment configuration.	2020-01-07 16:02:33 +08:00
Baorong Li	22f0684ab0	chore: docs normal	2020-01-07 15:58:48 +08:00
Baorong Li	80b2c63693	Merge pull request #1040 from vagusX/feat/migrate-antd-v4 feat: migrate to antd v4	2019-12-02 22:07:08 -06:00
vagusX	4b2a553bda	feat: add antd v4 dependencies	2019-12-03 10:19:54 +08:00
vagusX	ad30e73b10	feat: migrate to antd v4	2019-12-03 09:58:49 +08:00
Baorong Li	15b62e302d	bump antd-admin@5.1.3	2019-10-22 10:38:52 +08:00
Baorong Li	9d5ec20f20	Merge branch 'develop'	2019-10-22 10:37:43 +08:00
Baorong Li	c878425fd0	upgrade antd@3.24.x	2019-10-22 10:30:04 +08:00
Baorong Li	90e80dda64	Merge pull request #1022 from rioarray/feature/inline-conditional-rendering inline conditional rendering in some components	2019-10-17 16:32:30 +08:00
rioarray	1db5bfeab5	inline conditional rendering in some components	2019-10-17 14:45:30 +07:00
zuiidea	b2b3fcd4a3	✨ Support disable i18n.	2019-10-09 20:20:11 +08:00
Baorong Li	9cf97375c7	fix 404 when path = '/'	2019-08-01 23:12:42 +08:00
Baorong Li	7839b6affb	Merge pull request #1007 from Louis-7/master [fix] add notification popup to #primaryLayout instead of #layoutHeader	2019-07-25 08:26:35 -05:00
Louis	597064a07d	[fix] add notification popup to #primaryLayout instead of #layoutHeader	2019-07-25 11:47:32 +08:00
Baorong Li	0ea57d14c9	fix #980 cannot read property 'map' of null	2019-07-07 23:01:20 +08:00
Baorong Li	afd736d615	bump antd-admin@5.1.2	2019-07-07 22:48:34 +08:00
Baorong Li	ce9b8c376f	Merge pull request #996 from tuantvk/master 🐛 fix bug sub menu Charts when collapsed	2019-07-07 08:03:31 -05:00
tuantv	79776e6752	🐛 fix bug sub menu Charts when collapsed	2019-07-07 11:56:52 +07:00
zuiidea	a2432022a1	✨ Updating manifest logo and adding portugal flag image.	2019-07-02 17:47:16 +08:00
zuiidea	ea5ee96bdc	🎨 Improving format of the code.	2019-07-06 11:02:56 +08:00
zuiidea	fe954092a4	🐛 Fixing dva history.listen multiple triggers.	2019-07-06 10:50:50 +08:00
zuiidea	5e148fec92	Merge branch 'develop' of https://github.com/zuiidea/antd-admin into develop	2019-07-06 09:43:30 +08:00
Baorong Li	5daa2a9548	add moment locale setting	2019-07-05 22:26:29 +08:00
Baorong Li	f1913f7b18	add pt_BR locale-provider in layout	2019-07-05 22:16:54 +08:00
zuiidea	65a453553e	✨ Updating mock avatar image.	2019-07-05 19:52:37 +08:00
Baorong Li	29da8f24da	Merge pull request #989 from tuantvk/master 🐛 fix remove and update user error handleRefresh	2019-06-29 09:57:46 -05:00
tuantv	3443ad9968	🐛 fix edit and update user error handleRefresh	2019-06-29 21:19:57 +07:00
Baorong Li	838dc93eff	bump antd-admin@5.1.1	2019-06-29 10:56:03 +08:00
Baorong Li	07ef68ec1f	Merge remote-tracking branch 'origin/develop'	2019-06-29 10:54:10 +08:00
Baorong Li	3cb7f86086	fix login jump to /enundefined	2019-06-29 10:49:11 +08:00
Baorong Li	fc9565c157	add a flag to detect refresh saving query times in model/app.js	2019-06-24 20:50:09 +08:00
Baorong Li	557f6022f3	bump antd-admin@5.1.0	2019-06-24 16:05:28 +08:00
Baorong Li	d0a56169e3	revert dispatch query in model/app.js	2019-06-24 15:40:44 +08:00
Baorong Li	f7d6e2b4ed	Merge pull request #984 from lovemegowin/master refactor user,menu,permission storage strategy	2019-06-24 15:26:06 +08:00
lovemegowin	df82ee42fd	fix #985 , close #985	2019-06-24 15:20:25 +08:00
lovemegowin	a29d761483	refactor user, menu, permission storage strategy then make full loader unnecessary	2019-06-21 15:26:06 +08:00
lovemegowin	713a86b9d6	add null point assert	2019-06-21 15:23:19 +08:00
lovemegowin	d6250f16b0	fullScreen loader is not always necessary refactor default spinning to false	2019-06-21 14:12:15 +08:00
Baorong Li	1c5d5c3788	upgrade umi@2.8.x	2019-06-20 16:31:00 +08:00
Baorong Li	699e9d9ff1	fix warning inlineCollapsed not control Menu under Sider	2019-06-04 15:47:35 +08:00
Baorong Li	fad0cb931a	use options instead of option in react-perfect-scrollbar	2019-06-04 15:34:45 +08:00
Baorong Li	5d7ff55869	upgrade dependency	2019-06-04 15:09:51 +08:00
Baorong Li	642ccb5b82	Merge pull request #975 from deepred5/master fix: 关闭弹窗时有动画效果	2019-05-27 23:59:48 -05:00
深红	51a7ce0827	update: 关闭弹窗时销毁子元素，保证initialValue更新并且关闭弹窗时有动画效果	2019-05-28 10:27:27 +08:00
Baorong Li	157a54b11d	Merge pull request #969 from ccyanxyz/patch-1 fix markdown code block in docs/layout.md	2019-05-04 18:32:34 -05:00
cyan	be083d81fc	fix markdown code block	2019-05-05 00:38:43 +08:00
zuiidea	f6c869ad47	Merge pull request #965 from zuiidea/develop ✏️ Fixing typos, exlude => exclude.	2019-04-18 10:10:14 +08:00
zuiidea	bef5b26509	✏️ Fixing typos, exlude => exclude.	2019-04-18 09:58:16 +08:00
Baorong Li	59cfe24178	Merge branch 'develop' # Conflicts: # package.json	2019-04-10 07:27:25 +08:00
Baorong Li	87d0d58ae8	Merge commit '0ac4839e948f7b1d34c90d33f4ece483bd9d2f48'	2019-04-10 07:24:20 +08:00
Baorong Li	de8b6c972d	bump antd-admin@5.0.6	2019-04-10 07:24:06 +08:00
Baorong Li	0ac4839e94	upgrade umi@2.6.x	2019-04-10 07:22:53 +08:00
Baorong Li	565bce6d8b	refix #958 by reset form in componentDidUpdate	2019-04-05 09:02:25 +08:00
Baorong Li	b278b028cf	fix #958 redux form initialValues not updating with state	2019-04-04 16:45:28 +08:00
Baorong Li	33abd9369e	fix #957 an flaw ignored	2019-03-19 10:59:37 +08:00
Baorong Li	e6b2f7f271	fix #950 modify z-index in header	2019-03-13 16:59:12 +08:00
Baorong Li	0bd1e9cf59	fix #947 misspelled word cancel	2019-03-06 12:11:42 +08:00
Baorong Li	693625bf2c	bump antd-admin@5.0.5	2019-03-05 16:23:16 +08:00
Baorong Li	3a6c587569	upgrade antd@3.14	2019-03-05 16:17:12 +08:00
Baorong Li	bd85eaf0a0	fix less is not a command in prettier	2019-03-05 16:15:33 +08:00
Baorong Li	29aa0f416e	fix Cannot read property 'addEventListener' of null #946	2019-03-05 16:15:02 +08:00
Baorong Li	5b32607911	bump antd-admin@5.0.4	2019-02-19 22:00:36 +08:00
Baorong Li	76e5359752	upgrade umi@2.5.0	2019-02-19 21:46:01 +08:00
Baorong Li	5ec4efbb6e	reset default lang to en	2019-02-07 09:19:39 +08:00
Baorong Li	f8bb7b421a	remove description about support IE9/IE10 that not working well	2019-02-07 08:52:40 +08:00
Baorong Li	887c169aa8	upgrade and lock antd@3.13.0	2019-02-07 08:36:53 +08:00
Baorong Li	8c10dcc6c2	Merge pull request #939 from rrfaria/feature/pt-br added pt-br language and some improvements to language control to route mocks	2019-02-07 08:08:01 +08:00
Rafael Faria	671da6b5fa	added pt-br and some improvements to language control	2019-02-06 14:39:02 -02:00
Baorong Li	7fdb2f4ea8	bump antd-admin@5.0.3	2019-01-11 18:43:48 +08:00
Baorong Li	67388b31f5	enable umi treeShaking	2019-01-11 18:40:39 +08:00
Baorong Li	2379cca765	upgrade umi@2.4.0 & antd@3.12.x	2019-01-11 18:39:19 +08:00
Baorong Li	34be6651e5	fix #935 root path / will be not found after login	2019-01-10 17:36:23 +08:00
Baorong Li	10f8e3e8ef	fix mix require / module.exports and import / export #934	2019-01-08 23:30:18 +08:00
Baorong Li	0c6ea8eb5c	fix cannot read property 'hash' of undefined by turn off hardSource	2019-01-08 22:56:23 +08:00
Baorong Li	6e69b06e61	Publish antd-admin@5.0.2	2018-12-28 14:01:51 +08:00
Baorong Li	98ba383a68	upgrade umi@2.3 antd@3.11	2018-12-28 11:42:44 +08:00
Baorong Li	4e6d81a9bf	Merge pull request #928 from luckcoding/fix-bread-link fix bread route has no matching lang	2018-12-13 22:35:56 +08:00
Baorong Li	0e2c206023	Merge branch 'develop' into fix-bread-link	2018-12-13 22:35:47 +08:00
luckcoding	285f06d1e7	fix bread route has no matching lang	2018-12-13 16:57:49 +08:00
Baorong Li	d03787a871	Publish antd-admin@5.0.1	2018-12-12 13:48:34 +08:00
zuiidea	6aead03f3e	🐛 Fix style error when menu is collapsed.	2018-12-12 11:35:44 +08:00
Baorong Li	0949a298c9	fix #924 404 Not Found after router change	2018-12-12 06:53:26 +08:00
Baorong Li	94c8e2168f	fix #926 createUser api in services	2018-12-12 06:17:30 +08:00
Baorong Li	358134f417	fallback umi to 2.2.8 to fix #923	2018-12-09 23:07:16 +08:00
Baorong Li	7eb9e06452	upgrade antd@3.10.9, umi@2.3.0-beta.3	2018-12-01 11:29:09 +08:00
zuiidea	fab06d5005	fix: 🐛 CI fails when pull request	2018-11-29 10:00:11 +08:00
Baorong Li	7483572b1d	Merge pull request #921 from francolaiuppa/patch-1 Mini typo fixes for English docs, Configuration section.	2018-11-29 09:45:38 +08:00
Franco Laiuppa	d1ce8e0739	Mini typo fixes Hi! Great project! I was reading the docs and noticed some typos regarding the layout names and the `exclude` parameter, so I've decided to fix it. I'm new to this repo so I hope this is a valid edit if not please let me know and I'll change it. Thanks!	2018-11-28 16:53:25 +01:00
zuiidea	16860f93ad	Merge pull request #920 from alexxyzeng/alex fix: show vertical centered modal in ie	2018-11-28 10:18:22 +08:00
xiayao	6ba45d5bc3	fix: show vertical centered modal in ie	2018-11-28 00:44:21 +08:00
zuiidea	f230429ddd	Merge branch 'develop' of https://github.com/zuiidea/antd-admin into develop	2018-11-21 10:36:51 +08:00
zuiidea	78c3b6d597	📝 Add some comments image to document.	2018-11-20 21:30:22 +08:00
Baorong Li	cdbc2782ff	chore: remove beta tag in version from package.json	2018-11-20 17:50:20 +08:00
zuiidea	108aca99b9	📝 Add documentation for Add Layout.	2018-11-18 23:08:12 +08:00
Baorong Li	7dd5dfb1bf	fix: icons' format not right in manifest.json	2018-11-15 14:11:47 +08:00
zuiidea	ee7a0fffc2	⚡ Update manifest.json.	2018-11-15 00:11:17 +08:00
zuiidea	6999871860	📝 Add documentation for Add Luanguage.	2018-11-14 23:46:59 +08:00
zuiidea	6742207c77	🐛 Fix cannot translate fields with variables.	2018-11-14 22:44:46 +08:00
Baorong Li	d71c29ee2e	feat: enable pwa	2018-11-14 13:37:34 +08:00
zuiidea	6917d6b89a	Merge branch 'develop' of https://github.com/zuiidea/antd-admin into develop	2018-11-12 23:31:11 +08:00
zuiidea	c3f369f0b3	📝 Add documentation for API configuration.	2018-11-12 23:30:56 +08:00
Baorong Li	01abc5ca38	upgrade antd@3.10.5	2018-11-10 09:50:20 +08:00
Baorong Li	08a348090c	upgrade umi@2.3.0-beta.1	2018-11-09 23:16:42 +08:00
Baorong Li	63b1ecf79f	Upgrade umi@2.2.5	2018-11-09 11:26:19 +08:00
Baorong Li	efe7e74375	fix #913 handleMenuClick is not defined	2018-11-07 16:23:36 +08:00
Baorong Li	6d552d22d9	add doc about custom http header #829	2018-11-05 11:23:43 +08:00