feat: enable mfsu

docs/README.md

@@ -17,6 +17,8 @@ features:
     details: 便捷的动态主题切换功能，让你的应用从此绚丽多彩
   - title: 打包
     details: 内置 `.zip`、`docker` 镜像两种打包风格，让你的业务推动更顺滑
+  - title: mfsu 开启
+    details: 默认开启 `mfsu` ，编译速度飙升，耗时仅为不开启时的 1/20 ~ 1/5。
 footer: MIT Licensed | Copyright © 2020-present Howard.Zuo
 ---
 

generators/app/templates/config/config.prod.ts

@@ -1,6 +1,6 @@
 import { defineConfig } from 'umi'
 
 export default defineConfig({
-  dynamicImport: {},
   forkTSChecker: {}
+  mfsu: false
 })

generators/app/templates/config/config.ts

@@ -10,5 +10,7 @@ export default defineConfig({
     antd: true,
     title: true
   },
-  webpack5: {}
+  webpack5: {},
+  dynamicImport: {},
+  mfsu: {}
 })

generators/app/templates/mock/_utils/LdapService.ts

@@ -1,5 +1,4 @@
 import { Request } from 'umi'
-import faker from 'faker'
 import ResponseError from './ResponseError'
 
 export const FAKE_ADMIN_TOKEN = 'oijhdvkdsiiopwejr3209jds'
@@ -40,27 +39,6 @@ interface ILdapUser {
 }
 
 class LdapService {
-  searchUsersByName(name: string): Promise<ILdapUser[]> {
-    return new Promise(resolve => {
-      setTimeout(() => {
-        resolve(
-          [faker.random.number(), faker.random.number(), faker.random.number()].map(n => {
-            const card = faker.helpers.contextualCard()
-            return {
-              id: n,
-              name: card.name,
-              email: card.email,
-              team: faker.commerce.department(),
-              phone: card.phone,
-              avatar: card.avatar,
-              permissions: []
-            } as ILdapUser
-          })
-        )
-      }, 500)
-    })
-  }
-
   async getCurrentUser(req: Request): Promise<ILdapUser> {
     const token = req.get('Authorization')
     if (FAKE_ADMIN_TOKEN === token) {

generators/app/templates/mock/users.ts

@@ -2,7 +2,6 @@ import { Request, Response } from 'umi'
 import { success, failure, SHOW_TYPE } from './_utils/helper'
 import ResponseError from './_utils/ResponseError'
 import UserStore, { UserStatus, IRawUser } from './_utils/UserStore'
-import LdapService from './_utils/LdapService'
 
 export default {
   'get /apis/users': async function(req: Request, res: Response) {
@@ -24,23 +23,6 @@ export default {
     return res.json(success(users))
   },
 
-  'get /apis/ldapusers': async function(req: Request, res: Response) {
-    const { name } = req.query
-
-    const ldapUsers = await LdapService.searchUsersByName(name as string)
-
-    return res.json(
-      success(
-        ldapUsers.map(l => ({
-          name: l.name,
-          email: l.email,
-          team: l.team,
-          status: UserStatus.INITIAL
-        }))
-      )
-    )
-  },
-
   'post /apis/users': async function(req: Request, res: Response) {
     const { name, team, status, email } = req.body
 

generators/app/templates/package.json.vm

@@ -17,29 +17,27 @@
     "*.{j,t}s?(x)": "eslint --max-warnings=0 --ignore-pattern=public/**/*"
   },
   "devDependencies": {
-    "@commitlint/cli": "^12.0.1",
-    "@commitlint/config-conventional": "^12.0.1",
-    "@types/classnames": "^2.2.11",
-    "@types/faker": "^5.1.7",
-    "@types/jest": "^26.0.20",
-    "@types/js-cookie": "^2.2.6",
-    "@umijs/plugin-access": "^2.3.3",
-    "@umijs/plugin-antd": "^0.9.1",
-    "@umijs/plugin-initial-state": "^2.3.0",
-    "@umijs/plugin-locale": "^0.10.9",
-    "@umijs/plugin-model": "^2.5.6",
-    "@umijs/plugin-request": "^2.5.2",
-    "@umijs/test": "^3.4.0",
-    "faker": "^5.4.0",
-    "husky": "^5.1.3",
-    "lint-staged": "^10.5.4",
+    "@commitlint/cli": "^12.1.4",
+    "@commitlint/config-conventional": "^12.1.4",
+    "@types/classnames": "^2.3.1",
+    "@types/jest": "^26.0.24",
+    "@types/js-cookie": "^2.2.7",
+    "@umijs/plugin-access": "^2.4.2",
+    "@umijs/plugin-antd": "^0.10.0",
+    "@umijs/plugin-initial-state": "^2.3.1",
+    "@umijs/plugin-locale": "^0.13.0",
+    "@umijs/plugin-model": "^2.6.1",
+    "@umijs/plugin-request": "^2.6.0",
+    "@umijs/test": "^3.5.7",
+    "husky": "^7.0.1",
+    "lint-staged": "^11.0.0",
     "react-coding-style": "^1.3.1",
-    "umi": "^3.4.0",
+    "umi": "^3.5.7",
     "umi-plugin-dynamic-antd-theme": "^3.1.0"
   },
   "dependencies": {
-    "ahooks": "^2.9.6",
-    "classnames": "^2.2.6",
+    "ahooks": "^2.10.7",
+    "classnames": "^2.3.1",
     "js-cookie": "^2.2.1"
   }
 }

generators/app/templates/src/components/index.tsx

@@ -4,4 +4,3 @@ export { default as MenuFoldButton } from './buttons/MenuFoldButton'
 export { default as Exception403 } from './exception/403'
 export { default as Exception404 } from './exception/404'
 export { default as Exception500 } from './exception/500'
-export { default as LdapUserSelect } from './selector/LdapUserSelect'

generators/app/templates/src/layouts/options/ProLayout/Navbar/navbar.less

@@ -16,7 +16,7 @@
 }
 
 .navigationBar {
-  background-color: #fff;
+  background-color: #fff !important;
   padding: 0 24px;
 
   h1 {

generators/app/templates/src/locales/en-US.ts

@@ -33,13 +33,19 @@ export default {
 
   // profile
   PROFILE_TITLE: 'User Profile',
-  ADD_USER_BTN: 'Import User',
-  ADD_USER: 'Import User',
+  ADD_USER_BTN: 'New User',
+  ADD_USER: 'New User',
   MODIFY_USER: 'Modify User',
   SEARCH_USER: 'Search for user',
   CONFIRM_BTN: 'Confirm',
   CANCEL_BTN: 'Cancel',
-  SELECT_USER_WARNING: 'Please choose a user to import',
+  USER_NAME_REQUIRED: 'Please enter the user name',
+  TEAM_REQUIRED: 'Please enter the team',
+  EMAIL_REQUIRED: 'Please enter the email',
+  STATUS_REQUIRED: 'Please select a status',
+  NAME_MAX_LEN: 'The name cannot exceed 20 characters',
+  TEAM_MAX_LEN: 'The team cannot exceed 10 characters',
+  EMAIL_MAX_LEN: 'The email cannot exceed 30 characters',
   NAME: 'Name',
   TEAM: 'Team',
   EMAIL: 'Email',

generators/app/templates/src/locales/zh-CN.ts

@@ -33,13 +33,19 @@ export default {
 
   // profile
   PROFILE_TITLE: '个人信息',
-  ADD_USER_BTN: '导入用户',
-  ADD_USER: '导入用户',
+  ADD_USER_BTN: '新增用户',
+  ADD_USER: '新增用户',
   MODIFY_USER: '修改用户',
   SEARCH_USER: '搜索用户',
   CONFIRM_BTN: '确认',
   CANCEL_BTN: '取消',
-  SELECT_USER_WARNING: '请选择一个要导入的用户',
+  USER_NAME_REQUIRED: '请输入用户名',
+  TEAM_REQUIRED: '请输入团队',
+  EMAIL_REQUIRED: '请输入邮件',
+  STATUS_REQUIRED: '请选择状态',
+  NAME_MAX_LEN: '用户名长度不能超过20个字符',
+  TEAM_MAX_LEN: '团队长度不能超过10个字符',
+  EMAIL_MAX_LEN: '邮箱长度不能超过30个字符',
   NAME: '用户名',
   TEAM: '团队',
   EMAIL: '邮箱',

generators/app/templates/src/models/useUserManagementModel.ts

@@ -51,7 +51,7 @@ export default function useUserManagementModel() {
       }, query)
     }
 
-    if (isNotEmpty<IAntdTableSorter>(sorter)) {
+    if (isNotEmpty<IAntdTableSorter>(sorter) && isNotEmpty<string>(sorter.field) && isNotEmpty<string>(sorter.order)) {
       query = `${query}&sortField=${sorter.field}&sortOrder=${sorter.order}`
     }
 

generators/app/templates/src/pages/admin/users/components/UserManagePanel.tsx

@@ -2,7 +2,6 @@ import React, { useState, useCallback, useEffect } from 'react'
 import { FormattedMessage, useModel, useIntl } from 'umi'
 import { Popover, Form, Input, Button, Radio } from 'antd'
 import { UserOutlined, TeamOutlined, MailOutlined } from '@ant-design/icons'
-import { LdapUserSelect } from '@/components'
 import { isEmpty, pick } from '@/helpers'
 import { IUser } from '@/types'
 
@@ -14,7 +13,6 @@ interface IUserManagePanelProps {
 
 export default function UserManagePanel({ children, onFinished, value }: IUserManagePanelProps) {
   const [visible, setVisible] = useState(false)
-  const [formFilled, setFormFilled] = useState(false)
   const { formatMessage } = useIntl()
   const [form] = Form.useForm()
   const { addUser, addUserRunning, updateUser, updateUserRunning } = useModel('useUserManagementModel', m =>
@@ -33,9 +31,8 @@ export default function UserManagePanel({ children, onFinished, value }: IUserMa
       team: undefined,
       status: undefined
     })
-    setFormFilled(false)
     setVisible(false)
-  }, [form, setVisible, setFormFilled])
+  }, [form, setVisible])
 
   useEffect(() => {
     if (!isEmpty(value) && visible) {
@@ -57,33 +54,38 @@ export default function UserManagePanel({ children, onFinished, value }: IUserMa
               .then(onFinished)
           }}
         >
-          <LdapUserSelect
-            style={{ width: '100%', marginBottom: 25 }}
-            disabled={!isImportPanel}
-            onChange={u => {
-              form.setFieldsValue({
-                name: u.name,
-                email: u.email,
-                team: u.team,
-                status: u.status
-              })
-              setFormFilled(true)
-            }}
-          />
           <Form.Item name="id" hidden>
             <Input type="text" />
           </Form.Item>
-          <Form.Item name="name" rules={[{ required: true, message: formatMessage({ id: 'SELECT_USER_WARNING' }) }]}>
-            <Input disabled prefix={<UserOutlined />} placeholder={formatMessage({ id: 'NAME' })} />
+          <Form.Item
+            name="name"
+            rules={[
+              { required: true, message: formatMessage({ id: 'USER_NAME_REQUIRED' }) },
+              { max: 20, message: formatMessage({ id: 'NAME_MAX_LEN' }) }
+            ]}
+          >
+            <Input prefix={<UserOutlined />} placeholder={formatMessage({ id: 'NAME' })} />
           </Form.Item>
-          <Form.Item name="team">
-            <Input disabled prefix={<TeamOutlined />} placeholder={formatMessage({ id: 'TEAM' })} />
+          <Form.Item
+            name="team"
+            rules={[
+              { required: true, message: formatMessage({ id: 'TEAM_REQUIRED' }) },
+              { max: 10, message: formatMessage({ id: 'TEAM_MAX_LEN' }) }
+            ]}
+          >
+            <Input prefix={<TeamOutlined />} placeholder={formatMessage({ id: 'TEAM' })} />
           </Form.Item>
-          <Form.Item name="email">
-            <Input disabled prefix={<MailOutlined />} placeholder={formatMessage({ id: 'EMAIL' })} />
+          <Form.Item
+            name="email"
+            rules={[
+              { required: true, message: formatMessage({ id: 'EMAIL_REQUIRED' }) },
+              { max: 30, message: formatMessage({ id: 'EMAIL_MAX_LEN' }) }
+            ]}
+          >
+            <Input prefix={<MailOutlined />} placeholder={formatMessage({ id: 'EMAIL' })} />
           </Form.Item>
-          <Form.Item name="status">
-            <Radio.Group disabled={isImportPanel ? !formFilled : false}>
+          <Form.Item name="status" rules={[{ required: true, message: formatMessage({ id: 'STATUS_REQUIRED' }) }]}>
+            <Radio.Group>
               <Radio value="INITIAL">
                 <FormattedMessage id="INITIAL" />
               </Radio>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "generator-umi",
-  "version": "4.6.1",
+  "version": "4.7.0",
   "description": "umi project generator",
   "scripts": {
     "docs:dev": "vuepress dev docs",
@@ -26,9 +26,9 @@
   },
   "homepage": "https://github.com/DFocusGroup/generator-umi#readme",
   "devDependencies": {
-    "@vuepress/plugin-medium-zoom": "^1.6.0",
-    "@vuepress/plugin-pwa": "^1.5.4",
-    "gh-pages": "^3.1.0",
-    "vuepress": "^1.5.4"
+    "@vuepress/plugin-medium-zoom": "^1.8.2",
+    "@vuepress/plugin-pwa": "^1.8.2",
+    "gh-pages": "^3.2.3",
+    "vuepress": "^1.8.2"
   }
 }