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

added dmp breadcrumbs

This commit is contained in:
Sofia Papacharalampous 2024-05-31 17:29:03 +03:00
parent 61ec8e7523
commit 9c4c0bcb66
7 changed files with 60 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -365,7 +365,7 @@
// left: 362px; // left: 362px;
width: calc(100% - 366px); width: calc(100% - 366px);
overflow-y: auto; overflow-y: auto;
height: calc(100vh - 218px); height: calc(100vh - 250px);
} }
} }

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

@ -30,46 +30,56 @@
</div> </div>
</div> </div>
<div class="container-fluid">
<div class="row pt-2">
<div class="col-12">
<app-navigation-breadcrumb />
</div>
</div>
</div>
<!-- First Step --> <!-- First Step -->
<div class="row" id="editor-form" *ngIf="this.step === 0 && this.isNew"> <div class="container-fluid">
<div class="col-12 blueprint-section"> <div class="row" id="editor-form" *ngIf="this.step === 0 && this.isNew">
<div class="row"> <div class="col-12 blueprint-section">
<div class="heading2 col-12">{{'DMP-EDITOR.FIELDS.TITLE' | translate}} *</div> <div class="row">
<div class="col-12"> <div class="heading2 col-12">{{'DMP-EDITOR.FIELDS.TITLE' | translate}} *</div>
<div class="col-12">
<mat-form-field class="w-100">
<mat-label>{{'DMP-EDITOR.FIELDS.TITLE' | translate}}</mat-label>
<input matInput type="text" name="label" [formControl]="formGroup.get('label')" required>
<mat-error *ngIf="formGroup.get('label').hasError('backendError')">{{formGroup.get('label').getError('backendError').message}}</mat-error>
<mat-error *ngIf="formGroup.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field>
</div>
</div>
<div class="row">
<div class="heading2 col-12">{{'DMP-EDITOR.FIELDS.DESCRIPTION' | translate}} *</div>
<div class="col-12">
<rich-text-editor-component [form]="formGroup.get('description')" placeholder="{{'DMP-EDITOR.PLACEHOLDER.DESCRIPTION' | translate}}" [required]="true">
</rich-text-editor-component>
</div>
</div>
<div class="dmp-blueprint-form" style="margin-top: 3%;">
<div class="heading2">{{'DMP-EDITOR.FIELDS.BLUEPRINT' | translate}} *</div>
<mat-form-field class="w-100"> <mat-form-field class="w-100">
<mat-label>{{'DMP-EDITOR.FIELDS.TITLE' | translate}}</mat-label> <mat-label>{{'DMP-EDITOR.FIELDS.BLUEPRINT' | translate}}</mat-label>
<input matInput type="text" name="label" [formControl]="formGroup.get('label')" required> <app-single-auto-complete [required]="false" [formControl]="formGroup.get('blueprint')" placeholder="{{'DMP-EDITOR.PLACEHOLDER.BLUEPRINT' | translate}}" [configuration]="singleAutocompleteBlueprintConfiguration">
<mat-error *ngIf="formGroup.get('label').hasError('backendError')">{{formGroup.get('label').getError('backendError').message}}</mat-error> </app-single-auto-complete>
<mat-error *ngIf="formGroup.get('label').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
</div> </div>
</div> <div class="row">
<div class="row"> <div class="col-5">
<div class="heading2 col-12">{{'DMP-EDITOR.FIELDS.DESCRIPTION' | translate}} *</div> <button mat-button class="action-btn" [disabled]="!(formGroup.get('blueprint').value && formGroup.get('label').value && formGroup.get('description').value)" (click)="selectBlueprint()">{{'DMP-EDITOR.STEPPER.NEXT' | translate}}</button>
<div class="col-12"> </div>
<rich-text-editor-component [form]="formGroup.get('description')" placeholder="{{'DMP-EDITOR.PLACEHOLDER.DESCRIPTION' | translate}}" [required]="true"> <div class="col-7" *ngIf="formGroup.get('blueprint').value == null || (formGroup.get('blueprint').value && formGroup.get('blueprint').value.id !== defaultBlueprintId)">
</rich-text-editor-component> <div class="row">
</div> <div class="col-6">
</div> <p>{{'DMP-EDITOR.ACTIONS.OR-CONTINUE-WITH' | translate}}</p>
<div class="dmp-blueprint-form" style="margin-top: 3%;"> </div>
<div class="heading2">{{'DMP-EDITOR.FIELDS.BLUEPRINT' | translate}} *</div> <div class="col-6">
<mat-form-field class="w-100"> <button mat-button class="action-btn" style="float: right;" (click)="selectDefaultBlueprint()">{{'DMP-EDITOR.ACTIONS.DEFAULT-BLUEPRINT' | translate}}</button>
<mat-label>{{'DMP-EDITOR.FIELDS.BLUEPRINT' | translate}}</mat-label> </div>
<app-single-auto-complete [required]="false" [formControl]="formGroup.get('blueprint')" placeholder="{{'DMP-EDITOR.PLACEHOLDER.BLUEPRINT' | translate}}" [configuration]="singleAutocompleteBlueprintConfiguration">
</app-single-auto-complete>
</mat-form-field>
</div>
<div class="row">
<div class="col-5">
<button mat-button class="action-btn" [disabled]="!(formGroup.get('blueprint').value && formGroup.get('label').value && formGroup.get('description').value)" (click)="selectBlueprint()">{{'DMP-EDITOR.STEPPER.NEXT' | translate}}</button>
</div>
<div class="col-7" *ngIf="formGroup.get('blueprint').value == null || (formGroup.get('blueprint').value && formGroup.get('blueprint').value.id !== defaultBlueprintId)">
<div class="row">
<div class="col-6">
<p>{{'DMP-EDITOR.ACTIONS.OR-CONTINUE-WITH' | translate}}</p>
</div>
<div class="col-6">
<button mat-button class="action-btn" style="float: right;" (click)="selectDefaultBlueprint()">{{'DMP-EDITOR.ACTIONS.DEFAULT-BLUEPRINT' | translate}}</button>
</div> </div>
</div> </div>
</div> </div>

6
dmp-frontend/src/app/ui/dmp/dmp-editor-blueprint/dmp-editor.component.scss
View File

@ -246,14 +246,14 @@ mat-icon.size-16 {
// left: 362px; // left: 362px;
width: calc(100% - 366px); width: calc(100% - 366px);
overflow-y: auto; overflow-y: auto;
height: calc(100vh - 218px); height: calc(100vh - 250px);
} }
.formForStep0 { .formForStep0 {
position: relative; position: relative;
width: 100%; width: 100%;
overflow-y: auto; overflow-y: auto;
height: calc(100vh - 218px); height: calc(100vh - 250px);
} }
.action-btn { .action-btn {
@ -281,7 +281,7 @@ mat-icon.size-16 {
letter-spacing: 0px; letter-spacing: 0px;
color: #212121; color: #212121;
opacity: 1; opacity: 1;
margin: 3rem 0rem 3rem 0rem; margin: 1rem 0rem 3rem 0rem;
} }
.changes { .changes {

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

@ -52,6 +52,7 @@ import { DmpEditorService } from './dmp-editor.service';
import { Title } from '@angular/platform-browser'; import { Title } from '@angular/platform-browser';
import { AnalyticsService } from '@app/core/services/matomo/analytics-service'; import { AnalyticsService } from '@app/core/services/matomo/analytics-service';
import { DmpContactPrefillDialogComponent } from '../dmp-contact-prefill-dialog/dmp-contact-prefill-dialog.component'; import { DmpContactPrefillDialogComponent } from '../dmp-contact-prefill-dialog/dmp-contact-prefill-dialog.component';
import { BreadcrumbService } from '@app/ui/misc/breadcrumb/breadcrumb.service';
@Component({ @Component({
selector: 'app-dmp-editor', selector: 'app-dmp-editor',
@ -166,6 +167,7 @@ export class DmpEditorComponent extends BaseEditor<DmpEditorModel, Dmp> implemen
public descriptionService: DescriptionService, public descriptionService: DescriptionService,
public titleService: Title, public titleService: Title,
private analyticsService: AnalyticsService, private analyticsService: AnalyticsService,
private breadcrumbService: BreadcrumbService
) { ) {
const descriptionLabel:string = route.snapshot.data['entity']?.label; const descriptionLabel:string = route.snapshot.data['entity']?.label;
if (descriptionLabel) { if (descriptionLabel) {
@ -273,6 +275,7 @@ export class DmpEditorComponent extends BaseEditor<DmpEditorModel, Dmp> implemen
refreshData(): void { refreshData(): void {
this.getItem(this.editorModel.id, (data: Dmp) => { this.getItem(this.editorModel.id, (data: Dmp) => {
this.breadcrumbService.addIdResolvedValue(data.id.toString(), data.label);
this.prepareForm(data) this.prepareForm(data)
if (this.isNew === false && this.step===0) this.nextStep(); if (this.isNew === false && this.step===0) this.nextStep();
}); });

6
dmp-frontend/src/app/ui/dmp/dmp-editor-blueprint/dmp-editor.routing.ts
View File

@ -17,9 +17,6 @@ const routes: Routes = [
canDeactivate: [PendingChangesGuard], canDeactivate: [PendingChangesGuard],
data: { data: {
breadcrumb: true, breadcrumb: true,
...BreadcrumbService.generateRouteDataConfiguration({
hideNavigationItem: true
}),
authContext: { authContext: {
permissions: [AppPermission.NewDmp] permissions: [AppPermission.NewDmp]
} }
@ -35,9 +32,6 @@ const routes: Routes = [
}, },
data: { data: {
breadcrumb: true, breadcrumb: true,
...BreadcrumbService.generateRouteDataConfiguration({
hideNavigationItem: true
}),
getFromTitleService: true, getFromTitleService: true,
usePrefix: false usePrefix: false
} }

6
dmp-frontend/src/app/ui/dmp/dmp.routing.ts
View File

@ -18,6 +18,9 @@ const routes: Routes = [
loadChildren: () => import('./dmp-editor-blueprint/dmp-editor.module').then(m => m.DmpEditorModule), loadChildren: () => import('./dmp-editor-blueprint/dmp-editor.module').then(m => m.DmpEditorModule),
data: { data: {
breadcrumb: true, breadcrumb: true,
...BreadcrumbService.generateRouteDataConfiguration({
title: 'DMP-EDITOR.TITLE-NEW'
}),
title: 'DMP-EDITOR.TITLE-NEW' title: 'DMP-EDITOR.TITLE-NEW'
} }
}, },
@ -26,6 +29,9 @@ const routes: Routes = [
loadChildren: () => import('./dmp-editor-blueprint/dmp-editor.module').then(m => m.DmpEditorModule), loadChildren: () => import('./dmp-editor-blueprint/dmp-editor.module').then(m => m.DmpEditorModule),
data: { data: {
breadcrumb: true, breadcrumb: true,
...BreadcrumbService.generateRouteDataConfiguration({
hideNavigationItem: true
}),
title: 'DMP-EDITOR.TITLE-EDIT' title: 'DMP-EDITOR.TITLE-EDIT'
} }
}, },

2
dmp-frontend/src/assets/i18n/en.json
View File

@ -1547,7 +1547,7 @@
"DMP-EDITOR": { "DMP-EDITOR": {
"TITLE-NEW": "New Plan", "TITLE-NEW": "New Plan",
"TITLE-EDIT": "Editing Plan", "TITLE-EDIT": "Editing Plan",
"TITLE": "Plan Blueprint", "TITLE": "Plan Template",
"UNSAVED-CHANGES": "unsaved changes", "UNSAVED-CHANGES": "unsaved changes",
"LOCKED": "Locked", "LOCKED": "Locked",
"DESCRIPTION": "Description", "DESCRIPTION": "Description",