## 介绍
  项目名称：百川信公共应用服务平台（v5的前端项目）
  原代码是saas_web项目抽离出来，走的接口分别是驻勤管理（找小林或者小综），v5接口

## 软件架构
  本项目为react[https://react.docschina.org/]项目，使用dva[https://dvajs.com/]作为数据流管理方案,使用3x版本的Ant Design[https://3x.ant.design/docs/react/introduce-cn] UI库进行开发---是saas_web项目的修改项目

### 目录结构
```
.
├── .editorconfig             # 编缉器ide 规则配置
├── .eslintrc                 # 代码规则 ESLint
├── .gitignore                # git 忽略文件
├── .istanbul.yml             # 
├── .npmrc                    # 
├── README.md                 # 介绍文件.
├── dist                      # 生成生产环境文件
├── package.json              # Package 库配置文件
├── src                       # 资源代码
│   ├── actions               # Flux/Redux 的 actions 方法
│   ├── components            # React components 组件
│   ├── constants             # redux 常量文件
│   ├── containers            # 每个页面的入口文件
│   ├── favicon.ico           # favicon
│   ├── index.ejs             # Template 模板页面
│   ├── index.js              # 应用入口文件
│   ├── reducers              # Redux reducers. 状态改变方法
│   ├── store                 # Redux store 
│   ├── public                # CSS Styles, js, img 等静态文件目录
│   └── utils                 # 常用框.
├── tools                     # build 配置
│   ├── build.js              # Runs the production build
│   ├── chalkConfig.js        # 错语信息美化
│   ├── distServer.js         # 生产环境服务器
│   ├── nodeVersionCheck.js   # 确认node版本是否支持
│   ├── srcServer.js          # 开发环境服务器
│   ├── startMessage.js       # 开是运行时显示的信息
├── webpack.config.dev.js     # webpack 开发环境配置文件
└── webpack.config.prod.js    # webpack 生产环境配置文件
```

## 安装教程
  1、下载项目
    git clone https://codehub.devcloud.huaweicloud.com/Front_chenyueqin00001/Front-v5-web.git
  2、下载项目依赖
    npm install 或者使用 yarn 安装
  3、本地运行开发环境
    npm start
  4、打包项目上线
    运行npm run build 打包好的dist文件夹为需要上线的静态资源
  5、项目chunk分析
    运行npm run analyze 以后会打开一个分析页面，分析每个chunk的大小


## 使用说明
  1、发布到测试环境
    1)直接将代码提交到git仓库（不需要本地自己构建代码，由服务器构建）
    2)打开jenkins页面[http://jenkins.test.bcxin.com.cn/jenkins/view/other/job/BCX-pasp-web/]配置好项目的版本号
    3)点击jenkins页面上的【立即构建】按钮，等待构建完成
    4)打开测试环境[http://attendsweb.test.baibaodun.cn/]对代码进行验证
  2、发布到生产环境
    1)提交审批单，等待审批通过后运维构建
    2)等待构建完成，打开生产环境[]对代码进行校验

    ## 项目部署问题：
    1、前端history路由模式相关代码使用tomcat部署需要特殊配置
    2、运维的配置文件需加：
      ../conf/web.xml
      增加以下内容：
      <web-app>
          ... ...
          ... ...
          <error-page>
              <error-code>404</error-code>
              <location>/index.html</location>
          </error-page>
      </web-app>
    3、该项目是用tomcat部署，没有使用node


## 项目命名规范
****命名规范
  1、组件文件命的命名使用大驼峰的命名方式  例子-->支付状态组件:PayStatus.js
  2、非组件文件使用小驼峰命名方式  例子-->支付模块功能:pay.js
  3、utils中的自定义的方法使用$命名  例子-->自定义的弹窗方法： $modal();
  4、接口命名使用普通的小驼峰，和后端对应名字即可  例子-->获取薪资代发记录汇总： selectGrantDetailTotalMap();
  5、第三方的方法直接引用  例子-->antd的Modal： Modal.info();
  6、组件中的方法使用"_"开头代表方法属于私有的  例子-->点击事件： _clickHandler;
  7、页面组件中如果是初始化数据的方法使用"__"开头代表方法属于私有的  例子-->初始化获取用户信息： __getUserInfo();
  8、"_"和"__"都代表内部的私有方法，为了更好找到初始化页面的一些方法，但是不做细致的区分，如果在不确定使用那种命名方式的时候都使用"_"作为命名方式
****css
  1、自己定义的样式类名使用"_"区分单词  例子-->订单详情样式： className="order_detail"