Rainie/bbq
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

UI优化

Browse Source
This commit is contained in:
潘晓云
2022-04-29 14:18:46 +08:00
parent f83ab482a8
commit b213aa4f91
7 changed files with 283 additions and 219 deletions
Download Patch File Download Diff File Expand all files Collapse all files

112
src/app/routes/order-management/components/bulk-detail/bulk-detail.component.html
View File

@ -219,57 +219,71 @@
<div *ngIf=" i?.payeeId !== i?.driverId" class="mt-xs">车队长：{{ i?.payeeName }}/{{ i?.payeePhone }}/{{ i?.payeeIdNo }} <div *ngIf=" i?.payeeId !== i?.driverId" class="mt-xs">车队长：{{ i?.payeeName }}/{{ i?.payeePhone }}/{{ i?.payeeIdNo }}
</div> </div>
</nz-card> </nz-card>
<div nz-row>
<nz-card [nzBorderless]="true" class="mb0" #distannce4> <div nzSpan="12" nz-col>
<div class="font-weight-blod text-md detail-title"> <nz-card [nzBorderless]="true" class="mb0 attch-card" #distannce4>
<a class="sign"></a> <div class="font-weight-blod text-md detail-title">
<span>附件信息</span> <a class="sign"></a>
<span>附件信息</span>
</div>
<div class="attachment-info">
<sv-container col="1">
<sv label="协议附件">
<a *ngIf="i?.contractContent?.contractContent" (click)="agreement('1')">查看附件</a> &nbsp;&nbsp;&nbsp;&nbsp;
<a *ngIf="i?.supplementContent?.contractContent" (click)="agreement('2')">补充协议</a>
</sv>
</sv-container>
<sv-container col="2" class="mt-md" layout="vertical">
<sv label="装货凭证">
<app-imagelist *ngIf="i?.loadingLadingBillFilePath || i?.loadingPeopleVehiclesGoodsFilePath"
[imgList]="[i?.loadingLadingBillFilePath, i?.loadingPeopleVehiclesGoodsFilePath]"
[style]="'width:120px;height:120px;'"> </app-imagelist>
</sv>
<sv label="卸货凭证">
<app-imagelist *ngIf="i?.unloadingLadingBillFilePath || i?.unloadingPeopleVehiclesGoodsFilePath "
[imgList]="[i?.unloadingLadingBillFilePath, i?.unloadingPeopleVehiclesGoodsFilePath]"
[style]="'width:120px;height:120px;'"> </app-imagelist>
</sv>
</sv-container>
</div>
</nz-card>
</div> </div>
<sv-container> <div nzSpan="12" nz-col>
<sv label="协议附件"> <nz-card [nzBorderless]="true" class="mb0 attch-card">
<a *ngIf="i?.contractContent?.contractContent" (click)="agreement('1')">查看附件</a> &nbsp;&nbsp;&nbsp;&nbsp; <div class="font-weight-blod text-md detail-title">
<a *ngIf="i?.supplementContent?.contractContent" (click)="agreement('2')">补充协议</a> <a class="sign"></a>
</sv> <span>补充信息</span>
</sv-container> </div>
<sv-container col="2" class="mt-md"> <div class="attachment-info">
<sv label="装货凭证"> <sv-container col="1">
<app-imagelist *ngIf="i?.loadingLadingBillFilePath || i?.loadingPeopleVehiclesGoodsFilePath" <sv label="是否回单">
[imgList]="[i?.loadingLadingBillFilePath, i?.loadingPeopleVehiclesGoodsFilePath]"> </app-imagelist> {{ i?.supplementaryInformationVO?.stateReceipt ? '是' : '否' }}
</sv> </sv>
<sv label="卸货凭证"> <sv label="回单类型" *ngIf="i?.supplementaryInformationVO?.stateReceipt">
<app-imagelist *ngIf="i?.unloadingLadingBillFilePath || i?.unloadingPeopleVehiclesGoodsFilePath " {{ i?.supplementaryInformationVO?.receiptType === '1' ? '电子回单' : '纸质回单' }}
[imgList]="[i?.unloadingLadingBillFilePath, i?.unloadingPeopleVehiclesGoodsFilePath]"> </app-imagelist> </sv>
</sv> <ng-container
</sv-container> *ngIf="i?.supplementaryInformationVO?.stateReceipt && i?.supplementaryInformationVO?.receiptType==='2'">
</nz-card> <sv label="联系人" *ngIf="i?.supplementaryInformationVO?.stateReceipt"> {{
<nz-card [nzBorderless]="true" class="mb0"> i?.supplementaryInformationVO?.receiptUserName }} / {{ i?.supplementaryInformationVO?.phon }} </sv>
<div class="font-weight-blod text-md detail-title"> <sv label="所在地区" *ngIf="i?.supplementaryInformationVO?.stateReceipt">
<a class="sign"></a> {{ i?.supplementaryInformationVO?.area }}
<span>补充信息</span> </sv>
<sv label="详细地址" *ngIf="i?.supplementaryInformationVO?.stateReceipt">
{{ i?.supplementaryInformationVO?.address }}
</sv>
</ng-container>
<sv label="备注">
{{ i?.goodsResource?.remarks }}
</sv>
<sv col="1" label="回单凭证" *ngIf="i?.supplementaryInformationVO?.stateReceipt">
<app-imagelist [imgList]="i?.receiptFilePath" [style]="'width:120px;height:120px;'"></app-imagelist>
</sv>
</sv-container>
</div>
</nz-card>
</div> </div>
<sv-container> </div>
<sv label="是否回单">
{{ i?.supplementaryInformationVO?.stateReceipt ? '是' : '否' }}
</sv>
<sv label="回单类型" *ngIf="i?.supplementaryInformationVO?.stateReceipt">
{{ i?.supplementaryInformationVO?.receiptType === '1' ? '电子回单' : '纸质回单' }}
</sv>
<sv label="联系人" *ngIf="i?.supplementaryInformationVO?.stateReceipt"> {{
i?.supplementaryInformationVO?.receiptUserName }} / {{ i?.supplementaryInformationVO?.phon }} </sv>
<sv label="所在地区" *ngIf="i?.supplementaryInformationVO?.stateReceipt">
{{ i?.supplementaryInformationVO?.area }}
</sv>
<sv label="详细地址" *ngIf="i?.supplementaryInformationVO?.stateReceipt">
{{ i?.supplementaryInformationVO?.address }}
</sv>
<sv label="备注">
{{ i?.goodsResource?.remarks }}
</sv>
<sv col="1" label="回单凭证" *ngIf="i?.supplementaryInformationVO?.stateReceipt">
<app-imagelist [imgList]="i?.receiptFilePath"></app-imagelist>
</sv>
</sv-container>
</nz-card>
<nz-card #distannce5 [nzBorderless]="true" class="mb0"> <nz-card #distannce5 [nzBorderless]="true" class="mb0">
<p class="detail_title"><span>|</span> 轨迹信息</p> <p class="detail_title"><span>|</span> 轨迹信息</p>

116
src/app/routes/order-management/components/vehicle-detail/vehicle-detail.component.html
View File

@ -214,58 +214,74 @@
i?.payeePhone : '' }}/{{ i?.payeeIdNo }}</div> i?.payeePhone : '' }}/{{ i?.payeeIdNo }}</div>
</nz-card> </nz-card>
<nz-card [nzBorderless]="true" class="mb0" #distannce4> <div nz-row>
<div class="font-weight-blod text-md detail-title"> <div nzSpan="12" nz-col>
<a class="sign"></a> <nz-card [nzBorderless]="true" class="mb0 attch-card" #distannce4>
<span>附件信息</span> <div class="font-weight-blod text-md detail-title">
<a class="sign"></a>
<span>附件信息</span>
</div>
<div class="attachment-info">
<sv-container>
<sv label="协议附件" col="1">
<a *ngIf="i?.contractContent?.contractContent" (click)="agreement('1')">查看附件</a> &nbsp;&nbsp;&nbsp;&nbsp;
<a *ngIf="i?.supplementContent?.contractContent" (click)="agreement('2')">补充协议</a>
</sv>
</sv-container>
<sv-container col="2" class="mt-xs" layout="vertical">
<sv label="装货凭证">
<app-imagelist *ngIf="i?.loadingLadingBillFilePath|| i?.loadingPeopleVehiclesGoodsFilePath"
[imgList]="[i?.loadingLadingBillFilePath, i?.loadingPeopleVehiclesGoodsFilePath]"
[style]="'width:120px;height:120px;'">
</app-imagelist>
</sv>
<sv label="卸货凭证">
<app-imagelist *ngIf="i?.unloadingLadingBillFilePath || i?.unloadingPeopleVehiclesGoodsFilePath"
[imgList]="[i?.unloadingLadingBillFilePath, i?.unloadingPeopleVehiclesGoodsFilePath]"
[style]="'width:120px;height:120px;'">
</app-imagelist>
</sv>
</sv-container>
</div>
</nz-card>
</div> </div>
<sv-container> <div nzSpan="12" nz-col>
<sv label="协议附件"> <nz-card [nzBorderless]="true" class="mb0 attch-card">
<a *ngIf="i?.contractContent?.contractContent" (click)="agreement('1')">查看附件</a> &nbsp;&nbsp;&nbsp;&nbsp; <div class="font-weight-blod text-md detail-title">
<a *ngIf="i?.supplementContent?.contractContent" (click)="agreement('2')">补充协议</a> <a class="sign"></a>
</sv> <span>补充信息</span>
</sv-container> </div>
<sv-container col="2" class="mt-md"> <div class="attachment-info">
<sv label="装货凭证"> <sv-container col="1">
<app-imagelist [imgList]="[i?.loadingLadingBillFilePath, i?.loadingPeopleVehiclesGoodsFilePath]"> </app-imagelist> <sv label="是否回单">
</sv> {{ i?.supplementaryInformationVO?.stateReceipt ? '是' : '否' }}
<sv label="卸货凭证"> </sv>
<app-imagelist [imgList]="[i?.unloadingLadingBillFilePath, i?.unloadingPeopleVehiclesGoodsFilePath]"> <sv label="回单类型" *ngIf="i?.supplementaryInformationVO?.stateReceipt">
</app-imagelist> {{ i?.supplementaryInformationVO?.receiptType === '1' ? '电子回单' : '纸质回单' }}
</sv> </sv>
</sv-container> <ng-container
</nz-card> *ngIf="i?.supplementaryInformationVO?.stateReceipt && i?.supplementaryInformationVO?.receiptType==='2'">
<nz-card [nzBorderless]="true" class="mb0"> <sv label=" 联系人" *ngIf="i?.supplementaryInformationVO?.stateReceipt">
<div class="font-weight-blod text-md detail-title"> {{ i?.supplementaryInformationVO?.receiptUserName }} / {{ i?.supplementaryInformationVO?.phon }}
<a class="sign"></a> </sv>
<span>补充信息</span> <sv label="所在地区" *ngIf="i?.supplementaryInformationVO?.stateReceipt">
{{ i?.supplementaryInformationVO?.area }}
</sv>
<sv label="详细地址" *ngIf="i?.supplementaryInformationVO?.stateReceipt">
{{ i?.supplementaryInformationVO?.address }}
</sv>
</ng-container>
<sv label="备注">
{{ i?.goodsResource?.remarks }}
</sv>
<sv label="回单凭证" *ngIf="i?.supplementaryInformationVO?.stateReceipt">
<app-imagelist [imgList]="i?.receiptFilePath" [style]="'width:120px;height:120px;'"></app-imagelist>
</sv>
</sv-container>
</div>
</nz-card>
</div> </div>
<sv-container> </div>
<sv label="是否回单">
{{ i?.supplementaryInformationVO?.stateReceipt ? '是' : '否' }}
</sv>
<sv label="回单类型" *ngIf="i?.supplementaryInformationVO?.stateReceipt">
{{ i?.supplementaryInformationVO?.receiptType === '1' ? '电子回单' : '纸质回单' }}
</sv>
<sv label="联系人" *ngIf="i?.supplementaryInformationVO?.stateReceipt">
{{ i?.supplementaryInformationVO?.receiptUserName }} / {{ i?.supplementaryInformationVO?.phon }}
</sv>
<sv label="所在地区" *ngIf="i?.supplementaryInformationVO?.stateReceipt">
{{ i?.supplementaryInformationVO?.area }}
</sv>
<sv label="详细地址" *ngIf="i?.supplementaryInformationVO?.stateReceipt">
{{ i?.supplementaryInformationVO?.address }}
</sv>
</sv-container>
<sv-container col="1" class="mt-md">
<sv label="回单凭证" *ngIf="i?.supplementaryInformationVO?.stateReceipt">
<app-imagelist [imgList]="i?.receiptFilePath"></app-imagelist>
</sv>
<sv label="备注">
{{ i?.goodsResource?.remarks }}
</sv>
</sv-container>
</nz-card>
<nz-card [nzBorderless]="true" class="mb0" #distannce5> <nz-card [nzBorderless]="true" class="mb0" #distannce5>
<p class="detail_title"><span>|</span> 轨迹信息</p> <p class="detail_title"><span>|</span> 轨迹信息</p>

119
src/app/routes/waybill-management/components/bulk-detail/bulk-detail.component.html
View File

@ -6,6 +6,7 @@
* @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\\waybill-management\\components\\bulk-detail\\bulk-detail.component.html * @FilePath : \\tms-obc-web\\src\\app\\routes\\waybill-management\\components\\bulk-detail\\bulk-detail.component.html
--> -->
<page-header-wrapper [title]="'大宗运单详情'" [logo]="logo"> <page-header-wrapper [title]="'大宗运单详情'" [logo]="logo">
<ng-template #logo> <ng-template #logo>
<button nz-button nz-tooltip nzTooltipTitle="返回上一页" (click)="goBack()"> <button nz-button nz-tooltip nzTooltipTitle="返回上一页" (click)="goBack()">
@ -109,12 +110,10 @@
<a class="sign"></a> <a class="sign"></a>
<span>基本信息</span> <span>基本信息</span>
</div> </div>
<sv-container col="1"> <sv-container col="3">
<sv label="货物名称"> <sv label="货物名称">
{{i?.goodsInfos?.[0]?.goodsName}} {{i?.goodsInfos?.[0]?.goodsName}}
</sv> </sv>
</sv-container>
<sv-container col="2">
<sv label="货物数量"> <sv label="货物数量">
{{i?.goodsInfos?.[0]?.weight}}吨,{{i?.goodsInfos?.[0]?.volume}}方,{{i?.goodsInfos?.[0]?.number}}件 {{i?.goodsInfos?.[0]?.weight}}吨,{{i?.goodsInfos?.[0]?.volume}}方,{{i?.goodsInfos?.[0]?.number}}件
</sv> </sv>
@ -204,60 +203,70 @@
</div> </div>
<div *ngIf=" i?.payeeId !== i?.driverId" class="mt-xs">车队长：{{ i?.payeeName }}/{{ i?.payeePhone }}</div> <div *ngIf=" i?.payeeId !== i?.driverId" class="mt-xs">车队长：{{ i?.payeeName }}/{{ i?.payeePhone }}</div>
</nz-card> </nz-card>
<nz-card [nzBorderless]="true" class="mb0" #distannce4> <div nz-row>
<div class="font-weight-blod text-md detail-title"> <div nz-col nzSpan="12">
<a class="sign"></a> <nz-card [nzBorderless]="true" class="mb0 attch-card" #distannce4>
<span>附件信息</span> <div class="font-weight-blod text-md detail-title">
<a class="sign"></a>
<span>附件信息</span>
</div>
<div class="attachment-info">
<sv-container col="1">
<sv label="协议附件" col="1">
<a *ngIf="i?.contractContent?.contractContent" (click)="agreement('1')">查看附件</a> &nbsp;&nbsp;&nbsp;&nbsp;
<a *ngIf="i?.supplementContent?.contractContent" (click)="agreement('2')">补充协议</a>
</sv>
</sv-container>
<sv-container col="2" layout="vertical" class="mt-md">
<sv label="装货凭证">
<app-imagelist *ngIf="i?.loadingCertificate && i?.loadingCertificate.length >0"
[imgList]="i?.loadingCertificate" [style]="'width:120px;height:120px;'">
</app-imagelist>
</sv>
<sv label="卸货凭证">
<app-imagelist *ngIf="i?.unLoadingCertificate && i?.unLoadingCertificate.length >0"
[imgList]="i?.unLoadingCertificate" [style]="'width:120px;height:120px;'">
</app-imagelist>
</sv>
</sv-container>
</div>
</nz-card>
</div> </div>
<sv-container> <div nz-col nzSpan="12">
<sv label="协议附件"> <nz-card [nzBorderless]="true" class="mb0 attch-card">
<a *ngIf="i?.contractContent?.contractContent" (click)="agreement('1')">查看附件</a> &nbsp;&nbsp;&nbsp;&nbsp; <div class="font-weight-blod text-md detail-title">
<a *ngIf="i?.supplementContent?.contractContent" (click)="agreement('2')">补充协议</a> <a class="sign"></a>
</sv> <span>补充信息</span>
</sv-container> </div>
<sv-container col="2" class="mt-md"> <div class="attachment-info">
<sv label="装货凭证"> <sv-container col="1">
<app-imagelist [imgList]="i?.loadingCertificate"> <sv label="是否回单">
</app-imagelist> {{i?.receiptType == 1 ?'是':'否'}}
</sv> </sv>
<sv label="卸货凭证"> <sv label="回单类型" *ngIf="i?.receiptType == '1'">
<app-imagelist [imgList]="i?.unLoadingCertificate"> {{i?.receiptTypeLabel}}
</app-imagelist> </sv>
</sv>
</sv-container>
</nz-card>
<nz-card [nzBorderless]="true" class="mb0">
<div class="font-weight-blod text-md detail-title">
<a class="sign"></a>
<span>补充信息</span>
</div>
<sv-container>
<sv label="是否回单">
{{i?.receiptType == 1 ?'是':'否'}}
</sv>
<sv label="回单类型" *ngIf="i?.receiptType == 1">
{{i?.receiptTypeLabel}}
</sv>
<sv label="联系人" *ngIf="i?.receiptType == 1">
{{i?.receiptUser}} / {{i?.receiptUserPhone}}
</sv>
<sv label="所在地区" *ngIf="i?.receiptType == 1">
{{i?.receiptPlace}}
</sv>
<sv label="详细地址" *ngIf="i?.receiptType == 1">
{{i?.receiptAddress}}
</sv>
</sv-container> <sv label="联系人" *ngIf="i?.receiptType == '2'">
<sv-container col="1" class="mt-md"> {{i?.receiptUser}} / {{i?.receiptUserPhone}}
<sv label="回单凭证" *ngIf="i?.receiptType == 1"> </sv>
<app-imagelist [imgList]="[i?.receiptFilePath]"></app-imagelist> <sv label="所在地区" *ngIf="i?.receiptType == '2'">
</sv> {{i?.receiptPlace}}
<sv label="备注"> </sv>
{{i?.goodsResource?.remarks}} <sv label="详细地址" *ngIf="i?.receiptType == '2'">
</sv> {{i?.receiptAddress}}
</sv-container> </sv>
</nz-card> <sv label="备注">
{{i?.goodsResource?.remarks}}
</sv>
<sv col="1" label="回单凭证" *ngIf="i?.receiptType == '1'">
<app-imagelist [imgList]="[i?.receiptFilePath]" [style]="'width:120px;height:120px;'"></app-imagelist>
</sv>
</sv-container>
</div>
</nz-card>
</div>
</div>
<nz-card class="mb0" [nzBorderless]="true"> <nz-card class="mb0" [nzBorderless]="true">
<p class="detail_title" #distannce5><span>|</span> 轨迹信息</p> <p class="detail_title" #distannce5><span>|</span> 轨迹信息</p>

125
src/app/routes/waybill-management/components/vehicle-detail/vehicle-detail.component.html
View File

@ -129,12 +129,10 @@
<a class="sign"></a> <a class="sign"></a>
<span>基本信息</span> <span>基本信息</span>
</div> </div>
<sv-container col="1"> <sv-container col="3">
<sv label="货物名称"> <sv label="货物名称">
{{i?.goodsInfos?.[0]?.goodsName}} {{i?.goodsInfos?.[0]?.goodsName}}
</sv> </sv>
</sv-container>
<sv-container col="2">
<sv label="货物数量"> <sv label="货物数量">
{{i?.goodsInfos?.[0]?.weight}}吨,{{i?.goodsInfos?.[0]?.volume}}方,{{i?.goodsInfos?.[0]?.number}}件 {{i?.goodsInfos?.[0]?.weight}}吨,{{i?.goodsInfos?.[0]?.volume}}方,{{i?.goodsInfos?.[0]?.number}}件
</sv> </sv>
@ -179,10 +177,10 @@
<div class="font-weight-blod text-md detail-title"> <div class="font-weight-blod text-md detail-title">
<a class="sign"></a> <a class="sign"></a>
<span>运费信息</span> <span>运费信息</span>
<span>（到货后{{i?.paymentDays}}天内支付运费）</span> <span class="pl-sm text-warning">（到货后{{i?.paymentDays}}天内支付运费）</span>
</div> </div>
<st #st [data]="billExpenses" [columns]="logColumns" [ps]="0" [page]="{ show: false, showSize: false }"> <st #st [data]="billExpenses" [columns]="logColumns" [ps]="0" [page]="{ show: false, showSize: false }">
<ng-template st-row="price" let-item let-index="index"> <ng-template st-row="price" let-item let-index="index" [size]="'small'">
{{ item.price | currency }} {{ item.price | currency }}
</ng-template> </ng-template>
<ng-template st-row="prices" let-item let-index="index"> <ng-template st-row="prices" let-item let-index="index">
@ -200,62 +198,73 @@
<div *ngIf="i?.payee?.phone && i?.payee?.phone !== i?.driverVo.phone">车队长：{{ i?.payee?.name }}/{{ i?.payee?.phone <div *ngIf="i?.payee?.phone && i?.payee?.phone !== i?.driverVo.phone">车队长：{{ i?.payee?.name }}/{{ i?.payee?.phone
}}/{{ i?.payee?.idNo }}</div> }}/{{ i?.payee?.idNo }}</div>
</nz-card> </nz-card>
<div nz-row>
<div nz-col nzSpan="12">
<nz-card [nzBorderless]="true" class="mb0 attch-card" #distannce4>
<div class="font-weight-blod text-md detail-title">
<a class="sign"></a>
<span>附件信息</span>
</div>
<div class="attachment-info">
<sv-container>
<sv label="协议附件">
<a *ngIf="i?.contractContent?.contractContent" (click)="agreement('1')">查看附件</a> &nbsp;&nbsp;&nbsp;&nbsp;
<a *ngIf="i?.supplementContent?.contractContent" (click)="agreement('2')">补充协议</a>
</sv>
</sv-container>
<sv-container col="2" class="mt-md" layout="vertical">
<sv label="装货凭证">
<nz-card [nzBorderless]="true" class="mb0" nzTitle="附件信息" #distannce4> <app-imagelist *ngIf="i?.loadingCertificate && i?.loadingCertificate.length>0"
<div class="font-weight-blod text-md detail-title"> [imgList]="i?.loadingCertificate" [style]="'width:120px;height:120px;'">
<a class="sign"></a> </app-imagelist>
<span>附件信息</span> </sv>
<sv label="卸货凭证">
<app-imagelist *ngIf="i?.unLoadingCertificate && i?.unLoadingCertificate.length>0 "
[imgList]="i?.unLoadingCertificate" [style]="'width:120px;height:120px;'">
</app-imagelist>
</sv>
</sv-container>
</div>
</nz-card>
</div> </div>
<sv-container> <div nz-col nzSpan="12">
<sv label="协议附件"> <nz-card [nzBorderless]="true" class="mb0 attch-card">
<a *ngIf="i?.contractContent?.contractContent" (click)="agreement('1')">查看附件</a> &nbsp;&nbsp;&nbsp;&nbsp; <div class="font-weight-blod text-md detail-title">
<a *ngIf="i?.supplementContent?.contractContent" (click)="agreement('2')">补充协议</a> <a class="sign"></a>
</sv> <span>补充信息</span>
</sv-container> </div>
<sv-container col="2" class="mt-md"> <div class="attachment-info">
<sv label="装货凭证"> <sv-container col="1">
<app-imagelist *ngIf="i?.loadingCertificate" [imgList]="i?.loadingCertificate"> <sv label="是否回单">
</app-imagelist> {{ i?.supplementaryInformationVO?.stateReceipt ? '是' : '否' }}
</sv> </sv>
<sv label="卸货凭证"> <sv label="回单类型" *ngIf="i?.supplementaryInformationVO?.stateReceipt">
<app-imagelist *ngIf="i?.unLoadingCertificate" [imgList]="i?.unLoadingCertificate"> {{ i?.supplementaryInformationVO?.receiptType === '1' ? '电子回单' : '纸质回单' }}
</app-imagelist> </sv>
</sv> <ng-container
</sv-container> *ngIf="i?.supplementaryInformationVO?.stateReceipt && i?.supplementaryInformationVO?.receiptType === '2'">
</nz-card> <sv label="联系人" *ngIf="i?.supplementaryInformationVO?.stateReceipt"> {{
<nz-card [nzBorderless]="true" class="mb0"> i?.supplementaryInformationVO?.receiptUserName }} / {{ i?.supplementaryInformationVO?.phon }} </sv>
<div class="font-weight-blod text-md detail-title"> <sv label="所在地区" *ngIf="i?.supplementaryInformationVO?.stateReceipt">
<a class="sign"></a> {{ i?.supplementaryInformationVO?.area }}
<span>补充信息</span> </sv>
<sv label="详细地址" *ngIf="i?.supplementaryInformationVO?.stateReceipt">
{{ i?.supplementaryInformationVO?.address }}
</sv>
</ng-container>
<sv label="备注">
{{ i?.supplementaryInformationVO?.remarks }}
</sv>
<sv col="1" label="回单凭证" *ngIf="i?.supplementaryInformationVO?.stateReceipt">
<app-imagelist [imgList]="i?.receiptFilePath" [style]="'width:120px;height:120px;'"></app-imagelist>
</sv>
</sv-container>
</div>
</nz-card>
</div> </div>
<sv-container> </div>
<sv label="是否回单">
{{ i?.supplementaryInformationVO?.stateReceipt ? '是' : '否' }}
</sv>
<sv label="回单类型" *ngIf="i?.supplementaryInformationVO?.stateReceipt">
{{ i?.supplementaryInformationVO?.receiptType === '1' ? '电子回单' : '纸质回单' }}
</sv>
<sv label="联系人" *ngIf="i?.supplementaryInformationVO?.stateReceipt"> {{
i?.supplementaryInformationVO?.receiptUserName }} / {{ i?.supplementaryInformationVO?.phon }} </sv>
<sv label="所在地区" *ngIf="i?.supplementaryInformationVO?.stateReceipt">
{{ i?.supplementaryInformationVO?.area }}
</sv>
<sv label="详细地址" *ngIf="i?.supplementaryInformationVO?.stateReceipt">
{{ i?.supplementaryInformationVO?.address }}
</sv>
<sv label="备注">
{{ i?.supplementaryInformationVO?.remarks }}
</sv>
<sv col="1" label="回单凭证" *ngIf="i?.supplementaryInformationVO?.stateReceipt">
<app-imagelist [imgList]="i?.receiptFilePath"></app-imagelist>
</sv>
</sv-container>
</nz-card>
<nz-card [nzBorderless]="true" class="mb0"> <nz-card [nzBorderless]="true" class="mb0">
<p class="detail_title" #distannce5><span>|</span> 轨迹信息</p> <p class="detail_title" #distannce5><span>|</span> 轨迹信息</p>
<div nz-row> <div nz-row>

8
src/app/shared/components/imagelist/imagelist.component.html
View File

@ -1,5 +1,5 @@
<!-- <!--
* @Description : * @Description :
* @Version : 1.0 * @Version : 1.0
* @Author : Shiming * @Author : Shiming
* @Date : 2022-03-23 14:24:05 * @Date : 2022-03-23 14:24:05
@ -11,10 +11,10 @@
<div class="imgBox"> <div class="imgBox">
<ng-container *ngFor="let item of imgList; let i = index"> <ng-container *ngFor="let item of imgList; let i = index">
<ng-container *ngIf="item;"> <ng-container *ngIf="item;">
<img nz-image [nzSrc]="item" /> <img [style]="style" nz-image [nzSrc]="item" />
</ng-container> </ng-container>
<ng-template #elseTemplate> <ng-template #elseTemplate>
<div style="background-color: darkgrey;border-radius: 5px;width: 200px;height: 160px;" class="mr-sm"></div> <div style="background-color: darkgrey;border-radius: 5px;width: 120px;height: 120px;" class="mr-sm"></div>
</ng-template> </ng-template>
</ng-container> </ng-container>
</div> </div>

7
src/app/shared/components/imagelist/imagelist.component.ts
View File

@ -19,15 +19,16 @@ import { ImageViewComponent } from './imageview/imageview.component';
}) })
export class ImageListComponent implements OnInit { export class ImageListComponent implements OnInit {
@Input() imgList: any = []; @Input() imgList: any = [];
@Input() style = '';
constructor( constructor(
private modal: ModalHelper, private modal: ModalHelper,
public msgSrv: NzMessageService, public msgSrv: NzMessageService,
public http: _HttpClient, public http: _HttpClient,
private nzImageService: NzImageService private nzImageService: NzImageService
) {} ) { }
ngOnInit(): void { ngOnInit(): void {
this.style = this.style || '';
} }
showImg(index: any) { showImg(index: any) {
const params = { const params = {
@ -35,7 +36,7 @@ export class ImageListComponent implements OnInit {
index index
}; };
const images = this.imgList.map((url: string) => { const images = this.imgList.map((url: string) => {
if(url) { if (url) {
console.log(url); console.log(url);
({ src: url }) ({ src: url })
} }

15
src/styles/common/global.less
View File

@ -99,3 +99,18 @@
} }
} }
} }
.attch-card {
height: 100%;
.ant-card-body {
height: 100%;
.attachment-info {
height: calc(100% - 32px);
border: 1px solid #EAECEF;
padding: 10px;
}
}
}