项目管理系统自研之路

背景

我司的项目管理比较乱，核心数据存在了外部购买的系统上"teambition"，比如项目排期、测试用例、bug等数据。PMO同学在做数据统计的时候，先要从teambition倒出一份原始数据，再按照PMO约定的规则计算人效，计算的效率极低。

项目管理系统主要目的最开始是为了解决提高PMO手动出人效的效率，核心是计算产研人员效能。

当时PMO计算人效的公式是内部协商出来的: 1、当研发阶段的时候，开发人效 1 2、当测试阶段的时候，开发人效 0.5、测试人效 1 3、当前上线阶段，开发人效 0.5、测试人效 1 等等还有一些公式。

基于上面的痛点，我们决定开发一条可视化项目管理平台，直观展示研发效能数据。

实现方案

1、经过调研在teambition中,如果达成pmo的效果,需要给teambition提需求，经过沟通比较难实现。

2、自研项目管理系统，通过同步teambition把数据存储到研项目管理系统，把计算人效逻辑封装到后端服务中。

自研系统好处: 1)、锻炼后端开发技术 2)、PMO、产品、研发共建系统,拉起目标 3)、向上管理工具

自研系统缺点: 1)、产品缺乏架构设计 2)、项目质量一般 3)、服务架构单一

业务架构

如下图是当时PMO计得产品原型图，包含从项目管理角度出发覆盖研发效能到质量分报告，涉及功能模块比较全。

首页图表

需求维度

质量分报告

如下图是，思维导图梳理的产品架构:

开发架构

前端

参考vue admin平台，隐藏不需要代码即可，开箱即用。

代码语言：javascript复制

https://github.com/PanJiaChen/vue-element-admin

依赖如下库

代码语言：javascript复制

vue2.x、axios、echarts、element-ui、stylus等库

后端

后端系统主要使用django全家桶开发，类库比较多、并且ORM功能强大、部署方便。

代码语言：javascript复制

django全家桶、 mysql 、redis 、request 、gunicorn等库

经过几个迭代以后，代码越来越多，所有功能模块都写到一个服务上，变得越来越重。应该考虑微服务架构解耦代码问题。

定时任务

1、jenkins

jenkins主要做同步数据脚本使用，配置灵活方便。

2、apscheduler

apscheduler库，为了实现内部方法做定时任务使用。

var hasToken = getCookie('token')
  var myDate = new Date()
  const logs = {}
  const newDate = formatDate(myDate, 'yyyy-M-d h:m:s')
  logs.username = hasToken
  logs.content = newDate   ' '   hasToken   ' '   '登录'
  logs.type = "logs"
  createLogs(logs).then(res => {
  })
  if (hasToken) {
    if (to.path === '/login') {
      next({ path: '/' })
      NProgress.done()
    } else {
      const hasPerms = store.getters.perms && store.getters.perms.length > 0
      if (hasPerms) {
        next()
      } else {
        try { 
          const { perms } = await store.dispatch('user/getInfo')
          const accessRoutes = await store.dispatch('permission/generateRoutes', perms)
          router.addRoutes(accessRoutes)
          history record
          next({ ...to, replace: true })
        } catch (error) {
          NProgress.done()
        }
      }
    }

登陆页面的逻辑，首页会判断是有code，没有的话调用接口获取code，code参数通过前端页面拦截获取，所以这样是很安全的.拿到code再去换token，最后获取用户信息的接口携带token参数，跳转到首页。

代码语言：javascript复制

mounted() {
this.getTokenByCode()
},
created() {
this.goSSO()
},

goSSO() {
  if (!this.code) {
    var sso_url =
      'https://sso.xxxx.com/oauth/authorize/?client_id='  
      client_id  
      '&redirect_uri='  
      redirect_uri  
      '&response_type=code'
    // console.log("sso_url is "   sso_url);
    window.location.href = sso_url
  }
},

getTokenByCode() {
  if (this.code) {
    // SSO登录回调
    const params = {
      code: this.code,
      client_id: client_id,
      client_secret: constclient_secret,
      grant_type: 'authorization_code',
      redirect_uri: redirect_uri
    }
    // console.log(params);
    const axiospost = axios.create({
      timeout: 500000,
      headers: { 'Content-Type': 'multipart/form-data' },
      withCredentials: true
    })
    const formData = new FormData()
    for (const k in params) {
      formData.append(k, params[k])
    }
    axiospost.post(tokenURL, formData).then(res => {)
      const access_token = res.data['access_token']
      this.getTokenByUserName(access_token)
    })
  }
},
    getTokenByUserName(access_token) {
      console.log('getTokenByUserName')
      const axiospost = axios.create({
        timeout: 500000,
        headers: {
          'Content-Type': 'multipart/form-data',
          Authorization: 'Bearer '   access_token
        },
        withCredentials: true
      })
      axiospost.get(infoURL, null).then(res => {
        const username = res.data['name'])
        if (username) {
          setCookie('userName', username, 7)
          this.$router.push('/dashboard')
        } else {
          this.$router.push('/login')
        }
      })
    }

共享登录状态

内部有很多系统都接入了单点登陆系统，为了能登陆一次系统后,再登陆其他系统就不需要再登陆，需要共享登陆状态。

如果设置cookie的话，把cookie种在根域下就可以,这样就通过cookie完成了共享登录状态。

代码语言：javascript复制

export function setCookie(cname, cvalue, exdays) {
  var d = new Date()
  d.setTime(d.getTime()   (exdays * 24 * 60 * 60 * 1000))
  var expires = 'expires='   d.toUTCString()
  document.cookie = cname   '='   cvalue   '; '   expires   ';'   'domain=.xxxx.com;'
}

首页

数据来源

由于我们和"teambition"第三方公司签约到很久，需求数据、bug、测试用例都存在了 "teambition"平台。所以需要使用对接"teambition"的api完成数据同步。

teambition接口鉴权这款还是比较复杂的，首先有管理员账号并且生成对应的token。

使用jwt对参数进行编码解码等一系列操作生成token，放在请求的header中。

代码语言：javascript复制

def get_token():
    """
    生成token
    :return:
    """
    payload = {}
    iat = math.floor(int(time.time()) / 3600 * 3600)
    payload['iat'] = iat
    payload['_appId'] = appId

    headers = {
        "alg": "xxx",
        "typ": "JWT"
    }
    token = jwt.encode(payload, appSecret, headers=headers).decode('utf-8')
    return token

teambition的官方接口文档，如果对接第三方系统，没有好的接口文档，开发的过程中会很痛苦。

代码语言：javascript复制