顺带件OK,除用户设置地址,接受,实际数据
This commit is contained in:
parent
d64a9f163c
commit
89ff2bd661
@ -91,6 +91,42 @@
|
|||||||
height: 90%;
|
height: 90%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#app {
|
||||||
|
position: relative;
|
||||||
|
height: calc(100vh - 75px);
|
||||||
|
}
|
||||||
|
|
||||||
[v-cloak] {
|
[v-cloak] {
|
||||||
display: none;
|
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(){
|
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 waiting = plus.nativeUI.showWaiting("正在加载")
|
||||||
|
|
||||||
const app = new Vue({
|
const app = new Vue({
|
||||||
@ -10,95 +143,89 @@ const app = new Vue({
|
|||||||
orderList: [
|
orderList: [
|
||||||
],
|
],
|
||||||
location: [0,0],
|
location: [0,0],
|
||||||
|
highlightText: "",
|
||||||
|
currentPage: 1,
|
||||||
|
isLoading: false,
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
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() {
|
loadData() {
|
||||||
// $.ajax({
|
$.ajax({
|
||||||
// url: qlgUrl("app/note/index"),
|
url: qlgUrl("app/orders/shundaiList"),
|
||||||
// method: "GET",
|
method: "GET",
|
||||||
// dataType: 'json',
|
data: {
|
||||||
// success: (res) => {
|
page: this.currentPage,
|
||||||
// if(res.status == 1){
|
},
|
||||||
// this.noteData = res.data;
|
dataType: 'json',
|
||||||
// }else{
|
success: (res) => {
|
||||||
// mui.alert(res.msg);
|
|
||||||
// }
|
|
||||||
// },
|
|
||||||
// error: function(err){
|
|
||||||
// mui.alert("请求失败");
|
|
||||||
// self.back();
|
|
||||||
// }
|
|
||||||
// });
|
|
||||||
waiting.close();
|
waiting.close();
|
||||||
this.orderList = [
|
if(res.status == 1){
|
||||||
{
|
this.orderList = res.data;
|
||||||
from_address: '测试dizhi 测试地址测试地址测试地址测试地址测试地址测试地址',
|
}else{
|
||||||
to_address: '测试地址测试地址测试地址测试地址测试地址测试地址',
|
mui.alert(res.msg);
|
||||||
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',
|
|
||||||
},
|
},
|
||||||
{
|
error: function(err){
|
||||||
from_address: '测试22222dizhi 测试地址测试地址测试地址测试地址测试地址测试地址',
|
waiting.close();
|
||||||
to_address: '测试地址测试地址测试地址测试地址测试地址测试地址',
|
mui.alert("请求失败");
|
||||||
deliver_fee: '20.00',
|
self.back();
|
||||||
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',
|
|
||||||
},
|
|
||||||
{
|
|
||||||
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',
|
|
||||||
},
|
|
||||||
]
|
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
|
|||||||
@ -282,7 +282,7 @@ plus.runtime.openURL(urlStr)
|
|||||||
// });
|
// });
|
||||||
// }
|
// }
|
||||||
goMaps(
|
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;
|
break;
|
||||||
|
|||||||
@ -42,26 +42,36 @@
|
|||||||
<div class="block" style="display: flex;width: 100vw;">
|
<div class="block" style="display: flex;width: 100vw;">
|
||||||
</div>
|
</div>
|
||||||
<div id="app" v-cloak>
|
<div id="app" v-cloak>
|
||||||
|
<div class="float_center" v-if="highlightText">
|
||||||
|
<div class="text">
|
||||||
|
{{highlightText}}
|
||||||
|
</div>
|
||||||
|
<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 clearfix" v-for="(each, index) in orderList" :data-id="each.id">
|
||||||
<div class="row_header">
|
<div class="row_header">
|
||||||
{{each.before}}前送达
|
{{each.deliverBefore}}前送达
|
||||||
</div>
|
</div>
|
||||||
<div class="name">
|
<div class="name">
|
||||||
<span class="_text">店铺：{{each.from_address}}</span>
|
<span class="_text" @click="setHighLightText(each.shopAddress)">店铺：{{each.shopAddress}}</span>
|
||||||
<span class="_img" @click="window.open(`tel:${each.shop_phone}`)">
|
<span class="_img" @click="window.open(`tel:${each.shopPhone}`)">
|
||||||
<img src="../img/lianxishangjia4.png" alt="">
|
<img src="../img/lianxishangjia4.png" alt="">
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="name">
|
<div class="name">
|
||||||
<span class="_text">送至：{{each.to_address}}</span>
|
<span class="_text" @click="setHighLightText(each.userAddress)">送至：{{each.userAddress}}</span>
|
||||||
<span class="_img" @click="window.open(`tel:${each.buyer_phone}`)">
|
<span class="_img" @click="window.open(`tel:${each.userPhone}`)">
|
||||||
<img src="../img/lianxishangjia4.png" alt="">
|
<img src="../img/lianxishangjia4.png" alt="">
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="loc_range">
|
<div class="loc_range">
|
||||||
<span>我</span>
|
<span>我</span>
|
||||||
<span class="between">{{each.distance_to_shop}}</span>
|
<span class="between" @click="navi([each.shopLat, each.shopLng])">{{getDistance(location, [each.shopLat, each.shopLng])}}</span>
|
||||||
<span class="with_img">
|
<span class="with_img" @click="navi([each.shopLat, each.shopLng])">
|
||||||
<img src="../img/gothere.png" alt="">
|
<img src="../img/gothere.png" alt="">
|
||||||
商家
|
商家
|
||||||
</span>
|
</span>
|
||||||
@ -73,14 +83,16 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="row_foot">
|
<div class="row_foot">
|
||||||
<span class="price_tag">
|
<span class="price_tag">
|
||||||
运费<span class="price">{{each.deliver_fee}}</span>元
|
运费<span class="price">{{each.deliverMoney}}</span>元
|
||||||
</span>
|
</span>
|
||||||
<span class="price_tag">
|
<span class="price_tag">
|
||||||
奖励<span class="price">{{each.fee}}</span>元
|
奖励<span class="price">{{each.feeMoney}}</span>元
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div id="apear"></div>
|
||||||
|
</div>
|
||||||
</body>
|
</body>
|
||||||
<script src="../js/mui.min.js" type="text/javascript" charset="utf-8"></script>
|
<script src="../js/mui.min.js" type="text/javascript" charset="utf-8"></script>
|
||||||
<script src="../js/jquery-3.2.1.min.js" type="text/javascript" charset="utf-8"></script>
|
<script src="../js/jquery-3.2.1.min.js" type="text/javascript" charset="utf-8"></script>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user