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

added description breadcrumbs (in progress) and ui fixes

This commit is contained in:
Sofia Papacharalampous 2024-05-31 18:26:22 +03:00
parent 9c4c0bcb66
commit a9377e6765
9 changed files with 45 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -19,7 +19,10 @@ const routes: Routes = [
path: 'edit',
loadChildren: () => import('./editor/description-editor.module').then(m => m.DescriptionEditorModule),
data: {
breadcrumb: true
breadcrumb: true,
...BreadcrumbService.generateRouteDataConfiguration({
hideNavigationItem: true
}),
}
},
{

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

@ -77,6 +77,12 @@
</div>
</div>
<div class="container-fluid">
<div class="row pt-2">
<div class="col-12">
<app-navigation-breadcrumb />
</div>
</div>
<div class="row editor-content">
<div style="width: 22em;" class="d-flex flex-column">
<div class="stepper-back row">

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

@ -258,7 +258,7 @@
}
.stepper-options {
height: calc(100vh - 600px);
height: calc(100vh - 650px);
overflow-y: auto;
.main-info {
// padding-left: .2rem;
@ -365,7 +365,7 @@
// left: 362px;
width: calc(100% - 366px);
overflow-y: auto;
height: calc(100vh - 250px);
height: calc(100vh - 270px);
}
}

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

@ -49,6 +49,7 @@ import { ToCEntryType } from './table-of-contents/models/toc-entry-type.enum';
import { TableOfContentsValidationService } from './table-of-contents/services/table-of-contents-validation-service';
import { TableOfContentsComponent } from './table-of-contents/table-of-contents.component';
import { AnalyticsService } from '@app/core/services/matomo/analytics-service';
import { BreadcrumbService } from '@app/ui/misc/breadcrumb/breadcrumb.service';
@Component({
selector: 'app-description-editor-component',
@ -103,7 +104,8 @@ export class DescriptionEditorComponent extends BaseEditor<DescriptionEditorMode
public fileTransformerService: FileTransformerService,
public tocValidationService: TableOfContentsValidationService,
public titleService: Title,
private analyticsService: AnalyticsService
private analyticsService: AnalyticsService,
private breadcrumbService: BreadcrumbService
) {
const descriptionLabel: string = route.snapshot.data['entity']?.label;
if (descriptionLabel) {
@ -153,6 +155,7 @@ export class DescriptionEditorComponent extends BaseEditor<DescriptionEditorMode
});
dialogRef.afterClosed().subscribe((result: Description) => {
if (result) {
this.breadcrumbService.addIdResolvedValue(`${result.dmp.id}/${result.id}`, "this is new");
this.titleService.setTitle(result.label);
result.dmp = this.item.dmp;
result.dmpDescriptionTemplate = this.item.dmpDescriptionTemplate;
@ -261,7 +264,9 @@ export class DescriptionEditorComponent extends BaseEditor<DescriptionEditorMode
}
refreshData(): void {
this.getItem(this.editorModel.id, (data: Description) => this.prepareForm(data));
this.getItem(this.editorModel.id, (data: Description) => {
this.prepareForm(data)
});
this.tocValidationService.validateForm();
}

11
dmp-frontend/src/app/ui/description/editor/description-editor.resolver.ts
View File

@ -15,6 +15,7 @@ import { DmpService } from '@app/core/services/dmp/dmp.service';
import { BreadcrumbService } from '@app/ui/misc/breadcrumb/breadcrumb.service';
import { BaseEditorResolver } from '@common/base/base-editor.resolver';
import { Guid } from '@common/types/guid';
import { TranslateService } from '@ngx-translate/core';
import { concatMap, map, takeUntil, tap } from 'rxjs/operators';
import { nameof } from 'ts-simple-nameof';
@ -24,6 +25,7 @@ export class DescriptionEditorResolver extends BaseEditorResolver {
constructor(
private descriptionService: DescriptionService,
private breadcrumbService: BreadcrumbService,
private language: TranslateService,
private dmpService: DmpService
) {
super();
@ -162,9 +164,14 @@ export class DescriptionEditorResolver extends BaseEditorResolver {
const copyDmpId = route.paramMap.get('copyDmpId');
// const cloneid = route.paramMap.get('cloneid');
if (id != null && copyDmpId == null && dmpSectionId == null) {
return this.descriptionService.getSingle(Guid.parse(id), fields)
return this.descriptionService.getSingle(Guid.parse(id), fields).pipe(tap(d => this.breadcrumbService.addIdResolvedValue(d.id.toString(), d.label)));
} else if (dmpId != null && dmpSectionId != null && copyDmpId == null) {
return this.dmpService.getSingle(Guid.parse(dmpId), DescriptionEditorResolver.dmpLookupFields()).pipe(tap(x => this.breadcrumbService.addIdResolvedValue(x.id?.toString(), x.label)), takeUntil(this._destroyed), map(dmp => {
return this.dmpService.getSingle(Guid.parse(dmpId), DescriptionEditorResolver.dmpLookupFields())
.pipe(tap(x => {
this.breadcrumbService.addIdResolvedValue(x.id?.toString(), x.label);
this.breadcrumbService.addIdResolvedValue(dmpSectionId, this.language.instant("DESCRIPTION-EDITOR.TITLE-NEW"));
}), takeUntil(this._destroyed), map(dmp => {
const description: Description = {};
description.dmp = dmp;

9
dmp-frontend/src/app/ui/description/editor/description-editor.routing.ts
View File

@ -20,9 +20,6 @@ const routes: Routes = [
},
data: {
breadcrumbs: true,
...BreadcrumbService.generateRouteDataConfiguration({
hideNavigationItem: true
}),
getFromTitleService: true,
usePrefix: false
//title: 'DESCRIPTION-EDITOR.TITLE-EDIT-DESCRIPTION'
@ -62,9 +59,6 @@ const routes: Routes = [
},
data: {
breadcrumbs: true,
...BreadcrumbService.generateRouteDataConfiguration({
hideNavigationItem: true
}),
title: 'DESCRIPTION-EDITOR.TITLE-NEW',
getFromTitleService: true,
usePrefix: false
@ -84,9 +78,6 @@ const routes: Routes = [
},
data: {
breadcrumbs: true,
...BreadcrumbService.generateRouteDataConfiguration({
hideNavigationItem: true
}),
title: 'DESCRIPTION-EDITOR.TITLE-NEW',
getFromTitleService: true,
usePrefix: false

10
dmp-frontend/src/app/ui/misc/breadcrumb/navigation-breadcrumb.component.html
View File

@ -13,7 +13,15 @@
<ng-template #regularText>
<ng-container *ngIf="item.title !== HOME_SYMBOL else homeIcon">
<span class="p-2">
{{ item.title | translate:item.translateParams }}
<ng-container *ngFor="let titleItem of titleReferences; let i=index;">
<span class="mr-1">
{{ titleItem | translate:item.translateParams }}
</span>
<ng-container *ngIf="i != titleReferences.length-1">
<span style="font-weight: 500;font-size: 1.3rem;" class="mr-1">/</span>
</ng-container>
</ng-container>
<!-- {{ item.title | translate:item.translateParams }} -->
</span>
</ng-container>
</ng-template>

9
dmp-frontend/src/app/ui/misc/breadcrumb/navigation-breadcrumb.component.ts
View File

@ -17,6 +17,7 @@ import { BreadCrumbRouteData, BreadcrumbService } from "./breadcrumb.service";
export class NavigationBreadcrumbComponent extends BaseComponent {
breadCrumbs: BreadCrumbItem[] = [];
titleReferences: string[] = [];
paramToStringDictionary: Record<string, string> = {};
@ -48,6 +49,7 @@ export class NavigationBreadcrumbComponent extends BaseComponent {
)
.subscribe(breadCrumbs => {
this.breadCrumbs = breadCrumbs;
this.titleReferences = this.getTitleReferences();
this.cdr.markForCheck();
});
}
@ -145,8 +147,7 @@ export class NavigationBreadcrumbComponent extends BaseComponent {
const title = Object.keys(pathParams)
.sort((a, b) => b.length - a.length) // avoid param overlapping => :id2 (length 3) should be replaced before :id (length 2)
.reduce(
(aggr, current) => this.paramToStringDictionary[pathParams[current]] ?? pathParams[current]
// return aggr.replace(`:${current}`, this.paramToStringDictionary[pathParams[current]] ?? pathParams[current])
(aggr, current) => aggr.replace(`:${current}`, this.paramToStringDictionary[pathParams[current]] ?? pathParams[current])
, path ?? ''
);
@ -168,6 +169,10 @@ export class NavigationBreadcrumbComponent extends BaseComponent {
return path;
}
getTitleReferences(): string[] {
return this.breadCrumbs[this.breadCrumbs.length-1].title.split('/');
}
}

2
dmp-frontend/src/app/ui/sidebar/sidebar.component.css
View File

@ -35,7 +35,7 @@
flex-direction: row;
align-items: center;
width: 100%;
padding: 0.5rem 1rem 0.5rem 1.2rem;
padding: 0.5rem 0.8rem 0.5rem 1.2rem;
text-align: left;
letter-spacing: 0px;
color: #000000;