From f5b0e5dac5847d91891d551a77a5dac6d84ef0dc Mon Sep 17 00:00:00 2001
From: Taric Xin <LincolnLin@swireproperties.com>
Date: Tue, 19 Apr 2022 14:08:08 +0800
Subject: [PATCH] edit

---
 .../list/detail/detail.component.html         | 241 +++++++++---------
 1 file changed, 114 insertions(+), 127 deletions(-)

diff --git a/src/app/routes/vehicle/components/list/detail/detail.component.html b/src/app/routes/vehicle/components/list/detail/detail.component.html
index cc016948..56a65d87 100644
--- a/src/app/routes/vehicle/components/list/detail/detail.component.html
+++ b/src/app/routes/vehicle/components/list/detail/detail.component.html
@@ -1,4 +1,4 @@
-<ng-container >
+<ng-container>
   <!-- 页头 -->
   <page-header-wrapper [logo]="logo" title="车辆详情" [content]="content">
     <ng-template #logo>
@@ -8,84 +8,73 @@
     </ng-template>
     <ng-template #content>
       <sv-container col="1">
-      <sv-title style="font-weight: 700;">
-        <div style="float: right;">
-          <ng-container *ngIf="!isEdit">
-            <button nz-button nzType="default" nzDanger (click)="ratify()" acl acl-ability="VEHICLE-LIST-DETAIL-save">修改</button>
-          </ng-container>
-          <ng-container *ngIf="isEdit">
-            <button nz-button nzType="default" (click)="reset()">取消</button>
-            <button nz-button nzType="default" (click)="save()" nzDanger>保存</button>
-          </ng-container>
-        </div>
-      </sv-title>
-    </sv-container>
+        <sv-title style="font-weight: 700;">
+          <div style="float: right;">
+            <ng-container *ngIf="!isEdit">
+              <button nz-button nzType="default" nzDanger (click)="ratify()" acl
+                acl-ability="VEHICLE-LIST-DETAIL-save">修改</button>
+            </ng-container>
+            <ng-container *ngIf="isEdit">
+              <button nz-button nzType="default" (click)="reset()">取消</button>
+              <button nz-button nzType="default" (click)="save()" nzDanger>保存</button>
+            </ng-container>
+          </div>
+        </sv-title>
+      </sv-container>
 
-        <sv-container col="3">
+      <sv-container col="3">
         <sv-title style="font-weight: 700;">车辆基础信息</sv-title>
-          <sv label="车牌号">
-            <input nz-input type="text" [(ngModel)]="detailData.carNo" [readonly]="!isEdit" [nzBorderless]="!isEdit"
+        <sv label="车牌号">
+          <input nz-input type="text" [(ngModel)]="detailData.carNo" [readonly]="!isEdit" [nzBorderless]="!isEdit"
             [placeholder]="isEdit?'':'-'">
-          </sv>
-          <sv label="车牌颜色">
-            <!-- <input nz-input type="text" [(ngModel)]="detailData.carNoColor" [readonly]="!isEdit" [nzBorderless]="!isEdit"
+        </sv>
+        <sv label="车牌颜色">
+          <!-- <input nz-input type="text" [(ngModel)]="detailData.carNoColor" [readonly]="!isEdit" [nzBorderless]="!isEdit"
             [placeholder]="isEdit?'':'-'"> -->
-            <nz-select [(ngModel)]="detailData.carNoColor" [nzPlaceHolder]="isEdit?'':'-'" [nzBorderless]="!isEdit"
+          <nz-select [(ngModel)]="detailData.carNoColor" [nzPlaceHolder]="isEdit?'':'-'" [nzBorderless]="!isEdit"
             [nzShowArrow]="isEdit" [nzDisabled]="!isEdit">
-              <nz-option
-                *ngFor="let i of contenCarNoColor"
-                [nzLabel]="i.label"
-                [nzValue]="i.value"
-              ></nz-option>
-            </nz-select>
-          </sv>
-          <sv label="车型">
-            <!-- <input nz-input type="text" [(ngModel)]="detailData.carModel" [readonly]="!isEdit" [nzBorderless]="!isEdit"
+            <nz-option *ngFor="let i of contenCarNoColor" [nzLabel]="i.label" [nzValue]="i.value"></nz-option>
+          </nz-select>
+        </sv>
+        <sv label="车型">
+          <!-- <input nz-input type="text" [(ngModel)]="detailData.carModel" [readonly]="!isEdit" [nzBorderless]="!isEdit"
             [placeholder]="isEdit?'':'-'"> -->
-            <nz-select [(ngModel)]="detailData.carModel" [nzPlaceHolder]="isEdit?'':'-'" [nzBorderless]="!isEdit"
+          <nz-select [(ngModel)]="detailData.carModel" [nzPlaceHolder]="isEdit?'':'-'" [nzBorderless]="!isEdit"
             [nzShowArrow]="isEdit" [nzDisabled]="!isEdit">
-              <nz-option
-                *ngFor="let i of contencarModel"
-                [nzLabel]="i.label"
-                [nzValue]="i.value"
-              ></nz-option>
-            </nz-select>
-          </sv>
-          <sv label="车长(米)">
-            <!-- <input nz-input type="text" [(ngModel)]="detailData.carLength" [readonly]="!isEdit" [nzBorderless]="!isEdit"
+            <nz-option *ngFor="let i of contencarModel" [nzLabel]="i.label" [nzValue]="i.value"></nz-option>
+          </nz-select>
+        </sv>
+        <sv label="车长(米)">
+          <!-- <input nz-input type="text" [(ngModel)]="detailData.carLength" [readonly]="!isEdit" [nzBorderless]="!isEdit"
             [placeholder]="isEdit?'':'-'"> -->
-            <nz-select [(ngModel)]="detailData.carLength" [nzPlaceHolder]="isEdit?'':'-'" [nzBorderless]="!isEdit"
+          <nz-select [(ngModel)]="detailData.carLength" [nzPlaceHolder]="isEdit?'':'-'" [nzBorderless]="!isEdit"
             [nzShowArrow]="isEdit" [nzDisabled]="!isEdit">
-              <nz-option
-                *ngFor="let i of contenCarLength"
-                [nzLabel]="i.label"
-                [nzValue]="i.value"
-              ></nz-option>
-            </nz-select>
-          </sv>
-          <sv label="是否挂靠">
-            <nz-select [(ngModel)]="detailData.isSelf" [nzPlaceHolder]="isEdit?'':'-'" [nzBorderless]="!isEdit"
+            <nz-option *ngFor="let i of contenCarLength" [nzLabel]="i.label" [nzValue]="i.value"></nz-option>
+          </nz-select>
+        </sv>
+        <sv label="是否挂靠">
+          <nz-select [(ngModel)]="detailData.isSelf" [nzPlaceHolder]="isEdit?'':'-'" [nzBorderless]="!isEdit"
             [nzShowArrow]="isEdit" [nzDisabled]="!isEdit">
             <nz-option [nzValue]="false" nzLabel="否"></nz-option>
             <nz-option [nzValue]="true" nzLabel="是"></nz-option>
           </nz-select>
-          </sv>
-          <sv label="是否为挂车">
-            <nz-select [(ngModel)]="detailData.isTrailer" [nzPlaceHolder]="isEdit?'':'-'" [nzBorderless]="!isEdit"
+        </sv>
+        <sv label="是否为挂车">
+          <nz-select [(ngModel)]="detailData.isTrailer" [nzPlaceHolder]="isEdit?'':'-'" [nzBorderless]="!isEdit"
             [nzShowArrow]="isEdit" [nzDisabled]="!isEdit">
             <nz-option [nzValue]="false" nzLabel="否"></nz-option>
             <nz-option [nzValue]="true" nzLabel="是"></nz-option>
           </nz-select>
-          </sv>
-        </sv-container>
-        <sv-container col="1">
-          <sv label="车头照">
-            <!-- <app-imagelist [imgList]="[detailData?.carFrontPhotoWatermark, detailData?.carFrontPhotoWatermark]"></app-imagelist> -->
-            <ng-container
+        </sv>
+      </sv-container>
+      <sv-container col="1">
+        <sv label="车头照">
+          <!-- <app-imagelist [imgList]="[detailData?.carFrontPhotoWatermark, detailData?.carFrontPhotoWatermark]"></app-imagelist> -->
+          <ng-container
             *ngTemplateOutlet="uploadTemplate;context:{image:detailData?.carFrontPhotoWatermark,key:'carFrontPhotoWatermark',hover: 'PhotoWatermark2'}">
           </ng-container>
-          </sv>
-        </sv-container>
+        </sv>
+      </sv-container>
     </ng-template>
   </page-header-wrapper>
   <nz-card>
@@ -93,28 +82,30 @@
       <sv-title style="font-weight: 700;">行驶证信息</sv-title>
       <sv label="档案编号">
         <input nz-input type="text" [(ngModel)]="detailData.archivesNo" [readonly]="!isEdit" [nzBorderless]="!isEdit"
-        [placeholder]="isEdit?'':'-'">
+          [placeholder]="isEdit?'':'-'">
+      </sv>
+      <sv label="车辆品牌">
+        <input nz-input type="text" [(ngModel)]="detailData.carBrand" [readonly]="!isEdit" [nzBorderless]="!isEdit"
+          [placeholder]="isEdit?'':'-'">
       </sv>
       <sv label="行驶证注册日期">
         <!-- <input nz-input type="text" [(ngModel)]="detailData.driverLicenseRegisterTime" [readonly]="!isEdit" [nzBorderless]="!isEdit"
         [placeholder]="isEdit?'':'-'"> -->
         <nz-date-picker [(ngModel)]="detailData.driverLicenseRegisterTime" [nzDisabled]="!isEdit"
-        [nzPlaceHolder]="isEdit?'':'-'" [nzBorderless]="!isEdit" [nzSuffixIcon]="isEdit?'calendar':''"></nz-date-picker>
-      </sv>
-      <sv label="车辆品牌">
-        <input nz-input type="text" [(ngModel)]="detailData.carBrand" [readonly]="!isEdit" [nzBorderless]="!isEdit"
-        [placeholder]="isEdit?'':'-'">
+          [nzPlaceHolder]="isEdit?'':'-'" [nzBorderless]="!isEdit" [nzSuffixIcon]="isEdit?'calendar':''">
+        </nz-date-picker>
       </sv>
     </sv-container>
 
-      <sv-container col="3">
-        <sv label="行驶证到期日">
-          <nz-date-picker [(ngModel)]="detailData.driverLicenseEndTime" [nzDisabled]="!isEdit"
-          [nzPlaceHolder]="isEdit?'':'-'" [nzBorderless]="!isEdit" [nzSuffixIcon]="isEdit?'calendar':''"></nz-date-picker>
-        </sv>
+    <sv-container col="3">
+      <sv label="行驶证到期日">
+        <nz-date-picker [(ngModel)]="detailData.driverLicenseEndTime" [nzDisabled]="!isEdit"
+          [nzPlaceHolder]="isEdit?'':'-'" [nzBorderless]="!isEdit" [nzSuffixIcon]="isEdit?'calendar':''">
+        </nz-date-picker>
+      </sv>
       <sv label="行驶证签发机关">
-        <input style="width: '300px'" nz-input type="text" [(ngModel)]="detailData.driverLicenseSigningOrg" [readonly]="!isEdit" [nzBorderless]="!isEdit"
-        [placeholder]="isEdit?'':'-'">
+        <input style="width: '300px'" nz-input type="text" [(ngModel)]="detailData.driverLicenseSigningOrg"
+          [readonly]="!isEdit" [nzBorderless]="!isEdit" [placeholder]="isEdit?'':'-'">
       </sv>
     </sv-container>
 
@@ -123,118 +114,114 @@
         <!-- <input nz-input type="text" [(ngModel)]="detailData.driverLicenseGetTime" [readonly]="!isEdit" [nzBorderless]="!isEdit"
         [placeholder]="isEdit?'':'-'"> -->
         <nz-date-picker [(ngModel)]="detailData.driverLicenseGetTime" [nzDisabled]="!isEdit"
-        [nzPlaceHolder]="isEdit?'':'-'" [nzBorderless]="!isEdit" [nzSuffixIcon]="isEdit?'calendar':''"></nz-date-picker>
+          [nzPlaceHolder]="isEdit?'':'-'" [nzBorderless]="!isEdit" [nzSuffixIcon]="isEdit?'calendar':''">
+        </nz-date-picker>
       </sv>
       <sv label="车辆识别代码">
-        <input nz-input type="text" [(ngModel)]="detailData.carDistinguishCode" [readonly]="!isEdit" [nzBorderless]="!isEdit"
-        [placeholder]="isEdit?'':'-'">
+        <input nz-input type="text" [(ngModel)]="detailData.carDistinguishCode" [readonly]="!isEdit"
+          [nzBorderless]="!isEdit" [placeholder]="isEdit?'':'-'">
       </sv>
       <sv label="使用性质">
         <nz-select [(ngModel)]="detailData.useNature" [nzPlaceHolder]="isEdit?'':'-'" [nzBorderless]="!isEdit"
-        [nzShowArrow]="isEdit" [nzDisabled]="!isEdit">
-        <nz-option [nzValue]="'1'" nzLabel="营运"></nz-option>
-        <nz-option [nzValue]="'0'" nzLabel="非营运"></nz-option>
-      </nz-select>
+          [nzShowArrow]="isEdit" [nzDisabled]="!isEdit">
+          <nz-option [nzValue]="'1'" nzLabel="营运"></nz-option>
+          <nz-option [nzValue]="'0'" nzLabel="非营运"></nz-option>
+        </nz-select>
       </sv>
     </sv-container>
 
     <sv-container col="3">
       <sv label="载重（吨）">
         <input nz-input type="text" [(ngModel)]="detailData.carLoad" [readonly]="!isEdit" [nzBorderless]="!isEdit"
-        [placeholder]="isEdit?'':'-'">
+          [placeholder]="isEdit?'':'-'">
       </sv>
       <sv label="整备质量">
         <input nz-input type="text" [(ngModel)]="detailData.curbWeight" [readonly]="!isEdit" [nzBorderless]="!isEdit"
-        [placeholder]="isEdit?'':'-'">
+          [placeholder]="isEdit?'':'-'">
       </sv>
       <sv label="所有人">
-        <input style="width: '300px'" nz-input type="text" [(ngModel)]="detailData.carOwner" [readonly]="!isEdit" [nzBorderless]="!isEdit"
-        [placeholder]="isEdit?'':'-'">
+        <input style="width: '300px'" nz-input type="text" [(ngModel)]="detailData.carOwner" [readonly]="!isEdit"
+          [nzBorderless]="!isEdit" [placeholder]="isEdit?'':'-'">
       </sv>
     </sv-container>
     <sv-container col="1">
       <sv label="行驶证照片">
         <ng-container
-        *ngTemplateOutlet="uploadTemplate;context:{image:detailData?.certificatePhotoFrontWatermark,key:'certificatePhotoFrontWatermark',hover: 'FrontWatermark'}">
-      </ng-container>
+          *ngTemplateOutlet="uploadTemplate;context:{image:detailData?.certificatePhotoFrontWatermark,key:'certificatePhotoFrontWatermark',hover: 'FrontWatermark'}">
+        </ng-container>
         <ng-container
-        *ngTemplateOutlet="uploadTemplate;context:{image:detailData?.certificatePhotoBackWatermark,key:'certificatePhotoBackWatermark',hover: 'BackWatermark'}">
-      </ng-container>
+          *ngTemplateOutlet="uploadTemplate;context:{image:detailData?.certificatePhotoBackWatermark,key:'certificatePhotoBackWatermark',hover: 'BackWatermark'}">
+        </ng-container>
       </sv>
     </sv-container>
     <nz-divider></nz-divider>
     <sv-container col="3" class="mt16">
       <sv-title style="font-weight: 700;">道路运输证信息</sv-title>
       <sv label="道路运输证号">
-        <input nz-input type="text" [(ngModel)]="detailData.roadTransportNo" [readonly]="!isEdit" [nzBorderless]="!isEdit"
-        [placeholder]="isEdit?'':'-'">
+        <input nz-input type="text" [(ngModel)]="detailData.roadTransportNo" [readonly]="!isEdit"
+          [nzBorderless]="!isEdit" [placeholder]="isEdit?'':'-'">
       </sv>
       <sv label="经营许可证号">
-        <input nz-input type="text" [(ngModel)]="detailData.roadTransportLicenceNo" [readonly]="!isEdit" [nzBorderless]="!isEdit"
-        [placeholder]="isEdit?'':'-'">
+        <input nz-input type="text" [(ngModel)]="detailData.roadTransportLicenceNo" [readonly]="!isEdit"
+          [nzBorderless]="!isEdit" [placeholder]="isEdit?'':'-'">
       </sv>
       <sv label="发证日期">
         <!-- <input nz-input type="text" [(ngModel)]="detailData.roadTransportStartTime" [readonly]="!isEdit" [nzBorderless]="!isEdit"
         [placeholder]="isEdit?'':'-'"> -->
         <nz-date-picker [(ngModel)]="detailData.roadTransportStartTime" [nzDisabled]="!isEdit"
-        [nzPlaceHolder]="isEdit?'':'-'" [nzBorderless]="!isEdit" [nzSuffixIcon]="isEdit?'calendar':''"></nz-date-picker>
+          [nzPlaceHolder]="isEdit?'':'-'" [nzBorderless]="!isEdit" [nzSuffixIcon]="isEdit?'calendar':''">
+        </nz-date-picker>
       </sv>
       <sv label="有效期至">
         <!-- <input nz-input type="text" [(ngModel)]="detailData.roadTransportEndTime" [readonly]="!isEdit" [nzBorderless]="!isEdit"
         [placeholder]="isEdit?'':'-'"> -->
         <nz-date-picker [(ngModel)]="detailData.roadTransportEndTime" [nzDisabled]="!isEdit"
-        [nzPlaceHolder]="isEdit?'':'-'" [nzBorderless]="!isEdit" [nzSuffixIcon]="isEdit?'calendar':''"></nz-date-picker>
+          [nzPlaceHolder]="isEdit?'':'-'" [nzBorderless]="!isEdit" [nzSuffixIcon]="isEdit?'calendar':''">
+        </nz-date-picker>
       </sv>
       <sv label="道路运输证照片">
         <!-- <app-imagelist [imgList]="[detailData?.roadTransportPhoto,detailData?.roadTransportPhotoWatermark ]"></app-imagelist> -->
         <ng-container
-        *ngTemplateOutlet="uploadTemplate;context:{image:detailData?.roadTransportPhotoWatermark,key:'roadTransportPhotoWatermark', hover: 'Watermark'}" >
-      </ng-container>
+          *ngTemplateOutlet="uploadTemplate;context:{image:detailData?.roadTransportPhotoWatermark,key:'roadTransportPhotoWatermark', hover: 'Watermark'}">
+        </ng-container>
       </sv>
     </sv-container>
     <nz-divider></nz-divider>
     <sv-container col="2" class="mt16">
       <sv-title style="font-weight: 700;">认证司机</sv-title>
     </sv-container>
-    <st
-    #st
-    [bordered]="true"
-    [columns]="columns"
-    [data]="service.$api_get_queryDriverByCarId"
-    [req]="{  method: 'POST', allInBody: true, params: reqParams }"
-    [res]="{ reName: { list: 'data', total: 'data' } }"
-    [ngStyle]="{ margin: '1rem 0' }"
-    multiSort
-    size="small"
-    [page]="{ show: false }"
-  >
-  <ng-template st-row="auditStatusEnum" let-item let-index="index">
-    <div>
-      <span *ngIf="item?.auditStatusEnum === -1 || item?.auditStatusEnum === '-1'">未上传</span>
-      <span *ngIf="item?.auditStatusEnum === 0 || item?.auditStatusEnum === '0'">草稿</span>
-      <span *ngIf="item?.auditStatusEnum === 10 || item?.auditStatusEnum === '10'">待审核</span>
-      <span *ngIf="item?.auditStatusEnum === 20 || item?.auditStatusEnum === '20'">已审核</span>
-      <span *ngIf="item?.auditStatusEnum === 30 || item?.auditStatusEnum === '30'">已驳回</span>
-      <span *ngIf="item?.auditStatusEnum === 40 || item?.auditStatusEnum === '40'">证件过期</span>
-    </div>
-  </ng-template>
-  </st>
+    <st #st [bordered]="true" [columns]="columns" [data]="service.$api_get_queryDriverByCarId"
+      [req]="{  method: 'POST', allInBody: true, params: reqParams }"
+      [res]="{ reName: { list: 'data', total: 'data' } }" [ngStyle]="{ margin: '1rem 0' }" multiSort size="small"
+      [page]="{ show: false }">
+      <ng-template st-row="auditStatusEnum" let-item let-index="index">
+        <div>
+          <span *ngIf="item?.auditStatusEnum === -1 || item?.auditStatusEnum === '-1'">未上传</span>
+          <span *ngIf="item?.auditStatusEnum === 0 || item?.auditStatusEnum === '0'">草稿</span>
+          <span *ngIf="item?.auditStatusEnum === 10 || item?.auditStatusEnum === '10'">待审核</span>
+          <span *ngIf="item?.auditStatusEnum === 20 || item?.auditStatusEnum === '20'">已审核</span>
+          <span *ngIf="item?.auditStatusEnum === 30 || item?.auditStatusEnum === '30'">已驳回</span>
+          <span *ngIf="item?.auditStatusEnum === 40 || item?.auditStatusEnum === '40'">证件过期</span>
+        </div>
+      </ng-template>
+    </st>
   </nz-card>
 </ng-container>
 
-<nz-modal [(nzVisible)]="isVisible"  [nzWidth]="600" [nzFooter]="nzModalFooterEvaluate"  (nzOnOk)="handleOK()" (nzOnCancel)="handleCancel('2')">
+<nz-modal [(nzVisible)]="isVisible" [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>
+        <div>
+          评分: <nz-rate [ngModel]="2.5" nzAllowHalf></nz-rate>
+          <div><span>评价内容：</span></div>
+        </div>
       </nz-tab>
       <nz-tab nzTitle="司机评价">
-      <div>
-        暂无评价内容
-      </div>
+        <div>
+          暂无评价内容
+        </div>
       </nz-tab>
     </nz-tabset>
   </ng-container>