从调试跳转 ok

src/app/common/manage/Manage.jsx

@@ -40,7 +40,7 @@ class Manage extends Component {
 
     render() {
         const contentListNoTitle = {
-            tencent: <TencentResult userID={this.props.userID} projectID={this.props.projectID} trialcase={this.props.trialcase}/>,
+            tencent: <TencentResult userID={this.props.userID} projectID={this.props.projectID} trialcase={this.props.trialcase} switchMenu={this.props.switchMenu} switchAPI={this.props.switchAPI}/>,
             aliyun: <AliyunResult/>,
             amazon: <AmazonResult/>,
         };

src/app/common/manage/TencentResult.js

@@ -1,15 +1,14 @@
 import React, {Component} from 'react';
 import {Switch, Input, Icon, Spin, Row, Col, message} from 'antd';
-import {GET_PROJECT, SHOW_APIGWPATH} from "../../../gql";
+import {GET_PROJECT, SHOW_APIGWPATH, UPDATE_APIGROUP} from "../../../gql";
 import gql from "graphql-tag";
-import {Query} from "react-apollo";
+import {Query, Mutation} from "react-apollo";
 import copy from 'copy-to-clipboard';
 
 class TencentResult extends Component {
     constructor(props) {
         super(props);
-        this.state = {
-        }
+        this.state = {}
     }
 
     render() {
@@ -24,7 +23,6 @@ class TencentResult extends Component {
                         if (error) {
                             return 'error!';
                         }
-                        // console.log(data);
                         let group = data.project_by_id.apiGWGroup_id || {};
                         return (
                             <div>
@@ -61,14 +59,19 @@ class TencentResult extends Component {
                                                     </Col>
                                                     <Col span={3}>
                                                     <span className={'schema-table-content'}>
-                                                        <SwitchStatus />
+                                                        <SwitchStatus group={group}/>
+                                                        {/*<span className={'schema-table-content name'}>删除</span>*/}
                                                     </span>
                                                     </Col>
                                                 </Row>
                                             </div>
                                             <div style={{marginTop: 30}}>
                                                 <div className={'schema-name'}>API 管理</div>
-                                                <APIGWPathResult groupID={group.id}/>
+                                                <APIGWPathResult
+                                                    group={group}
+                                                    switchMenu={this.props.switchMenu}
+                                                    switchAPI={this.props.switchAPI}
+                                                />
                                             </div>
                                         </div>
                                         :
@@ -89,16 +92,53 @@ class SwitchStatus extends Component {
     constructor(props) {
         super(props);
         this.state = {
-
+            checked: props.group.userStatus === 'open'
         }
     }
 
+    componentWillReceiveProps(next) {
+        this.setState({
+            checked: next.group.userStatus === 'open'
+        })
+    }
+
     render() {
+        let {group} = this.props;
+        let {id, userDomain, groupName, frontType, region, environmentName} = group;
         return (
-            <div>
-                <Switch defaultChecked onChange={(checked) => {
-                    this.setState({checked})
-                }}/>
+            <div style={{display: 'inline', marginRight: '10px'}}>
+                <Mutation
+                    mutation={gql(UPDATE_APIGROUP)}
+                    onCompleted={(data) => {
+                        this.setState({
+                            checked: data.update_apiGWGroup.userStatus === 'open'
+                        })
+                    }}
+                >
+
+                    {(update_apiGWGroup, {loading, error}) => {
+                        if (loading)
+                            return <Spin style={{marginLeft: 30, marginTop: 10}}/>;
+                        if (error)
+                            return 'error';
+                        return (
+                            <Switch checked={this.state.checked} onChange={(checked) => {
+                                update_apiGWGroup({
+                                    variables: {
+                                        id,
+                                        userStatus: checked ? 'open' : 'close',
+                                        userDomain,
+                                        groupName,
+                                        frontType,
+                                        region,
+                                        environmentName,
+                                        updatedAt: new Date().getTime()
+                                    }
+                                })
+                            }}/>
+                        )
+                    }}
+                </Mutation>
             </div>
         )
     }
@@ -107,15 +147,14 @@ class SwitchStatus extends Component {
 class APIGWPathResult extends Component {
     constructor(props) {
         super(props);
-        this.state = {
-
-        }
+        this.state = {}
     }
 
     render() {
-        let {groupID} = this.props;
+        let {group} = this.props;
+        let {id, frontType, defaultDomain} = group;
         return (
-            <Query query={gql(SHOW_APIGWPATH)} variables={{apiGWGroup_id: groupID}}>
+            <Query query={gql(SHOW_APIGWPATH)} variables={{apiGWGroup_id: id}}>
                 {
                     ({loading, error, data}) => {
                         if (loading) {
@@ -156,9 +195,15 @@ class APIGWPathResult extends Component {
                                                                 <span className={'schema-table-content'}>{path.apiGWDesc}</span>
                                                             </Col>
                                                             <Col span={3}>
-                                                                <span className={'schema-table-content name'}>删除</span>
-                                                                <span> </span>
-                                                                <span className={'schema-table-content name'}>调试</span>
+                                                                {/*<span className={'schema-table-content name'}>删除</span>*/}
+                                                                {/*<span> </span>*/}
+                                                                <span className={'schema-table-content name'}
+                                                                      onClick={() => {
+                                                                          this.props.switchMenu('menuLevel2', {key: 'graphiql'});
+                                                                          this.props.switchAPI(frontType.slice(0, 4) + '://' + defaultDomain + path.apiGWPath)
+                                                                      }}>
+                                                                    调试
+                                                                </span>
                                                             </Col>
                                                         </Row>
                                                     </div>

src/app/graphqlService/TrialCase.jsx

@@ -24,7 +24,8 @@ class TrialCase extends Component {
             menuLevel2: "schema",
             // default user
             userID: "ioobot",
-            showPadding: true
+            showPadding: true,
+            api: ''
         }
     }
 
@@ -34,6 +35,12 @@ class TrialCase extends Component {
         });
     };
 
+    switchAPI = (api) => {
+        this.setState({
+            api
+        })
+    };
+
     componentWillMount() {
         let _this = this;
         axios.get(getIdUrl)
@@ -82,9 +89,9 @@ class TrialCase extends Component {
                                     case 'deploy':
                                         return <Deploy trialcase={true} userID={this.state.userID} projectID={projectID}/>;
                                     case 'manage':
-                                        return <Manage trialcase={true} userID={this.state.userID} projectID={projectID}/>;
+                                        return <Manage trialcase={true} userID={this.state.userID} projectID={projectID} switchMenu={this.switchMenu} switchAPI={this.switchAPI}/>;
                                     case 'graphiql':
-                                        return <Graphql/>;
+                                        return <Graphql api={this.state.api}/>;
                                     case 'template':
                                         return <GenerateJs schemaID={schemaID} schemaName={schemaName}/>;
                                     case 'preview':

src/app/graphqlService/UserCreate.jsx

@@ -21,6 +21,7 @@ class UserCreate extends Component {
         this.state = {
             menuLevel2: "schema",
             userID: "",
+            api: 'please select one in manage page'
         }
     }
 
@@ -45,6 +46,11 @@ class UserCreate extends Component {
         });
     };
 
+    switchAPI = (api) => {
+        this.setState({
+            api
+        })
+    };
 
     render() {
         let schemaID = this.props.location.state ? this.props.location.state.schemaID : "ecommerce_schemaID";
@@ -78,9 +84,9 @@ class UserCreate extends Component {
                                     case 'deploy':
                                         return <Deploy trialcase={false} userID={this.state.userID} projectID={projectID}/>;
                                     case 'manage':
-                                        return <Manage trialcase={false} userID={this.state.userID} projectID={projectID}/>;
+                                        return <Manage trialcase={false} userID={this.state.userID} projectID={projectID} switchMenu={this.switchMenu} switchAPI={this.switchAPI}/>;
                                     case 'graphiql':
-                                        return <Graphql/>;
+                                        return <Graphql api={this.state.api}/>;
                                     case 'template':
                                         return <GenerateJs schemaID={schemaID} schemaName={schemaName}/>;
                                     case 'metabase':

src/app/graphqlService/component/generateJs/GenerateJs.jsx

@@ -59,8 +59,8 @@ class GenerateJs extends Component {
         this._isMounted = true;
         let _this = this;
         let {schemaID} = this.state;
-        axios.get(`${genJsUrl}?schema=${'schema_1544405636137_14283164'}`)
-        // axios.get(`${genJsUrl}?schema=${schemaID}`)
+        // axios.get(`${genJsUrl}?schema=${'schema_1544405636137_14283164'}`)
+        axios.get(`${genJsUrl}?schema=${schemaID}`)
             .then((res) => {
                 if(this._isMounted){
                     if (res.data !== '') {
@@ -107,8 +107,8 @@ class GenerateJs extends Component {
         // console.log('mutationList',mutationList);
         return (
             <div>
-                <Alert message="online 数据库，非开发环境请移除"
-                       type="warning" banner closable style={{marginBottom: 10}}/>
+                {/*<Alert message="online 数据库，非开发环境请移除"*/}
+                       {/*type="warning" banner closable style={{marginBottom: 10}}/>*/}
                 <Tabs
                     defaultActiveKey="query"
                     tabPosition="left"

src/app/graphqlService/component/graphql/Graphql.jsx

@@ -1,47 +1,53 @@
 import React, {Component} from 'react';
-import { Input, Alert} from 'antd';
+import {Input, Alert} from 'antd';
 import GraphiQL from "graphiql";
 import fetch from "isomorphic-fetch";
 import {graphqlUrl} from "../../../../config";
 
 class Graphql extends Component {
 
-  constructor() {
-    super();
-    this.state = {
-      // api: 'http://service-hnqzcew1-1254337200.ap-beijing.apigateway.myqcloud.com/release/graphql',
-      // api: 'http://service-4i9xdoqo-1254337200.ap-guangzhou.apigateway.myqcloud.com/release/graphql',
-      // api: 'http://service-ci2tk8iu-1254337200.ap-guangzhou.apigateway.myqcloud.com/release/graphql',
-      // 便于开发调试，请删除并换成上面
-      api: graphqlUrl
-      // api: 'http://service-28dm054z-1254337200.ap-shanghai.apigateway.myqcloud.com/release/graphql'
-      // api: 'http://service-acb8p44v-1254337200.ap-beijing.apigateway.myqcloud.com/release/graphql'
+    constructor(props) {
+        super(props);
+        this.state = {
+            // api: 'http://service-hnqzcew1-1254337200.ap-beijing.apigateway.myqcloud.com/release/graphql',
+            // api: 'http://service-4i9xdoqo-1254337200.ap-guangzhou.apigateway.myqcloud.com/release/graphql',
+            // api: 'http://service-ci2tk8iu-1254337200.ap-guangzhou.apigateway.myqcloud.com/release/graphql',
+            // 便于开发调试，请删除并换成上面
+            api: props.api ? props.api : 'http://service-7po2y2xb-1254337200.ap-beijing.apigateway.myqcloud.com/graphql'
+            // api: 'http://service-28dm054z-1254337200.ap-shanghai.apigateway.myqcloud.com/release/graphql'
+            // api: 'http://service-acb8p44v-1254337200.ap-beijing.apigateway.myqcloud.com/release/graphql'
 
+        }
+    };
+
+    componentWillReceiveProps(next) {
+        this.setState({
+            api: next.api ? next.api : 'http://service-7po2y2xb-1254337200.ap-beijing.apigateway.myqcloud.com/graphql'
+        })
+    }
+
+    graphQLFetcher = (graphQLParams) => {
+        // 已经存在的 magazine api， 设想: 用户生成 schema，返回 api 自动替换这里
+        return fetch(this.state.api, {
+            method: 'post',
+            headers: {'Content-Type': 'application/json'},
+            body: JSON.stringify(graphQLParams),
+        }).then(response => response.json());
+    };
+
+    render() {
+        return (
+            <div>
+                {/*<Alert message="online 数据库，非开发环境请移除"*/}
+                       {/*type="warning" banner closable/>*/}
+                <Input style={{marginTop: 10}} addonBefore="POST" defaultValue={this.state.api}
+                       onChange={(e) => {
+                           this.setState({api: e.target.value})
+                       }}/>
+                <GraphiQL fetcher={this.graphQLFetcher}/>
+            </div>
+        )
     }
-  };
-
-  graphQLFetcher = (graphQLParams) => {
-    // 已经存在的 magazine api， 设想: 用户生成 schema，返回 api 自动替换这里
-    return fetch(this.state.api, {
-      method: 'post',
-      headers: {'Content-Type': 'application/json'},
-      body: JSON.stringify(graphQLParams),
-    }).then(response => response.json());
-  };
-
-  render() {
-    return (
-      <div>
-        <Alert message="online 数据库，非开发环境请移除"
-               type="warning" banner closable/>
-        <Input style={{marginTop: 10}} addonBefore="POST" defaultValue={this.state.api}
-               onChange={(e) => {
-                 this.setState({api: e.target.value})
-               }}/>
-        <GraphiQL fetcher={this.graphQLFetcher}/>
-      </div>
-    )
-  }
 
 }
 

src/app/wechatService/WxTrialCase.js

@@ -57,7 +57,7 @@ class WxTrialCase extends Component {
                                 case 'wechat-deploy':
                                     return <WxDeploy trialcase={true} userID={this.state.userID} configID={configID}/>;
                                 case 'wechat-manage':
-                                    return <Manage trialcase={true} userID={this.state.userID} configID={configID}/>;
+                                    return <Manage trialcase={true} userID={this.state.userID} configID={configID} switchMenu={this.switchMenu}/>;
                                 default:
                                     return <WxConfig/>
                             }

src/app/wechatService/WxUserCreate.js

@@ -78,7 +78,7 @@ class WxUserCreate extends Component {
                                 case 'wechat-deploy':
                                     return <WxDeploy trialcase={false} userID={this.state.userID} configID={configID}/>;
                                 case 'wechat-manage':
-                                    return <Manage trialcase={false} userID={this.state.userID} configID={configID}/>;
+                                    return <Manage trialcase={false} userID={this.state.userID} configID={configID} switchMenu={this.switchMenu}/>;
                                 default:
                                     return <WxConfig/>
                             }

src/gql.js

@@ -606,7 +606,6 @@ const SHOW_APIGWGROUP = `
                     defaultDomain
                     userStatus
                     userDomain
-                   
                 }
             }
         `;
@@ -630,6 +629,7 @@ const ADD_APIGROUP = `
                     serviceId: $serviceId
                 ) {
                     id
+                    userStatus
                 }
             }
         `;
@@ -647,6 +647,7 @@ const UPDATE_APIGROUP = `
                     updatedAt: $updatedAt
                 ) {
                     id
+                    userStatus
                 }
             }
         `;