new 2.0

vking
1 parent e4ba0e5e
Showing 5 changed files with 236 additions and 32 deletions
components/2.0/seller/card.js
components/2.0/seller/card.wxml
components/2.0/seller/card.wxss
pages/reserve/index.js
pages/reserve/index.wxml
--- a/components/2.0/seller/card.js
View file @cb450af
+++ b/components/2.0/seller/card.js
View file @cb450af
@@ -4,7 +4,8 @@ Component({
    * 组件的属性列表
    */
   properties: {
-
+    seller:Object,
+    activeSellerID:String,
   },
   /**
@@ -13,11 +14,18 @@ Component({
   data: {
   },
-
+  attached(){
+    this.initSeller()
+  },
   /**
    * 组件的方法列表
    */
   methods: {
-
+    initSeller(){
+      let seller=this.data.seller
+      this.setData({
+        seller:seller,
+      })
+    },
   }
 })
--- a/components/2.0/seller/card.wxml
View file @cb450af
+++ b/components/2.0/seller/card.wxml
View file @cb450af
 <!--components/2.0/seller/card.wxml-->
-<view class="view seller padding-sm margin-sm">
+<wxs src="../../../utils/util.wxs" module="util" />
+<view class="view seller padding-sm margin-sm {{activeSellerID==seller.id?'active':''}}">
     <view class="view flex avatar-block">
         <view class="view avatar">
-            <image src="" class="avatar-image" mode="aspectFill" lazy-load></image>
-            <view class="avatar-txt text-white text-xs text-center">111</view>
+            <image src="{{seller.seller_image?seller.seller_image+'?imageView2/2/w/320/interlace/0/q/100':'http://nosqn.colorcun.com/reserve/images/3x/%E6%9A%82%E6%97%A0.png'}}" class="avatar-image" mode="aspectFill" lazy-load></image>
+            <view class="avatar-txt text-white text-xs text-center" wx:if="{{seller.brand.name}}">{{seller.brand.name}}</view>
         </view>
         <view class="view detail margin-left-sm flex-treble margin-top-sm">
             <view class="view flex align-center justify-between" style="height: 52rpx;">
-                <view class="title">123{{seller.seller_name}}</view>
-                <view class="text-gray" style="font-size: 26rpx;">123</view>
+                <view class="title">{{seller.sellername}}</view>
+                <view class="text-gray" style="font-size: 26rpx;">{{util.distance(seller.distance||seller.distance_centre)}}</view>
             </view>
             <view class="view flex align-center text-gray margin-top-xs" style="height: 36rpx;">
-                <view class="caixi">123{{seller.seller_name}}</view>
+                <view class="caixi flex">
+                    <view class="caixi-item" wx:for="{{seller.cate}}" wx:key="sellercatekey" wx:if="{{index<3}}">{{item.name}}</view>
+                </view>
                 <view class="renjun flex margin-left-lg align-center">
                     <view class="text-22">¥</view>
-                    <view class="text-26" style="margin: 0 4rpx;">123</view>
+                    <view class="text-26" style="margin: 0 4rpx;">{{seller.average}}</view>
                     <view class="text-22">/人</view>
                 </view>
             </view>
             <view class="view flex align-center margin-top-xs active" style="height: 36rpx;">
-                <view class="cu-tag line-yellow text-orange view">123</view>
-                <view class="cu-tag  view">123</view>
-                <view class="cu-tag  view">123</view>
-                <view class="cu-tag  view">123</view>
+                <block wx:for="{{seller.activity}}" wx:key="selleractivitykey" wx:if="{{index<3}}">
+                    <view class="cu-tag line-yellow text-orange view">{{item.title}}</view>
+                </block>
             </view>
         </view>
     </view>
     <view class="view flex align-center justify-between margin-top-sm reserve-view">
         <view class="view rooms flex-treble flex" style="overflow-x: auto">
-            <view class="cu-tag round line-blue text-blue view">123</view>
-            <view class="cu-tag round line-blue text-blue view">123</view>
-            <view class="cu-tag round line-blue text-blue view">123</view>
-            <view class="cu-tag round line-blue text-blue view">123</view>
-            <view class="cu-tag round line-blue text-blue view">123</view>
-            <view class="cu-tag round line-blue text-blue view">123</view>
-            <view class="cu-tag round line-blue text-blue view">123</view>
-            <view class="cu-tag round line-blue text-blue view">123</view>
-            <view class="cu-tag round line-blue text-blue view">123</view>
-            <view class="cu-tag round line-blue text-blue view">123</view>
-            <view class="cu-tag round view cu-tag-end"></view>
+            <block wx:for="{{seller.class}}" wx:key="se-class">
+                <view class="cu-tag round line-blue text-blue view">{{item.name}}</view>
+            </block>
+            <view class="cu-tag round line-white text-blue view cu-tag-end"></view>
         </view>
         <view class="view button-view flex justify-end">
-            <view class="cu-btn bg-blue text-white round reserve-button text-df text-bold view">111</view>
+            <view class="cu-btn bg-blue text-white round reserve-button text-df text-bold view padding-xs">订包间</view>
         </view>
     </view>
 </view>
--- a/components/2.0/seller/card.wxss
View file @cb450af
+++ b/components/2.0/seller/card.wxss
View file @cb450af
@@ -7,6 +7,9 @@
     border-radius: 20rpx;
     position: relative;
 }
+.seller.active{
+    border: 2rpx solid #FFC9AA;
+}
 .avatar{
     position: relative;
 }
@@ -87,6 +90,9 @@
     content: "";
     display: block;
 }
+.seller.active .button-view:after{
+    top:-26rpx;
+}
 .reserve-button{
     width: 124rpx;
     height: 56rpx;
--- a/pages/reserve/index.js
View file @cb450af
+++ b/pages/reserve/index.js
View file @cb450af
@@ -6,6 +6,7 @@ const {regeneratorRuntime} = global
 const mapScale = 15//18;
 const def_latitude = 39.684670;
 const def_longitude = 118.176300;
+const cates_version = '?1.2';
 Page({
   data:{
     map:{},
@@ -80,6 +81,196 @@ Page({
       return;
     }
   },
+  debounceTimer:null,
+  debounce(func,wait){
+    if(this.debounceTimer){
+      clearTimeout(this.debounceTimer)
+    }
+    this.debounceTimer=setTimeout(()=>{
+      this.debounceTimer=null;
+      func()
+    },wait);
+  },
+  regionChange(e){
+    if(e.type=='end'){
+      console.log('regionChange', e)
+      this.debounce(this.regionChangeDo,800)
+    }
+  },
+  mapCtx:null,
+  mapData: {
+    latitude: 0,
+    longitude: 0,
+    scale: 30,
+    hasRegionchange: false,
+    region: {
+      southwest: {},
+      northeast: {},
+    },
+  },
+  regionChangeDo(){
+    console.log('regionChangeDo')
+    if(!this.mapCtx){
+      this.mapCtx = wx.createMapContext('map')
+    }
+    if(!this.mapCtx) return;
+    this.mapCtx.getRegion({
+      success: (res) => {
+        this.hasClickMoveToLocation = false
+        if (res.southwest.latitude) {
+          this.mapData.region = res
+        }
+        ;
+        this.getSellers();
+      },
+    })
+  },
+  hasSellers:0,
+  sellers:[],
+  getSellers(){
+    console.log('getSellers',this.mapScale,this.mapData)
+    let param = {
+      lat: this.user.latitude == def_latitude ? '' : this.user.latitude,
+      lng: this.user.longitude == def_longitude ? '' : this.user.longitude,
+      offset: 0,
+      rows: 100,
+      distance: 100000,
+      map: JSON.stringify({...this.mapData.region, scale: 50})
+    }
+    if (param.lat) {
+      param.centre_pos = `${param.lat},${param.lng}`
+    } else {
+      let lat = (this.mapData.region.southwest.latitude + this.mapData.region.northeast.latitude) / 2
+      let lng = (this.mapData.region.southwest.longitude + this.mapData.region.northeast.longitude) / 2
+      param.centre_pos = `${lat},${lng}`
+    }
+    /*
+    if (this.data.multiIndex[0] > 0) {
+      param.cuisine = await DA.getCatesID(this.data.multiIndex[0] - 1);
+    }
+    let tags = [];
+    this.data.tags.forEach(t => {
+      if (t.active) {
+        tags.push(t.id)
+      }
+    })
+    if (tags.length > 0) {
+      param.tags = tags;
+    }
+    if (param.lat) {
+      param.centre_pos = `${param.lat},${param.lng}`
+    } else {
+      let lat = (this.mapData.region.southwest.latitude + this.mapData.region.northeast.latitude) / 2
+      let lng = (this.mapData.region.southwest.longitude + this.mapData.region.northeast.longitude) / 2
+      param.centre_pos = `${lat},${lng}`
+    }
+    if (this.data.hasSuggestion) {
+      param.centre_pos = `${this.data.suggestion.latitude},${this.data.suggestion.longitude}`
+    }
+    if (this.findSellerData) {
+      param = Object.assign(param, this.findSellerData.paramObj)
+    }
+    if (this.filterParams) {//人均过滤
+      let filterParams = this.filterParams.min + ',' + this.filterParams.max
+      if (this.filterParams.min == this.filterParams.max && this.filterParams.min == 300) {
+        filterParams = this.filterParams.min + ',' + parseInt(new Date() / 1000)
+      }
+      param.average = filterParams
+    }
+    */
+    //this.selectComponent('#list').getList(param);
+    this.param = param;
+    App.Customer.SellerList(param).then(async res => {
+      if (res.ret == 200) {
+        this.hasSellers=res.data.flag
+        this.sellers=res.data.list
+        this.makeMarker();
+        this.makeSellers();
+      }
+    })
+
+  },
+  makeMarker(){
+    this.mapCtx.getScale({
+      success: (res) => {
+        this.mapData.scale = res.scale;
+        let markers=[]
+        let sellersLength=this.sellers.length
+        this.sellers.forEach((seller,si)=>{
+          let marker = {
+            id: seller.id,
+            iconPath: "http://nosqn.colorcun.com/custom/lite-online/cates/circle1x5.png" + cates_version,
+            latitude: seller.lat,
+            longitude: seller.long,
+            width: 8,
+            height: 8,
+            //title:seller.seller_name,
+            zIndex: sellersLength - si,
+            zIndexBak: sellersLength - si,
+            //seller: seller,
+          };
+          if (seller.mode.length > 0) {
+            seller.mode.forEach(x => {
+              if (x.id == 1) {//大图标
+                marker.iconPath = "http://nosqn.colorcun.com/custom/lite-online/cates/其他菜品.png";
+                if (seller.cate.length > 0) {
+                  marker.iconPath = seller.cate[0].icon
+                }
+                marker.iconPath = marker.iconPath.replace(/\/cates\/(.*)\.png/, function ($0, $1) {
+                  return '/cates/' + encodeURI($1) + '.png'
+                })
+                marker.iconPath += cates_version
+                marker.width = 20;
+                marker.height = 25;
+              }
+            })
+          }
+          markers.push(marker)
+        })
+        this.setData({
+          markers:markers,
+        })
+      },
+    })
+  },
+  makeSellers(){
+    this.setData({
+      sellers:this.sellers,
+    })
+  },
+  markertap(e){
+    let markers=this.data.markers
+    this.activeSellerID = e.markerId
+    let bl = 1.2;
+    markers.forEach((m, i) => {
+      m.iconPath = m.iconPath.replace('/cates-active/', '/cates/')
+      m.zIndex = m.zIndexBak
+      if (m.width == 20 * bl) {
+        m.width = 20;
+        m.height = 25;
+      }
+      if (m.width == 12) {
+        m.width = 8;
+        m.height = 8;
+      }
+      if (m.id == e.markerId) {
+        m.iconPath = m.iconPath.replace('/cates/', '/cates-active/')
+        if (m.width == 20) {
+          m.width = 20 * bl;
+          m.height = 25 * bl;
+        } else {
+          m.width = 12;
+          m.height = 12;
+        }
+        m.zIndex = 9999
+      }
+    })
+    let obj = {
+      markers: markers,
+      activeSellerID:this.activeSellerID,
+    };
+    this.setData(obj)
+  },
   back:function() {
     /*
     var mta = require('mta-wechat-analysis')
--- a/pages/reserve/index.wxml
View file @cb450af
+++ b/pages/reserve/index.wxml
View file @cb450af
@@ -4,7 +4,7 @@
      markers="{{markers}}" polygons="{{polygons}}"
      bindmarkertap="markertap"
      bindcallouttap="markertap"
-     bindregionchange="regionchange"
+     bindregionchange="regionChange"
      bindupdated="mapUpdated"
      show-location="{{false}}"
      enable-3D="{{false}}"
@@ -17,7 +17,9 @@
 <view class="view content" style="height: {{height}}px;">
     <filter-group height="{{height}}"></filter-group>
     <scroll-view class="view scroll-view" scroll-y="true" bindscroll="scroll" style="width:100%;height: {{height-50}}px;">
-        <seller-card class="seller-card" seller="{{item}}" wx:for="{{['','','','']}}" wx:key="sellers"></seller-card>
+        <seller-card class="seller-card"
+                     activeSellerID="{{activeSellerID}}"
+                     seller="{{item}}" wx:for="{{sellers}}" wx:key="sellers"></seller-card>
         <view class="view" style="height: 192rpx;"></view>
     </scroll-view>
 </view>
@@ -25,10 +27,12 @@
 <view bindtap="moveToLocation" class="view moveToLocation flex align-center justify-center">
     <image class="moveToLocation-image" src="http://nosqn.colorcun.com/2.0/home%20%2811%29.png"></image>
 </view>
-<view class="me view flex flex-direction align-center justify-center bg-white round">
-    <view class="icon view"></view>
-    <view class="text">我的</view>
-</view>
+<navigator url="/pages/me/index" hover-class="navigator-hover">
+    <view class="me view flex flex-direction align-center justify-center bg-white round">
+        <view class="icon view"></view>
+        <view class="text">我的</view>
+    </view>
+</navigator>
 <!--
 <view class="toast" wx:if="{{hasGetSellersEnd && listMoreCount<1 && !hasSearchLimit}}">该地区没有可供预订的餐厅哦！努力开通中</view>