文件目录规范
# 文件目录
```
├── public
│ ├──js 静态 js 文件
│ │ ├── axios.min.js
│ │ └── ...
│ └──faceconfig.js 入口配置文件
├── src 源码目录
│ ├── api 入口js文件
│ │ ├── BaseApi.js 全局api
│ │ └── LoginApi.js 其他api
│ ├── components 公共组件目录
│ │ └── SvgIcon.vue
│ ├── assets 资源目录
│ │ ├── img 静态图片
│ │ │ └── logo.png
│ │ ├── iconfonts iconfont上的图标
│ │ └── icons svg图片icon
│ │ └── svg
│ ├── js 公共组件目录
│ │ ├── AESUtils.js aes加密，用于登录页
│ │ ├── gmCrypt.js sm4 加密
│ │ ├── axios.js 请求封装
│ │ ├── Https.js 请求封装
│ │ ├── CommonDictionary.js 公共本地字典表
│ │ ├── ValidateRule.js 公共校验规则
│ │ └── Utils.js 公用方法类
│ ├── mixins 混入
│ │ ├── BaseMixins.js 全局混入
│ │ └── PageMixins.js 部分功能模块混入
│ ├── router 前端路由
│ │ ├── index.js
│ │ └── Accept.js 功能模块路由
│ ├── store 应用级数据（state）
│ │ ├── index.js
│ │ └── modules
│ │ ├── Base.js 基础全局状态
│ │ └── Accept.js 功能模块状态
│ ├── theme
│ │ └── Default 主题文件
│ │ ├── Root.less ant-design 主题属性 && 自定义属性
│ │ ├── Base.less 通用class 样式
│ │ └── Style.less 自定义class
│ └── views 页面目录
│ └── Index
│ ├── Index.vue
│ ├── part
│ ├── js
│ └── components
```
## 接口：api
```
├── api 入口js文件
│ ├── BaseApi.js 全局api
│ └── LoginApi.js 其他api
```
1. `BaseApi.js` 为全局api，存放字典，区划等公用api请求
2. 其他api，均需要以模块划分，一个模块使用一个api
3. 命名规范：==模块名Api.js，首字母大写==，eg：LoginApi.js, SystemApi.js
## 组件：components
```
├── components 公共组件目录
│ └── SvgIcon.vue
```
1. 主要存放全局可通用组件
2. 命名规范：==模块名.vue，首字母大写==
3. 在template文件中引用时，使用`<svg-icon />`小写形式，
## 资源：assets
```
├── assets 资源目录
│ ├── img 静态图片
│ │ └── logo.png
│ ├── iconfonts iconfont上的图标
│ └── icons svg图片icon
│ └── svg
```
1. `img` 存放静态图片资源
2. `svg` 存放svg图片
## 混入：mixins
```
├── mixins 混入
│ ├── BaseMixins.js 全局混入
│ └── PageMixins.js 部分功能模块混入
```
1. `BaseMixins`全局混入，例如字典CollectionData等
2. 其他功能模块混入，不需要全局混入，例如分页模块，拍照模块，上传模块等，均以功能模块划分
3. 命名规范：==模块名Mixins.js，首字母大写==，eg: PageMixins.js, UploadMixins.js
## 路由：router
```
├── router 前端路由
│ ├── index.js
│ └── Accept.js 功能模块路由
```
1. 每个模块一个路由
2. 命名规范：==模块.js，首字母大写==，eg: Accept.js, System.js
## 状态：store
```
├── store 应用级数据（state）
│ ├── index.js
│ └── modules
│ ├── Base.js 基础全局状态
│ └── Accept.js 功能模块状态
```
1. `Base.js`基础全局状态，存放登录信息，菜单信息等数据
2. 其他功能模块，均需以模块划分，一个模块使用一个js
3. 命名规范：==模块名.js，首字母大写==，eg: Accept.js, Sysrem.js
## 主题：theme
```
├── theme
│ └── Default 主题文件
│ ├── Root.less ant-design 主题属性 && 自定义属性
│ ├── Base.less 通用class 样式
│ └── Style.less 自定义class
```
1. `theme`下的文件夹名，即主题名，与`faceconfig`中的`theme`字段相对应
2. 每个主题文件下必须包含`Root`,`Base`,`Style`文件，这些文件已引入，不需要手动再引入
3. `root` 主要包含属性设置
4. `Base` 一些基础class设置,覆盖ant-design样式
5. `Style` 自定义class设置
6. 如新加样式文件，需要手动引入
## 页面：view
```
└── views 页面目录
└── Index
├── Index.vue
├── part
├── js
└── components
```
1. 一个模块一个文件夹，包含主文件vue，以及相关内部组件
2. 命名规范：==模块名.vue，首字母大写==
3. 组件在template文件中引用时，使用`<svg-icon />`小写形式
4. components 存放单独组件，如弹框等
5. part 存放内部页面，如新增页面
6. js 存放单文件js
# 其他规范
> template中绑定事件，@click,@search等，需要页面操作去触发的，统一加on前缀
```js
// template
<a-button @click="onSubmit" />
// js
methods: {
onSubmit(){
this.getFinalParams()
},
getFinalParams (){}
}
```