Files
bbq/src/app/routes/order-management/components/vehicle/vehicle.component.html
wangshiming 1fa11a5b3f 车辆对接
2022-01-12 18:30:16 +08:00

234 lines
9.0 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!--
* @Author: your name
* @Date: 2021-12-03 11:10:14
* @LastEditTime: 2022-01-12 18:29:04
* @LastEditors: Please set LastEditors
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
* @FilePath: \tms-obc-web\src\app\routes\supply-management\components\vehicle\vehicle.component.html
-->
<!-- 搜索表单 -->
<page-header-wrapper [title]="''">
</page-header-wrapper>
<nz-card>
<div nz-row nzGutter="8">
<!-- 查询字段小于或等于3个时不显示伸缩按钮 -->
<div nz-col nzSpan="24" *ngIf="queryFieldCount <= 4">
<sf #sf [schema]="schema" [ui]="ui" [mode]="'search'" [disabled]="!sf?.valid" [loading]="service.http.loading"
(formSubmit)="st?.load(1)" (formReset)="resetSF()"></sf>
</div>
<!-- 查询字段大于3个时根据展开状态调整布局 -->
<ng-container *ngIf="queryFieldCount > 4">
<div nz-col [nzSpan]="_$expand ? 24 : 18">
<sf #sf [schema]="schema" [ui]="ui" [compact]="true" [button]="'none'"></sf>
</div>
<div nz-col [nzSpan]="_$expand ? 24 : 6" class="text-right">
<button nz-button nzType="primary" [nzLoading]="service.http.loading"
(click)="st?.load(1)">查询</button>
<button nz-button nzType="primary" [disabled]="service.http.loading"
>导出</button>
<button nz-button [disabled]="service.http.loading" (click)="resetSF()">重置</button>
<button nz-button nzType="link" (click)="expandToggle()">
{{ !_$expand ? '展开' : '收起' }}
<i nz-icon [nzType]="!_$expand ? 'down' : 'up'"></i>
</button>
</div>
</ng-container>
</div>
</nz-card>
<nz-card>
<nz-tabset (nzSelectedIndexChange)="selectChange($event)"
[nzTabBarExtraContent]="extraTemplate">
<nz-tab [nzTitle]="'全部'"></nz-tab>
<nz-tab [nzTitle]="'待发车('+tabs?.stayQuantity+')'"></nz-tab>
<nz-tab [nzTitle]="'运输中('+tabs?.receivedQuantity+')'"></nz-tab>
<nz-tab [nzTitle]="'待签收('+tabs?.signQuantity+')'"></nz-tab>
<nz-tab [nzTitle]="'已完成('+tabs?.compolatelQuantity+')'"></nz-tab>
<nz-tab [nzTitle]="'已取消('+tabs?.cancelQuantity+')'"></nz-tab>
</nz-tabset>
<div style="margin-top: 15px;">
<st
#st
[bordered]="true"
[scroll]="{ x: '2000px' }"
[data]="service.$api_get_listWholePage"
[columns]="columns"
[req]="{ method: 'POST', allInBody: true, reName: { pi: 'pageIndex', ps: 'pageSize' }, params: reqParams }"
[res]="{ reName: { list: 'data.records', total: 'data.total' } }"
[page]="{ show: true, showSize: true, pageSizes: [10, 20, 30, 50, 100, 200, 300, 500, 1000] }"
>
<ng-template st-row="billCode" let-item let-index="index">
<a [routerLink]="'/order-management/vehicle-detail/'+item.id">{{item.billCode}}</a>
<div>
<span>{{item?.billStatusLabel}}</span>
</div>
</ng-template>
<ng-template st-row="goodsName" let-item let-index="index">
<div>{{item?.goodsName}}</div>
<div>
<span>{{item?.weight ? item?.weight + '吨/' : '' }}</span>
<span>{{item?.volume ? item?.volume + '方/' : '' }}</span>
<span>{{item?.goodsNumber ? item?.goodsNumber + '吨' : '' }}</span>
</div>
</ng-template>
<!-- 我的出价 -->
<ng-template st-row="mybidInfo" let-item let-index="index" class="temp_p">
<div *ngIf="item.mybidInfo?.length > 0">
<p *ngFor="let data of item?.mybidInfo"> {{ data?.expenseName }}:¥{{ data?.price | number:'0.2-2' }} </p>
</div>
</ng-template>
<ng-template st-row="mybidDetailInfo" let-item let-index="index">
<div *ngIf="item.mybidDetailInfo?.length > 0">
<p *ngFor="let data of item.mybidDetailInfo">
{{ data.expenseName }}{{ data.price }}
<span style="color: #f59a63">{{ data.paymentStatusLabel }}</span>
</p>
</div>
</ng-template>
<ng-template st-row="billExpenseDetailVOList" let-item let-index="index">
<div *ngFor="let i of item?.billExpenseDetailVOList; let ii = index">
<span >{{i?.costName}}{{i?.price}}</span>
</div>
</ng-template>
<ng-template st-row="driverName" let-item let-index="index">
<div>
{{item?.driverName}}
</div>
<div>
{{item?.driverPhone}}
</div>
</ng-template>
<ng-template st-row="payeeName" let-item let-index="index">
<div>
{{item?.payeeName}}
</div>
<div>
{{item?.payeePhone}}
</div>
</ng-template>
<ng-template st-row="loadingTime" let-item let-index="index">
<div *ngIf="item?.loadingTime">装 | {{item?.loadingTime}}</div>
<div *ngIf="item?.unloadingTime">卸 | {{item?.unloadingTime}}</div>
</ng-template>
<!-- <ng-template st-row="externalSn" let-item let-index="index">
<span class="mr-xs">{{111111}}</span>
<a (click)="editEnternalSn(item)">编辑</a>
</ng-template> -->
<!-- <ng-template st-row="feiong" let-item let-index="index">
<div style="color: aqua;" (click)="OpenPrice()">
{{item.no}}
</div>
</ng-template> -->
<!-- <ng-template #contentTemplate>
<div>
<p>预付¥200.00</p>
<p>到付¥200.00</p>
<p>油卡¥200.00</p>
<p>回单付¥200.00</p>
<p>小计¥200.00</p>
<p>附加费¥200.00</p>
</div>
</ng-template> -->
</st>
</div>
</nz-card>
<nz-modal [(nzVisible)]="isVisible" [nzWidth]="600" [nzFooter]="nzModalFooter" nzTitle="运费变更记录" (nzOnOk)="handleOK()" (nzOnCancel)="handleCancel('0')">
<ng-container *nzModalContent>
<st
#stFloat
multiSort
size="small"
[bordered]="true"
[data]="service.$api_get_listChangeApply"
[columns]="columnsFloat"
[req]="{ method: 'POST', allInBody: true, reName: { pi: 'pageIndex', ps: 'pageSize' }, params: changeParams }"
[res]="{ reName: { list: 'data', total: 'data.total' } }"
>
<ng-template st-row="order" let-item let-index="index">
{{ index + 1 }}
</ng-template>
</st>
</ng-container>
<ng-template #nzModalFooter>
<button nz-button nzType="primary" (click)="handleCancel('0')">取消</button>
<button nz-button nzType="default" (click)="handleCancel('0')">确定</button>
</ng-template>
</nz-modal>
<nz-modal [(nzVisible)]="isVisibleView" [nzWidth]="600" [nzFooter]="nzModalFooterview" nzTitle="查看" (nzOnOk)="handleOK()" (nzOnCancel)="handleCancel('1')">
<ng-container *nzModalContent>
<st
#stFloatView
multiSort
size="small"
[bordered]="true"
[data]="service.$api_getChangeRecordWholeDetail"
[columns]="columnsFloatView"
[req]="{ method: 'POST', allInBody: true, params: changeViewParams }"
[res]="{ reName: { list: 'data.list', total: 'data.total' } }"
>
</st>
<div><span>变更原因:{{ViewCause?.changeCause}}</span></div>
<div><span>拒绝原因:{{ViewCause?.refuseCause}}</span></div>
<div><span>注:附加费依据调整后的运输费用重新计算</span></div>
</ng-container>
<ng-template #nzModalFooterview>
<button nz-button nzType="default" (click)="handleCancel('1')">取消</button>
<button nz-button nzType="primary" (click)="handleCancel('1')">确定</button>
</ng-template>
</nz-modal>
<nz-modal [(nzVisible)]="isVisibleEvaluate" [nzWidth]="600" [nzFooter]="nzModalFooterEvaluate" (nzOnOk)="handleOK()" (nzOnCancel)="handleCancel('2')">
<ng-container *nzModalContent>
<nz-tabset>
<nz-tab nzTitle="我的评价">
<div>
评分: <nz-rate [ngModel]="2.5" nzAllowHalf></nz-rate>
<div><span>评价内容:</span></div>
</div>
</nz-tab>
<nz-tab nzTitle="司机评价">
<div>
暂无评价内容
</div>
</nz-tab>
</nz-tabset>
</ng-container>
<ng-template #nzModalFooterEvaluate>
<button nz-button nzType="default" (click)="handleCancel('2')">取消</button>
<button nz-button nzType="primary" (click)="handleOK()">确定</button>
</ng-template>
</nz-modal>
<ng-template #extraTemplate>
<div>
<button nz-button nzType="primary"(click)="modifyRate()">
修改附加费率
</button>
<button nz-button nzType="primary"(click)="modifyFreightPeople()">
修改网络货运人
</button>
<button nz-button nzType="primary"(click)="modifycaptain()">
修改车队长
</button>
<button nz-button nzType="primary" nzGhost nz-popconfirm
[nzPopconfirmTitle]="enable" (nzOnConfirm)="userAction()" nzPopconfirmPlacement="bottomRight">
批量签收
</button>
</div>
</ng-template>
<ng-template #enable>
<div class="ant-popover-message">
<i nz-icon nzType="info-circle" nzTheme="fill"></i>
<div class="ant-popover-message-title ng-star-inserted self-ant-popover-title" style="font-size: 16px">已选择{{selectedRows?.length || 0}}条订单,确认批量签收吗?
</div>
<div class="ant-popover-message-title ng-star-inserted">
签收后不可再修改运费,请确保运费等信息准确无误后,再进行签收。
</div>
</div>
</ng-template>