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

fix description template preview dialog

This commit is contained in:
amentis 2024-03-29 17:37:08 +02:00
parent c1509baf38
commit 7a3bdedb8c
4 changed files with 34 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -8,7 +8,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')" [descriptionId]="descriptionId" [descriptionTemplate]="descriptionTemplate" [visibilityRulesService]="visibilityRulesService"></app-description-form> <app-description-form *ngIf="formGroup && formGroup.get('properties')" [propertiesFormGroup]="previewPropertiesFormGroup" [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">

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

@ -2,6 +2,7 @@ import { Component, Inject, OnInit } from '@angular/core';
import { UntypedFormGroup } from '@angular/forms'; import { UntypedFormGroup } from '@angular/forms';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
import { DescriptionTemplate } from '@app/core/model/description-template/description-template'; import { DescriptionTemplate } from '@app/core/model/description-template/description-template';
import { Description } from '@app/core/model/description/description';
import { DescriptionTemplateService } from '@app/core/services/description-template/description-template.service'; import { DescriptionTemplateService } from '@app/core/services/description-template/description-template.service';
import { LoggingService } from '@app/core/services/logging/logging-service'; import { LoggingService } from '@app/core/services/logging/logging-service';
import { SnackBarNotificationLevel, UiNotificationService } from '@app/core/services/notification/ui-notification-service'; import { SnackBarNotificationLevel, UiNotificationService } from '@app/core/services/notification/ui-notification-service';
@ -24,6 +25,7 @@ export class DescriptionTemplatePreviewDialogComponent extends BaseComponent imp
progressIndication = false; progressIndication = false;
editorModel: DescriptionEditorModel; editorModel: DescriptionEditorModel;
formGroup: UntypedFormGroup; formGroup: UntypedFormGroup;
previewPropertiesFormGroup: UntypedFormGroup;
descriptionTemplate: DescriptionTemplate; descriptionTemplate: DescriptionTemplate;
constructor( constructor(
@ -57,7 +59,10 @@ export class DescriptionTemplatePreviewDialogComponent extends BaseComponent imp
prepareForm(data: DescriptionTemplate) { prepareForm(data: DescriptionTemplate) {
try { try {
this.editorModel = new DescriptionEditorModel(); const mockDescription: Description = {
descriptionTemplate: this.descriptionTemplate
}
this.editorModel = new DescriptionEditorModel().fromModel(mockDescription, mockDescription.descriptionTemplate);;
this.buildForm(); this.buildForm();
} catch (error) { } catch (error) {
this.logger.error('Could not parse Description item: ' + data + error); this.logger.error('Could not parse Description item: ' + data + error);
@ -67,7 +72,8 @@ export class DescriptionTemplatePreviewDialogComponent extends BaseComponent imp
buildForm() { buildForm() {
this.formGroup = this.editorModel.buildForm(null, true); this.formGroup = this.editorModel.buildForm(null, true);
this.visibilityRulesService.setContext(this.descriptionTemplate.definition, this.formGroup.get('properties')); this.previewPropertiesFormGroup = this.editorModel.properties.buildForm() as UntypedFormGroup;
this.visibilityRulesService.setContext(this.descriptionTemplate.definition, this.previewPropertiesFormGroup);
} }
select(): void { select(): void {

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

@ -296,7 +296,7 @@
<div class="heading">{{'DMP-EDITOR.FIELDS.DESCRIPTION-TEMPLATES' | translate}}</div> <div class="heading">{{'DMP-EDITOR.FIELDS.DESCRIPTION-TEMPLATES' | translate}}</div>
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{'DMP-EDITOR.FIELDS.DESCRIPTION-TEMPLATES-HINT' | translate}}</mat-label> <mat-label>{{'DMP-EDITOR.FIELDS.DESCRIPTION-TEMPLATES-HINT' | translate}}</mat-label>
<app-multiple-auto-complete placeholder="{{'DMP-EDITOR.FIELDS.DESCRIPTION-TEMPLATES-HINT' | translate}}" [hidePlaceholder]="true" required='true' [formControl]="formGroup.get('descriptionTemplates').get(section.id)" [configuration]="descriptionTemplateService.descriptionTempalteGroupMultipleAutocompleteConfiguration" (optionActionClicked)="onPreviewDescriptionTemplate($event, i)"> <app-multiple-auto-complete placeholder="{{'DMP-EDITOR.FIELDS.DESCRIPTION-TEMPLATES-HINT' | translate}}" [hidePlaceholder]="true" required='true' [formControl]="formGroup.get('descriptionTemplates').get(section.id)" [configuration]="descriptionTemplateService.descriptionTempalteGroupMultipleAutocompleteConfiguration" (optionActionClicked)="onPreviewDescriptionTemplate($event, section.id)">
</app-multiple-auto-complete> </app-multiple-auto-complete>
<mat-error *ngIf="formGroup.get('descriptionTemplates').get(section.id).hasError('backendError')">{{formGroup.get('descriptionTemplates').get(section.id).getError('backendError').message}}</mat-error> <mat-error *ngIf="formGroup.get('descriptionTemplates').get(section.id).hasError('backendError')">{{formGroup.get('descriptionTemplates').get(section.id).getError('backendError').message}}</mat-error>
<mat-error *ngIf="formGroup.get('descriptionTemplates').get(section.id).hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('descriptionTemplates').get(section.id).hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>

47
dmp-frontend/src/app/ui/dmp/dmp-editor-blueprint/dmp-editor.component.ts
View File

@ -50,6 +50,7 @@ import { map, takeUntil } from 'rxjs/operators';
import { DmpEditorModel } from './dmp-editor.model'; import { DmpEditorModel } from './dmp-editor.model';
import { DmpEditorResolver } from './dmp-editor.resolver'; import { DmpEditorResolver } from './dmp-editor.resolver';
import { DmpEditorService } from './dmp-editor.service'; import { DmpEditorService } from './dmp-editor.service';
import { DescriptionTemplatePreviewDialogComponent } from '@app/ui/admin/description-template/description-template-preview/description-template-preview-dialog.component';
@Component({ @Component({
selector: 'app-dmp-editor', selector: 'app-dmp-editor',
@ -451,29 +452,29 @@ export class DmpEditorComponent extends BaseEditor<DmpEditorModel, Dmp> implemen
// //
// //
onPreviewDescriptionTemplate(event, sectionIndex: number) { onPreviewDescriptionTemplate(event, sectionId: Guid) {
// const dialogRef = this.dialog.open(DatasetPreviewDialogComponent, { const dialogRef = this.dialog.open(DescriptionTemplatePreviewDialogComponent, {
// width: '590px', width: '590px',
// minHeight: '200px', minHeight: '200px',
// restoreFocus: false, restoreFocus: false,
// data: { data: {
// template: event descriptionTemplateId: event.id
// }, },
// panelClass: 'custom-modalbox' panelClass: 'custom-modalbox'
// }); });
// dialogRef.afterClosed().pipe(takeUntil(this._destroyed)).subscribe(result => { dialogRef.afterClosed().pipe(takeUntil(this._destroyed)).subscribe(result => {
// if (result) { if (result) {
// this.addProfile(event, sectionIndex); // this.addProfile(event, sectionIndex);
// this.profilesAutoCompleteConfiguration = { // this.profilesAutoCompleteConfiguration = {
// filterFn: this.filterProfiles.bind(this), // filterFn: this.filterProfiles.bind(this),
// initialItems: (excludedItems: any[]) => this.filterProfiles('').pipe(map(result => result.filter(resultItem => (excludedItems || []).map(x => x.id).indexOf(resultItem.id) === -1))), // initialItems: (excludedItems: any[]) => this.filterProfiles('').pipe(map(result => result.filter(resultItem => (excludedItems || []).map(x => x.id).indexOf(resultItem.id) === -1))),
// displayFn: (item) => item['label'], // displayFn: (item) => item['label'],
// titleFn: (item) => item['label'], // titleFn: (item) => item['label'],
// subtitleFn: (item) => item['description'], // subtitleFn: (item) => item['description'],
// popupItemActionIcon: 'visibility' // popupItemActionIcon: 'visibility'
// }; // };
// } }
// }); });
} }
// //