You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

2 line
3.3KB

  1. var h=(w,s,a)=>new Promise((v,e)=>{var i=t=>{try{d(a.next(t))}catch(r){e(r)}},n=t=>{try{d(a.throw(t))}catch(r){e(r)}},d=t=>t.done?v(t.value):Promise.resolve(t.value).then(i,n);d((a=a.apply(w,s)).next())});import{u as O}from"./orderManage.fe83d1aa.js";import{d as x,k as N,r as y,o as S,a2 as Y,f as M,g as q,c as R,e as u,w as m,b as c,t as _,x as k,N as C,h as g}from"./index.551f5afa.js";const E={class:"track-playback"},F=c("div",{id:"map",class:"map"},null,-1),P=g(" \u64AD\u653E\u8F68\u8FF9 "),B=g("\u6682\u505C\u52A8\u753B"),H=g("\u7EE7\u7EED\u52A8\u753B"),U=x({name:"trackPlayback"}),W=Object.assign(U,{setup(w){let s,a;const v=N(),e=window.TMap,i=y([]),n=y([]),d=1e4,t=y({}),r=y(!1),T=()=>h(this,null,function*(){try{const l=yield O(v.query.orderId);t.value=l.data,i.value=l.data.locusLocationList.map(o=>[o.lat,o.lng]);const p=new e.LatLng(i.value[0][0],i.value[0][1]);a=new e.Map("map",{center:p,zoom:10.5,mapStyleId:"style1"}),a.removeControl(e.constants.DEFAULT_CONTROL_ID.SCALE),a.removeControl(e.constants.DEFAULT_CONTROL_ID.ROTATION),a.removeControl(e.constants.DEFAULT_CONTROL_ID.ZOOM),L()}catch(l){console.error(l)}}),L=()=>{var p;n.value=i.value.map(o=>new e.LatLng(o[0],o[1]));const l=new e.MultiPolyline({map:a,styles:{style_blue:new e.PolylineStyle({color:"#28F",width:6,borderWidth:1,lineCap:"round",showArrow:!0}),style_gray:new e.PolylineStyle({color:"#AF5",width:6,borderWidth:1,lineCap:"round"})},geometries:[{id:"path1",styleId:"style_blue",paths:n.value},{id:"path2",styleId:"style_blue",paths:n.value}]});s=new e.MultiMarker({id:"car",map:a,styles:{"car-down":new e.MarkerStyle({width:48,height:52,anchor:{x:24,y:36},faceTo:"map",rotate:180,src:"https://mapapi.qq.com/web/mapComponents/componentsTest/zyTest/static/model_taxi.png?a=1"}),start:new e.MarkerStyle({anchor:{x:16,y:32},src:"https://mapapi.qq.com/web/miniprogram/demoCenter/images/marker-start.png"}),end:new e.MarkerStyle({src:"https://mapapi.qq.com/web/miniprogram/demoCenter/images/marker-end.png"})},geometries:[{id:"car",styleId:"car-down",position:n.value[0]},{id:"start",styleId:"start",position:n.value[0]},{id:"end",styleId:"end",position:n.value[((p=n.value)==null?void 0:p.length)-1]}]}),s.on("move_ended",function(){r.value=!1}),s.on("move_stopped",function(o){r.value=!1}),s.on("moving",o=>{l.updateGeometries([{id:"path2",styleId:"style_gray",paths:o.car&&o.car.passedLatLngs}])})},b=()=>{s.moveAlong({car:{path:n.value,speed:d}},{autoRotation:!0}),r.value=!0},A=()=>{r.value||b()},D=()=>{s.pauseMove()},I=()=>{s.resumeMove()};return S(()=>h(this,null,function*(){yield T()})),Y(()=>{a&&a.destroy()}),(l,p)=>{const o=M("el-button"),f=M("el-card");return q(),R("div",E,[F,u(f,{class:"input-card"},{default:m(()=>[u(o,{type:"primary",icon:"VideoPlay",onClick:A},{default:m(()=>[P]),_:1}),u(o,{type:"primary",onClick:D},{default:m(()=>[B]),_:1}),u(o,{type:"primary",onClick:I},{default:m(()=>[H]),_:1})]),_:1}),u(f,{class:"title-card"},{default:m(()=>[c("div",null,"\u8F66\u724C\u53F7\uFF1A"+_(t.value.carNo),1),c("div",null," \u7528\u8F66\u65F6\u95F4\uFF1A"+_(k(C)(t.value.beginTime).format("YYYY-MM-DD HH:mm")),1),c("div",null," \u7ED3\u675F\u65F6\u95F4\uFF1A"+_(k(C)(t.value.endTime).format("YYYY-MM-DD HH:mm")),1),c("div",null,"\u53F8\u673A\u59D3\u540D\uFF1A"+_(t.value.driverName),1),c("div",null,"\u8F66\u673A\u8F68\u8FF9\u91CC\u7A0B(km)\uFF1A"+_(t.value.gpsMileage),1)]),_:1})])}}});export{W as default};