105 lines
3.6 KiB
TypeScript
105 lines
3.6 KiB
TypeScript
import { Component, Input, OnChanges, OnInit, SimpleChanges } from '@angular/core';
|
|
import { AbstractControl, UntypedFormArray, UntypedFormControl, UntypedFormGroup } from '@angular/forms';
|
|
import { VisibilityRulesService } from '@app/ui/description/editor/description-form/visibility-rules/visibility-rules.service';
|
|
import { BaseComponent } from '@common/base/base.component';
|
|
import { takeUntil } from 'rxjs/operators';
|
|
|
|
@Component({
|
|
selector: 'app-dmp-form-progress-indication',
|
|
templateUrl: './dmp-form-progress-indication.component.html',
|
|
styleUrls: ['./dmp-form-progress-indication.component.scss']
|
|
})
|
|
export class DmpFormProgressIndicationComponent extends BaseComponent implements OnInit, OnChanges {
|
|
@Input() formGroup: UntypedFormGroup;
|
|
|
|
@Input() public progressValueAccuracy = 2;
|
|
progressSoFar: number;
|
|
total: number;
|
|
percent: number;
|
|
|
|
constructor(private visibilityRulesService: VisibilityRulesService) { super(); }
|
|
|
|
public value = 0;
|
|
ngOnInit() {
|
|
this.init();
|
|
}
|
|
|
|
ngOnChanges(changes: SimpleChanges) {
|
|
if (changes.formGroup) {
|
|
this.init();
|
|
}
|
|
}
|
|
|
|
init() {
|
|
setTimeout(() => { this.calculateValueForProgressbar(); });
|
|
this.formGroup
|
|
.valueChanges
|
|
.pipe(takeUntil(this._destroyed))
|
|
.subscribe(control => {
|
|
setTimeout(() => { this.calculateValueForProgressbar(); });
|
|
});
|
|
}
|
|
|
|
calculateValueForProgressbar() {
|
|
this.progressSoFar = this.countFormControlsValidForProgress(this.formGroup);
|
|
this.total = this.countFormControlsRequiredFieldsForTotal(this.formGroup);
|
|
this.percent = (this.progressSoFar / this.total) * 100;
|
|
this.value = Number.parseFloat(this.percent.toPrecision(this.progressValueAccuracy));
|
|
}
|
|
|
|
countFormControlsValidForProgress(formControl: AbstractControl): number {
|
|
let valueCurrent = 0;
|
|
if (formControl instanceof UntypedFormControl) {
|
|
if (this.controlRequired(formControl) && this.controlEnabled(formControl) && formControl.valid) {
|
|
valueCurrent++;
|
|
}
|
|
} else if (formControl instanceof UntypedFormGroup) {
|
|
Object.keys(formControl.controls).forEach(item => {
|
|
const control = formControl.get(item);
|
|
valueCurrent = valueCurrent + this.countFormControlsValidForProgress(control);
|
|
});
|
|
} else if (formControl instanceof UntypedFormArray) {
|
|
formControl.controls.forEach(item => {
|
|
valueCurrent = valueCurrent + this.countFormControlsValidForProgress(item);
|
|
});
|
|
}
|
|
return valueCurrent;
|
|
}
|
|
|
|
countFormControlsRequiredFieldsForTotal(formControl: AbstractControl, checkVisibility = false): number {
|
|
let valueCurrent = 0;
|
|
if (formControl instanceof UntypedFormControl) {
|
|
if (this.controlRequired(formControl) && this.controlEnabled(formControl)) {
|
|
valueCurrent++;
|
|
}
|
|
} else if (formControl instanceof UntypedFormGroup) {
|
|
if (!checkVisibility || (!formControl.get('id')?.value || (this.visibilityRulesService.isVisibleMap[formControl.get('id').value] ?? true))) {
|
|
Object.keys(formControl.controls).forEach(item => {
|
|
const control = formControl.get(item);
|
|
valueCurrent = valueCurrent + this.countFormControlsRequiredFieldsForTotal(control, checkVisibility);
|
|
});
|
|
}
|
|
} else if (formControl instanceof UntypedFormArray) {
|
|
formControl.controls.forEach(item => {
|
|
valueCurrent = valueCurrent + this.countFormControlsRequiredFieldsForTotal(item, checkVisibility);
|
|
});
|
|
}
|
|
return valueCurrent;
|
|
}
|
|
|
|
controlRequired(formControl: AbstractControl) {
|
|
if (formControl.validator) {
|
|
const validator = formControl.validator({} as AbstractControl);
|
|
if (validator && validator.required) {
|
|
return true;
|
|
}
|
|
} else { return false }
|
|
}
|
|
|
|
controlEnabled(formControl: AbstractControl) {
|
|
if (formControl.enabled) {
|
|
return true;
|
|
} else { return false }
|
|
}
|
|
}
|