2023-12-20 08:20:38 +01:00
|
|
|
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, Input } from '@angular/core';
|
2024-02-02 17:43:24 +01:00
|
|
|
import { UntypedFormArray, UntypedFormGroup } from '@angular/forms';
|
2023-12-20 08:20:38 +01:00
|
|
|
import { MatDialog } from "@angular/material/dialog";
|
|
|
|
import { DescriptionTemplateFieldSet } from '@app/core/model/description-template/description-template';
|
|
|
|
import { BaseComponent } from '@common/base/base.component';
|
|
|
|
import { takeUntil } from 'rxjs/operators';
|
|
|
|
import { ToCEntry } from '../../../table-of-contents/models/toc-entry';
|
|
|
|
import { VisibilityRulesService } from '../../visibility-rules/visibility-rules.service';
|
2024-02-02 17:43:24 +01:00
|
|
|
import { DescriptionPropertyDefinitionEditorModel, DescriptionPropertyDefinitionFieldSetEditorModel } from '../../../description-editor.model';
|
|
|
|
import { FormFieldSetEditorDialogComponent } from './dialog-editor/form-fieldset-editor-dialog.component';
|
|
|
|
import { cloneAbstractControl } from '@app/utilities/enhancers/utils';
|
2024-02-08 16:23:03 +01:00
|
|
|
import { ValidationErrorModel } from '@common/forms/validation/error-model/validation-error-model';
|
2024-02-28 14:41:36 +01:00
|
|
|
import { Guid } from '@common/types/guid';
|
|
|
|
import { AnnotationDialogComponent } from '@app/ui/annotations/annotation-dialog-component/annotation-dialog.component';
|
|
|
|
import { AnnotationEntityType } from '@app/core/common/enum/annotation-entity-type';
|
2023-12-20 08:20:38 +01:00
|
|
|
|
|
|
|
@Component({
|
2024-02-02 17:43:24 +01:00
|
|
|
selector: 'app-description-form-field-set',
|
2023-12-20 08:20:38 +01:00
|
|
|
templateUrl: './form-field-set.component.html',
|
|
|
|
styleUrls: ['./form-field-set.component.scss'],
|
|
|
|
changeDetection: ChangeDetectionStrategy.OnPush
|
|
|
|
})
|
|
|
|
export class DescriptionFormFieldSetComponent extends BaseComponent {
|
|
|
|
|
|
|
|
@Input() fieldSet: DescriptionTemplateFieldSet;
|
|
|
|
@Input() propertiesFormGroup: UntypedFormGroup;
|
2024-02-28 14:41:36 +01:00
|
|
|
@Input() descriptionId: Guid;
|
2024-02-02 17:43:24 +01:00
|
|
|
|
|
|
|
get isMultiplicityEnabled() {
|
|
|
|
return this.fieldSet.multiplicity != null && this.fieldSet.multiplicity.min != 0 && this.fieldSet.multiplicity.max != 0;
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
2023-12-20 08:20:38 +01:00
|
|
|
isVisibleByVisibilityService: boolean = true;
|
|
|
|
@Input() visibilityRulesService: VisibilityRulesService;
|
2023-12-28 16:18:49 +01:00
|
|
|
@Input() path: String;
|
2023-12-20 08:20:38 +01:00
|
|
|
|
|
|
|
|
|
|
|
@Input() datasetProfileId: String;
|
|
|
|
// @Input() form: UntypedFormGroup;
|
|
|
|
@Input() isChild: Boolean = false;
|
|
|
|
@Input() showDelete: Boolean = false;
|
|
|
|
@Input() tocentry: ToCEntry;
|
|
|
|
@Input() tableRow: boolean = false;
|
|
|
|
@Input() showTitle: boolean = true;
|
|
|
|
@Input() placeholderTitle: boolean = false;
|
2024-02-08 16:23:03 +01:00
|
|
|
@Input() validationErrorModel: ValidationErrorModel;
|
2023-12-20 08:20:38 +01:00
|
|
|
|
|
|
|
constructor(
|
|
|
|
private dialog: MatDialog,
|
|
|
|
private changeDetector: ChangeDetectorRef
|
|
|
|
) {
|
|
|
|
super();
|
|
|
|
}
|
|
|
|
|
|
|
|
ngOnInit() {
|
|
|
|
this.visibilityRulesService.getElementVisibilityMapObservable().pipe(takeUntil(this._destroyed)).subscribe(x => {
|
2024-01-19 13:28:31 +01:00
|
|
|
// console.log('getElementVisibilityMapObservable form field');
|
2023-12-28 16:18:49 +01:00
|
|
|
if (x[this.fieldSet.id]) {
|
|
|
|
this.isVisibleByVisibilityService = x[this.fieldSet.id];
|
2023-12-20 08:20:38 +01:00
|
|
|
// this.changeDetector.markForCheck();
|
2023-12-28 16:18:49 +01:00
|
|
|
} else {
|
|
|
|
this.isVisibleByVisibilityService = false;
|
2023-12-20 08:20:38 +01:00
|
|
|
}
|
|
|
|
});
|
|
|
|
// if (this.tocentry) {
|
|
|
|
// this.form = this.tocentry.form as UntypedFormGroup;
|
|
|
|
// }
|
|
|
|
}
|
|
|
|
|
2024-02-02 17:43:24 +01:00
|
|
|
addMultiplicityField() {
|
|
|
|
const formArray = this.propertiesFormGroup?.get('items') as UntypedFormArray;
|
|
|
|
if (formArray.disabled) {
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
2024-02-08 16:23:03 +01:00
|
|
|
const item: DescriptionPropertyDefinitionFieldSetEditorModel = new DescriptionPropertyDefinitionEditorModel(this.validationErrorModel).calculateFieldSetProperties(this.fieldSet, null, null);
|
2024-02-09 14:07:15 +01:00
|
|
|
formArray.push((item.buildForm({rootPath: `properties.fieldSets[${this.fieldSet.id}].`}).get('items') as UntypedFormArray).at(0));
|
|
|
|
|
2024-02-02 17:43:24 +01:00
|
|
|
}
|
|
|
|
|
|
|
|
deleteMultiplicityField(fieldSetIndex: number): void {
|
|
|
|
const formArray = this.propertiesFormGroup.get('items') as UntypedFormArray;
|
|
|
|
formArray.removeAt(fieldSetIndex);
|
|
|
|
formArray.controls.forEach((fieldSet, index) => {
|
|
|
|
fieldSet.get('ordinal').setValue(index + 1);
|
|
|
|
});
|
|
|
|
|
|
|
|
//Reapply validators
|
2024-02-08 16:23:03 +01:00
|
|
|
DescriptionPropertyDefinitionFieldSetEditorModel.reapplyValidators(
|
|
|
|
{
|
2024-02-09 14:07:15 +01:00
|
|
|
formArray: formArray,
|
2024-02-08 16:23:03 +01:00
|
|
|
validationErrorModel: this.validationErrorModel,
|
2024-02-09 14:07:15 +01:00
|
|
|
rootPath: `properties.fieldSets[${this.fieldSet.id}].`
|
2024-02-08 16:23:03 +01:00
|
|
|
}
|
|
|
|
);
|
2024-02-02 17:43:24 +01:00
|
|
|
formArray.markAsDirty();
|
|
|
|
}
|
|
|
|
|
|
|
|
editTableMultiplicityFieldInDialog(fieldSetIndex: number) {
|
|
|
|
const dialogRef = this.dialog.open(FormFieldSetEditorDialogComponent, {
|
|
|
|
width: '750px',
|
|
|
|
disableClose: true,
|
|
|
|
data: {
|
|
|
|
fieldSet: this.fieldSet,
|
|
|
|
propertiesFormGroup: cloneAbstractControl((this.propertiesFormGroup?.get('items') as UntypedFormArray).at(fieldSetIndex))
|
|
|
|
}
|
|
|
|
});
|
|
|
|
dialogRef.afterClosed().pipe(takeUntil(this._destroyed)).subscribe(data => {
|
|
|
|
if (data) {
|
|
|
|
(this.propertiesFormGroup?.get('items') as UntypedFormArray).at(fieldSetIndex).patchValue(data.value);
|
|
|
|
this.changeDetector.detectChanges();
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
2024-02-28 14:41:36 +01:00
|
|
|
//
|
|
|
|
//
|
|
|
|
// Annotations
|
|
|
|
//
|
|
|
|
//
|
|
|
|
showAnnotations(fieldSetId: string) {
|
|
|
|
const dialogRef = this.dialog.open(AnnotationDialogComponent, {
|
|
|
|
width: '528px',
|
|
|
|
data: {
|
|
|
|
entityId: this.descriptionId,
|
|
|
|
anchor: fieldSetId,
|
|
|
|
entityType: AnnotationEntityType.Description
|
|
|
|
}
|
|
|
|
});
|
|
|
|
dialogRef.afterClosed().pipe(takeUntil(this._destroyed)).subscribe(result => {
|
|
|
|
if (result && result.success) {
|
|
|
|
//TODO refactor
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
2024-02-02 17:43:24 +01:00
|
|
|
|
2023-12-20 08:20:38 +01:00
|
|
|
|
|
|
|
// deleteCompositeFieldFormGroup() {
|
|
|
|
|
|
|
|
// const compositeFieldId = ((this.form.get('multiplicityItems') as UntypedFormArray).get('' + 0) as UntypedFormGroup).getRawValue().id;
|
|
|
|
// const fieldIds = (this.form.get('fields') as UntypedFormArray).controls.map(control => control.get('id').value) as string[];
|
|
|
|
|
|
|
|
// const numberOfItems = this.form.get('multiplicityItems').get('' + 0).get('fields').value.length;
|
|
|
|
// for (let i = 0; i < numberOfItems; i++) {
|
|
|
|
// const multiplicityItem = this.form.get('multiplicityItems').get('' + 0).get('fields').get('' + i).value;
|
|
|
|
// this.form.get('fields').get('' + i).patchValue(multiplicityItem);
|
|
|
|
// }
|
|
|
|
// (<UntypedFormArray>(this.form.get('multiplicityItems'))).removeAt(0);
|
|
|
|
|
|
|
|
|
|
|
|
// this.visibilityRulesService.removeAllIdReferences(compositeFieldId);
|
|
|
|
// fieldIds.forEach(x => this.visibilityRulesService.removeAllIdReferences(x));
|
|
|
|
// }
|
|
|
|
|
|
|
|
// deleteMultipeFieldFromCompositeFormGroup() {
|
|
|
|
// const parent = this.form.parent;
|
|
|
|
// const index = (parent as UntypedFormArray).controls.indexOf(this.form);
|
|
|
|
|
|
|
|
// const currentId = this.form.get('id').value;
|
|
|
|
// const fieldIds = (this.form.get('fields') as UntypedFormArray).controls.map(control => control.get('id').value) as string[];
|
|
|
|
|
|
|
|
|
|
|
|
// this.visibilityRulesService.removeAllIdReferences(currentId);
|
|
|
|
// fieldIds.forEach(x => this.visibilityRulesService.removeAllIdReferences(x));
|
|
|
|
|
|
|
|
// (parent as UntypedFormArray).removeAt(index);
|
|
|
|
// (parent as UntypedFormArray).controls.forEach((control, i) => {
|
|
|
|
// try {
|
|
|
|
// control.get('ordinal').setValue(i);
|
|
|
|
// } catch {
|
|
|
|
// throw 'Could not find ordinal';
|
|
|
|
// }
|
|
|
|
// });
|
|
|
|
// }
|
|
|
|
}
|