MaDgiK-CITE
/
argos
13
0
Fork 0
Code Issues Pull Requests Projects Releases 3 Wiki Activity

annotation popup changes

This commit is contained in:
Diamantis Tziotzios 2024-03-13 10:45:22 +02:00
parent 5f88e835b7
commit 83565a0e52
12 changed files with 124 additions and 90 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
dmp-frontend/src/app/core/services/utilities/enum-utils.service.ts
View File

@ -39,6 +39,7 @@ import { DescriptionTemplateExternalSelectAuthType } from '@app/core/common/enum
import { DmpBlueprintFieldCategory } from '@app/core/common/enum/dmp-blueprint-field-category'; import { DmpBlueprintFieldCategory } from '@app/core/common/enum/dmp-blueprint-field-category';
import { DmpUserType } from '@app/core/common/enum/dmp-user-type'; import { DmpUserType } from '@app/core/common/enum/dmp-user-type';
import { PrefillingSourceSystemTargetType } from '@app/core/common/enum/prefilling-source-system-target-type'; import { PrefillingSourceSystemTargetType } from '@app/core/common/enum/prefilling-source-system-target-type';
import { AnnotationProtectionType } from '@app/core/common/enum/annotation-protection-type.enum';
@Injectable() @Injectable()
export class EnumUtils { export class EnumUtils {
@ -407,5 +408,12 @@ export class EnumUtils {
} }
} }
public toAnnotationProtectionTypeString(value: AnnotationProtectionType): string {
switch (value) {
case AnnotationProtectionType.Private: return this.language.instant('TYPES.ANNOTATION-PROTECTION-TYPE.PRIVATE');
case AnnotationProtectionType.EntityAccessors: return this.language.instant('TYPES.ANNOTATION-PROTECTION-TYPE.ENTITY-ACCESSORS');
default: return '';
}
}
} }

2
dmp-frontend/src/app/ui/admin/description-template/description-template-preview/description-template-preview-dialog.component.html
View File

@ -7,7 +7,7 @@
<mat-progress-bar color="primary" mode="indeterminate"></mat-progress-bar> <mat-progress-bar color="primary" mode="indeterminate"></mat-progress-bar>
</div> </div>
<div mat-dialog-content class="definition-content"> <div mat-dialog-content class="definition-content">
<app-description-form *ngIf="formGroup && formGroup.get('properties')" [propertiesFormGroup]="formGroup.get('properties')" [descriptionTemplate]="descriptionTemplate" [visibilityRulesService]="visibilityRulesService"></app-description-form> <app-description-form *ngIf="formGroup && formGroup.get('properties')" [propertiesFormGroup]="formGroup.get('properties')" [descriptionId]="descriptionId" [descriptionTemplate]="descriptionTemplate" [visibilityRulesService]="visibilityRulesService"></app-description-form>
</div> </div>
<div mat-mat-dialog-actions *ngIf="formGroup"> <div mat-mat-dialog-actions *ngIf="formGroup">
<div class="col-auto d-flex pb-4 pt-2"> <div class="col-auto d-flex pb-4 pt-2">

63
dmp-frontend/src/app/ui/annotations/annotation-dialog-component/annotation-dialog.component.html
View File

@ -1,30 +1,36 @@
<div class="container form-container"> <div class="container form-container">
<div class="row d-flex justify-content-between align-items-center m-0">
<!-- <div class="col-auto"><a class="logo"><img class="logo" src="../../../assets/images/new-dmp-logo.png" onerror="this.style.display='none'"></a></div> -->
<div class="col-auto ml-auto close-btn" (click)="close()">
<mat-icon class="close-icon">close</mat-icon>
</div>
</div>
<div class="annotation-viewer row"> <div class="annotation-viewer row">
<!-- Create New Thread --> <!-- Create New Thread -->
<!-- <div *ngIf="this.canEdit && !this.isDeleted" class="col-12"> --> <!-- <div *ngIf="this.canEdit && !this.isDeleted" class="col-12"> -->
<div class="col-12"> <div class="col-12">
<form class="row p-2 mt-2 mb-3 ml-0 pr-3 mr-0 new-thread" [formGroup]="threadFormGroup"> <form class="row p-2 mt-2 mb-3 ml-0 pr-3 mr-0 new-thread" [formGroup]="threadFormGroup">
<mat-form-field class="col msg-input"> <mat-form-field class="col msg-input">
<textarea matInput matTextareaAutosize matAutosizeMinRows="1" name="thread-text" formControlName="text" placeholder="{{'APP.ANNOTATION.THREADS.NEW-THREAD' | translate}}" required></textarea> <textarea matInput matTextareaAutosize matAutosizeMinRows="1" name="thread-text" formControlName="text" placeholder="{{'ANNOTATION-DIALOG.THREADS.NEW-THREAD' | translate}}" required></textarea>
<mat-error *ngIf="threadFormGroup.get('text').hasError('backendError')">{{threadFormGroup.get('text').getError('backendError')?.message}}</mat-error> <mat-error *ngIf="threadFormGroup.get('text').hasError('backendError')">{{threadFormGroup.get('text').getError('backendError')?.message}}</mat-error>
<mat-error *ngIf="threadFormGroup.get('text').hasError('required')">{{'COMMONS.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="threadFormGroup.get('text').hasError('required')">{{'COMMONS.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
<!-- <mat-form-field class="col-auto pl-0 pr-0 protection-input"> <mat-form-field class="col-auto pl-0 pr-0 protection-input">
<mat-label>{{'APP.ANNOTATION.THREADS.PROTECTION.TITLE' | translate}}</mat-label> <mat-label>{{'ANNOTATION-DIALOG.THREADS.PROTECTION.TITLE' | translate}}</mat-label>
<mat-select name="thread-annotationProtectionType" formControlName="annotationProtectionType" required> <mat-select name="thread-protectionType" formControlName="protectionType" required>
<mat-option *ngFor="let enumValue of annotationProtectionTypeEnumValues" [value]="enumValue">{{enumUtils.toAnnotationProtectionTypeString(enumValue)}}</mat-option> <mat-option *ngFor="let enumValue of annotationProtectionTypeEnumValues" [value]="enumValue">{{enumUtils.toAnnotationProtectionTypeString(enumValue)}}</mat-option>
</mat-select> </mat-select>
<mat-error *ngIf="threadFormGroup.get('annotationProtectionType').hasError('backendError')">{{threadFormGroup.get('annotationProtectionType').getError('backendError')?.message}}</mat-error> <mat-error *ngIf="threadFormGroup.get('protectionType').hasError('backendError')">{{threadFormGroup.get('protectionType').getError('backendError')?.message}}</mat-error>
<mat-error *ngIf="threadFormGroup.get('annotationProtectionType').hasError('required')">{{'COMMONS.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="threadFormGroup.get('protectionType').hasError('required')">{{'COMMONS.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> --> </mat-form-field>
<div class="col-auto send-msg"> <div class="col-auto send-msg">
<button mat-raised-button type="button" (click)="createThread()"> <button mat-raised-button type="button" (click)="createThread()">
<i class="fa fa-paper-plane"></i> {{'APP.ANNOTATION.THREADS.SEND' | translate}} <i class="fa fa-paper-plane"></i> {{'ANNOTATION-DIALOG.THREADS.SEND' | translate}}
</button> </button>
</div> </div>
</form> </form>
</div> </div>
<div class="col-12 mb-3 pt-2 gr-color" *ngIf="threads?.length > 0">{{'APP.ANNOTATION.TITLE' | translate}}</div> <div class="col-12 mb-3 pt-2 gr-color" *ngIf="threads?.length > 0">{{'ANNOTATION-DIALOG.TITLE' | translate}}</div>
<div class="col-12"> <div class="col-12">
<div *ngFor="let thread of threads" class="row"> <div *ngFor="let thread of threads" class="row">
<!-- Parent Thread --> <!-- Parent Thread -->
@ -38,15 +44,11 @@
<div class="col-12"> <div class="col-12">
<div class="row h-100"> <div class="row h-100">
<div class="col annotation-time">{{thread.timeStamp | date:'EEEE, MMMM d, y, h:mm a'}}</div> <div class="col annotation-time">{{thread.timeStamp | date:'EEEE, MMMM d, y, h:mm a'}}</div>
<div class="col-auto" *ngIf="thread.protection === 0" matTooltip="{{'APP.ANNOTATION.PROTECTION.PRIVATE' | translate}}"><i class="material-icons protection-icon icon-{{getAnnotationProtectionType(thread)}}">{{getAnnotationProtectionType(thread)}}</i></div> <div class="col-auto" *ngIf="thread.protectionType === annotationProtectionTypeEnum.Private" matTooltip="{{'ANNOTATION-DIALOG.PROTECTION.PRIVATE' | translate}}"><i class="material-icons protection-icon icon-{{getAnnotationProtectionType(thread)}}">{{getAnnotationProtectionType(thread)}}</i></div>
<div class="col-auto" *ngIf="thread.protection === 1" matTooltip="{{'APP.ANNOTATION.PROTECTION.UNIT' | translate}}"><i class="material-icons protection-icon icon-{{getAnnotationProtectionType(thread)}}">{{getAnnotationProtectionType(thread)}}</i></div> <div class="col-auto" *ngIf="thread.protectionType === annotationProtectionTypeEnum.EntityAccessors" matTooltip="{{'ANNOTATION-DIALOG.PROTECTION.ENTITY-ACCESSORS' | translate}}"><i class="material-icons protection-icon icon-{{getAnnotationProtectionType(thread)}}">{{getAnnotationProtectionType(thread)}}</i></div>
<div class="col-auto" *ngIf="thread.protection === 65535" matTooltip="{{'APP.ANNOTATION.PROTECTION.PUBLIC' | translate}}"><i class="material-icons protection-icon icon-{{getAnnotationProtectionType(thread)}}">{{getAnnotationProtectionType(thread)}}</i></div>
<div class="col-md-12 annotation-full-text">{{thread.text}}</div> <div class="col-md-12 annotation-full-text">{{thread.text}}</div>
<div class="col-md-12"> <div class="col-md-12">
<em class="user">{{'APP.ANNOTATION.THREADS.FROM-USER' | translate}} {{thread.author.name}}</em> <em class="user">{{'ANNOTATION-DIALOG.THREADS.FROM-USER' | translate}} {{thread.author.name}}</em>
<!-- <em>{{thread.author.name}}</em> -->
<!-- |
<em class="gr-color">{{'APP.ANNOTATION.THREADS.UNIT' | translate}}</em> -->
</div> </div>
</div> </div>
</div> </div>
@ -72,10 +74,8 @@
<div class="col-md-12 annotation-time">{{annotation.timeStamp | date:'EEEE, MMMM d, y, h:mm a'}}</div> <div class="col-md-12 annotation-time">{{annotation.timeStamp | date:'EEEE, MMMM d, y, h:mm a'}}</div>
<div class="col-md-12 annotation-full-text">{{annotation.text}}</div> <div class="col-md-12 annotation-full-text">{{annotation.text}}</div>
<div class="col-md-12"> <div class="col-md-12">
<em class="gr-color">{{'APP.ANNOTATION.THREADS.FROM-USER' | translate}}</em> <em class="gr-color">{{'ANNOTATION-DIALOG.THREADS.FROM-USER' | translate}}</em>
{{annotation.author.name}} {{annotation.author.name}}
<!-- |
<em class="gr-color">{{'APP.ANNOTATION.THREADS.UNIT' | translate}}</em> -->
</div> </div>
</div> </div>
</div> </div>
@ -88,11 +88,11 @@
<div *ngIf="this.canEdit && !this.isDeleted" class="col-12"> <div *ngIf="this.canEdit && !this.isDeleted" class="col-12">
<div class="row new-reply mr-0"> <div class="row new-reply mr-0">
<mat-form-field class="col pt-2 pb-2 pr-0"> <mat-form-field class="col pt-2 pb-2 pr-0">
<textarea matInput matTextareaAutosize matAutosizeMinRows="1" [formControl]="this.threadReplyTextsFG[thread.id.toString()].get('replyText')" placeholder="{{'APP.ANNOTATION.THREADS.REPLY' | translate}}"></textarea> <textarea matInput matTextareaAutosize matAutosizeMinRows="1" [formControl]="this.threadReplyTextsFG[thread.id.toString()].get('replyText')" placeholder="{{'ANNOTATION-DIALOG.THREADS.REPLY' | translate}}"></textarea>
<mat-error *ngIf="this.threadReplyTextsFG[thread.id.toString()]?.get('replyText')?.hasError('required')">{{'COMMONS.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="this.threadReplyTextsFG[thread.id.toString()]?.get('replyText')?.hasError('required')">{{'COMMONS.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
<div class="col-auto send-msg"> <div class="col-auto send-msg">
<button class="form-field-margin" mat-icon-button type="button" color="accent" (click)="replyThread(thread.threadId, thread.protection)" matTooltip="{{'APP.ANNOTATION.THREADS.REPLY' | translate}}"> <button class="form-field-margin" mat-icon-button type="button" color="accent" (click)="replyThread(thread.threadId, thread.protectionType)" matTooltip="{{'ANNOTATION-DIALOG.THREADS.REPLY' | translate}}">
<i class="fa fa-paper-plane"></i> <i class="fa fa-paper-plane"></i>
</button> </button>
</div> </div>
@ -101,14 +101,9 @@
</div> </div>
</div> </div>
</div> </div>
<div class="row d-flex justify-content-between align-items-center m-0">
<div class="col-auto"><a class="logo"><img class="logo" src="../../../assets/images/new-dmp-logo.png" onerror="this.style.display='none'"></a></div> <!-- <div class="row content">
<div class="col-auto ml-auto close-btn" (click)="close()"> {{annotations | json}}
<mat-icon class="close-icon">close</mat-icon>
</div>
</div>
<div class="row content">
<!-- {{annotations | json}} -->
<div class="col-12"> <div class="col-12">
<h1 mat-dialog-title class="title p-0">{{'NAV-BAR.START-NEW-DMP' | translate}}</h1> <h1 mat-dialog-title class="title p-0">{{'NAV-BAR.START-NEW-DMP' | translate}}</h1>
</div> </div>
@ -118,19 +113,19 @@
<div class="col-12"> <div class="col-12">
<div class="row d-flex justify-content-between align-items-center"> <div class="row d-flex justify-content-between align-items-center">
<div class="col-auto"> <div class="col-auto">
<!-- <button type="button" class="normal-btn upload-btn d-flex flex-row align-items-center" (click)="uploadFile($event)"> <button type="button" class="normal-btn upload-btn d-flex flex-row align-items-center" (click)="uploadFile($event)">
<mat-icon class="pr-2">file_upload</mat-icon> <mat-icon class="pr-2">file_upload</mat-icon>
{{ 'NAV-BAR.IMPORT-FROM-FILE' | translate }} {{ 'NAV-BAR.IMPORT-FROM-FILE' | translate }}
</button> --> </button>
</div> </div>
<div class="col-auto pl-0 pr-0"> <div class="col-auto pl-0 pr-0">
<p class="">{{ 'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.FIRST-STEP.OR' | translate }}</p> <p class="">{{ 'QUICKWIZARD.CREATE-ADD.CREATE.QUICKWIZARD_CREATE.FIRST-STEP.OR' | translate }}</p>
</div> </div>
<div class="col-auto"> <div class="col-auto">
<!-- <button type="button" class="normal-btn font-weight-bold d-flex flex-row align-items-center" (click)="startWizard()"> <button type="button" class="normal-btn font-weight-bold d-flex flex-row align-items-center" (click)="startWizard()">
<mat-icon>chevron_right</mat-icon> <mat-icon>chevron_right</mat-icon>
{{ 'NAV-BAR.START-WIZARD' | translate }} {{ 'NAV-BAR.START-WIZARD' | translate }}
</button> --> </button>
</div> </div>
</div> </div>
</div> </div>
@ -145,5 +140,5 @@
<b><a href="https://github.com/RDA-DMP-Common/RDA-DMP-Common-Standard" target="_blank">{{'GENERAL.START-NEW-DMP-DIALOG.RDA-SPECIFICATIONS' | translate }}</a></b> <b><a href="https://github.com/RDA-DMP-Common/RDA-DMP-Common-Standard" target="_blank">{{'GENERAL.START-NEW-DMP-DIALOG.RDA-SPECIFICATIONS' | translate }}</a></b>
{{'GENERAL.START-NEW-DMP-DIALOG.MACHINE-ACTIONABLE' | translate }} {{'GENERAL.START-NEW-DMP-DIALOG.MACHINE-ACTIONABLE' | translate }}
</span> </span>
</div> </div> -->
</div> </div>

100
dmp-frontend/src/app/ui/annotations/annotation-dialog-component/annotation-dialog.component.ts
View File

@ -8,6 +8,7 @@ import { AnnotationLookup } from '@annotation-service/core/query/annotation.look
import { AnnotationService } from '@annotation-service/services/http/annotation.service'; import { AnnotationService } from '@annotation-service/services/http/annotation.service';
import { AnnotationProtectionType } from '@app/core/common/enum/annotation-protection-type.enum'; import { AnnotationProtectionType } from '@app/core/common/enum/annotation-protection-type.enum';
import { SnackBarNotificationLevel, UiNotificationService } from '@app/core/services/notification/ui-notification-service'; import { SnackBarNotificationLevel, UiNotificationService } from '@app/core/services/notification/ui-notification-service';
import { EnumUtils } from '@app/core/services/utilities/enum-utils.service';
import { isNullOrUndefined } from '@app/utilities/enhancers/utils'; import { isNullOrUndefined } from '@app/utilities/enhancers/utils';
import { BaseComponent } from '@common/base/base.component'; import { BaseComponent } from '@common/base/base.component';
import { FormService } from '@common/forms/form-service'; import { FormService } from '@common/forms/form-service';
@ -23,6 +24,9 @@ import { nameof } from 'ts-simple-nameof';
}) })
export class AnnotationDialogComponent extends BaseComponent { export class AnnotationDialogComponent extends BaseComponent {
annotationProtectionTypeEnumValues = this.enumUtils.getEnumValues<AnnotationProtectionType>(AnnotationProtectionType);
annotationProtectionTypeEnum = AnnotationProtectionType;
private entityId: Guid; private entityId: Guid;
private anchor: string; private anchor: string;
private entityType: string; private entityType: string;
@ -43,7 +47,8 @@ export class AnnotationDialogComponent extends BaseComponent {
private uiNotificationService: UiNotificationService, private uiNotificationService: UiNotificationService,
private language: TranslateService, private language: TranslateService,
private annotationService: AnnotationService, private annotationService: AnnotationService,
private formService: FormService private formService: FormService,
private enumUtils: EnumUtils
) { ) {
super(); super();
this.entityId = data.entityId; this.entityId = data.entityId;
@ -52,57 +57,61 @@ export class AnnotationDialogComponent extends BaseComponent {
} }
ngOnInit(): void { ngOnInit(): void {
// this.threadFormGroup = new UntypedFormGroup({ this.threadFormGroup = new UntypedFormGroup({
// text: new FormControl(null, [Validators.required]), text: new FormControl(null, [Validators.required]),
// annotationProtectionType: new FormControl(AnnotationProtectionType.Public, [Validators.required]) protectionType: new FormControl(AnnotationProtectionType.EntityAccessors, [Validators.required])
// }); });
// if (this.entityId != null) { if (this.entityId != null) {
// this.loadThreads(); this.loadThreads();
// } }
} }
createThread() { createThread() {
// this.formService.removeAllBackEndErrors(this.threadFormGroup); this.formService.removeAllBackEndErrors(this.threadFormGroup);
// this.formService.touchAllFormFields(this.threadFormGroup); this.formService.touchAllFormFields(this.threadFormGroup);
// if (!this.isFormValid(this.threadFormGroup)) { if (!this.isFormValid(this.threadFormGroup)) {
// return; return;
// } }
// const threadToCreate: AnnotationPersist = { const threadToCreate: AnnotationPersist = {
// payload: this.threadFormGroup.get('text').value, payload: this.threadFormGroup.get('text').value,
// protection: this.threadFormGroup.get('annotationProtectionType').value, protectionType: this.threadFormGroup.get('protectionType').value,
// referenceId: this.referenceId entityId: this.entityId,
// }; entityType: this.entityType,
// this.annotationService.persist(threadToCreate).pipe(takeUntil(this._destroyed)) anchor: this.anchor
// .subscribe( };
// complete => this.onCallbackSuccess(), this.annotationService.persist(threadToCreate).pipe(takeUntil(this._destroyed))
// error => this.onCallbackError(error) .subscribe(
// ); complete => this.onCallbackSuccess(),
error => this.onCallbackError(error)
);
} }
replyThread(threadId: Guid, threadProtection: AnnotationProtectionType) { replyThread(threadId: Guid, threadProtection: AnnotationProtectionType) {
// // if (!this.threadReplyTexts[threadId.toString()] || this.threadReplyTexts[threadId.toString()].length === 0) { return; } // if (!this.threadReplyTexts[threadId.toString()] || this.threadReplyTexts[threadId.toString()].length === 0) { return; }
// this.formService.removeAllBackEndErrors(this.threadReplyTextsFG[threadId.toString()]); this.formService.removeAllBackEndErrors(this.threadReplyTextsFG[threadId.toString()]);
// this.formService.touchAllFormFields(this.threadReplyTextsFG[threadId.toString()]); this.formService.touchAllFormFields(this.threadReplyTextsFG[threadId.toString()]);
// if (!this.isFormValid(this.threadReplyTextsFG[threadId.toString()])) { if (!this.isFormValid(this.threadReplyTextsFG[threadId.toString()])) {
// return; return;
// } }
// const replyToCreate: AnnotationPersist = { const replyToCreate: AnnotationPersist = {
// threadId: threadId, threadId: threadId,
// text: this.threadReplyTextsFG[threadId.toString()].get('replyText').value, payload: this.threadReplyTextsFG[threadId.toString()].get('replyText').value,
// protection: threadProtection, protectionType: threadProtection,
// referenceId: this.referenceId entityId: this.entityId,
// }; entityType: this.entityType,
// this.annotationService.persist(replyToCreate).pipe(takeUntil(this._destroyed)) anchor: this.anchor
// .subscribe( };
// complete => this.onCallbackSuccess(), this.annotationService.persist(replyToCreate).pipe(takeUntil(this._destroyed))
// error => this.onCallbackError(error) .subscribe(
// ); complete => this.onCallbackSuccess(),
error => this.onCallbackError(error)
);
} }
private refreshAnnotations() { private refreshAnnotations() {
// this.threadReplyTextsFG.forEach(element => { this.threadReplyTextsFG.forEach(element => {
// element.reset(); element.reset();
// }); });
this.loadThreads(); this.loadThreads();
} }
@ -144,7 +153,7 @@ export class AnnotationDialogComponent extends BaseComponent {
resetFormGroup() { resetFormGroup() {
this.threadFormGroup.reset(); this.threadFormGroup.reset();
this.threadFormGroup.get('annotationProtectionType').setValue(AnnotationProtectionType.EntityAccessors); this.threadFormGroup.get('protectionType').setValue(AnnotationProtectionType.EntityAccessors);
} }
isValidText(text: string): boolean { isValidText(text: string): boolean {
@ -166,6 +175,9 @@ export class AnnotationDialogComponent extends BaseComponent {
// ); // );
// } // }
public isFormValid(value: any) {
return value.valid;
}
private onCallbackSuccess() { private onCallbackSuccess() {
this.uiNotificationService.snackBarNotification(this.language.instant('DMP-UPLOAD.UPLOAD-SUCCESS'), SnackBarNotificationLevel.Success); this.uiNotificationService.snackBarNotification(this.language.instant('DMP-UPLOAD.UPLOAD-SUCCESS'), SnackBarNotificationLevel.Success);

1
dmp-frontend/src/app/ui/description/editor/description-editor.component.html
View File

@ -129,6 +129,7 @@
<app-description-form <app-description-form
*ngIf="formGroup && formGroup.get('properties')" *ngIf="formGroup && formGroup.get('properties')"
[propertiesFormGroup]="formGroup.get('properties')" [propertiesFormGroup]="formGroup.get('properties')"
[descriptionId]="formGroup.get('id').value"
[descriptionTemplate]="item.descriptionTemplate" [descriptionTemplate]="item.descriptionTemplate"
[visibilityRulesService]="visibilityRulesService" [visibilityRulesService]="visibilityRulesService"
[TOCENTRY_ID_PREFIX]="TOCENTRY_ID_PREFIX" [TOCENTRY_ID_PREFIX]="TOCENTRY_ID_PREFIX"

2
dmp-frontend/src/app/ui/description/editor/description-editor.component.ts
View File

@ -69,6 +69,8 @@ export class DescriptionEditorComponent extends BaseEditor<DescriptionEditorMode
// }; // };
// hasChanges = false; // hasChanges = false;
fieldsetIdWithFocus: string;
viewOnly = false; viewOnly = false;
lockStatus: Boolean; lockStatus: Boolean;
@ViewChild('table0fContents') table0fContents: TableOfContentsComponent; @ViewChild('table0fContents') table0fContents: TableOfContentsComponent;

14
dmp-frontend/src/app/ui/description/editor/description-form/components/form-field-set/form-field-set.component.html
View File

@ -1,9 +1,15 @@
<div *ngIf="fieldSet" class="dynamic-form-composite-field row"> <div *ngIf="fieldSet" class="dynamic-form-composite-field row">
<div *ngIf="showTitle" class="col-12"> <div *ngIf="showTitle" class="col-12">
<app-description-form-field-set-title class="row" [fieldSet]="fieldSet" [path]="path" [isChild]="isChild"></app-description-form-field-set-title> <div class="row">
<button mat-icon-button class="col-auto annotation-icon" (click)="showAnnotations(fieldSet.id)"> <div class="col">
<mat-icon matTooltip="{{'DATASET-EDITOR.QUESTION.EXTENDED-DESCRIPTION.ANNOTATIONS' | translate}}">comment</mat-icon> <app-description-form-field-set-title class="row" [fieldSet]="fieldSet" [path]="path" [isChild]="isChild"></app-description-form-field-set-title>
</button> </div>
<div class="col-auto">
<button mat-icon-button class="col-auto annotation-icon" (click)="showAnnotations(fieldSet.id)">
<mat-icon matTooltip="{{'DATASET-EDITOR.QUESTION.EXTENDED-DESCRIPTION.ANNOTATIONS' | translate}}">comment</mat-icon>
</button>
</div>
</div>
</div> </div>
<div *ngIf="!fieldSet?.multiplicity?.tableView" class="col-12"> <div *ngIf="!fieldSet?.multiplicity?.tableView" class="col-12">
<div class="row" *ngFor="let fieldSetItemPropertiesControl of propertiesFormGroup?.get('items')?.controls"> <div class="row" *ngFor="let fieldSetItemPropertiesControl of propertiesFormGroup?.get('items')?.controls">

5
dmp-frontend/src/app/ui/description/editor/description-form/components/form-field/form-field.component.html
View File

@ -16,6 +16,9 @@
</mat-form-field> </mat-form-field>
<div *ngSwitchCase="descriptionTemplateFieldTypeEnum.REFERENCE_TYPES" class="col-12"> <div *ngSwitchCase="descriptionTemplateFieldTypeEnum.REFERENCE_TYPES" class="col-12">
{{field.id}}
{{field.data.multipleSelect}}
{{propertiesFormGroup?.get(field.id).value | json}}
<ng-container *ngIf="field.data.multipleSelect"> <ng-container *ngIf="field.data.multipleSelect">
<app-reference-field-component [form]="propertiesFormGroup?.get(field.id).get('references')" [label]="field.label" [placeholder]="(field.data.label | translate) + (isRequired ? ' *': '')" [referenceType]="field.data.referenceType" [multiple]="true" [required]="isRequired" hint="{{ 'TYPES.DATASET-PROFILE-COMBO-BOX-TYPE.EXTERNAL-SOURCE-HINT' | translate }}"></app-reference-field-component> <app-reference-field-component [form]="propertiesFormGroup?.get(field.id).get('references')" [label]="field.label" [placeholder]="(field.data.label | translate) + (isRequired ? ' *': '')" [referenceType]="field.data.referenceType" [multiple]="true" [required]="isRequired" hint="{{ 'TYPES.DATASET-PROFILE-COMBO-BOX-TYPE.EXTERNAL-SOURCE-HINT' | translate }}"></app-reference-field-component>
</ng-container> </ng-container>
@ -63,7 +66,7 @@
</mat-form-field> </mat-form-field>
</div> </div>
</div> </div>
<div *ngSwitchCase="descriptionTemplateFieldTypeEnum.INTERNAL_ENTRIES_DMPS" class="col-12"> <div *ngSwitchCase="descriptionTemplateFieldTypeEnum.INTERNAL_DMP_ENTRIES_DMPS" class="col-12">
<div class="row"> <div class="row">
<mat-form-field class="col-md-12"> <mat-form-field class="col-md-12">
<ng-container *ngIf="field.data.multipleSelect"> <ng-container *ngIf="field.data.multipleSelect">

5
dmp-frontend/src/app/ui/description/editor/description-form/components/form-section/form-section.component.html
View File

@ -10,13 +10,14 @@
<mat-panel-description class="col-12"> <mat-panel-description class="col-12">
<h6 class='panel-desc' *ngIf="section.description" [innerHTML]="section.description"></h6> <h6 class='panel-desc' *ngIf="section.description" [innerHTML]="section.description"></h6>
</mat-panel-description> </mat-panel-description>
<div *ngFor="let fieldSet of section.fieldSets; let i = index;" class="col-12" [id]="fieldSet.id" (click)="onAskedToScroll(fieldSet.id)"> <div *ngFor="let fieldSet of section.fieldSets; let i = index;" class="col-12" [id]="fieldSet.id" (click)="onAskedToScroll($event, fieldSet.id)">
<div class="row"> <div class="row">
<div class="col-12"> <div class="col-12">
<div class="row"> <div class="row">
<app-description-form-field-set class="align-self-center col" <app-description-form-field-set class="align-self-center col"
[propertiesFormGroup]="propertiesFormGroup.get('fieldSets')?.get(fieldSet.id)" [propertiesFormGroup]="propertiesFormGroup.get('fieldSets')?.get(fieldSet.id)"
[fieldSet]="fieldSet" [fieldSet]="fieldSet"
[descriptionId]="descriptionId"
[path]="path + '.' + (i+1)" [path]="path + '.' + (i+1)"
[visibilityRulesService]="visibilityRulesService" [visibilityRulesService]="visibilityRulesService"
[validationErrorModel]="validationErrorModel" [validationErrorModel]="validationErrorModel"
@ -29,7 +30,7 @@
<div *ngIf="section?.sections?.length > 0" class="col-12"> <div *ngIf="section?.sections?.length > 0" class="col-12">
<ng-container *ngFor="let innerSection of section.sections; let j = index;"> <ng-container *ngFor="let innerSection of section.sections; let j = index;">
<div class="row"> <div class="row">
<app-description-form-section class="col-12" [section]="innerSection" [path]="path+'.'+(j+1)" [pathName]="pathName+'.sections.'+j" (askedToScroll)="onAskedToScroll($event)" [propertiesFormGroup]="propertiesFormGroup" [visibilityRulesService]="visibilityRulesService" [linkToScroll]="subsectionLinkToScroll"></app-description-form-section> <app-description-form-section class="col-12" [section]="innerSection" [path]="path+'.'+(j+1)" [pathName]="pathName+'.sections.'+j" (askedToScroll)="onAskedToScroll($event)" [propertiesFormGroup]="propertiesFormGroup" [descriptionId]="descriptionId" [visibilityRulesService]="visibilityRulesService" [linkToScroll]="subsectionLinkToScroll"></app-description-form-section>
</div> </div>
</ng-container> </ng-container>
</div> </div>

5
dmp-frontend/src/app/ui/description/editor/description-form/components/form-section/form-section.component.ts
View File

@ -17,6 +17,7 @@ import { ToCEntry } from '../../../table-of-contents/models/toc-entry';
import { ToCEntryType } from '../../../table-of-contents/models/toc-entry-type.enum'; import { ToCEntryType } from '../../../table-of-contents/models/toc-entry-type.enum';
import { LinkToScroll } from '../../../table-of-contents/table-of-contents.component'; import { LinkToScroll } from '../../../table-of-contents/table-of-contents.component';
import { VisibilityRulesService } from '../../visibility-rules/visibility-rules.service'; import { VisibilityRulesService } from '../../visibility-rules/visibility-rules.service';
import { Guid } from '@common/types/guid';
@Component({ @Component({
@ -31,6 +32,7 @@ export class DescriptionFormSectionComponent extends BaseComponent implements On
@Input() propertiesFormGroup: UntypedFormGroup; @Input() propertiesFormGroup: UntypedFormGroup;
@Input() visibilityRulesService: VisibilityRulesService; @Input() visibilityRulesService: VisibilityRulesService;
@Input() path: string; @Input() path: string;
@Input() descriptionId: Guid;
// @Input() datasetProfileId: String; // @Input() datasetProfileId: String;
// @Input() form: UntypedFormGroup; // @Input() form: UntypedFormGroup;
@ -74,7 +76,8 @@ export class DescriptionFormSectionComponent extends BaseComponent implements On
} }
} }
onAskedToScroll(id: string) { onAskedToScroll(event:MouseEvent, id: string) {
event.stopPropagation();
this.panelExpanded = true; this.panelExpanded = true;
this.askedToScroll.emit(id); this.askedToScroll.emit(id);
} }

2
dmp-frontend/src/app/ui/description/editor/description-form/description-form.component.html
View File

@ -15,7 +15,7 @@
</mat-expansion-panel-header> </mat-expansion-panel-header>
<ng-container *ngFor="let section of page.sections; let i = index;"> <ng-container *ngFor="let section of page.sections; let i = index;">
<div class="row"> <div class="row">
<app-description-form-section class="col-12" [section]="section" [path]="(z+1)+'.'+(i+1)" [pathName]="'pages.'+z+'.sections.'+i" [propertiesFormGroup]="propertiesFormGroup" [visibilityRulesService]="visibilityRulesService" (askedToScroll)="onAskedToScroll(expansionPanel, $event)" [linkToScroll]="linkToScroll" [validationErrorModel]="validationErrorModel"></app-description-form-section> <app-description-form-section class="col-12" [section]="section" [path]="(z+1)+'.'+(i+1)" [pathName]="'pages.'+z+'.sections.'+i" [propertiesFormGroup]="propertiesFormGroup" [descriptionId]="descriptionId" [visibilityRulesService]="visibilityRulesService" (askedToScroll)="onAskedToScroll(expansionPanel, $event)" [linkToScroll]="linkToScroll" [validationErrorModel]="validationErrorModel"></app-description-form-section>
</div> </div>
</ng-container> </ng-container>
</mat-expansion-panel> </mat-expansion-panel>

7
dmp-frontend/src/app/ui/description/editor/description-form/description-form.component.ts
View File

@ -7,6 +7,7 @@ import { LinkToScroll } from '../table-of-contents/table-of-contents.component';
import { Rule } from './visibility-rules/models/rule'; import { Rule } from './visibility-rules/models/rule';
import { VisibilityRulesService } from './visibility-rules/visibility-rules.service'; import { VisibilityRulesService } from './visibility-rules/visibility-rules.service';
import { ValidationErrorModel } from '@common/forms/validation/error-model/validation-error-model'; import { ValidationErrorModel } from '@common/forms/validation/error-model/validation-error-model';
import { Guid } from '@common/types/guid';
@Component({ @Component({
selector: 'app-description-form', selector: 'app-description-form',
@ -18,6 +19,8 @@ export class DescriptionFormComponent extends BaseComponent implements OnInit, A
@Input() propertiesFormGroup: UntypedFormGroup; @Input() propertiesFormGroup: UntypedFormGroup;
@Input() descriptionTemplate: DescriptionTemplate; @Input() descriptionTemplate: DescriptionTemplate;
@Input() visibilityRulesService: VisibilityRulesService; @Input() visibilityRulesService: VisibilityRulesService;
@Input() descriptionId: Guid;
// @ViewChild('stepper', { static: false }) stepper: MatStepper; // @ViewChild('stepper', { static: false }) stepper: MatStepper;
@Input() path: string; @Input() path: string;
@ -94,8 +97,8 @@ export class DescriptionFormComponent extends BaseComponent implements OnInit, A
} }
onAskedToScroll(panel: MatExpansionPanel, id?: string) { onAskedToScroll(panel: MatExpansionPanel, id?: string) {
panel.open(); // panel.open();
this.fieldsetFocusChange.emit(id); // this.fieldsetFocusChange.emit(id);
} }