parent
0acfbc7a94
commit
ae42319586
@ -0,0 +1,80 @@ |
|||||||
|
<!-- start 面包屑 --> |
||||||
|
<app-breadcrumb></app-breadcrumb> |
||||||
|
<!-- end 面包屑 --> |
||||||
|
<div class="inner-content"> |
||||||
|
<div class="main"> |
||||||
|
<form nz-form [formGroup]="updateTwoPwdForm" *ngIf="setPayPwdStatus == true"> |
||||||
|
|
||||||
|
<nz-form-item> |
||||||
|
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>旧密码</nz-form-label> |
||||||
|
<nz-form-control [nzSm]="14" [nzXs]="24"> |
||||||
|
<input nz-input type="password" formControlName="oldPassword" placeholder="请输入您的旧支付密码" /> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
|
||||||
|
<nz-form-item> |
||||||
|
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired> |
||||||
|
<span> 新密码 </span> |
||||||
|
</nz-form-label> |
||||||
|
<nz-form-control [nzSm]="14" [nzXs]="24"> |
||||||
|
<nz-input-group [nzSuffix]="suffixTemplate"> |
||||||
|
<input nz-input [type]="passwordVisible ? 'text' : 'password'" formControlName="newPassword" placeholder="请输入您的新支付密码" /> |
||||||
|
</nz-input-group> |
||||||
|
<ng-template #suffixTemplate> |
||||||
|
<i nz-icon [nzType]="passwordVisible ? 'eye-invisible' : 'eye'" (click)="passwordVisible = !passwordVisible"></i> |
||||||
|
</ng-template> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
|
||||||
|
<nz-form-item> |
||||||
|
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>确认新密码</nz-form-label> |
||||||
|
<nz-form-control [nzSm]="14" [nzXs]="24" [nzErrorTip]="errorTpl"> |
||||||
|
<input nz-input type="password" formControlName="checkNewPassword" placeholder="请再次输入您的新支付密码" /> |
||||||
|
<ng-template #errorTpl let-control> |
||||||
|
<ng-container *ngIf="control.hasError('confirm')"> |
||||||
|
您输入的两个密码不一致! |
||||||
|
</ng-container> |
||||||
|
</ng-template> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
|
||||||
|
<nz-form-control [nzSpan]="8" > |
||||||
|
<button nz-button nzType="primary" style="margin-left: 130px;width: 200px;" (click)="submitUpdateTowPwd()">提交</button> |
||||||
|
</nz-form-control> |
||||||
|
|
||||||
|
</form> |
||||||
|
|
||||||
|
<form nz-form [formGroup]="setTwoPwdForm" *ngIf="setPayPwdStatus == false"> |
||||||
|
<nz-form-item> |
||||||
|
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired> |
||||||
|
<span> 支付密码 </span> |
||||||
|
</nz-form-label> |
||||||
|
<nz-form-control [nzSm]="14" [nzXs]="24"> |
||||||
|
<nz-input-group [nzSuffix]="suffixTemplate"> |
||||||
|
<input nz-input [type]="passwordVisible ? 'text' : 'password'" formControlName="password" placeholder="请输入您的支付密码" /> |
||||||
|
</nz-input-group> |
||||||
|
<ng-template #suffixTemplate> |
||||||
|
<i nz-icon [nzType]="passwordVisible ? 'eye-invisible' : 'eye'" (click)="passwordVisible = !passwordVisible"></i> |
||||||
|
</ng-template> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
|
||||||
|
<nz-form-item> |
||||||
|
<nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>确认密码</nz-form-label> |
||||||
|
<nz-form-control [nzSm]="14" [nzXs]="24" [nzErrorTip]="errorTpl"> |
||||||
|
<input nz-input type="password" formControlName="checkPassword" placeholder="请再次输入您的支付密码" /> |
||||||
|
<ng-template #errorTpl let-control> |
||||||
|
<ng-container *ngIf="control.hasError('confirm')"> |
||||||
|
您输入的两个密码不一致! |
||||||
|
</ng-container> |
||||||
|
</ng-template> |
||||||
|
</nz-form-control> |
||||||
|
</nz-form-item> |
||||||
|
|
||||||
|
<nz-form-control [nzSpan]="8" > |
||||||
|
<button nz-button nzType="primary" style="margin-left: 130px;width: 200px;" (click)="submitSetTowPwd()">提交</button> |
||||||
|
</nz-form-control> |
||||||
|
|
||||||
|
</form> |
||||||
|
</div> |
||||||
|
</div> |
@ -0,0 +1,3 @@ |
|||||||
|
.main { |
||||||
|
width: 500px; |
||||||
|
} |
@ -0,0 +1,25 @@ |
|||||||
|
import { async, ComponentFixture, TestBed } from '@angular/core/testing'; |
||||||
|
|
||||||
|
import { PayPwdComponent } from './pay-pwd.component'; |
||||||
|
|
||||||
|
describe('PayPwdComponent', () => { |
||||||
|
let component: PayPwdComponent; |
||||||
|
let fixture: ComponentFixture<PayPwdComponent>; |
||||||
|
|
||||||
|
beforeEach(async(() => { |
||||||
|
TestBed.configureTestingModule({ |
||||||
|
declarations: [ PayPwdComponent ] |
||||||
|
}) |
||||||
|
.compileComponents(); |
||||||
|
})); |
||||||
|
|
||||||
|
beforeEach(() => { |
||||||
|
fixture = TestBed.createComponent(PayPwdComponent); |
||||||
|
component = fixture.componentInstance; |
||||||
|
fixture.detectChanges(); |
||||||
|
}); |
||||||
|
|
||||||
|
it('should create', () => { |
||||||
|
expect(component).toBeTruthy(); |
||||||
|
}); |
||||||
|
}); |
@ -0,0 +1,139 @@ |
|||||||
|
import { Component, OnInit } from '@angular/core'; |
||||||
|
import {FormBuilder, FormControl, FormGroup, Validators} from '_@angular_forms@9.0.7@@angular/forms'; |
||||||
|
import {ValidatorsService} from '../../../services/validators.service'; |
||||||
|
import {LocalStorageService} from '../../../services/local-storage.service'; |
||||||
|
import {LoginService} from '../../../services/login.service'; |
||||||
|
import {NzMessageService, NzModalService} from '_ng-zorro-antd@9.3.0@ng-zorro-antd'; |
||||||
|
import {CommonsService} from '../../../services/commons.service'; |
||||||
|
import {CompanyTwoPwdService} from '../../../services/company-two-pwd.service'; |
||||||
|
import {HttpClient} from '_@angular_common@9.0.7@@angular/common/http'; |
||||||
|
import {IconService} from '../../../services/icon.service'; |
||||||
|
|
||||||
|
@Component({ |
||||||
|
selector: 'app-pay-pwd', |
||||||
|
templateUrl: './pay-pwd.component.html', |
||||||
|
styleUrls: ['./pay-pwd.component.scss'] |
||||||
|
}) |
||||||
|
export class PayPwdComponent implements OnInit { |
||||||
|
setPayPwdStatus = false; |
||||||
|
passwordVisible = false; |
||||||
|
setTwoPwdForm: FormGroup; // 定义表单
|
||||||
|
updateTwoPwdForm: FormGroup; // 定义表单
|
||||||
|
|
||||||
|
constructor( |
||||||
|
private storage: LocalStorageService, |
||||||
|
private loginService: LoginService, |
||||||
|
private message: NzMessageService, |
||||||
|
private commonsService: CommonsService, |
||||||
|
private companyTwoPwdService: CompanyTwoPwdService, |
||||||
|
private http: HttpClient, // http请求
|
||||||
|
private iconService: IconService, |
||||||
|
private modal: NzModalService, |
||||||
|
private fb: FormBuilder, // 表单
|
||||||
|
) { } |
||||||
|
|
||||||
|
ngOnInit(): void { |
||||||
|
this.isSetPayPwd(); |
||||||
|
|
||||||
|
this.setTwoPwdForm = this.fb.group({ |
||||||
|
password: [null, [Validators.required, ValidatorsService.minLength(6), ValidatorsService.maxLength(16)]], |
||||||
|
checkPassword: [null, [Validators.required, this.checkSetTowPwd]], |
||||||
|
}); |
||||||
|
|
||||||
|
this.updateTwoPwdForm = this.fb.group({ |
||||||
|
oldPassword: [null, [Validators.required, ValidatorsService.minLength(6), ValidatorsService.maxLength(16)]], |
||||||
|
newPassword: [null, [Validators.required, ValidatorsService.minLength(6), ValidatorsService.maxLength(16)]], |
||||||
|
checkNewPassword: [null, [Validators.required, this.checkUpdateTowPwd]], |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
|
// 设置密码
|
||||||
|
isSetPayPwd() { |
||||||
|
this.companyTwoPwdService.isSetTwoPwd(data => { |
||||||
|
if (data['return_data'] === true) { |
||||||
|
this.setPayPwdStatus = true; |
||||||
|
} else { |
||||||
|
this.setPayPwdStatus = false; |
||||||
|
} |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
|
// 设置二级密码
|
||||||
|
submitSetTowPwd(): void { |
||||||
|
for (const i in this.setTwoPwdForm.controls) { |
||||||
|
this.setTwoPwdForm.controls[i].markAsDirty(); |
||||||
|
this.setTwoPwdForm.controls[i].updateValueAndValidity(); |
||||||
|
} |
||||||
|
if (this.setTwoPwdForm.status == null || this.setTwoPwdForm.status !== 'VALID') { |
||||||
|
this.modal.warning({ |
||||||
|
nzTitle: '提示', |
||||||
|
nzContent: '请规范填写所有的必填项信息', |
||||||
|
}); |
||||||
|
return; |
||||||
|
} |
||||||
|
this.companyTwoPwdService.setTwoPwd(this.setTwoPwdForm.value, data => { |
||||||
|
if (data['return_code'] === '000000') { |
||||||
|
this.modal.success({ |
||||||
|
nzTitle: '提示', |
||||||
|
nzContent: '设置成功', |
||||||
|
}); |
||||||
|
this.setTwoPwdForm.reset(); |
||||||
|
this.isSetPayPwd(); |
||||||
|
} else { |
||||||
|
this.modal.error({ |
||||||
|
nzTitle: '提示', |
||||||
|
nzContent: data['return_msg'], |
||||||
|
}); |
||||||
|
} |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
|
checkSetTowPwd = (control: FormControl): { [s: string]: boolean } => { |
||||||
|
if (!control.value) { |
||||||
|
return { required: true }; |
||||||
|
} else if (control.value !== this.setTwoPwdForm.controls.password.value) { |
||||||
|
return { confirm: true, error: true }; |
||||||
|
} |
||||||
|
return {}; |
||||||
|
} |
||||||
|
|
||||||
|
// 修改二级密码
|
||||||
|
submitUpdateTowPwd(): void { |
||||||
|
for (const i in this.updateTwoPwdForm.controls) { |
||||||
|
this.updateTwoPwdForm.controls[i].markAsDirty(); |
||||||
|
this.updateTwoPwdForm.controls[i].updateValueAndValidity(); |
||||||
|
} |
||||||
|
if (this.updateTwoPwdForm.status == null || this.updateTwoPwdForm.status !== 'VALID') { |
||||||
|
this.modal.warning({ |
||||||
|
nzTitle: '提示', |
||||||
|
nzContent: '请规范填写所有的必填项信息', |
||||||
|
}); |
||||||
|
return; |
||||||
|
} |
||||||
|
this.companyTwoPwdService.updateTwoPwd(this.updateTwoPwdForm.value, data => { |
||||||
|
if (data['return_code'] === '000000') { |
||||||
|
this.modal.success({ |
||||||
|
nzTitle: '提示', |
||||||
|
nzContent: '修改成功', |
||||||
|
}); |
||||||
|
this.updateTwoPwdForm.reset(); |
||||||
|
this.isSetPayPwd(); |
||||||
|
} else { |
||||||
|
this.modal.error({ |
||||||
|
nzTitle: '提示', |
||||||
|
nzContent: data['return_msg'], |
||||||
|
}); |
||||||
|
} |
||||||
|
}); |
||||||
|
} |
||||||
|
|
||||||
|
checkUpdateTowPwd = (control: FormControl): { [s: string]: boolean } => { |
||||||
|
if (!control.value) { |
||||||
|
return { required: true }; |
||||||
|
} else if (control.value !== this.updateTwoPwdForm.controls.newPassword.value) { |
||||||
|
return { confirm: true, error: true }; |
||||||
|
} |
||||||
|
return {}; |
||||||
|
} |
||||||
|
|
||||||
|
} |
Loading…
Reference in new issue