md

common/api/common.js

@@ -74,5 +74,11 @@ export const listSimple = (data = {})=> {
 	return coreRequest(url.listSimple, data, {}, "GET")
 }
 
+export const getLbsRecordListByBillCode = (data = {})=> {
+	return coreRequest(url.getLbsRecordListByBillCode, data, {}, "GET")
+}
+
+
+
 
 

common/api/url.js

@@ -82,5 +82,8 @@ export default {
   getMyBizStatList: `/emis/emisWaybill/getMyBizStatList`, // 业务统计明细(区分国家)
   getMasterEmisWaybills: `/emis/emisWaybill/getMasterEmisWaybills`, // 获取关联主单号
   listSimple: `/emis/emisSite/listSimple`, // 获取网点列表
+  getLbsRecordListByBillCode: `/emis/emisTmsMapTrace/getLbsRecordListByBillCode`, // 获取运单lbs信息
+  
+  
 }
 

manifest.json

@@ -3,7 +3,7 @@
     "appid" : "__UNI__BCB0FB5",
     "description" : "探路国际速运",
     "versionName" : "1.0.2",
-    "versionCode" : 1063,
+    "versionCode" : 1065,
     "transformPx" : false,
     /* 5+App特有相关 */
     "app-plus" : {

package.json

@@ -14,11 +14,13 @@
 	"author": "",
 	"license": "MIT",
 	"dependencies": {
-		"dayjs": "^1.11.10",
+		"coordtransform": "^2.1.2",
+		"dayjs": "^1.11.13",
 		"file-saver": "2.0.5",
+		"js-base64": "3.7.7",
+		"maptalks": "^1.4.1",
 		"pdf-lib": "1.17.1",
-		"vconsole": "3.15.1",
+		"vconsole": "3.15.1"
-		"js-base64": "3.7.7"
 	},
 	"dcloudext": {
 		"category": [

pages/post/locus.vue

@@ -5,22 +5,37 @@
 			<template v-slot:body>
 				<div style="min-height: 100%;display: flex;flex-direction: column;">
 					<view style="position: relative;">
-						<map :markers="map.markers" :latitude="map.latitude" :longitude="map.longitude"
+						<maptalks-map 
-							style="width: 750rpx;height: 400rpx;"
+						      :dataList="dataList" 
-						></map>
+							   style="width: 750rpx;height: 70vh;"
+						    ></maptalks-map>
+						<!-- <map   
+						 :latitude="map.latitude" 
+						 :longitude="map.longitude" 
+						 :polyline="[...map.polyline]"
+						 style="width: 750rpx;height: 400rpx;"
+						></map> -->
+						
+						<!-- :markers="map.markers" -->
+						
+						 <!-- :polyline="map.polyline" -->
 						 
-						<view class="mp-base-block">
+						 <view  style="position: absolute;top:5px;width: 95%;padding-left: 8px;padding-right: 8px">
-							<bpd-send-reciever-tmp :value="modelInfo"></bpd-send-reciever-tmp>
+							<view class="mp-base-block" >
+								<bpd-map-reciever-panel :value="modelInfo"></bpd-map-reciever-panel>
+							</view>
 						</view>
 						
-						<view class="mp-base-block blackbg" @click="makePhoneCall(modelInfo.takePieceEmployeePhone)">
+						<view  style="position: absolute;top:60vh;width: 95%;padding-left: 8px;padding-right: 8px">
-							<u-row justify="between">
+							<view class="mp-base-block blackbg"  @click="makePhoneCall(modelInfo.takePieceEmployeePhone)">
-								<u-row>
+								<u-row justify="between">
-									<tpx-image :src="getCdnUrl('post/run.png')" width="30" height="30"></tpx-image>
+									<u-row>
-									<view class="ml-20">探路小哥 - {{modelInfo.takePieceEmployeeName}}</view>
+										<tpx-image :src="getCdnUrl('post/run.png')" width="30" height="30"></tpx-image>
+										<view class="ml-20">探路小哥 - {{modelInfo.takePieceEmployeeName}}</view>
+									</u-row>
+									<tpx-image v-if="modelInfo.takePieceEmployeePhone" :src="getCdnUrl('post/call.png')" width="60" height="60"></tpx-image>
 								</u-row>
-								<tpx-image v-if="modelInfo.takePieceEmployeePhone" :src="getCdnUrl('post/call.png')" width="60" height="60"></tpx-image>
+							</view>
-							</u-row>
 						</view>
 					</view>
 					
@@ -50,9 +65,14 @@
 </template>
 
 <script>
-	import * as apiService from "@/common/api"
+	import coordtransform from 'coordtransform';
-	import BpdSendRecieverTmp from "@/components/buns-post-detail-templates/bpd-send-reciever-tmp"
 	
+	import * as apiService from "@/common/api"
+	
+	import BpdMapRecieverPanel from "@/components/buns-post-detail-templates/bpd-map-reciever-panel"
+	
+	import maptalksMap from "@/components/map-talks/maptalks-panel"
+	// maptalksMap
 	export default {
 		props: {
 			
@@ -62,13 +82,14 @@
 			  return this.$store.getters.dicData
 			},
 		},
-		components: { BpdSendRecieverTmp },
+		components: { BpdMapRecieverPanel,maptalksMap },
 		data() {
 			return {
 				queryOption: {
 					billCode: '', // 运单id
 				},
 				modelInfo: {},
+				dataList:[],
 				map: {
 					latitude: 23.106574, //纬度
 					longitude: 113.324587, //经度
@@ -87,7 +108,13 @@
 							bgColor: '#B12D29',
 							padding: '10'
 						}
-					}]
+					}],
+					polyline: [{
+							points: [],
+							color: '#28f',
+							width: 6,
+							arrowLine: true,
+					}],
 				}
 			}
 		},
@@ -106,7 +133,42 @@
 				let res = await apiService.getOrderDetail({billCode: this.queryOption.billCode, _loading: true})
 				// 通过对象合并才能修改父级 数据
 				Object.assign(this.modelInfo, res.data || {})
-			}
+				
+				const resLbs = await apiService.getLbsRecordListByBillCode({
+				    billCode: this.queryOption.billCode
+				});
+				
+				// console.log("=resLbs==>",resLbs);
+				
+				if (resLbs && resLbs.code === 200) {
+					let lbsRecordList=resLbs.data.lbsRecordList;
+					if( lbsRecordList && lbsRecordList.length>0){
+						let currentInfo=lbsRecordList[lbsRecordList.length-1];
+						this.map.latitude=this.cvtToWgs84(currentInfo.longitude, currentInfo.latitude)[1];
+						this.map.longitude=this.cvtToWgs84(currentInfo.longitude, currentInfo.latitude)[0];
+						
+						this.dataList=lbsRecordList;
+						
+							const points = lbsRecordList.map(item => ({
+								latitude: this.cvtToWgs84(item.longitude, item.latitude)[1],
+								longitude: this.cvtToWgs84(item.longitude, item.latitude)[0]
+							}));
+							
+							// console.log("===>",points);
+							
+							this.map.polyline[0].points = points;
+					}
+					
+				}
+				
+				
+				
+			},
+			cvtToWgs84(longitude, latitude) {
+				    let lng = longitude / 1000000;
+				    let lat = latitude / 1000000;
+				    return coordtransform.wgs84togcj02(lng, lat);
+				}
 		}
 	}
 </script>
@@ -182,4 +244,7 @@
 		}
 	}
 
+	:deep .maptalks-attribution {
+	  display: none !important;
+	}
 </style>