Merge branch 'dev' of gitlab.corp.qunar.com:mfe/yapi into dev

2025-01-24 13:14:16 +08:00 · 2017-08-22 17:00:37 +08:00 · 2017-08-22 17:00:37 +08:00 · 23f7f59b63
commit 23f7f59b63
parent 0c14fb4613 fa5c4c283e
5 changed files with 108 additions and 50 deletions
--- a/client/containers/Project/Activity/Activity.js
+++ b/client/containers/Project/Activity/Activity.js
@ -3,52 +3,41 @@ import React, { Component } from 'react'
 import TimeTree from './Timeline/Timeline'
 import { connect } from 'react-redux'
 import PropTypes from 'prop-types'
-// import Breadcrumb from '../../../components/Breadcrumb/Breadcrumb'
 import { Button } from 'antd'
-import { getMockUrl } from '../../../reducer/modules/news.js'
-
@connect(
  state => {
    return {
-      uid: state.user.uid + ''
+      uid: state.user.uid + '',
+      curdata: state.inter.curdata,
+      currProject: state.project.currProject
    }
-  },
-  {
-    getMockUrl: getMockUrl
  }
 )

 class Activity extends Component {
  constructor(props) {
    super(props);
-    this.state = {
-      mockURL: ""
-    }
  }
  static propTypes = {
    uid: PropTypes.string,
    getMockUrl: PropTypes.func,
-    match: PropTypes.object
-  }
-  componentWillMount(){
-    //const that = this;
-    // this.props.getMockUrl(2724).then(function(data){
-    //   const { prd_host, basepath, protocol } = data.payload.data.data;
-    //   const mockURL = `${protocol}://${prd_host}${basepath}/{path}`;
-    //   that.setState({
-    //     mockURL: mockURL
-    //   })
-    // })
+    match: PropTypes.object,
+    curdata: PropTypes.object,
+    currProject: PropTypes.object
  }
  render () {
+    let {currProject} = this.props;
    return (
      <div className="g-row">
        <section className="news-box">
-          <div className="logHead">
+          <div style={{display: "none"}} className="logHead">
            {/*<Breadcrumb />*/}
+            <div className = "projectDes">
+              <p>高效、易用、可部署的API管理平台</p>
+            </div>
            <div className="Mockurl">
              <span>Mock地址：</span>
-              <p>{this.state.mockURL}</p>
+              <p>{location.protocol + '//' + location.hostname + (location.port !== "" ? ":" + location.port : "") + `/mock/${currProject._id}${currProject.basepath}/yourPath`}</p>
              <Button type="primary"><a href = {`/api/project/download?project_id=${this.props.match.params.id}`}>下载Mock数据</a></Button>
            </div>
          </div>
--- a/client/containers/Project/Activity/Activity.scss
+++ b/client/containers/Project/Activity/Activity.scss
@ -67,8 +67,14 @@
      float: left;
      min-width:100px; 
    }
+    .projectDes{
+      color: #7b7b7b;
+      font-size: 25px;
+      float: left;
+      line-height: 0.9em;
+    }
    .Mockurl{
-      width: 500px;
+      width: 600px !important;
      float: right;
      color: #7b7b7b;
      >span{
@ -76,7 +82,7 @@
        line-height: 30px;
      }
      p{
-        width: 60%;
+        width: 65%;
        display: inline-block;
        position: relative;
        padding: 4px 7px;
--- a/client/containers/Project/Interface/InterfaceList/View.js
+++ b/client/containers/Project/Interface/InterfaceList/View.js
@ -10,8 +10,10 @@ import ErrMsg from '../../../../components/ErrMsg/ErrMsg.js';
 // import { getMockUrl } from '../../reducer/modules/news.js'

@connect(state=>{
+  // console.log(state);
  return {
-    curData: state.inter.curdata
+    curData: state.inter.curdata,
+    currProject: state.project.currProject
  }
 })

@ -23,12 +25,13 @@ class View extends Component {
    }
  }
  static propTypes = {
-    curData: PropTypes.object
+    curData: PropTypes.object,
+    currProject: PropTypes.object
  }

  req_body_form(req_body_type,req_body_form){
    if(req_body_type === 'json'){
-      return <div style={{display:this.props.curData.req_body_other?"":"none"}} className="colBody">
+      return <div style={{display:this.props.curData.req_body_other?"block":"none"}} className="colBody">
        <span className="colKey">请求Body：</span>
        <div id="vreq_body_json" style={{ minHeight: "300px" }}></div>
      </div>
@ -40,13 +43,13 @@ class View extends Component {
        dataIndex: 'name',
        key: 'name'
      }, {
-        title: '参数值',
-        dataIndex: 'value',
-        key: 'value'
+        title: '是否必须',
+        dataIndex: 'required',
+        key: 'required'
      }, {
        title: '备注',
-        dataIndex: 'required',
-        key: 'required',
+        dataIndex: 'value',
+        key: 'value',
        width: '45%'
      }];

@ -84,12 +87,12 @@ class View extends Component {
  }
  res_body(res_body_type,res_body){
    if(res_body_type === 'json'){
-      return <div style={{display:this.props.curData.req_body_other?"":"none"}} className="colBody">
+      return <div style={{display:this.props.curData.res_body?"":"none"}} className="colBody">
        <span className="colKey">返回Body：</span>
        <div id="vres_body_json" style={{ minHeight: "300px" }}></div>
      </div>
    }else if(res_body_type === 'raw'){
-      return <div style={{display:this.props.curData.req_body_other?"":"none"}} className="colBody">
+      return <div style={{display:this.props.curData.res_body?"":"none"}} className="colBody">
        <span className="colKey">返回Body：</span>
        <div>{res_body}</div>
      </div>
@ -102,13 +105,13 @@ class View extends Component {
      dataIndex: 'name',
      key: 'name'
    }, {
-      title: '参数值',
-      dataIndex: 'value',
-      key: 'value'
+      title: '是否必须',
+      dataIndex: 'required',
+      key: 'required'
    }, {
      title: '备注',
-      dataIndex: 'required',
-      key: 'required',
+      dataIndex: 'value',
+      key: 'value',
      width: '45%'
    }];

@ -137,7 +140,7 @@ class View extends Component {
        onChange: function () {}
      })
    }
-    if(this.props.curData.title&&this.props.curData.req_body_type === "json"){
+    if(this.props.curData.title&&this.props.curData.res_body_type === "json"){
      mockEditor({
        container: 'vres_body_json',
        data: this.props.curData.res_body,
@ -169,7 +172,7 @@ class View extends Component {
        dataSource.push({
          key: i,
          name: item.name,
-          required: item.required?"必须":"非必须",
+          required: item.required,
          value: item.value
        })
      })
@ -193,6 +196,21 @@ class View extends Component {
      undone: "未完成",
      done: "完成"
    }
+    let statusColor = {
+      undone: "rgb(255, 85, 0)",
+      done: "#cfefdf"
+    }
+    let methodColor = {
+      post: {
+        bac: "#d2eafb",
+        color: "#108ee9"
+      },
+      get: {
+        bac: "#cfefdf",
+        color: "#00a854"
+      }
+    }
+    methodColor = methodColor[this.props.curData.method?this.props.curData.method.toLowerCase():"get"];
    let res = <div className="caseContainer">
      <div className="colName">
        <span className="colKey">接口名：</span>
@ -200,15 +218,15 @@ class View extends Component {
      </div>
      <div className="colMethod">
        <span className="colKey">请求方法：</span>
-        <span className="colValue">{this.props.curData.method}</span>
+        <span style={{color:methodColor.color,backgroundColor:methodColor.bac}} className="colValue">{this.props.curData.method}</span>
      </div>
      <div className="colPath">
        <span className="colKey">接口路径：</span>
-        <span className="colValue">{this.props.curData.path}</span>
+        <span className="colValue">{this.props.currProject.basepath}{this.props.curData.path}</span>
      </div>
      <div className="colstatus">
        <span className="colKey">状态：</span>
-        <span className="colValue">{status[this.props.curData.status]}</span>
+        <span style={{backgroundColor:statusColor[this.props.curData.status]}} className="colValue">{status[this.props.curData.status]}</span>
      </div>
      <div className="colAddTime">
        <span className="colKey">创建时间：</span>
@ -218,6 +236,10 @@ class View extends Component {
        <span className="colKey">更新时间：</span>
        <span className="colValue">{formatTime(this.props.curData.up_time)}</span>
      </div>
+      <div className="colMockUrl">
+        <span className="colKey">Mock地址：</span>
+        <span className="colValue">{location.protocol + '//' + location.hostname + (location.port !== "" ? ":" + location.port : "") + `/mock/${this.props.currProject._id}${this.props.currProject.basepath}/yourPath`}</span>
+      </div>
      {this.props.curData.desc?<div className="colDesc">
        <span className="colKey">接口描述：</span>
        <span className="colValue">{this.props.curData.desc}</span>
--- a/client/containers/Project/Interface/InterfaceList/View.scss
+++ b/client/containers/Project/Interface/InterfaceList/View.scss
@ -35,6 +35,47 @@
            padding-bottom: 0px;
        }
    }
+    .ant-table-thead {
+        th{
+            color: #6d6c6c;
+            font-weight: normal;
+        }
+        tr{
+            // background-color: black;
+        }
+    }
+    .ant-table-thead>tr>th{
+        background: #f7f7f7;
+    }
+    .colMethod{
+        .colValue{
+            display: inline-block;
+            border-radius: 4px;
+            color: #00a854;
+            background: #cfefdf;
+            border-color: #cfefdf;
+            height: 23px;
+            line-height: 23px;
+            text-align: center;
+            font-size: 10px;
+            margin-right: 7px;
+            padding: 0 5px;
+        }
+    }
+    .colstatus{
+        .colValue{
+            height: 23px;
+            padding: 0 5px;
+            line-height: 23px;
+            display: inline-block;
+            border-radius: 4px;
+            color: white;
+        }
+    }
+    .colMockUrl{
+        margin-bottom: 0px;
+        padding-bottom: 0px;
+    }
    .colDesc{
        line-height: 1.5em;
        .colKey{
--- a/client/containers/User/List.js
+++ b/client/containers/User/List.js
@ -92,12 +92,12 @@ class List extends Component {
      title: 'UID',
      dataIndex: '_id',
      key: '_id',
-      width: 70
+      width: 100
    }, {
      title: '用户名',
      dataIndex: 'username',
      key: 'username',
-      width: 150
+      width: 180
    }, {
      title: 'Email',
      dataIndex: 'email',
@ -106,16 +106,16 @@ class List extends Component {
      title: '用户角色',
      dataIndex: 'role',
      key: 'role',
-      width:110
+      width:150
    }, {
      title: '更新日期',
      dataIndex: 'up_time',
      key: 'up_time',
-      width: 180
+      width: 150
    }, {
      title: '功能',
      key: 'action',
-      width:80,
+      width:"80px",
      render: (item) => {
        return (
          <span>