From 532755c8a946958fcfd2daa21e0d715ef7143b57 Mon Sep 17 00:00:00 2001 From: wangshiming Date: Thu, 23 Dec 2021 16:41:02 +0800 Subject: [PATCH] =?UTF-8?q?=E8=BD=A6=E8=BE=86=E5=AF=B9=E6=8E=A5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../vehicle-detail-change.component.html | 156 ++++++++----- .../vehicle-detail-change.component.ts | 210 +++++++++++++++--- .../vehicle-detail.component.html | 18 +- .../vehicle-detail.component.ts | 18 +- 4 files changed, 311 insertions(+), 91 deletions(-) diff --git a/src/app/routes/order-management/components/vehicle-detail-change/vehicle-detail-change.component.html b/src/app/routes/order-management/components/vehicle-detail-change/vehicle-detail-change.component.html index 17cf10b1..d4b91fe2 100644 --- a/src/app/routes/order-management/components/vehicle-detail-change/vehicle-detail-change.component.html +++ b/src/app/routes/order-management/components/vehicle-detail-change/vehicle-detail-change.component.html @@ -1,7 +1,7 @@ + 查看附件     + 补充协议 - - + + +
+ +
请上传图片
+
+ + + + + + - - + + +
+ +
请上传图片
+
+ + + + + + @@ -391,4 +420,13 @@ - \ No newline at end of file + + + + + + + + + + \ No newline at end of file diff --git a/src/app/routes/order-management/components/vehicle-detail-change/vehicle-detail-change.component.ts b/src/app/routes/order-management/components/vehicle-detail-change/vehicle-detail-change.component.ts index 80d7e513..9bd0c476 100644 --- a/src/app/routes/order-management/components/vehicle-detail-change/vehicle-detail-change.component.ts +++ b/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 { + 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) => { + 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 +} } diff --git a/src/app/routes/order-management/components/vehicle-detail/vehicle-detail.component.html b/src/app/routes/order-management/components/vehicle-detail/vehicle-detail.component.html index 76137ae0..dce734c7 100644 --- a/src/app/routes/order-management/components/vehicle-detail/vehicle-detail.component.html +++ b/src/app/routes/order-management/components/vehicle-detail/vehicle-detail.component.html @@ -1,7 +1,7 @@ + 查看附件      + 补充协议 @@ -220,4 +222,14 @@ - \ No newline at end of file + + + + + + + + + + + \ No newline at end of file diff --git a/src/app/routes/order-management/components/vehicle-detail/vehicle-detail.component.ts b/src/app/routes/order-management/components/vehicle-detail/vehicle-detail.component.ts index 3c2dc482..7d7ef975 100644 --- a/src/app/routes/order-management/components/vehicle-detail/vehicle-detail.component.ts +++ b/src/app/routes/order-management/components/vehicle-detail/vehicle-detail.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 13:47:57 + * @LastEditTime: 2021-12-23 16:35:59 * @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 @@ -24,6 +24,8 @@ export class OrderManagementVehicleDetailComponent implements OnInit { id = this.route.snapshot.params.id; @ViewChild('distannce3', { static: false }) i: any= {unLoadingPlaceList:[]}; + imges: any; + isVisible = false; logColumns: STColumn[] = [ { title: '款项', index: 'costName' }, { title: '总费用（元）', index: 'price' }, @@ -86,4 +88,18 @@ export class OrderManagementVehicleDetailComponent implements OnInit { console.log(this.id) this.router.navigate(['order-management/vehicle-detailChange', this.id]) } + 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 + } }