Name
Last commit
Last update
.vscode Loading commit data...
docs Loading commit data...
internals Loading commit data...
patches Loading commit data...
public Loading commit data...
server Loading commit data...
src Loading commit data...
.editorconfig Loading commit data...
.env Loading commit data...
.eslintrc.js Loading commit data...
.gitattributes Loading commit data...
.gitignore Loading commit data...
.gitlab-ci.yml Loading commit data...
.nvmrc Loading commit data...
.prettierignore Loading commit data...
.prettierrc Loading commit data...
.stylelintrc Loading commit data...
.travis.yml Loading commit data...
.umirc.ts Loading commit data...
CHANGELOG.md Loading commit data...
LICENSE.md Loading commit data...
README.md Loading commit data...
appveyor.yml Loading commit data...
babel.config.js Loading commit data...
commitlint.config.js Loading commit data...
jest.config.js Loading commit data...
package.json Loading commit data...
patch-package Loading commit data...

Quick start

git clone https://g.civnet.cn:8443/test/maintenance.git

npm install

npm start

提交代码

提交代码时有提交信息校验,形式为 [type]: message, typefix, style, perf, merge, feat等,不按这个格式将无法提交

git commit -m 'fix: 修复了一个bug'

代码格式化

代码风格规范校验,需要在提交前处理好代码格式,否则将无法提交

一般设置保存自动启用prettier格式化,这样就不需要手动修复代码格式:

// settings.json
+     "editor.codeActionsOnSave": {
+        "source.fixAll": true,
+      },

环境变量

目前支持的变量有 PROXY, HOST, PORT

修改.env文件的PROXY值为你要代理的服务器地址,要带上协议,多个代理之间用分号分开,详见.env 本地使用可以新建.env.local文件,这个文件不会提交, 本地开发时优先于.env

权限控制

权限主要由 @/components/Authorized组件控制,使用时引用@/utils/authority.js导出的组件。 用法如下:

<Router basename={BASENAME}>
    <Authozed
        noMatch={
        <UserLayout>
            <UserLogin />
        </UserLayout>
        }
        authority={[AUTHORITY.LOGIN]}
    >
        <Switch>{renderRoutes(routesConfig.routes)}</Switch>
    </Authozed>
</Router>

如果用户有LOGIN权限时,则展示url匹配的路由页面,否则跳转到登录页.

用户的权限是在登录时调用setAuthority存储到一个对象中的,详见登录页,setAuthority

路由配置

路由配置详见routes/config.js

若要隐藏配置路由可以加上 hideMenu 设为true:

export default {
  routes: [
    {
      path: '/user',
      component: UserLayout,
      hideMenu: true,
      routes: [
        {
          name: 'login',
          path: '/user/login',
          component: Login,
        },
      ],
    },
  ]
}

authority属性用来进行权限控制,除了常见的路由配置属性,其他属性将作为props被传递到组件内部

redux

引入appConnector包裹一下自己的组件,即可获取redux里面的值,包括userMode,token

常见组件封装

  1. 图片库
  2. 人员/角色选择器
  3. 展开控制树
  4. 基础表单