graphql ide 切换 ok

src/app/graphqlService/TrialCase.jsx

@@ -91,7 +91,7 @@ class TrialCase extends Component {
                                     case 'manage':
                                         return <Manage trialcase={true} userID={this.state.userID} projectID={projectID} switchMenu={this.switchMenu} switchAPI={this.switchAPI}/>;
                                     case 'graphiql':
-                                        return <Graphql api={this.state.api}/>;
+                                        return <Graphql api={this.state.api} projectID={projectID}/>;
                                     case 'template':
                                         return <GenerateJs schemaID={schemaID} schemaName={schemaName}/>;
                                     case 'preview':

src/app/graphqlService/UserCreate.jsx

@@ -86,7 +86,7 @@ class UserCreate extends Component {
                                     case 'manage':
                                         return <Manage trialcase={false} userID={this.state.userID} projectID={projectID} switchMenu={this.switchMenu} switchAPI={this.switchAPI}/>;
                                     case 'graphiql':
-                                        return <Graphql api={this.state.api}/>;
+                                        return <Graphql api={this.state.api} projectID={projectID}/>;
                                     case 'template':
                                         return <GenerateJs schemaID={schemaID} schemaName={schemaName}/>;
                                     case 'metabase':

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

@@ -1,22 +1,25 @@
 import React, {Component} from 'react';
-import {Input, Alert} from 'antd';
+import {Input, Spin} from 'antd';
 import GraphiQL from "graphiql";
 import fetch from "isomorphic-fetch";
-import {graphqlUrl} from "../../../../config";
+import gql from "graphql-tag";
+import {Query} from "react-apollo";
 
-class Graphql extends Component {
+import {GET_PROJECT} from "../../../../gql";
 
+class Graphql extends Component {
     constructor(props) {
         super(props);
         this.state = {
-            api: props.api ? props.api : 'http://service-cbcf74bl-1254337200.ap-shanghai.apigateway.myqcloud.com/test/graphql'
-
-        }
+            api: props.api,
+            show: false
+        };
     };
 
     componentWillReceiveProps(next) {
         this.setState({
-            api: next.api ? next.api : 'http://service-cbcf74bl-1254337200.ap-shanghai.apigateway.myqcloud.com/test/graphql'
+            api: next.api,
+            show: false
         })
     }
 
@@ -30,16 +33,46 @@ class Graphql extends Component {
     };
 
     render() {
+        let projectID = this.props.projectID ? this.props.projectID : 'ecommerce_projectID';
         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>
+            <Query query={gql(GET_PROJECT)} variables={{id: projectID}}>
+                {
+                    ({loading, error, data}) => {
+                        if (loading) {
+                            return <Spin style={{marginLeft: 3}}/>
+                        }
+                        if (error) {
+                            return 'error!';
+                        }
+                        console.log(data);
+                        let group = data.project_by_id.apiGWGroup_id;
+                        if (this.state.api === '') {
+                            this.setState({
+                                // 多路径没做
+                                api: group.frontType.slice(0, 4) + '://' + group.defaultDomain +'/'+ group.environmentName + '/graphql',
+                                show: true
+                            })
+                        }
+                        return (
+                            <div>
+                                <Input
+                                    style={{marginTop: 10}}
+                                    addonBefore="POST"
+                                    defaultValue={this.state.api}
+                                    onChange={(e) => {
+                                        this.setState({api: e.target.value})
+                                    }}/>
+                                {
+                                    this.state.show?
+                                        <GraphiQL fetcher={this.graphQLFetcher}/>
+                                        :
+                                        ''
+                                }
+                            </div>
+                        )
+                    }
+                }
+            </Query>
         )
     }