dendi-wang/thingsboard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UI: Refactoring code

Browse Source
This commit is contained in:
Vladyslav_Prykhodko 2022-11-02 17:23:33 +02:00
parent 6262134b08
commit 98cad2d140
1 changed files with 19 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
ui-ngx/src/app/shared/components/phone-input.component.ts
View File

@ -94,8 +94,9 @@ export class PhoneInputComponent implements OnInit, ControlValueAccessor, Valida
set isLoad(value) { set isLoad(value) {
if (this.isLoading) { if (this.isLoading) {
this.isLoading = value; this.isLoading = value;
if (this.phoneFormGroup) { if (this.phoneFormGroup && this.phoneFormGroup.get('phoneNumber').value) {
this.defineCountryFromNumber(this.phoneFormGroup.get('phoneNumber').value); const parsedPhoneNumber = this.parsePhoneNumberFromString(this.phoneFormGroup.get('phoneNumber').value);
this.defineCountryFromNumber(parsedPhoneNumber);
} }
} }
} }
@ -132,8 +133,12 @@ export class PhoneInputComponent implements OnInit, ControlValueAccessor, Valida
this.flagIcon = this.getFlagIcon(this.phoneFormGroup.get('country').value); this.flagIcon = this.getFlagIcon(this.phoneFormGroup.get('country').value);
this.changeSubscriptions.push(this.phoneFormGroup.get('phoneNumber').valueChanges.subscribe(value => { this.changeSubscriptions.push(this.phoneFormGroup.get('phoneNumber').valueChanges.subscribe(value => {
this.updateModel(); let parsedPhoneNumber = null;
this.defineCountryFromNumber(value); if (value && this.parsePhoneNumberFromString) {
parsedPhoneNumber = this.parsePhoneNumberFromString(value);
this.defineCountryFromNumber(parsedPhoneNumber);
}
this.updateModel(parsedPhoneNumber);
})); }));
this.changeSubscriptions.push(this.phoneFormGroup.get('country').valueChanges.subscribe(value => { this.changeSubscriptions.push(this.phoneFormGroup.get('country').valueChanges.subscribe(value => {
@ -183,7 +188,7 @@ export class PhoneInputComponent implements OnInit, ControlValueAccessor, Valida
return String.fromCodePoint(...countryCode.split('').map(country => this.baseCode + country.charCodeAt(0))); return String.fromCodePoint(...countryCode.split('').map(country => this.baseCode + country.charCodeAt(0)));
} }
private updateModelValue(parsedPhoneNumber: any) { private updateModelValueInFormat(parsedPhoneNumber: any) {
this.modelValue = parsedPhoneNumber.format('E.164'); this.modelValue = parsedPhoneNumber.format('E.164');
} }
@ -198,23 +203,18 @@ export class PhoneInputComponent implements OnInit, ControlValueAccessor, Valida
valid: false valid: false
} }
}; };
} else {
this.updateModelValue(parsedPhoneNumber);
} }
} }
return null; return null;
}; };
} }
private defineCountryFromNumber(phoneNumber) { private defineCountryFromNumber(parsedPhoneNumber) {
if (phoneNumber && this.parsePhoneNumberFromString) {
const parsedPhoneNumber = this.parsePhoneNumberFromString(phoneNumber);
const country = this.phoneFormGroup.get('country').value; const country = this.phoneFormGroup.get('country').value;
if (parsedPhoneNumber?.country && parsedPhoneNumber?.country !== country) { if (parsedPhoneNumber?.country && parsedPhoneNumber?.country !== country) {
this.phoneFormGroup.get('country').patchValue(parsedPhoneNumber.country, {emitEvent: true}); this.phoneFormGroup.get('country').patchValue(parsedPhoneNumber.country, {emitEvent: true});
} }
} }
}
validate(): ValidationErrors | null { validate(): ValidationErrors | null {
const phoneNumber = this.phoneFormGroup.get('phoneNumber'); const phoneNumber = this.phoneFormGroup.get('phoneNumber');
@ -249,7 +249,7 @@ export class PhoneInputComponent implements OnInit, ControlValueAccessor, Valida
const parsedPhoneNumber = this.parsePhoneNumberFromString(phoneNumber); const parsedPhoneNumber = this.parsePhoneNumberFromString(phoneNumber);
if (parsedPhoneNumber?.isValid() && parsedPhoneNumber?.isPossible()) { if (parsedPhoneNumber?.isValid() && parsedPhoneNumber?.isPossible()) {
country = parsedPhoneNumber?.country || this.defaultCountry; country = parsedPhoneNumber?.country || this.defaultCountry;
this.updateModelValue(parsedPhoneNumber); this.updateModelValueInFormat(parsedPhoneNumber);
this.isLegacy = false; this.isLegacy = false;
} else { } else {
const validators = [Validators.maxLength(255)]; const validators = [Validators.maxLength(255)];
@ -268,11 +268,14 @@ export class PhoneInputComponent implements OnInit, ControlValueAccessor, Valida
this.phoneFormGroup.reset({phoneNumber, country}, {emitEvent: false}); this.phoneFormGroup.reset({phoneNumber, country}, {emitEvent: false});
} }
private updateModel() { private updateModel(parsedPhoneNumber?) {
const phoneNumber = this.phoneFormGroup.get('phoneNumber'); const phoneNumber = this.phoneFormGroup.get('phoneNumber');
if (phoneNumber.value === '+' || phoneNumber.value === this.countryCallingCode) { if (phoneNumber.value === '+' || phoneNumber.value === this.countryCallingCode) {
this.propagateChange(null); this.propagateChange(null);
} else if (phoneNumber.valid) { } else if (phoneNumber.valid) {
if (parsedPhoneNumber) {
this.updateModelValueInFormat(parsedPhoneNumber);
}
this.propagateChange(this.modelValue); this.propagateChange(this.modelValue);
} else { } else {
this.propagateChange(null); this.propagateChange(null);