Merge remote-tracking branch 'origin/master'

src/components/common/caseNotification/CaseNotification.jsx

@@ -1,67 +0,0 @@
-import React, {Component} from 'react';
-import {Input, Tooltip, Icon, Button} from 'antd';
-import './index.css';
-
-class CaseNotification extends Component {
-
-
-    render() {
-        return (
-            <div>
-                <span className='table-title'> Notification Settings</span>
-                <div className='kind'>
-                    <p><b>Ding Talk</b></p>
-                    <div className='item'>
-                        <p>
-                            <span className='item-title'>
-                                <span>Web hook  </span>
-                                <Tooltip placement="top" title='hahahha'>
-                                    <Icon type="question-circle"/>
-                                </Tooltip>
-                            </span>
-                            <Input style={{width: 900}}/>
-                        </p>
-                        <p>
-                            <span className='item-title'>
-                                <span>Notification Name  </span>
-                                <Tooltip placement="top" title='heheheheh'>
-                                    <Icon type="question-circle"/>
-                                </Tooltip>
-                            </span>
-                            <Input style={{width: 300}}/></p>
-                    </div>
-                </div>
-
-                <div className='kind'>
-                    <p><b>QQ</b></p>
-                    <div className='item'>
-                        <p>
-                            <span className='item-title'>
-                                <span>Web hook  </span>
-                                <Tooltip placement="top" title='hahahha'>
-                                    <Icon type="question-circle"/>
-                                </Tooltip>
-                            </span>
-                            <Input style={{width: 900}}/>
-                        </p>
-                        <p>
-                            <span className='item-title'>
-                                <span>Notification Name  </span>
-                                <Tooltip placement="top" title='heheheheh'>
-                                    <Icon type="question-circle"/>
-                                </Tooltip>
-                            </span>
-                            <Input style={{width: 300}}/></p>
-                    </div>
-                </div>
-
-                <Button type="primary" onClick={() => {
-                    console.log('hello');
-                }}>SUBMIT</Button>
-            </div>
-        )
-
-    }
-}
-
-export default CaseNotification;

src/components/common/caseNotification/index.css

@@ -1,27 +0,0 @@
-.table-title {
-  font-weight: bold;
-  font-size: large;
-  display: block;
-  height: 35px;
-}
-
-.table-title::before {
-  content: '|';
-  display: inline-block;
-  font-weight: 900;
-  color: #0B7FC7;
-  /*border-right: */
-}
-
-.kind {
-  margin-top: 20px;
-}
-
-.item {
-
-}
-
-.item-title {
-  display: inline-block;
-  width: 180px;
-}

src/components/common/deploy/index.css

@@ -52,4 +52,17 @@ p.show {
     color: #ffffff;
     font-weight: bold;
     padding-top: 500px;
+}
+
+.kind {
+
+}
+
+.item {
+
+}
+
+.item-title {
+    display: inline-block;
+    width: 180px;
 }

src/components/common/deploy/tencent/NotificationCard.js

@@ -0,0 +1,65 @@
+import React, {Component} from 'react';
+import {Input, Tooltip, Icon, Button} from 'antd';
+
+class NotificationCard extends Component {
+
+
+    render() {
+        return (
+            <div>
+                <div className='kind'>
+                    <p><b>Ding Talk</b></p>
+                    <div className='item'>
+                        <p>
+                            <span className='item-title'>
+                                <span>Web hook  </span>
+                                <Tooltip placement="top" title='hahahha'>
+                                    <Icon type="question-circle"/>
+                                </Tooltip>
+                            </span>
+                            <Input style={{width: 400}}/>
+                        </p>
+                        <p>
+                            <span className='item-title'>
+                                <span>Notification Name  </span>
+                                <Tooltip placement="top" title='heheheheh'>
+                                    <Icon type="question-circle"/>
+                                </Tooltip>
+                            </span>
+                            <Input style={{width: 300}}/></p>
+                    </div>
+                </div>
+
+                {/*<div className='kind'>*/}
+                    {/*<p><b>QQ</b></p>*/}
+                    {/*<div className='item'>*/}
+                        {/*<p>*/}
+                            {/*<span className='item-title'>*/}
+                                {/*<span>Web hook  </span>*/}
+                                {/*<Tooltip placement="top" title='hahahha'>*/}
+                                    {/*<Icon type="question-circle"/>*/}
+                                {/*</Tooltip>*/}
+                            {/*</span>*/}
+                            {/*<Input style={{width: 600}}/>*/}
+                        {/*</p>*/}
+                        {/*<p>*/}
+                            {/*<span className='item-title'>*/}
+                                {/*<span>Notification Name  </span>*/}
+                                {/*<Tooltip placement="top" title='heheheheh'>*/}
+                                    {/*<Icon type="question-circle"/>*/}
+                                {/*</Tooltip>*/}
+                            {/*</span>*/}
+                            {/*<Input style={{width: 300}}/></p>*/}
+                    {/*</div>*/}
+                {/*</div>*/}
+
+                <Button type="primary" onClick={() => {
+                    console.log('hello');
+                }}>save</Button>
+            </div>
+        )
+
+    }
+}
+
+export default NotificationCard;

src/components/common/deploy/tencent/TencentConfig.js

@@ -3,6 +3,7 @@ import {Row, Col, Card, Button} from 'antd';
 import APIGroupCard from './APIGroupCard';
 import APIPathCard from './APIPathCard';
 import DeployCard from './DeployCard';
+import NotificationCard from './NotificationCard';
 
 import {SHOW_DEPLOY, SHOW_APIGWGROUP, SHOW_APIGWPATH} from "../../../gql";
 import {request} from 'graphql-request'
@@ -78,7 +79,8 @@ class TencentConfig extends Component {
                         <Col span={14}>
                             <Card title="Deploy" style={{marginBottom: 10}}><DeployCard deploy={this.state.currentDeploy} switchRegion={this.switchRegion} region={this.state.region} schemaName={this.props.schemaName} userID={this.props.userID} cloudID={this.props.cloudID} pass={this.pass}/></Card>
                             <Card title="API Group" style={{marginBottom: 10}}><APIGroupCard group={this.state.currentGroup} switchRegion={this.switchRegion} region={this.state.region} userID={this.props.userID} cloudID={this.props.cloudID} pass={this.pass}/></Card>
-                            <Card title="API Path"><APIPathCard path={this.state.currentPath} schemaName={this.props.schemaName} userID={this.props.userID} deployID={this.state.currentDeploy? this.state.currentDeploy.id : this.state.deployIdPassToPath} groupID={this.state.currentGroup? this.state.currentGroup.id : this.state.groupIdPassToPath}/></Card>
+                            <Card title="API Path" style={{marginBottom: 10}}><APIPathCard path={this.state.currentPath} schemaName={this.props.schemaName} userID={this.props.userID} deployID={this.state.currentDeploy? this.state.currentDeploy.id : this.state.deployIdPassToPath} groupID={this.state.currentGroup? this.state.currentGroup.id : this.state.groupIdPassToPath}/></Card>
+                            <Card title="Notification"><NotificationCard userID={this.props.userID}/></Card>
                         </Col>
                         <Col offset={2} span={6}>
                             <Button type='primary'>deploy it</Button>

src/components/common/deploy的副本-没用到的代码/Deploy.jsx

@@ -1,155 +0,0 @@
-import React, {Component} from 'react';
-import {Row, Col, Input, Spin, Button} from 'antd';
-
-import {Mutation, Query} from "react-apollo";
-import {SHOW_CLOUD, SHOW_DEPLOY, SHOW_APIGWGROUP} from "../../gql";
-import gql from "graphql-tag";
-import './index.css';
-import TencentDeploy from './tencent/TencentDeploy';
-import TencentAPIGroup from './tencent/TencentAPIGroup';
-
-const Search = Input.Search;
-
-
-class Deploy extends Component {
-    constructor(props) {
-        super(props);
-        this.state = {
-            show: 'all',
-            deploy: '',
-            apiGroup: ''
-        };
-    }
-
-
-    findDeploy = (id, data) => {
-        return () => {
-            this.setState({
-                show: 'deploy',
-                deploy: data.deploy_by_props.find(deploy => deploy.id === id)
-            })
-        };
-    };
-
-    findApiGroup = (id, data) => {
-        return () => {
-            this.setState({
-                show: 'api',
-                apiGroup: data.apiGWGroup_by_props.find(group => group.id === id)
-            })
-        };
-    };
-
-    reDisplayChoose = () => {
-        this.setState({
-            show: 'all'
-        })
-    };
-
-
-    render() {
-        let userID = this.props.userID;
-        return (
-            <div>
-                {
-                    this.state.show === 'all' ?
-                        <Query query={gql(SHOW_CLOUD)} variables={{user_id: userID}}>
-                            {
-                                ({loading, error, data}) => {
-                                    if (loading) {
-                                        return <Spin style={{marginLeft: 3}}/>
-                                    }
-                                    if (error) {
-                                        return 'error!';
-                                    }
-                                    return (
-                                        data.cloud_by_props.map(cloud => (
-                                            <div key={cloud.id} style={{marginBottom: 30}}>
-                                                <span className='cloud-name'>{cloud.cloudName}: {cloud.id}.</span>
-                                                <div style={{marginBottom: 15}}>
-                                                    <div>
-                                                        ID: <Input style={{width: 250}} value={cloud.secretId}/>
-                                                        Key: <Input style={{width: 250}}
-                                                                    value={cloud.secretKey}/>
-                                                    </div>
-                                                </div>
-
-                                                <Row>
-                                                    <Col span={12}>
-                                                        <b>DEPLOY</b>
-                                                        <Query query={gql(SHOW_DEPLOY)} variables={{cloud_id: cloud.id}}>
-                                                            {
-                                                                ({loading, error, data}) => {
-                                                                    if (loading) {
-                                                                        return <Spin style={{marginLeft: 3}}/>
-                                                                    }
-                                                                    if (error) {
-                                                                        return 'error!';
-                                                                    }
-                                                                    return (
-                                                                        data.deploy_by_props.map(deploy => (
-                                                                            <div key={deploy.id}>
-                                                                                <div>
-                                                                                    {deploy.id} - {deploy.functionName}
-                                                                                    <Button size="small"
-                                                                                            onClick={this.findDeploy(deploy.id, data)}
-                                                                                            type='primary'>Show
-                                                                                        me</Button>
-                                                                                </div>
-                                                                            </div>
-                                                                        ))
-                                                                    )
-                                                                }
-                                                            }
-                                                        </Query>
-                                                    </Col>
-                                                    <Col span={12}>
-                                                        <b>API</b>
-                                                        <Query query={gql(SHOW_APIGWGROUP)} variables={{cloud_id: cloud.id}}>
-                                                            {
-                                                                ({loading, error, data}) => {
-                                                                    if (loading) {
-                                                                        return <Spin style={{marginLeft: 3}}/>
-                                                                    }
-                                                                    if (error) {
-                                                                        return 'error!';
-                                                                    }
-                                                                    return (
-                                                                        data.apiGWGroup_by_props.map(apiGroup => (
-                                                                            <div key={apiGroup.id}>
-                                                                                <div>
-                                                                                    {apiGroup.id} - {apiGroup.groupName}
-                                                                                    <Button size="small"
-                                                                                            onClick={this.findApiGroup(apiGroup.id, data)}
-                                                                                            type='primary'>Show
-                                                                                        me</Button>
-                                                                                </div>
-                                                                            </div>
-                                                                        ))
-                                                                    )
-                                                                }
-                                                            }
-                                                        </Query>
-                                                    </Col>
-                                                </Row>
-                                            </div>
-                                        ))
-                                    );
-                                }
-                            }
-
-                        </Query>
-                        :
-                        this.state.show === 'deploy' ?
-                            <TencentDeploy reDisplayChoose={this.reDisplayChoose} deploy={this.state.deploy}/>
-                            :
-                            <TencentAPIGroup reDisplayChoose={this.reDisplayChoose} apiGroup={this.state.apiGroup}/>
-                }
-            </div>
-
-        )
-    }
-
-}
-
-export default Deploy;

src/components/common/deploy的副本-没用到的代码/index.css

@@ -1,46 +0,0 @@
-.current {
-    background-color: #0F83E8;
-    color: white;
-    text-align: center;
-    height: 50px;
-    line-height: 50px;
-    margin-top: 3px;
-}
-
-.title {
-    font-weight: bold;
-    font-size: 16px;
-    margin: 10px 0 0 5px;
-}
-
-p.show {
-    margin: 5px 0 3px 10px;
-    cursor: pointer;
-}
-
-.table-title {
-    font-weight: bold;
-    font-size: large;
-    display: block;
-    height: 35px;
-}
-
-.table-title::before {
-    content: '|';
-    display: inline-block;
-    font-weight: 900;
-    color: #0B7FC7;
-    /*border-right: */
-}
-
-.vice-title {
-    width: 120px;
-    display: inline-block;
-}
-
-.cloud-name {
-    font-weight: bold;
-    font-size: large;
-    display: block;
-    height: 35px;
-}

src/components/common/deploy的副本-没用到的代码/tencent/TencentAPIGroup.js

@@ -1,123 +0,0 @@
-import React, {Component} from 'react';
-
-import {Input, Select, Button, Row, Col, Spin} from 'antd';
-import TencentAPIPath from './TencentAPIPath';
-import {SHOW_APIGWPATH} from "../../../gql";
-import {Mutation, Query} from "react-apollo";
-
-const Option = Select.Option;
-
-class TencentAPIGroup extends Component {
-    constructor(props) {
-        super(props);
-        this.state = {
-            configs: ['groupName', 'region', 'frontType', 'defaultDomain', 'userDomain', 'userStatus'],
-            id: props.apiGroup.id,
-            groupName: props.apiGroup.groupName,
-            region: props.apiGroup.region,
-            frontType: props.apiGroup.frontType,
-            defaultDomain: props.apiGroup.defaultDomain,
-            userDomain: props.apiGroup.userDomain,
-            userStatus: props.apiGroup.userStatus,
-            show: 'all',
-            apiPath: ''
-        };
-    }
-
-    findAPIPath = (id, data) => {
-        return () => {
-            this.setState({
-                show: 'apiPath',
-                apiPath: data.apiGWPath_by_props.find(apiPath => apiPath.id === id)
-            })
-        };
-    };
-
-    reDisplayChoosePath = () => {
-        this.setState({
-            show: 'all'
-        })
-    };
-
-    switchConfig = (label) => {
-        return (e) => {
-            this.setState({
-                [label]: e.target.value
-            })
-        };
-    };
-
-    componentWillReceiveProps(next) {
-        this.setState({
-            id: next.apiGroup.id,
-            groupName: next.apiGroup.groupName,
-            region: next.apiGroup.region,
-            frontType: next.apiGroup.frontType,
-            defaultDomain: next.apiGroup.defaultDomain,
-            userDomain: next.apiGroup.userDomain,
-            userStatus: next.apiGroup.userStatus,
-        });
-    };
-
-    render() {
-        return (
-            <div style={{margin: 20}}>
-
-
-                <div onClick={this.props.reDisplayChoose} style={{marginBottom: 30}}> back to choose</div>
-                <div>
-                    <span className='table-title'> API Group Config</span>
-                    {
-                        this.state.configs.map(config => (
-                            <div key={config} style={{marginBottom: 10}}>
-                                <span className='vice-title'>{config}: </span>
-                                <Input value={this.state[config]} style={{width: 200}}
-                                       onChange={this.switchConfig(config)}/>
-                            </div>
-                        ))
-                    }
-
-                </div>
-
-                <div>
-                    <span className='table-title'> API Path Config</span>
-                    {
-
-                        this.state.show === 'all'?
-                            <Query query={SHOW_APIGWPATH} variables={{apiGWGroup_id: this.state.id}}>
-                                {
-                                    ({loading, error, data}) => {
-                                        if (loading) {
-                                            return <Spin style={{marginLeft: 3}}/>
-                                        }
-                                        if (error) {
-                                            return 'error!';
-                                        }
-                                        return (
-                                            data.apiGWPath_by_props.map(apiPath => (
-                                                <div key={apiPath.id}>
-                                                    <div>
-                                                        {apiPath.id} - {apiPath.apiGWName}
-                                                        <Button size="small"
-                                                                onClick={this.findAPIPath(apiPath.id, data)}
-                                                                type='primary'>Show
-                                                            me</Button>
-                                                    </div>
-                                                </div>
-                                            ))
-                                        )
-                                    }
-                                }
-                            </Query>
-                            :
-                            <TencentAPIPath apiPath={this.state.apiPath} reDisplayChoosePath={this.reDisplayChoosePath}/>
-                    }
-                </div>
-
-
-            </div>
-        )
-    }
-}
-
-export default TencentAPIGroup;

src/components/common/deploy的副本-没用到的代码/tencent/TencentAPIPath.js

@@ -1,55 +0,0 @@
-import React, {Component} from 'react';
-
-import {Input, Select, Button, Row, Col} from 'antd';
-
-const Option = Select.Option;
-
-class TencentAPIPath extends Component {
-    constructor(props) {
-        super(props);
-        this.state = {
-            configs: ['apiGWName', 'apiGWDesc', 'requestMethod'],
-            apiGWName: props.apiPath.apiGWName,
-            apiGWDesc: props.apiPath.apiGWDesc,
-            requestMethod: props.apiPath.requestMethod,
-        };
-    }
-
-    switchConfig = (label) => {
-        return (e) => {
-            this.setState({
-                [label]: e.target.value
-            })
-        };
-    };
-
-    componentWillReceiveProps(next) {
-        this.setState({
-            apiGWName: next.apiPath.apiGWName,
-            apiGWDesc: next.apiPath.apiGWDesc,
-            requestMethod: next.apiPath.requestMethod,
-        });
-    };
-
-    render() {
-        return (
-            <div style={{margin: 20}}>
-                <div onClick={this.props.reDisplayChoosePath} style={{marginBottom: 30}}> back to choose</div>
-                <div>
-                    {
-                        this.state.configs.map(config => (
-                            <div key={config} style={{marginBottom: 10}}>
-                                <span className='vice-title'>{config}: </span>
-                                <Input value={this.state[config]} style={{width: 200}}
-                                       onChange={this.switchConfig(config)}/>
-                            </div>
-                        ))
-                    }
-
-                </div>
-            </div>
-        )
-    }
-}
-
-export default TencentAPIPath;

src/components/common/deploy的副本-没用到的代码/tencent/TencentDeploy.jsx

@@ -1,70 +0,0 @@
-import React, {Component} from 'react';
-
-import {Input, Select, Button, Row, Col} from 'antd';
-
-const Option = Select.Option;
-
-class TencentDeploy extends Component {
-    constructor(props) {
-        super(props);
-        this.state = {
-            configs: ['functionName', 'region', 'description', 'cosBucketName', 'cosObjectName', 'cosBucketRegion', 'vpcId', 'subnetId'],
-            functionName: props.deploy.functionName,
-            region: props.deploy.region,
-            description: props.deploy.description,
-            cosBucketName: props.deploy.cosBucketName,
-            cosObjectName: props.deploy.cosObjectName,
-            cosBucketRegion: props.deploy.cosBucketRegion,
-            vpcId: props.deploy.vpcId,
-            subnetId: props.deploy.subnetId
-        };
-    }
-
-    switchConfig = (label) => {
-        return (e) => {
-            this.setState({
-                [label]: e.target.value
-            })
-        };
-    };
-
-    componentWillReceiveProps(next) {
-        this.setState({
-            functionName: next.deploy.functionName,
-            region: next.deploy.region,
-            description: next.deploy.description,
-            cosBucketName: next.deploy.cosBucketName,
-            cosObjectName: next.deploy.cosObjectName,
-            cosBucketRegion: next.deploy.cosBucketRegion,
-            vpcId: next.deploy.vpcId,
-            subnetId: next.deploy.subnetId
-        });
-    };
-
-    render() {
-        return (
-            <div style={{margin: 20}}>
-
-
-                <div onClick={this.props.reDisplayChoose} style={{marginBottom: 30}}> back to choose</div>
-                <div>
-                    <span className='table-title'> Deploy Config</span>
-                    {
-                        this.state.configs.map(config => (
-                            <div key={config} style={{marginBottom: 10}}>
-                                <span className='vice-title'>{config}: </span>
-                                <Input value={this.state[config]} style={{width: 200}}
-                                       onChange={this.switchConfig(config)}/>
-                            </div>
-                        ))
-                    }
-
-                </div>
-
-
-            </div>
-        )
-    }
-}
-
-export default TencentDeploy;

src/components/trialCase/TrialCase.jsx

@@ -6,7 +6,6 @@ import Deploy from '../common/deploy/Deploy';
 import Config from '../common/config/Config';
 import Schema from '../common/schema/Schema';
 import Graphql from "../common/graphql/Graphql";
-import CaseNotification from "../common/caseNotification/CaseNotification";
 import CaseMetabase from "../common/caseMetabase/CaseMetabase";
 import axios from 'axios';
 
@@ -67,7 +66,6 @@ class TrialCase extends Component {
                     <Menu.Item key="graphql">graphql</Menu.Item>
                     <Menu.Item key="graphiql">graphql IDE</Menu.Item>
                     <Menu.Item key="metabase">metabase</Menu.Item>
-                    <Menu.Item key="notification">notification</Menu.Item>
                 </Menu>
 
 
@@ -88,8 +86,6 @@ class TrialCase extends Component {
                                         return <Graphql/>;
                                     case 'metabase':
                                         return <CaseMetabase/>;
-                                    case 'notification':
-                                        return <CaseNotification/>;
                                     default:
                                         return <Graphql/>
                                 }