category 列表页面

pages/cart/cart.js

@@ -44,7 +44,7 @@ Page({
   },
 
   // tap on item to delete cart item
-  bindTapOnItem: function (e) {
+  catchTapOnItem: function (e) {
     this.setData({
       deleteModalHidden: false,
       wantToDeleteItem: e.currentTarget.dataset.id

pages/cart/cart.wxml

@@ -17,17 +17,17 @@
 
 <view wx:if="{{cartItems}}">
   <block wx:for="{{cartItems}}" wx:for-item="item">
-    <view class="item" data-id="{{item.id}}">
-      <view class="image" bindtap="bindTapOnItem" data-id="{{item.id}}">
+    <view class="item" catchtap="catchTapOnItem" data-id="{{item.id}}">
+      <view class="image" data-id="{{item.id}}">
         <image class="head-img" src="{{item.product['image-url']}}" mode="aspectFit"></image>
       </view>
       <view class="item-right">
-        <view class="title" bindtap="bindTapOnItem" data-id="{{item.id}}">
+        <view class="title" data-id="{{item.id}}">
           <text> {{item.product.name}} </text>
         </view>
         <view class="numbers">
           <view>
-            <text class="price" bindtap="bindTapOnItem" data-id="{{item.id}}"> ¥{{item.product.price}} / 件 </text>
+            <text class="price" data-id="{{item.id}}"> ¥{{item.product.price}} / 件 </text>
           </view>
           <view class="pull-right">
             <view>

pages/cart/cart.wxss

@@ -9,10 +9,7 @@
 
 .receiver {
   display: flex;
-}
-
-.left {
-  width: 60%;
+  justify-content: space-between;
 }
 
 .address {
@@ -20,7 +17,6 @@
 } 
 
 .right {
-  width: 40%;
   margin-left: auto;
   text-align: right;
 }

pages/category/category.js

@@ -22,5 +22,37 @@ Page({
       var data = wx.getStorage(key)
       wx.setData({items: data})
     })
+  },
+
+  bindShowProduct: function(e) {
+    var that = this
+    var cartItems = wx.getStorageSync('cartItems') || []
+    var thisItem  = this.data.items.find(function(ele){
+      return ele.id === e.currentTarget.dataset.id
+    })
+    debugger
+
+    var exist = cartItems.find(function(ele){
+      return ele.id === that.data.id
+    })
+
+    if (exist) {
+      exist.quantity = '1'
+    } else {
+      cartItems.push({
+        id: thisItem.id,
+        quantity: '1',
+        product: thisItem
+      })
+    }
+    wx.setStorage({
+      key: 'cartItems',
+      data: cartItems
+    })
+
+    wx.redirectTo({
+      url: '../cart/cart'
+    })
+
   }
 })

pages/category/category.wxml

@@ -1,7 +1,16 @@
 <scroll-view scroll-y="true" height="100%">
-  <block wx:for="{{items}}" wx:for-item="item">
-    <view class="item" bindtap="bindShowProduct" data-id="{{item.id}}">
-      <image class="head-img" src="{{item['image-url']}}" mode="aspectFit"></image>
-    </view>
-  </block>
+  <view class="item-container">
+    <block wx:for="{{items}}" wx:for-item="item">
+      <view class="item" bindtap="bindShowProduct" data-id="{{item.id}}">
+        <image class="head-img" src="{{item['image-url']}}" mode="scaleToFill"></image>    
+        <view class="first-line">
+          <text class="name">{{item.name}}</text>
+        </view>
+        <view class="second-line">
+          <text>¥{{item.price}}</text>
+          <text>加入购物车</text>
+        </view>
+      </view>
+    </block>
+  </view>
 </scroll-view>

pages/category/category.wxss

@@ -0,0 +1,33 @@
+.item-container {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  margin-bottom: 100rpx;
+}
+
+.item {
+  width: 335rpx;
+  margin-bottom: 80rpx;
+  display: flex;
+  flex-direction: column;
+  font-size: 30rpx;
+  margin-left: 20rpx;
+  margin-right: 20rpx;
+}
+
+.item image {
+  width: 335rpx;
+  height: 335rpx;
+  margin-bottom: 20rpx;
+}
+
+.item .first-line {
+  font-size: 25rpx;
+  margin-bottom: 20rpx;
+}
+
+.item .second-line {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+}

pages/index/index.js

@@ -4,10 +4,10 @@ Page({
   data: {
     items: [],
     slides: [],
-    navs: [{icon: "../../images/asset.png", name: "资产"},
+    navs: [{icon: "../../images/asset.png",       name: "资产"},
            {icon: "../../images/direct_sale.png", name: "直销"},
-           {icon: "../../images/recommend.png", name: "严选"},
-           {icon: "../../images/packing.png", name: "包装"}],
+           {icon: "../../images/recommend.png",   name: "严选"},
+           {icon: "../../images/packing.png",     name: "包装"}],
 
     popularity_products: [],
     new_products: [],

utils/product.js

@@ -39,7 +39,7 @@ function postBilling (data) {
 function getCategories (data) {
   return new Promise((resolve, reject) => {
     wx.request({
-      url: `${API_URL}/products?category=${data}`,
+      url: `${API_URL}/products/category?type=${data}`,
       header: { 'Content-Type': 'application/json'},
       success: resolve,
       fail: reject