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