diff --git a/app/app.wxss b/app/app.wxss
index ffd9181..74fd1f1 100644
--- a/app/app.wxss
+++ b/app/app.wxss
@@ -3,6 +3,7 @@
 
 page {
   font-size: 16px;
+  line-height: 1.5;
   background-color: #f8f8f8;
 }
 
@@ -13,6 +14,13 @@ page {
 .grey-color {
   color: #999 !important;
 }
+.text-large {
+  font-size: 1.2em;
+}
+
+.text-small {
+  font-size: 0.8em;
+}
 
 .trangle::after {
   content: "";
@@ -72,3 +80,11 @@ button[type="primary"][plain] {
   margin-top: 15px;
   padding: 0 15px;
 }
+
+.weui-navbar__item.weui-bar__item_on {
+  color: #ff5801;
+}
+
+.weui-navbar__slider {
+  background-color: #ff5801;
+}
\ No newline at end of file
diff --git a/app/pages/shop/show.js b/app/pages/shop/show.js
index 7cf9460..afff6eb 100644
--- a/app/pages/shop/show.js
+++ b/app/pages/shop/show.js
@@ -1,6 +1,24 @@
 // pages/shop/show.js
+
+var sliderWidth = 96;
+
 Page({
   data: {
+    tabs: ["商品", "评价"],
+    activeIndex: 0,
+    sliderOffset: 0,
+    sliderLeft: 0,
+
+    activeMenuIndex: 0,
+
+    order: {
+      totalPrice: 0,
+      totalNum: 0,
+      totalPackingFee: 0,
+      goodsNums: {},
+      goods: []
+    },
+
     info: {
       "seller_id": "2",
       "seller_name": "鲜极道",
@@ -37,10 +55,228 @@ Page({
           "info": "在线支付满15元减5元,满20元减8元"
         }
       ],
+      "menus": [
+        {
+          "menu_id": "10",
+          "menu_name": "热销排行",
+          "seller_id": "2",
+          "sort": "0",
+          "is_use": "1",
+          "goods": "29,32,31,30,46",
+          "goods2": [
+            {
+              "goods_id": "29",
+              "goods_name": "鸡腿饭",
+              "seller_id": "2",
+              "pic_url": "http://mtest.ipaotui.com/Uploadfile/Img/seller_goods/1461034075146103407535640.jpg",
+              "pic_hd1": "http://mtest.ipaotui.com/Uploadfile/Img/seller_goods/hd1_1461034075146103407535640.jpg",
+              "pic_hd2": "http://mtest.ipaotui.com/Uploadfile/Img/seller_goods/hd2_1461034075146103407535640.jpg",
+              "detail": "鸡腿饭 xx",
+              "price": "22.00",
+              "packing_fee": "2.00",
+              "sales": "46",
+              "praise": "0",
+              "stock": "76",
+              "sub_goods": [
+                {
+                  "sub_id": "50",
+                  "sub_name": "大",
+                  "price": "22.98",
+                  "packing_fee": "2.00",
+                  "stock": "74"
+                },
+                {
+                  "sub_id": "51",
+                  "sub_name": "小",
+                  "price": "22.00",
+                  "packing_fee": "2.00",
+                  "stock": "76"
+                }
+              ]
+            },
+            {
+              "goods_id": "32",
+              "goods_name": "鸡翅饭",
+              "seller_id": "2",
+              "pic_url": null,
+              "pic_hd1": null,
+              "pic_hd2": null,
+              "detail": "鸡翅饭 xx",
+              "price": "20.00",
+              "packing_fee": "0.00",
+              "sales": "41",
+              "praise": "0",
+              "stock": "59",
+              "sub_goods": []
+            },
+            {
+              "goods_id": "31",
+              "goods_name": "招牌饭",
+              "seller_id": "2",
+              "pic_url": "http://mtest.ipaotui.com/Uploadfile/Img/seller_goods/1461033463146103346359875.jpg",
+              "pic_hd1": "http://mtest.ipaotui.com/Uploadfile/Img/seller_goods/hd1_1461033463146103346359875.jpg",
+              "pic_hd2": "http://mtest.ipaotui.com/Uploadfile/Img/seller_goods/hd2_1461033463146103346359875.jpg",
+              "detail": "招牌饭 xx",
+              "price": "20.00",
+              "packing_fee": "0.00",
+              "sales": "14",
+              "praise": "0",
+              "stock": "86",
+              "sub_goods": []
+            },
+            {
+              "goods_id": "30",
+              "goods_name": "排骨饭",
+              "seller_id": "2",
+              "pic_url": "http://mtest.ipaotui.com/Uploadfile/Img/seller_goods/1461034058146103405829482.jpg",
+              "pic_hd1": "http://mtest.ipaotui.com/Uploadfile/Img/seller_goods/hd1_1461034058146103405829482.jpg",
+              "pic_hd2": "http://mtest.ipaotui.com/Uploadfile/Img/seller_goods/hd2_1461034058146103405829482.jpg",
+              "detail": "排骨饭 xx",
+              "price": "20.00",
+              "packing_fee": "0.00",
+              "sales": "10",
+              "praise": "0",
+              "stock": "0",
+              "sub_goods": []
+            },
+            {
+              "goods_id": "46",
+              "goods_name": "香肠2",
+              "seller_id": "2",
+              "pic_url": "http://mtest.ipaotui.com/Uploadfile/Img/seller_goods/1466411009146641100940750.jpg",
+              "pic_hd1": "http://mtest.ipaotui.com/Uploadfile/Img/seller_goods/hd1_1466411009146641100940750.jpg",
+              "pic_hd2": "http://mtest.ipaotui.com/Uploadfile/Img/seller_goods/hd2_1466411009146641100940750.jpg",
+              "detail": "",
+              "price": "2.00",
+              "packing_fee": "0.00",
+              "sales": "13",
+              "praise": "0",
+              "stock": "187",
+              "sub_goods": []
+            }
+          ]
+        },
+        {
+          "menu_id": "11",
+          "menu_name": "便当",
+          "seller_id": "2",
+          "sort": "0",
+          "is_use": "1",
+          "goods": "29,33,32,31,30,46",
+          "goods2": [
+            {
+              "goods_id": "29",
+              "goods_name": "鸡腿饭",
+              "seller_id": "2",
+              "pic_url": "http://mtest.ipaotui.com/Uploadfile/Img/seller_goods/1461034075146103407535640.jpg",
+              "pic_hd1": "http://mtest.ipaotui.com/Uploadfile/Img/seller_goods/hd1_1461034075146103407535640.jpg",
+              "pic_hd2": "http://mtest.ipaotui.com/Uploadfile/Img/seller_goods/hd2_1461034075146103407535640.jpg",
+              "detail": "鸡腿饭 xx",
+              "price": "22.00",
+              "packing_fee": "2.00",
+              "sales": "46",
+              "praise": "0",
+              "stock": "76",
+              "sub_goods": [
+                {
+                  "sub_id": "50",
+                  "sub_name": "大",
+                  "price": "22.98",
+                  "packing_fee": "2.00",
+                  "stock": "74"
+                },
+                {
+                  "sub_id": "51",
+                  "sub_name": "小",
+                  "price": "22.00",
+                  "packing_fee": "2.00",
+                  "stock": "76"
+                }
+              ]
+            },
+            {
+              "goods_id": "33",
+              "goods_name": "香肠饭",
+              "seller_id": "2",
+              "pic_url": null,
+              "pic_hd1": null,
+              "pic_hd2": null,
+              "detail": "香肠饭 xx",
+              "price": "20.00",
+              "packing_fee": "0.00",
+              "sales": "0",
+              "praise": "0",
+              "stock": "100",
+              "sub_goods": []
+            },
+            {
+              "goods_id": "32",
+              "goods_name": "鸡翅饭",
+              "seller_id": "2",
+              "pic_url": null,
+              "pic_hd1": null,
+              "pic_hd2": null,
+              "detail": "鸡翅饭 xx",
+              "price": "20.00",
+              "packing_fee": "0.00",
+              "sales": "41",
+              "praise": "0",
+              "stock": "59",
+              "sub_goods": []
+            },
+            {
+              "goods_id": "31",
+              "goods_name": "招牌饭",
+              "seller_id": "2",
+              "pic_url": "http://mtest.ipaotui.com/Uploadfile/Img/seller_goods/1461033463146103346359875.jpg",
+              "pic_hd1": "http://mtest.ipaotui.com/Uploadfile/Img/seller_goods/hd1_1461033463146103346359875.jpg",
+              "pic_hd2": "http://mtest.ipaotui.com/Uploadfile/Img/seller_goods/hd2_1461033463146103346359875.jpg",
+              "detail": "招牌饭 xx",
+              "price": "20.00",
+              "packing_fee": "0.00",
+              "sales": "14",
+              "praise": "0",
+              "stock": "86",
+              "sub_goods": []
+            },
+            {
+              "goods_id": "30",
+              "goods_name": "排骨饭",
+              "seller_id": "2",
+              "pic_url": "http://mtest.ipaotui.com/Uploadfile/Img/seller_goods/1461034058146103405829482.jpg",
+              "pic_hd1": "http://mtest.ipaotui.com/Uploadfile/Img/seller_goods/hd1_1461034058146103405829482.jpg",
+              "pic_hd2": "http://mtest.ipaotui.com/Uploadfile/Img/seller_goods/hd2_1461034058146103405829482.jpg",
+              "detail": "排骨饭 xx",
+              "price": "20.00",
+              "packing_fee": "0.00",
+              "sales": "10",
+              "praise": "0",
+              "stock": "0",
+              "sub_goods": []
+            },
+            {
+              "goods_id": "46",
+              "goods_name": "香肠2",
+              "seller_id": "2",
+              "pic_url": "http://mtest.ipaotui.com/Uploadfile/Img/seller_goods/1466411009146641100940750.jpg",
+              "pic_hd1": "http://mtest.ipaotui.com/Uploadfile/Img/seller_goods/hd1_1466411009146641100940750.jpg",
+              "pic_hd2": "http://mtest.ipaotui.com/Uploadfile/Img/seller_goods/hd2_1466411009146641100940750.jpg",
+              "detail": "",
+              "price": "2.00",
+              "packing_fee": "0.00",
+              "sales": "13",
+              "praise": "0",
+              "stock": "187",
+              "sub_goods": []
+            }
+          ]
+        },
+      ]
     }
   },
   onLoad: function (options) {
     // 页面初始化 options为页面跳转所带来的参数
+    this.initTab()
   },
   onReady: function () {
     // 页面渲染完成
@@ -53,5 +289,120 @@ Page({
   },
   onUnload: function () {
     // 页面关闭
+  },
+
+  initTab: function () {
+    var that = this;
+    wx.getSystemInfo({
+      success: function (res) {
+        that.setData({
+          sliderLeft: (res.windowWidth / that.data.tabs.length - sliderWidth) / 2,
+          sliderOffset: res.windowWidth / that.data.tabs.length * that.data.activeIndex
+        });
+      }
+    });
+  },
+  tabClick: function (e) {
+    this.setData({
+      sliderOffset: e.currentTarget.offsetLeft,
+      activeIndex: e.currentTarget.id
+    });
+  },
+  menuClick: function (e) {
+    this.setData({
+      activeMenuIndex: e.currentTarget.id
+    })
+  },
+
+  addGoodsNum(order, goodsId, subId, num = 1) {
+    var {goods, goodsNums} = order
+    var item;
+    if (subId) {
+      item = goods.find(item => {
+        return item['goods_id'] == goodsId && item['subId'] == subId
+      })
+      if (item) {
+        item['num'] += num
+      } else {
+        goods.push({
+          'goods_id': goodsId,
+          'sub_id': subId,
+          'num': num
+        })
+      }
+    } else {
+      item = goods.find(item => {
+        return item['goods_id'] == goodsId
+      })
+      if (item) {
+        item['num'] += num
+      } else {
+        goods.push({
+          'goods_id': goodsId,
+          'num': num
+        })
+      }
+    }
+    if (goodsNums[goodsId]) {
+      goodsNums[goodsId] += num
+    } else {
+      goodsNums[goodsId] = num
+    }
+
+  },
+  removeGoodsNum(order, goodsId, subId, num = 1) {
+    var {goods, goodsNums} = order
+    if (subId) {
+      for(let i=0, len=goods.length; i<len;i++) {
+        let item = goods[i]
+        if(item['goods_id'] == goodsId && item['sub_id'] == subId) {
+
+        }
+      }
+    } else {
+
+    }
+    if (goodsNums[goodsId] > 1) {
+      goodsNums[goodsId] -= num
+    } else {
+      delete goodsNums[goodsId]
+    }
+  },
+
+  increase(e) {
+    var {order, info: {menus}} = this.data;
+    var {menuIndex, goodsIndex, subIndex} = e.currentTarget.dataset;
+    var goods = menus[menuIndex].goods2[goodsIndex];
+    var goods_id = goods['goods_id']
+    var sub_id;
+    if (subIndex >= 0) {
+      goods = goods.sub_goods[subIndex];
+      sub_id = goods['sub_id']
+    }
+    order.totalNum += 1;
+    order.totalPrice += +goods.price;
+    order.totalPackingFee += +goods.packing_fee;
+    this.addGoodsNum(order, goods_id, sub_id)
+    this.setData({
+      order
+    })
+  },
+  decrease(e) {
+    var {order, info: {menus}} = this.data;
+    var {menuIndex, goodsIndex, subIndex} = e.currentTarget.dataset;
+    var goods = menus[menuIndex].goods2[goodsIndex];
+    var goods_id = goods['goods_id']
+    var sub_id;
+    if (subIndex >= 0) {
+      goods = goods.sub_goods[subIndex];
+      sub_id = goods['sub_id']
+    }
+    order.totalNum -= 1;
+    order.totalPrice -= +goods.price;
+    order.totalPackingFee -= +goods.packing_fee;
+    this.removeGoodsNum(order, goods_id, sub_id)
+    this.setData({
+      order
+    })
   }
 })
\ No newline at end of file
diff --git a/app/pages/shop/show.wxml b/app/pages/shop/show.wxml
index 7cc5425..636ab86 100644
--- a/app/pages/shop/show.wxml
+++ b/app/pages/shop/show.wxml
@@ -1,22 +1,78 @@
-
+<import src="templates/goods-actions.wxml"/>
 <!--pages/shop/show.wxml-->
-<view class="shop-info weui-panel weui-panel_access">
-  <view class="weui-panel__bd">
-    <navigator url="" class="weui-media-box weui-media-box_appmsg" hover-class="shop-info_active">
-      <view class="weui-media-box__hd weui-media-box__hd_in-appmsg">
-        <image class="weui-media-box__thumb shop-info__pic" src="{{info.pic_url}}" />
-      </view>
-      <view class="weui-media-box__bd weui-media-box__bd_in-appmsg weui-cell__ft_in-access">
-        <view class="weui-media-box__title">{{info.seller_name}}</view>
-        <view class="weui-media-box__desc shop-info__desc">
-          {{info.min_price}}元起送 | {{info.delivery_fee}}元配送费 | {{info.reach_time}}分钟到达
+<view class="shop-show">
+  <view class="shop-info weui-panel weui-panel_access">
+    <view class="weui-panel__bd">
+      <navigator url="" hover-class="" class="weui-media-box weui-media-box_appmsg">
+        <view class="weui-media-box__hd weui-media-box__hd_in-appmsg">
+          <image class="weui-media-box__thumb shop-info__pic" src="{{info.pic_url}}" />
+        </view>
+        <view class="weui-media-box__bd weui-media-box__bd_in-appmsg weui-cell__ft_in-access">
+          <view class="weui-media-box__title">{{info.seller_name}}</view>
+          <view class="weui-media-box__desc shop-info__desc">
+            <view>
+              {{info.min_price}}元起送 | {{info.delivery_fee}}元配送费 | {{info.reach_time}}分钟到达
+            </view>
+            <view wx:if="{{info.notice}}">
+              公告: {{info.notice}}
+            </view>
+          </view>
+        </view>
+      </navigator>
+      <view wx:if="{{info.promotion && info.promotion.length > 0}}" class="promotion">
+        <swiper class="promotion-swiper" vertical="true" autoplay="true" interval="5000">
+          <swiper-item wx:key="index" wx:for="{{info.promotion}}" class="promotion-item">
+            <image class="promotion-item__icon" src="{{item.pic_url}}"></image>
+            <text>{{item.info}}</text>
+          </swiper-item>
+        </swiper>
+        <view class="promotion-total">
+          {{info.promotion.length}}个活动
         </view>
       </view>
-    </navigator>
-    <view wx:if="{{info.promotion && info.promotion.length > 0}}" class="promotion">
-        <view wx:for="{{info.promotion}}" wx:key="index" class="promotion-item">
-
+    </view>
+  </view>
+  <view class="shop-content">
+    <view class=" weui-tab">
+      <view class="weui-navbar">
+        <block wx:for="{{tabs}}" wx:key="*this">
+          <view id="{{index}}" class="weui-navbar__item {{activeIndex == index ? 'weui-bar__item_on' : ''}}" bindtap="tabClick">
+            <view class="weui-navbar__title">{{item}}</view>
+          </view>
+        </block>
+        <view class="weui-navbar__slider" style="left: {{sliderLeft}}px; transform: translateX({{sliderOffset}}px); -webkit-transform: translateX({{sliderOffset}}px);"></view>
+      </view>
+      <view class="weui-tab__panel">
+        <view class="weui-tab__content menu-tab weui-flex" hidden="{{activeIndex != 0}}">
+          <view  class="menu-list">
+            <view bindtap="menuClick" id="{{index}}" class="menu-item {{index == activeMenuIndex ? 'menu-item_active' : ''}} " wx:for="{{info.menus}}" wx:key="menu_id">
+              {{item.menu_name}}
+            </view>
+          </view>
+          <view wx:if="{{info.menus && info.menus[activeMenuIndex]}}" class="goods-list weui-flex__item">
+            <view class="goods-list__label">
+              {{info.menus[activeMenuIndex].menu_name}}
+            </view>
+            <view wx:for="{{info.menus[activeMenuIndex].goods2}}" wx:key="goods_id" class="goods-item weui-flex">
+              <image class="goods-item__pic" src="{{item.pic_url}}"></image>
+              <view class="weui-flex__item">
+                <view class="goods-item__name">{{item.goods_name}}</view>
+                <view class="goods-item__desc text-small grey-color">月售{{item.sales}}份</view>
+                <view class="goods-item__price primary-color text-large">¥{{item.price}}</view>
+                <view class="goods-item__actions">
+                  <view wx:if="{{item.sub_goods && item.sub_goods.length > 0}}" class="goods-item__sub-goods">
+                  选规格
+                    <view wx:if="{{order['goodsNum'][item.goods_id] > 0}}" class="weui-badge goods-item__sub-goods-badge">{{order['goodsNum'][item.goods_id]}}</view>
+                  </view>
+                  <template is="goods-actions" data="{{menu_index: activeMenuIndex, goods_index: index, num: order['goodsNums'][item.goods_id]}}" wx:else />
+                  
+                </view>
+              </view>
+            </view>
+          </view>
         </view>
+        <view class="weui-tab__content" hidden="{{activeIndex != 1}}">选项二的内容</view>
+      </view>
     </view>
   </view>
 </view>
\ No newline at end of file
diff --git a/app/pages/shop/show.wxss b/app/pages/shop/show.wxss
index 56d8ac6..60f4e9f 100644
--- a/app/pages/shop/show.wxss
+++ b/app/pages/shop/show.wxss
@@ -1,25 +1,149 @@
 /* pages/shop/show.wxss */
 
+@import './templates/goods-actions.wxss';
+
+.shop-show {
+  display: flex;
+  flex-direction: column;
+  height: 100vh;
+}
+
 .shop-info {
-    color: #fff;
-    background-color: #ff5801;
+  color: #fff;
+  background-color: #ff5801;
 }
 
 .shop-info::before {
-    border: none;
+  border: none;
 }
 
 .shop-info__desc {
-    color: #fff;
+  color: #fff;
 }
 
 .shop-info__pic {
-    margin-right: 10px;
-    height: 60px;
-    width: 60px;
-    border: 5rpx solid #fff;
-    border-radius: 50%;
+  margin-right: 10px;
+  height: 60px;
+  width: 60px;
+  border: 5rpx solid #fff;
+  border-radius: 50%;
 }
+
 .weui-cell__ft_in-access::after {
-    border-color: #fff;
+  border-color: #fff;
+}
+
+.promotion {
+  position: relative;
+  padding: 10px 15px;
+  font-size: 12px;
+}
+
+.promotion-swiper {
+  height: 20px;
+}
+
+.promotion-item {
+  padding-right: 80px;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+
+.promotion-total {
+  position: absolute;
+  top: 50%;
+  right: 15px;
+  margin-top: -10px;
+}
+
+.promotion-item__icon {
+  margin-right: 5px;
+  height: 18px;
+  width: 18px;
+  vertical-align: middle;
+}
+
+.shop-content {
+  flex: 1;
+  height: 0;
+  background-color: #fff;
+}
+
+/* menu-tab */
+
+.menu-tab {
+  padding-bottom: 50px;
+  box-sizing: border-box;
+  height: 100%;
+}
+
+.menu-list {
+  width: 80px;
+  font-size: 13px;
+  background-color: #fafafa;
+  text-align: center;
+  overflow-y: auto;
+}
+
+.menu-item {
+  padding: 10px;
+  border-bottom: 1rpx dashed #e8e8e8;
+}
+
+.menu-item_active {
+  background-color: #fff;
+  border-color: #fff;
+  border-left: 5rpx solid #ff5801;
+}
+
+/* goods-list */
+
+.goods-list {
+  overflow-y: auto;
+}
+
+.goods-list__label {
+  padding: 3px 8px;
+  font-size: 13px;
+  background-color: #fafafa;
+}
+
+.goods-item {
+  position: relative;
+  margin-left: 8px;
+  padding: 8px 8px 8px 0;
+}
+.goods-item:not(:last-child) {
+  border-bottom: 1rpx solid #e8e8e8;
+}
+.goods-item__name {
+    font-weight: 400;
+}
+
+.goods-item__pic {
+  margin-right: 8px;
+  width: 65px;
+  height: 65px;
+}
+
+.goods-item__actions {
+    position: absolute;
+    bottom: 8px;
+    right: 8px;
+}
+
+.goods-item__sub-goods {
+    position: relative;
+    padding: 3px 8px;
+    font-size: 12px;
+    color: #fff;
+    background-color: #ff5801;
+    border-radius: 8px / 50%;
+}
+
+.goods-item__sub-goods-badge {
+  position: absolute;
+  top: -0.5em;
+  right: -0.5em;
 }
\ No newline at end of file
diff --git a/app/pages/shop/templates/goods-actions.wxml b/app/pages/shop/templates/goods-actions.wxml
new file mode 100644
index 0000000..ce83fee
--- /dev/null
+++ b/app/pages/shop/templates/goods-actions.wxml
@@ -0,0 +1,9 @@
+<template name="goods-actions">
+  <view class="goods-actions weui-flex">
+    <block wx:if="{{num > 0}}">
+      <view data-menu-index="{{menu_index}}" data-goods-index="{{goods_index}}" data-sub-index="{{sub_index}}" bindtap="decease" class="goods-action-btn goods-action-btn_decrease">-</view>
+      <view class="goods-action-num">{{num}}</view>
+    </block>
+    <view data-menu-index="{{menu_index}}" data-goods-index="{{goods_index}}" data-sub-index="{{sub_index}}" bindtap="increase" class="goods-action-btn goods-action-btn_increase">+</view>
+  </view>
+</template>
\ No newline at end of file
diff --git a/app/pages/shop/templates/goods-actions.wxss b/app/pages/shop/templates/goods-actions.wxss
new file mode 100644
index 0000000..a95113f
--- /dev/null
+++ b/app/pages/shop/templates/goods-actions.wxss
@@ -0,0 +1,24 @@
+.goods-action-btn {
+    width: 25px;
+    height: 25px;
+    text-align: center;
+    color: #ff5801;
+    font-size: 1.2em;
+    line-height: 25px;
+    font-weight: 400;
+    box-sizing: border-box;
+    border-radius: 50%;
+}
+
+.goods-action-btn_decrease {
+    border: 1rpx solid #e8e8e8;
+}
+
+.goods-action-btn_increase {
+    background-color: #ff5801;
+    color: #fff;
+}
+
+.goods-action-num {
+    margin: 0 10px;
+}
\ No newline at end of file