Quick start

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

npm install

npm start

提交代码

提交代码时有提交信息校验，形式为 [type]: message, type有fix, 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. 基础表单