# ddd

**Repository Path**: caker22/ddd

## Basic Information

- **Project Name**: ddd
- **Description**: 1111
- **Primary Language**: JavaScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 1
- **Created**: 2020-07-18
- **Last Updated**: 2020-12-19

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 贷后催收管理系统
## [pangolin-web 4.0.0](http://114.116.34.94:3000/pangolin/pangolin-financial-institutions-web.git)
  > A Vue.js project

---
## 项目目录结构说明

贷后催收系统，使用[typescript](https://www.tslang.cn/)语言进行代码编写，前端使用[vue.js](https://vuejs.org/)库作为底层代码框架，使用[element-ui](http://element-ui.cn) UI组件库丰富前端展示。
最终通过[webpack](https://www.webpackjs.com/)打包生成服务器端文件


- node_modules.zip 
   nodejs 依赖库，如通过npm install 无法安装下载依赖，可以直接解压使用
- config

  该目录下存放的文件与webpack打包相关，主要是dev.env.js文件下面有这样一段代码
  ``` javascript
  let targetServer = process.env.server
  // 是否使用临时地址
  if (targetServer) {
    tempEnv = {
      URL: {
        SERVER: JSON.stringify("http://" + targetServer)
      }
    }
  }
  ```
  这段代码用来合临时环境变量设置的server地址 例如：
  ``` bash
  $:server=192.168.3.91:9000 npm run dev
  ```
  此server对应 process.env.server

- environment

  该文件夹下面实际是对不同环境下面的config对象的值的配置，使用方式示例在代码中进行搜索

- public

  public文件夹下面防止的文件，不经过webpack压缩打包，仅进行copy，所以适合防止比较大的资源文件

- src

  - components：该目录下的文件为各个页面page对应组件存放位置
  - page：该目录下的文件就是对应菜单项的主文件
  - config
    - server: 对应后端控制器的配置
    - enum *：系统代码中用到的枚举，静态数据
    - app.config: 对应environment文件夹下面配置的系统config配置项
  - services:对应config-server配置的控制器实现的服务实例
  - store: vuex 对应数据存放
  - router: vue-router 对应的文件，配置路由地址
  - utils: 工具类
  - core: 项目启动文件夹
  - extension: 扩项插件安装文件
  - main.ts：程序入口文件
- typings
- package.json
- vue.config.js


## 代码编写规范

#### 项目业务框架分为页面部分和组件部分。
1. 页面（菜单可见）放在page文件夹中
2. 组件（子页面）放在component文件夹中

#### 页面编写风格，遵循Vue组件[生命周期](https://segmentfault.com/a/1190000008570622)，外部组件模块引用写在外面

``` javascript
import moudle from 'vue'
// ... 其他引用
export default class AccFlowApproval extends Vue
```

#### 变量声明,初始化

只声明，在created方法中进行初始化，特殊对象可以声明和赋值在一起

``` TypeScript
// bad
private assistModel: any = {
  companyCode: "",
  personalName: "",
  approveState: ""
};

// great
private assistModel: any = {};

created() {
  this.assistModel = {
    aa:'',
    bb:['x','y']
  }
}

```

#### 项目辅助资源说明

* ~/src/config 本目录下面的资源内容全部为与后端服务相关的接口名称 action 定义

``` javascript
import { requestType } from '~/config/enum.config'

// 服务名称 ， 此名称与后端对应
const SERVICE = 'business-service'
const CONTROLLER = 'appRegisterResource'

export default {
  /**
   * 新增app注册服务
   */
  addAppRegister: {
    service: SERVICE,
    controller: CONTROLLER,
    type: requestType.Post
  }
}
```
>[swagger-ui](https://swagger.io/)

* ~/src/services 接口的调用 request 定义

``` javascript
// 引用定义的接口模块
import { businessService } from '~/config/server'
// axios调用接口的底层类
import { NetService } from '~/utils/net.service'
// 依赖注入，去抖动模块
import { Inject, Debounce } from "~/core/decorator";
// 过滤器服务，用于时间，数据等的处理
import { FilterService } from "~/utils/filter.service";
// 核心服务
import { Service } from "~/core/service"

// 导出这个业务类，名称与Swagger-ui上的控制器名称一致
export class AccTelPoolService extends Service {

  // 依赖注入模式。
  @Inject(NetService)
  private netService: NetService

  /**
   * 电催页面新增联系人电话或邮箱地址
   */
  @Debounce()
  savePersonalContactPhone(data) { 
    // 参数根据action 的实际情况定义
    return this.netService.send({
      server: businessService.accTelPoolController.savePersonalContactPhone,
      data: data
    })
  }
}
```

> [inject](https://www.npmjs.com/package/gulp-inject)

## Build Setup

``` bash
# install dependencies
npm install

# serve with hot reload at localhost:8080
npm run dev

# build for production with minification
npm run build

# build for production and view the bundle analyzer report
npm run build --report
```

For a detailed explanation on how things work, check out the [guide](http://vuejs-templates.github.io/webpack/) and [docs for vue-loader](http://vuejs.github.io/vue-loader).
test