Merge branch 'ui-refactoring' of https://gitlab.eudat.eu/dmp/OpenAIRE-EUDAT-DMP-service-pilot into ui-refactoring
This commit is contained in:
commit
2bb18786b3
|
|
@ -5,7 +5,7 @@ export interface FieldData {
|
|||
}
|
||||
|
||||
export interface AutoCompleteFieldData extends FieldData {
|
||||
type: string;
|
||||
type: DatasetProfileComboBoxType;
|
||||
url: string;
|
||||
optionsRoot: string;
|
||||
autoCompleteOptions: FieldDataOption;
|
||||
|
|
|
|||
|
|
@ -1,11 +1,12 @@
|
|||
import { FormGroup } from '@angular/forms';
|
||||
import { DatasetProfileComboBoxType } from '../../../../../core/common/enum/dataset-profile-combo-box-type';
|
||||
import { AutoCompleteFieldData } from '../../../../../core/model/dataset-profile-definition/field-data/field-data';
|
||||
import { FieldDataEditorModel } from './field-data-editor-model';
|
||||
import { FieldDataOptionEditorModel } from './field-data-option-editor-model';
|
||||
|
||||
export class AutoCompleteFieldDataEditorModel extends FieldDataEditorModel<AutoCompleteFieldDataEditorModel> {
|
||||
|
||||
public type: string;
|
||||
public type: DatasetProfileComboBoxType = DatasetProfileComboBoxType.Autocomplete;
|
||||
public url: string;
|
||||
public optionsRoot: string;
|
||||
public autoCompleteOptions: FieldDataOptionEditorModel = new FieldDataOptionEditorModel();
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ import { FieldDataEditorModel } from './field-data-editor-model';
|
|||
import { FieldDataOptionEditorModel } from './field-data-option-editor-model';
|
||||
|
||||
export class WordListFieldDataEditorModel extends FieldDataEditorModel<WordListFieldDataEditorModel> {
|
||||
public type: DatasetProfileComboBoxType;
|
||||
public type: DatasetProfileComboBoxType = DatasetProfileComboBoxType.WordList;
|
||||
public options: Array<FieldDataOptionEditorModel>;
|
||||
|
||||
buildForm(): FormGroup {
|
||||
|
|
@ -27,7 +27,7 @@ export class WordListFieldDataEditorModel extends FieldDataEditorModel<WordListF
|
|||
|
||||
fromModel(item: WordListFieldData): WordListFieldDataEditorModel {
|
||||
this.type = item.type;
|
||||
if (item.options) { this.options = item.options.map(x => new FieldDataOptionEditorModel().fromModel(x)); }
|
||||
if (item.options) { this.options = item.options.map(x => new FieldDataOptionEditorModel().fromModel(x)); }
|
||||
this.label = item.label;
|
||||
return this;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -70,6 +70,7 @@ export class FieldEditorModel extends BaseFormModel {
|
|||
formGroup.addControl('visible', this.visible.buildForm());
|
||||
//formGroup.addControl("data",this.data? this.data.buildForm():this.formBuilder.group({}));
|
||||
if (this.data) { formGroup.addControl('data', this.data.buildForm()); }
|
||||
else { formGroup.addControl('data', new WordListFieldDataEditorModel().buildForm()); }
|
||||
|
||||
return formGroup;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
import { FormGroup } from '@angular/forms';
|
||||
import { Page } from '../../../../core/model/admin/dataset-profile/dataset-profile';
|
||||
import { BaseFormModel } from '../../../../core/model/base-form-model';
|
||||
import { Guid } from '../../../../common/types/guid';
|
||||
|
||||
export class PageEditorModel extends BaseFormModel {
|
||||
public title: string;
|
||||
|
|
@ -10,7 +11,7 @@ export class PageEditorModel extends BaseFormModel {
|
|||
constructor(ordinal?: number) {
|
||||
super();
|
||||
if (isNaN(ordinal)) { this.ordinal = 0; } else { this.ordinal = ordinal; }
|
||||
this.id = 'page_' + this.ordinal;
|
||||
this.id = Guid.create().toString();
|
||||
}
|
||||
|
||||
fromModel(item: Page): PageEditorModel {
|
||||
|
|
|
|||
|
|
@ -15,6 +15,5 @@ export class DatasetProfileEditorAutoCompleteFieldComponent implements OnInit {
|
|||
|
||||
ngOnInit() {
|
||||
this.data.type = DatasetProfileComboBoxType.Autocomplete;
|
||||
if (!this.form.get('data')) { this.form.addControl('data', this.data.buildForm()); }
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,9 +1,11 @@
|
|||
import { Component, Input, OnInit } from '@angular/core';
|
||||
import { FormGroup } from '@angular/forms';
|
||||
import { DatasetProfileComboBoxType } from '../../../../../../../core/common/enum/dataset-profile-combo-box-type';
|
||||
import { EnumUtils } from '../../../../../../../core/services/utilities/enum-utils.service';
|
||||
import { takeUntil } from 'rxjs/operators';
|
||||
import { BaseComponent } from '../../../../../../../core/common/base/base.component';
|
||||
import { DatasetProfileComboBoxType } from '../../../../../../../core/common/enum/dataset-profile-combo-box-type';
|
||||
import { EnumUtils } from '../../../../../../../core/services/utilities/enum-utils.service';
|
||||
import { AutoCompleteFieldDataEditorModel } from '../../../../admin/field-data/auto-complete-field-data-editor-model';
|
||||
import { WordListFieldDataEditorModel } from '../../../../admin/field-data/word-list-field-data-editor-model';
|
||||
|
||||
@Component({
|
||||
selector: 'app-dataset-profile-editor-combo-box-field-component',
|
||||
|
|
@ -20,10 +22,20 @@ export class DatasetProfileEditorComboBoxFieldComponent extends BaseComponent im
|
|||
) { super(); }
|
||||
|
||||
ngOnInit() {
|
||||
this.setupListeners();
|
||||
}
|
||||
|
||||
setupListeners() {
|
||||
this.form.get('data').get('type').valueChanges
|
||||
.pipe(takeUntil(this._destroyed))
|
||||
.subscribe(x => {
|
||||
if (this.form.get('data')) { this.form.removeControl('data'); }
|
||||
})
|
||||
if (x === DatasetProfileComboBoxType.Autocomplete) {
|
||||
this.form.addControl('data', new AutoCompleteFieldDataEditorModel().buildForm());
|
||||
} else if (x === DatasetProfileComboBoxType.WordList) {
|
||||
this.form.addControl('data', new WordListFieldDataEditorModel().buildForm());
|
||||
}
|
||||
this.setupListeners();
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -16,7 +16,8 @@
|
|||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-auto"><button mat-icon-button (click)="addNewRow()" type="button"></button>
|
||||
<mat-icon>add</mat-icon>
|
||||
<div class="col-auto">
|
||||
<button mat-icon-button (click)="addNewRow()" type="button"><mat-icon>add</mat-icon></button>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -16,7 +16,6 @@ export class DatasetProfileEditorWordListFieldComponent implements OnInit {
|
|||
|
||||
ngOnInit() {
|
||||
this.data.type = DatasetProfileComboBoxType.WordList;
|
||||
if (!this.form.get('data')) { this.form.addControl('data', this.data.buildForm()); }
|
||||
}
|
||||
|
||||
addNewRow() {
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
</mat-form-field>
|
||||
|
||||
<mat-form-field class="col">
|
||||
<mat-select placeholder="{{'DATASET-PROFILE-EDITOR.STEPS.FORM.FIELD.FIELDS.VIEW-STYLE' | translate}}" [formControl]="this.form.get('viewStyle').get('renderStyle')" (change)="onchangeCombo()">
|
||||
<mat-select placeholder="{{'DATASET-PROFILE-EDITOR.STEPS.FORM.FIELD.FIELDS.VIEW-STYLE' | translate}}" [formControl]="this.form.get('viewStyle').get('renderStyle')">
|
||||
<mat-option [value]="viewStyleEnum.BooleanDecision">{{enumUtils.toDatasetProfileFieldViewStyleString(viewStyleEnum.BooleanDecision)}}</mat-option>
|
||||
<mat-option [value]="viewStyleEnum.CheckBox">{{enumUtils.toDatasetProfileFieldViewStyleString(viewStyleEnum.CheckBox)}}</mat-option>
|
||||
<mat-option [value]="viewStyleEnum.ComboBox">{{enumUtils.toDatasetProfileFieldViewStyleString(viewStyleEnum.ComboBox)}}</mat-option>
|
||||
|
|
@ -21,7 +21,7 @@
|
|||
</mat-form-field>
|
||||
<mat-form-field class="col">
|
||||
<mat-select placeholder="{{'DATASET-PROFILE-EDITOR.STEPS.FORM.FIELD.FIELDS.VALIDATION' | translate}}" [formControl]="this.form.get('validations')" multiple>
|
||||
<mat-option *ngFor="let option of validationsOptions" [value]="option">{{enumUtils.toDatasetProfileFieldValidationTypeString(option)}}</mat-option>
|
||||
<mat-option [value]="validationTypeEnum.Required">{{enumUtils.toDatasetProfileFieldValidationTypeString(validationTypeEnum.Required)}}</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,30 +1,37 @@
|
|||
|
||||
import { Component, Input, OnInit } from '@angular/core';
|
||||
import { FormArray, FormControl, FormGroup } from '@angular/forms';
|
||||
import { takeUntil } from 'rxjs/operators';
|
||||
import { BaseComponent } from '../../../../../../core/common/base/base.component';
|
||||
import { DatasetProfileFieldViewStyle } from '../../../../../../core/common/enum/dataset-profile-field-view-style';
|
||||
import { ValidationType } from '../../../../../../core/common/enum/validation-type';
|
||||
import { EnumUtils } from '../../../../../../core/services/utilities/enum-utils.service';
|
||||
import { BooleanDecisionFieldDataEditorModel } from '../../../admin/field-data/boolean-decision-field-data-editor-model';
|
||||
import { CheckBoxFieldDataEditorModel } from '../../../admin/field-data/check-box-field-data-editor-model';
|
||||
import { FreeTextFieldDataEditorModel } from '../../../admin/field-data/free-text-field-data-editor-model';
|
||||
import { RadioBoxFieldDataEditorModel } from '../../../admin/field-data/radio-box-field-data-editor-model';
|
||||
import { TextAreaFieldDataEditorModel } from '../../../admin/field-data/text-area-field-data-editor-model';
|
||||
import { WordListFieldDataEditorModel } from '../../../admin/field-data/word-list-field-data-editor-model';
|
||||
import { RuleEditorModel } from '../../../admin/rule-editor-model';
|
||||
import { DatasetProfileFieldViewStyle } from '../../../../../../core/common/enum/dataset-profile-field-view-style';
|
||||
|
||||
@Component({
|
||||
selector: 'app-dataset-profile-editor-field-component',
|
||||
templateUrl: './dataset-profile-editor-field.component.html',
|
||||
styleUrls: ['./dataset-profile-editor-field.component.scss']
|
||||
})
|
||||
export class DatasetProfileEditorFieldComponent implements OnInit {
|
||||
export class DatasetProfileEditorFieldComponent extends BaseComponent implements OnInit {
|
||||
|
||||
@Input() form: FormGroup;
|
||||
@Input() showMultiplicity = true;
|
||||
@Input() showOrdinal = true;
|
||||
@Input() indexPath: string;
|
||||
validationsOptions: ValidationType[] = this.enumUtils.getEnumValues(ValidationType);
|
||||
validationTypeEnum = ValidationType;
|
||||
viewStyleEnum = DatasetProfileFieldViewStyle;
|
||||
isFieldMultiplicityEnabled = false;
|
||||
|
||||
constructor(
|
||||
public enumUtils: EnumUtils
|
||||
) {
|
||||
}
|
||||
) { super(); }
|
||||
|
||||
ngOnInit() {
|
||||
if (this.form.get('multiplicity')) {
|
||||
|
|
@ -33,6 +40,35 @@ export class DatasetProfileEditorFieldComponent implements OnInit {
|
|||
}
|
||||
}
|
||||
// this.addNewRule();
|
||||
|
||||
this.form.get('viewStyle').get('renderStyle').valueChanges
|
||||
.pipe(takeUntil(this._destroyed))
|
||||
.subscribe(x => {
|
||||
if (this.form.get('data')) {
|
||||
this.form.removeControl('data');
|
||||
|
||||
switch (x) {
|
||||
case DatasetProfileFieldViewStyle.BooleanDecision:
|
||||
this.form.addControl('data', new BooleanDecisionFieldDataEditorModel().buildForm());
|
||||
break;
|
||||
case DatasetProfileFieldViewStyle.CheckBox:
|
||||
this.form.addControl('data', new CheckBoxFieldDataEditorModel().buildForm());
|
||||
break;
|
||||
case DatasetProfileFieldViewStyle.ComboBox:
|
||||
this.form.addControl('data', new WordListFieldDataEditorModel().buildForm());
|
||||
break;
|
||||
case DatasetProfileFieldViewStyle.FreeText:
|
||||
this.form.addControl('data', new FreeTextFieldDataEditorModel().buildForm());
|
||||
break;
|
||||
case DatasetProfileFieldViewStyle.RadioBox:
|
||||
this.form.addControl('data', new RadioBoxFieldDataEditorModel().buildForm());
|
||||
break;
|
||||
case DatasetProfileFieldViewStyle.TextArea:
|
||||
this.form.addControl('data', new TextAreaFieldDataEditorModel().buildForm());
|
||||
break;
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
onIsFieldMultiplicityEnabledChange(isFieldMultiplicityEnabled: boolean) {
|
||||
|
|
@ -46,8 +82,4 @@ export class DatasetProfileEditorFieldComponent implements OnInit {
|
|||
const rule: RuleEditorModel = new RuleEditorModel();
|
||||
(<FormArray>this.form.get('visible').get('rules')).push(rule.buildForm());
|
||||
}
|
||||
|
||||
onchangeCombo() {
|
||||
if (this.form.get('data')) { this.form.removeControl('data'); }
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,10 +1,10 @@
|
|||
<div class="row" *ngFor="let ruleFormGroup of form['controls'] let i=index;" [formGroup]="ruleFormGroup">
|
||||
<span class="col-auto">{{i + 1}}</span>
|
||||
<mat-form-field class="col">
|
||||
<!-- <mat-form-field class="col">
|
||||
<mat-select placeholder="{{'DATASET-PROFILE-EDITOR.STEPS.FORM.RULE.FIELDS.RULE-TYPE' | translate}}" formControlName="ruleType">
|
||||
<mat-option>field value</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
</mat-form-field> -->
|
||||
<mat-form-field class="col">
|
||||
<input matInput type="text" placeholder="{{'DATASET-PROFILE-EDITOR.STEPS.FORM.RULE.FIELDS.TARGET' | translate}}" formControlName="target" (change)="targetValidation()">
|
||||
</mat-form-field>
|
||||
|
|
|
|||
|
|
@ -44,7 +44,7 @@ export class DatasetProfileEditorSectionComponent extends BaseComponent implemen
|
|||
}
|
||||
|
||||
DeleteSectionInSection(index) {
|
||||
this.dataModel.sections.splice(index);
|
||||
this.dataModel.sections.splice(index,1);
|
||||
(<FormArray>this.form.get('sections')).removeAt(index);
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -2,9 +2,8 @@
|
|||
<h3 *ngIf="isNew">{{ 'DATASET-WIZARD.TITLE.NEW' | translate }}</h3>
|
||||
<div class="row">
|
||||
<div class="col-auto">
|
||||
<h3 *ngIf="!isNew ">{{datasetWizardModel?.label}} {{ 'GENERAL.NAMES.DATASET' | translate }}</h3>
|
||||
<h3 *ngIf="this.formGroup && this.formGroup.dirty"> - {{ 'GENERAL.STATUSES.EDIT' | translate }}</h3>
|
||||
<h3 *ngIf="this.formGroup && this.formGroup.get('status').value == DatasetStatus.Finalized && viewOnly"> - {{'GENERAL.STATUSES.FINALISED' | translate }}</h3>
|
||||
<h3 *ngIf="!isNew">{{datasetWizardModel?.label}} {{ 'GENERAL.NAMES.DATASET' | translate }}<span *ngIf="this.formGroup && this.formGroup.dirty"> - {{ 'GENERAL.STATUSES.EDIT' | translate }}</span></h3>
|
||||
<h3 *ngIf="this.formGroup && this.formGroup.get('status').value == DatasetStatus.Finalized && viewOnly">{{'GENERAL.STATUSES.FINALISED' | translate }}</h3>
|
||||
</div>
|
||||
<div class="col"></div>
|
||||
<button *ngIf="!editMode && !viewOnly" class="col-auto" mat-icon-button (click)="enableForm()">
|
||||
|
|
@ -69,7 +68,7 @@
|
|||
<mat-step class="step-container">
|
||||
<ng-template matStepLabel>{{'DATASET-WIZARD.THIRD-STEP.TITLE' | translate}}</ng-template>
|
||||
<div *ngIf="this.isActiveStep(2)" class="row">
|
||||
<app-dataset-description-form class="col-12" *ngIf="formGroup && datasetWizardModel && datasetWizardModel.datasetProfileDefinition" [form]="this.formGroup.get('datasetProfileDefinition')" [dataModel]="datasetWizardModel.datasetProfileDefinition" [datasetProfileId]="formGroup.get('profile').value"></app-dataset-description-form>
|
||||
<app-dataset-description-form class="col-12" *ngIf="formGroup && datasetWizardModel && datasetWizardModel.datasetProfileDefinition" [form]="this.formGroup.get('datasetProfileDefinition')" [visibilityRules]="datasetWizardModel.datasetProfileDefinition.rules" [datasetProfileId]="formGroup.get('profile').value"></app-dataset-description-form>
|
||||
<div class="col-12 description-action-row">
|
||||
<div class="row">
|
||||
<div class="col-auto"><button matStepperPrevious mat-raised-button color="primary">{{'DATASET-WIZARD.ACTIONS.BACK' | translate}}</button></div>
|
||||
|
|
|
|||
|
|
@ -32,7 +32,7 @@ import { ConfirmationDialogComponent } from '../../../library/confirmation-dialo
|
|||
templateUrl: 'dataset-wizard.component.html',
|
||||
styleUrls: ['./dataset-wizard.component.scss']
|
||||
})
|
||||
export class DatasetWizardComponent extends BaseComponent implements OnInit, AfterViewInit, IBreadCrumbComponent {
|
||||
export class DatasetWizardComponent extends BaseComponent implements OnInit, IBreadCrumbComponent {
|
||||
|
||||
breadCrumbs: Observable<BreadcrumbItem[]>;
|
||||
viewOnly = false;
|
||||
|
|
@ -202,14 +202,12 @@ export class DatasetWizardComponent extends BaseComponent implements OnInit, Aft
|
|||
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
ngAfterViewInit() {
|
||||
this.route.params
|
||||
.pipe(takeUntil(this._destroyed))
|
||||
.subscribe((params: Params) => {
|
||||
const itemId = params['id'];
|
||||
if (itemId != null) { this.stepper.selectedIndex = 2; }
|
||||
if (itemId != null) { setTimeout(()=> this.stepper.selectedIndex = 2); }
|
||||
});
|
||||
}
|
||||
|
||||
|
|
@ -238,7 +236,7 @@ export class DatasetWizardComponent extends BaseComponent implements OnInit, Aft
|
|||
}
|
||||
|
||||
getDefinition() {
|
||||
if (this.formGroup.invalid) { this.stepper.selectedIndex = 0; return; }
|
||||
if (this.formGroup.invalid) { setTimeout(()=> this.stepper.selectedIndex = 0); return; }
|
||||
if (this.isNew) {
|
||||
this.datasetWizardService.getDefinition(this.formGroup.get('profile').value)
|
||||
.pipe(takeUntil(this._destroyed))
|
||||
|
|
|
|||
|
|
@ -1,29 +1,29 @@
|
|||
<div *ngIf="form" [id]="compositeField.id" [formGroup]="form" class="dynamic-form-composite-field row">
|
||||
<div *ngIf="form && this.visibilityRulesService.checkElementVisibility(this.form.get('id').value)" [id]="this.form.get('id').value" [formGroup]="form" class="dynamic-form-composite-field row">
|
||||
|
||||
<div *ngIf="compositeField.fields.length == 1" class="col-12">
|
||||
<div *ngIf="form.get('fields').length === 1 && this.visibilityRulesService.checkElementVisibility(form.get('fields')['controls'][0].get('id').value)" class="col-12">
|
||||
<div class="row">
|
||||
<h5 *ngIf="compositeField.title" style="font-weight:bold; color: #3a3737;" class="col-12">{{compositeField.numbering}} {{compositeField.title}}
|
||||
<h5 *ngIf="form.get('title').value" style="font-weight:bold; color: #3a3737;" class="col-12">{{form.get('numbering').value}} {{form.get('title').value}}
|
||||
<!-- <a *ngIf="this.markForConsiderationService.exists(compositeField)" (click)="markForConsideration()" style="cursor: pointer">
|
||||
Mark For Consideration
|
||||
</a> -->
|
||||
</h5>
|
||||
<h6 *ngIf="compositeField.description">{{compositeField.description}}</h6>
|
||||
<h6 *ngIf="compositeField.extendedDescription" class="col-12">
|
||||
<i>{{compositeField.extendedDescription}}</i>
|
||||
<h6 *ngIf="form.get('description').value">{{form.get('description').value}}</h6>
|
||||
<h6 *ngIf="form.get('extendedDescription').value" class="col-12">
|
||||
<i>{{form.get('extendedDescription').value}}</i>
|
||||
</h6>
|
||||
<app-form-field class="col-12" [field]="compositeField.fields[0]" [datasetProfileId]="datasetProfileId"></app-form-field>
|
||||
<app-form-field class="col-12" [form]="form.get('fields')['controls'][0]" [datasetProfileId]="datasetProfileId"></app-form-field>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="compositeField.fields.length > 1" class="col-12">
|
||||
<div *ngIf="form.get('fields').length > 1" class="col-12">
|
||||
<div class="row">
|
||||
<h5 *ngIf="compositeField.title" style="font-weight:bold; color: #3a3737;" class="col-12">{{compositeField.numbering}} {{compositeField.title}}</h5>
|
||||
<h5 *ngIf="compositeField.description" class="col-12">{{compositeField.description}}</h5>
|
||||
<h5 *ngIf="compositeField.extendedDescription" class="col-12">
|
||||
<i>{{compositeField.extendedDescription}}</i>
|
||||
<h5 *ngIf="form.get('title').value" style="font-weight:bold; color: #3a3737;" class="col-12">{{form.get('numbering').value}} {{form.get('title').value}}</h5>
|
||||
<h5 *ngIf="form.get('description').value" class="col-12">{{form.get('description').value}}</h5>
|
||||
<h5 *ngIf="form.get('extendedDescription').value" class="col-12">
|
||||
<i>{{form.get('extendedDescription').value}}</i>
|
||||
</h5>
|
||||
<div *ngFor="let field of compositeField.fields; let i = index; trackBy: trackByFn " class="col-12">
|
||||
<div *ngFor="let fieldFormGroup of form.get('fields')['controls']; let i = index;" class="col-12">
|
||||
<div class="row">
|
||||
<div class="col-12" *ngIf="(field?.multiplicity?.max - 1) > (field?.multiplicityItems?.length)">
|
||||
<div class="col-12" *ngIf="(fieldFormGroup.get('multiplicity')?.value?.max - 1) > (fieldFormGroup.get('multiplicityItems')?.length)">
|
||||
<a (click)="addMultipleField(i)" style="cursor: pointer">
|
||||
Add one more field +
|
||||
</a>
|
||||
|
|
@ -31,10 +31,10 @@
|
|||
</div>
|
||||
|
||||
<div class="row">
|
||||
<app-form-field [field]="field" class="col-12" [datasetProfileId]="datasetProfileId"></app-form-field>
|
||||
<div *ngIf="field" class="col-12">
|
||||
<div *ngFor="let multipleField of field.multiplicityItems; let j = index; trackBy: trackByFn" class="row">
|
||||
<app-form-field class="col-12" [field]="multipleField" [datasetProfileId]="datasetProfileId"></app-form-field>
|
||||
<app-form-field [form]="fieldFormGroup" class="col-12" [datasetProfileId]="datasetProfileId"></app-form-field>
|
||||
<div *ngIf="fieldFormGroup" class="col-12">
|
||||
<div *ngFor="let multipleField of fieldFormGroup.get('multiplicityItems')['controls']; let j = index" class="row">
|
||||
<app-form-field class="col-12" [form]="multipleField" [datasetProfileId]="datasetProfileId"></app-form-field>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -8,29 +8,29 @@ import { VisibilityRulesService } from '../../visibility-rules/visibility-rules.
|
|||
templateUrl: './form-composite-field.component.html',
|
||||
styleUrls: ['./form-composite-field.component.scss']
|
||||
})
|
||||
export class FormCompositeFieldComponent implements OnInit {
|
||||
export class FormCompositeFieldComponent {
|
||||
|
||||
@Input() compositeField: DatasetDescriptionCompositeFieldEditorModel;
|
||||
// @Input() compositeField: DatasetDescriptionCompositeFieldEditorModel;
|
||||
@Input() datasetProfileId: String;
|
||||
form: FormGroup;
|
||||
trackByFn = (index, item) => item ? item['id'] : null;
|
||||
@Input() form: FormGroup;
|
||||
//trackByFn = (index, item) => item ? item['id'] : null;
|
||||
|
||||
constructor(
|
||||
private visibilityRulesService: VisibilityRulesService,
|
||||
public visibilityRulesService: VisibilityRulesService,
|
||||
//private markForConsiderationService: MarkForConsiderationService,
|
||||
) {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
if (this.compositeField) {
|
||||
this.form = this.visibilityRulesService.getFormGroup(this.compositeField.id);
|
||||
}
|
||||
}
|
||||
// ngOnInit() {
|
||||
// if (this.compositeField) {
|
||||
// this.form = this.visibilityRulesService.getFormGroup(this.compositeField.id);
|
||||
// }
|
||||
// }
|
||||
|
||||
addMultipleField(fieldIndex: number) {
|
||||
const field: DatasetDescriptionFieldEditorModel = this.compositeField.fields[fieldIndex].cloneForMultiplicity(fieldIndex, '');
|
||||
this.compositeField.fields[fieldIndex].multiplicityItems.push(field);
|
||||
(<FormArray>(this.form.get('fields').get('' + fieldIndex).get('multiplicityItems'))).push(field.buildForm());
|
||||
// const field: DatasetDescriptionFieldEditorModel = this.compositeField.fields[fieldIndex].cloneForMultiplicity(fieldIndex, '');
|
||||
// this.compositeField.fields[fieldIndex].multiplicityItems.push(field);
|
||||
// (<FormArray>(this.form.get('fields').get('' + fieldIndex).get('multiplicityItems'))).push(field.buildForm());
|
||||
}
|
||||
|
||||
// markForConsideration() {
|
||||
|
|
|
|||
|
|
@ -1,27 +1,26 @@
|
|||
<div *ngIf="form && field" [id]="field.id" [formGroup]="form" [ngSwitch]="field.viewStyle.renderStyle" class="dynamic-form-field row">
|
||||
<div *ngIf="form && this.visibilityRulesService.checkElementVisibility(this.form.get('id').value)" [id]="this.form.get('id').value" [formGroup]="form" [ngSwitch]="this.form.get('viewStyle').value.renderStyle" class="dynamic-form-field row">
|
||||
|
||||
<!-- <h5 *ngIf="field.title">{{field.title}}</h5> -->
|
||||
<h5 *ngIf="this.form.get('title').value">{{this.form.get('title').value}}</h5>
|
||||
|
||||
|
||||
<h5 *ngIf="field.description" class="col-12">{{field.description}}</h5>
|
||||
<h5 *ngIf="field.extendedDescription" class="col-12"><i>{{field.extendedDescription}}</i></h5>
|
||||
<h5 *ngIf="this.form.get('description').value" class="col-12">{{this.form.get('description').value}}</h5>
|
||||
<h5 *ngIf="this.form.get('extendedDescription').value" class="col-12"><i>{{this.form.get('extendedDescription').value}}</i></h5>
|
||||
|
||||
<mat-form-field *ngSwitchCase="datasetProfileFieldViewStyleEnum.FreeText" class="col-12">
|
||||
<input matInput formControlName="value" placeholder="{{field.data.label}}" [required]="field.validationRequired">
|
||||
<input matInput formControlName="value" placeholder="{{form.get('data').value.label}}" [required]="form.get('validationRequired').value">
|
||||
<mat-error *ngIf="form.get('value')['errors'] && form.get('value')['errors']['required']">{{'GENERAL.VALIDATION.REQUIRED'
|
||||
| translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
|
||||
<div *ngSwitchCase="datasetProfileFieldViewStyleEnum.ComboBox" class="col-12">
|
||||
<div class="row">
|
||||
<mat-form-field class="col-md-12" *ngIf="this.field.data.type === datasetProfileComboBoxTypeEnum.Autocomplete">
|
||||
<mat-form-field class="col-md-12" *ngIf="form.get('data').value.type === datasetProfileComboBoxTypeEnum.Autocomplete">
|
||||
<app-single-auto-complete placeholder="{{ form.get('data').value.label | translate }}" [formControl]="form.get('value')" [configuration]="singleAutoCompleteConfiguration">
|
||||
</app-single-auto-complete>
|
||||
<mat-error *ngIf="form.get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
<mat-form-field *ngIf="this.field.data.type === datasetProfileComboBoxTypeEnum.WordList" class="col-md-12">
|
||||
<mat-select [formControl]="form.get('value')" [required]="field.validationRequired">
|
||||
<mat-option *ngFor="let opt of field.data.options" [value]="assignDropdownItem(opt)">{{opt.label}}</mat-option>
|
||||
<mat-form-field *ngIf="form.get('data').value.type === datasetProfileComboBoxTypeEnum.WordList" class="col-md-12">
|
||||
<mat-select [formControl]="form.get('value')" [required]="form.get('validationRequired').value">
|
||||
<mat-option *ngFor="let opt of form.get('data').value.options" [value]="assignDropdownItem(opt)">{{opt.label}}</mat-option>
|
||||
</mat-select>
|
||||
<mat-error *ngIf="form.get('value').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
|
|
@ -29,11 +28,11 @@
|
|||
</div>
|
||||
|
||||
<div *ngSwitchCase="datasetProfileFieldViewStyleEnum.CheckBox" class="col-12">
|
||||
<mat-checkbox [formControl]="form.get('value')" [required]="field.validationRequired">{{field.data.label}}</mat-checkbox>
|
||||
<mat-checkbox [formControl]="form.get('value')" [required]="form.get('validationRequired').value">{{form.get('data').value.label}}</mat-checkbox>
|
||||
</div>
|
||||
|
||||
<mat-form-field *ngSwitchCase="datasetProfileFieldViewStyleEnum.TextArea" class="col-12">
|
||||
<textarea matInput formControlName="value" matTextareaAutosize matAutosizeMinRows="2" matAutosizeMaxRows="10" [required]="field.validationRequired"></textarea>
|
||||
<textarea matInput formControlName="value" matTextareaAutosize matAutosizeMinRows="2" matAutosizeMaxRows="10" [required]="form.get('validationRequired').value"></textarea>
|
||||
<button mat-icon-button *ngIf="!form.get('value').disabled && form.get('value').value" matSuffix aria-label="Clear" (click)="this.form.patchValue({'value': ''})">
|
||||
<mat-icon>close</mat-icon>
|
||||
</button>
|
||||
|
|
@ -41,16 +40,16 @@
|
|||
</mat-form-field>
|
||||
|
||||
<div *ngSwitchCase="datasetProfileFieldViewStyleEnum.BooleanDecision" class="col-12">
|
||||
<mat-radio-group [formControl]="form.get('value')" [required]="field.validationRequired">
|
||||
<mat-radio-button class="radio-button-item" name="{{field.id}}" value="true">Yes</mat-radio-button>
|
||||
<mat-radio-group [formControl]="form.get('value')" [required]="form.get('validationRequired').value">
|
||||
<mat-radio-button class="radio-button-item" name="{{form.get('id').value}}" value="true">Yes</mat-radio-button>
|
||||
<!-- <br> -->
|
||||
<mat-radio-button class="radio-button-item" name="{{field.id}}" value="false">No</mat-radio-button>
|
||||
<mat-radio-button class="radio-button-item" name="{{form.get('id').value}}" value="false">No</mat-radio-button>
|
||||
</mat-radio-group>
|
||||
</div>
|
||||
|
||||
<div *ngSwitchCase="datasetProfileFieldViewStyleEnum.RadioBox" class="col-12">
|
||||
<mat-radio-group [formControl]="form.get('value')" [required]="field.validationRequired">
|
||||
<mat-radio-button *ngFor="let option of field.data.options let index = index" class="radio-button-item" [value]="option.value">{{option.label}}</mat-radio-button>
|
||||
<mat-radio-group [formControl]="form.get('value')" [required]="form.get('validationRequired').value">
|
||||
<mat-radio-button *ngFor="let option of form.get('data').value.options let index = index" class="radio-button-item" [value]="option.value">{{option.label}}</mat-radio-button>
|
||||
</mat-radio-group>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,11 +1,9 @@
|
|||
import { Component, Input, OnInit } from '@angular/core';
|
||||
import { FormGroup } from '@angular/forms';
|
||||
import { Subscription } from 'rxjs';
|
||||
import { takeUntil } from 'rxjs/operators';
|
||||
import { BaseComponent } from '../../../../../core/common/base/base.component';
|
||||
import { DatasetProfileComboBoxType } from '../../../../../core/common/enum/dataset-profile-combo-box-type';
|
||||
import { DatasetProfileFieldViewStyle } from '../../../../../core/common/enum/dataset-profile-field-view-style';
|
||||
import { Field } from '../../../../../core/model/dataset-profile-definition/field';
|
||||
import { DatasetExternalAutocompleteCriteria } from '../../../../../core/query/dataset/daatset-external-autocomplete-criteria';
|
||||
import { RequestItem } from '../../../../../core/query/request-item';
|
||||
import { DatasetExternalAutocompleteService } from '../../../../../core/services/dataset/dataset-external-autocomplete.service';
|
||||
|
|
@ -18,12 +16,13 @@ import { VisibilityRulesService } from '../../visibility-rules/visibility-rules.
|
|||
styleUrls: ['./form-field.component.scss']
|
||||
})
|
||||
export class FormFieldComponent extends BaseComponent implements OnInit {
|
||||
@Input() field: Field;
|
||||
@Input() datasetProfileId: String;
|
||||
form: FormGroup;
|
||||
|
||||
change: Subscription;
|
||||
trackByFn = (index, item) => item ? item['id'] : null;
|
||||
// @Input() field: Field;
|
||||
@Input() form: FormGroup;
|
||||
@Input() datasetProfileId: String;
|
||||
|
||||
// change: Subscription;
|
||||
// trackByFn = (index, item) => item ? item['id'] : null;
|
||||
|
||||
public singleAutoCompleteConfiguration: SingleAutoCompleteConfiguration;
|
||||
datasetProfileFieldViewStyleEnum = DatasetProfileFieldViewStyle;
|
||||
|
|
@ -35,31 +34,32 @@ export class FormFieldComponent extends BaseComponent implements OnInit {
|
|||
) { super(); }
|
||||
|
||||
ngOnInit() {
|
||||
if (this.field) {
|
||||
//if (this.field) {
|
||||
|
||||
// Setup autocomplete configuration if needed
|
||||
if (this.field.viewStyle.renderStyle === DatasetProfileFieldViewStyle.ComboBox && this.field.data.type === DatasetProfileComboBoxType.Autocomplete) {
|
||||
this.singleAutoCompleteConfiguration = {
|
||||
filterFn: this.searchFromAutocomplete.bind(this),
|
||||
initialItems: (extraData) => this.searchFromAutocomplete(''),
|
||||
displayFn: (item) => item['label'],
|
||||
titleFn: (item) => item['label']
|
||||
};
|
||||
}
|
||||
|
||||
this.form = this.visibilityRulesService.getFormGroup(this.field.id);
|
||||
this.change = this.form.get('value').valueChanges
|
||||
.pipe(takeUntil(this._destroyed))
|
||||
.subscribe(item => {
|
||||
this.visibilityRulesService.updateValueAndVisibility(this.field.id);
|
||||
});
|
||||
// Setup autocomplete configuration if needed
|
||||
if (this.form.get('viewStyle').value.renderStyle === DatasetProfileFieldViewStyle.ComboBox && this.form.get('data').value.type === DatasetProfileComboBoxType.Autocomplete) {
|
||||
this.singleAutoCompleteConfiguration = {
|
||||
filterFn: this.searchFromAutocomplete.bind(this),
|
||||
initialItems: (extraData) => this.searchFromAutocomplete(''),
|
||||
displayFn: (item) => item['label'],
|
||||
titleFn: (item) => item['label']
|
||||
};
|
||||
}
|
||||
|
||||
// this.form = this.visibilityRulesService.getFormGroup(this.field.id);
|
||||
this.form.get('value').valueChanges
|
||||
.pipe(takeUntil(this._destroyed))
|
||||
.subscribe(item => {
|
||||
this.visibilityRulesService.updateValueAndVisibility(this.form.get('id').value, item);
|
||||
});
|
||||
}
|
||||
// }
|
||||
|
||||
searchFromAutocomplete(query: string) {
|
||||
const autocompleteRequestItem: RequestItem<DatasetExternalAutocompleteCriteria> = new RequestItem();
|
||||
autocompleteRequestItem.criteria = new DatasetExternalAutocompleteCriteria();
|
||||
autocompleteRequestItem.criteria.fieldID = this.field.id;
|
||||
|
||||
autocompleteRequestItem.criteria.fieldID = this.form.get('id').value;
|
||||
autocompleteRequestItem.criteria.profileID = this.datasetProfileId;
|
||||
return this.datasetExternalAutocompleteService.queryAutocomplete(autocompleteRequestItem);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,29 +1,28 @@
|
|||
<div class="dynamic-form-section row">
|
||||
<div class="dynamic-form-section row" [id]="this.form.get('id').value">
|
||||
<mat-accordion class="col-12">
|
||||
<mat-expansion-panel class="row expansion-panel" expanded=true>
|
||||
<mat-expansion-panel-header>
|
||||
<mat-panel-title>
|
||||
<h6>{{section.numbering}} {{section.title}}</h6>
|
||||
<h6>{{form.get('numbering').value}} {{form.get('title').value}}</h6>
|
||||
</mat-panel-title>
|
||||
<mat-panel-description>
|
||||
<h3 *ngIf="section.description">{{section.description}}</h3>
|
||||
<!-- <h4 *ngIf="section.extendedDescription">{{section.extendedDescription}}</h4> -->
|
||||
<h3 *ngIf="form.get('description').value">{{form.get('description').value}}</h3>
|
||||
</mat-panel-description>
|
||||
</mat-expansion-panel-header>
|
||||
|
||||
<div *ngFor="let compositeField of section.compositeFields; let i = index; trackBy: trackByFn" class="col-12">
|
||||
<div *ngIf="isElementVisible(compositeField)" class="row">
|
||||
<div *ngIf="(compositeField?.multiplicity?.max - 1) > (compositeField?.multiplicityItems?.length)" class="col-12">
|
||||
<div *ngFor="let compositeFieldFormGroup of form.get('compositeFields')['controls']; let i = index;" class="col-12">
|
||||
<!-- <div *ngIf="isElementVisible(compositeField)" class="row"> -->
|
||||
<div class="row">
|
||||
<div *ngIf="(compositeFieldFormGroup.get('multiplicity').value.max - 1) > (compositeFieldFormGroup.get('multiplicityItems').length)" class="col-12">
|
||||
<button mat-button color="primary" (click)="addMultipleField(i)">
|
||||
Add one more fieldset +
|
||||
</button>
|
||||
</div>
|
||||
<app-form-composite-field class="col-12" [compositeField]="compositeField" [datasetProfileId]="datasetProfileId"></app-form-composite-field>
|
||||
<app-form-composite-field class="col-12" [form]="compositeFieldFormGroup" [datasetProfileId]="datasetProfileId"></app-form-composite-field>
|
||||
<div *ngIf="compositeField" class="col-12">
|
||||
<div class="row">
|
||||
<app-form-composite-field class="col-12" *ngFor="let multipleCompositeField of compositeField.multiplicityItems; let j = index; trackBy: trackByFn"
|
||||
[compositeField]="multipleCompositeField" [datasetProfileId]="datasetProfileId"></app-form-composite-field>
|
||||
<mat-form-field *ngIf="compositeField.hasCommentField" class="col-12" [formGroup]="form.get('compositeFields').get(''+i)">
|
||||
<app-form-composite-field class="col-12" *ngFor="let multipleCompositeFieldFormGroup of compositeFieldFormGroup.get('multiplicityItems')['controls']; let j = index" [form]="multipleCompositeFieldFormGroup" [datasetProfileId]="datasetProfileId"></app-form-composite-field>
|
||||
<mat-form-field *ngIf="compositeFieldFormGroup.get('hasCommentField').value" class="col-12" [formGroup]="compositeFieldFormGroup">
|
||||
<input matInput formControlName="commentFieldValue" placeholder="comment">
|
||||
</mat-form-field>
|
||||
<div class="col"></div>
|
||||
|
|
@ -34,11 +33,11 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="section?.sections" class="col-12">
|
||||
<div *ngFor="let itemsection of section.sections; let j = index;" class="row">
|
||||
<app-form-section class="col-12" [section]="itemsection" [path]="path+'.'+(j+1)" [pathName]="pathName+'.sections.'+j" [datasetProfileId]="datasetProfileId"></app-form-section>
|
||||
<div *ngIf="form.get('sections')" class="col-12">
|
||||
<div *ngFor="let subSectionFormGroup of form.get('sections')['controls']; let j = index;" class="row">
|
||||
<app-form-section class="col-12" [form]="subSectionFormGroup" [path]="path+'.'+(j+1)" [pathName]="pathName+'.sections.'+j" [datasetProfileId]="datasetProfileId"></app-form-section>
|
||||
</div>
|
||||
</div>
|
||||
</mat-expansion-panel>
|
||||
</mat-accordion>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,5 @@
|
|||
import { AfterViewInit, Component, Input, OnInit } from '@angular/core';
|
||||
import { FormArray, FormGroup } from '@angular/forms';
|
||||
import { CompositeField } from '../../../../../core/model/dataset-profile-definition/composite-field';
|
||||
import { DatasetDescriptionCompositeFieldEditorModel, DatasetDescriptionSectionEditorModel } from '../../dataset-description-form.model';
|
||||
import { FormGroup } from '@angular/forms';
|
||||
import { FormFocusService } from '../../form-focus/form-focus.service';
|
||||
import { VisibilityRulesService } from '../../visibility-rules/visibility-rules.service';
|
||||
|
||||
|
|
@ -10,46 +8,40 @@ import { VisibilityRulesService } from '../../visibility-rules/visibility-rules.
|
|||
templateUrl: './form-section.component.html',
|
||||
styleUrls: ['./form-section.component.scss']
|
||||
})
|
||||
export class FormSectionComponent implements OnInit, AfterViewInit {
|
||||
export class FormSectionComponent implements OnInit {
|
||||
|
||||
// @Input() section: DatasetDescriptionSectionEditorModel;
|
||||
@Input() datasetProfileId: String;
|
||||
@Input() section: DatasetDescriptionSectionEditorModel;
|
||||
form: FormGroup;
|
||||
@Input() form: FormGroup;
|
||||
@Input() pathName: string;
|
||||
@Input() path: string;
|
||||
trackByFn = (index, item) => item ? item['id'] : null;
|
||||
//trackByFn = (index, item) => item ? item['id'] : null;
|
||||
constructor(
|
||||
private visibilityRulesService: VisibilityRulesService,
|
||||
private formFocusService: FormFocusService
|
||||
) { }
|
||||
|
||||
ngOnInit() {
|
||||
if (this.section) {
|
||||
this.form = this.visibilityRulesService.getFormGroup(this.section.id);
|
||||
}
|
||||
// if (this.section) {
|
||||
// this.form = this.visibilityRulesService.getFormGroup(this.section.id);
|
||||
// }
|
||||
}
|
||||
|
||||
ngAfterViewInit() {
|
||||
this.visibilityRulesService.triggerVisibilityEvaluation();
|
||||
}
|
||||
// ngAfterViewInit() {
|
||||
// this.visibilityRulesService.triggerVisibilityEvaluation();
|
||||
// }
|
||||
|
||||
addMultipleField(fieldsetIndex: number) {
|
||||
const compositeField: DatasetDescriptionCompositeFieldEditorModel = this.section.compositeFields[fieldsetIndex].cloneForMultiplicity(fieldsetIndex);
|
||||
this.section.compositeFields[fieldsetIndex].multiplicityItems.push(compositeField);
|
||||
(<FormArray>(this.form.get('compositeFields').get('' + fieldsetIndex).get('multiplicityItems'))).push(compositeField.buildForm());
|
||||
}
|
||||
// addMultipleField(fieldsetIndex: number) {
|
||||
// const compositeField: DatasetDescriptionCompositeFieldEditorModel = this.section.compositeFields[fieldsetIndex].cloneForMultiplicity(fieldsetIndex);
|
||||
// this.section.compositeFields[fieldsetIndex].multiplicityItems.push(compositeField);
|
||||
// (<FormArray>(this.form.get('compositeFields').get('' + fieldsetIndex).get('multiplicityItems'))).push(compositeField.buildForm());
|
||||
// }
|
||||
|
||||
isElementVisible(fieldSet: CompositeField): boolean {
|
||||
if (!fieldSet) { return false; }
|
||||
for (let i = 0; i < fieldSet.fields.length; i++) {
|
||||
if (fieldSet.fields[i]) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
return false;
|
||||
}
|
||||
// isElementVisible(fieldSet: CompositeField): boolean {
|
||||
// return fieldSet && fieldSet.fields && fieldSet.fields.length > 0
|
||||
// }
|
||||
|
||||
next(compositeField: CompositeField) {
|
||||
this.formFocusService.focusNext(compositeField);
|
||||
}
|
||||
// next(compositeField: CompositeField) {
|
||||
// this.formFocusService.focusNext(compositeField);
|
||||
// }
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,14 +2,14 @@
|
|||
<div class="dynamic-form-editor row">
|
||||
<app-form-progress-indication class="col-12" *ngIf="form" [formGroup]="form"></app-form-progress-indication>
|
||||
|
||||
<div *ngIf='datasetProfileDefinitionModel' class="col-12" id="form-container">
|
||||
<div class="col-12" id="form-container">
|
||||
<mat-vertical-stepper #stepper [linear]="false">
|
||||
<div *ngFor="let page of datasetProfileDefinitionModel.pages; let z=index; trackBy: pageTrackByFn">
|
||||
<div *ngFor="let section of page.sections; let i = index; trackBy: trackByFn">
|
||||
<mat-step [stepControl]="section">
|
||||
<ng-template matStepLabel>{{page.title}}</ng-template>
|
||||
<div *ngFor="let pageFormGroup of form.get('pages')['controls']; let z = index;">
|
||||
<div *ngFor="let sectionFormGroup of pageFormGroup.get('sections')['controls']; let i = index;">
|
||||
<mat-step [stepControl]="sectionFormGroup">
|
||||
<ng-template matStepLabel>{{pageFormGroup.get('title').value}}</ng-template>
|
||||
<div *ngIf="stepper.selectedIndex == z" class="row">
|
||||
<app-form-section class="col-12" [section]="section" [path]="z+1" [pathName]="'pages.'+z+'.sections.'+i" [datasetProfileId]="datasetProfileId"></app-form-section>
|
||||
<app-form-section class="col-12" [form]="sectionFormGroup" [path]="z+1" [pathName]="'pages.'+z+'.sections.'+i" [datasetProfileId]="datasetProfileId"></app-form-section>
|
||||
</div>
|
||||
</mat-step>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -21,23 +21,23 @@ import { VisibilityRulesService } from './visibility-rules/visibility-rules.serv
|
|||
})
|
||||
export class DatasetDescriptionFormComponent extends BaseComponent implements OnInit, AfterViewInit {
|
||||
|
||||
pathName: string;
|
||||
pages: Array<number>;
|
||||
activeStepperIndex = 1;
|
||||
visibleSidebar = false;
|
||||
datasetProfileDefinitionModel: DatasetDescriptionFormEditorModel;
|
||||
private currentPageIndex = 0;
|
||||
@ViewChild('stepper') stepper: MatStepper;
|
||||
// pathName: string;
|
||||
// pages: Array<number>;
|
||||
// activeStepperIndex = 1;
|
||||
// visibleSidebar = false;
|
||||
// datasetProfileDefinitionModel: DatasetDescriptionFormEditorModel;
|
||||
// private currentPageIndex = 0;
|
||||
// @ViewChild('stepper') stepper: MatStepper;
|
||||
|
||||
@Input() dataModel: DatasetProfileDefinitionModel;
|
||||
// //@Input() dataModel: DatasetProfileDefinitionModel;
|
||||
@Input() path: string;
|
||||
@Input() form: FormGroup;
|
||||
@Input() visibilityRules: Rule[] = [];
|
||||
// id: string;
|
||||
// trackByFn = (index, item) => item ? item['id'] : null;
|
||||
// pageTrackByFn = (index, item) => item['id'];
|
||||
@Input() datasetProfileId: String;
|
||||
id: string;
|
||||
trackByFn = (index, item) => item ? item['id'] : null;
|
||||
pageTrackByFn = (index, item) => item['id'];
|
||||
|
||||
// @Input() datasetId: string;
|
||||
|
||||
constructor(
|
||||
private router: Router,
|
||||
|
|
@ -49,78 +49,77 @@ export class DatasetDescriptionFormComponent extends BaseComponent implements On
|
|||
//this.datasetId = route.snapshot.params['id'];
|
||||
}
|
||||
|
||||
getSubForm(subformName) {
|
||||
return this.form.controls[subformName];
|
||||
}
|
||||
// getSubForm(subformName) {
|
||||
// return this.form.controls[subformName];
|
||||
// }
|
||||
|
||||
ngOnInit() {
|
||||
|
||||
const rules: Rule[] = this.dataModel.rules;
|
||||
this.visibilityRulesService.formGroup = this.form;
|
||||
this.visibilityRulesService.buildVisibilityRules(rules);
|
||||
this.datasetProfileDefinitionModel = new DatasetDescriptionFormEditorModel().fromModel(this.dataModel);
|
||||
this.visibilityRulesService.setModel(this.datasetProfileDefinitionModel);
|
||||
// this.visibilityRulesService.formGroup = this.form;
|
||||
this.visibilityRulesService.buildVisibilityRules(this.visibilityRules);
|
||||
// this.datasetProfileDefinitionModel = new DatasetDescriptionFormEditorModel().fromModel(this.dataModel);
|
||||
// this.visibilityRulesService.setModel(this.datasetProfileDefinitionModel);
|
||||
|
||||
this.createPagination();
|
||||
// this.createPagination();
|
||||
|
||||
const sections: Pair<Section[], number>[] = this.datasetProfileDefinitionModel.pages.map(page => new Pair<Section[], number>(page.sections, page.ordinal)).filter(x => x);
|
||||
const compositeFields: Pair<CompositeField[], number>[] = sections.map(section => new Pair<CompositeField[], number>(section.left.flatMap(sec => sec.compositeFields), section.right)).filter(x => x);
|
||||
const nestedSections: Pair<Section[], number>[] = sections.map(section => new Pair<Section[], number>(section.left.flatMap(x => x.sections), section.right)).filter(x => x);
|
||||
const nestedCompositeFields: Pair<CompositeField[], number>[] = nestedSections.map(section => new Pair<CompositeField[], number>(section.left.flatMap(x => x.compositeFields), section.right)).filter(x => x);
|
||||
const compositeFieldsUnion: Pair<CompositeField[], number>[] = compositeFields.concat(nestedCompositeFields);
|
||||
// const sections: Pair<Section[], number>[] = this.datasetProfileDefinitionModel.pages.map(page => new Pair<Section[], number>(page.sections, page.ordinal)).filter(x => x);
|
||||
// const compositeFields: Pair<CompositeField[], number>[] = sections.map(section => new Pair<CompositeField[], number>(section.left.flatMap(sec => sec.compositeFields), section.right)).filter(x => x);
|
||||
// const nestedSections: Pair<Section[], number>[] = sections.map(section => new Pair<Section[], number>(section.left.flatMap(x => x.sections), section.right)).filter(x => x);
|
||||
// const nestedCompositeFields: Pair<CompositeField[], number>[] = nestedSections.map(section => new Pair<CompositeField[], number>(section.left.flatMap(x => x.compositeFields), section.right)).filter(x => x);
|
||||
// const compositeFieldsUnion: Pair<CompositeField[], number>[] = compositeFields.concat(nestedCompositeFields);
|
||||
|
||||
//const fields = compositeFieldsUnion.flatJoinOn(x => x.right);
|
||||
this.formFocusService.setFields(compositeFieldsUnion);
|
||||
this.route.fragment
|
||||
.pipe(takeUntil(this._destroyed))
|
||||
.subscribe((fragment: string) => {
|
||||
const self = this;
|
||||
setTimeout(function () { self.scrollTo(fragment); });
|
||||
});
|
||||
//this.formFocusService.setFields(compositeFieldsUnion);
|
||||
// this.route.fragment
|
||||
// .pipe(takeUntil(this._destroyed))
|
||||
// .subscribe((fragment: string) => {
|
||||
// const self = this;
|
||||
// setTimeout(function () { self.scrollTo(fragment); });
|
||||
// });
|
||||
}
|
||||
|
||||
ngAfterViewInit() {
|
||||
this.visibilityRulesService.triggerVisibilityEvaluation();
|
||||
this.route.queryParams
|
||||
.pipe(takeUntil(this._destroyed))
|
||||
.subscribe((params) => {
|
||||
if (params && 'page' in params) {
|
||||
this.changeCurrentPage(params['page']);
|
||||
}
|
||||
});
|
||||
//this.visibilityRulesService.triggerVisibilityEvaluation();
|
||||
// this.route.queryParams
|
||||
// .pipe(takeUntil(this._destroyed))
|
||||
// .subscribe((params) => {
|
||||
// if (params && 'page' in params) {
|
||||
// this.changeCurrentPage(params['page']);
|
||||
// }
|
||||
// });
|
||||
}
|
||||
|
||||
|
||||
toggleSidebar() {
|
||||
this.visibleSidebar = !this.visibleSidebar;
|
||||
}
|
||||
// toggleSidebar() {
|
||||
// this.visibleSidebar = !this.visibleSidebar;
|
||||
// }
|
||||
|
||||
shouldDisplaySection(section: Section): Boolean {
|
||||
return (section.page) === this.currentPageIndex;
|
||||
}
|
||||
// shouldDisplaySection(section: Section): Boolean {
|
||||
// return (section.page) === this.currentPageIndex;
|
||||
// }
|
||||
|
||||
createPagination() {
|
||||
// createPagination() {
|
||||
|
||||
}
|
||||
// }
|
||||
|
||||
changePageIndex(index: any) {
|
||||
this.router.navigate([this.route.snapshot.url[0] + '/' + this.route.snapshot.url[1]], { queryParams: { page: this.pages[index - 1] } });
|
||||
}
|
||||
// changePageIndex(index: any) {
|
||||
// this.router.navigate([this.route.snapshot.url[0] + '/' + this.route.snapshot.url[1]], { queryParams: { page: this.pages[index - 1] } });
|
||||
// }
|
||||
|
||||
scrollTo(sectionID: string) {
|
||||
if (!sectionID) { return; }
|
||||
const element = document.querySelector('#' + sectionID);
|
||||
if (!element) { return; }
|
||||
element.scrollIntoView();
|
||||
this.visibleSidebar = true;
|
||||
}
|
||||
// scrollTo(sectionID: string) {
|
||||
// if (!sectionID) { return; }
|
||||
// const element = document.querySelector('#' + sectionID);
|
||||
// if (!element) { return; }
|
||||
// element.scrollIntoView();
|
||||
// this.visibleSidebar = true;
|
||||
// }
|
||||
|
||||
changeCurrentPage(pageString: string) {
|
||||
//if (!pageString) { return; }
|
||||
const page = parseInt(pageString);
|
||||
/*if (isNaN(page)) { return; }
|
||||
const pageIndex = this.pages.indexOf(page);
|
||||
if (pageIndex === -1) { return; }*/
|
||||
this.stepper.selectedIndex = page;
|
||||
}
|
||||
// changeCurrentPage(pageString: string) {
|
||||
// //if (!pageString) { return; }
|
||||
// const page = parseInt(pageString);
|
||||
// /*if (isNaN(page)) { return; }
|
||||
// const pageIndex = this.pages.indexOf(page);
|
||||
// if (pageIndex === -1) { return; }*/
|
||||
// this.stepper.selectedIndex = page;
|
||||
// }
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
import { FormBuilder, FormGroup, Validators } from "@angular/forms";
|
||||
import { FormBuilder, FormControl, FormGroup, Validators } from "@angular/forms";
|
||||
import { ValidationType } from "../../../core/common/enum/validation-type";
|
||||
import { BaseFormModel } from "../../../core/model/base-form-model";
|
||||
import { CompositeField } from "../../../core/model/dataset-profile-definition/composite-field";
|
||||
import { DatasetProfileDefinitionModel } from "../../../core/model/dataset-profile-definition/dataset-profile-definition";
|
||||
import { DefaultValue } from "../../../core/model/dataset-profile-definition/default-value";
|
||||
|
|
@ -9,7 +10,6 @@ import { Page } from "../../../core/model/dataset-profile-definition/page";
|
|||
import { Rule } from "../../../core/model/dataset-profile-definition/rule";
|
||||
import { Section } from "../../../core/model/dataset-profile-definition/section";
|
||||
import { ViewStyle } from "../../../core/model/dataset-profile-definition/view-style";
|
||||
import { BaseFormModel } from "../../../core/model/base-form-model";
|
||||
|
||||
export class DatasetDescriptionFormEditorModel extends BaseFormModel {
|
||||
|
||||
|
|
@ -57,6 +57,7 @@ export class DatasetDescriptionPageEditorModel extends BaseFormModel {
|
|||
sectionsFormArray.push(form);
|
||||
});
|
||||
formGroup.addControl('sections', this.formBuilder.array(sectionsFormArray));
|
||||
formGroup.addControl('title', new FormControl({ value: this.title, disabled: true }));
|
||||
return formGroup;
|
||||
}
|
||||
}
|
||||
|
|
@ -104,6 +105,10 @@ export class DatasetDescriptionSectionEditorModel extends BaseFormModel {
|
|||
}
|
||||
formGroup.addControl('compositeFields', this.formBuilder.array(compositeFieldsFormArray));
|
||||
formGroup.addControl('sections', this.formBuilder.array(sectionsFormArray));
|
||||
formGroup.addControl('description', new FormControl({ value: this.description, disabled: true }));
|
||||
formGroup.addControl('numbering', new FormControl({ value: this.numbering, disabled: true }));
|
||||
formGroup.addControl('title', new FormControl({ value: this.title, disabled: true }));
|
||||
formGroup.addControl('id', new FormControl({ value: this.title, disabled: true }));
|
||||
return formGroup;
|
||||
}
|
||||
}
|
||||
|
|
@ -142,11 +147,13 @@ export class DatasetDescriptionCompositeFieldEditorModel extends BaseFormModel {
|
|||
const formGroup = this.formBuilder.group({
|
||||
id: this.id,
|
||||
ordinal: this.ordinal,
|
||||
title: this.title,
|
||||
description: this.description,
|
||||
extendedDescription: this.extendedDescription,
|
||||
hasCommentField: this.hasCommentField,
|
||||
commentFieldValue: this.commentFieldValue
|
||||
commentFieldValue: this.commentFieldValue,
|
||||
multiplicity: [{ value: this.multiplicity, disabled: true }],
|
||||
title: [{ value: this.title, disabled: true }],
|
||||
description: [{ value: this.description, disabled: true }],
|
||||
numbering: [{ value: this.numbering, disabled: true }],
|
||||
});
|
||||
|
||||
const fieldsFormArray = new Array<FormGroup>();
|
||||
|
|
@ -172,6 +179,10 @@ export class DatasetDescriptionCompositeFieldEditorModel extends BaseFormModel {
|
|||
this.fields.forEach(field => {
|
||||
newItem.fields.push(field.cloneForMultiplicity(this.fields.indexOf(field), newItem.id + '_'));
|
||||
});
|
||||
|
||||
// put on new item only the first (Fields) value and the last (Fields) value
|
||||
// the first is on "fields":[{},{}]
|
||||
// and the New is on "multiplicityItem":[{ fields":[{},{}] },{ fields":[{},{}] }]
|
||||
newItem.ordinal = this.ordinal;
|
||||
|
||||
return newItem;
|
||||
|
|
@ -223,9 +234,14 @@ export class DatasetDescriptionFieldEditorModel extends BaseFormModel {
|
|||
}
|
||||
|
||||
const formGroup = this.formBuilder.group({
|
||||
id: [this.id],
|
||||
data: [this.data],
|
||||
value: [this.value, this.validationRequired === true ? Validators.required : null]
|
||||
value: [this.value, this.validationRequired === true ? Validators.required : null],
|
||||
id: [{ value: this.id, disabled: true }],
|
||||
viewStyle: [{ value: this.viewStyle, disabled: true }],
|
||||
data: [{ value: this.data, disabled: true }],
|
||||
validationRequired: [{ value: this.validationRequired, disabled: true }],
|
||||
description: [{ value: this.description, disabled: true }],
|
||||
extendedDescription: [{ value: this.extendedDescription, disabled: true }],
|
||||
title: [{ value: this.title, disabled: true }],
|
||||
});
|
||||
|
||||
const multiplicityItemsFormArray = new Array<FormGroup>();
|
||||
|
|
|
|||
|
|
@ -38,8 +38,8 @@ export class DynamicFormPendingQuestionsDisplayComponent implements OnInit {
|
|||
const nestedCompositeFiels: CompositeField[] = nestedSections.flatMap(section => section.compositeFields).filter(x => x);
|
||||
const compositeFieldsUnion = compositeFields.concat(nestedCompositeFiels);
|
||||
//const fields: Field[] = compositeFields.flatMap(composite => composite.fields).concat(nestedCompositeFiels.flatMap(composite => composite.fields));
|
||||
const fields = compositeFieldsUnion.filter(compositeField => this.visibilityRulesService.checkElementVisibility(compositeField.id))
|
||||
.filter(compositeField => compositeField.fields.filter(x => x && x.validationRequired && this.visibilityRulesService.getFormGroup(x.id).value == null).length > 0);
|
||||
fields.forEach(x => this.markForConsideration.markForConsideration(x));
|
||||
// const fields = compositeFieldsUnion.filter(compositeField => this.visibilityRulesService.checkElementVisibility(compositeField.id))
|
||||
// .filter(compositeField => compositeField.fields.filter(x => x && x.validationRequired && this.visibilityRulesService.getFormGroup(x.id).value == null).length > 0);
|
||||
// fields.forEach(x => this.markForConsideration.markForConsideration(x));
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,19 +1,18 @@
|
|||
import { ApplicationRef, Injectable, NgZone } from '@angular/core';
|
||||
import { FormGroup } from '@angular/forms';
|
||||
import { DatasetProfileDefinitionModel } from '../../../../core/model/dataset-profile-definition/dataset-profile-definition';
|
||||
import { Rule } from '../../../../core/model/dataset-profile-definition/rule';
|
||||
import { VisibilityRule } from './models/visibility-rule';
|
||||
import { VisibilityRulesContext } from './models/visibility-rules-context';
|
||||
import { isNumeric } from 'rxjs/internal/util/isNumeric';
|
||||
|
||||
@Injectable()
|
||||
export class VisibilityRulesService {
|
||||
|
||||
public formGroup: FormGroup;
|
||||
// public formGroup: FormGroup;
|
||||
private visibilityRuleContext: VisibilityRulesContext;
|
||||
private fieldsPathMemory: any = {};
|
||||
// private fieldsPathMemory: any = {};
|
||||
private elementVisibilityMap = new Map<String, boolean>();
|
||||
private initialModel: DatasetProfileDefinitionModel;
|
||||
private currentModel: DatasetProfileDefinitionModel;
|
||||
// private initialModel: DatasetProfileDefinitionModel;
|
||||
// private currentModel: DatasetProfileDefinitionModel;
|
||||
|
||||
constructor(
|
||||
public applicationReference: ApplicationRef,
|
||||
|
|
@ -22,27 +21,28 @@ export class VisibilityRulesService {
|
|||
|
||||
}
|
||||
|
||||
public setModel(model: DatasetProfileDefinitionModel) {
|
||||
this.initialModel = model;
|
||||
this.currentModel = model;
|
||||
//this.visibilityRuleContext.rules.forEach(item => this.evaluateVisibility(item))
|
||||
}
|
||||
// public setModel(model: DatasetProfileDefinitionModel) {
|
||||
// this.initialModel = model;
|
||||
// this.currentModel = model;
|
||||
// //this.visibilityRuleContext.rules.forEach(item => this.evaluateVisibility(item))
|
||||
// }
|
||||
|
||||
public triggerVisibilityEvaluation() {
|
||||
this.visibilityRuleContext.rules.forEach(item => this.evaluateVisibility(item));
|
||||
}
|
||||
// public triggerVisibilityEvaluation() {
|
||||
// this.visibilityRuleContext.rules.forEach(item => this.evaluateVisibility(item));
|
||||
// }
|
||||
|
||||
public getFormGroup(id: string): FormGroup {
|
||||
const pathKeyArray = this.search('pages', this.initialModel.pages, id).split('.');
|
||||
// public getFormGroup(id: string): FormGroup {
|
||||
// const pathKeyArray = this.search('pages', this.initialModel.pages, id).split('.');
|
||||
|
||||
pathKeyArray.pop();
|
||||
const pathKey = pathKeyArray.join('.');
|
||||
if (!this.fieldsPathMemory[id] && pathKey) { this.fieldsPathMemory[id] = pathKey; }
|
||||
return (<FormGroup>this.formGroup.get(pathKey));
|
||||
}
|
||||
// pathKeyArray.pop();
|
||||
// const pathKey = pathKeyArray.join('.');
|
||||
// if (!this.fieldsPathMemory[id] && pathKey) { this.fieldsPathMemory[id] = pathKey; }
|
||||
// return (<FormGroup>this.formGroup.get(pathKey));
|
||||
// }
|
||||
|
||||
public checkElementVisibility(id: string): boolean {
|
||||
return !this.elementVisibilityMap.has(id) || this.elementVisibilityMap.get(id);
|
||||
if (this.visibilityRuleContext.rules.filter(item => item.targetControlId === id).length === 0) { return true; }
|
||||
return this.elementVisibilityMap.has(id) ? this.elementVisibilityMap.get(id) : false;
|
||||
}
|
||||
|
||||
public buildVisibilityRules(item: Array<Rule>) {
|
||||
|
|
@ -50,96 +50,104 @@ export class VisibilityRulesService {
|
|||
this.visibilityRuleContext.buildVisibilityRuleContext(item || []);
|
||||
}
|
||||
|
||||
public updateValueAndVisibility(id: string) {
|
||||
public updateValueAndVisibility(id: string, value: any) {
|
||||
const visibilityRules = this.visibilityRuleContext.rules.filter(item => item.sourceVisibilityRules.filter(source => source.sourceControlId === id).length > 0);
|
||||
//visibilityRules.forEach(item => this.evaluateVisibility(item));
|
||||
visibilityRules.forEach(item => this.evaluateVisibility(item, value));
|
||||
}
|
||||
|
||||
private evaluateVisibility(visibilityRule: VisibilityRule) {
|
||||
private evaluateVisibility(visibilityRule: VisibilityRule, value: any) {
|
||||
for (let i = 0; i < visibilityRule.sourceVisibilityRules.length; i++) {
|
||||
const pathKey = this.fieldsPathMemory[visibilityRule.sourceVisibilityRules[i].sourceControlId];
|
||||
if (this.formGroup.get(pathKey + '.value') && (this.parseValue(this.formGroup.get(pathKey + '.value').value) !== this.parseValue(visibilityRule.sourceVisibilityRules[i].sourceControlValue))) {
|
||||
if (this.formGroup.get(pathKey).parent.get('id')) {
|
||||
if (!this.checkElementVisibility(this.formGroup.get(pathKey).parent.get('id').value)) {
|
||||
const targetPathKey = this.fieldsPathMemory[visibilityRule.targetControlId];
|
||||
this.getObject(this.currentModel, 'id', visibilityRule.targetControlId, this.currentModel, true);
|
||||
this.elementVisibilityMap.set(visibilityRule.targetControlId, false);
|
||||
this.clearValues(targetPathKey);
|
||||
return;
|
||||
}
|
||||
} else {
|
||||
const targetPathKey = this.fieldsPathMemory[visibilityRule.targetControlId];
|
||||
this.getObject(this.currentModel, 'id', visibilityRule.targetControlId, this.currentModel, true);
|
||||
this.elementVisibilityMap.set(visibilityRule.targetControlId, false);
|
||||
this.clearValues(targetPathKey);
|
||||
return;
|
||||
}
|
||||
//const pathKey = this.fieldsPathMemory[visibilityRule.sourceVisibilityRules[i].sourceControlId];
|
||||
// if (this.formGroup.get(pathKey + '.value') && (this.parseValue(this.formGroup.get(pathKey + '.value').value) !== this.parseValue(visibilityRule.sourceVisibilityRules[i].sourceControlValue))) {
|
||||
if (value != null && (this.parseValue(value) !== this.parseValue(visibilityRule.sourceVisibilityRules[i].sourceControlValue))) {
|
||||
// if (this.formGroup.get(pathKey).parent.get('id')) {
|
||||
// if (!this.checkElementVisibility(this.formGroup.get(pathKey).parent.get('id').value)) {
|
||||
// const targetPathKey = this.fieldsPathMemory[visibilityRule.targetControlId];
|
||||
// this.getObject(this.currentModel, 'id', visibilityRule.targetControlId, this.currentModel, true);
|
||||
this.elementVisibilityMap.set(visibilityRule.targetControlId, false);
|
||||
// this.clearValues(targetPathKey);
|
||||
return;
|
||||
}
|
||||
// } else {
|
||||
// const targetPathKey = this.fieldsPathMemory[visibilityRule.targetControlId];
|
||||
// this.getObject(this.currentModel, 'id', visibilityRule.targetControlId, this.currentModel, true);
|
||||
// this.elementVisibilityMap.set(visibilityRule.targetControlId, false);
|
||||
// this.clearValues(targetPathKey);
|
||||
// return;
|
||||
// }
|
||||
// }
|
||||
}
|
||||
const obj = this.getObject(this.initialModel, 'id', visibilityRule.targetControlId, this.initialModel);
|
||||
const targetObjPathKey = this.fieldsPathMemory[visibilityRule.targetControlId] ? this.fieldsPathMemory[visibilityRule.targetControlId] : this.search('pages', this.initialModel.pages, obj);
|
||||
this.updateValue(this.currentModel, obj, targetObjPathKey);
|
||||
// const obj = this.getObject(this.initialModel, 'id', visibilityRule.targetControlId, this.initialModel);
|
||||
// const targetObjPathKey = this.fieldsPathMemory[visibilityRule.targetControlId] ? this.fieldsPathMemory[visibilityRule.targetControlId] : this.search('pages', this.initialModel.pages, obj);
|
||||
// this.updateValue(this.currentModel, obj, targetObjPathKey);
|
||||
this.elementVisibilityMap.set(visibilityRule.targetControlId, true);
|
||||
}
|
||||
|
||||
private clearValues(pathKey) {
|
||||
if (pathKey && this.formGroup.get(pathKey + '.value')) { this.formGroup.get(pathKey + '.value').patchValue(null); }
|
||||
if (pathKey && this.formGroup.get(pathKey)['controls'].fields) {
|
||||
for (let i = 0; i < this.formGroup.get(pathKey)['controls'].fields.length; i++) {
|
||||
this.clearValues(pathKey + '.fields.' + i);
|
||||
}
|
||||
}
|
||||
}
|
||||
// private clearValues(pathKey) {
|
||||
// if (pathKey && this.formGroup.get(pathKey + '.value')) { this.formGroup.get(pathKey + '.value').patchValue(null); }
|
||||
// if (pathKey && this.formGroup.get(pathKey)['controls'].fields) {
|
||||
// for (let i = 0; i < this.formGroup.get(pathKey)['controls'].fields.length; i++) {
|
||||
// this.clearValues(pathKey + '.fields.' + i);
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
parseValue(value: any) {
|
||||
if (typeof value === 'string') {
|
||||
if (value === 'true') { return true; } else if (value === 'false') { return false; } else { return this.translate(value); }
|
||||
if (isNumeric(value)) { return value; }
|
||||
else if (value === 'true') {
|
||||
return true;
|
||||
}
|
||||
else if (value === 'false') {
|
||||
return false;
|
||||
}
|
||||
else { return this.translate(value); }
|
||||
} else { return value; }
|
||||
}
|
||||
|
||||
updateValue(obj, value, path) {
|
||||
let i;
|
||||
path = path.split('.');
|
||||
// updateValue(obj, value, path) {
|
||||
// let i;
|
||||
// path = path.split('.');
|
||||
|
||||
for (i = 0; i < path.length - 1; i++) {
|
||||
obj = obj[path[i]];
|
||||
}
|
||||
// for (i = 0; i < path.length - 1; i++) {
|
||||
// obj = obj[path[i]];
|
||||
// }
|
||||
|
||||
for (let propIndex = 0; propIndex < obj.length; propIndex++) {
|
||||
if (obj[propIndex] && obj[propIndex]['id'] === value['id']) { return; }
|
||||
}
|
||||
obj[path[i]] = value;
|
||||
}
|
||||
// for (let propIndex = 0; propIndex < obj.length; propIndex++) {
|
||||
// if (obj[propIndex] && obj[propIndex]['id'] === value['id']) { return; }
|
||||
// }
|
||||
// obj[path[i]] = value;
|
||||
// }
|
||||
|
||||
search(path, obj, target) {
|
||||
for (const k in obj) {
|
||||
if (obj.hasOwnProperty(k)) {
|
||||
if (obj[k] === target) {
|
||||
return path + '.' + k;
|
||||
} else if (typeof obj[k] === 'object') {
|
||||
const result = this.search(path + '.' + k, obj[k], target);
|
||||
if (result) {
|
||||
return result;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
return false;
|
||||
}
|
||||
// search(path, obj, target) {
|
||||
// for (const k in obj) {
|
||||
// if (obj.hasOwnProperty(k)) {
|
||||
// if (obj[k] === target) {
|
||||
// return path + '.' + k;
|
||||
// } else if (typeof obj[k] === 'object') {
|
||||
// const result = this.search(path + '.' + k, obj[k], target);
|
||||
// if (result) {
|
||||
// return result;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// return false;
|
||||
// }
|
||||
|
||||
private getObject(obj, key, val, parent, deleteObj = false) {
|
||||
for (const i in obj) {
|
||||
if (!obj.hasOwnProperty(i)) { continue; }
|
||||
if (typeof obj[i] === 'object') {
|
||||
const returnObj = this.getObject(obj[i], key, val, obj, deleteObj);
|
||||
if (returnObj) { return returnObj; }
|
||||
} else if (i === key && obj[key] === val) {
|
||||
//console.log(obj[key])
|
||||
if (deleteObj) { parent[parent.indexOf(obj)] = null; }
|
||||
return obj;
|
||||
}
|
||||
}
|
||||
}
|
||||
// private getObject(obj, key, val, parent, deleteObj = false) {
|
||||
// for (const i in obj) {
|
||||
// if (!obj.hasOwnProperty(i)) { continue; }
|
||||
// if (typeof obj[i] === 'object') {
|
||||
// const returnObj = this.getObject(obj[i], key, val, obj, deleteObj);
|
||||
// if (returnObj) { return returnObj; }
|
||||
// } else if (i === key && obj[key] === val) {
|
||||
// //console.log(obj[key])
|
||||
// if (deleteObj) { parent[parent.indexOf(obj)] = null; }
|
||||
// return obj;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
private translate(item: any) {
|
||||
try {
|
||||
|
|
|
|||
Loading…
Reference in New Issue