115 lines
4.5 KiB
TypeScript
115 lines
4.5 KiB
TypeScript
import { DataModel } from '../../entities/DataModel';
|
|
import { Component, Input, OnInit } from '@angular/core';
|
|
import { FormGroup, ValidatorFn, AbstractControl } from '@angular/forms';
|
|
|
|
import { FieldBase } from './field-base';
|
|
import { GroupBase } from '../../form/dynamic-form-group/group-base';
|
|
import { DropdownField } from '../../form/fields/dropdown/field-dropdown';
|
|
import { RuleStyle } from '../../entities/common/rulestyle';
|
|
|
|
|
|
@Component({
|
|
selector: 'df-field',
|
|
templateUrl: './dynamic-form-field.component.html'
|
|
})
|
|
|
|
export class DynamicFormFieldComponent {
|
|
@Input() dataModel: DataModel;
|
|
@Input() field: FieldBase<any>;
|
|
@Input() form: FormGroup;
|
|
|
|
get isValid() {
|
|
return this.form.controls[this.field.key].valid;
|
|
}
|
|
get isValidRequired() {
|
|
return this.form.controls[this.field.key].hasError("required");
|
|
}
|
|
get isValidPattern() {
|
|
return this.form.controls[this.field.key].hasError("pattern");
|
|
}
|
|
get isValidCustom() {
|
|
return this.form.controls[this.field.key].hasError("forbiddenName");
|
|
}
|
|
|
|
public ngOnInit() { //dropdown lists take only one of the available sources
|
|
for (var i = 0, len = this.dataModel.groups.length; i < len; i++) {
|
|
let dropdownField: any;
|
|
dropdownField = this.dataModel.groups[i].groupFields.find(x => x.controlType == "dropdown");
|
|
if (dropdownField != undefined) {
|
|
if (dropdownField.attributes.sources != undefined)
|
|
dropdownField.options = dropdownField.attributes.sources[0].params;
|
|
}
|
|
|
|
}
|
|
}
|
|
|
|
ruleVisibleMethod(field, rule, dataModel) { //visibility rule -- checks if target field is visible
|
|
dataModel.fields.forEach(fld => {
|
|
if (fld.label == rule._target && fld.visible == true)
|
|
field.visible = true;
|
|
|
|
});
|
|
if (field.visible == true)
|
|
return true;
|
|
}
|
|
FieldValueRuleMethod(field, rule) { //fieldValue rule -- checks the value of target
|
|
if (rule._ruleStyle == "range") {
|
|
this.dataModel.fields.forEach(fld => {
|
|
if (fld.key == rule._target && rule._from < fld.value < rule._to) {
|
|
console.log("visible" + fld.value)
|
|
field.visible = true;
|
|
}
|
|
|
|
});
|
|
}
|
|
if (rule._ruleStyle == "boolean") { //boolean Decision field
|
|
let ruleValue = rule.value.__text;
|
|
if (field.value.value.toString() == ruleValue) {
|
|
this.dataModel.getFieldByKey(rule._target).visible = true;
|
|
this.AddvalidationRules(rule._target);
|
|
} else {
|
|
this.dataModel.getFieldByKey(rule._target).visible = false;
|
|
}
|
|
}
|
|
if (rule._ruleStyle == "checked") { //checkbox field
|
|
if (field.value == true) {
|
|
this.dataModel.getFieldByKey(rule._target).visible = true;
|
|
this.AddvalidationRules(rule._target);
|
|
} else {
|
|
this.dataModel.getFieldByKey(rule._target).visible = false;
|
|
}
|
|
}
|
|
}
|
|
|
|
toggleVisibility(e, field, ckb) { //ckb the checkbox only send this parameter, it's essential to change the field value
|
|
if (ckb)
|
|
field.value = ckb.checked;
|
|
field.rules.forEach(rule => {
|
|
if (rule._type == "fieldValue") {
|
|
this.FieldValueRuleMethod(field, rule);
|
|
}
|
|
});
|
|
|
|
}
|
|
|
|
AddvalidationRules(field) {
|
|
if (this.dataModel.getFieldByKey(field).attributes.validation != undefined) {
|
|
this.dataModel.getFieldByKey(field).attributes.validation.forEach(rule => {
|
|
if (rule.ruleStyle.toString() == RuleStyle[RuleStyle.existence])
|
|
this.dataModel.getFieldByKey(field).required = true;
|
|
if (rule.ruleStyle.toString() == RuleStyle[RuleStyle.regex])
|
|
this.dataModel.getFieldByKey(field).regex = rule.regex;
|
|
if (rule.ruleStyle.toString() == RuleStyle[RuleStyle.customValidation])
|
|
this.form.controls[field].setValidators(this.forbiddenNameValidator(/bob/i));
|
|
});
|
|
}
|
|
|
|
}
|
|
|
|
forbiddenNameValidator(nameRe: RegExp): ValidatorFn {
|
|
return (control: AbstractControl): { [key: string]: any } => {
|
|
const forbidden = nameRe.test(control.value);
|
|
return forbidden ? { 'forbiddenName': { value: control.value } } : null;
|
|
};
|
|
}
|
|
} |