车辆对接

This commit is contained in:
wangshiming
2021-12-21 11:05:39 +08:00
parent 6dfc1e75fc
commit f95e9336b6
13 changed files with 1114 additions and 31 deletions

View File

@ -0,0 +1,44 @@
<div class="modal-header">
<div class="modal-title">添加司机</div>
</div>
<!-- <nz-spin *ngIf="!i" class="modal-spin"></nz-spin> -->
<div class="sfBox">
<sf #sf [compact]="true" [ui]="ui" [schema]="schema" [button]="'none'" *ngIf="schema">
<ng-template sf-template="tipsA" let-me let-ui="ui" let-schema="schema">
<div class="pr">
<dl class="tips">
<dt>正面照</dt>
<dd>示例</dd>
</dl>
<div class="pa"><img width="190" src="/assets/images/eg01.png" /></div>
</div>
</ng-template>
<ng-template sf-template="tipsB" let-me let-ui="ui" let-schema="schema">
<div class="pr">
<dl class="tips">
<dt>背面照</dt>
<dd>示例</dd>
</dl>
<div class="pa"><img width="190" src="/assets/images/eg02.png" /></div>
</div>
</ng-template>
</sf>
<sf #sf1 [compact]="true" [ui]="ui" [schema]="schema1" [button]="'none'" *ngIf="schema1"></sf>
<sf #sf2 [compact]="true" [ui]="ui" [schema]="schema2" [button]="'none'" *ngIf="schema2"></sf>
<!-- <div class="example" (click)="showExample()">
查看示例
<div class="popBox" *ngIf="showCardFlag">
<img src="https://ng.ant.design/assets/img/logo.svg" alt="">
</div>
</div>
<div class="example positionSet" (click)="showJopExample()">
查看示例
<div class="popBox" *ngIf="showJopFlag">
<img src="https://ng.ant.design/assets/img/logo.svg" alt="">
</div>
</div> -->
</div>
<div class="modal-footer">
<button nz-button type="button" (click)="close()">关闭</button>
<button nz-button type="button" nzType="primary" (click)="submitForm()">确定</button>
</div>

View File

@ -0,0 +1,25 @@
.pr {
position: relative;
}
.pa {
position: absolute;
top: 35px;
left: 150px;
}
.tips {
display: flex;
margin-bottom: 0;
color: #333;
dt {
width: 150px;
}
dd {
width: 190px;
margin-bottom: 0;
text-align: center;
}
}

View File

@ -0,0 +1,24 @@
import { waitForAsync, ComponentFixture, TestBed } from '@angular/core/testing';
import { CarAddDriverComponent } from './add-driver.component';
describe('CarAddDriverComponent', () => {
let component: CarAddDriverComponent;
let fixture: ComponentFixture<CarAddDriverComponent>;
beforeEach(waitForAsync(() => {
TestBed.configureTestingModule({
declarations: [ CarAddDriverComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(CarAddDriverComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

View File

@ -0,0 +1,556 @@
import { Component, OnInit, ViewChild } from '@angular/core';
import { apiConf } from '@conf/api.conf';
import { cacheConf } from '@conf/cache.conf';
import { SFComponent, SFUISchema, SFSchema, SFUploadWidgetSchema, SFDateWidgetSchema } from '@delon/form';
import { _HttpClient } from '@delon/theme';
import { EACacheService, EAEnvironmentService } from '@shared';
import { NzModalRef } from 'ng-zorro-antd/modal';
import { Observable, Observer } from 'rxjs';
import { map } from 'rxjs/operators';
import { SupplyManagementService } from '../../services/supply-management.service';
@Component({
selector: 'app-car-add-driver',
templateUrl: './add-driver.component.html',
styleUrls: ['./add-driver.component.less']
})
export class CarAddDriverComponent implements OnInit {
@ViewChild('sf', { static: false }) sf!: SFComponent;
@ViewChild('sf1', { static: false }) sf1!: SFComponent;
@ViewChild('sf2', { static: false }) sf2!: SFComponent;
record: any = {};
i: any;
ui: SFUISchema = {};
schema: SFSchema = {};
schema1: SFSchema = {};
schema2: SFSchema = {};
showCardFlag = false;
showJopFlag = false;
detailData: any = {
identityInfoDTO: {},
userDriverLicenseDTO: {},
userPracticeSeniorityDTO: {}
};
companyData: any = {};
mobile = ''
constructor(
private modal: NzModalRef,
public service: SupplyManagementService,
private envSrv: EAEnvironmentService,
private eaCacheSrv: EACacheService,
) { }
ngOnInit(): void {
this.companyData = this.eaCacheSrv.get(cacheConf.env)
this.initSF()
}
initSF() {
this.schema = {
properties: {
titleA: {
title: '司机信息(必填)',
type: 'string',
ui: {
widget: 'text',
},
default: '照片上传后会自动识别文字并填充下列内容栏'
},
mobile: {
title: '手机号',
type: 'string',
format: 'email',
maxLength: 11,
ui: {
widget: 'text',
},
default: this.mobile
},
showName: {
title: '身份证照片',
type: 'string',
ui: {
widget: 'text',
showRequired: true,
},
default: '请上传身份证原件的高清照片,若上传复印件,则需加盖公司印章及法人签字;上传后系统会自动识别并填写',
},
tipsA: {
title: '',
type: 'string',
ui: {
widget: 'custom',
offsetControl: 6,
},
},
certificatePhotoFrontWatermark: {
type: 'string',
title: '',
ui: {
offsetControl: 6,
action: apiConf.fileUpload,
fileType: 'image/png,image/jpeg,image/jpg,image/gif',
limit: 1,
limitFileCount: 1,
resReName: 'data.fullFileWatermarkPath',
urlReName: 'data.fullFileWatermarkPath',
widget: 'upload',
descriptionI18n: '图片支持jpg、jpeg、png、gif格式大小不超过2M',
data: {
appId: this.envSrv.env.appId,
},
name: 'multipartFile',
multiple: false,
listType: 'picture-card',
change: (args) => {
if (args.type === 'success') {
this.detailData.certificatePhotoFront = args.file.response.data.fullFilePath
this.checkIdCard(args.file.response.data.fullFilePath, 'front', 0);
}
},
beforeUpload: (file: any, _fileList) => {
return new Observable((observer: Observer<boolean>) => {
const isLt2M = file.size / 1024 / 1024 < 2;
if (!isLt2M) {
this.service.msgSrv.warning('图片大小超过2M!');
observer.complete();
return;
}
observer.next(isLt2M);
observer.complete();
});
},
} as SFUploadWidgetSchema,
},
tipsB: {
title: '',
type: 'string',
ui: {
widget: 'custom',
offsetControl: 6,
},
},
certificatePhotoBackWatermark: {
type: 'string',
title: '',
ui: {
offsetControl: 6,
action: apiConf.fileUpload,
fileType: 'image/png,image/jpeg,image/jpg,image/gif',
limit: 1,
limitFileCount: 1,
resReName: 'data.fullFileWatermarkPath',
urlReName: 'data.fullFileWatermarkPath',
widget: 'upload',
descriptionI18n: '图片支持jpg、jpeg、png、gif格式大小不超过2M',
data: {
appId: this.envSrv.env.appId,
},
name: 'multipartFile',
multiple: false,
listType: 'picture-card',
change: (args) => {
if (args.type === 'success') {
this.detailData.certificatePhotoBack = args.file.response.data.fullFilePath
this.checkIdCard(args.file.response.data.fullFilePath, 'back', 0);
}
},
beforeUpload: (file: any, _fileList) => {
return new Observable((observer: Observer<boolean>) => {
const isLt2M = file.size / 1024 / 1024 < 2;
if (!isLt2M) {
this.service.msgSrv.warning('图片大小超过2M!');
observer.complete();
return;
}
observer.next(isLt2M);
observer.complete();
});
},
} as SFUploadWidgetSchema,
},
name: {
title: '姓名',
type: 'string',
maxLength: 32,
ui: {
widget: '',
placeholder: '请输入姓名',
},
},
certificateNumber: {
title: '身份证号',
type: 'string',
format: 'id-card',
minLength: 1,
maxLength: 18,
ui: {
widget: '',
placeholder: '请输入法定代表人证件号',
errors: {
required: '请输入18位身份证号码',
},
},
},
},
required: [
'certificatePhotoFrontWatermark',
'certificatePhotoBackWatermark',
'name',
'certificateNumber'
],
};
this.schema1 = {
properties: {
titleB: {
title: '驾驶证信息(必填)',
type: 'string',
ui: {
widget: 'text',
},
default: '照片上传后会自动识别文字并填充下列内容栏'
},
certificatePhotoWatermark: {
type: 'string',
title: '驾驶证照片',
ui: {
action: apiConf.fileUpload,
fileType: 'image/png,image/jpeg,image/jpg,image/gif',
limit: 1,
limitFileCount: 1,
resReName: 'data.fullFileWatermarkPath',
urlReName: 'data.fullFileWatermarkPath',
widget: 'upload',
descriptionI18n: '请上传驾驶证照片支持JPG、PNG格式文件小于5M。照片信息缺失、拼凑、过度PS、模糊不清都不会通过审核。',
data: {
appId: this.envSrv.env.appId,
},
name: 'multipartFile',
multiple: false,
listType: 'picture-card',
change: (args) => {
if (args.type === 'success') {
this.detailData.userDriverLicenseDTO.certificatePhoto = args.file.response.data.fullFilePath
this.checkDriverCard(args.file.response.data.fullFilePath, 'front', 0);
}
},
beforeUpload: (file: any, _fileList) => {
return new Observable((observer: Observer<boolean>) => {
const isLt4M = file.size / 1024 / 1024 < 4;
if (!isLt4M) {
this.service.msgSrv.warning('图片大小超过4M!');
observer.complete();
return;
}
observer.next(isLt4M);
observer.complete();
});
},
} as SFUploadWidgetSchema,
},
licenseNo: {
title: '驾驶证号',
type: 'string',
ui: {
// widget: 'text',
placeholder: '请输入',
},
// default: this.ar.snapshot.queryParams.licenseNo
},
driverModel: {
title: '准驾车型',
type: 'string',
enum: [
{label: 'A1', value: 0},
{label: 'B1', value: 1},
],
ui: {
// widget: this.detailData.commitFlag !== 0 ? 'text' : '',
placeholder: '请输入',
},
},
validStartTime: {
title: '法人证件有效开始日期',
type: 'string',
ui: {
widget: 'date',
format: 'yyyy-MM-dd',
placeholder: '请选择',
errors: {
required: '请选择起始日期',
},
change: (i) => { },
} as SFDateWidgetSchema,
},
validEndTime: {
title: '法人证件有效开始日期',
type: 'string',
ui: {
widget: 'date',
format: 'yyyy-MM-dd',
placeholder: '请选择',
errors: {
required: '请选择起始日期',
},
change: (i) => { },
} as SFDateWidgetSchema,
},
signingOrganization: {
title: '签发机关',
type: 'string',
maxLength: 30,
ui: {
// widget: this.detailData.commitFlag !== 0 ? 'text' : '',
placeholder: '请输入',
},
},
},
required: [
'certificatePhotoWatermark',
'licenseNo',
'driverModel',
'validStartTime',
'validEndTime',
],
};
this.schema2 = {
properties: {
titleC: {
title: '从业资格证(选填)',
type: 'string',
ui: {
widget: 'text',
},
default: '照片上传后会自动识别文字并填充下列内容栏',
},
certificatePhotoWatermark: {
type: 'string',
title: '',
ui: {
offsetControl: 6,
action: apiConf.fileUpload,
fileType: 'image/png,image/jpeg,image/jpg,image/gif',
limit: 1,
limitFileCount: 1,
resReName: 'data.fullFileWatermarkPath',
urlReName: 'data.fullFileWatermarkPath',
widget: 'upload',
descriptionI18n: '图片支持jpg、jpeg、png、gif格式大小不超过5M',
data: {
appId: this.envSrv.env.appId,
},
name: 'multipartFile',
multiple: false,
listType: 'picture-card',
change: (args) => {
if (args.type === 'success') {
this.detailData.userPracticeSeniorityDTO.certificatePhoto = args.file.response.data.fullFilePath
//this.checkIdCard(args.file.response.data.fullFile, 0, 0);
}
},
beforeUpload: (file: any, _fileList) => {
return new Observable((observer: Observer<boolean>) => {
const isLt2M = file.size / 1024 / 1024 < 2;
if (!isLt2M) {
this.service.msgSrv.warning('图片大小超过2M!');
observer.complete();
return;
}
observer.next(isLt2M);
observer.complete();
});
},
} as SFUploadWidgetSchema,
},
licenseNo: {
title: '从业资格证号',
type: 'string',
maxLength: 30,
ui: {
// widget: this.detailData.commitFlag !== 0 ? 'text' : '',
placeholder: '请输入',
},
},
regionCode: {
title: '签发省份',
type: 'string',
ui: {
widget: 'select',
placeholder: '请选择',
asyncData: () => this.getProvinceData(),
} as SFDateWidgetSchema,
},
validStartTime: {
title: '发证日期',
type: 'string',
ui: {
widget: 'date',
format: 'yyyy-MM-dd',
placeholder: '请选择',
errors: {
required: '请选择起始日期',
},
change: (i) => { },
} as SFDateWidgetSchema,
},
validEndTime: {
title: '有效期止',
type: 'string',
ui: {
widget: 'date',
format: 'yyyy-MM-dd',
placeholder: '请选择',
errors: {
required: '请选择起始日期',
},
change: (i) => { },
} as SFDateWidgetSchema,
},
},
required: [
],
};
this.ui = {
'*': {
spanLabelFixed: 180,
grid: { span: 24 },
width: 700,
},
$title1: {
spanLabelFixed: 0,
},
$title2: {
spanLabelFixed: 0,
},
$title3: {
spanLabelFixed: 0,
},
$title4: {
spanLabelFixed: 0,
},
$enterpriseRegistrationTime: {
width: 680,
},
$operatingEndTime: {
grid: { span: 9 },
},
$dateType: {
grid: { span: 4 },
},
$validEndTime: {
grid: { span: 9 },
},
$dateType01: {
grid: { span: 4 },
},
$registrationCapital: {
grid: { span: 12 },
},
$unit: {
spanLabelFixed: 20,
grid: { span: 3 },
},
};
}
getProvinceData() {
// return this.service.request(this.service.$api_getRegionByCode, { regionCode: '' }).pipe(
// map(res => {
// const result: any = []
// if (res) {
// res.map((m: any) => {
// const item = { label: m.name, value: m.regionCode }
// result.push(item)
// });
// }
// return result
// })
// );
}
checkIdCard(imgurl: any, side: any, type: any) {
// 识别身份证 参数side0-正面、1-背面type0-申请人身份证1-法定代表人身份证
const params = {
idCardUrl: imgurl,
side,
};
// this.service.request(this.service.$api_checkIdCard, params).subscribe((res) => {
// if (res) {
// if (type === 0) {
// // 法定代表人身份证
// if (side === 'front') {
// // 正面
// this.sf.setValue('/name', res.name);
// this.sf.setValue('/certificateNumber', res.number);
// }
// }
// }
// });
}
checkDriverCard(imgurl: any, side: any, type: any) {
// 识别身份证 参数side0-正面、1-背面type0-申请人身份证1-法定代表人身份证
const params = {
driverLicenseUrl: imgurl,
side,
};
// this.service.request(this.service.$api_recognizeDriverLicense, params).subscribe((res) => {
// if (res) {
// if (type === 0) {
// // 法定代表人身份证
// if (side === 'front') {
// // 正面
// this.sf1.setValue('/licenseNo', res.number);
// this.sf1.setValue('/driverModel', res.number);
// this.sf1.setValue('/validStartTime', res.validFrom);
// this.sf1.setValue('/validEndTime', res.validTo);
// this.sf1.setValue('/signingOrganization', res.issuingAuthority);
// }
// }
// }
// });
}
close(): void {
this.modal.destroy();
}
showExample(){
this.showCardFlag = !this.showCardFlag
}
showJopExample(){
this.showJopFlag = !this.showJopFlag
}
submitForm(){
const params:any = {
enterpriseId: this.companyData.enterpriseId,
enterpriseProjectId: this.companyData.projectId,
source: 1,
mobile: this.mobile,
identityInfoDTO:{
...this.sf.value,
certificatePhotoFront: this.detailData.certificatePhotoFront,
certificatePhotoBack: this.detailData.certificatePhotoBack,
},
userDriverLicenseDTO: {
...this.sf1.value,
certificatePhoto: this.detailData.userDriverLicenseDTO.certificatePhoto,
},
userPracticeSeniorityDTO: {
...this.sf2.value,
certificatePhoto: this.detailData.userPracticeSeniorityDTO.certificatePhoto,
},
};
params.identityInfoDTO.certificatePhotoFrontWatermark = this.sf?.value.certificatePhotoFrontWatermark
params.identityInfoDTO.certificatePhotoBackWatermark = this.sf?.value.certificatePhotoBackWatermark
params.userDriverLicenseDTO.certificatePhotoWatermark = this.sf1?.value.certificatePhotoWatermark
params.userPracticeSeniorityDTO.certificatePhotoWatermark = this.sf2?.value.certificatePhotoWatermark
delete params.identityInfoDTO.titleA;
delete params.identityInfoDTO.titleB;
delete params.identityInfoDTO.titleC;
delete params.userDriverLicenseDTO.tipsA;
delete params.userPracticeSeniorityDTO.tipsC;
delete params.showName
// this.service.request(this.service.$api_enterpriseVehicleSave, params).subscribe(res => {
// if(res){
// this.service.msgSrv.success('添加成功')
// this.close()
// }
// })
}
}