Commit 6db41b66d45b0cd8b5fd227cb49fbda7ed3e305d

Authored by wangfan
1 parent abb476ab

reserve index

1 // components/reserve/seller-box/seller-box.js 1 // components/reserve/seller-box/seller-box.js
  2 +import util from '../../../utils/util';
  3 +import App from '../../../utils/api';
  4 +const {regeneratorRuntime} = global
2 Component({ 5 Component({
3 /** 6 /**
4 * 组件的属性列表 7 * 组件的属性列表
5 */ 8 */
6 properties: { 9 properties: {
7 - seller:{  
8 - type:Object,  
9 - value:{}  
10 - } 10 +
11 }, 11 },
12 12
13 /** 13 /**
@@ -15,15 +15,23 @@ Component({ @@ -15,15 +15,23 @@ Component({
15 */ 15 */
16 data: { 16 data: {
17 hasShow:false, 17 hasShow:false,
  18 + seller:{},
18 }, 19 },
19 20
20 /** 21 /**
21 * 组件的方法列表 22 * 组件的方法列表
22 */ 23 */
23 methods: { 24 methods: {
24 - show(){ 25 + show(seller){
  26 + seller.distance=parseInt(seller.distance);
  27 + if(seller.distance>1000){
  28 + seller.distance=(seller.distance/1000).toFixed(2)+'公里'
  29 + }else{
  30 + seller.distance+='米';
  31 + }
25 this.setData({ 32 this.setData({
26 hasShow:true, 33 hasShow:true,
  34 + seller:seller,
27 }) 35 })
28 }, 36 },
29 hide(){ 37 hide(){
@@ -31,6 +39,30 @@ Component({ @@ -31,6 +39,30 @@ Component({
31 hasShow:false, 39 hasShow:false,
32 }) 40 })
33 this.triggerEvent('event',{type:'hide'}); 41 this.triggerEvent('event',{type:'hide'});
34 - } 42 + },
  43 + tapButton(e){
  44 + let type=util.attr(e,'type');
  45 + if(type=='oncall'){
  46 + if(!this.data.seller.phone){
  47 + return util.toast('商家电话错误','none');
  48 + }
  49 + wx.makePhoneCall({
  50 + phoneNumber:this.data.seller.phone
  51 + })
  52 + }else{
  53 + util.toast('请打电话预定','none');
  54 + }
  55 + },
  56 + lookLocation:function(){
  57 + wx.openLocation({
  58 + latitude:Number(this.data.seller.lat),
  59 + longitude:Number(this.data.seller.long),
  60 + scale:17,
  61 + address:this.data.seller.map_address,
  62 + success:function (res) {
  63 + console.log(res)
  64 + }
  65 + })
  66 + },
35 } 67 }
36 }) 68 })
@@ -2,16 +2,39 @@ @@ -2,16 +2,39 @@
2 <cover-view class="mask flex-vr" hidden="{{!hasShow}}" bindtap="hide"> 2 <cover-view class="mask flex-vr" hidden="{{!hasShow}}" bindtap="hide">
3 <cover-view class="showModal"> 3 <cover-view class="showModal">
4 <cover-view class="header"> 4 <cover-view class="header">
5 - {{seller.seller_name}} 5 + {{seller.sellername}}
6 </cover-view> 6 </cover-view>
7 - <cover-view class="body">{{opt.body}}</cover-view>  
8 - <cover-view class="footer flex-cc">  
9 - <button class="button-none cancel" plain wx:if="{{opt.cancelText}}"  
10 - bindtap="tapButton" data-type="cancel"  
11 - style="color:{{opt.cancelColor}};">{{opt.cancelText}}</button>  
12 - <button class="button-none" plain  
13 - bindtap="tapButton" data-type="confirm"  
14 - style="color:{{opt.confirmColor}};">{{opt.confirmText}}</button> 7 + <cover-view class="tip flex-lr">
  8 + <cover-view class="ping flex-ll">★★★★★
  9 + <cover-view style="color: #353535; text-indent: 40rpx">¥50元/人</cover-view>
  10 + </cover-view>
  11 + <cover-view class="type">潮汕火锅</cover-view>
  12 + </cover-view>
  13 + <cover-view class="info flex-ll">
  14 + <cover-image src="/pages/image/add-act.png" style="width: 30rpx; height: 30rpx; background-color: #F4A22A"></cover-image>
  15 + <cover-view class="type">在线订座买单8折起</cover-view>
  16 + </cover-view>
  17 + <cover-view class="info flex-ll">
  18 + <cover-view src="" style="width: 30rpx; height: 30rpx;"></cover-view>
  19 + <cover-view class="type">赠送精美小菜和饮品</cover-view>
  20 + </cover-view>
  21 + <cover-view class="info flex-ll" style="margin-top: 22rpx;">
  22 + <cover-image src="/pages/image/gps-icon.png" style="width: 26rpx; height: 32rpx;"></cover-image>
  23 + <cover-view class="type" catchtap="lookLocation">{{seller.map_address}}</cover-view>
  24 + </cover-view>
  25 + <cover-view class="body"></cover-view>
  26 + </cover-view>
  27 + <cover-view class="footer flex-lr">
  28 + <cover-view class="flex-lr left">
  29 + 距离{{seller.distance}}
  30 + </cover-view>
  31 + <cover-view class="flex-lr right">
  32 + <button class="button-none online" plain
  33 + bindtap="tapButton" data-type="online"
  34 + style="color:{{opt.cancelColor}};">在线预订</button>
  35 + <button class="button-none oncall"
  36 + bindtap="tapButton" data-type="oncall"
  37 + style="color:{{opt.confirmColor}};">电话预定</button>
15 </cover-view> 38 </cover-view>
16 </cover-view> 39 </cover-view>
17 </cover-view> 40 </cover-view>
@@ -13,11 +13,14 @@ @@ -13,11 +13,14 @@
13 width: 90%; 13 width: 90%;
14 background-color: #fff; 14 background-color: #fff;
15 padding: 20rpx 5% 0 5%; 15 padding: 20rpx 5% 0 5%;
  16 +/* border-top-left-radius:20rpx;
  17 + border-top-right-radius:20rpx;*/
16 } 18 }
17 .showModal .header{ 19 .showModal .header{
18 font-size: 40rpx; 20 font-size: 40rpx;
19 - line-height: 120rpx;  
20 - height: 120rpx; 21 + line-height: 60rpx;
  22 + height: 60rpx;
  23 +
21 } 24 }
22 .showModal .body{ 25 .showModal .body{
23 font-size: 30rpx; 26 font-size: 30rpx;
@@ -26,13 +29,50 @@ @@ -26,13 +29,50 @@
26 .footer{ 29 .footer{
27 border-top: 2rpx solid #ccc; 30 border-top: 2rpx solid #ccc;
28 background-color: #fff; 31 background-color: #fff;
29 - width: 90%; 32 + width: 100%;
30 } 33 }
31 .footer .button-none{ 34 .footer .button-none{
32 - line-height: 120rpx;  
33 - height: 120rpx;  
34 - border-width: 0; 35 + margin: 30rpx 0;
  36 + font-size: 36rpx;
  37 + height: 82rpx;
  38 + line-height: 82rpx;
  39 + border-radius: 4rpx;
  40 + padding: 0 34rpx;
  41 +}
  42 +.footer .button-none.online{
  43 + border: 2rpx solid #393939;
  44 + color: #353535;
  45 + margin-right: 20rpx;
  46 +}
  47 +.footer .button-none.oncall{
  48 + border: 2rpx solid #393939;
  49 + background-color: #393939;
  50 + color: #FEFEFE;
  51 +}
  52 +.footer .left{
  53 + margin-left: 40rpx;
  54 + font-size: 30rpx;
  55 +}
  56 +.footer .right{
  57 + margin-right: 40rpx;
  58 + font-size: 36rpx;
  59 +}
  60 +
  61 +.tip{
  62 + font-size: 30rpx;
  63 + height: 42rpx;
  64 + line-height: 42rpx;
  65 + margin: 8rpx 0 2rpx;
  66 +}
  67 +.tip .ping{
  68 + color: #F4A22A;
  69 +}
  70 +.info{
  71 + font-size: 30rpx;
  72 + height: 42rpx;
  73 + line-height: 42rpx;
  74 + margin-bottom: 6rpx;
  75 +}
  76 +.info cover-view:last-child{
  77 + margin-left: 22rpx;
35 } 78 }
36 -.footer .button-none.cancel{  
37 - border-right: 2rpx solid #ccc !important;  
38 -}  
@@ -88,7 +88,7 @@ Page({ @@ -88,7 +88,7 @@ Page({
88 }, 88 },
89 sendsms(){ 89 sendsms(){
90 App.SendSMS.Message({ 90 App.SendSMS.Message({
91 - phone:15877556369,/*this.bookInfo.phone,*/ 91 + phone:this.bookInfo.phone,
92 sign_name:'订个座儿', 92 sign_name:'订个座儿',
93 template_code:'SMS_145597605', 93 template_code:'SMS_145597605',
94 template_param:JSON.stringify([this.smsData]) 94 template_param:JSON.stringify([this.smsData])
@@ -2,7 +2,7 @@ @@ -2,7 +2,7 @@
2 import util from '../../utils/util'; 2 import util from '../../utils/util';
3 import App from '../../utils/api'; 3 import App from '../../utils/api';
4 const {regeneratorRuntime} = global 4 const {regeneratorRuntime} = global
5 -import QQMapWX from '../../utils/qqmap-wx-jssdk' 5 +//import QQMapWX from '../../utils/qqmap-wx-jssdk'
6 Page({ 6 Page({
7 7
8 /** 8 /**
@@ -12,7 +12,7 @@ Page({ @@ -12,7 +12,7 @@ Page({
12 map:{ 12 map:{
13 latitude: 23.099994, 13 latitude: 23.099994,
14 longitude: 113.324520, 14 longitude: 113.324520,
15 - scale:4, 15 + scale:18,
16 height:300, 16 height:300,
17 }, 17 },
18 markers: [{ 18 markers: [{
@@ -23,17 +23,17 @@ Page({ @@ -23,17 +23,17 @@ Page({
23 width: 50, 23 width: 50,
24 height: 50 24 height: 50
25 }], 25 }],
26 - seller:{},  
27 //polygons:{}, 26 //polygons:{},
28 }, 27 },
29 - qqmapsdk:null, 28 + //qqmapsdk:null,
  29 + sellers:[],
30 /** 30 /**
31 * 生命周期函数--监听页面加载 31 * 生命周期函数--监听页面加载
32 */ 32 */
33 onLoad: function (options) { 33 onLoad: function (options) {
34 - this.qqmapsdk=new QQMapWX({  
35 - key: 'SDEBZ-I74W4-QLGUX-XXYXU-HIR23-3QFBJ'  
36 - }); 34 + // this.qqmapsdk=new QQMapWX({
  35 + // key: 'SDEBZ-I74W4-QLGUX-XXYXU-HIR23-3QFBJ'
  36 + // });
37 }, 37 },
38 38
39 /** 39 /**
@@ -96,8 +96,7 @@ Page({ @@ -96,8 +96,7 @@ Page({
96 }) 96 })
97 this.getMarkers(); 97 this.getMarkers();
98 //this.getMapPos(); 98 //this.getMapPos();
99 - }).catch((e)=>{  
100 - console.log(e); 99 + }).catch(()=>{
101 this.selectComponent('#showModal').options({ 100 this.selectComponent('#showModal').options({
102 header:'定位失败', 101 header:'定位失败',
103 body:'需要地理位置授权' 102 body:'需要地理位置授权'
@@ -131,29 +130,32 @@ Page({ @@ -131,29 +130,32 @@ Page({
131 }, 130 },
132 markertap(e){ 131 markertap(e){
133 console.log(e) 132 console.log(e)
134 - let seller_id=e.markerId;  
135 - this.setData({  
136 - seller:{  
137 - id:seller_id,  
138 - seller_name:'商户名名称'+seller_id,  
139 - seller_addr:'商户地址'+seller_id,  
140 - seller_phone:'商户电话'+seller_id, 133 + let seller={
  134 + id:e.markerId
  135 + };
  136 + this.sellers.forEach(se=>{
  137 + if(se.id==seller.id){
  138 + seller=se;
  139 + return false;
141 } 140 }
142 }) 141 })
143 - this.selectComponent('#seller-box').show(); 142 + this.selectComponent('#seller-box').show(seller);
144 wx.hideTabBar(); 143 wx.hideTabBar();
145 }, 144 },
146 - getMarkers(pos){ 145 + getMarkers(){
147 let map=this.data.map; 146 let map=this.data.map;
148 let markers=[]; 147 let markers=[];
149 - App.Reserve.Sellers({ 148 + App.Reserve.SellerList({
150 lat:map.latitude, 149 lat:map.latitude,
151 lng:map.longitude, 150 lng:map.longitude,
152 offset:0, 151 offset:0,
153 rows:100, 152 rows:100,
  153 + distance:100,
154 }).then(res=>{ 154 }).then(res=>{
155 if(res.ret==200){ 155 if(res.ret==200){
  156 + this.sellers=res.data;
156 res.data.forEach(seller=>{ 157 res.data.forEach(seller=>{
  158 + let namelength=seller.sellername.replace(/[^\x00-\xff]/g,"01").length+8;
157 markers.push({ 159 markers.push({
158 id: seller.id, 160 id: seller.id,
159 iconPath: "/pages/image/ding.png", 161 iconPath: "/pages/image/ding.png",
@@ -161,12 +163,12 @@ Page({ @@ -161,12 +163,12 @@ Page({
161 longitude: seller.long, 163 longitude: seller.long,
162 width: 24, 164 width: 24,
163 height: 30, 165 height: 30,
164 - title:seller.seller_name, 166 + //title:seller.seller_name,
165 label:{ 167 label:{
166 - content:seller.seller_name, 168 + content:' '+seller.sellername+' ',
167 color:'#353535', 169 color:'#353535',
168 fontSize:13, 170 fontSize:13,
169 - anchorX:-50, 171 + anchorX:-(namelength/2*5),
170 anchorY:1, 172 anchorY:1,
171 borderWidth:1, 173 borderWidth:1,
172 borderColor:'#B4B0B0', 174 borderColor:'#B4B0B0',
@@ -178,35 +180,34 @@ Page({ @@ -178,35 +180,34 @@ Page({
178 }) 180 })
179 }) 181 })
180 }else{ 182 }else{
181 - for(var i=1;i<50;i++){  
182 - markers.push({  
183 - id: i,  
184 - iconPath: "/pages/image/ding.png",  
185 - latitude: parseFloat(map.latitude) + Math.random()*(parseInt(Math.random()*10)%2==0?-1:1)/500,  
186 - longitude: parseFloat(map.longitude) +Math.random()*(parseInt(Math.random()*10)%2==0?-1:1)/500,  
187 - width: 24,  
188 - height: 30,  
189 - title:'店铺名称t'+i,  
190 - label:{  
191 - content:'店铺名称lc'+i,  
192 - color:'#353535',  
193 - fontSize:13,  
194 - anchorX:-50,  
195 - anchorY:1,  
196 - borderWidth:1,  
197 - borderColor:'#B4B0B0',  
198 - borderRadius:20,  
199 - bgColor:'#fff',  
200 - padding:5,  
201 - textAlign:'center',  
202 - },  
203 - })  
204 - } 183 + markers.push({
  184 + id: 1,
  185 + iconPath: "/pages/image/ding.png",
  186 + latitude: parseFloat(map.latitude) + 1/1000,
  187 + longitude: parseFloat(map.longitude) +1/1000 ,
  188 + width: 24,
  189 + height: 30,
  190 + //title:'演示店铺',
  191 + label:{
  192 + content:' 演示店铺 ',
  193 + color:'#353535',
  194 + fontSize:13,
  195 + anchorX:-50,
  196 + anchorY:1,
  197 + borderWidth:1,
  198 + borderColor:'#B4B0B0',
  199 + borderRadius:20,
  200 + bgColor:'#fff',
  201 + padding:3,
  202 + textAlign:'center'
  203 + },
  204 + })
205 } 205 }
  206 + this.setData({
  207 + markers:markers,
  208 + })
206 }) 209 })
207 - this.setData({  
208 - markers:markers,  
209 - }) 210 +
210 }, 211 },
211 //seller box 通知 212 //seller box 通知
212 sellerBoxEvent(e){ 213 sellerBoxEvent(e){
@@ -241,6 +242,6 @@ Page({ @@ -241,6 +242,6 @@ Page({
241 this.setData({ 242 this.setData({
242 polygons:polygons, 243 polygons:polygons,
243 }) 244 })
244 - this.getMarkers([{latitude: latitude-xs, longitude: longitude-ys},{latitude: latitude+xs, longitude: longitude+ys}]) 245 + this.getMarkers()
245 }, 246 },
246 }) 247 })
@@ -16,5 +16,5 @@ @@ -16,5 +16,5 @@
16 </view> 16 </view>
17 </view> 17 </view>
18 <showModal id="showModal" confirmText="去授权" bindshowModal="showModal"></showModal> 18 <showModal id="showModal" confirmText="去授权" bindshowModal="showModal"></showModal>
19 -<seller-box id="seller-box" seller="{{seller}}" bindevent="sellerBoxEvent"></seller-box> 19 +<seller-box id="seller-box" bindevent="sellerBoxEvent"></seller-box>
20 20
@@ -52,6 +52,6 @@ export default { @@ -52,6 +52,6 @@ export default {
52 'App.Reserve.GetReserveList':null, 52 'App.Reserve.GetReserveList':null,
53 53
54 //商家列表 54 //商家列表
55 - 'App.Reserve.Sellers':null, 55 + 'App.Reserve.SellerList':null,
56 56
57 } 57 }