From 2bacc5bd167ba84b52229aa4ff7eb0ac61dc91ef Mon Sep 17 00:00:00 2001
From: Ge Hao <althoughghgh@gmail.com>
Date: Sat, 8 Oct 2016 16:00:36 +0800
Subject: [PATCH] =?UTF-8?q?=E7=9F=A5=E9=81=93=E4=BA=86=E5=9B=BE=E7=89=87?=
 =?UTF-8?q?=E6=9C=80=E5=A4=A7=E5=B1=85=E4=B8=AD=EF=BC=8C=E8=A6=81=E7=94=A8?=
 =?UTF-8?q?class=E5=90=8D=E5=AD=97=E5=8E=BB=E5=86=99css=E6=89=8D=E8=83=BD?=
 =?UTF-8?q?=E8=A6=86=E7=9B=96=E5=8E=9F=E6=9D=A5=E7=9A=84=20=E5=87=86?=
 =?UTF-8?q?=E5=A4=87=E5=8A=A0=E5=85=A5=E8=B4=AD=E7=89=A9=E8=BD=A6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app.json                             |  22 ++++++++++++++++
 images/{product_show_1.png => 1.png} | Bin
 pages/show_product/show_product.js   |  18 +++++++++++---
 pages/show_product/show_product.wxml |  36 +++++++++++++++------------
 pages/show_product/show_product.wxss |  28 +++++++++++++++++++++
 5 files changed, 85 insertions(+), 19 deletions(-)
 rename images/{product_show_1.png => 1.png} (100%)

diff --git a/app.json b/app.json
index d9fed56..ab2c887 100644
--- a/app.json
+++ b/app.json
@@ -9,5 +9,27 @@
     "navigationBarBackgroundColor": "#fff",
     "navigationBarTitleText": "WeChat",
     "navigationBarTextStyle":"black"
+  },
+  "tabBar": {
+    "color": "#dddddd",
+    "selectedColor": "#3cc51f",
+    "borderStyle": "white",
+    "backgroundColor": "#fefefe",
+    "list": [{
+      "pagePath": "pages/index/index",
+      "iconPath": "images/1.png",
+      "selectedIconPath": "images/1.png",
+      "text": "首页"
+    },{
+      "pagePath": "pages/cart/cart",
+      "iconPath": "images/1.png",
+      "selectedIconPath": "images/1.png",
+      "text": "购物车"
+    },{
+      "pagePath": "pages/mine/mine",
+      "iconPath": "images/1.png",
+      "selectedIconPath": "images/1.png",
+      "text": "我的"
+    }]
   }
 }
diff --git a/images/product_show_1.png b/images/1.png
similarity index 100%
rename from images/product_show_1.png
rename to images/1.png
diff --git a/pages/show_product/show_product.js b/pages/show_product/show_product.js
index 70ca7ea..d10cebe 100644
--- a/pages/show_product/show_product.js
+++ b/pages/show_product/show_product.js
@@ -6,6 +6,7 @@ Page({
     title: '',
     id: 0,
     address: '',
+    quantity: 1,
     product: {}
   },
 
@@ -18,7 +19,7 @@ Page({
     this.data.id = params.id
 
     that.data.product = wx.getStorageSync('products').find(function(i){
-      return i.id === that.data.id;
+      return i.id === that.data.id
     })
   },
 
@@ -32,12 +33,23 @@ Page({
     })
   },
 
+  bindAddToCart (e) {
+    wx.setStorage({
+      key: `cart-${this.data.id}`,
+      data: {quantity: this.data.quantity}
+    })
+  },
+
+  bindQuantityInput (e) {
+    this.setData({'quantity': e.detail.value})
+  },
+
   formSubmit: function(e) {
     e.detail.value['sku'] = e.target.dataset['sku']
     //  address.postBuyProduct(e.detail.value)
     console.log('form发生了submit事件，携带数据为：', e.detail.value)
   },
-  formReset: function(e) {
-    console.log('form发生了reset事件')
+  formAddcart: function(e) {
+    console.log('form发生了addcart事件')
   }
 })
diff --git a/pages/show_product/show_product.wxml b/pages/show_product/show_product.wxml
index c7ea15f..365d6ba 100644
--- a/pages/show_product/show_product.wxml
+++ b/pages/show_product/show_product.wxml
@@ -1,28 +1,32 @@
 <view>
-  <image src="{{product.attributes['image-url']}}" mode="aspectFill"/>
-  <text>{{product.attributes.name}}</text>
-
-  <view wx:if="{{ address > 0 }}"  bindtap="bindTapAddress">
-    <text>{{address}}</text>
-    <text>修改地址</text>
-  </view>
-  <view wx:else bindtap="bindTapAddress">
-    <text>add new address</text>
+  <view>
+    <image class="head-img" src="{{product.attributes['image-url']}}" mode="aspectFit" />
   </view>
 
+  <text>{{product.attributes.name}}</text>
+
   <view>
-    <form bindsubmit="formSubmit" bindreset="formReset" data-sku="{{product.attributes.sku}}">
-      <view class="section">
-        <text class="">数量</text>
-        <input name="quantity" value="1" />
+    <form bindsubmit="formSubmit" data-sku="{{product.attributes.sku}}">
+      <view class="section quantity">
+        <view class="quantity">数量：</view>
+        <input id="quantity" name="quantity" bindinput="bindQuantityInput" value="1" />
       </view>
       <view class="section">
-        <text>¥{{product.attributes.price || '无法获取价格'}}</text>
+        <text id="price" >¥{{product.attributes.price || '无法获取价格'}}</text>
       </view>
       <view class="btn-area">
-        <button formType="submit">buy it!</button>
-        <button formType="reset">Reset</button>
+        <button formType="submit" type='primary'>立即购买</button>
+        <button bindtap="bindAddToCart">加入购物车</button>
       </view>
     </form>
   </view>
+
+  <view wx:if="{{ address > 0 }}"  bindtap="bindTapAddress">
+    <text>{{address}}</text>
+    <text>修改地址</text>
+  </view>
+  <view wx:else bindtap="bindTapAddress">
+    <text>add new address</text>
+  </view>
+
 </view>
diff --git a/pages/show_product/show_product.wxss b/pages/show_product/show_product.wxss
index e69de29..a09ed34 100644
--- a/pages/show_product/show_product.wxss
+++ b/pages/show_product/show_product.wxss
@@ -0,0 +1,28 @@
+.head-img {
+  width: 100%;
+}
+
+.quantity {
+  display: flex;
+  height: 60rpx;
+  line-height: 60rpx;
+}
+
+#quantity {
+  width: 80rpx;
+  border: 1rpx solid lightskyblue;
+}
+
+#price {
+  color: #FF0000;
+}
+
+.btn-area {
+  display: flex;
+}
+
+.btn-area button {
+  width: 100%;
+  border-radius: 0;
+  border-width: 0;
+}