车辆对接
This commit is contained in:
		| @ -1,7 +1,7 @@ | |||||||
| <!-- | <!-- | ||||||
|  * @Author: your name |  * @Author: your name | ||||||
|  * @Date: 2021-12-03 15:31:52 |  * @Date: 2021-12-03 15:31:52 | ||||||
|  * @LastEditTime: 2021-12-28 16:24:57 |  * @LastEditTime: 2021-12-28 17:04:16 | ||||||
|  * @LastEditors: Please set LastEditors |  * @LastEditors: Please set LastEditors | ||||||
|  * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE |  * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE | ||||||
|  * @FilePath: \tms-obc-web\src\app\routes\order-management\components\vehicle-detail\vehicle-detail.component.html |  * @FilePath: \tms-obc-web\src\app\routes\order-management\components\vehicle-detail\vehicle-detail.component.html | ||||||
| @ -15,7 +15,7 @@ | |||||||
|   <ng-template #headerContent> |   <ng-template #headerContent> | ||||||
|     <div class="mb-xs" nz-row> |     <div class="mb-xs" nz-row> | ||||||
|       <button nz-button nzType="primary" nzSize="small" nzDanger>{{i?.wayBillStatusLabel}}</button> |       <button nz-button nzType="primary" nzSize="small" nzDanger>{{i?.wayBillStatusLabel}}</button> | ||||||
|       <h4 class="ml-md" style="font-size: 18px;">运单号: {{ i?.billCode }}</h4> |       <h4 class="ml-md" style="font-size: 18px;">运单号: {{ i?.wayBillCode }}</h4> | ||||||
|     </div> |     </div> | ||||||
|     <div nz-row style="display: flex; justify-content: end;"> |     <div nz-row style="display: flex; justify-content: end;"> | ||||||
|       <div nz-col nzSpan="10"> |       <div nz-col nzSpan="10"> | ||||||
| @ -26,11 +26,11 @@ | |||||||
|     <nz-divider></nz-divider> |     <nz-divider></nz-divider> | ||||||
|    <div> |    <div> | ||||||
|       <div sv-container> |       <div sv-container> | ||||||
|         <sv label="网络货运人">{{ i?.goodsResource?.[0]?.enterpriseInfoName }} </sv> |         <sv label="网络货运人">{{ i?.enterpriseInfoName }} </sv> | ||||||
|         <sv label="货主">{{ i?.goodsResource?.[0]?.shipperAppUserName }} </sv> |         <sv label="货主">{{ i?.goodsResource?.shipperAppUserName }} </sv> | ||||||
|         <sv label="所属项目">{{i?.goodsResource?.[0]?.enterpriseProjectName}}</sv> |         <sv label="所属项目">{{i?.enterpriseProject}}</sv> | ||||||
|         <sv label="服务类型">{{i?.goodsResource?.[0]?.serviceTypeLabel}}</sv> |         <sv label="服务类型">{{i?.serviceTypeLabel}}</sv> | ||||||
|         <sv label="调度员">{{i?.goodsResource?.[0]?.dispatchName}} </sv> |         <sv label="调度员">{{i?.dispatch?.name}} /{{i?.dispatch?.phone}}</sv> | ||||||
|      </div> |      </div> | ||||||
|      <nz-tabset style="margin-top: 15px;"> |      <nz-tabset style="margin-top: 15px;"> | ||||||
|       <nz-tab nzTitle="装卸货信息" (nzClick)="goDistance(distannce1)"> |       <nz-tab nzTitle="装卸货信息" (nzClick)="goDistance(distannce1)"> | ||||||
| @ -150,7 +150,7 @@ | |||||||
|       totalObj?.price - attObj?.price |       totalObj?.price - attObj?.price | ||||||
|     }},附加运费¥{{ attObj?.price }},附加费率{{ (attObj?.price / totalObj?.price) * 100 | number: '0.2-2' }}%) |     }},附加运费¥{{ attObj?.price }},附加费率{{ (attObj?.price / totalObj?.price) * 100 | number: '0.2-2' }}%) | ||||||
|   </div> |   </div> | ||||||
|   <div>收款人:{{ i?.payeeName }}{{ i?.payeePhone }}</div> |   <div>收款人:{{ i?.payee?.name }}/{{ i?.payee?.phone }}</div> | ||||||
| </nz-card> | </nz-card> | ||||||
|  |  | ||||||
| <nz-card nzTitle="附件信息" #distannce4> | <nz-card nzTitle="附件信息" #distannce4> | ||||||
|  | |||||||
| @ -1,7 +1,7 @@ | |||||||
| /* | /* | ||||||
|  * @Author: your name |  * @Author: your name | ||||||
|  * @Date: 2021-12-03 15:31:52 |  * @Date: 2021-12-03 15:31:52 | ||||||
|  * @LastEditTime: 2021-12-28 16:19:46 |  * @LastEditTime: 2021-12-28 16:43:55 | ||||||
|  * @LastEditors: Please set LastEditors |  * @LastEditors: Please set LastEditors | ||||||
|  * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE |  * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE | ||||||
|  * @FilePath: \tms-obc-web\src\app\routes\order-management\components\vehicle-detail\vehicle-detail.component.ts |  * @FilePath: \tms-obc-web\src\app\routes\order-management\components\vehicle-detail\vehicle-detail.component.ts | ||||||
| @ -27,8 +27,22 @@ export class WaybillManagementBulkeDetailComponent implements OnInit { | |||||||
|   attObj: any; |   attObj: any; | ||||||
|   isVisible = false; |   isVisible = false; | ||||||
|   logColumns: STColumn[] = [ |   logColumns: STColumn[] = [ | ||||||
|     { title: '时间', index: 'operationUserPhone' }, |     { title: '款项', index: 'expenseName' }, | ||||||
|     { title: '地点', index: ' createTime' }, |     { title: '运输费(元)', index: 'price' }, | ||||||
|  |     { title: '支付时间', index: ' paymentTime' }, | ||||||
|  |     { | ||||||
|  |       title: '支付状态', | ||||||
|  |       className: 'text-center', | ||||||
|  |       index: 'paymentStatus', | ||||||
|  |       type: 'badge', | ||||||
|  |       width: '120px', | ||||||
|  |       badge: { | ||||||
|  |         '1': { text: '待申请', color: 'warning' }, | ||||||
|  |         '2': { text: '已支付', color: 'success' }, | ||||||
|  |         '3': { text: '已拒绝', color: 'warning' }, | ||||||
|  |         '4': { text: '申请中', color: 'warning' }, | ||||||
|  |       }, | ||||||
|  |     }, | ||||||
|   ]; |   ]; | ||||||
|   imges: any; |   imges: any; | ||||||
|   unLoadingPlaceVOList: any = []; |   unLoadingPlaceVOList: any = []; | ||||||
|  | |||||||
| @ -1,146 +1,205 @@ | |||||||
| <!-- | <!-- | ||||||
|  * @Author: your name |  * @Author: your name | ||||||
|  * @Date: 2021-12-03 15:31:52 |  * @Date: 2021-12-03 15:31:52 | ||||||
|  * @LastEditTime: 2021-12-20 15:07:51 |  * @LastEditTime: 2021-12-28 17:11:42 | ||||||
|  * @LastEditors: Please set LastEditors |  * @LastEditors: Please set LastEditors | ||||||
|  * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE |  * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE | ||||||
|  * @FilePath: \tms-obc-web\src\app\routes\order-management\components\vehicle-detail\vehicle-detail.component.html |  * @FilePath: \tms-obc-web\src\app\routes\order-management\components\vehicle-detail\vehicle-detail.component.html | ||||||
| --> | --> | ||||||
| <page-header-wrapper [title]="''" [logo]="logo"> | <page-header-wrapper [title]="''" [logo]="logo" [content]="headerContent"> | ||||||
|   <ng-template #logo> |   <ng-template #logo> | ||||||
|     <button nz-button nz-tooltip nzTooltipTitle="返回上一页" (click)="goBack()"> |     <button nz-button nz-tooltip nzTooltipTitle="返回上一页" (click)="goBack()"> | ||||||
|       <i nz-icon nzType="left" nzTheme="outline"></i> |       <i nz-icon nzType="left" nzTheme="outline"></i> | ||||||
|     </button> |     </button> | ||||||
|   </ng-template> |   </ng-template> | ||||||
| </page-header-wrapper> |   <ng-template #headerContent> | ||||||
| <nz-card> |     <div class="mb-xs" nz-row> | ||||||
|   <div nz-row> |       <button nz-button nzType="primary" nzSize="small" nzDanger>{{i?.wayBillStatusLabel}}</button> | ||||||
|     <div nz-col nzSpan="4"> |       <h4 class="ml-md" style="font-size: 18px;">运单号: {{ i?.wayBillCode }}</h4> | ||||||
|       <sv-container class="bdr"> |  | ||||||
|         <sv label="订单号" col="1">{{ i?.no }}</sv> |  | ||||||
|         <sv-title class="text-center text-lg" style="font-weight: 700;">{{i?.wayBillStatusLabel}}</sv-title> |  | ||||||
|         <sv-title> |  | ||||||
|           <div style="display: flex; justify-content: center;"> |  | ||||||
|             <a class="btn-size" (click)="hand()">指派车队长</a> |  | ||||||
|           </div> |  | ||||||
|         </sv-title> |  | ||||||
|       </sv-container> |  | ||||||
|     </div> |     </div> | ||||||
|     <div nz-col nzSpan="16" class="approval-status"> |     <div nz-row style="display: flex; justify-content: end;"> | ||||||
|       <nz-steps style="width: 80%; margin: 0 auto" [nzLabelPlacement]="'vertical'"> |       <div nz-col nzSpan="10"> | ||||||
|         <nz-step nzStatus="finish" nzIcon="user" [nzDescription]="i?.createAt" nzTitle="下单"></nz-step> |         <button nz-button  >确认发车</button> | ||||||
|         <nz-step nzStatus="finish" nzIcon="solution" nzTitle="完结"></nz-step> |         <button nz-button nzType="primary" nzGhost >确认到车</button> | ||||||
|       </nz-steps> |  | ||||||
|     </div> |  | ||||||
|   </div> |  | ||||||
|   <nz-divider></nz-divider> |  | ||||||
|   <div sv-container *ngIf="i"> |  | ||||||
|     <sv label="项目名称">{{ i?.enterpriseProject }}</sv> |  | ||||||
|     <sv label="调度员">{{ i?.dispatch?.name }}/{{i?.dispatch?.phone}}</sv> |  | ||||||
|     <sv label="承诺付款时间">到货后{{ i?.paymentDays }}天内支付运费</sv> |  | ||||||
|     <sv label="服务类型">{{ i?.serviceTypeLabel }}</sv> |  | ||||||
|   </div> |  | ||||||
|   <nz-divider></nz-divider> |  | ||||||
|   <div nz-row> |  | ||||||
|     <div nz-col nzSpan="6"> |  | ||||||
|       <div *ngFor="let item of unLoadingPlaceVOList; let ii = index"> |  | ||||||
|         <h3 *ngIf="ii === 0" style="font-weight: 700;">装卸货信息</h3> |  | ||||||
|         <div *ngIf="item?.type === 1 || item?.type === '1'"> |  | ||||||
|           <p>装货地:{{item?.detailedAddress}}</p> |  | ||||||
|            <p>联系人:{{item?.appUserName}}/{{item?.contractTelephone}}</p> |  | ||||||
|         <p>发货日期:{{item?.createTime}}</p> |  | ||||||
|         </div> |  | ||||||
|         <div *ngIf="item.type === 2 || item.type === '2'"> |  | ||||||
|         <p>卸货地:{{item?.detailedAddress}}</p> |  | ||||||
|         <p>联系人:{{item?.appUserName}}/{{item?.contractTelephone}}</p> |  | ||||||
|         <p>卸货日期:{{item?.modifyTime}}</p> |  | ||||||
|       </div> |  | ||||||
|       </div> |  | ||||||
|     </div> |  | ||||||
|     <div nz-col nzSpan="5"> |  | ||||||
|       <div class="source-info bdr bdl pl-md"> |  | ||||||
|         <h3>货物信息</h3> |  | ||||||
|         <div *ngFor="let item of i?.goodsInfos; let i = index"> |  | ||||||
|           <p>货物名称:{{item?.goodsName}}</p> |  | ||||||
|           <p>重量/体积:{{item?.weight}}吨/{{item?.volume}}立方</p> |  | ||||||
|           <p>用车需求:{{item?.vehicleDemand}}</p> |  | ||||||
|           </div> |  | ||||||
|       </div> |  | ||||||
|     </div> |  | ||||||
|     <div nz-col nzSpan="5"> |  | ||||||
|       <div class="source-info bdr bdl pl-md"> |  | ||||||
|         <h3>托运信息</h3> |  | ||||||
|         <p>公司名称:{{i?.enterpriseInfoName}}</p> |  | ||||||
|         <p>联系人:{{ i?.dispatch?.name }}/{{i?.dispatch?.phone}}</p> |  | ||||||
|       </div> |  | ||||||
|     </div> |  | ||||||
|     <div nz-col nzSpan="5"> |  | ||||||
|       <div class="source-info bdr pl-md"> |  | ||||||
|         <h3>承运信息</h3> |  | ||||||
|         <p>司机:{{i?.driverVo?.name}}/{{i?.driverVo?.phone}}</p> |  | ||||||
|         <p>车牌号:{{i?.carVO?.carNo}}</p> |  | ||||||
|         <p>车型/车长/承重:{{i?.carVO?.carModel}} | {{i?.carVO?.carLength}} | {{i?.carVO?.carLoad}}</p> |  | ||||||
|       </div> |  | ||||||
|     </div> |  | ||||||
|     <div class="source-info pl-md"> |  | ||||||
|       <h3>补充信息</h3> |  | ||||||
|       <p style="color: #1890ff;" (click)="agreement('1')">协议附件</p> |  | ||||||
|       <p style="color: #1890ff;" (click)="agreement('2')"> 装车附件</p> |  | ||||||
|       <p style="color: #1890ff;" (click)="agreement('3')">卸货附件</p> |  | ||||||
|       <p style="color: #1890ff;" (click)="agreement('4')">回单附件</p> |  | ||||||
|     </div> |  | ||||||
|   </div> |  | ||||||
|   <nz-divider></nz-divider> |  | ||||||
|   <div nz-row> |  | ||||||
|     <div class="freight-info-box"> |  | ||||||
|       <h3>运费信息</h3> |  | ||||||
|       <div class="text-right"> |  | ||||||
|         <p><label class="freigth-label">收款人:</label><span>{{i?.payee?.name}} /{{i?.payee?.phone}} / {{i?.payee?.phone}}</span></p> |  | ||||||
|         <div *ngFor="let item of i?.billExpenseDetailVOList"> |  | ||||||
|           <p><label class="freigth-label">{{item?.costName}}:</label><span>{{ item?.price| currency: '¥' }}</span></p> |  | ||||||
|         </div> |  | ||||||
|       </div> |       </div> | ||||||
|     </div> |     </div> | ||||||
|     <nz-divider></nz-divider> |     <nz-divider></nz-divider> | ||||||
|     <div class="freight-info-box" nz-row> |    <div> | ||||||
|       <div nz-col nzSpan="24"> |       <div sv-container> | ||||||
|         <h3 class="text-right"><label>总计 :</label> <span class="text-error-dark text-xl">{{i?.freight | currency: '¥' }}</span></h3> |         <sv label="网络货运人">{{ i?.enterpriseInfoName }} </sv> | ||||||
|         <h3 class="text-right">{{i?.wayBillStatusLabel}}</h3> |         <sv label="货主">{{ i?.goodsResource?.shipperAppUserName }} </sv> | ||||||
|       </div> |         <sv label="所属项目">{{i?.enterpriseProject}}</sv> | ||||||
|  |         <sv label="服务类型">{{i?.serviceTypeLabel}}</sv> | ||||||
|  |         <sv label="调度员">{{i?.dispatch?.name}} /{{i?.dispatch?.phone}}</sv> | ||||||
|  |      </div> | ||||||
|  |      <nz-tabset style="margin-top: 15px;"> | ||||||
|  |       <nz-tab nzTitle="装卸货信息" (nzClick)="goDistance(distannce1)"> | ||||||
|  |       </nz-tab> | ||||||
|  |       <nz-tab nzTitle="基本信息" (nzClick)="goDistance(distannce1)"> | ||||||
|  |       </nz-tab> | ||||||
|  |       <nz-tab nzTitle="运费信息" (nzClick)="goDistance(distannce3)"> | ||||||
|  |       </nz-tab> | ||||||
|  |       <nz-tab nzTitle="附件信息" (nzClick)="goDistance(distannce4)"> | ||||||
|  |       </nz-tab> | ||||||
|  |       <nz-tab nzTitle="轨迹信息" (nzClick)="goDistance(distannce5)"> | ||||||
|  |       </nz-tab> | ||||||
|  |     </nz-tabset> | ||||||
|  |    </div> | ||||||
|  |   </ng-template> | ||||||
|  | </page-header-wrapper> | ||||||
|  | <nz-card nzTitle="运单进度"> | ||||||
|  |   <div class="approval-status"> | ||||||
|  |     <div style="width: 60%; margin: 0 auto"> | ||||||
|  |         <nz-steps [nzCurrent]="i?.scheduleVOList?.length + 1" nzLabelPlacement="vertical"> | ||||||
|  |            <nz-step | ||||||
|  |                   *ngFor="let item of i?.scheduleVOList" | ||||||
|  |              [nzTitle]="item.state" | ||||||
|  |              [nzSubtitle]="item.stateTime" | ||||||
|  |              [nzStatus]="item.displayStatus === 'SHOW' ? 'finish' : 'wait'" | ||||||
|  |            > | ||||||
|  |           </nz-step> | ||||||
|  |          </nz-steps> | ||||||
|     </div> |     </div> | ||||||
|   </div> |   </div> | ||||||
|   <nz-divider></nz-divider> | </nz-card> | ||||||
|   <div nz-row >  |  | ||||||
|     <div nz-col [nzSpan]='12'> |  | ||||||
|       <div  style="position: relative;"> |  | ||||||
|         <div style="height: 24px; width: 90px; background-color: #68758e;color: #fff;text-align: center;">平台支付</div> |  | ||||||
|  |  | ||||||
|         <div > | <nz-card nzTitle="基本信息" #distannce1> | ||||||
|           <!-- <p><label class="freigth-label">{{i?.platformPaymentDetail?.costName}}:</label><span>{{ i?.platformPaymentDetail?.price| currency: '¥' }}</span></p> --> |   <sv-container col="1"> | ||||||
|           <div *ngFor="let item of i?.platformPaymentDetail"> |     <sv label="货物名称"> | ||||||
|             <p><label class="freigth-label">{{item?.costName}}:</label><span>{{ item?.price| currency: '¥' }}</span></p> |       {{i?.goodsInfos?.[0]?.goodsName}} | ||||||
|  |     </sv> | ||||||
|  | </sv-container> | ||||||
|  | <sv-container col="2"> | ||||||
|  |     <sv label="货物数量"> | ||||||
|  |       {{i?.goodsInfos?.[0]?.weight}}吨,{{i?.goodsInfos?.[0]?.volume}}方,{{i?.goodsInfos?.[0]?.number}}件 | ||||||
|  |     </sv> | ||||||
|  |     <sv label="用车需求"> | ||||||
|  |       {{i?.goodsInfos?.[0]?.maxWeightLabel}}/{{i?.goodsInfos?.[0]?.maxCube}} | ||||||
|  |     </sv> | ||||||
|  |     <sv label="承运司机"> | ||||||
|  |       {{i?.driver?.name}}/{{i?.driver?.phone}} | ||||||
|  |     </sv> | ||||||
|  |     <sv label="车型车长载重"> | ||||||
|  |       {{i?.goodsInfos?.[0]?.weight}}吨,{{i?.goodsInfos?.[0]?.volume}}方,{{i?.goodsInfos?.[0]?.number}}件 | ||||||
|  |     </sv> | ||||||
|  |     <sv label="计划装货时间"> | ||||||
|  |       {{i?.loadPlanTime}} | ||||||
|  |     </sv> | ||||||
|  |     <sv label="计划卸货时间"> | ||||||
|  |       {{i?.unloadPlanTime}} | ||||||
|  |     </sv> | ||||||
|  |     <sv label="接单数量"> | ||||||
|  |       {{i?.acceptWeight}}吨,{{i?.acceptVolume}}方,{{i?.acceptNumber}}件 | ||||||
|  |     </sv> | ||||||
|  |     <sv label="装货数量"> | ||||||
|  |       {{i?.acceptWeight}}吨,{{i?.acceptVolume}}方,{{i?.acceptNumber}}件 | ||||||
|  |     </sv> | ||||||
|  |     <sv label="卸货数量"> | ||||||
|  |       {{i?.settlementWeight}}吨,{{i?.settlementVolume}}方,{{i?.acceptNumber}}件 | ||||||
|  |     </sv> | ||||||
|  | </sv-container> | ||||||
|  | <div class="mt-md"> | ||||||
|  |   <h4 class="text-md">装货卸货信息 | ||||||
|  |     <span class="ml-sm text-sm">( | ||||||
|  |       <label>{{i?.loadingCount || '一'}}装</label> | ||||||
|  |       <label>{{i?.unloadingCount || '一'}}卸</label> | ||||||
|  |       ) | ||||||
|  |     </span> | ||||||
|  |   </h4> | ||||||
|  |   <div nz-row [nzGutter]="24"> | ||||||
|  |     <div nz-col [nzSpan]="12"> | ||||||
|  |       <div class="handling-info p-md"> | ||||||
|  |         <div class="flex" *ngFor="let item of i?.loadingPlace"> | ||||||
|  |           <div *ngIf="item.type === '1'" class="loading-row"> | ||||||
|  |             <div class="handling-info-icon loading-bg">装</div> | ||||||
|  |             <div class="info"> | ||||||
|  |               <h4>装货地:{{item?.province}}{{item.city}}{{item.area}}{{item.detailedAddress}}</h4> | ||||||
|  |               <p>联系人:{{item.appUserName}}/{{item.contractTelephone}}</p> | ||||||
|  |             </div> | ||||||
|           </div> |           </div> | ||||||
|         </div> |         </div> | ||||||
|       </div> |       </div> | ||||||
|     </div> |     </div> | ||||||
|     <div nz-col [nzSpan]='12'> |     <div nz-col [nzSpan]="12"> | ||||||
|       <div style="position: relative;"> |       <div class="handling-info p-md"> | ||||||
|         <div style="height: 24px; width: 90px; background-color: #68758e;color: #fff;text-align: center;">货主支付</div> |         <div class="flex" *ngFor="let item of i?.loadingPlace"> | ||||||
|         <div *ngFor="let item of i?.ownerPaymentDetail?.freightDetail"> |           <div *ngIf="item.type === '2'" class="loading-row"> | ||||||
|           <p><label class="freigth-label">{{item?.costName}}:</label><span>{{ item?.price| currency: '¥' }}</span></p> |             <div class="handling-info-icon unloaing-bg">卸</div> | ||||||
|  |             <div class="info"> | ||||||
|  |               <h4>卸货地:{{item?.province}}{{item.city}}{{item.area}}{{item.detailedAddress}}</h4> | ||||||
|  |               <p>联系人:{{item.appUserName}}/{{item.contractTelephone}}</p> | ||||||
|  |             </div> | ||||||
|  |           </div> | ||||||
|         </div> |         </div> | ||||||
|       </div> |       </div> | ||||||
|     </div> |     </div> | ||||||
|   </div> |   </div> | ||||||
|   <nz-divider></nz-divider> | </div> | ||||||
|  | </nz-card> | ||||||
|  | <nz-card nzTitle="运费信息" #distannce3> | ||||||
|  |   <st #st [data]="i?.billExpenseDetailVOList" [columns]="logColumns" [ps]="0" [page]="{ show: false, showSize: false }"> | ||||||
|  |   </st> | ||||||
|  |   <div> | ||||||
|  |     总计:<span style="color: #da001b; font-size: 18px">{{ i?.freight | currency: '¥' }}</span> | ||||||
|  |   </div> | ||||||
|  |   <div>收款人:{{ i?.payee?.name }}/{{ i?.payee?.phone }}</div> | ||||||
|  | </nz-card> | ||||||
|  |  | ||||||
|  | <nz-card nzTitle="附件信息" #distannce4> | ||||||
|  |   <sv-container> | ||||||
|  |     <sv label="协议附件"> | ||||||
|  |       <!-- {{i?.supplementaryInformationVO?.stateReceipt?'是':'否'}} --> | ||||||
|  |       <a href="javascript:;" (click)="agreement('1')">查看附件</a>      | ||||||
|  |       <a href="javascript:;" (click)="agreement('2')">补充协议</a> | ||||||
|  |     </sv> | ||||||
|  |   </sv-container> | ||||||
|  |   <sv-container col="2" class="mt-md"> | ||||||
|  |     <sv label="装货凭证"> | ||||||
|  |       <app-imagelist [imgList]="[i?.loadingLadingBillFilePath,i?.loadingPeopleVehiclesGoodsFilePath]"> | ||||||
|  |       </app-imagelist> | ||||||
|  |     </sv> | ||||||
|  |     <sv label="卸货凭证"> | ||||||
|  |       <app-imagelist [imgList]="[i?.unloadingLadingBillFilePath,i?.unloadingPeopleVehiclesGoodsFilePath]"> | ||||||
|  |       </app-imagelist> | ||||||
|  |     </sv> | ||||||
|  |   </sv-container> | ||||||
|  | </nz-card> | ||||||
|  | <nz-card nzTitle="补充信息"> | ||||||
|  |   <sv-container> | ||||||
|  |     <sv label="是否回单"> | ||||||
|  |       {{i?.goodsResource?.stateReceipt ?'是':'否'}} | ||||||
|  |     </sv> | ||||||
|  |     <sv label="回单类型"> | ||||||
|  |       {{i?.goodsResource?.receiptTypeLabel}} | ||||||
|  |     </sv> | ||||||
|  |     <sv label="联系人"> | ||||||
|  |       {{i?.goodsResource?.receiptUserId}} / {{i?.supplementaryInformationVO?.phon}} | ||||||
|  |     </sv> | ||||||
|  |     <sv label="所在地区"> | ||||||
|  |       {{i?.goodsResource?.receiptAddress}} | ||||||
|  |     </sv> | ||||||
|  |     <sv label="详细地址"> | ||||||
|  |       {{i?.goodsResource?.receiptAddress}} | ||||||
|  |     </sv> | ||||||
|  |    | ||||||
|  |   </sv-container> | ||||||
|  |   <sv-container col="1" class="mt-md"> | ||||||
|  |     <sv label="回单凭证"> | ||||||
|  |       <app-imagelist [imgList]="[i?.receiptFilePath]"></app-imagelist> | ||||||
|  |     </sv> | ||||||
|  |     <sv label="备注"> | ||||||
|  |       {{i?.goodsResource?.remarks}} | ||||||
|  |     </sv> | ||||||
|  |   </sv-container> | ||||||
|  | </nz-card> | ||||||
|  |  | ||||||
|  | <nz-card> | ||||||
|   <div nz-row> |   <div nz-row> | ||||||
|     <nz-card nzTitle="轨迹信息" style="width: 100%;" > |     <nz-card nzTitle="轨迹信息" style="width: 100%;" #distannce5> | ||||||
|       <div nz-row >  |       <div nz-row >  | ||||||
|         <div nz-col [nzSpan]='12'> |         <div nz-col [nzSpan]='12'> | ||||||
|     <st #st [data]="i?.auditRecordList" [columns]="logColumns" [ps]="0" [page]="{ show: false, showSize: false }"> |     <!-- <st #st [data]="i?.auditRecordList" [columns]="logColumns" [ps]="0" [page]="{ show: false, showSize: false }"> | ||||||
|     </st> |     </st> --> | ||||||
|   </div> |   </div> | ||||||
|   <div nz-col [nzSpan]='12'> |   <div nz-col [nzSpan]='12'> | ||||||
|      <amap-path-simplifier></amap-path-simplifier> |      <amap-path-simplifier></amap-path-simplifier> | ||||||
| @ -149,6 +208,7 @@ | |||||||
|     </nz-card> |     </nz-card> | ||||||
|   </div> |   </div> | ||||||
| </nz-card> | </nz-card> | ||||||
|  |  | ||||||
| <nz-modal [(nzVisible)]="isVisible"   [nzFooter]="nzModalFooter" nzTitle="附件信息" (nzOnOk)="handleOK()" (nzOnCancel)="handleCancel()"> | <nz-modal [(nzVisible)]="isVisible"   [nzFooter]="nzModalFooter" nzTitle="附件信息" (nzOnOk)="handleOK()" (nzOnCancel)="handleCancel()"> | ||||||
|   <ng-container *nzModalContent> |   <ng-container *nzModalContent> | ||||||
|     <app-imagelist [imgList]="imges"></app-imagelist> |     <app-imagelist [imgList]="imges"></app-imagelist> | ||||||
|  | |||||||
| @ -33,4 +33,38 @@ | |||||||
|     .leftPadding { |     .leftPadding { | ||||||
|         padding-right: 100px; |         padding-right: 100px; | ||||||
|     } |     } | ||||||
|  |     .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; | ||||||
|  |         } | ||||||
|  |       } | ||||||
| } | } | ||||||
| @ -1,7 +1,7 @@ | |||||||
| /* | /* | ||||||
|  * @Author: your name |  * @Author: your name | ||||||
|  * @Date: 2021-12-03 15:31:52 |  * @Date: 2021-12-03 15:31:52 | ||||||
|  * @LastEditTime: 2021-12-27 15:38:04 |  * @LastEditTime: 2021-12-28 17:10:12 | ||||||
|  * @LastEditors: Please set LastEditors |  * @LastEditors: Please set LastEditors | ||||||
|  * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE |  * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE | ||||||
|  * @FilePath: \tms-obc-web\src\app\routes\order-management\components\vehicle-detail\vehicle-detail.component.ts |  * @FilePath: \tms-obc-web\src\app\routes\order-management\components\vehicle-detail\vehicle-detail.component.ts | ||||||
| @ -10,6 +10,7 @@ import { Component, OnInit } from '@angular/core'; | |||||||
| import { ActivatedRoute } from '@angular/router'; | import { ActivatedRoute } from '@angular/router'; | ||||||
| import { STColumn } from '@delon/abc/st'; | import { STColumn } from '@delon/abc/st'; | ||||||
| import { _HttpClient } from '@delon/theme'; | import { _HttpClient } from '@delon/theme'; | ||||||
|  | import { NzCardComponent } from 'ng-zorro-antd/card'; | ||||||
| import { NzMessageService } from 'ng-zorro-antd/message'; | import { NzMessageService } from 'ng-zorro-antd/message'; | ||||||
| import { NzModalService } from 'ng-zorro-antd/modal'; | import { NzModalService } from 'ng-zorro-antd/modal'; | ||||||
| import { WaybillManagementServe } from '../../services/waybill-management.service'; | import { WaybillManagementServe } from '../../services/waybill-management.service'; | ||||||
| @ -21,13 +22,29 @@ import { WaybillManagementServe } from '../../services/waybill-management.servic | |||||||
| export class WaybillManagementVehicleDetailComponent implements OnInit { | export class WaybillManagementVehicleDetailComponent implements OnInit { | ||||||
|  |  | ||||||
|   id = this.route.snapshot.params.id; |   id = this.route.snapshot.params.id; | ||||||
|   isVisible = false; |  | ||||||
|   i: any; |   i: any; | ||||||
|   imges: any; |   totalObj: any; | ||||||
|  |   attObj: any; | ||||||
|  |   isVisible = false; | ||||||
|   logColumns: STColumn[] = [ |   logColumns: STColumn[] = [ | ||||||
|     { title: '时间', index: 'operationUserPhone' }, |     { title: '款项', index: 'costName' }, | ||||||
|     { title: '地点', index: ' createTime' }, |     { title: '运输费(元)', index: 'price' }, | ||||||
|  |     { title: '支付时间', index: ' paymentTime' }, | ||||||
|  |     { | ||||||
|  |       title: '支付状态', | ||||||
|  |       className: 'text-center', | ||||||
|  |       index: 'paymentStatus', | ||||||
|  |       type: 'badge', | ||||||
|  |       width: '120px', | ||||||
|  |       badge: { | ||||||
|  |         '1': { text: '待申请', color: 'warning' }, | ||||||
|  |         '2': { text: '已支付', color: 'success' }, | ||||||
|  |         '3': { text: '已拒绝', color: 'warning' }, | ||||||
|  |         '4': { text: '申请中', color: 'warning' }, | ||||||
|  |       }, | ||||||
|  |     }, | ||||||
|   ]; |   ]; | ||||||
|  |   imges: any; | ||||||
|   unLoadingPlaceVOList: any = []; |   unLoadingPlaceVOList: any = []; | ||||||
|  |  | ||||||
|   constructor( |   constructor( | ||||||
| @ -41,6 +58,7 @@ export class WaybillManagementVehicleDetailComponent implements OnInit { | |||||||
|  |  | ||||||
|   ngOnInit(): void { |   ngOnInit(): void { | ||||||
|     this.initData() |     this.initData() | ||||||
|  |     | ||||||
|   } |   } | ||||||
|   initData() { |   initData() { | ||||||
|     const params = { |     const params = { | ||||||
| @ -48,12 +66,12 @@ export class WaybillManagementVehicleDetailComponent implements OnInit { | |||||||
|     } |     } | ||||||
|     this.service.request(this.service.$api_get_getWholeDetail, params).subscribe((res) => { |     this.service.request(this.service.$api_get_getWholeDetail, params).subscribe((res) => { | ||||||
|       console.log(res) |       console.log(res) | ||||||
|       if(res) { |       this.unLoadingPlaceVOList.push(...res.loadingPlace) | ||||||
|         this.unLoadingPlaceVOList.push(...res.loadingPlace) |       this.unLoadingPlaceVOList.push(...res.dischargePlace) | ||||||
|         this.unLoadingPlaceVOList.push(...res?.dischargePlace) |       console.log(this.unLoadingPlaceVOList) | ||||||
|         console.log(this.unLoadingPlaceVOList) |       this.i = res; | ||||||
|         this.i = res; |       this.attObj = this.i?.billExpenseDetailVOList?.filter((data: any) => data.expenseCode === 'ATT')[0]; | ||||||
|       } |       this.totalObj = this.i?.billExpenseDetailVOList?.filter((data: any) => data.expenseCode === 'TOTAL')[0]; | ||||||
|     }) |     }) | ||||||
|   } |   } | ||||||
|  |  | ||||||
| @ -69,24 +87,29 @@ export class WaybillManagementVehicleDetailComponent implements OnInit { | |||||||
|   goBack() { |   goBack() { | ||||||
|     window.history.go(-1); |     window.history.go(-1); | ||||||
|   } |   } | ||||||
| handleCancel() { |   agreement(value: any) { | ||||||
|  |     console.log('123') | ||||||
|  |     console.log(value) | ||||||
|  |     if(value === '1') { | ||||||
|  |       this.imges = this.i?.supplementAgreement | ||||||
|  |     } else if (value === '2') { | ||||||
|  |       this.imges = this.i?.loadingCertificate | ||||||
|  |     } else if (value === '3') { | ||||||
|  |       this.imges = this.i?.unLoadingCertificate | ||||||
|  |     } else if (value === '4') { | ||||||
|  |       this.imges = this.i?.receiptCertificate | ||||||
|  |     } | ||||||
|  |     this.isVisible = true; | ||||||
|  |   } | ||||||
|  |   handleCancel() { | ||||||
|     this.isVisible = false |     this.isVisible = false | ||||||
| } | } | ||||||
| handleOK() { | handleOK() { | ||||||
|   this.isVisible = false |   this.isVisible = false | ||||||
| } | } | ||||||
| agreement(value: any) { | goDistance(elf: NzCardComponent) { | ||||||
|   console.log('123') |   if (elf) { | ||||||
|   console.log(value) |     elf['elementRef'].nativeElement.scrollIntoView({ behavior: 'smooth', block: 'start', inline: 'start' }); | ||||||
|   if(value === '1') { |  | ||||||
|     this.imges = this.i?.supplementAgreement |  | ||||||
|   } else if (value === '2') { |  | ||||||
|     this.imges = this.i?.loadingCertificate |  | ||||||
|   } else if (value === '3') { |  | ||||||
|     this.imges = this.i?.unLoadingCertificate |  | ||||||
|   } else if (value === '4') { |  | ||||||
|     this.imges = this.i?.receiptCertificate |  | ||||||
|   } |   } | ||||||
|   this.isVisible = true; |  | ||||||
| } | } | ||||||
| } | } | ||||||
|  | |||||||
		Reference in New Issue
	
	Block a user