-
-
+
+
@@ -48,10 +63,11 @@ class Interface extends Component {
+
- {content}
+
@@ -59,4 +75,6 @@ class Interface extends Component {
}
}
+
+
export default Interface
\ No newline at end of file
diff --git a/client/containers/Project/Interface/InterfaceList/InterfaceContent.js b/client/containers/Project/Interface/InterfaceList/InterfaceContent.js
index bb9cb3b8..2eb414af 100644
--- a/client/containers/Project/Interface/InterfaceList/InterfaceContent.js
+++ b/client/containers/Project/Interface/InterfaceList/InterfaceContent.js
@@ -1,25 +1,92 @@
-import React from 'react'
+import React, { Component } from 'react'
+import { connect } from 'react-redux';
+import PropTypes from 'prop-types'
import { Tabs } from 'antd';
import Edit from './Edit.js'
import View from './View.js'
import Run from './Run.js'
+import { fetchInterfaceData } from '../../../../reducer/modules/interface.js';
+import { withRouter } from 'react-router-dom';
const TabPane = Tabs.TabPane;
+@connect(
+ state => {
+ return {
+ curdata: state.inter.curdata,
+ list: state.inter.list
+ }
+ },
+ {
+ fetchInterfaceData
+ }
+)
+class Content extends Component {
+ static propTypes = {
+ match: PropTypes.object,
+ list: PropTypes.array,
+ curdata: PropTypes.object,
+ fetchInterfaceData: PropTypes.func
+ }
+ constructor(props) {
+ super(props)
+ this.state = {
+ curtab: 'view'
+ }
+ this._actionId = 0;
+ }
-const Content = () => {
- return
-
-
-
+ componentWillReceiveProps(nextProps){
+ this.handleRequest(nextProps)
+ }
+
+ handleRequest(nextProps){
+ let matchParams = nextProps.match.params;
+ let _actionId;
+ _actionId = matchParams.actionId;
+ _actionId = parseInt(matchParams.actionId, 10);
+ if(!nextProps.curdata)return;
+ if(this._actionId !== _actionId){
+ this._actionId = _actionId;
+ this.props.fetchInterfaceData(_actionId)
+ }
+ this.setState({
+ curtab: 'view'
+ })
+ }
+
+ onChange = (key)=>{
+ this.setState({
+ curtab: key
+ })
+ }
+
+ render() {
+ const tabs =
+
+ {/* */}
-
-
+
+
-
-
+
+ {/* */}
-
-
+ ;
+ let tabContent;
+ if (this.state.curtab === 'view') {
+ tabContent =
;
+ } else if (this.state.curtab === 'edit') {
+ tabContent =
+ } else if (this.state.curtab === 'run') {
+ tabContent =
+ }
+
+ return
+ {tabs}
+ {tabContent}
+
+ }
}
-export default Content
\ No newline at end of file
+
+export default withRouter(Content)
\ No newline at end of file
diff --git a/client/containers/Project/Interface/InterfaceList/InterfaceMenu.js b/client/containers/Project/Interface/InterfaceList/InterfaceMenu.js
index d1926bee..aaca6ccd 100644
--- a/client/containers/Project/Interface/InterfaceList/InterfaceMenu.js
+++ b/client/containers/Project/Interface/InterfaceList/InterfaceMenu.js
@@ -1,10 +1,11 @@
import React, { Component } from 'react'
import { connect } from 'react-redux';
import PropTypes from 'prop-types'
-import { fetchInterfaceList, fetchInterfaceData, changeInterfaceId, addInterfaceData, deleteInterfaceData } from '../../../../reducer/modules/interface.js';
+import { fetchInterfaceList, fetchInterfaceData, addInterfaceData, deleteInterfaceData } from '../../../../reducer/modules/interface.js';
import { Menu, Input, Icon, Tag, Modal, message } from 'antd';
import AddInterfaceForm from './AddInterfaceForm';
import axios from 'axios'
+import { Link,withRouter } from 'react-router-dom';
const confirm = Modal.confirm;
@@ -14,29 +15,27 @@ const confirm = Modal.confirm;
state => {
return {
list: state.inter.list,
- curProject: state.project.curProject,
- interfaceId: state.inter.interfaceId
+ curProject: state.project.curProject
}
},
{
fetchInterfaceList,
fetchInterfaceData,
- changeInterfaceId,
addInterfaceData,
deleteInterfaceData
}
)
class InterfaceMenu extends Component {
static propTypes = {
+ match: PropTypes.object,
projectId: PropTypes.string,
- interfaceId: PropTypes.number,
list: PropTypes.array,
fetchInterfaceList: PropTypes.func,
curProject: PropTypes.object,
fetchInterfaceData: PropTypes.func,
- changeInterfaceId: PropTypes.func,
addInterfaceData: PropTypes.func,
- deleteInterfaceData: PropTypes.func
+ deleteInterfaceData: PropTypes.func,
+ history: PropTypes.object
}
showModal = () => {
@@ -59,26 +58,21 @@ class InterfaceMenu extends Component {
delIcon: null,
filter: ''
}
+
}
async handleRequest() {
let result = await this.props.fetchInterfaceList(this.props.projectId);
- let interfaces = result.payload.data;
- if (interfaces.length > 0) {
- this.props.changeInterfaceId(interfaces[0]._id)
- await this.props.fetchInterfaceData(interfaces[0]._id)
+ let params = this.props.match.params;
+ if(!params.actionId){
+ this.props.history.replace('/project/'+params.id + '/interface/api/' + result.payload.data[0]._id)
}
}
componentWillMount() {
this.handleRequest()
}
-
- onSelect = (item) => {
- this.props.changeInterfaceId(parseInt(item.key, 10))
- this.props.fetchInterfaceData(parseInt(item.key, 10))
- }
-
+
handleAddInterface = (data) => {
data.project_id = this.props.projectId;
axios.post('/api/interface/add', data).then((res) => {
@@ -127,6 +121,7 @@ class InterfaceMenu extends Component {
render() {
const items = [];
+ const matchParams = this.props.match.params;
this.props.list.forEach((item) => {
let color, filter = this.state.filter;
if(filter && item.title.indexOf(filter) === -1 && item.path.indexOf(filter) === -1){
@@ -141,9 +136,10 @@ class InterfaceMenu extends Component {
}
items.push(
+
{item.method}
- {item.title}
+ {item.title}
{this.showConfirm(item._id)}} style={{ display: this.state.delIcon == item._id ? 'block' : 'none' }} className="interface-delete-icon" />
)
@@ -163,7 +159,7 @@ class InterfaceMenu extends Component {
-