添加商店详情页

src/case/OrderApp/src/App.js

@@ -8,8 +8,8 @@ import {getSlidesByProps} from './api/graphql/slides'
 
 import TabBarBottom from './components/App/TabBarBottom'
 import HomePage from './components/HomePage/HomePage'
-
 import UserPage from './components/UserPage/userPage'
+import StoreDetailPage from './components/StoreDetailPage/StoreDetailPage'
 
 
 class OrderApp extends Component {
@@ -19,9 +19,11 @@ class OrderApp extends Component {
     this.state={
       page:'home',
       store:[],
-      slide:[]
+      slide:[],
+      currentStore:{}
     }
     this.changePage=this.changePage.bind(this)
+    this.setCurrentStore=this.setCurrentStore.bind(this)
   }
 
   componentDidMount(){
@@ -32,6 +34,11 @@ class OrderApp extends Component {
   changePage(page){
     this.setState({page})
   }
+  //
+  setCurrentStore(store){
+    console.log(store)
+    this.setState({currentStore:store})
+  }
 
   getStores(){
     //获取所有商家
@@ -59,7 +66,7 @@ class OrderApp extends Component {
         return(
           <div className="pageWrap">
             <div className="scrollPage">
-              <HomePage changePage={this.changePage} store={this.state.store} slide={this.state.slide}/>
+              <HomePage changePage={this.changePage} store={this.state.store} slide={this.state.slide} setCurrentStore={this.setCurrentStore}/>
             </div>
           </div>
           )
@@ -72,6 +79,15 @@ class OrderApp extends Component {
             </div>
           </div>
         )
+
+      case ('detail'):
+        return(
+          <div className="pageWrap">
+            <div className="scrollPage">
+              <StoreDetailPage changePage={this.changePage} store={this.state.currentStore}/>
+            </div>
+          </div>
+        )
  
       default:
           return(

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

@@ -1,6 +1,5 @@
 import React ,{Component} from 'react';
 
-
 import NavBars from '../common/NavBar'
 import Slide from '../common/Slide'
 import Cards from '../common/Cards'
@@ -21,15 +20,15 @@ export default class HomePage extends Component{
 
         return (
             <div>
-                <NavBars navBarText="店铺" />
+                <NavBars navBarText="店铺" changePage={this.props.changePage} page="home"/>
                 <Slide slide={this.props.slide}/>
-                <Lists text="推荐商家" extra="更多"/>
-                <div className="cardlist" style={{padding:"0 5px"}}>
+                <Lists text="推荐商家" extra="更多" callback={()=>{console.log('更多')}}/>
+                <div className="cardlist">
                     {
                         store.map((item,index)=>{
                             if(item.recommended==='1'){
                                 return (
-                                    <Cards key={index} item={item} changePage={this.props.changePage}/>
+                                    <Cards key={index} item={item} changePage={this.props.changePage} setCurrentStore={this.props.setCurrentStore}/>
                                     )
                             }else{
                                 return ''

src/case/OrderApp/src/components/StoreDetailPage/StoreDetailPage.jsx

@@ -0,0 +1,13 @@
+import React, { Component } from 'react'
+
+import NavBars from '../common/NavBar'
+
+export default class StoreDetailPage extends Component {
+  render() {
+    return (
+      <div>
+        <NavBars navBarText="店铺详情" changePage={this.props.changePage} page="home"/>
+      </div>
+    )
+  }
+}

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

@@ -29,10 +29,14 @@ class Cards extends Component{
     render(){
         const item =this.props.item
         const changePage=this.props.changePage
+        const setCurrentStore=this.props.setCurrentStore
         return(
             <WingBlank size="lg" className="Card">
                 {/*<Link to={"/detail?product_id="+item.id}>*/}
-                    <Card onClick={(e)=>{changePage('detail',item.id)}}>
+                    <Card onClick={(e)=>{
+                        changePage('detail')
+                        setCurrentStore(item)
+                    }}>
                         <Card.Header
                             title={<span className="title">{item.name}</span>}
                             extra={<span className="hot">热门</span>}