diff --git a/src/app/routes/order-management/modal/vehicle/view-track/view-track.component.html b/src/app/routes/order-management/modal/vehicle/view-track/view-track.component.html index ad50faeb..97426178 100644 --- a/src/app/routes/order-management/modal/vehicle/view-track/view-track.component.html +++ b/src/app/routes/order-management/modal/vehicle/view-track/view-track.component.html @@ -10,11 +10,11 @@ -->
- + - + [page]="{ show: false, showSize: false }" size="small" class="map_st"> + diff --git a/src/app/routes/order-management/modal/vehicle/view-track/view-track.component.less b/src/app/routes/order-management/modal/vehicle/view-track/view-track.component.less index ae775710..64f5143e 100644 --- a/src/app/routes/order-management/modal/vehicle/view-track/view-track.component.less +++ b/src/app/routes/order-management/modal/vehicle/view-track/view-track.component.less @@ -1,11 +1,84 @@ :host { - ::ng-deep { - // .mapBox { - // iframe, canvas { - // width: 400px !important; - // } - // } - - } - - } \ No newline at end of file + .btn-size { + font-size: 14px; + } + + .bdr { + border-right: 1px solid #ccc; + } + + .bdl { + border-left: 1px solid #ccc; + } + + .source-info { + p { + margin-bottom: .5em; + } + } + + .freight-info-box { + width: 95%; + } + + .freigth-label { + display : inline-block; + width : 50px; + text-align: right; + } + + ::ng-deep { + .approval-status { + .ant-steps { + width : 70%; + margin: 0 auto; + } + } + + } + + .leftPadding { + padding-right: 100px; + } + .hide{ + display: none; + } + .handling-info { + min-height: 100px; + border: 1px solid #ccc; + + .loading-row { + display: flex; + } + + .handling-info-icon { + width: 32px; + height: 32px; + margin-right: 24px; + color: #fff; + line-height: 32px; + text-align: center; + border-radius: 50%; + + &.loading-bg { + background-color: #50D4AB; + } + + &.unloaing-bg { + background: #F66F6A; + } + } + + .info { + flex: 1; + } + + .time-info { + margin-left: 56px; + } + } + .target-fix { + display: block; + margin-top: 290px; + } +} \ No newline at end of file diff --git a/src/app/routes/order-management/modal/vehicle/view-track/view-track.component.ts b/src/app/routes/order-management/modal/vehicle/view-track/view-track.component.ts index 0b5c1dff..b0864915 100644 --- a/src/app/routes/order-management/modal/vehicle/view-track/view-track.component.ts +++ b/src/app/routes/order-management/modal/vehicle/view-track/view-track.component.ts @@ -4,7 +4,7 @@ * @Author : Shiming * @Date : 2022-02-22 13:53:29 * @LastEditors : Shiming - * @LastEditTime : 2022-03-08 16:11:58 + * @LastEditTime : 2022-04-22 15:49:04 * @FilePath : \\tms-obc-web\\src\\app\\routes\\order-management\\modal\\vehicle\\view-track\\view-track.component.ts * Copyright (C) 2022 huzhenhong. All rights reserved. */ @@ -24,6 +24,7 @@ import { _HttpClient } from '@delon/theme'; import { NzMessageService } from 'ng-zorro-antd/message'; import { NzModalRef, NzModalService } from 'ng-zorro-antd/modal'; import { OrderManagementService } from '../../../services/order-management.service'; +import { ThisReceiver } from '@angular/compiler'; @Component({ selector: 'app-order-management-view-track', @@ -37,9 +38,11 @@ export class OneCarOrderViewtrackComponent implements OnInit { mapList: any[] = []; //地图点位数据组 addressItems: any[] = []; //打点地址数据组 logColumns2: STColumn[] = [ - { title: '时间', index: 'parkBte' }, + { title: '时间', index: 'parkBte', width: 120, className: 'text-center' }, { title: '地点', index: 'parkAdr' } ]; + pois: any[] = []; + constructor( private modalRef: NzModalRef, private modal: NzModalService, @@ -56,23 +59,48 @@ export class OneCarOrderViewtrackComponent implements OnInit { } // 获取车辆轨迹 getTrajectory() { - this.service.request(this.service.$api_get_getTrajectory, { id: this.i?.id }).subscribe(res => { + this.service.request(this.service.$api_get_getWholeBillDetail, { id: this.i.id }).subscribe(res => { + if (res) { + this.pois = [ + { + markerLabel: '装', + color: 'blue', + position: [res.startingPoint.longitude, res.startingPoint.latitude], + title: `发货地：${res.startingPoint.province}${res.startingPoint.city}${res.startingPoint.area || ''}${ + res.startingPoint.detailedAddress + }`, + time: '计划出发时间：' + res.loadPlanTime + }, + { + markerLabel: '卸', + color: 'red', + position: [res.endPoint.longitude, res.endPoint.latitude], + title: `卸货地：${res.endPoint.province}${res.endPoint.city}${res.endPoint.area}${res.endPoint.detailedAddress}`, + time: '计划卸货时间：' + res.unloadPlanTime + } + ]; + } + }); + this.service.request(this.service.$api_get_getTrajectory, { id: this.i.id }).subscribe(res => { if (res) { const points = res.trackArray; let list: any[] = []; points?.forEach((item: any) => { list.push({ - name: item.hgt, + name: `${item.spd}`, lnglat: [Number((Number(item.lon) / 600000).toFixed(6)), Number((Number(item.lat) / 600000).toFixed(6))], time: item.gtm }); }); this.mapList = list; - this.addressItems = res.parkAdr; - if (this.addressItems && this.addressItems.length > 0) { - this.addressItems.forEach(item => { + const addressItems: any[] = res.parkArray; + if (addressItems?.length > 0) { + addressItems.forEach(item => { item.parkBte = this.getLocalTime(item.parkBte); }); + this.addressItems = [...addressItems]; + } else { + this.addressItems = []; } } }); @@ -80,7 +108,7 @@ export class OneCarOrderViewtrackComponent implements OnInit { // 获取司机轨迹 getDriverTrajectory() { - this.service.request(this.service.$api_get_getAppDriverPosition, { id: this.i?.id }).subscribe(res => { + this.service.request(this.service.$api_get_getAppDriverPosition, { id: this.i.id }).subscribe(res => { if (res) { const points = res.tracks; let list: any[] = []; @@ -91,7 +119,7 @@ export class OneCarOrderViewtrackComponent implements OnInit { time: item.gtm }); }); - this.mapList = list; + this.mapList = list || []; const addressItems = [...res.tracks]; if (addressItems) { addressItems.forEach(item => {