商品分类

app/app.json

@@ -1,6 +1,8 @@
 {
   "pages": [
     "pages/index/index",
+    "pages/index/category",
+    "pages/index/search",
     "pages/shop/show",
     "pages/order/list",
     "pages/order/show",
@@ -10,9 +12,7 @@
     "pages/address/list",
     "pages/index/address",
     "pages/address/add",
-    "pages/login/login",
+    "pages/login/login"
-    "pages/shop/category",
-    "pages/shop/search"
   ],
   "window": {
     "backgroundColor": "#f8f8f8",

app/pages/index/category.js

@@ -0,0 +1,126 @@
+// pages/index/category.js
+import {
+  getSellersByCategory
+} from '../../utils/apis'
+
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    page: 0,
+    hasMore: true,
+    loading: false
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+    this.id = options.id || 1
+    this.loadData()
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+    var {loading, hasMore} = this.data
+    if (hasMore && !loading) {
+      this.loadData()
+    }
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  loadData() {
+    var that = this
+    var {id: category_id} = this
+    var {loading, page} = this.data
+    if (loading) {
+      return
+    }
+    that.setData({
+      loading: true
+    })
+
+    getSellersByCategory({
+      category_id, page,
+      success(data) {
+        var {list} = that.data
+        var {
+          list: list2, count, page
+        } = data
+        list2 = list2.map(item => {
+          item['distanceFormat'] = (item.distance / 1000).toFixed(2)
+          return item
+        })
+        that.setData({
+          loading: false,
+          list: list ? list.concat(list2) : list2,
+          hasMore: count == 10,
+          page: page + 1
+        })
+        wx.setNavigationBarTitle({
+          title: data.title,
+        })
+      }
+    })
+
+  }
+})

app/pages/index/category.wxml

@@ -0,0 +1,9 @@
+<!--pages/index/category.wxml-->
+<import src="/templates/load-more.wxml" />
+<import src="templates/shop.wxml" />
+
+<view class="shop-list">
+  <template is="shop" wx:for="{{list}}" wx:key="{{seller_id}}" data="{{...item}}"></template>
+</view>
+
+<template is="load-more" data="{{loading: loading, hasMore: hasMore, noMoreLabel: '更多商家接入中, 敬请期待'}}"></template>

app/pages/index/category.wxss

@@ -0,0 +1,7 @@
+/* pages/index/category.wxss */
+@import '/templates/load-more.wxss';
+@import './templates/shop.wxss';
+
+.shop-list {
+  margin-top: 10px;
+}

app/pages/index/index.js

@@ -76,7 +76,7 @@ Page({
     }
     var that = this
     var {
-      page, currentAddress,
+      page,
     } = this.data
 
     this.setData({
@@ -84,7 +84,6 @@ Page({
     })
     getSellers({
       page,
-      address: currentAddress,
       success(data) {
         var {
           shopList

app/pages/index/index.wxml

@@ -1,5 +1,5 @@
-<import src="/templates/star-rate.wxml" />
 <import src="/templates/load-more.wxml" />
+<import src="templates/shop.wxml" />
 
 <!--index.wxml-->
 <view class="topbar">
@@ -11,7 +11,7 @@
   </view>
 </view>
 <view class="category">
-  <navigator class="category__item" url="" wx:for="{{category}}" wx:key="category_id">
+  <navigator class="category__item" url="/pages/index/category?id={{item.category_id}}" wx:for="{{category}}" wx:key="category_id">
     <view>
       <image src="{{item.icon}}" class="category__icon"></image>
     </view>
@@ -20,36 +20,7 @@
 </view>
 <view class="weui-panel weui-panel_access">
   <view class="weui-panel__bd shop__list">
-    <navigator url="/pages/shop/show?id={{item.seller_id}}" wx:for="{{shopList}}" wx:key="{{seller_id}}" class="weui-media-box weui-media-box_appmsg shop__item" hover-class="weui-cell_active">
+    <template is="shop" wx:for="{{shopList}}" wx:key="{{seller_id}}" data="{{...item}}"></template>
-      <view class="weui-media-box__hd weui-media-box__hd_in-appmsg">
-        <image class="weui-media-box__thumb" src="{{item.pic_url}}" />
-      </view>
-      <view class="weui-media-box__bd weui-media-box__bd_in-appmsg">
-        <view class="weui-media-box__title">{{item.seller_name}}</view>
-        <view class="weui-media-box__desc shop__desc">
-          <view class="shop__sales">
-            <view class="shop__star">
-              <template is="star-rate" data="{{value: item.overall}}" />
-            </view>
-            <view>月售 {{item.sales}} 单</view>
-          </view>
-
-          <view class="shop__misc weui-flex">
-            <view class="shop__fee weui-flex__item">
-              起送 ¥{{item.min_price}}
-            </view>
-            <text class="shop__reach-time grey-color">{{item.distanceFormat}}km</text> |
-            <text class="shop__reach-time primary-color">{{item.reach_time}}分钟</text>
-          </view>
-        </view>
-        <view wx:if="{{item.promotion.length > 0}}" class="shop__promotion">
-          <view wx:for="{{item.promotion}}" wx:key="index" class="shop__promotion-item">
-            <image class="shop__promotion-icon" src="{{item.pic_url}}"></image>
-            {{item.info}}
-          </view>
-        </view>
-      </view>
-    </navigator>
   </view>
 </view>
 <template is="load-more" data="{{loading: loading, hasMore: hasMore, noMoreLabel: '更多商家接入中, 敬请期待'}}"></template>

app/pages/index/index.wxss

@@ -1,7 +1,6 @@
 /**index.wxss**/
 
-@import './shop.wxss';
+@import './templates/shop.wxss';
-@import '/templates/star-rate.wxss';
 @import '/templates/load-more.wxss';
 
 .topbar {

app/pages/index/search.js

@@ -0,0 +1,80 @@
+// pages/index/search.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+  
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+  
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+  
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+  
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+  
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+  
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+  
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+  
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+  
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+  
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+  
+  }
+})

app/pages/index/search.wxml

@@ -0,0 +1,2 @@
+<!--pages/index/search.wxml-->
+<text>pages/index/search.wxml</text>

app/pages/index/search.wxss

@@ -0,0 +1 @@
+/* pages/index/search.wxss */

app/pages/index/templates/shop.wxml

@@ -0,0 +1,34 @@
+<import src="/templates/star-rate.wxml" />
+
+<template name="shop">
+  <navigator url="/pages/shop/show?id={{seller_id}}" class="weui-media-box weui-media-box_appmsg shop__item" hover-class="weui-cell_active">
+    <view class="weui-media-box__hd weui-media-box__hd_in-appmsg">
+      <image class="weui-media-box__thumb" src="{{pic_url}}" />
+    </view>
+    <view class="weui-media-box__bd weui-media-box__bd_in-appmsg">
+      <view class="weui-media-box__title">{{seller_name}}</view>
+      <view class="weui-media-box__desc shop__desc">
+        <view class="shop__sales">
+          <view class="shop__star">
+            <template is="star-rate" data="{{value: overall}}" />
+          </view>
+          <view>月售 {{sales}} 单</view>
+        </view>
+
+        <view class="shop__misc weui-flex">
+          <view class="shop__fee weui-flex__item">
+            起送 ¥{{min_price}}
+          </view>
+          <text class="shop__reach-time grey-color">{{distanceFormat}}km</text> |
+          <text class="shop__reach-time primary-color">{{reach_time}}分钟</text>
+        </view>
+      </view>
+      <view wx:if="{{promotion.length > 0}}" class="shop__promotion">
+        <view wx:for="{{promotion}}" wx:key="index" class="shop__promotion-item">
+          <image class="shop__promotion-icon" src="{{item.pic_url}}"></image>
+          {{item.info}}
+        </view>
+      </view>
+    </view>
+  </navigator>
+</template>

app/pages/index/templates/shop.wxss

@@ -1,5 +1,8 @@
+@import '/templates/star-rate.wxss';
+
 .shop__item {
   align-items: flex-start;
+  background-color: #fff;
 }
 
 .shop__sales {

app/pages/shop/category.js

@@ -1,19 +0,0 @@
-// pages/shop/category.js
-Page({
-  data:{},
-  onLoad:function(options){
-    // 页面初始化 options为页面跳转所带来的参数
-  },
-  onReady:function(){
-    // 页面渲染完成
-  },
-  onShow:function(){
-    // 页面显示
-  },
-  onHide:function(){
-    // 页面隐藏
-  },
-  onUnload:function(){
-    // 页面关闭
-  }
-})

app/pages/shop/category.wxml

@@ -1,2 +0,0 @@
-<!--pages/shop/category.wxml-->
-<text>pages/shop/category.wxml</text>

app/pages/shop/category.wxss

@@ -1 +0,0 @@
-/* pages/shop/category.wxss */

app/pages/shop/search.js

@@ -1,19 +0,0 @@
-// pages/shop/search.js
-Page({
-  data:{},
-  onLoad:function(options){
-    // 页面初始化 options为页面跳转所带来的参数
-  },
-  onReady:function(){
-    // 页面渲染完成
-  },
-  onShow:function(){
-    // 页面显示
-  },
-  onHide:function(){
-    // 页面隐藏
-  },
-  onUnload:function(){
-    // 页面关闭
-  }
-})

app/pages/shop/search.wxml

@@ -1,2 +0,0 @@
-<!--pages/shop/search.wxml-->
-<text>pages/shop/search.wxml</text>

app/pages/shop/search.wxss

@@ -1 +0,0 @@
-/* pages/shop/search.wxss */

app/utils/apis.js

@@ -6,23 +6,25 @@ import {
 // 获取商店列表
 export function getSellers(options) {
   var {
-    page, address,
+    page,
     success
   } = options
   page = page || 0
-  var location = address.location
+  getApp().getCurrentAddress(address => {
-  fetch({
+    var location = address.location
-    url: 'index.php?m=Mall&c=Seller&a=getSellers',
+    fetch({
-    data: {
+      url: 'index.php?m=Mall&c=Seller&a=getSellers',
-      page,
+      data: {
-      city_name: address.city,
+        page,
-      city_id: address.city_id,
+        city_name: address.city,
-      district_name: address.district,
+        city_id: address.city_id,
-      district_id: address.district_id,
+        district_name: address.district,
-      longitude: location.longitude,
+        district_id: address.district_id,
-      latitude: location.latitude
+        longitude: location.longitude,
-    },
+        latitude: location.latitude
-    success
+      },
+      success
+    })
   })
 }
 
@@ -483,4 +485,35 @@ export function getPayment(options) {
     })
 
   })
-}
+}
+
+
+// 获取分组列表
+export function getSellersByCategory(options) {
+  var {
+    category_id, page,
+    success, error
+  } = options
+  page = page || 0
+  getApp().getCurrentAddress(address => {
+    var {
+      location,
+      city_id,
+      city: city_name,
+      district_id,
+      district: district_name
+    } = address
+    fetch({
+      url: 'index.php?m=Mall&c=Seller&a=getSellersByCategory',
+      data: {
+        category_id,
+        city_id, city_name,
+        district_id, district_name,
+        page,
+        gps: `${location.longitude},${location.latitude}`,
+      },
+      success, error
+    })
+
+  })
+}