Commit 6db41b66d45b0cd8b5fd227cb49fbda7ed3e305d

Authored by wangfan
1 parent abb476ab

reserve index

// components/reserve/seller-box/seller-box.js
import util from '../../../utils/util';
import App from '../../../utils/api';
const {regeneratorRuntime} = global
Component({
/**
* 组件的属性列表
*/
properties: {
seller:{
type:Object,
value:{}
}
},
/**
... ... @@ -15,15 +15,23 @@ Component({
*/
data: {
hasShow:false,
seller:{},
},
/**
* 组件的方法列表
*/
methods: {
show(){
show(seller){
seller.distance=parseInt(seller.distance);
if(seller.distance>1000){
seller.distance=(seller.distance/1000).toFixed(2)+'公里'
}else{
seller.distance+='米';
}
this.setData({
hasShow:true,
seller:seller,
})
},
hide(){
... ... @@ -31,6 +39,30 @@ Component({
hasShow:false,
})
this.triggerEvent('event',{type:'hide'});
}
},
tapButton(e){
let type=util.attr(e,'type');
if(type=='oncall'){
if(!this.data.seller.phone){
return util.toast('商家电话错误','none');
}
wx.makePhoneCall({
phoneNumber:this.data.seller.phone
})
}else{
util.toast('请打电话预定','none');
}
},
lookLocation:function(){
wx.openLocation({
latitude:Number(this.data.seller.lat),
longitude:Number(this.data.seller.long),
scale:17,
address:this.data.seller.map_address,
success:function (res) {
console.log(res)
}
})
},
}
})
... ...
... ... @@ -2,16 +2,39 @@
<cover-view class="mask flex-vr" hidden="{{!hasShow}}" bindtap="hide">
<cover-view class="showModal">
<cover-view class="header">
{{seller.seller_name}}
{{seller.sellername}}
</cover-view>
<cover-view class="body">{{opt.body}}</cover-view>
<cover-view class="footer flex-cc">
<button class="button-none cancel" plain wx:if="{{opt.cancelText}}"
bindtap="tapButton" data-type="cancel"
style="color:{{opt.cancelColor}};">{{opt.cancelText}}</button>
<button class="button-none" plain
bindtap="tapButton" data-type="confirm"
style="color:{{opt.confirmColor}};">{{opt.confirmText}}</button>
<cover-view class="tip flex-lr">
<cover-view class="ping flex-ll">★★★★★
<cover-view style="color: #353535; text-indent: 40rpx">¥50元/人</cover-view>
</cover-view>
<cover-view class="type">潮汕火锅</cover-view>
</cover-view>
<cover-view class="info flex-ll">
<cover-image src="/pages/image/add-act.png" style="width: 30rpx; height: 30rpx; background-color: #F4A22A"></cover-image>
<cover-view class="type">在线订座买单8折起</cover-view>
</cover-view>
<cover-view class="info flex-ll">
<cover-view src="" style="width: 30rpx; height: 30rpx;"></cover-view>
<cover-view class="type">赠送精美小菜和饮品</cover-view>
</cover-view>
<cover-view class="info flex-ll" style="margin-top: 22rpx;">
<cover-image src="/pages/image/gps-icon.png" style="width: 26rpx; height: 32rpx;"></cover-image>
<cover-view class="type" catchtap="lookLocation">{{seller.map_address}}</cover-view>
</cover-view>
<cover-view class="body"></cover-view>
</cover-view>
<cover-view class="footer flex-lr">
<cover-view class="flex-lr left">
距离{{seller.distance}}
</cover-view>
<cover-view class="flex-lr right">
<button class="button-none online" plain
bindtap="tapButton" data-type="online"
style="color:{{opt.cancelColor}};">在线预订</button>
<button class="button-none oncall"
bindtap="tapButton" data-type="oncall"
style="color:{{opt.confirmColor}};">电话预定</button>
</cover-view>
</cover-view>
</cover-view>
... ...
... ... @@ -13,11 +13,14 @@
width: 90%;
background-color: #fff;
padding: 20rpx 5% 0 5%;
/* border-top-left-radius:20rpx;
border-top-right-radius:20rpx;*/
}
.showModal .header{
font-size: 40rpx;
line-height: 120rpx;
height: 120rpx;
line-height: 60rpx;
height: 60rpx;
}
.showModal .body{
font-size: 30rpx;
... ... @@ -26,13 +29,50 @@
.footer{
border-top: 2rpx solid #ccc;
background-color: #fff;
width: 90%;
width: 100%;
}
.footer .button-none{
line-height: 120rpx;
height: 120rpx;
border-width: 0;
margin: 30rpx 0;
font-size: 36rpx;
height: 82rpx;
line-height: 82rpx;
border-radius: 4rpx;
padding: 0 34rpx;
}
.footer .button-none.online{
border: 2rpx solid #393939;
color: #353535;
margin-right: 20rpx;
}
.footer .button-none.oncall{
border: 2rpx solid #393939;
background-color: #393939;
color: #FEFEFE;
}
.footer .left{
margin-left: 40rpx;
font-size: 30rpx;
}
.footer .right{
margin-right: 40rpx;
font-size: 36rpx;
}
.tip{
font-size: 30rpx;
height: 42rpx;
line-height: 42rpx;
margin: 8rpx 0 2rpx;
}
.tip .ping{
color: #F4A22A;
}
.info{
font-size: 30rpx;
height: 42rpx;
line-height: 42rpx;
margin-bottom: 6rpx;
}
.info cover-view:last-child{
margin-left: 22rpx;
}
.footer .button-none.cancel{
border-right: 2rpx solid #ccc !important;
}
\ No newline at end of file
... ...
... ... @@ -88,7 +88,7 @@ Page({
},
sendsms(){
App.SendSMS.Message({
phone:15877556369,/*this.bookInfo.phone,*/
phone:this.bookInfo.phone,
sign_name:'订个座儿',
template_code:'SMS_145597605',
template_param:JSON.stringify([this.smsData])
... ...
... ... @@ -2,7 +2,7 @@
import util from '../../utils/util';
import App from '../../utils/api';
const {regeneratorRuntime} = global
import QQMapWX from '../../utils/qqmap-wx-jssdk'
//import QQMapWX from '../../utils/qqmap-wx-jssdk'
Page({
/**
... ... @@ -12,7 +12,7 @@ Page({
map:{
latitude: 23.099994,
longitude: 113.324520,
scale:4,
scale:18,
height:300,
},
markers: [{
... ... @@ -23,17 +23,17 @@ Page({
width: 50,
height: 50
}],
seller:{},
//polygons:{},
},
qqmapsdk:null,
//qqmapsdk:null,
sellers:[],
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
this.qqmapsdk=new QQMapWX({
key: 'SDEBZ-I74W4-QLGUX-XXYXU-HIR23-3QFBJ'
});
// this.qqmapsdk=new QQMapWX({
// key: 'SDEBZ-I74W4-QLGUX-XXYXU-HIR23-3QFBJ'
// });
},
/**
... ... @@ -96,8 +96,7 @@ Page({
})
this.getMarkers();
//this.getMapPos();
}).catch((e)=>{
console.log(e);
}).catch(()=>{
this.selectComponent('#showModal').options({
header:'定位失败',
body:'需要地理位置授权'
... ... @@ -131,29 +130,32 @@ Page({
},
markertap(e){
console.log(e)
let seller_id=e.markerId;
this.setData({
seller:{
id:seller_id,
seller_name:'商户名名称'+seller_id,
seller_addr:'商户地址'+seller_id,
seller_phone:'商户电话'+seller_id,
let seller={
id:e.markerId
};
this.sellers.forEach(se=>{
if(se.id==seller.id){
seller=se;
return false;
}
})
this.selectComponent('#seller-box').show();
this.selectComponent('#seller-box').show(seller);
wx.hideTabBar();
},
getMarkers(pos){
getMarkers(){
let map=this.data.map;
let markers=[];
App.Reserve.Sellers({
App.Reserve.SellerList({
lat:map.latitude,
lng:map.longitude,
offset:0,
rows:100,
distance:100,
}).then(res=>{
if(res.ret==200){
this.sellers=res.data;
res.data.forEach(seller=>{
let namelength=seller.sellername.replace(/[^\x00-\xff]/g,"01").length+8;
markers.push({
id: seller.id,
iconPath: "/pages/image/ding.png",
... ... @@ -161,12 +163,12 @@ Page({
longitude: seller.long,
width: 24,
height: 30,
title:seller.seller_name,
//title:seller.seller_name,
label:{
content:seller.seller_name,
content:' '+seller.sellername+' ',
color:'#353535',
fontSize:13,
anchorX:-50,
anchorX:-(namelength/2*5),
anchorY:1,
borderWidth:1,
borderColor:'#B4B0B0',
... ... @@ -178,35 +180,34 @@ Page({
})
})
}else{
for(var i=1;i<50;i++){
markers.push({
id: i,
iconPath: "/pages/image/ding.png",
latitude: parseFloat(map.latitude) + Math.random()*(parseInt(Math.random()*10)%2==0?-1:1)/500,
longitude: parseFloat(map.longitude) +Math.random()*(parseInt(Math.random()*10)%2==0?-1:1)/500,
width: 24,
height: 30,
title:'店铺名称t'+i,
label:{
content:'店铺名称lc'+i,
color:'#353535',
fontSize:13,
anchorX:-50,
anchorY:1,
borderWidth:1,
borderColor:'#B4B0B0',
borderRadius:20,
bgColor:'#fff',
padding:5,
textAlign:'center',
},
})
}
markers.push({
id: 1,
iconPath: "/pages/image/ding.png",
latitude: parseFloat(map.latitude) + 1/1000,
longitude: parseFloat(map.longitude) +1/1000 ,
width: 24,
height: 30,
//title:'演示店铺',
label:{
content:' 演示店铺 ',
color:'#353535',
fontSize:13,
anchorX:-50,
anchorY:1,
borderWidth:1,
borderColor:'#B4B0B0',
borderRadius:20,
bgColor:'#fff',
padding:3,
textAlign:'center'
},
})
}
this.setData({
markers:markers,
})
})
this.setData({
markers:markers,
})
},
//seller box 通知
sellerBoxEvent(e){
... ... @@ -241,6 +242,6 @@ Page({
this.setData({
polygons:polygons,
})
this.getMarkers([{latitude: latitude-xs, longitude: longitude-ys},{latitude: latitude+xs, longitude: longitude+ys}])
this.getMarkers()
},
})
\ No newline at end of file
... ...
... ... @@ -16,5 +16,5 @@
</view>
</view>
<showModal id="showModal" confirmText="去授权" bindshowModal="showModal"></showModal>
<seller-box id="seller-box" seller="{{seller}}" bindevent="sellerBoxEvent"></seller-box>
<seller-box id="seller-box" bindevent="sellerBoxEvent"></seller-box>
... ...
... ... @@ -52,6 +52,6 @@ export default {
'App.Reserve.GetReserveList':null,
//商家列表
'App.Reserve.Sellers':null,
'App.Reserve.SellerList':null,
}
\ No newline at end of file
... ...