顺带件OK,除用户设置地址,接受,实际数据
This commit is contained in:
parent
d64a9f163c
commit
89ff2bd661
@ -91,6 +91,42 @@
|
||||
height: 90%;
|
||||
}
|
||||
|
||||
#app {
|
||||
position: relative;
|
||||
height: calc(100vh - 75px);
|
||||
}
|
||||
|
||||
[v-cloak] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.float_center {
|
||||
position: fixed;
|
||||
top: 40vh;
|
||||
width: 90%;
|
||||
background: white;
|
||||
z-index: 5;
|
||||
box-shadow: 0px 0px 15px 5px #ddd;
|
||||
left: 5%;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.float_center .text {
|
||||
font-size: 1.4rem;
|
||||
line-height: 1.8rem;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.float_center .operation {
|
||||
display: flex;
|
||||
padding-top: 10px;
|
||||
}
|
||||
|
||||
.operation .op {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
box-shadow: 0px 0px 2px 2px #eee;
|
||||
height: 28px;
|
||||
line-height: 28px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@ -1,6 +1,139 @@
|
||||
var arr = [];
|
||||
mui.plusReady(function(){
|
||||
|
||||
var maps = [{
|
||||
pname: 'com.baidu.BaiduMap',
|
||||
action: 'baidumap',
|
||||
name: '百度地图'
|
||||
}, {
|
||||
pname: 'com.autonavi.minimap',
|
||||
action: 'iosamap',
|
||||
name: '高德地图'
|
||||
}
|
||||
// , {
|
||||
// pname: 'com.google.android.apps.maps',
|
||||
// action: 'com.google.android.apps.maps',
|
||||
// name: '谷歌地图'
|
||||
// }
|
||||
// , {
|
||||
// pname: 'com.tencent.map',
|
||||
// action: 'com.google.android.apps.maps',
|
||||
// name: '腾讯地图'
|
||||
// },
|
||||
]
|
||||
// checkApp("com.baidu.BaiduMap", "baidumap", "百度地图")
|
||||
// checkApp("com.autonavi.minimap", "iosamap", "高德地图")
|
||||
// checkApp("com.google.android.apps.maps", "com.google.android.apps.maps", "谷歌地图")
|
||||
// 判断地图软件是否安装
|
||||
// maps= toJson(maps)
|
||||
// //console.log(maps)
|
||||
$.each(maps, function(i, v) {//不能写进点击事件函数里 不然点击一次增加一个title
|
||||
var that = this
|
||||
checkApp(that.pname, that.action, that.name)
|
||||
})
|
||||
|
||||
function checkApp(pn, ac, name) { // pname：android 包名 action：ios包名 name：用作底部弹出
|
||||
if (plus.runtime.isApplicationExist({
|
||||
pname: pn, //包名
|
||||
action: ac //ios包名
|
||||
})) {
|
||||
// //console.log("微信应用已安装");
|
||||
title = {
|
||||
title: name
|
||||
};
|
||||
arr.push(title)
|
||||
} else {
|
||||
|
||||
}
|
||||
}
|
||||
var viewportHeight = $(window).height();
|
||||
$(document).on('scroll', function() {
|
||||
var scrollTop = $(window).scrollTop();
|
||||
var x = scrollTop + viewportHeight - $("#apear").position().top;
|
||||
if (x > 0)
|
||||
{
|
||||
app.loadNextPage();
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
function copyToClip (text) {
|
||||
var Context = plus.android.importClass("android.content.Context");
|
||||
var main = plus.android.runtimeMainActivity();
|
||||
var clip = main.getSystemService(Context.CLIPBOARD_SERVICE);
|
||||
plus.android.invoke(clip,"setText",text.toString());
|
||||
mui.toast("复制成功");
|
||||
}
|
||||
|
||||
function invokeNavi(from, destination) {
|
||||
if (0 == arr.length) {
|
||||
var startpos= bMapTransQQMap(from[1], from[0])
|
||||
var endpos = bMapTransQQMap(destination[1], destination[0])
|
||||
var urlStr = encodeURI('http://uri.amap.com/navigation?from='+startpos.lng+','+startpos.lat+',startpoint&to='+endpos.lng+','+endpos.lat+',endpoint&mode=car&policy=1&src=mypage&coordinate=gaode&callnative=0')
|
||||
plus.runtime.openURL(urlStr)
|
||||
return false
|
||||
} else {
|
||||
openMapApp(destination)
|
||||
}
|
||||
}
|
||||
|
||||
function openMapApp(destination) {
|
||||
function realOpen(idx) {
|
||||
var shopLat = destination[0];
|
||||
var shopLng = destination[1];
|
||||
var title = arr[idx].title;
|
||||
// var i1 = new Intent();
|
||||
switch (title) {
|
||||
case "百度地图":
|
||||
// if (plus.os.name == "Android") {
|
||||
// plus.runtime.openURL(
|
||||
// "baidumap://map/direction?origin=latlng:39.98871,116.43234|name:我的位置&destination=31.236244,121.480239&mode=driving&src=webapp.navi.hanguosoft.yinyijianghu",
|
||||
// function(error) {
|
||||
// mui.alert('打开' + title + '失败');
|
||||
// });
|
||||
// }
|
||||
goMaps(
|
||||
"baidumap://map/direction?origin=我的位置&destination="+shopLat+","+shopLng+"&mode=driving&src=cn.com.zgqlg.app"
|
||||
)
|
||||
|
||||
break;
|
||||
case "高德地图":
|
||||
|
||||
var endpos = bMapTransQQMap(shopLng, shopLat)
|
||||
// plus.runtime.openURL('androidamap://navi?sourceApplication=nyx_super&lat=' + endpos.lat + '&lon=' + endpos.lng +
|
||||
// '&mode=driving®ion=www&output=html&src="全亮共"',
|
||||
// function(e) {
|
||||
// mui.alert('打开' + title + '失败');
|
||||
// })
|
||||
goMaps('androidamap://navi?sourceApplication=nyx_super&lat=' + endpos.lat + '&lon=' + endpos.lng +
|
||||
'&mode=driving&output=html&src="全亮共"')
|
||||
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
//底部弹出选择地图软件
|
||||
if (arr.length === 1) {
|
||||
realOpen(0)
|
||||
}else{
|
||||
plus.nativeUI.actionSheet({
|
||||
title: "请选择导航使用的地图",
|
||||
cancel: "取消",
|
||||
buttons: arr
|
||||
}, function(e) {
|
||||
realOpen(e.index - 1)
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
function goMaps(url) {
|
||||
var mContext = plus.android.runtimeMainActivity();
|
||||
var Uri = plus.android.importClass('android.net.Uri');
|
||||
var Intent = plus.android.importClass('android.content.Intent');
|
||||
var intent = new Intent(Intent.ACTION_VIEW, Uri.parse(url));
|
||||
mContext.startActivity(intent);
|
||||
}
|
||||
|
||||
const waiting = plus.nativeUI.showWaiting("正在加载")
|
||||
|
||||
const app = new Vue({
|
||||
@ -10,95 +143,89 @@ const app = new Vue({
|
||||
orderList: [
|
||||
],
|
||||
location: [0,0],
|
||||
highlightText: "",
|
||||
currentPage: 1,
|
||||
isLoading: false,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getDistance(from, to) {
|
||||
var radLat1 = from[0]*Math.PI / 180.0;
|
||||
var radLat2 = to[0]*Math.PI / 180.0;
|
||||
var a = radLat1 - radLat2;
|
||||
var b = from[0]*Math.PI / 180.0 - to[0]*Math.PI / 180.0;
|
||||
var s = 2 * Math.asin(Math.sqrt(Math.pow(Math.sin(a/2),2) +
|
||||
Math.cos(radLat1)*Math.cos(radLat2)*Math.pow(Math.sin(b/2),2)));
|
||||
s = s *6378.137 ;// EARTH_RADIUS;
|
||||
if (s < 1.5) {
|
||||
return `${s * 1000}m`;
|
||||
}
|
||||
if (s > 50) {
|
||||
return `>50km`;
|
||||
}
|
||||
return `${s.toFixed(2)}km`;
|
||||
},
|
||||
loadNextPage() {
|
||||
if (this.isLoading) return;
|
||||
this.isLoading = true;
|
||||
$.ajax({
|
||||
url: qlgUrl("app/orders/shundaiList"),
|
||||
method: "GET",
|
||||
data: {
|
||||
page: this.currentPage+1,
|
||||
},
|
||||
dataType: 'json',
|
||||
success: (res) => {
|
||||
this.isLoading = false;
|
||||
if(res.status == 1){
|
||||
this.currentPage += 1;
|
||||
$.each(res.data, (k, i)=>{
|
||||
this.orderList.push(i)
|
||||
});
|
||||
}else{
|
||||
mui.alert(res.msg);
|
||||
}
|
||||
},
|
||||
error: function(err){
|
||||
mui.alert("请求失败");
|
||||
this.isLoading = false;
|
||||
}
|
||||
});
|
||||
},
|
||||
copyText() {
|
||||
copyToClip(this.highlightText)
|
||||
},
|
||||
dismissHighLight() {
|
||||
this.highlightText = "";
|
||||
},
|
||||
setHighLightText(text){
|
||||
this.highlightText = text;
|
||||
},
|
||||
navi(destination) {
|
||||
invokeNavi(this.location, destination);
|
||||
},
|
||||
loadData() {
|
||||
// $.ajax({
|
||||
// url: qlgUrl("app/note/index"),
|
||||
// method: "GET",
|
||||
// dataType: 'json',
|
||||
// success: (res) => {
|
||||
// if(res.status == 1){
|
||||
// this.noteData = res.data;
|
||||
// }else{
|
||||
// mui.alert(res.msg);
|
||||
// }
|
||||
// },
|
||||
// error: function(err){
|
||||
// mui.alert("请求失败");
|
||||
// self.back();
|
||||
// }
|
||||
// });
|
||||
waiting.close();
|
||||
this.orderList = [
|
||||
{
|
||||
from_address: '测试dizhi 测试地址测试地址测试地址测试地址测试地址测试地址',
|
||||
to_address: '测试地址测试地址测试地址测试地址测试地址测试地址',
|
||||
deliver_fee: '8.00',
|
||||
fee: '18.00',
|
||||
before: '2020/20/20 11:20',
|
||||
shop_phone: '15270565303',
|
||||
buyer_phone: '15270565304',
|
||||
distance_to_shop: '20km',
|
||||
distance_to_buyer: '>100km',
|
||||
$.ajax({
|
||||
url: qlgUrl("app/orders/shundaiList"),
|
||||
method: "GET",
|
||||
data: {
|
||||
page: this.currentPage,
|
||||
},
|
||||
{
|
||||
from_address: '测试22222dizhi 测试地址测试地址测试地址测试地址测试地址测试地址',
|
||||
to_address: '测试地址测试地址测试地址测试地址测试地址测试地址',
|
||||
deliver_fee: '20.00',
|
||||
fee: '38.00',
|
||||
before: '2020/20/20 11:20',
|
||||
shop_phone: '15270565303',
|
||||
buyer_phone: '15270565304',
|
||||
distance_to_shop: '412m',
|
||||
distance_to_buyer: '800m',
|
||||
dataType: 'json',
|
||||
success: (res) => {
|
||||
waiting.close();
|
||||
if(res.status == 1){
|
||||
this.orderList = res.data;
|
||||
}else{
|
||||
mui.alert(res.msg);
|
||||
}
|
||||
},
|
||||
{
|
||||
from_address: '测试dizhi 测试地址测试地址测试地址测试地址测试地址测试地址',
|
||||
to_address: '测试地址测试地址测试地址测试地址测试地址测试地址',
|
||||
deliver_fee: '8.00',
|
||||
fee: '18.00',
|
||||
before: '2020/20/20 11:20',
|
||||
shop_phone: '15270565303',
|
||||
buyer_phone: '15270565304',
|
||||
distance_to_shop: '20km',
|
||||
distance_to_buyer: '>100km',
|
||||
},
|
||||
{
|
||||
from_address: '测试22222dizhi 测试地址测试地址测试地址测试地址测试地址测试地址',
|
||||
to_address: '测试地址测试地址测试地址测试地址测试地址测试地址',
|
||||
deliver_fee: '20.00',
|
||||
fee: '38.00',
|
||||
before: '2020/20/20 11:20',
|
||||
shop_phone: '15270565303',
|
||||
buyer_phone: '15270565304',
|
||||
distance_to_shop: '412m',
|
||||
distance_to_buyer: '800m',
|
||||
},
|
||||
{
|
||||
from_address: '测试dizhi 测试地址测试地址测试地址测试地址测试地址测试地址',
|
||||
to_address: '测试地址测试地址测试地址测试地址测试地址测试地址',
|
||||
deliver_fee: '8.00',
|
||||
fee: '18.00',
|
||||
before: '2020/20/20 11:20',
|
||||
shop_phone: '15270565303',
|
||||
buyer_phone: '15270565304',
|
||||
distance_to_shop: '20km',
|
||||
distance_to_buyer: '>100km',
|
||||
},
|
||||
{
|
||||
from_address: '测试22222dizhi 测试地址测试地址测试地址测试地址测试地址测试地址',
|
||||
to_address: '测试地址测试地址测试地址测试地址测试地址测试地址',
|
||||
deliver_fee: '20.00',
|
||||
fee: '38.00',
|
||||
before: '2020/20/20 11:20',
|
||||
shop_phone: '15270565303',
|
||||
buyer_phone: '15270565304',
|
||||
distance_to_shop: '412m',
|
||||
distance_to_buyer: '800m',
|
||||
},
|
||||
]
|
||||
error: function(err){
|
||||
waiting.close();
|
||||
mui.alert("请求失败");
|
||||
self.back();
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
created() {
|
||||
|
||||
@ -282,7 +282,7 @@ plus.runtime.openURL(urlStr)
|
||||
// });
|
||||
// }
|
||||
goMaps(
|
||||
"baidumap://map/direction?origin=我的位置&destination="+shopLat+","+shopLng+"&mode=driving&src=webapp.navi.hanguosoft.yinyijianghu"
|
||||
"baidumap://map/direction?origin=我的位置&destination="+shopLat+","+shopLng+"&mode=driving&src=cn.com.zgqlg.app"
|
||||
)
|
||||
|
||||
break;
|
||||
|
||||
@ -42,44 +42,56 @@
|
||||
<div class="block" style="display: flex;width: 100vw;">
|
||||
</div>
|
||||
<div id="app" v-cloak>
|
||||
<div class="row clearfix" v-for="(each, index) in orderList" :data-id="each.id">
|
||||
<div class="row_header">
|
||||
{{each.before}}前送达
|
||||
<div class="float_center" v-if="highlightText">
|
||||
<div class="text">
|
||||
{{highlightText}}
|
||||
</div>
|
||||
<div class="name">
|
||||
<span class="_text">店铺：{{each.from_address}}</span>
|
||||
<span class="_img" @click="window.open(`tel:${each.shop_phone}`)">
|
||||
<img src="../img/lianxishangjia4.png" alt="">
|
||||
</span>
|
||||
</div>
|
||||
<div class="name">
|
||||
<span class="_text">送至：{{each.to_address}}</span>
|
||||
<span class="_img" @click="window.open(`tel:${each.buyer_phone}`)">
|
||||
<img src="../img/lianxishangjia4.png" alt="">
|
||||
</span>
|
||||
</div>
|
||||
<div class="loc_range">
|
||||
<span>我</span>
|
||||
<span class="between">{{each.distance_to_shop}}</span>
|
||||
<span class="with_img">
|
||||
<img src="../img/gothere.png" alt="">
|
||||
商家
|
||||
</span>
|
||||
<span class="between">{{each.distance_to_buyer}}</span>
|
||||
<span class="with_img">
|
||||
<img src="../img/gothere.png" alt="">
|
||||
购户
|
||||
</span>
|
||||
</div>
|
||||
<div class="row_foot">
|
||||
<span class="price_tag">
|
||||
运费<span class="price">{{each.deliver_fee}}</span>元
|
||||
</span>
|
||||
<span class="price_tag">
|
||||
奖励<span class="price">{{each.fee}}</span>元
|
||||
</span>
|
||||
<div class="operation">
|
||||
<div class="op" @click="copyText()">复制</div>
|
||||
<div class="op" @click="dismissHighLight()">关闭</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="row clearfix" v-for="(each, index) in orderList" :data-id="each.id">
|
||||
<div class="row_header">
|
||||
{{each.deliverBefore}}前送达
|
||||
</div>
|
||||
<div class="name">
|
||||
<span class="_text" @click="setHighLightText(each.shopAddress)">店铺：{{each.shopAddress}}</span>
|
||||
<span class="_img" @click="window.open(`tel:${each.shopPhone}`)">
|
||||
<img src="../img/lianxishangjia4.png" alt="">
|
||||
</span>
|
||||
</div>
|
||||
<div class="name">
|
||||
<span class="_text" @click="setHighLightText(each.userAddress)">送至：{{each.userAddress}}</span>
|
||||
<span class="_img" @click="window.open(`tel:${each.userPhone}`)">
|
||||
<img src="../img/lianxishangjia4.png" alt="">
|
||||
</span>
|
||||
</div>
|
||||
<div class="loc_range">
|
||||
<span>我</span>
|
||||
<span class="between" @click="navi([each.shopLat, each.shopLng])">{{getDistance(location, [each.shopLat, each.shopLng])}}</span>
|
||||
<span class="with_img" @click="navi([each.shopLat, each.shopLng])">
|
||||
<img src="../img/gothere.png" alt="">
|
||||
商家
|
||||
</span>
|
||||
<span class="between">{{each.distance_to_buyer}}</span>
|
||||
<span class="with_img">
|
||||
<img src="../img/gothere.png" alt="">
|
||||
购户
|
||||
</span>
|
||||
</div>
|
||||
<div class="row_foot">
|
||||
<span class="price_tag">
|
||||
运费<span class="price">{{each.deliverMoney}}</span>元
|
||||
</span>
|
||||
<span class="price_tag">
|
||||
奖励<span class="price">{{each.feeMoney}}</span>元
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="apear"></div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="../js/mui.min.js" type="text/javascript" charset="utf-8"></script>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user