first commit

src/component/recommendShop/recommendShop.js

@@ -0,0 +1,65 @@
+import Taro, { Component } from '@tarojs/taro'
+import { View, Button, Text,Image } from '@tarojs/components'
+
+
+import './recommondShop.scss'
+
+
+
+class recommondShop extends Component {
+
+    config = {
+        navigationBarTitleText: 'recommondShop'
+    }
+    
+    componentWillReceiveProps(nextProps) {
+        console.log(this.props, nextProps)
+    }
+
+    componentWillUnmount() { }
+
+    componentDidShow() { }
+
+    componentDidHide() { }
+
+    render() {
+        
+        const title = this.props.shop.shop_name
+        const imgUrl = 'http://192.168.1.230/' + this.props.shop.shop_logo
+        const price = this.props.shop.goods[0].goods_price
+        const ProductName = this.props.shop.goods_name
+        const address = this.props.shop.shop_address
+        const distance = this.props.shop.distance
+        return (
+            <View className='shop-list-box'>
+                <View className='header'>
+                    <View className='title'>
+                        {title}
+                    </View>
+                    <View className='ask-button'>
+                    <Button>咨询</Button>
+                    </View>
+                </View>
+                <View className='body'>
+                    <View className='shop-img'>
+                        <Image
+                            src={imgUrl}
+                        />
+                    </View>
+                    <View className='details'>
+                        <View><Text>商品:{ProductName}</Text> </View>
+                        <View><Text>价格:{price}</Text></View>
+                    </View>
+                </View>
+                <View className='footer'>
+
+                    <View className='address'><Text>{address}</Text> </View>
+                    <View className='distance'><Text>{distance}</Text></View>
+                   
+                </View>
+            </View>
+        )
+    }
+}
+
+export default recommondShop

src/component/recommendShop/recommondShop.scss

@@ -0,0 +1,53 @@
+.shop-list-box{
+       border: 1px solid #ddd;
+    border-radius: 3px;
+    box-shadow: 0 5px 5px #ddd;
+    margin-bottom: 10px;
+    .header{
+        border-bottom:gray solid 1px;
+        display: flex;
+        .title{
+            width: 50%;
+            color: #333;
+    font-weight: bold;
+            
+        }
+        .ask-button{
+            width: 50%;
+            button{
+                background-color: #337ab7;
+                height: 36px;
+                width:24px;
+                color:white
+            }
+        }
+    }
+    .body{
+        border-bottom:gray solid 1px;
+        display: flex;
+        font-size: 35px;
+        .shop-img{
+            padding: 20px;
+            Image{
+                 height: 200px;
+            width: 200px;
+            }
+        }
+        .details{
+            View{
+                margin-top: 20px;
+            }
+        }
+    }
+    .footer{
+        display: flex;
+        .distance{
+            width: 50%;
+            font-size: 30px
+        }
+        .address{
+            width:50%;
+             font-size: 30px
+        }
+    }
+}