feat - 添加接口详情 测试 mock

This commit is contained in:
waliang.wang 2017-07-20 16:34:46 +08:00
parent 4544ecb23b
commit ee3322fa4e
10 changed files with 106 additions and 103 deletions

View File

@ -6,7 +6,8 @@ import {
DELETE_INTERFACE_SEQ_HEADER,
GET_INTERFACE_REQ_PARAMS,
GET_INTERFACE_RES_PARAMS,
SAVE_INTERFACE_FORMS
SAVE_INTERFACE_FORMS,
PUSH_INTERFACE_NAME
// ADD_INTERFACE_RES_PARAMS,
// DELETE_INTERFACE_RES_PARAMS
} from '../constants/action-types.js'
@ -67,24 +68,12 @@ export function saveForms (value) {
};
}
// export function deleteReqParams (value) {
// return {
// type: DELETE_INTERFACE_REQ_PARAMS,
// payload: value
// };
// }
export function pushInterfaceName (value) {
console.log(value)
return {
type: PUSH_INTERFACE_NAME,
payload: value
}
}
// export function addResParams (value) {
// return {
// type: ADD_INTERFACE_RES_PARAMS,
// payload: value
// };
// }
// export function deleteResParams (value) {
// return {
// type: DELETE_INTERFACE_RES_PARAMS,
// payload: value
// };
// }

View File

@ -6,7 +6,8 @@ import {
DELETE_INTERFACE_SEQ_HEADER,
GET_INTERFACE_REQ_PARAMS,
GET_INTERFACE_RES_PARAMS,
SAVE_INTERFACE_FORMS
SAVE_INTERFACE_FORMS,
PUSH_INTERFACE_NAME
// ADD_INTERFACE_RES_PARAMS,
// DELETE_INTERFACE_RES_PARAMS
} from '../constants/action-types.js'
@ -67,24 +68,12 @@ export function saveForms (value) {
};
}
// export function deleteReqParams (value) {
// return {
// type: DELETE_INTERFACE_REQ_PARAMS,
// payload: value
// };
// }
export function pushInterfaceName (value) {
console.log(value)
return {
type: PUSH_INTERFACE_NAME,
payload: value
}
}
// export function addResParams (value) {
// return {
// type: ADD_INTERFACE_RES_PARAMS,
// payload: value
// };
// }
// export function deleteResParams (value) {
// return {
// type: DELETE_INTERFACE_RES_PARAMS,
// payload: value
// };
// }

View File

@ -4,33 +4,33 @@ import {
PROJECT_MEMBER_INTERFACE
} from '../constants/action-types.js'
export function fetchInterfaceData () {
const data = [{
key: '1',
name: 'John Brown',
age: 32,
address: 'New York No. 1 Lake Park',
date: '2015-11-11 13:00:15',
features: '3'
}, {
key: '2',
name: 'Jim Green',
age: 42,
address: 'London No. 1 Lake Park',
date: '2015-11-11 13:00:15',
features: '3'
}, {
key: '3',
name: 'Joe Black',
age: 32,
address: 'Sidney No. 1 Lake Park',
date: '2015-11-11 13:00:15',
features: '3'
}]
export function fetchInterfaceData (value) {
// const data = [{
// key: '1',
// name: 'John Brown',
// age: 32,
// address: 'New York No. 1 Lake Park',
// date: '2015-11-11 13:00:15',
// features: '3'
// }, {
// key: '2',
// name: 'Jim Green',
// age: 42,
// address: 'London No. 1 Lake Park',
// date: '2015-11-11 13:00:15',
// features: '3'
// }, {
// key: '3',
// name: 'Joe Black',
// age: 32,
// address: 'Sidney No. 1 Lake Park',
// date: '2015-11-11 13:00:15',
// features: '3'
// }]
return {
type: FETCH_INTERFACE_DATA,
payload: data
payload: value
};
}
@ -44,4 +44,4 @@ export function closeProjectMember () {
return {
type: PROJECT_MEMBER_INTERFACE
}
}
}

View File

@ -2,6 +2,7 @@
export const FETCH_INTERFACE_DATA = 'FETCH_INTERFACE_DATA'
export const LIST_INTERFACE_CLICK = 'LIST_INTERFACE_CLICK'
export const PROJECT_MEMBER_INTERFACE = 'PROJECT_MEMBER_INTERFACE'
export const PUSH_INTERFACE_NAME = 'PUSH_INTERFACE_NAME'
// addInterFace
export const FETCH_ADD_INTERFACE_INPUT = 'FETCH_ADD_INTERFACE_INPUT'
@ -12,8 +13,6 @@ export const DELETE_INTERFACE_SEQ_HEADER = 'DELETE_INTERFACE_SEQ_HEADER'
export const GET_INTERFACE_REQ_PARAMS = 'GET_INTERFACE_REQ_PARAMS'
export const GET_INTERFACE_RES_PARAMS = 'GET_INTERFACE_RES_PARAMS'
export const SAVE_INTERFACE_FORMS = 'SAVE_INTERFACE_FORMS'
// export const ADD_INTERFACE_RES_PARAMS = 'ADD_INTERFACE_RES_PARAMS'
// export const DELETE_INTERFACE_RES_PARAMS = 'DELETE_INTERFACE_RES_PARAMS'
// group
export const FETCH_GROUP_LIST = 'FETCH_GROUP_LIST'

View File

@ -4,7 +4,7 @@ import PropTypes from 'prop-types'
import axios from 'axios'
import { connect } from 'react-redux'
import { autobind } from 'core-decorators'
import { Button } from 'antd'
import { Button, Tabs } from 'antd'
import ReqMethod from './ReqMethod/ReqMethod.js'
import ReqHeader from './ReqHeader/ReqHeader.js'
import ReqParams from './ReqParams/ReqParams.js'
@ -52,10 +52,11 @@ class AddInterface extends Component {
method: 'POST',
params: {
method: 'POST',
project_id: 8,
project_id: 558,
req_headers: [],
req_params_type: 'json',
req_params: this.props.reqParams
req_params: this.props.reqParams,
title: '接口文档1'
}
}
@ -71,17 +72,25 @@ class AddInterface extends Component {
}
render () {
const TabPane = Tabs.TabPane
return (
<section className="add-interface-box">
<div className="content">
<Button type="primary" className="save" onClick={this.saveForms}>保存</Button>
<ReqMethod />
<ReqHeader />
<ReqParams />
<ResParams />
<Result />
</div>
</section>
<Tabs defaultActiveKey="1">
<TabPane tab="Tab 1" key="1">
<section className="add-interface-box">
<div className="content">
<Button type="primary" className="save" onClick={this.saveForms}>保存</Button>
<ReqMethod />
<ReqHeader />
<ReqParams />
<ResParams />
<Result />
</div>
</section>
</TabPane>
<TabPane tab="Tab 2" key="2">mock</TabPane>
<TabPane tab="Tab 3" key="3">测试</TabPane>
</Tabs>
)
}
}

View File

@ -2,25 +2,31 @@ import PropTypes from 'prop-types'
import { connect } from 'react-redux'
import React, { Component } from 'react'
import { Select, Input } from 'antd'
import { autobind } from 'core-decorators'
import {
pushInputValue
pushInputValue,
pushInterfaceName
} from '../../../actions/addInterface.js'
@connect(
state => {
return {
reqInputVal: state.addInterface.inputValue
reqInputVal: state.addInterface.inputValue,
interfaceName: state.addInterface.interfaceName
}
},
{
pushInputValue
pushInputValue,
pushInterfaceName
}
)
class ReqMethod extends Component {
static propTypes = {
pushInputValue: PropTypes.func,
inputValue: PropTypes.string
pushInterfaceName: PropTypes.func,
inputValue: PropTypes.string,
interfaceName: PropTypes.string
}
constructor(props) {
@ -31,15 +37,23 @@ class ReqMethod extends Component {
console.log(`selected ${value}`)
}
@autobind
getInputVal (e) {
const inputVal = e.target.value
console.log(this.props.pushInputValue)
this.props.pushInputValue(inputVal)
}
@autobind
getInterfaceValue () {
// const name = e.target.value
console.log(this.props.pushInterfaceName)
// this.props.pushInterfaceName(name)
}
render () {
const { Option } = Select
const getInputVal = this.getInputVal.bind(this)
console.log(this.props.interfaceName)
return (
<table>
<tbody>
@ -62,7 +76,11 @@ class ReqMethod extends Component {
</tr>
<tr>
<th>URL :</th>
<td><Input placeholder="Basic usage" className="url" size="large" onBlur={getInputVal} /></td>
<td><Input placeholder="填写 URL" className="url" size="large" onBlur={this.getInputVal} /></td>
</tr>
<tr>
<th>名称 :</th>
<td><Input placeholder="接口名称" className="url" size="large" onBlur={this.getInterfaceValue} /></td>
</tr>
</tbody>
</table>

View File

@ -42,9 +42,12 @@ class Interface extends Component {
}
componentWillMount () {
// 558 665 704 743
this.props.fetchInterfaceData()
const params = {
project_id: 8
params: {
project_id: 558
}
}
axios.get('/interface/list', params)

View File

@ -6,7 +6,8 @@ import {
const initialState = {
interfaceData: null,
modalVisible: false
modalVisible: false,
interfaceName: ''
}
export default (state = initialState, action) => {

View File

@ -6,9 +6,8 @@ import {
DELETE_INTERFACE_SEQ_HEADER,
GET_INTERFACE_REQ_PARAMS,
GET_INTERFACE_RES_PARAMS,
SAVE_INTERFACE_FORMS
// ADD_INTERFACE_RES_PARAMS,
// DELETE_INTERFACE_RES_PARAMS
SAVE_INTERFACE_FORMS,
PUSH_INTERFACE_NAME
} from '../../constants/action-types.js'
const initialState = {
@ -69,16 +68,11 @@ export default (state = initialState, action) => {
...state,
resParams: action.payload
}
// case ADD_INTERFACE_RES_PARAMS:
// return {
// ...state,
// reqParams: action.payload
// }
// case DELETE_INTERFACE_RES_PARAMS:
// return {
// ...state,
// reqParams: action.payload
// }
case PUSH_INTERFACE_NAME:
return {
...state,
resParams: action.payload
}
default:
return state
}

View File

@ -6,7 +6,8 @@ import {
const initialState = {
interfaceData: null,
modalVisible: false
modalVisible: false,
interfaceName: ''
}
export default (state = initialState, action) => {