Bläddra i källkod

增加管理页面

xy 7 år sedan
förälder
incheckning
65d4811774
3 ändrade filer med 152 tillägg och 21 borttagningar
  1. 1 1
      src/app/App.jsx
  2. 148 20
      src/app/common/manage/TencentResult.js
  3. 3 0
      src/gql.js

+ 1 - 1
src/app/App.jsx

@@ -363,7 +363,7 @@ class GraphqlSidebar extends Component {
                     ({loading, error, data}) => {
                         if (loading) return <Spin style={{marginLeft: 3}}/>;
                         if (error) return 'error!';
-                        console.log('CASE_SCHEMA_AND_PROJECT data', data);
+                        // console.log('CASE_SCHEMA_AND_PROJECT data', data);
                         localStorage.setItem('ecommerce', data.caseProject.find(project => project.schema_id.schemaName === 'ecommerce').schema_id.schemaData);
                         localStorage.setItem('subscribe', data.caseProject.find(project => project.schema_id.schemaName === 'subscribe').schema_id.schemaData);
                         localStorage.setItem('bills', data.caseProject.find(project => project.schema_id.schemaName === 'bills').schema_id.schemaData);

+ 148 - 20
src/app/common/manage/TencentResult.js

@@ -1,5 +1,9 @@
 import React, {Component} from 'react';
-import {Switch, Input, Icon} from 'antd';
+import {Switch, Input, Icon, Spin, Row, Col, message} from 'antd';
+import {GET_PROJECT, SHOW_APIGWPATH} from "../../../gql";
+import gql from "graphql-tag";
+import {Query} from "react-apollo";
+import copy from 'copy-to-clipboard';
 
 class TencentResult extends Component {
     constructor(props) {
@@ -11,28 +15,152 @@ class TencentResult extends Component {
     }
 
     render() {
+        let projectID = this.props.projectID ? this.props.projectID : 'ecommerce_projectID';
         return (
-            <div>
-                <div style={{width: 300}}>
-                    <span>Tencent</span>
-                    <span>URL: </span>
-                    <Input
-                        placeholder="display your URL"
-                        prefix={<Icon type="copy"/>}
-                        value={this.state.url}
-                        onChange={() => {}}
-                        disabled={!this.state.checked}
-                    />
-                </div>
-                <div style={{marginTop: 30}}>
-                    <span>fc switch </span>
-                    <Switch defaultChecked onChange={(checked) => {
-                        this.setState({checked})
-                    }}/>
-                </div>
-            </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 || {};
+                        return (
+                            <div>
+                                {
+                                    Object.keys(group).length !== 0 ?
+                                        <div>
+                                            <div className={'schema-name'}>服务管理</div>
+                                            <div className={'schema-table-list-title'}>
+                                                <Row>
+                                                    <Col span={4}><span className={'schema-table-title'}>服务名</span></Col>
+                                                    <Col span={10}><span className={'schema-table-title'}>默认域名</span></Col>
+                                                    <Col span={3}><span className={'schema-table-title'}>前端类型</span></Col>
+                                                    <Col span={4}><span className={'schema-table-title'}>发布状态</span></Col>
+                                                    <Col span={3}><span className={'schema-table-title'}>操作</span></Col>
+                                                </Row>
+                                            </div>
+                                            <div className={'schema-table-list-content'}>
+                                                <Row>
+                                                    <Col span={4}>
+                                                        <span className={'schema-table-content'}>{group.serviceId}</span>
+                                                    </Col>
+                                                    <Col span={10}>
+                                                        <span className={'schema-table-content'}>{group.defaultDomain} </span>
+                                                        <Icon type="copy" theme="twoTone" onClick={() => {
+                                                            copy(group.defaultDomain);
+                                                            message.success('复制成功.');
+                                                        }}/>
+                                                    </Col>
+                                                    <Col span={3}>
+                                                        <span className={'schema-table-content'}>{group.frontType}</span>
+                                                    </Col>
+                                                    <Col span={4}>
+                                                        <span className={'schema-table-content'}>{group.environmentName}</span>
+                                                    </Col>
+                                                    <Col span={3}>
+                                                    <span className={'schema-table-content'}>
+                                                        <Switch defaultChecked onChange={(checked) => {
+                                                            this.setState({checked})
+                                                        }}/>
+                                                    </span>
+                                                    </Col>
+                                                </Row>
+                                            </div>
+                                            <div style={{marginTop: 30}}>
+                                                <div className={'schema-name'}>API 管理</div>
+                                                <APIGWPathResult groupID={group.id}/>
+                                            </div>
+
+                                        </div>
+                                        :
+                                        '尚未部署'
+                                }
+                            </div>
+
+                        )
+                    }
+                }
+            </Query>
         )
     }
 }
 
 export default TencentResult;
+
+class APIGWPathResult extends Component {
+    constructor(props) {
+        super(props);
+        this.state = {
+
+        }
+    }
+
+    render() {
+        let {groupID} = this.props;
+        return (
+            <Query query={gql(SHOW_APIGWPATH)} variables={{apiGWGroup_id: groupID}}>
+                {
+                    ({loading, error, data}) => {
+                        if (loading) {
+                            return <Spin style={{marginLeft: 3}}/>
+                        }
+                        if (error) {
+                            return 'error!';
+                        }
+                        let paths = data.apiGWPath_by_props || [];
+                        return (
+                            <div>
+                                {
+                                    Object.keys(paths).length !== 0 ?
+                                        <div>
+                                            <div className={'schema-table-list-title'}>
+                                                <Row>
+                                                    <Col span={6}><span className={'schema-table-title'}>名称</span></Col>
+                                                    <Col span={6}><span className={'schema-table-title'}>路径</span></Col>
+                                                    <Col span={3}><span className={'schema-table-title'}>方法</span></Col>
+                                                    <Col span={6}><span className={'schema-table-title'}>描述</span></Col>
+                                                    <Col span={3}><span className={'schema-table-title'}>操作</span></Col>
+                                                </Row>
+                                            </div>
+                                            {
+                                                paths.map(path => (
+                                                    <div key={path.apiGWPath} className={'schema-table-list-content'}>
+                                                        <Row>
+                                                            <Col span={6}>
+                                                                <span className={'schema-table-content'}>{path.apiGWName}</span>
+                                                            </Col>
+                                                            <Col span={6}>
+                                                                <span className={'schema-table-content'}>{path.apiGWPath}</span>
+                                                            </Col>
+                                                            <Col span={3}>
+                                                                <span className={'schema-table-content'}>{path.requestMethod}</span>
+                                                            </Col>
+                                                            <Col span={6}>
+                                                                <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>
+                                                            </Col>
+                                                        </Row>
+                                                    </div>
+                                                ))
+                                            }
+                                        </div>
+                                        :
+                                        '路径不存在'
+                                }
+                            </div>
+
+                        )
+                    }
+                }
+            </Query>
+        )
+    }
+}

+ 3 - 0
src/gql.js

@@ -659,6 +659,7 @@ const SHOW_APIGWPATH = `
                     apiGWName
                     apiGWDesc
                     requestMethod
+                    apiGWPath
                 }
             }
         `;
@@ -889,6 +890,8 @@ const GET_PROJECT = `
                         defaultDomain
                         userStatus
                         userDomain
+                        serviceId
+                        environmentName
                     }
                     projectName
                     deploy_id {