修改tab bar

src/components/app/App.jsx

@@ -5,16 +5,12 @@ import {BrowserRouter as Router, Route, Link, Switch, Redirect} from "react-rout
 import moment from 'moment';
 import 'moment/locale/zh-cn';
 import { FormattedMessage } from 'react-intl';
+import zhCN from 'antd/lib/locale-provider/zh_CN';
 
-
-import CloudFunction from '../cloudFunction/CloudFunction';
-import MonitorNotify from '../monitorNotify/MonitorNotify';
-import DataAnalysis from '../dataAnalysis/DataAnalysis';
-import DataStorage from '../dataStorage/DataStorage';
+import WechatService from "../wechatService/WechatService";
+import QuantService from "../quantService/QuantService";
 import TrialCase from "../trialCase/TrialCase";
 import Login from "../login/login";
-
-import zhCN from 'antd/lib/locale-provider/zh_CN';
 import '../common/graphql/index.css';
 import './index.css'
 
@@ -89,17 +85,14 @@ class App extends Component {
                             style={{lineHeight: '64px'}}
                             onClick={(e) => this.switchMenu('menuLevel1', e)}
                         >
-                            <Menu.Item key="cloud-function">
-                                <Link to="/cloud-function"><FormattedMessage id="Cloud Function"/></Link>
+                            <Menu.Item key="graphql-service">
+                                <Link to="/"><FormattedMessage id="Graphql Service"/></Link>
                             </Menu.Item>
-                            <Menu.Item key="data-storage">
-                                <Link to="/data-storage/"><FormattedMessage id="Data Storage"/></Link>
+                            <Menu.Item key="wechat-service">
+                                <Link to="/wechat-service/trial-case/wechat case"><FormattedMessage id="Wechat Service"/></Link>
                             </Menu.Item>
-                            <Menu.Item key="data-analysis">
-                                <Link to="/data-analysis/"><FormattedMessage id="Data Analysis"/></Link>
-                            </Menu.Item>
-                            <Menu.Item key="monitor-notification">
-                                <Link to="/monitor-notification/"><FormattedMessage id="Monitor Notification"/></Link>
+                            <Menu.Item key="quantization-service">
+                                <Link to="/quant-service/"><FormattedMessage id="Quantization Service"/></Link>
                             </Menu.Item>
                         </Menu>
 
@@ -117,92 +110,134 @@ class App extends Component {
                         collapsed={this.state.collapsed}
                         onCollapse={this.onCollapse}
                     >
-                        <Menu
-                            theme="dark"
-                            mode="inline"
-                            inlineCollapsed={this.state.inlineCollapsed}
-                            defaultSelectedKeys={['e-commerce']}
-                            defaultOpenKeys={['trial-case']}
-                            // openKeys={['cloud-function']}
-                            onClick={(e) => this.switchMenu('sideBar', e)}
-                            selectedKeys={[this.state.sideBar]}
-                            style={{
-                                borderRight: 0,
-                                overflow: 'auto',
-                                height: '100vh',
-                                left: '0',
-                                width: '200px',
-                                position: 'fixed'
-                            }}
-                        >
-                            <SubMenu key="trial-case" title={<span><Icon type="appstore" theme="twoTone"/><span>Trial Case</span></span>}>
-                                <Menu.Item key="e-commerce"><Link to="/">e-commerce</Link></Menu.Item>
-                                <Menu.Item key="keep accounts"><Link to="/">keep accounts</Link></Menu.Item>
-                                <Menu.Item key="appointment"><Link to="/">appointment</Link></Menu.Item>
-                            </SubMenu>
-
-                            {(() => {
-                                switch (this.state.menuLevel1) {
-                                    case 'cloud-function':
-                                        return (
-                                            <SubMenu
-                                                key="cloud-function"
-                                                title={<span><Icon type="cloud"
-                                                                   theme="twoTone"/><span>Cloud Function</span></span>}>
-                                                <Menu.Item key="wechat-service">wechat-service</Menu.Item>
-                                                <Menu.Item key="graphql-service">graphql-service</Menu.Item>
-                                                <Menu.Item
-                                                    key="quantization-service">quantization-service</Menu.Item>
+                        {(() => {
+                            switch (this.state.menuLevel1) {
+                                case 'graphql-service':
+                                    return (
+                                        <Menu
+                                            theme="dark"
+                                            mode="inline"
+                                            inlineCollapsed={this.state.inlineCollapsed}
+                                            defaultSelectedKeys={['e-commerce']}
+                                            defaultOpenKeys={['trial-case']}
+                                            // openKeys={['cloud-function']}
+                                            onClick={(e) => this.switchMenu('sideBar', e)}
+                                            selectedKeys={[this.state.sideBar]}
+                                            style={{
+                                                borderRight: 0,
+                                                overflow: 'auto',
+                                                height: '100vh',
+                                                left: '0',
+                                                width: '200px',
+                                                position: 'fixed'
+                                            }}
+                                        >
+                                            <SubMenu key="trial-case" title={<span><Icon type="appstore" theme="twoTone"/><span>Trial Case</span></span>}>
+                                                <Menu.Item key="e-commerce"><Link to="/graphql-service/trial-case/e-commerce">e-commerce</Link></Menu.Item>
+                                                <Menu.Item key="keep accounts"><Link to="/graphql-service/trial-case/keep accounts">keep accounts</Link></Menu.Item>
+                                                <Menu.Item key="appointment"><Link to="/graphql-service/trial-case/appointment">appointment</Link></Menu.Item>
                                             </SubMenu>
-                                        );
-                                    case 'data-storage':
-                                        return (
-                                            <SubMenu
-                                                key="data-storage"
-                                                title={<span><Icon type="database"
-                                                                   theme="twoTone"/><span>Data Storage</span></span>}>
-                                                <Menu.Item key="snbl-mongo">snbl-mongo</Menu.Item>
+
+                                            <SubMenu key="my-create"
+                                                     title={<span><Icon type="user" theme="outlined"/><span>My Create</span></span>}>
+                                                <Menu.Item key="my graphql"><Link to="/graphql-service/my-create/my graphql">my graphql</Link></Menu.Item>
                                             </SubMenu>
-                                        );
-                                    case 'data-analysis':
-                                        return (
-                                            <SubMenu
-                                                key="data-analysis"
-                                                title={<span><Icon type="fund"
-                                                                   theme="twoTone"/><span>data Analysis</span></span>}>
-                                                <Menu.Item key="metabase">metabase</Menu.Item>
+                                        </Menu>
+                                    );
+                                case 'wechat-service':
+                                    return (
+                                        <Menu
+                                            theme="dark"
+                                            mode="inline"
+                                            inlineCollapsed={this.state.inlineCollapsed}
+                                            defaultSelectedKeys={['e-commerce']}
+                                            defaultOpenKeys={['trial-case']}
+                                            // openKeys={['cloud-function']}
+                                            onClick={(e) => this.switchMenu('sideBar', e)}
+                                            selectedKeys={[this.state.sideBar]}
+                                            style={{
+                                                borderRight: 0,
+                                                overflow: 'auto',
+                                                height: '100vh',
+                                                left: '0',
+                                                width: '200px',
+                                                position: 'fixed'
+                                            }}
+                                        >
+                                            <SubMenu key="trial-case" title={<span><Icon type="appstore" theme="twoTone"/><span>Trial Case</span></span>}>
+                                                <Menu.Item key="wechat"><Link to="/wechat-service/trial-case/wechat case">wechat case</Link></Menu.Item>
                                             </SubMenu>
-                                        );
-                                    case 'monitor-notification':
-                                        return (
-                                            <SubMenu
-                                                key="monitor-notification"
-                                                title={<span><Icon type="alert" theme="twoTone"/><span>Monitor Notification</span></span>}>
-                                                <Menu.Item key="monitor">monitor</Menu.Item>
-                                                <Menu.Item key="graphql-events">graphql-events</Menu.Item>
-                                                <Menu.Item key="stock-signal">stock-signal</Menu.Item>
+
+                                            <SubMenu key="my-create"
+                                                     title={<span><Icon type="user" theme="outlined"/><span>My Create</span></span>}>
+                                                <Menu.Item key="my wechat"><Link to="/wechat-service/my-create/my wechat">my wechat</Link></Menu.Item>
                                             </SubMenu>
-                                        );
-                                    default:
-                                        return (
-                                            <SubMenu
-                                                key="cloud-function"
-                                                title={<span><Icon type="cloud"
-                                                                   theme="twoTone"/><span>Cloud Function</span></span>}>
-                                                <Menu.Item key="wechat-service">wechat-service</Menu.Item>
-                                                <Menu.Item key="graphql-service">graphql-service</Menu.Item>
-                                                <Menu.Item
-                                                    key="quantization-service">quantization-service</Menu.Item>
+                                        </Menu>
+                                    );
+                                case 'quantization-service':
+                                    return (
+                                        <Menu
+                                            theme="dark"
+                                            mode="inline"
+                                            inlineCollapsed={this.state.inlineCollapsed}
+                                            defaultSelectedKeys={['e-commerce']}
+                                            defaultOpenKeys={['trial-case']}
+                                            // openKeys={['cloud-function']}
+                                            onClick={(e) => this.switchMenu('sideBar', e)}
+                                            selectedKeys={[this.state.sideBar]}
+                                            style={{
+                                                borderRight: 0,
+                                                overflow: 'auto',
+                                                height: '100vh',
+                                                left: '0',
+                                                width: '200px',
+                                                position: 'fixed'
+                                            }}
+                                        >
+                                            <SubMenu key="trial-case" title={<span><Icon type="appstore" theme="twoTone"/><span>Trial Case</span></span>}>
+                                                <Menu.Item key="quant-service"><Link to="/quant-service/">quant case</Link></Menu.Item>
                                             </SubMenu>
-                                        );
-                                }
-                            })()}
-                            <SubMenu key="my-create"
-                                     title={<span><Icon type="user"
-                                                        theme="outlined"/><span>My Create</span></span>}>
-                                <Menu.Item key="8">option9</Menu.Item>
-                            </SubMenu>
-                        </Menu>
+
+                                            <SubMenu key="my-create"
+                                                     title={<span><Icon type="user" theme="outlined"/><span>My Create</span></span>}>
+                                                <Menu.Item key="my quant"><Link to="/quant-service/">my quant</Link></Menu.Item>
+                                            </SubMenu>
+                                        </Menu>
+                                    );
+                                default:
+                                    return (
+                                        <Menu
+                                            theme="dark"
+                                            mode="inline"
+                                            inlineCollapsed={this.state.inlineCollapsed}
+                                            defaultSelectedKeys={['e-commerce']}
+                                            defaultOpenKeys={['trial-case']}
+                                            // openKeys={['cloud-function']}
+                                            onClick={(e) => this.switchMenu('sideBar', e)}
+                                            selectedKeys={[this.state.sideBar]}
+                                            style={{
+                                                borderRight: 0,
+                                                overflow: 'auto',
+                                                height: '100vh',
+                                                left: '0',
+                                                width: '200px',
+                                                position: 'fixed'
+                                            }}
+                                        >
+                                            <SubMenu key="trial-case" title={<span><Icon type="appstore" theme="twoTone"/><span>Trial Case</span></span>}>
+                                                <Menu.Item key="e-commerce"><Link to="/graphql-service/trial-case/e-commerce">e-commerce</Link></Menu.Item>
+                                                <Menu.Item key="keep accounts"><Link to="/graphql-service/trial-case/keep accounts">keep accounts</Link></Menu.Item>
+                                                <Menu.Item key="appointment"><Link to="/graphql-service/trial-case/appointment">appointment</Link></Menu.Item>
+                                            </SubMenu>
+
+                                            <SubMenu key="my-create"
+                                                     title={<span><Icon type="user" theme="outlined"/><span>My Create</span></span>}>
+                                                <Menu.Item key="my graphql"><Link to="/graphql-service/my-create/my graphql">my graphql</Link></Menu.Item>
+                                            </SubMenu>
+                                        </Menu>
+                                    );
+                            }
+                        })()}
                     </Sider>
                     {
                         // todo: 路由如何传值是个问题，包括schema_id, user_id
@@ -211,10 +246,9 @@ class App extends Component {
                         <Layout style={{marginTop: '64px', zIndex: '0'}} key={locale ? locale.locale : 'en'/* Have to refresh for production environment */} >
                             <Switch>
                                 <Route path="/" exact component={TrialCase}/>
-                                <Route path="/cloud-function" component={CloudFunction}/>
-                                <Route path="/data-storage/" component={DataStorage}/>
-                                <Route path="/data-analysis/" component={DataAnalysis}/>
-                                <Route path="/monitor-notification/" component={MonitorNotify}/>
+                                <Route path="/graphql-service/:sidebar/:caseId" component={TrialCase}/>
+                                <Route path="/wechat-service/:sidebar/:caseId" component={WechatService}/>
+                                <Route path="/quant-service/" component={QuantService}/>
                                 <Route path="/login" component={Login}/>
                                 <Redirect path="*" to="/"/>
                             </Switch>

src/components/monitorNotify/MonitorNotify.jsx

@@ -1,62 +0,0 @@
-import React, {Component} from 'react';
-
-import {Layout, Menu} from 'antd';
-import CaseNotification from "../common/caseNotification/CaseNotification";
-import Notification from "./notification/Notification";
-import GraphqlTrigger from "./graphqlTrigger/GraphqlTrigger";
-import StockSignal from "./stockSignal/StockSignal";
-
-const { Content } = Layout;
-
-class MonitorNotify extends Component {
-    constructor() {
-        super();
-        this.state = {
-            menuLevel2: "notification",
-        }
-    }
-
-    switchMenu = (menuName, e) => {
-        console.log('menuName', menuName, 'e', e);
-        this.setState({
-            [menuName]: e.key,
-        });
-    };
-
-    render() {
-        return (
-            <div>
-                <Menu
-                    mode="horizontal"
-                    defaultSelectedKeys={['notification']}
-                    style={{padding: '0 24px', position: 'fixed', width: '100%', zIndex: '1'}}
-                    onClick={(e) => this.switchMenu('menuLevel2', e)}
-                    selectedKeys={[this.state.menuLevel2]}
-                >
-                    <Menu.Item key="notification">notification</Menu.Item>
-                    <Menu.Item key="graphql-trigger">graphql trigger</Menu.Item>
-                    <Menu.Item key="stock-signal">stock signal</Menu.Item>
-                </Menu>
-
-                <Layout style={{ padding: '24px', zIndex: '0'}}>
-                    <Content style={{ padding: '24px', minHeight: 280, background: '#fff',marginTop: '48px'  }}>
-                        {(() => {
-                            switch (this.state.menuLevel2) {
-                                case 'notification':
-                                    return <Notification />;
-                                case 'graphql-trigger':
-                                    return <GraphqlTrigger />;
-                                case 'stock-signal':
-                                    return <StockSignal />;
-                                default:
-                                    return <Notification />
-                            }
-                        })()}
-                    </Content>
-                </Layout>
-            </div>
-        )
-    }
-}
-
-export default MonitorNotify;

src/components/quantService/QuantService.jsx

@@ -0,0 +1,62 @@
+import React, {Component} from 'react';
+
+import {Layout, Menu} from 'antd';
+
+import QuantConfig from "./quantConfig/QuantConfig";
+import Deploy from "../common/deploy/Deploy";
+import QuantManage from "./quantManage/QuantManage";
+
+const { Content } = Layout;
+
+class QuantService extends Component {
+    constructor() {
+        super();
+        this.state = {
+            menuLevel3: "quant-config",
+        }
+    }
+
+    switchMenu = (menuName, e) => {
+        console.log('menuName', menuName, 'e', e);
+        this.setState({
+            [menuName]: e.key,
+        });
+    };
+
+    render() {
+        return (
+            <div>
+                <Menu
+                    mode="horizontal"
+                    defaultSelectedKeys={['quant-config']}
+                    style={{padding: '0 24px', position: 'fixed', width: '100%', zIndex: '1',lineHeight:'50px',fontWeight:600}}
+                    onClick={(e) => this.switchMenu('menuLevel3', e)}
+                    selectedKeys={[this.state.menuLevel3]}
+                >
+                    <Menu.Item key="quant-config">config settings</Menu.Item>
+                    <Menu.Item key="quant-deploy">deploy settings</Menu.Item>
+                    <Menu.Item key="quant-manage">manage</Menu.Item>
+                </Menu>
+
+                <Layout style={{ padding: '24px', zIndex: '0'}}>
+                    <Content style={{ padding: '24px', minHeight: 280, background: '#fff',marginTop: '48px'  }}>
+                        {(() => {
+                            switch (this.state.menuLevel3) {
+                                case 'quant-config':
+                                    return <QuantConfig />;
+                                case 'quant-deploy':
+                                    return <Deploy />;
+                                case 'quant-manage':
+                                    return <QuantManage />;
+                                default:
+                                    return <QuantConfig />
+                            }
+                        })()}
+                    </Content>
+                </Layout>
+            </div>
+        )
+    }
+}
+
+export default QuantService;

src/components/monitorNotify/graphqlTrigger/GraphqlTrigger.jsx → src/components/quantService/quantConfig/QuantConfig.jsx

@@ -1,15 +1,15 @@
 import React, {Component} from 'react';
 
-class GraphqlTrigger extends Component {
+class QuantConfig extends Component {
 
 
     render() {
         return (
             <div>
-                Graphql Trigger
+                Quant Config
             </div>
         )
     }
 }
 
-export default GraphqlTrigger;
+export default QuantConfig;

src/components/monitorNotify/stockSignal/StockSignal.jsx → src/components/quantService/quantManage/QuantManage.jsx

@@ -1,14 +1,14 @@
 import React, {Component} from 'react';
 
-class StockSignal extends Component {
+class QuantManage extends Component {
 
     render() {
         return (
             <div>
-                Stock Signal
+                Quant Manage
             </div>
         )
     }
 }
 
-export default StockSignal;
+export default QuantManage;

src/components/trialCase/TrialCase.jsx

@@ -57,7 +57,7 @@ class TrialCase extends Component {
                 <Menu
                     mode="horizontal"
                     defaultSelectedKeys={['schema']}
-                    style={{padding: '0 24px', position: 'fixed', width: '100%', zIndex: '1'}}
+                    style={{padding: '0 24px', position: 'fixed', width: '100%', zIndex: '1',lineHeight:'50px',fontWeight:600}}
                     onClick={(e) => this.switchMenu('menuLevel2', e)}
                     selectedKeys={[this.state.menuLevel2]}
                 >

src/components/wechatService/WechatService.jsx

@@ -0,0 +1,62 @@
+import React, {Component} from 'react';
+
+import {Layout, Menu} from 'antd';
+
+import WechatConfig from "./wechatConfig/WechatConfig";
+import Deploy from "../common/deploy/Deploy";
+import WechatManage from "./wechatManage/WechatManage";
+
+const { Content } = Layout;
+
+class WechatService extends Component {
+    constructor() {
+        super();
+        this.state = {
+            menuLevel3: "wechat-config",
+        }
+    }
+
+    switchMenu = (menuName, e) => {
+        console.log('menuName', menuName, 'e', e);
+        this.setState({
+            [menuName]: e.key,
+        });
+    };
+
+    render() {
+        return (
+            <div>
+                <Menu
+                    mode="horizontal"
+                    defaultSelectedKeys={['wechat-config']}
+                    style={{padding: '0 24px', position: 'fixed', width: '100%', zIndex: '1',lineHeight:'50px',fontWeight:600}}
+                    onClick={(e) => this.switchMenu('menuLevel3', e)}
+                    selectedKeys={[this.state.menuLevel3]}
+                >
+                    <Menu.Item key="wechat-config">config settings</Menu.Item>
+                    <Menu.Item key="wechat-deploy">deploy settings</Menu.Item>
+                    <Menu.Item key="wechat-manage">manage</Menu.Item>
+                </Menu>
+
+                <Layout style={{ padding: '24px', zIndex: '0'}}>
+                    <Content style={{ padding: '24px', minHeight: 280, background: '#fff',marginTop: '48px'  }}>
+                        {(() => {
+                            switch (this.state.menuLevel3) {
+                                case 'wechat-config':
+                                    return <WechatConfig />;
+                                case 'wechat-deploy':
+                                    return <Deploy />;
+                                case 'wechat-manage':
+                                    return <WechatManage />;
+                                default:
+                                    return <WechatConfig />
+                            }
+                        })()}
+                    </Content>
+                </Layout>
+            </div>
+        )
+    }
+}
+
+export default WechatService;

src/components/monitorNotify/notification/Notification.jsx → src/components/wechatService/wechatConfig/WechatConfig.jsx

@@ -1,15 +1,14 @@
 import React, {Component} from 'react';
 
-class Notification extends Component {
-
+class WechatConfig extends Component {
 
     render() {
         return (
             <div>
-                <p>Notification</p>
+                Wechat Config
             </div>
         )
     }
 }
 
-export default Notification;
+export default WechatConfig;

src/components/wechatService/wechatManage/WechatManage.jsx

@@ -0,0 +1,14 @@
+import React, {Component} from 'react';
+
+class WechatManage extends Component {
+
+    render() {
+        return (
+            <div>
+                Wechat Manage
+            </div>
+        )
+    }
+}
+
+export default WechatManage;

src/language/en_US.js

@@ -1,4 +1,7 @@
 const en_US = {
+    "Graphql Service":"Graphql Service",
+    "Wechat Service":"Wechat Service",
+    "Quantization Service":"Quantization Service",
     "Cloud Function":"Cloud Function",
     "Data Storage":"Data Storage",
     "Data Analysis":"Data Analysis",

src/language/zh_CN.js

@@ -1,4 +1,7 @@
 const zh_CN = {
+    "Graphql Service":"Graphql服务",
+    "Wechat Service":"微信服务",
+    "Quantization Service":"量化交易服务",
     "Cloud Function":"云函数",
     "Data Storage":"数据存储",
     "Data Analysis":"数据分析",