页面修改
This commit is contained in:
THK3121
parent
c63701b39f
commit
0344ab4ea2
@ -8,10 +8,10 @@
|
||||
</p>
|
||||
|
||||
<p class="tit" v-if="goodsInfo.status==1" style="background-color: #FF7C32;">
|
||||
收货人姓名: {{ fuzzyName(goodsInfo.user_name) }}</p>
|
||||
收货人姓名: {{ fuzzyName(goodsInfo.receiver_name) }}</p>
|
||||
|
||||
<p class="tit" v-if="goodsInfo.status==2" style="background-color: #47BE62;">
|
||||
收货人姓名: {{fuzzyName(goodsInfo.user_name)}}</p>
|
||||
收货人姓名: {{fuzzyName(goodsInfo.receiver_name)}}</p>
|
||||
<view class="contents">
|
||||
<!-- 已取货 -->
|
||||
<view class="left" v-if='goodsInfo.status==0'>
|
||||
@ -21,7 +21,7 @@
|
||||
店主姓名
|
||||
</text>
|
||||
<view>
|
||||
{{goodsInfo.shop_user ||'暂无'}}
|
||||
{{goodsInfo.shop_receiver ||'暂无'}}
|
||||
|
||||
</view>
|
||||
</view>
|
||||
@ -94,7 +94,7 @@
|
||||
</text>
|
||||
<view>
|
||||
<view class="address">
|
||||
{{goodsInfo.user_address}}
|
||||
{{goodsInfo.receiver_address}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -128,9 +128,9 @@
|
||||
<text>
|
||||
联系电话
|
||||
</text>
|
||||
<view @click.stop="callFn(goodsInfo.user_phone)">
|
||||
<view @click.stop="callFn(goodsInfo.receiver_phone)">
|
||||
<u-icon style="display: inline-block;margin-left: 5rpx;" name="phone" color="#FF7C32"
|
||||
size="22"></u-icon> {{goodsInfo.user_phone}}
|
||||
size="22"></u-icon> {{goodsInfo.receiver_phone}}
|
||||
|
||||
</view>
|
||||
</view>
|
||||
@ -152,9 +152,9 @@
|
||||
<text>
|
||||
联系电话
|
||||
</text>
|
||||
<view @click.stop="callFn(goodsInfo.user_phone)">
|
||||
<view @click.stop="callFn(goodsInfo.receiver_phone)">
|
||||
<u-icon style="display: inline-block;margin-left: 5rpx;" name="phone"
|
||||
color="#47BE62" size="22"></u-icon> {{goodsInfo.user_phone}}
|
||||
color="#47BE62" size="22"></u-icon> {{goodsInfo.receiver_phone}}
|
||||
|
||||
</view>
|
||||
</view>
|
||||
@ -164,7 +164,7 @@
|
||||
</text>
|
||||
<view>
|
||||
<view class="address">
|
||||
{{goodsInfo.user_address}}
|
||||
{{goodsInfo.receiver_address}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -421,9 +421,7 @@
|
||||
|
||||
.address {
|
||||
width: 65vw;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
|
||||
}
|
||||
|
||||
.finishOrder {
|
||||
|
||||
@ -78,27 +78,7 @@
|
||||
"appkey_android" : "0799f37420c0784f1e6cba230a68bdb1"
|
||||
}
|
||||
},
|
||||
"push" : {
|
||||
"unipush" : {
|
||||
"version" : "2",
|
||||
"offline" : true,
|
||||
"hms" : {},
|
||||
"oppo" : {},
|
||||
"vivo" : {},
|
||||
"mi" : {},
|
||||
"meizu" : {},
|
||||
"fcm" : {},
|
||||
"icons" : {
|
||||
"small" : {
|
||||
"ldpi" : "C:/Users/Administrator/Pictures/216X50k/资源 5@4x.png",
|
||||
"mdpi" : "C:/Users/Administrator/Pictures/216X50k/资源 5@4x.png",
|
||||
"hdpi" : "C:/Users/Administrator/Pictures/216X50k/资源 5@4x.png",
|
||||
"xhdpi" : "C:/Users/Administrator/Pictures/216X50k/资源 5@4x.png",
|
||||
"xxhdpi" : "C:/Users/Administrator/Pictures/216X50k/资源 5@4x.png"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
"push" : {}
|
||||
},
|
||||
"splashscreen" : {
|
||||
"useOriginalMsgbox" : true
|
||||
|
||||
@ -89,6 +89,15 @@
|
||||
"navigationBarTextStyle": "white"
|
||||
}
|
||||
|
||||
}, {
|
||||
"path": "pages/logistics/te",
|
||||
"style": {
|
||||
"navigationBarTitleText": "测试",
|
||||
"enablePullDownRefresh": false,
|
||||
"navigationBarBackgroundColor": "#0122C7",
|
||||
"navigationBarTextStyle": "white"
|
||||
}
|
||||
|
||||
}, {
|
||||
"path": "pages/logistics/logisticDetil",
|
||||
"style": {
|
||||
|
||||
@ -56,7 +56,7 @@
|
||||
<view>
|
||||
物流信息:
|
||||
</view>
|
||||
<view>用户名称: {{fuzzyName( goodsDetil.logistics.user_name)}}</view>
|
||||
<view>用户名称: {{fuzzyName( goodsDetil.logistics.receiver_name)}}</view>
|
||||
<view>
|
||||
通知时间: {{goodsDetil.logistics.create_time}}
|
||||
</view>
|
||||
@ -146,6 +146,7 @@
|
||||
// 位置
|
||||
locationFn() {
|
||||
let that = this
|
||||
//#ifdef APP
|
||||
uni.getLocation({
|
||||
type: 'gcj02',
|
||||
geocode: true,
|
||||
@ -160,6 +161,8 @@
|
||||
|
||||
}
|
||||
});
|
||||
//#endif
|
||||
|
||||
},
|
||||
|
||||
// 唤起高德
|
||||
|
||||
@ -88,18 +88,12 @@
|
||||
this.orderlist = []
|
||||
this.orderlist = res.data.data
|
||||
})
|
||||
// if (this.$refs.logistiCard) {
|
||||
// for (let i = 0; i < this.orderlist.length; i++) {
|
||||
// this.$refs.logistiCard[i].showMore()
|
||||
// }
|
||||
// }
|
||||
}
|
||||
|
||||
},
|
||||
onLoad() {},
|
||||
onShow() {
|
||||
this.getOrderList()
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@ -28,10 +28,10 @@
|
||||
</text>
|
||||
<view>
|
||||
<view>
|
||||
{{goodsDetil.logistics.user_address}}
|
||||
{{goodsDetil.logistics.receiver_address}}
|
||||
</view>
|
||||
<view>
|
||||
{{ fuzzyName(goodsDetil.logistics.user_name) ||"顾客姓名"}}: {{goodsDetil.logistics.user_phone||"顾客电话"}}
|
||||
{{ fuzzyName(goodsDetil.logistics.receiver_name) ||"顾客姓名"}}: {{goodsDetil.logistics.receiver_phone||"顾客电话"}}
|
||||
</view>
|
||||
<view>
|
||||
{{goodsDetil.record[2].create_time}}
|
||||
@ -92,16 +92,16 @@
|
||||
用户名称
|
||||
</text>
|
||||
<view>
|
||||
{{ fuzzyName(goodsDetil.logistics.user_name)}}
|
||||
{{ fuzzyName(goodsDetil.logistics.receiver_name)}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="list">
|
||||
<text>
|
||||
联系方式
|
||||
</text>
|
||||
<view @click.stop="callFn(goodsDetil.logistics.user_phone)">
|
||||
<view @click.stop="callFn(goodsDetil.logistics.receiver_phone)">
|
||||
<u-icon style="display: inline-block;margin-left: 5rpx;" name="phone" color="#2979ff"
|
||||
size="22"></u-icon> {{goodsDetil.logistics.user_phone}}
|
||||
size="22"></u-icon> {{goodsDetil.logistics.receiver_phone}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="list" style="margin: 10rpx 0;">
|
||||
@ -110,7 +110,7 @@
|
||||
</text>
|
||||
<view>
|
||||
<view>
|
||||
{{goodsDetil.logistics.user_address}}
|
||||
{{goodsDetil.logistics.receiver_address}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@ -1,59 +1,15 @@
|
||||
<template>
|
||||
<view class="content">
|
||||
<view v-if='showLoading'>
|
||||
<u-loading-page :loading="showLoading"></u-loading-page>
|
||||
</view>
|
||||
<view v-else>
|
||||
<u-toast ref="uToast"></u-toast>
|
||||
<view class="map">
|
||||
<map id="map" @click="mapFun" :markers='markers' :scale="scale" :enable-zoom="true" :polyline="polyline"
|
||||
style="width:100%;height: 100%;" :latitude="goodsDetil.logistics.shop_lat" :enable-scroll="false"
|
||||
:longitude="goodsDetil.logistics.shop_long">
|
||||
</map>
|
||||
</view>
|
||||
<view class="order_info">
|
||||
<button @click="mapFun">anniu</button>
|
||||
<u-modal :show="showPop" @confirm="confirm" content="56565撒大苏打撒旦" @close="showPop=false"
|
||||
:closeOnClickOverlay="true"></u-modal>
|
||||
<p class='tit'>订单号: {{goodsDetil.logistics.order_sn}}</p>
|
||||
<view class="store_name">
|
||||
商户名称 {{goodsDetil.logistics.shop_name}}
|
||||
</view>
|
||||
<view class="store_time">
|
||||
{{goodsDetil.logistics.shop_address}}
|
||||
</view>
|
||||
<view class="tit_a">
|
||||
<text>物流信息</text>
|
||||
</view>
|
||||
<view class="info" v-for="(item,index) in goodsDetil.record">
|
||||
<view style="margin: 20rpx 0;">
|
||||
{{item.content }}
|
||||
</view>
|
||||
<view style="margin: 20rpx 0;">
|
||||
{{item.create_time }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="pro_info">
|
||||
<view style="color: #999; flex:1">
|
||||
商品信息
|
||||
</view>
|
||||
<view style="flex:4">
|
||||
<view v-for="(item,index) in goodsDetil.product" class="goods_tit">
|
||||
<text style="width: 60vw;">{{item.goods_name}}</text>
|
||||
<text style="float: right;">X{{item.product_num}}{{item.goods_unit}}</text>
|
||||
</view>
|
||||
<view>
|
||||
<button @click="test">按钮</button>
|
||||
<map id="map" @markertap='mapFun' :enable-zoom="true" :polyline="polyline" :markers='markers' :scale="scale"
|
||||
style="width:100vw;height: 70vh;" :latitude="28.908447" :enable-scroll="true" :longitude="105.439304">
|
||||
|
||||
</view>
|
||||
</map>
|
||||
|
||||
</view>
|
||||
|
||||
<view class="total">
|
||||
共计{{goodsDetil.product_count}}件商品
|
||||
</view>
|
||||
<u-button type="primary" v-if='goodsDetil.logistics.status==0' @click="qrqodeFn"
|
||||
class="custom-style">扫码取货</u-button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
|
||||
</view>
|
||||
</template>
|
||||
@ -68,287 +24,300 @@
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
flag: 0,
|
||||
showLoading: true,
|
||||
showPop: false,
|
||||
goodsDetil: undefined,
|
||||
scale: 17,
|
||||
latitude: undefined,
|
||||
longitude: undefined,
|
||||
markers: [{
|
||||
latitude: undefined,
|
||||
longitude: undefined,
|
||||
iconPath: '@/static/images/daoru.png', //显示的图标
|
||||
width: 40, //宽
|
||||
height: 40, //高
|
||||
title: '商家位置', //标注点名
|
||||
alpha: 0.5, //透明度
|
||||
scale: 15,
|
||||
nowAddress: "无",
|
||||
arr: [
|
||||
|
||||
{
|
||||
latitude: 28.916022,
|
||||
longitude: 105.442732,
|
||||
},
|
||||
{
|
||||
latitude: 28.916848,
|
||||
longitude: 105.443175,
|
||||
},
|
||||
{
|
||||
latitude: 28.916918,
|
||||
longitude: 105.443269,
|
||||
},
|
||||
{
|
||||
latitude: 28.917041,
|
||||
longitude: 105.443466,
|
||||
},
|
||||
{
|
||||
latitude: 28.917073,
|
||||
longitude: 105.443522,
|
||||
},
|
||||
{
|
||||
latitude: 28.91705,
|
||||
longitude: 105.443607,
|
||||
},
|
||||
{
|
||||
latitude: 28.917057,
|
||||
longitude: 105.443643,
|
||||
},
|
||||
{
|
||||
latitude: 28.916925,
|
||||
longitude: 105.443546,
|
||||
},
|
||||
{
|
||||
latitude: 28.916796,
|
||||
longitude: 105.443466,
|
||||
},
|
||||
{
|
||||
latitude: 28.916615,
|
||||
longitude: 105.443344,
|
||||
},
|
||||
{
|
||||
latitude: 28.916437,
|
||||
longitude: 105.443274,
|
||||
},
|
||||
{
|
||||
latitude: 28.916356,
|
||||
longitude: 105.443222,
|
||||
},
|
||||
{
|
||||
latitude: 28.916515,
|
||||
longitude: 105.442643,
|
||||
},
|
||||
{
|
||||
latitude: 28.916591,
|
||||
longitude: 105.442448,
|
||||
},
|
||||
{
|
||||
latitude: 28.916944,
|
||||
longitude: 105.442338,
|
||||
},
|
||||
{
|
||||
latitude: 28.91706,
|
||||
longitude: 105.442376,
|
||||
},
|
||||
{
|
||||
latitude: 28.917169,
|
||||
longitude: 105.442489,
|
||||
},
|
||||
{
|
||||
latitude: 28.917345,
|
||||
longitude: 105.442601,
|
||||
},
|
||||
{
|
||||
latitude: 28.917433,
|
||||
longitude: 105.442663,
|
||||
},
|
||||
{
|
||||
latitude: 28.917461,
|
||||
longitude: 105.442683,
|
||||
},
|
||||
{
|
||||
latitude: 28.917461,
|
||||
longitude: 105.442683,
|
||||
},
|
||||
{
|
||||
latitude: 28.917518,
|
||||
longitude: 105.442874,
|
||||
},
|
||||
{
|
||||
latitude: 28.917537,
|
||||
longitude: 105.443032,
|
||||
},
|
||||
{
|
||||
latitude: 28.917537,
|
||||
longitude: 105.443032,
|
||||
},
|
||||
{
|
||||
latitude: 28.917497,
|
||||
longitude: 105.443198,
|
||||
},
|
||||
{
|
||||
latitude: 28.917409,
|
||||
longitude: 105.443256,
|
||||
},
|
||||
{
|
||||
latitude: 28.91732,
|
||||
longitude: 105.443318,
|
||||
},
|
||||
{
|
||||
latitude: 28.917234,
|
||||
longitude: 105.443442,
|
||||
},
|
||||
{
|
||||
latitude: 28.917072,
|
||||
longitude: 105.443497,
|
||||
},
|
||||
{
|
||||
latitude: 28.916977,
|
||||
longitude: 105.443539,
|
||||
},
|
||||
{
|
||||
latitude: 28.916867,
|
||||
longitude: 105.443529,
|
||||
},
|
||||
{
|
||||
latitude: 28.916867,
|
||||
longitude: 105.443529,
|
||||
},
|
||||
{
|
||||
latitude: 28.916761,
|
||||
longitude: 105.443404,
|
||||
},
|
||||
{
|
||||
latitude: 28.916722,
|
||||
longitude: 105.443274,
|
||||
},
|
||||
{
|
||||
latitude: 28.916762,
|
||||
longitude: 105.443132,
|
||||
},
|
||||
|
||||
|
||||
],
|
||||
|
||||
markers: [
|
||||
// 商家
|
||||
|
||||
|
||||
{
|
||||
// 105.439304,28.908447
|
||||
id: 1,
|
||||
latitude: 28.916022,
|
||||
longitude: 105.442732,
|
||||
iconPath: '../../static/img/logistics/QS.png', //显示的图标
|
||||
width: 30,
|
||||
height: 30,
|
||||
},
|
||||
// 骑手
|
||||
|
||||
{
|
||||
id: 2,
|
||||
latitude: 28.916762,
|
||||
longitude: 105.443132,
|
||||
iconPath: '../../static/img/logistics/SJ.png',
|
||||
width: 20,
|
||||
height: 20, //显示的图标
|
||||
}
|
||||
],
|
||||
|
||||
polyline: [{ //初始值
|
||||
name: 'Track 1',
|
||||
arrowLine: true,
|
||||
color: '#27bd09e6',
|
||||
width: 8,
|
||||
id: 1,
|
||||
points: [],
|
||||
|
||||
|
||||
|
||||
},
|
||||
|
||||
|
||||
]
|
||||
|
||||
}],
|
||||
polyline: []
|
||||
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
confirm() {
|
||||
// takeGoods({
|
||||
// order_id: "",
|
||||
// order_sn: "",
|
||||
// logistics_id: this.goodsDetil.logistics.id
|
||||
// }).then(res => {
|
||||
// this.showToast()
|
||||
// setTimeout(() => {
|
||||
// uni.navigateBack()
|
||||
// }, 2000)
|
||||
// })
|
||||
// this.showPop = false
|
||||
var packageName = 'com.autonavi.minimap';
|
||||
var main = plus.android.runtimeMainActivity();
|
||||
var packageManager = main.getPackageManager();
|
||||
var PackageManager = plus.android.importClass(packageManager) var packageInfo = packageManager
|
||||
.getPackageInfo(packageName, PackageManager.GET_ACTIVITIES);
|
||||
if (packageInfo) {
|
||||
var Uri = plus.android.importClass("android.net.Uri");
|
||||
var url = "amapuri://route/plan?sourceApplication=maxuslife" +
|
||||
"&sid=A&slat=36.702558&slon=116.876678&sname=起始地点" +
|
||||
"&did=B&dlat=36.649415&dlon=117.122497&dname=结束地点&dev=0&t=0";
|
||||
var Intent = plus.android.importClass('android.content.Intent');
|
||||
var intent = new Intent();
|
||||
intent.setAction(Intent.ACTION_VIEW);
|
||||
intent.addCategory(Intent.CATEGORY_DEFAULT);
|
||||
var uri = Uri.parse(url);
|
||||
//将功能Scheme以URI的方式传入data intent.setData(uri);intent.setPackage("com.autonavi.minimap");var main = plus.android.runtimeMainActivity();main.startActivity(intent);} else {// alert('未安装' + packageName + '')uni.showToast({title: `目前导航暂只支持${packageName}`})}
|
||||
test() {
|
||||
let i = 0
|
||||
let timer = setInterval(() => {
|
||||
this.markers[0].latitude = this.arr[i].latitude
|
||||
this.markers[0].longitude = this.arr[i].longitude
|
||||
i++
|
||||
console.log(i)
|
||||
// this.polyline[0].points.push(this.arr[i])
|
||||
this.$set(this.polyline[0].points, i, this.arr[i])
|
||||
if (i >= this.arr.length) {
|
||||
console.log(this.polyline[0].points)
|
||||
clearInterval(timer)
|
||||
}
|
||||
}, 50)
|
||||
|
||||
},
|
||||
showToast() {
|
||||
this.$refs.uToast.show({
|
||||
type: 'success',
|
||||
title: '成功主题(带图标)',
|
||||
message: "操作成功",
|
||||
iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/success.png'
|
||||
})
|
||||
},
|
||||
/*
|
||||
地图相关
|
||||
*/
|
||||
// 路线规划
|
||||
getDriverLine() {
|
||||
const that = this;
|
||||
const key = "997c9a3d88154fa78f4d28bebc1dd84f";
|
||||
//起点坐标
|
||||
const origin = "28.908854,105.43639400000002,";
|
||||
//给起点坐标一个图标
|
||||
this.startingPoint()
|
||||
//给终点坐标一个图标
|
||||
this.endPoint()
|
||||
//终点坐标
|
||||
const destination = "28.908447,105.439304,";
|
||||
uni.request({
|
||||
// url: `https://restapi.amap.com/v3/direction/walking?key=${key}&origin=105.43639400000002,28.908854&destination=105.439304,28.908447`,
|
||||
url: `https:restapi.amap.com/v4/direction/bicycling?key=${key}&origin=105.43639400000002,28.908854&destination=105.439304,28.908447`,
|
||||
success: (res) => {
|
||||
const data = res.data.data;
|
||||
var points = [];
|
||||
if (data.paths && data.paths[0] && data.paths[0].steps) {
|
||||
var steps = data.paths[0].steps;
|
||||
for (var i = 0; i < steps.length; i++) {
|
||||
//将每一步的数据放到points数组中
|
||||
var poLen = steps[i].polyline.split(";");
|
||||
for (var j = 0; j < poLen.length; j++) {
|
||||
points.push({
|
||||
longitude: parseFloat(poLen[j].split(",")[0]),
|
||||
latitude: parseFloat(poLen[j].split(",")[1]),
|
||||
});
|
||||
}
|
||||
}
|
||||
console.log(data.paths[0].steps[0].instruction)
|
||||
that.runningRoute = data.paths[0].steps[0].instruction;
|
||||
console.log('行驶路线-----------', that.runningRoute)
|
||||
},
|
||||
|
||||
// 获取位置
|
||||
// 位置
|
||||
locationFn() {
|
||||
let that = this
|
||||
|
||||
uni.getLocation({
|
||||
type: 'wgs84',
|
||||
geocode: true,
|
||||
isHighAccuracy: true,
|
||||
success: function async (res) {
|
||||
that.markers[1].latitude = res.latitude
|
||||
that.markers[1].longitude = res.longitude
|
||||
|
||||
that.getDriverLine()
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
},
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
getDriverLine() {
|
||||
const that = this;
|
||||
const key = "997c9a3d88154fa78f4d28bebc1dd84f";
|
||||
|
||||
const origin = `${this.markers[1].longitude},${this.markers[1].latitude}`;
|
||||
|
||||
const destination = `${this.markers[0].longitude},${this.markers[0].latitude}`;
|
||||
console.log(that.markers)
|
||||
uni.request({
|
||||
// url: `https://restapi.amap.com/v3/direction/walking?key=${key}&origin=105.43639400000002,28.908854&destination=105.439304,28.908447`,
|
||||
url: `https:restapi.amap.com/v4/direction/bicycling?key=${key}&origin=${origin}&destination=${destination}`,
|
||||
success: (res) => {
|
||||
const data = res.data.data;
|
||||
console.log(res.data)
|
||||
var points = [];
|
||||
if (data.paths && data.paths[0] && data.paths[0].steps) {
|
||||
var steps = data.paths[0].steps;
|
||||
for (var i = 0; i < steps.length; i++) {
|
||||
//将每一步的数据放到points数组中
|
||||
var poLen = steps[i].polyline.split(";");
|
||||
for (var j = 0; j < poLen.length; j++) {
|
||||
points.push({
|
||||
longitude: parseFloat(poLen[j].split(",")[0]),
|
||||
latitude: parseFloat(poLen[j].split(",")[1]),
|
||||
});
|
||||
}
|
||||
that.polyline = [{
|
||||
points: points,
|
||||
color: "#0091ff",
|
||||
dottedLine: true,
|
||||
width: 15,
|
||||
arrowLine: true,
|
||||
colorList: true,
|
||||
}, ];
|
||||
},
|
||||
fail: function(res) {
|
||||
console.log("获取路线失败", res);
|
||||
},
|
||||
});
|
||||
},
|
||||
// 规划路线的时候给起点一个marker，
|
||||
startingPoint() {
|
||||
let point = [{
|
||||
id: 1,
|
||||
width: 40,
|
||||
height: 40,
|
||||
latitude: 28.908854,
|
||||
longitude: 105.43639400000002,
|
||||
iconPath: "https://p4.itc.cn/images03/20200518/90137c12bbac485dbc5bb0fe9d8cf4bd.jpeg",
|
||||
anchor: {
|
||||
x: 0.5,
|
||||
y: 1,
|
||||
},
|
||||
}, ];
|
||||
this.markers = this.markers.concat(point);
|
||||
},
|
||||
// 规划路线的时候给终点一个marker，
|
||||
endPoint() {
|
||||
let point = [{
|
||||
id: 2,
|
||||
width: 40,
|
||||
height: 40,
|
||||
latitude: 28.908447, //纬度
|
||||
longitude: 105.439304,
|
||||
//经度
|
||||
iconPath: 'https://t9.baidu.com/it/u=414099140,1072313909&fm=193',
|
||||
anchor: {
|
||||
x: 0.5,
|
||||
y: 1,
|
||||
},
|
||||
}, ];
|
||||
this.markers = this.markers.concat(point);
|
||||
},
|
||||
|
||||
mapFun() {
|
||||
uni.openLocation({
|
||||
latitude: Number(this.goodsDetil.logistics.shop_lat),
|
||||
longitude: Number(this.goodsDetil.logistics.shop_long),
|
||||
address: this.goodsDetil.logistics.shop_address,
|
||||
name: this.goodsDetil.logistics.shop_name,
|
||||
scale: 15,
|
||||
});
|
||||
},
|
||||
|
||||
|
||||
qrqodeFn() {
|
||||
uni.scanCode({
|
||||
onlyFromCamera: true,
|
||||
success: function(res) {
|
||||
// console.log('条码类型：' + res.scanType);
|
||||
console.log('条码内容：' + res.result);
|
||||
}
|
||||
});
|
||||
|
||||
that.runningRoute = data.paths[0].steps[0].instruction;
|
||||
|
||||
}
|
||||
that.polyline = [{
|
||||
points: points,
|
||||
color: "#0091ff",
|
||||
dottedLine: true,
|
||||
width: 10,
|
||||
|
||||
}, ];
|
||||
},
|
||||
|
||||
// 地图结束
|
||||
fail: function(res) {
|
||||
console.log("获取路线失败", res);
|
||||
},
|
||||
});
|
||||
},
|
||||
onLoad(options) {
|
||||
getDetil({
|
||||
logistics_id: options.id
|
||||
}).then(res => {
|
||||
this.goodsDetil = res.data
|
||||
this.latitude = res.data.logistics.shop_lat
|
||||
this.longitude = res.data.logistics.shop_long
|
||||
this.markers[0].latitude = res.data.logistics.shop_lat
|
||||
this.markers[0].longitude = res.data.logistics.shop_long
|
||||
setTimeout(() => {
|
||||
this.showLoading = false
|
||||
}, 500)
|
||||
})
|
||||
},
|
||||
// onShow() {
|
||||
// let that = this
|
||||
// // uni.getLocation({
|
||||
// // type: 'wgs84',
|
||||
// // success: function(res) {
|
||||
// // that.mark[0].latitude = res.latitude
|
||||
// // that.mark[0].longitude = res.longitude
|
||||
// // console.log(that.mark[0])
|
||||
// // console.log(res)
|
||||
|
||||
// // }
|
||||
// // });
|
||||
// }
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang='scss' scoped>
|
||||
.map {
|
||||
height: 40vh;
|
||||
width: 100vw;
|
||||
|
||||
|
||||
|
||||
|
||||
},
|
||||
onLoad() {
|
||||
|
||||
// this.locationFn()
|
||||
|
||||
},
|
||||
}
|
||||
|
||||
|
||||
.custom-style {
|
||||
width: 100%;
|
||||
background-color: #3C9CFF;
|
||||
border: none;
|
||||
color: white;
|
||||
height: 90rpx;
|
||||
line-height: 90rpx;
|
||||
}
|
||||
|
||||
.order_info {
|
||||
height: auto;
|
||||
background-color: white;
|
||||
border-radius: 6vw 6vw 0 0;
|
||||
transform: translateY(-5vh);
|
||||
padding: 5vh 3vw;
|
||||
box-sizing: border-box;
|
||||
|
||||
.tit {
|
||||
font-weight: bold;
|
||||
font-size: 35rpx
|
||||
}
|
||||
|
||||
.tit_a {
|
||||
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-weight: bold;
|
||||
font-size: 35rpx
|
||||
}
|
||||
|
||||
.total {
|
||||
text-align: right;
|
||||
color: #3274F9;
|
||||
font-weight: bold;
|
||||
font-size: 32rpx;
|
||||
margin: 20rpx 0;
|
||||
}
|
||||
|
||||
.store_name {
|
||||
color: #999999;
|
||||
margin: 18rpx 0;
|
||||
}
|
||||
|
||||
.store_time {
|
||||
color: #999999;
|
||||
padding: 0 0 20rpx 0;
|
||||
border-bottom: 1px solid #999999;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.info {
|
||||
margin: 10rpx 0;
|
||||
|
||||
}
|
||||
|
||||
.pro_info {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
.goods_tit {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.icon {
|
||||
|
||||
text-align: center;
|
||||
font-size: 50rpx;
|
||||
|
||||
text {
|
||||
display: block;
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</script>
|
||||
85
utils/websocket.js
Normal file
85
utils/websocket.js
Normal file
@ -0,0 +1,85 @@
|
||||
let socket = null;
|
||||
const HEARTBEAT_INTERVAL = 5000;
|
||||
let heartbeatTimer = null;
|
||||
|
||||
// // 连接到后端 WebSocket，并开始心跳
|
||||
// function connect() {
|
||||
// WebSocket.connect('ws://your-backend-url');
|
||||
// startHeartbeat();
|
||||
// }
|
||||
|
||||
// 开始发送心跳消息
|
||||
function startHeartbeat() {
|
||||
heartbeatTimer = setInterval(() => {
|
||||
WebSocket.send('heartbeat');
|
||||
}, HEARTBEAT_INTERVAL);
|
||||
}
|
||||
|
||||
// 停止发送心跳消息
|
||||
function stopHeartbeat() {
|
||||
clearInterval(heartbeatTimer);
|
||||
}
|
||||
|
||||
// 监听收到的消息
|
||||
WebSocket.onMessage((event) => {
|
||||
if (event.data === 'heartbeat') {
|
||||
// 收到心跳响应，重置定时器
|
||||
resetHeartbeatTimer();
|
||||
} else {
|
||||
// 处理其他消息
|
||||
}
|
||||
});
|
||||
|
||||
// 重置心跳定时器
|
||||
function resetHeartbeatTimer() {
|
||||
clearInterval(heartbeatTimer);
|
||||
startHeartbeat();
|
||||
}
|
||||
|
||||
// 在页面关闭或组件销毁时，关闭 WebSocket 连接并停止心跳
|
||||
uni.onUnload(() => {
|
||||
WebSocket.close();
|
||||
stopHeartbeat();
|
||||
});
|
||||
|
||||
|
||||
function connect(url) {
|
||||
socket = uni.connectSocket({
|
||||
url: url
|
||||
});
|
||||
|
||||
socket.onOpen(() => {
|
||||
console.log('WebSocket 连接已打开');
|
||||
});
|
||||
|
||||
socket.onError((error) => {
|
||||
console.error('WebSocket 连接发生错误', error);
|
||||
});
|
||||
|
||||
socket.onClose((e) => {
|
||||
console.log('WebSocket 连接已关闭', e);
|
||||
});
|
||||
|
||||
socket.onMessage((event) => {
|
||||
console.log('收到服务器消息', event.data);
|
||||
// 处理收到的消息
|
||||
});
|
||||
}
|
||||
|
||||
function send(message) {
|
||||
socket.send({
|
||||
data: message
|
||||
});
|
||||
}
|
||||
|
||||
function close() {
|
||||
if (socket) {
|
||||
socket.close();
|
||||
}
|
||||
}
|
||||
|
||||
export default {
|
||||
connect,
|
||||
send,
|
||||
close
|
||||
};
|
||||
Loading…
x
Reference in New Issue
Block a user