@ -14,10 +14,11 @@
< div class = "card-title"
> 装卸货信息< span class = "tip-font" > 预计公里数:{{ totalDistance }}km, 预计行程耗时: {{ totalTime }}小时< / span > < / div
>
< form nz-form [ formGroup ] = " validateForm1 " role = "form" >
< div nz-row [ nzGutter ] = " 24 " >
< div nz-col [ nzSpan ] = " 10 " >
< div * ngFor = "let data of startInfo; let idx = index" >
< div * ngFor = "let data1 of startInfo; let idx = index" >
< nz-form-item >
< nz-form-label [ nzSpan ] = " 3 " nzRequired > 装货地< / nz-form-label >
< nz-form-control [ nzErrorTip ] = " ' 请输入装货地 ' " >
@ -25,78 +26,15 @@
< nz-input-group [ nzSuffix ] = " endInconTemp1 " >
< input
nz-input
[ ( ngModel ) ] = " data . detailedAddress "
[ ( ngModel ) ] = " data1 . detailedAddress "
( click ) = " openMap ( ' start ' , idx ) "
formControlName = "loadAddress{{ idx }}"
placeholder = "请输入装货地"
/ >
< / nz-input-group >
< span * ngIf = "idx !== 0" [ ngClass ] = " idx = = 0 ? ' hides ' : ' ' " style = "padding: 0 10px"
< span * ngIf = "idx !== 0" style = "padding: 0 10px"
> < i nz-icon nzType = "minus-circle" nzTheme = "outline" style = "color: #d9001b" ( click ) = " subStartInfo ( $ event , idx ) " > < / i
> < / span >
< span * ngIf = "idx == 0" style = "visibility:hidden;padding: 0 10px"
> < i nz-icon nzType = "minus-circle" nzTheme = "outline" style = "color: #d9001b" ( click ) = " subStartInfo ( $ event , idx ) " > < / i
> < / span >
< / div >
< / nz-form-control >
< / nz-form-item >
< nz-form-item >
< nz-form-label [ nzSpan ] = " 3 " nzRequired > 联系人< / nz-form-label >
< div style = "display: flex; width: 80.7%" >
< nz-form-control [ nzErrorTip ] = " ' 请输入联系人姓名 ' " >
< input
nz-input
[ ( ngModel ) ] = " data . appUserName "
formControlName = "loadName{{ idx }}"
name = "loadName{{ idx }}"
maxlength = "30"
placeholder = "请输入联系人姓名"
/ >
< / nz-form-control >
< nz-form-control [ nzErrorTip ] = " ' 请输入联系人电话 ' " >
< input
style = "margin-left: 12px"
nz-input
[ ( ngModel ) ] = " data . contractTelephone "
maxlength = "11"
formControlName = "loadPhone{{ idx }}"
name = "loadPhone{{ idx }}"
placeholder = "请输入联系人电话"
/ >
< / nz-form-control >
< / div >
< / nz-form-item >
< / div >
< div style = "display: flex; justify-content: center" >
< button nz-button nzType = "primary" ( click ) = " addStartInfo ( ) " >
< i nz-icon nzType = "plus" > < / i >
添加装货地
< / button >
< / div >
< / div >
< div nz-col [ nzSpan ] = " 4 " >
< div style = "display: flex; justify-content: center" >
< span class = "swap-icon" ( click ) = " swapAddress ( ) " > < i nz-icon nzType = "swap"
nzTheme = "outline" > < / i > < / span >
< / div >
< / div >
< div nz-col [ nzSpan ] = " 10 " >
< div * ngFor = "let data of endInfo; let idx = index" >
< nz-form-item >
< nz-form-label [ nzSpan ] = " 3 " nzRequired > 卸货地< / nz-form-label >
< nz-form-control [ nzErrorTip ] = " ' 请输入卸货地 ' " >
< div class = "align-center" >
< nz-input-group [ nzSuffix ] = " endInconTemp1 " >
< input
nz-input
[ ( ngModel ) ] = " data . detailedAddress "
( click ) = " openMap ( ' end ' , idx ) "
formControlName = "unloadAddress{{ idx }}"
placeholder = "请输入卸货地"
/ >
< / nz-input-group >
< span * ngIf = "idx !== 0" style = "padding: 0 10px" > < i nz-icon nzType = "minus-circle" nzTheme = "outline" style = "color: #d9001b" ( click ) = " subEndInfo ( $ event , idx ) " > < / i > < / span >
< span * ngIf = "idx == 0" style = "visibility:hidden;padding: 0 10px"
> < i nz-icon nzType = "minus-circle" nzTheme = "outline" style = "color: #d9001b" ( click ) = " subStartInfo ( $ event , idx ) " > < / i
> < / span >
@ -109,7 +47,75 @@
< nz-form-control [ nzErrorTip ] = " ' 请输入联系人姓名 ' " >
< input
nz-input
[ ( ngModel ) ] = " data . appUserName "
[ ( ngModel ) ] = " data1 . appUserName "
formControlName = "loadName{{ idx }}"
name = "loadName{{ idx }}"
maxlength = "30"
placeholder = "请输入联系人姓名"
/ >
< / nz-form-control >
< nz-form-control [ nzErrorTip ] = " ' 请输入联系人电话 ' " >
< input
style = "margin-left: 12px"
nz-input
[ ( ngModel ) ] = " data1 . contractTelephone "
maxlength = "11"
formControlName = "loadPhone{{ idx }}"
name = "loadPhone{{ idx }}"
placeholder = "请输入联系人电话"
/ >
< / nz-form-control >
< / div >
< / nz-form-item >
< / div >
< div nz-row >
< div nz-col [ nzSpan ] = " 4 " > < / div >
< div style = "display: flex; justify-content: center" >
< button nz-button nzType = "primary" ( click ) = " addStartInfo ( ) " >
< i nz-icon nzType = "plus" > < / i >
添加装货地
< / button >
< / div >
< / div >
< / div >
< div nz-col [ nzSpan ] = " 4 " >
< div style = "display: flex; justify-content: center" >
< span class = "swap-icon" ( click ) = " swapAddress ( ) " > < i nz-icon nzType = "swap"
nzTheme = "outline" > < / i > < / span >
< / div >
< / div >
< div nz-col [ nzSpan ] = " 10 " >
< div * ngFor = "let data2 of endInfo; let idx = index" >
< nz-form-item >
< nz-form-label [ nzSpan ] = " 4 " nzRequired > 卸货地< / nz-form-label >
< nz-form-control [ nzErrorTip ] = " ' 请输入卸货地 ' " >
< div class = "align-center" >
< nz-input-group [ nzSuffix ] = " endInconTemp1 " >
< input
nz-input
[ ( ngModel ) ] = " data2 . detailedAddress "
( click ) = " openMap ( ' end ' , idx ) "
formControlName = "unloadAddress{{ idx }}"
placeholder = "请输入卸货地"
name = "unloadAddress{{ idx }}"
/ >
< / nz-input-group >
< span * ngIf = "idx !== 0" style = "padding: 0 10px"
> < i nz-icon nzType = "minus-circle" nzTheme = "outline" style = "color: #d9001b" ( click ) = " subEndInfo ( $ event , idx ) " > < / i
> < / span >
< span * ngIf = "idx == 0" style = "visibility:hidden;padding: 0 10px"
> < i nz-icon nzType = "minus-circle" nzTheme = "outline" style = "color: #d9001b" ( click ) = " subStartInfo ( $ event , idx ) " > < / i
> < / span >
< / div >
< / nz-form-control >
< / nz-form-item >
< nz-form-item >
< nz-form-label [ nzSpan ] = " 3 " nzRequired > 联系人< / nz-form-label >
< div style = "display: flex; width: 80.7%" >
< nz-form-control [ nzErrorTip ] = " ' 请输入联系人姓名 ' " >
< input
nz-input
[ ( ngModel ) ] = " data2 . appUserName "
maxlength = "30"
formControlName = "unloadName{{ idx }}"
name = "unloadAddress{{ idx }}"
@ -120,7 +126,7 @@
< input
style = "margin-left: 12px"
nz-input
[ ( ngModel ) ] = " data . contractTelephone "
[ ( ngModel ) ] = " data2 . contractTelephone "
formControlName = "unloadPhone{{ idx }}"
name = "unloadAddress{{ idx }}"
maxlength = "11"
@ -130,18 +136,21 @@
< / div >
< / nz-form-item >
< / div >
< div style = "display: flex; justify-content: center" >
< button nz-button nzType = "primary" ( click ) = " addEndInfo ( ) " >
< i nz-icon nzType = "plus" > < / i >
添加卸货地
< / button >
< div nz-row >
< div nz-col [ nzSpan ] = " 4 " > < / div >
< div style = "display: flex; justify-content: center" >
< button nz-button nzType = "primary" ( click ) = " addEndInfo ( ) " >
< i nz-icon nzType = "plus" > < / i >
添加卸货地
< / button >
< / div >
< / div >
< / div >
< / div >
< div nz-row [ nzGutter ] = " 24 " style = "margin-top: 24px" >
< div nz-col [ nzSpan ] = " 10 " >
< nz-form-item >
< nz-form-label [ nzSpan ] = " 5 " nzRequired > 装货时间< / nz-form-label >
< nz-form-label [ nzSpan ] = " 3 " nzRequired > 装货时间< / nz-form-label >
< nz-form-control [ nzErrorTip ] = " ' 请输入装货时间 ' " >
< nz-date-picker
nzShowTime
@ -155,14 +164,14 @@
< div nz-col [ nzSpan ] = " 4 " > < / div >
< div nz-col [ nzSpan ] = " 10 " >
< nz-form-item >
< nz-form-label [ nzSpan ] = " 5 " nzRequired > 卸货时间< / nz-form-label >
< nz-form-label [ nzSpan ] = " 3 " nzRequired > 卸货时间< / nz-form-label >
< nz-form-control [ nzErrorTip ] = " ' 请输入卸货时间 ' " >
< nz-date-picker nzShowTime nzFormat = "yyyy-MM-dd HH:mm:ss" formControlName = "unloadingTime" > < / nz-date-picker >
< / nz-form-control >
< / nz-form-item >
< / div >
< / div >
< ng-template # endInconTemp1 > < i nz-icon nzType = "global " > < / i > < / ng-template >
< ng-template # endInconTemp1 > < i nz-icon nzType = "environment" nzTheme = "outline " > < / i > < / ng-template >
< / form >
< / nz-card >
< nz-card >