车辆对接

src/app/routes/order-management/components/vehicle-detail-change/vehicle-detail-change.component.ts

@@ -2,7 +2,7 @@ import { ViewChild } from '@angular/core';
 /*
  * @Author: your name
  * @Date: 2021-12-03 15:31:52
- * @LastEditTime: 2021-12-23 14:33:36
+ * @LastEditTime: 2021-12-23 16:34:02
  * @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\order-management\components\vehicle-detail\vehicle-detail.component.ts
@@ -10,13 +10,23 @@ import { ViewChild } from '@angular/core';
 import { Component, OnInit } from '@angular/core';
 import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms';
 import { ActivatedRoute } from '@angular/router';
-import { STColumn } from '@delon/abc/st';
+import { STColumn, STComponent } from '@delon/abc/st';
 import { SFComponent, SFSchema, SFSelectWidgetSchema, SFUISchema } from '@delon/form';
 import { _HttpClient } from '@delon/theme';
 import { AmapPoiPickerComponent, AmapService, ShipperBaseService } from '@shared';
 import { NzMessageService } from 'ng-zorro-antd/message';
 import { NzModalService } from 'ng-zorro-antd/modal';
+import { NzUploadChangeParam, NzUploadFile } from 'ng-zorro-antd/upload';
+import { Observable, Observer } from 'rxjs';
 import { OrderManagementService } from '../../services/order-management.service';
+function getBase64(file: File): Promise<string | ArrayBuffer | null> {
+  return new Promise((resolve, reject) => {
+    const reader = new FileReader();
+    reader.readAsDataURL(file);
+    reader.onload = () => resolve(reader.result);
+    reader.onerror = error => reject(error);
+  });
+}
 @Component({
   selector: 'app-supply-management-vehicle-detail-change',
   templateUrl: './vehicle-detail-change.component.html',
@@ -27,27 +37,7 @@ export class OrderManagementVehicleDetailChangeComponent implements OnInit {
   id = this.route.snapshot.params.id;
   @ViewChild('distannce3', { static: false })
   i: any= {unLoadingPlaceList:[]};
-  logColumns: STColumn[] = [
-    { title: '款项', index: 'costName' },
-    { title: '总费用（元）', index: 'price' },
-    { title: '协议金额（元）', index: 'price' },
-    { title: '附加费（元）', index: 'surcharge' },
-    { title: '附加费率（%）', index: 'paymentMethodRate' },
-    { 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' },
-      },
-    },
-  ];
+  logColumns: STColumn[] =[]
   totalDistance = 0.0; //总里程
   totalTime = 0.0; //路程总时间
   startInfo: any = [];  // 装货信息
@@ -56,17 +46,27 @@ export class OrderManagementVehicleDetailChangeComponent implements OnInit {
   loadingTime: any; // 货源单设置回显
   sf3data: any; // 货源单设置回显
   sf4data: any; // 货源单设置回显
+  dirverPhone: any; // 货源单设置回显
+  dirverBankCard: any; // 货源单设置回显
+  listImagUrls: any[] = []; // 货源单设置回显
+  listImagUrls2: any[] = []; // 货源单设置回显
+  imges: any;
+  previewImage1 = '';
+  previewVisible1 = false;
+  previewImage2 = '';
+  previewVisible2 = false;
   @ViewChild('sf3', { static: false }) sf3!: SFComponent;
   schema3: SFSchema = {};
   ui3!: SFUISchema;
-
+  @ViewChild('st') st!: STComponent;
   @ViewChild('sf4', { static: false }) sf4!: SFComponent;
   schema4: SFSchema = {};
+  isVisible = false;
   ui4!: SFUISchema;
   constructor(
     private route: ActivatedRoute,
     private msgSrv: NzMessageService,
-    private service: OrderManagementService,
+    public service: OrderManagementService,
     private modalService: NzModalService,
     private amapService: AmapService,
     public service2: ShipperBaseService,
@@ -80,6 +80,7 @@ export class OrderManagementVehicleDetailChangeComponent implements OnInit {
 
   ngOnInit(): void {
     console.log(this.id)
+    this.initST();
     this.initSF3();
     this.initSF4();
     this.initData()
@@ -90,6 +91,28 @@ export class OrderManagementVehicleDetailChangeComponent implements OnInit {
       console.log(res)
       if (res) {
         this.i = res;
+        // 对装货凭证进行初始化
+        let arr : any= []
+        res.filePathList.forEach((element: any, index: any) => {
+          console.log(index)
+         arr.push(  {
+          url: element,
+          status: 'done',
+          uid: index
+        })
+        });
+        this.listImagUrls = arr;
+        let arr2 : any= []
+        res.filePathList.forEach((element: any, index: any) => {
+         arr2.push(  {
+          url: element,
+          status: 'done',
+          uid: index
+        })
+        });
+        this.listImagUrls2 = arr2;
+
+        // 对装卸货信息进行初始化
         res?.unLoadingPlaceList.forEach((element: any) => {
           if(element.type === 1 || element.type === '1') {
             const controlId = this.startInfo.length;
@@ -148,6 +171,24 @@ export class OrderManagementVehicleDetailChangeComponent implements OnInit {
   }
   // 保存修改
   save() {
+    let imgList : any= [];
+    if(this.listImagUrls.length > 0) {
+      this.listImagUrls.forEach((res :any) => {
+        if(res.url) {
+          imgList.push(res.url)
+        }
+      })
+    }
+    console.log(imgList)
+    let imgList2 : any= [];
+    if(this.listImagUrls2.length > 0) {
+      this.listImagUrls2.forEach((res :any) => {
+        if(res.url) {
+          imgList2.push(res.url)
+        }
+      })
+    }
+    console.log(imgList2)
     if(typeof(this.validateForm1.value.unloadingTime) !== 'string' ) {
       var c = new Date(this.validateForm1.value.unloadingTime);  
       this.validateForm1.value.unloadingTime = c.getFullYear() + '-' + this.addPreZero(c.getMonth() + 1) + '-' + this.addPreZero(c.getDate()) + ' ' + this.addPreZero(c.getHours()) + ':' + this.addPreZero(c.getMinutes()) + ':' + this.addPreZero(c.getSeconds())
@@ -303,11 +344,11 @@ initSF3() {
         }
       }
     },
-    required: ['goodsName', ]
+    required: ['goodsName', 'enterpriseInfoId']
   };
   this.ui3 = {
     '*': {
-      spanLabelFixed: 90,
+      spanLabelFixed: 110,
       grid: { span: 12 }
     },
     $enterpriseInfoId: {
@@ -321,6 +362,29 @@ initSF3() {
     }
   };
 }
+initST() {
+ this.logColumns = [
+    { title: '款项', index: 'costName' },
+    { title: '总费用（元）', index: 'price' },
+    { title: '协议金额（元）', render: 'price' },
+    { title: '附加费（元）', index: 'surcharge' },
+    { title: '附加费率（%）', render: 'paymentMethodRate' },
+    { 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' },
+      },
+    },
+  ];
+}
 initSF4() {
   this.schema4 = {
     properties: {
@@ -373,9 +437,25 @@ initSF4() {
           placeholder: '请输入'
         }
       },
+      loadingTime: {
+        type: 'string',
+        title: '发车时间',
+        ui: {
+          widget: 'custom',
+          placeholder: '请输入'
+        }
+      },
+      unloadingTime: {
+        type: 'string',
+        title: '到车时间',
+        ui: {
+          widget: 'custom',
+          placeholder: '请输入'
+        }
+      },
    
     },
-    required: ['weight',]
+    required: ['weight','loadingTime','unloadingTime']
   };
   this.ui4 = {
     '*': {
@@ -400,6 +480,80 @@ initSF4() {
     $drivers: {
       grid: { span: 12 }
     },
+    $loadingTime: {
+      grid: { span: 12 }
+    },
+    $unloadingTime: {
+      grid: { span: 12 }
+    },
   };
 }
+// 处理上传图片
+handlePreview1 = async (file: NzUploadFile) => {
+  if (!file.url && !file.preview) {
+    file.preview = await getBase64(file.originFileObj!);
+  }
+  this.previewImage1 = file.url || file.preview;
+  this.previewVisible1 = true;
+};
+handlePreview2 = async (file: NzUploadFile) => {
+  if (!file.url && !file.preview) {
+    file.preview = await getBase64(file.originFileObj!);
+  }
+  this.previewImage2 = file.url || file.preview;
+  this.previewVisible2 = true;
+};
+handleChange1(info: NzUploadChangeParam): void {
+  switch (info.file.status) {
+    case 'uploading':
+      break;
+    case 'done':
+      let fileList = [...info.fileList];
+      // 2. Read from response and show file link
+      console.log(fileList)
+      fileList = fileList.map((file: any) => {
+        if (file.response) {
+          file.url = file.response.data.fullFilePath;
+        }
+        return file;
+      });
+      break;
+    case 'error':
+      this.service.msgSrv.error('网络错误');
+      break;
+  }
+}
+beforeUpload = (file: NzUploadFile, _fileList: NzUploadFile[]) => {
+  return new Observable((observer: Observer<boolean>) => {
+    const isJpgOrPng = file.type === 'image/jpeg' || file.type === 'image/png' || file.type === 'image/gif' || file.type === 'image/bmp';
+    if (!isJpgOrPng) {
+      this.service.msgSrv.warning('只能上传图片!');
+      observer.complete();
+      return;
+    }
+    // tslint:disable-next-line: no-non-null-assertion
+    const isLt2M = file.size! / 1024 / 1024 < 3;
+    if (!isLt2M) {
+      this.service.msgSrv.warning('图片大小超过3兆!');
+      observer.complete();
+      return;
+    }
+    observer.next(isJpgOrPng && isLt2M);
+    observer.complete();
+  });
+};
+agreement(value: any) {
+  if(value === '1') {
+    this.imges = this.i?.supplementAgreement
+  } else if (value === '2') {
+    this.imges = this.i?.supplementAgreement
+   }
+  this.isVisible = true;
+}
+handleCancel() {
+  this.isVisible = false
+}
+handleOK() {
+this.isVisible = false
+}
 }