Merge remote-tracking branch 'origin/master'

package.json

@@ -20,6 +20,7 @@
     "case-sensitive-paths-webpack-plugin": "2.1.2",
     "chalk": "2.4.1",
     "classnames": "^2.2.6",
+    "copy-to-clipboard": "^3.0.8",
     "css-loader": "1.0.0",
     "dotenv": "6.0.0",
     "dotenv-expand": "4.2.0",

src/app/App.jsx

@@ -364,22 +364,10 @@ 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);
-                        data.caseProject.forEach((project) => {
-                            switch(project.schema_id.schemaName) {
-                                case 'ecommerce' :
-                                    localStorage.setItem('ecommerce', project.schema_id.schemaData);
-                                    break;
-                                case 'subscribe':
-                                    localStorage.setItem('subscribe', project.schema_id.schemaData);
-                                    break;
-                                case 'bills':
-                                    localStorage.setItem('bills', project.schema_id.schemaData);
-                                    break;
-                                default:
-                                    break;
-                            }
-                        });
+                        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);
                         return (
                             <Menu
                                 theme="dark"

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

@@ -79,7 +79,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/case/BillApp/src/App.css

@@ -85,13 +85,7 @@
     text-align: center;
 }
 
-.myWrap .extra{
-    padding-top: 30px;
-}
 
-.myWrap .am-list{
-    margin: 3px 0;
-}
 
 
 

src/case/BillApp/src/components/My/My.jsx

@@ -42,12 +42,15 @@ export default class My extends Component {
         <NavBars navBarText={this.state.navBarText} changePage={this.props.changePage}/>
         <div className="myWrap">
           <Head name="王刘永" icon="https://wx.qlogo.cn/mmopen/vi_32/WVmxTicpGCIAM13MBzSQTbqicMaWJNVpDqKHO9aC3SAdrSACCBcwOhIFSOeUY99iay8xlEkibhK0TaHElgtoBF1gzg/132"/>
+          <div style={{height:"30px"}}></div>
           <Lists callback={this.myAccount} text="我的账户" icon="https://wly-1254337200.cos.ap-guangzhou.myqcloud.com/bill.svg"/>
+          <div style={{height:"10px"}}></div>
           <Lists callback={this.myAssets} text="资产管理" icon="https://wly-1254337200.cos.ap-guangzhou.myqcloud.com/assets.svg"/>
-          <div className="extra">
-            <Lists callback={this.contactServer} text="联系客服"/>
-            <Lists callback={this.feedback} text="意见反馈"/>
-          </div>
+          <div style={{height:"20px"}}></div>
+          <Lists callback={this.contactServer} text="联系客服"/>
+          <div style={{height:"10px"}}></div>
+          <Lists callback={this.feedback} text="意见反馈"/>
+        
         </div>
       </div>
     )

src/case/OrderApp/src/App.css

@@ -27,8 +27,8 @@
     z-index:2;
 }
 
-.orderApp  div.am-navbar{
-    background-color: black;
+.orderApp  .listText{
+    font-size: 14px;
 }
 
 
@@ -36,3 +36,4 @@
 
 
 
+

src/case/OrderApp/src/components/HomePage/Cards.css

@@ -1,45 +0,0 @@
-*{
-    box-sizing: border-box;
-}
-
-div.Card{
-    font-size:15px;
-}
-.sidebar{
-    flex-grow:1;
-    flex-basis:178px;
-    
-}
-div.imgWrap{
-    text-align: left;
-    flex-basis:145px;
-}
-.bodyWrap{
-   display: flex; 
-}
-
-.p1{
-    text-align: left;
-    color: #108ee9;
-    font-size: 14px;
-}
-
-.p2{
-    text-align: left;
-    font-size: 12px;
-}
-
-.buttonWrap{
-    flex-basis:30px;
-    display: flex;
-    align-items: center;
-}
-
-
-.button{
-    width: 42px;
-    height: 42px;
-    border-radius: 50%;
-    border: none;
-    background: #d24a58;
-}

src/case/OrderApp/src/components/HomePage/Cards.jsx

@@ -1,65 +0,0 @@
-import React, { Component } from 'react';
-import { Card, WingBlank, WhiteSpace } from 'antd-mobile';
-// import { Item } from 'antd-mobile/lib/tab-bar';
-import './Cards.css'
-
-
-class Cards extends Component{
-
-    componentWillReceiveProps(props){
-        console.log('++++333++++',props)
-    }
-
-    onClickChange(e,d){
-        //console.log('onClickChange',e,d)
-    }
-    
-    render(){
-        //console.log(this.props.products)
-        const Cardss=this.props.store.map((item,index)=>{
-            //console.log(item)
-            return (
-                <WingBlank size="lg" key={index} className="Card">
-                    <WhiteSpace size="lg" />
-                        <Card>
-                            <Card.Header
-                                title={item.name}
-                                extra={<span>this is extra</span>} 
-                            />
-                            <Card.Body>
-                                <div className="bodyWrap">
-                                    <div className="imgWrap">
-                                        <img src={item.img} alt="icon" height="100px" width="100px"/>
-                                    </div>
-                                    <div className="sidebar">
-                                        <p className="p1">{item.describle}</p>
-                                        <p className="p2">{item.address}</p>
-                                    </div>
-                                    <div className="buttonWrap">
-                                        <button onClick={(e)=>{this.onClickChange(e,item.id)}} className="button">详情</button>
-                                    </div>
-                                </div>
-                            </Card.Body>
-                            <Card.Footer content="" extra={<div></div>}/>
-                        </Card>
-                    <WhiteSpace size="lg" />
-                </WingBlank>
-            )
-        })
-
-        return (
-            <div>
-               {Cardss}
-            </div>
-        )
-    }
-}
-export default Cards
-
-
-
-
-
-
-
-

src/case/OrderApp/src/components/HomePage/HomePage.jsx

@@ -3,7 +3,8 @@ import React ,{Component} from 'react';
 
 import NavBars from '../common/NavBar'
 import Slide from '../common/Slide'
-import Cards from './Cards'
+import Cards from '../common/Cards'
+import Lists from '../common/List'
 
 
 export default class HomePage extends Component{
@@ -16,12 +17,26 @@ export default class HomePage extends Component{
     }
 
     render(){
+        const store =this.props.store
+
         return (
             <div>
                 <NavBars navBarText="店铺" />
                 <Slide slide={this.props.slide}/>
-                <div className="subTitle">推荐店铺</div>
-                <Cards store={this.props.store||[]}/>
+                <Lists text="推荐商家" extra="更多"/>
+                <div className="cardlist" style={{padding:"0 5px"}}>
+                    {
+                        store.map((item,index)=>{
+                            if(item.recommended==='1'){
+                                return (
+                                    <Cards key={index} item={item} changePage={this.props.changePage}/>
+                                    )
+                            }else{
+                                return ''
+                            }
+                        })
+                    }
+                </div>
             </div>
         )
     }

src/case/OrderApp/src/components/UserPage/userPage.jsx

@@ -1,9 +1,8 @@
 import React, { Component } from 'react';
 
-
 import NavBars from '../common/NavBar'
 import Head from '../common/Head'
-
+import Lists from '../common/List'
 
 
 class UserPage extends Component{
@@ -12,12 +11,27 @@ class UserPage extends Component{
         this.state={
 
         }
+
+
+        this.toOrder=this.toOrder.bind(this)
+    }
+
+    toOrder(){
+        console.log('toOrder')
     }
+    
     render(){
         return(
             <div>
                 <NavBars navBarText="我的"/>
                 <Head />
+                <div className="lists">
+                    <Lists text="我的预约" icon="https://wly-1254337200.cos.ap-guangzhou.myqcloud.com/order.svg" callback={this.toOrder}/>
+                    <div style={{height:"30px"}}></div>
+                    <Lists text="我的客服"  callback={this.toOrder}/>
+                    <div style={{height:"10px"}}></div>
+                    <Lists text="意见反馈"  callback={this.toOrder}/>
+                </div>
             </div>
         )
     }

src/case/OrderApp/src/components/common/Cards.css

@@ -0,0 +1,55 @@
+div.Card{
+    font-size:15px;
+}
+
+div.imgWrap{
+    flex-basis:100px;
+}
+.hot{
+    color:red;
+    font-size: 12px;
+}
+.title{
+    font-size: 15px;
+}
+p{
+    padding: 0;
+    margin: 0;
+}
+
+
+.rightsidebar{
+    padding-left: 4px;
+}
+.rightsidebar .p1,.rightsidebar .p2{
+    font-size: 14px;
+    text-align: left;
+}
+
+
+.p3{
+    text-align: left;
+    margin-top: 60px;
+}
+.sidebar{
+    padding-left:10px;
+    font-size: 14px;
+    flex-grow: 1;
+}
+.bodyWrap{
+    display: flex;
+    overflow: hidden;
+}
+
+.rightsidebar{
+    flex-basis:100px;
+}
+
+div.am-tab-bar-item{
+    height: auto;
+    background-color: #ccc;
+}
+
+div.am-card{
+   
+}

src/case/OrderApp/src/components/common/Cards.jsx

@@ -0,0 +1,69 @@
+import React, { Component } from 'react';
+import { Card, WingBlank, WhiteSpace } from 'antd-mobile';
+//import { Item } from 'antd-mobile/lib/tab-bar';
+import './Cards.css'
+
+class Cards extends Component{
+    constructor(props){
+        console.log('111',props)
+        super(props)
+        this.state={
+            product_id:''
+        }
+    }
+    /*
+    
+    address: "合肥蜀山那长江路545号"
+    admin_id: null
+    class: "美甲"
+    createdAt: "2018/3/12"
+    describle: "只属于你一个人的浪漫"
+    id: "12312"
+    img: "https://wly-1254337200.cos.ap-guangzhou.myqcloud.com/recommend_img_02.png"
+    name: "一个人美容"
+    recommended: "1"
+    telephone: "18355093647"
+    updatedAt: "String"
+    */ 
+    
+    render(){
+        const item =this.props.item
+        const changePage=this.props.changePage
+        return(
+            <WingBlank size="lg" className="Card">
+                {/*<Link to={"/detail?product_id="+item.id}>*/}
+                    <Card onClick={(e)=>{changePage('detail',item.id)}}>
+                        <Card.Header
+                            title={<span className="title">{item.name}</span>}
+                            extra={<span className="hot">热门</span>} 
+                        />
+                        <Card.Body>
+                            <div className="bodyWrap">
+                                <div className="imgWrap">
+                                    <img src={item.img} alt="xxx" height="100px" width="100px"/>
+                                </div>
+                                <div className="sidebar">
+                                    <p style={{fontSize:"10px"}}>{item.class}</p>
+                                    <p style={{fontSize:"10px"}}>{item.describle}</p>
+                                    <p style={{fontSize:"10px"}}>{item.address}</p>
+                                    <button style={{border:"none",padding:"5px 11px",background:"green",borderRadius:"3px",color:"#fff",fontSize:"10px",marginTop:"16px"}}>了解更多</button>
+                                </div>
+                            </div>
+                        </Card.Body>
+                        <Card.Footer content="" extra={<div></div>} />
+                    </Card>
+                {/*</Link>*/}
+            <WhiteSpace size="lg" />
+        </WingBlank>
+        )
+    }
+}
+export default Cards
+
+
+
+
+
+
+
+

src/case/OrderApp/src/components/common/List.jsx

@@ -9,15 +9,17 @@ export default class Lists extends Component {
             {
                 this.props.icon ?
                 <Item
+                extra={this.props.extra}
                 thumb={this.props.icon}
                 arrow="horizontal"
                 onClick={() => {this.props.callback()}}
-                >{this.props.text}</Item>
+                ><span className="listText">{this.props.text}</span></Item>
                 :
                 <Item
+                extra={this.props.extra}
                 arrow="horizontal"
                 onClick={() => {this.props.callback()}}
-                >{this.props.text}</Item>
+                ><span className="listText">{this.props.text}</span></Item>
             }
         </List>
     )
@@ -27,3 +29,5 @@ export default class Lists extends Component {
 
 
 
+
+

src/case/ShopApp/src/App.css

@@ -13,7 +13,7 @@
     overflow: hidden;
     overflow-x: hidden;
     overflow-y: hidden;
-    background:#fff;
+    background-color: #f5f5f5;;
 }
 
 .App *::-webkit-scrollbar {display:none !important}
@@ -35,7 +35,6 @@ p.p1,p.p2,p.p3{
 
 .pageWrap{
     margin-top: 45px;
-    background: #ffffff;
 }
 
 

src/case/ShopApp/src/components/Common/List.jsx

@@ -0,0 +1,33 @@
+import React, { Component } from 'react'
+import { List } from 'antd-mobile';
+const Item = List.Item;
+
+export default class Lists extends Component {
+  render() {
+    return (
+        <List >
+            {
+                this.props.icon ?
+                <Item
+                extra={this.props.extra}
+                thumb={this.props.icon}
+                arrow="horizontal"
+                onClick={() => {this.props.callback()}}
+                >{this.props.text}</Item>
+                :
+                <Item
+                extra={this.props.extra}
+                arrow="horizontal"
+                onClick={() => {this.props.callback()}}
+                >{this.props.text}</Item>
+            }
+        </List>
+    )
+  }
+}
+
+
+
+
+
+

src/case/ShopApp/src/components/HomePage/Cards.css

@@ -19,7 +19,7 @@ p{
 
 
 .rightsidebar{
-    padding-left: 4px;
+    padding-left: 8px;
 }
 .rightsidebar .p1,.rightsidebar .p2{
     font-size: 14px;
@@ -35,6 +35,8 @@ p{
     padding-left:10px;
     font-size: 14px;
     flex-grow: 1;
+    width: 100px;
+    overflow: hidden;
 }
 .bodyWrap{
     display: flex;

src/case/ShopApp/src/components/HomePage/Cards.jsx

@@ -28,7 +28,6 @@ class Cards extends Component{
                     {({changePage})=>{
                         return(
                             <WingBlank size="lg" className="Card">
-                            <WhiteSpace size="lg" />
                                 {/*<Link to={"/detail?product_id="+item.id}>*/}
                                     <Card onClick={(e)=>{changePage('detail',item.id)}}>
                                         <Card.Header

src/case/ShopApp/src/components/HomePage/HomePage.css

@@ -8,6 +8,7 @@
     -webkit-overflow-scrolling: touch;
     overflow-x: scroll;
     white-space: nowrap;
-    height: 300px;
+    height: 333px;
+    background-color: #f5f5f5;
 }
 

src/case/ShopApp/src/components/UserPage/UserPage.css

@@ -2,7 +2,7 @@
     position: relative;
     z-index: 3;
     height: 100%;
-    padding: 0 5px;
+    background-color: #f5f5f5;
 }
 
 .UserPageWrap *{
@@ -33,12 +33,6 @@
     flex-basis: 16px;
 }
 
-.toOrderCenter span:nth-child(1){
-    background: url('https://wly-1254337200.cos.ap-guangzhou.myqcloud.com/order.svg') no-repeat center center;
-}
-.toAddressCenter span:nth-child(1){
-    background: url('https://wly-1254337200.cos.ap-guangzhou.myqcloud.com/address.svg') no-repeat center center;
-}
 
 
 .toOrderCenter span:nth-child(3) ,.toAddressCenter span:nth-child(3){

src/case/ShopApp/src/components/UserPage/UserPage.jsx

@@ -1,5 +1,6 @@
 import React, { Component } from 'react';
 import Head from './Head'
+import Lists from '../Common/List'
 
 import {graphqls} from '../../api/graphql_request'
 import {getUserByProps} from '../../api/graphql/user'
@@ -39,12 +40,8 @@ class UserPage extends Component{
                 <div className="headerWrap">
                     <Head user={this.state.user}/></div>
                 <div className="toWrap">
-                    <div className='toOrderCenter' onClick={()=>this.props.changePage('orderCenter')}>
-                        <span></span><span>我的订单</span><span></span>
-                    </div>
-                    <div className='toAddressCenter' onClick={()=>this.props.changePage('addressPage')}>
-                        <span></span><span>我的地址</span><span></span>
-                    </div>
+                    <Lists text="我的订单" icon="https://wly-1254337200.cos.ap-guangzhou.myqcloud.com/order.svg" callback={()=>{this.props.changePage('orderCenter')}}/>
+                    <Lists text="我的地址" icon="https://wly-1254337200.cos.ap-guangzhou.myqcloud.com/address.svg" callback={()=>this.props.changePage('addressPage')}/>
                 </div>
             </div>
         )

src/gql.js

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