natve fc

src/case/ShopApp/src/App.js

@@ -1,7 +1,7 @@
-import React, { Component } from 'react';
+import React, {Component} from 'react';
 import './components/App/App.css';
 
-import {PageContext,NumContext} from './context/context'
+import {PageContext, NumContext} from './context/context'
 
 // import 'antd-mobile/dist/antd-mobile.css';
 import HomePage from './components/HomePage/HomePage'
@@ -15,183 +15,201 @@ import OrderCenterPage from './components/OrderCenterPage/OrderCenterPage'
 import AddressPage from './components/AddressPage/AddressPage'
 
 import {graphqls} from './api/graphql_request'
-import {getProductById,getProductByProps} from './api/graphql/product'
+import {getProductById, getProductByProps} from './api/graphql/product'
+
 //import axious from './api/axious_request'
 
 
 class ShopApp extends Component {
-  //showComponent
-  constructor(props){
-    super(props)
-    this.state={
-      page:'index',
-      product_id:'',
-      num:1,
-      editAddress:false,
-      fromShopCar:false,
-      fromOrderCenter:false,
-      order_id:'',
-      address_id:''
+    //showComponent
+    constructor(props) {
+        super(props)
+        this.state = {
+            page: 'index',
+            product_id: '',
+            num: 1,
+            editAddress: false,
+            fromShopCar: false,
+            fromOrderCenter: false,
+            order_id: '',
+            address_id: ''
+        }
+        this.changePage = this.changePage.bind(this)
+        this.triggerAddress = this.triggerAddress.bind(this)
+        this.setFromShopCar = this.setFromShopCar.bind(this)
+        this.setOrderId = this.setOrderId.bind(this)
+        this.setAddressId = this.setAddressId.bind(this)
     }
-    this.changePage=this.changePage.bind(this)
-    this.triggerAddress=this.triggerAddress.bind(this)
-    this.setFromShopCar=this.setFromShopCar.bind(this)
-    this.setOrderId=this.setOrderId.bind(this)
-    this.setAddressId=this.setAddressId.bind(this)
-  }
-
-  componentWillMount(){
-    sessionStorage.setItem("openid","ovtkn4zONC3IzhpykQ7cSLZ85YFg")
-    this.getGoods()
-  }
-  //获取数据
-  getGoods(variables={}){
-    return graphqls(getProductByProps,variables).then((data)=>{
-    console.log("data",data)
-    let products=data.productbyprops||[]
-    sessionStorage.setItem("products",JSON.stringify(products))
-    })
-  }
-
-  getProductByIds(id){
-    return graphqls(getProductById,{id}).then(e=>e)
-  }
-  //显示页面，控制子页面的显示
-  changePage(page,product_id){
-    console.log("onAppPage",page)
-
-    if(product_id){
-      this.setState({page,product_id})
-    }else{
-      this.setState({page})
-      console.log('state.page',this.state.page)
+
+    componentWillMount() {
+        sessionStorage.setItem("openid", "ovtkn4zONC3IzhpykQ7cSLZ85YFg")
+        this.getGoods()
     }
-  }
-
-  //传递给子组件的更改state的函数
-  triggerAddress(editAddress){
-    this.setState({editAddress})
-  }
-
-  setAddressId(id){
-    this.setState({address_id:id})
-    console.log(id)
-  }
-
-  setNum(num){
-    this.setState({num})
-  }
-
-  setFromShopCar(fromShopCar){
-    this.setState({fromShopCar})
-  }
-
-  setOrderId(order_id="",fromOrderCenter=false){
-    console.log('----setOrderId----',order_id,fromOrderCenter)
-    this.setState({order_id,fromOrderCenter})
-  }
-
-  //根据条件渲染页面
-  renderPage(page=""){
-    console.log('renderPage',page)
-    const setNum=this.setNum.bind(this)
-    
-    switch(page){
-      case ('detail'):
-        return(
-          <div className="pageWrap">
-            <ProductDetail product_id={this.state.product_id} setNum={setNum} changePage={this.changePage}/>
-          </div>
-          )
-  
-      case('order'):
-        return(
-          <div className="pageWrap">
-            <OrderPage />
-          </div>
-          )
-  
-      case('shopCar'):
-        console.log('shopCar 渲染了')
-        return(
-          <div>
-            <div className="pageWrap">
-              <ShopCarPage />
-            </div>
-            <TabBarBottom changePage={this.changePage}/>
-          </div>
-          )
-  
-      case('user'):
-        console.log('user 渲染了')
-        return(
-          <div>
-            <div className="pageWrap">
-            <UserPage changePage={this.changePage}/>
-            </div>
-            <TabBarBottom changePage={this.changePage}/>
-          </div>
-          )
-      case('index'):
-        console.log('index 渲染了')
-        return(
-          <div>
-            <div className="pageWrap indexPage">
-              <HomePage changePage={this.changePage}/>
-            </div>
-            <TabBarBottom changePage={this.changePage}/>
-          </div>
-          )
-      case('orderCenter'):
-        console.log('orderCenter 渲染了')
-          return(
-            <div className="pageWrap">
-              <OrderCenterPage />
-            </div>
-          )
-      case('addressPage'):
-        console.log('addressPage 渲染了')
-          return(
-            <div className="pageWrap">
-              <AddressPage address={{triggerAddress:this.triggerAddress,editAddress:this.state.editAddress}} />
-            </div>
-          )
-      default:
-        console.log('页面显示错误')
-        return (<div>页面显示错误</div>)
-        //break
+
+    //获取数据
+    getGoods(variables = {}) {
+        return graphqls(getProductByProps, variables).then((data) => {
+            console.log("data", data)
+            let products = data.productbyprops || []
+            sessionStorage.setItem("products", JSON.stringify(products))
+        })
+    }
+
+    getProductByIds(id) {
+        return graphqls(getProductById, {id}).then(e => e)
+    }
+
+    //显示页面，控制子页面的显示
+    changePage(page, product_id) {
+        console.log("onAppPage", page)
+
+        if (product_id) {
+            this.setState({page, product_id})
+        } else {
+            this.setState({page})
+            console.log('state.page', this.state.page)
+        }
+    }
+
+    //传递给子组件的更改state的函数
+    triggerAddress(editAddress) {
+        this.setState({editAddress})
+    }
+
+    setAddressId(id) {
+        this.setState({address_id: id})
+        console.log(id)
+    }
+
+    setNum(num) {
+        this.setState({num})
+    }
+
+    setFromShopCar(fromShopCar) {
+        this.setState({fromShopCar})
+    }
+
+    setOrderId(order_id = "", fromOrderCenter = false) {
+        console.log('----setOrderId----', order_id, fromOrderCenter)
+        this.setState({order_id, fromOrderCenter})
+    }
+
+    //根据条件渲染页面
+    renderPage(page = "") {
+        console.log('renderPage', page)
+        const setNum = this.setNum.bind(this)
+
+        switch (page) {
+            case ('detail'):
+                return (
+                    <div className="pageWrap">
+                        <ProductDetail product_id={this.state.product_id} setNum={setNum} changePage={this.changePage}/>
+                    </div>
+                )
+
+            case('order'):
+                return (
+                    <div className="pageWrap">
+                        <OrderPage/>
+                    </div>
+                )
+
+            case('shopCar'):
+                console.log('shopCar 渲染了')
+                return (
+                    <div>
+                        <div className="pageWrap">
+                            <ShopCarPage/>
+                        </div>
+                        <TabBarBottom changePage={this.changePage}/>
+                    </div>
+                )
+
+            case('user'):
+                console.log('user 渲染了')
+                return (
+                    <div>
+                        <div className="pageWrap">
+                            <UserPage changePage={this.changePage}/>
+                        </div>
+                        <TabBarBottom changePage={this.changePage}/>
+                    </div>
+                )
+            case('index'):
+                console.log('index 渲染了')
+                return (
+                    <div>
+                        <div className="pageWrap indexPage">
+                            <HomePage changePage={this.changePage}/>
+                        </div>
+                        <TabBarBottom changePage={this.changePage}/>
+                    </div>
+                )
+            case('orderCenter'):
+                console.log('orderCenter 渲染了')
+                return (
+                    <div className="pageWrap">
+                        <OrderCenterPage/>
+                    </div>
+                )
+            case('addressPage'):
+                console.log('addressPage 渲染了')
+                return (
+                    <div className="pageWrap">
+                        <AddressPage
+                            address={{triggerAddress: this.triggerAddress, editAddress: this.state.editAddress}}/>
+                    </div>
+                )
+            default:
+                console.log('页面显示错误')
+                return (<div>页面显示错误</div>)
+            //break
+        }
+    }
+
+    console(page) {
+        this.console.log(page)
+    }
+
+    render() {
+        const changePage = this.changePage//切换page
+        const triggerAddress = this.triggerAddress//新建Address?
+        const fromShopCar = this.state.fromShopCar//是否来自于shopCarPage
+        const setFromShopCar = this.setFromShopCar//
+        const getProductByIds = this.getProductByIds//
+        const order_id = this.state.order_id
+        const product_id = this.state.product_id
+        const setOrderId = this.setOrderId//
+        const fromOrderCenter = this.state.fromOrderCenter
+        const num = this.state.num
+        const address_id = this.state.address_id
+        const setAddressId = this.setAddressId
+        //console.log('APPrender')
+        return (
+            <PageContext.Provider value={{
+                address_id,
+                setAddressId,
+                changePage,
+                triggerAddress,
+                getProductByIds,
+                num,
+                fromShopCar,
+                setFromShopCar,
+                setOrderId,
+                order_id,
+                product_id,
+                fromOrderCenter
+            }}>
+                <div className="AppWrap">
+                    <div className="phone6s">
+                        <div className="App shopAppWrap">
+                            {this.renderPage(this.state.page)}{/*渲染页面*/}
+                        </div>
+                    </div>
+                </div>
+            </PageContext.Provider>
+        );
     }
-  }
-
-  console(page){
-    this.console.log(page)
-  }
-
-  render() {
-    const changePage=this.changePage//切换page
-    const triggerAddress=this.triggerAddress//新建Address?
-    const fromShopCar=this.state.fromShopCar//是否来自于shopCarPage
-    const setFromShopCar=this.setFromShopCar//
-    const getProductByIds=this.getProductByIds//
-    const order_id=this.state.order_id
-    const product_id =this.state.product_id
-    const setOrderId=this.setOrderId//
-    const fromOrderCenter=this.state.fromOrderCenter
-    const num=this.state.num
-    const address_id=this.state.address_id
-    const setAddressId=this.setAddressId
-    //console.log('APPrender')
-    return (
-      <PageContext.Provider value={{address_id,setAddressId,changePage,triggerAddress,getProductByIds,num,fromShopCar,setFromShopCar,setOrderId,order_id,product_id,fromOrderCenter}}>
-          <div className="AppWrap">
-            <div className="phone6s">
-              <div className="App shopAppWrap">
-                { this.renderPage(this.state.page) }{/*渲染页面*/}
-              </div>
-            </div>
-          </div>
-      </PageContext.Provider>
-    );
-  }
 }
+
 export default ShopApp;

src/case/ShopApp/src/api/graphql/shopCar.js

@@ -1,5 +1,5 @@
-export const getShopCarByProps=`query userCartbyprops($user_id: ID, $product_id: ID, $count: Int, $createdAt: String, $updatedAt: String) {
-    userCartbyprops: userCart_by_props(user_id: $user_id product_id: $product_id count: $count createdAt: $createdAt updatedAt: $updatedAt) {
+export const getShopCarByProps=`query userCartbyprops($user_id: ID) {
+    userCartbyprops: userCart_by_props(user_id: $user_id) {
         id
         user_id {
             email

src/case/ShopApp/src/components/ShopCarPage/ShopCarPage.jsx

@@ -1,73 +1,84 @@
-import React, { Component } from 'react';
+import React, {Component} from 'react';
 import ShopCarCard from './ShopCarCard'
 import {PageContext} from '../../context/context'
 import {ActivityIndicator} from 'antd-mobile';
 import './ShopCarPage.css'
 import {graphqls} from '../../api/graphql_request'
-import {getShopCarByProps,deleteCarByProps,createShopCar} from '../../api/graphql/shopCar'
+import {getShopCarByProps, deleteCarByProps, createShopCar} from '../../api/graphql/shopCar'
 import NavBars from '../Common/NavBar'
 
-class ShopCarPage extends Component{
-    constructor(props){
+class ShopCarPage extends Component {
+    constructor(props) {
         super(props)
-        this.state={
-            shopCarList:[],
-            sumPrice:0,
-            shopCarCount:0,
-            loading:true
+        this.state = {
+            shopCarList: [],
+            sumPrice: 0,
+            shopCarCount: 0,
+            loading: true
         }
         //this.renderShopCarList=this.renderShopCarList.bind(this)
-        this.deleteCarById=this.deleteCarById.bind(this)
+        this.deleteCarById = this.deleteCarById.bind(this)
         //this.deleteAllShopCar=this.deleteAllShopCar.bind(this)
     }
 
-    componentDidMount(){
+    componentDidMount() {
         this.getCarByProps()
     }
+
     //获取购物车列表，并统计总价总数量
-    getCarByProps(){
-        const user_id=sessionStorage.getItem('openid')
-        graphqls(getShopCarByProps,{user_id}).then((response)=>{
-            let sumPrice=0,shopCarCount=0;
+    getCarByProps() {
+        const user_id = sessionStorage.getItem('openid')
+        console.log(user_id, '>>>>>>');
+        graphqls(getShopCarByProps, {user_id}).then((response) => {
+            let sumPrice = 0, shopCarCount = 0;
             //如果請求失敗,默认空数组
-            
-            (response.userCartbyprops||[]).map((item)=>{
-                sumPrice+=item.count*item.product_id.price
-                shopCarCount+=item.count
+
+            (response.userCartbyprops || []).map((item) => {
+                sumPrice += item.count * item.product_id.price
+                shopCarCount += item.count
                 return 1
             })
 
             //console.log('sumPrice',sumPrice,'shopCarCount',shopCarCount)
             //console.log('getShopCarByProps',response.userCartbyprops)
-            
+
+            console.log(response, ">>>");
             this.setState({
-                shopCarList:response.userCartbyprops,
+                shopCarList: response.userCartbyprops,
                 sumPrice,
                 shopCarCount,
-                loading:false
+                loading: false
             })
         })
     }
 
     //删除购物车
-    deleteCarById(id){
+    deleteCarById(id) {
         //console.log(id)
-        graphqls(deleteCarByProps,{id}).then((e)=>{
-        console.log('deleteShopCar',e)
+        graphqls(deleteCarByProps, {id}).then((e) => {
+            console.log('deleteShopCar', e)
             this.getCarByProps()
         })
     }
 
-    
-    render(){
-        return(
+
+    render() {
+        return (
             <div className="shopCarPage">
                 <ActivityIndicator toast text="loading" animating={this.state.loading}/>
                 <NavBars navBarText="购物车" changePage={this.props.changePage} page="detail"/>
                 {
-                    this.state.shopCarList.length===0 ?
-                        <div style={{marginTop:'200px',padding:'1px',position:'relative',zIndex:'10',display:'flex',justifyContent:'center'}}>
-                            <div>购物车空空如也<span onClick={()=>this.props.changePage('index')} style={{color:'#108ee9'}}>去购物</span></div>
+                    this.state.shopCarList.length === 0 ?
+                        <div style={{
+                            marginTop: '200px',
+                            padding: '1px',
+                            position: 'relative',
+                            zIndex: '10',
+                            display: 'flex',
+                            justifyContent: 'center'
+                        }}>
+                            <div>购物车空空如也<span onClick={() => this.props.changePage('index')}
+                                              style={{color: '#108ee9'}}>去购物</span></div>
                         </div>
                         :
                         ''
@@ -78,16 +89,17 @@ class ShopCarPage extends Component{
                 </div>
                 <div className="footer">
                     <div className="message">合计: ￥{this.state.sumPrice}</div>
-                    <button 
-                    className="toPay" 
-                    onClick={()=>{
-                        if(this.state.shopCarList.length>0){
-                            this.props.changePage('order')
-                            this.props.setFromShopCar(true)
-                            //this.deleteAllShopCar()
-                        }
-                    }}
-                    >去支付</button>
+                    <button
+                        className="toPay"
+                        onClick={() => {
+                            if (this.state.shopCarList.length > 0) {
+                                this.props.changePage('order')
+                                this.props.setFromShopCar(true)
+                                //this.deleteAllShopCar()
+                            }
+                        }}
+                    >去支付
+                    </button>
                 </div>
             </div>
         )
@@ -96,6 +108,6 @@ class ShopCarPage extends Component{
 
 export default props => (
     <PageContext.Consumer>
-      {(obj)=> <ShopCarPage {...props} {...obj}/>}
+        {(obj) => <ShopCarPage {...props} {...obj}/>}
     </PageContext.Consumer>
 );

src/config.js

@@ -7,7 +7,7 @@ const graphqlEnvironment = '';
 
 // 基础配置
 const localIP = 'http://localhost';
-const serverIP = 'http://123.206.193.98';
+const serverIP = 'https://123.206.193.98';
 const backendPort = '8999';
 const graphqlPort = '3000';
 
@@ -17,7 +17,7 @@ const graphqlIP = (graphqlEnvironment || environment) === 'development' ? localI
 const backend = faasIp + ':' + backendPort;
 
 // graphql 配置
-const graphqlUrl = graphqlIP + ':' + graphqlPort + '/graphql';
+const graphqlUrl = 'http://online.ioobot.cn/graphql';
 
 // api 配置
 const getIdUrl = backend + '/getuserid';
@@ -37,4 +37,16 @@ const removeAPI = backendGQ + '/removeapi';
 // 通过在该数组中添加 userID，可以管理 trialcase 的增删改查
 const manageUsers = ['xy_1_je9{d\'\'_32sD+'];
 
-export {getIdUrl, loginUrl, registerUrl, logoutUrl,checkSchemaUrl, deployUrl, genJsUrl, graphqlUrl, manageUsers, removeFC, removeAPI}
+export {
+    getIdUrl,
+    loginUrl,
+    registerUrl,
+    logoutUrl,
+    checkSchemaUrl,
+    deployUrl,
+    genJsUrl,
+    graphqlUrl,
+    manageUsers,
+    removeFC,
+    removeAPI
+}