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

Merge branch 'ui-redesign' of gitlab.eudat.eu:dmp/OpenAIRE-EUDAT-DMP-service-pilot into ui-redesign

This commit is contained in:
apapachristou 2020-07-03 18:51:57 +03:00
parent 132f5675d3 58df04516c
commit a8528ee5b1
14 changed files with 835 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
dmp-frontend/src/app/core/model/dataset/dataset-overview.ts
View File

@ -1,8 +1,16 @@
import { DatasetProfileModel } from "./dataset-profile";
import { GrantOverviewModel } from '../grant/grant-overview';
export interface DatasetOverviewModel {
id: string;
label: string;
status: any;
datasetTemplate: DatasetProfileModel;
users: any[];
dmp: String;
grant: GrantOverviewModel;
description: String;
public: boolean;
modified: Date;
}

20
dmp-frontend/src/app/core/services/dataset/dataset.service.ts
View File

@ -10,11 +10,15 @@ import { ExploreDatasetCriteriaModel } from '../../query/explore-dataset/explore
import { BaseHttpService } from '../http/base-http.service';
import { DatasetProfileCriteria } from '../../query/dataset-profile/dataset-profile-criteria';
import { ConfigurationService } from '../configuration/configuration.service';
import { DatasetOverviewModel } from '@app/core/model/dataset/dataset-overview';
import { HttpHeaders } from '@angular/common/http';
import { DatasetModel } from '@app/core/model/dataset/dataset';
@Injectable()
export class DatasetService {
private actionUrl: string;
private headers = new HttpHeaders();
constructor(
private http: BaseHttpService,
@ -49,4 +53,20 @@ export class DatasetService {
clearIndex() {
return this.http.delete(this.actionUrl + 'index');
}
getOverviewSingle(id: string): Observable<DatasetOverviewModel> {
return this.http.get<DatasetOverviewModel>(this.actionUrl + 'overview/' + id, { headers: this.headers });
}
getOverviewSinglePublic(id: string): Observable<DatasetOverviewModel> {
return this.http.get<DatasetOverviewModel>(this.actionUrl + 'publicOverview/' + id, { headers: this.headers })
}
clone(datasetModel: DatasetModel, id: String): Observable<DatasetModel> {
return this.http.post<DatasetModel>(this.actionUrl + 'clone/' + id, datasetModel, { headers: this.headers });
}
delete(id: String): Observable<DatasetModel> {
return this.http.delete<DatasetModel>(this.actionUrl + 'delete/' + id, { headers: this.headers }); // + 'delete/'
}
}

4
dmp-frontend/src/app/ui/dataset/dataset.module.ts
View File

@ -23,6 +23,7 @@ import { ConfirmationDialogModule } from '@common/modules/confirmation-dialog/co
import { CommonUiModule } from '@common/ui/common-ui.module';
import { AngularStickyThingsModule } from '@w11k/angular-sticky-things';
import { DatasetCopyDialogModule } from './dataset-wizard/dataset-copy-dialogue/dataset-copy-dialogue.module';
import { DatasetOverviewModule } from './overview/dataset-overview.module';
@NgModule({
imports: [
@ -38,7 +39,8 @@ import { DatasetCopyDialogModule } from './dataset-wizard/dataset-copy-dialogue/
AngularStickyThingsModule,
DatasetRoutingModule,
FormValidationErrorsDialogModule,
DatasetCopyDialogModule
DatasetCopyDialogModule,
DatasetOverviewModule
],
declarations: [
DatasetListingComponent,

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

@ -3,6 +3,7 @@ import { RouterModule, Routes } from '@angular/router';
import { AuthGuard } from '../../core/auth-guard.service';
import { DatasetWizardComponent } from './dataset-wizard/dataset-wizard.component';
import { DatasetListingComponent } from './listing/dataset-listing.component';
import { DatasetOverviewComponent } from './overview/dataset-overview.component';
const routes: Routes = [
{
@ -76,14 +77,22 @@ const routes: Routes = [
title: 'GENERAL.TITLES.DATASET-UPDATE'
},
},
// {
// path: 'overview/:id',
// component: DatasetOverviewComponent,
// data: {
// breadcrumb: true,
// title: 'GENERAL.TITLES.DATASET-OVERVIEW'
// },
// },
{
path: 'overview/:id',
component: DatasetOverviewComponent,
data: {
breadcrumb: true,
title: 'GENERAL.TITLES.DATASET-OVERVIEW'
},
},
{
path: 'publicOverview/:publicId',
component: DatasetOverviewComponent,
data: {
breadcrumb: true,
title: 'GENERAL.TITLES.DATASET-OVERVIEW'
},
}
];
@NgModule({

224
dmp-frontend/src/app/ui/dataset/overview/dataset-overview.component.html Normal file
View File

@ -0,0 +1,224 @@
<div class="main-content pl-5 pr-5">
<div class="container-fluid pl-0 pr-0">
<div *ngIf="dataset">
<a class="row mb-2 pl-1" (click)="goBack()" role="button">
<mat-icon class="back-icon">chevron_left</mat-icon>
<p class="label-txt">{{'DMP-WIZARD.ACTIONS.BACK' | translate}}</p>
</a>
<div class="row">
<div class="col-md-8 col-lg-8 pl-4">
<div class="row">
<span class="dataset-logo">{{ 'NAV-BAR.DATASET' | translate }}</span>
<p class="dataset-label ml-2 mb-0">{{ dataset.label }}</p>
</div>
<div class="row d-flex align-items-center mt-3 mb-4 label-txt">
<div *ngIf="isUserDatasetRelated()" class="d-flex">
<p class="ml-0 mr-3 mb-0 label2-txt">
{{ roleDisplayFromList(dataset.users) }}
</p>
</div>
<div class="d-flex mr-4">
<div *ngIf="dataset.public" class="d-flex flex-row">
<mat-icon class="status-icon">public</mat-icon>
{{'DMP-OVERVIEW.PUBLIC' | translate}}
</div>
<div *ngIf="!dataset.public" class="d-flex flex-row">
<mat-icon class="status-icon">public_off</mat-icon>
{{'DMP-OVERVIEW.PRIVATE' | translate}}
</div>
</div>
<!-- <div class="d-flex mr-4">
<div *ngIf="lockStatus" class="d-flex flex-row">
<mat-icon class="status-icon">lock_outline</mat-icon>
{{'DMP-OVERVIEW.LOCKED' | translate}}
</div>
<div *ngIf="!lockStatus" class="d-flex flex-row">
<mat-icon class="status-icon">lock_open</mat-icon>
{{'DMP-OVERVIEW.UNLOCKED' | translate}}
</div>
</div> -->
<!-- <button class="d-flex mr-4 version-btn label2-txt"
(click)="viewVersions(dmp.groupId, dmp.label)">
{{'DMP-LISTING.ACTIONS.VIEW-VERSION' | translate}}
</button> -->
<div class="d-flex mr-4">{{'GENERAL.STATUSES.EDIT' | translate}} :
{{dataset.modified | date:"longDate"}}
</div>
<!-- <div class="d-flex mr-4">
<div *ngIf="dmp.status" class="d-flex flex-row uppercase">
<mat-icon class="status-icon">check</mat-icon>
{{'DATASET-LISTING.COLUMNS.FINALIZED' | translate}}
</div>
</div> -->
</div>
<div class="row mb-4 pb-3">
<button *ngIf="isAuthenticated()" (click)="cloneClicked(dataset)" mat-mini-fab
class="mr-3 d-flex justify-content-center align-items-center"
matTooltip="{{'DMP-LISTING.ACTIONS.CLONE' | translate}}" matTooltipPosition="above">
<mat-icon class="mat-mini-fab-icon">content_copy</mat-icon>
</button>
<button *ngIf="isDraftDataset(dataset) && isUserOwner" (click)="editClicked(dataset)"
mat-mini-fab class="mr-3 d-flex justify-content-center align-items-center"
matTooltip="{{'DMP-LISTING.ACTIONS.EDIT' | translate}}" matTooltipPosition="above">
<mat-icon class="mat-mini-fab-icon">create</mat-icon>
</button>
<button *ngIf="isDraftDataset(dataset) && isUserOwner" (click)="deleteClicked()" mat-mini-fab
class="mr-3 d-flex justify-content-center align-items-center"
matTooltip="{{'DMP-LISTING.ACTIONS.DELETE' | translate}}" matTooltipPosition="above">
<mat-icon class="mat-mini-fab-icon">delete</mat-icon>
</button>
<!-- <button *ngIf="isDraftDmp(dmp) && isUserOwner && !lockStatus" mat-mini-fab (click)="createOrUpdate(dmp.id)"
class="mr-3 d-flex justify-content-center align-items-center">
<mat-icon class="mat-mini-fab-icon" matTooltip="{{'DMP-OVERVIEW.LOCK' | translate}}"
matTooltipPosition="above">lock_outline
</mat-icon>
</button> -->
</div>
<div class="row header">{{'DATASET-LISTING.TOOLTIP.PART-OF' | translate}}</div>
<div class="row ">
<button class="dmp-btn">
<div class="dmp-btn-label">
{{ 'DATASET-LISTING.TOOLTIP.DMP-FOR' | translate }}: {{ dataset.datasetTemplate.label }}
</div>
<mat-icon>launch</mat-icon>
</button>
</div>
<div class="row header">{{'DMP-OVERVIEW.GRANT' | translate}}</div>
<div class="row dmp-label">Grant label</div>
<!-- <div class="row dmp-label">{{ dataset.grant.label }}</div> -->
<div class="row header">{{'DMP-OVERVIEW.RESEARCHERS' | translate}}</div>
<div class="row">
<!-- <div *ngFor="let researcher of dataset.dmp.researchers; let last = last">
<a href="{{getOrcidPath() + researcher.id }}" target="blank" class="researcher">
<div class="id-btn">&nbsp;</div>
<div *ngIf="!last">{{ researcher.name }}, </div>
<div *ngIf="last">{{ researcher.name }}</div>
</a>
</div> -->
</div>
<div class="row header">{{'DATASET-LISTING.COLUMNS.DESCRIPTION' | translate}}</div>
<div class="row" *ngIf="dataset.description">
<p class="desc-txt">{{ dataset.description }}</p>
</div>
</div>
<div class="col-md-4 col-lg-4 p-0">
<!-- <div *ngIf="!hasDoi(dmp)" class="row d-flex flex-column ml-0 mr-0 mb-3">
<p class="doi-label">{{'DMP-EDITOR.TITLE.SUBTITLE' | translate}}</p>
<div class="doi-panel">
<p *ngIf="!hasDoi(dmp)" class="mb-0 ml-3">
<textarea #doi class="doi-txt">{{ dmp.doi }}</textarea>
</p>
<div class="d-flex justify-content-end">
<button (click)="copyDoi(doi)" mat-mini-fab
class="mr-2 d-flex justify-content-center align-items-center"
matTooltip="{{'DMP-LISTING.ACTIONS.CLONE' | translate}}" matTooltipPosition="above">
<mat-icon class="mat-mini-fab-icon">content_copy</mat-icon>
</button>
<button mat-mini-fab class="mr-2 d-flex justify-content-center align-items-center"
matTooltip="{{'GRANT-EDITOR.ACTIONS.VISIT-WEBSITE' | translate}}"
matTooltipPosition="above">
<a [href]="createDoiLink(dmp.doi)" class="doi-link" target="_blank">
<mat-icon class="mat-mini-fab-icon">launch</mat-icon>
</a>
</button>
</div>
</div>
</div> -->
<div class="frame mb-3 pt-4 pl-3 pr-5 pb-1">
<!-- <div *ngIf="!dmp.status && isDraftDmp(dmp) && isUserOwner">
<div class="row ml-0 mr-0 pl-4 d-flex align-items-center" (click)="finalize(dmp)">
<button mat-mini-fab class="finalize-btn">
<mat-icon class="mat-mini-fab-icon">check</mat-icon>
</button>
<p class="mb-0 pl-2 finalize-txt">{{ 'DMP-LISTING.ACTIONS.FINALIZE' | translate }}</p>
</div>
<div class="row ml-0 mr-0 pl-4 d-flex align-items-center">
<hr class="hr-line">
</div>
</div> -->
<!-- <div *ngIf="hasDoi(dmp) && isFinalizedDmp(dmp) && !this.isPublicView && isUserOwner"
(click)="getDoi(dmp)" class="row ml-0 mr-0 pl-4 pb-3 d-flex align-items-center">
<button mat-mini-fab class="frame-btn">
<mat-icon class="mat-mini-fab-icon">archive</mat-icon>
</button>
<p class="mb-0 pl-2 frame-txt">{{ 'DMP-LISTING.ACTIONS.DEPOSIT' | translate }}</p>
</div> -->
<!-- <div class="row ml-0 mr-0 pl-4 pb-3 d-flex align-items-center">
<button mat-mini-fab class="frame-btn" [matMenuTriggerFor]="exportMenu">
<mat-icon class="mat-mini-fab-icon">open_in_new</mat-icon>
</button>
<p class="mb-0 mr-0 pl-2 frame-txt" [matMenuTriggerFor]="exportMenu">
{{ 'DMP-LISTING.ACTIONS.EXPORT' | translate }}</p>
</div> -->
<!-- <div class="row ml-0 mr-0 pl-4 pb-3 d-flex align-items-center" *ngIf="isUserOwner"
(click)="newVersion(dmp.id, dmp.label)">
<button mat-mini-fab class="frame-btn">
<mat-icon class="mat-mini-fab-icon">add_to_photos</mat-icon>
</button>
<p class="mb-0 pl-2 frame-txt">{{ 'DMP-LISTING.ACTIONS.START-NEW-VERSION' | translate }}
</p>
</div> -->
<!-- <div *ngIf="!dataset.public && showPublishButton(dmp) && isUserOwner"
class="row ml-0 mr-0 pl-4 pb-3 d-flex align-items-center" (click)="publish(dmp.id)">
<button mat-mini-fab class="frame-btn">
<mat-icon class="mat-mini-fab-icon">public</mat-icon>
</button>
<p class="mb-0 pl-2 frame-txt">{{ 'DMP-LISTING.ACTIONS.MAKE-PUBLIC' | translate }}</p>
</div>
<mat-menu #exportMenu="matMenu" xPosition="before">
<button mat-menu-item (click)="downloadPDF(dmp.id)">
<i class="fa fa-file-pdf-o pr-2"></i>
<span>{{'GENERAL.FILE-TYPES.PDF' | translate}}</span>
</button>
<button mat-menu-item (click)="downloadDocx(dmp.id)">
<i class="fa fa-file-word-o pr-2"></i>
<span>{{'GENERAL.FILE-TYPES.DOC' | translate}}</span>
</button>
<button mat-menu-item (click)="downloadXml(dmp.id)">
<i class="fa fa-file-code-o pr-2"></i>
<span>{{'GENERAL.FILE-TYPES.XML' | translate}}</span>
</button>
<button mat-menu-item (click)="downloadJson(dmp.id)">
<i class="fa fa-file-o pr-2"></i>
<span>{{'GENERAL.FILE-TYPES.JSON' | translate}}</span>
</button>
</mat-menu>
</div> -->
<!-- <div class="frame mb-3 pt-4 pl-3 pr-3 pb-1">
<div class="row ml-0 mr-0 pl-4 pb-3">
<p class="header">{{ 'DATASET-OVERVIEW.DATASET-AUTHORS' | translate }}</p>
</div>
<div class="row ml-0 mr-0 pl-4 ml-2 pb-3 d-flex align-items-center">
<div *ngFor="let user of dmp.users" class="row authors">
<div class="d-flex flex-row">
<button class="account_btn mr-3 pl-0">
<mat-icon class="account-icon">account_circle</mat-icon>
</button>
<div>
<p class="authors-label">{{ user.name }}
<span *ngIf="isUserAuthor(user.id)">
({{ 'DMP-OVERVIEW.YOU' | translate }})</span>
</p>
<p class="authors-role">{{ roleDisplay(user) }}</p>
</div>
</div>
<button *ngIf="isUserOwner && !dmp.status && user.role"
(click)="removeCollaborator(user.id)"
class="remove-btn">{{ 'GENERAL.CONFIRMATION-DIALOG.ACTIONS.REMOVE' | translate}}</button>
</div>
</div>
<div *ngIf="isUserOwner" (click)="openShareDialog(dmp.id,dmp.label)"
class="row mt-3 mb-3 d-flex align-items-center justify-content-center">
<button mat-raised-button class="invite-btn">
<mat-icon>group_add</mat-icon>
{{'DMP-LISTING.ACTIONS.INVITE-SHORT' | translate}}
</button>
</div>
</div> -->
</div>
</div>
</div>
</div>
</div>

281
dmp-frontend/src/app/ui/dataset/overview/dataset-overview.component.scss Normal file
View File

@ -0,0 +1,281 @@
.container-fluid {
margin: 2em 4em;
padding: 2em;
}
// ********ICONS********
.back-icon {
opacity: 0.4;
}
.mat-mini-fab {
width: 2.5em;
height: 2.5em;
color: #212121;
background-color: #F7DD72;
}
.mat-mini-fab-icon, .status-icon {
font-size: 1.2em;
}
.mat-mini-fab:hover {
background-color: #129D99;
color: #FFFFFF;
}
.status-icon {
color: #A7A7A7;
}
.account-icon {
font-size: 2.5em;
}
// ********BUTTONS********
.version-btn {
// width: 6.7em;
height: 1.8em;
border: 1px solid #707070;
border-radius: 4px;
background-color: transparent;
}
.id-btn {
background: url('../../../../assets/images/NoPath.png') no-repeat center;
width: 1em;
margin-right: 0.3em;
align-self: center;
}
.dmp-btn {
width: 35em;
height: 2.3em;
background-color: #129D99;
border-radius: 4px;
flex-direction: rows;
justify-content: space-between;
border: none;
}
.dmp-btn, .dmp-btn > mat-icon {
color: #ffffff;
opacity: 0.8;
}
.show-more-btn {
width: 31.6em;
padding: 0 1em;
background-color: #ffffff00;
color: #129D99;
font-weight: 700;
}
.frame-btn {
border: 1px solid #212121;
color: black;
}
.finalize-btn {
border: 1px solid #129D99;
color: #129D99;
}
.frame-btn, .finalize-btn {
background: #FFFFFF;
box-shadow: 0px 2px 6px #00000029;
}
.remove-btn {
border: none;
background-color: transparent;
font-size: 0.875em;
font-weight: bold;
margin-left: auto;
}
.invite-btn{
width: 9.4em;
height: 2.9em;
background: #FFFFFF;
box-shadow: 0px 3px 6px #1E202029;
border: 2px solid #212121;
border-radius: 30px;
}
.account_btn {
background: white;
color: #D5D5D5;
border: none;
height: 2.9em;
}
// ********TEXT********
.dataset-logo {
width: 6em;
height: 2.6em;
background: #F7DD72;
border-radius: 4px;
font-size: 0.875em;
// color: #212121;
// color: black;
// opacity: 0.75;
}
.label-txt {
font-size: 0.875em;
}
.label2-txt {
font-size: 1em;
}
.label-txt, .label2-txt {
color: #848484;
}
.dataset-label {
font-weight: bold;
}
.uppercase {
text-transform: uppercase;
}
.researcher {
font-size: 0.875em;
color: #008887;
padding-right: 0.5em;
align-self: center;
}
.header {
opacity: 0.6;
margin-top: 1em;
margin-bottom: 0.25em;
}
.dataset-label, .header {
font-size: 1.25em;
color: #212121;
}
.desc-txt {
width: 48.25em;
font-size: 1em;
color: #212121;
margin-bottom: 1.875em;
}
.dmp-btn-label {
margin-right: 1em;
overflow: hidden;
color: #FFFFFF;
opacity: 0.8;
}
.doi-label {
font-size: 1em;
color: #212121;
opacity: 0.6;
margin-bottom: 0.3em;
}
.doi-txt {
font-size: 0.8em;
letter-spacing: 0.009em;
color: #7D7D7D;
width: 12em;
height: 1em;
overflow: hidden;
border: none;
padding: 0px;
}
.doi-panel {
height: 3.5em;
background: #FAFAFA;
border: 1px solid #D1D1D1;
border-radius: 4px;
flex-direction: row;
justify-content: space-between;
}
.doi-link {
color: white;
}
.frame {
background: #FFFFFF;
box-shadow: 0px 1px 5px #00000026;
border-radius: 4px;
overflow: hidden;
}
.frame-txt {
color: #000000;
}
.finalize-txt {
color: #129D99;
}
.frame-txt, .finalize-txt {
font-size: 0.75em;
font-weight: bold;
letter-spacing: 0px;
text-transform: uppercase;
cursor: pointer;
}
.hr-line {
border: 1px solid #DBDBDB;
// width: 274px;
// width: 17em;
width: 100%;
}
.authors {
display: flex;
flex-direction: row;
justify-content: space-between;
width: 100%;
}
.authors-label {
font-size: 0.875em;
color: #212121;
height: 1.4em;
margin-bottom: 0px;
}
.authors-role {
font-size: 0.875em;
color: #A8A8A8;
height: 1.4em;
margin-bottom: 0px;
}
// ********CENTER ELEMENTS********
.mat-mini-fab, .mat-mini-fab-icon,
.status-icon, .dataset-logo, .frame-btn, .finalize-btn {
display: flex;
justify-content: center;
align-items: center;
}
.dataset-label, .dmp-btn,
.doi-panel, .researcher {
display: flex;
align-items: center;
}
.show-more-btn {
display: flex;
justify-content: center;
}

221
dmp-frontend/src/app/ui/dataset/overview/dataset-overview.component.ts Normal file
View File

@ -0,0 +1,221 @@
import { Component, OnInit } from '@angular/core';
import { BaseComponent } from '@common/base/base.component';
import { DatasetOverviewModel } from '@app/core/model/dataset/dataset-overview';
import { BreadcrumbItem } from '@app/ui/misc/breadcrumb/definition/breadcrumb-item';
import { Observable, of as observableOf, interval } from 'rxjs';
import { ActivatedRoute, Router, Params } from '@angular/router';
import { DatasetService } from '@app/core/services/dataset/dataset.service';
import { TranslateService } from '@ngx-translate/core';
import { AuthService } from '@app/core/services/auth/auth.service';
import { MatDialog } from '@angular/material';
import { SnackBarNotificationLevel, UiNotificationService } from '@app/core/services/notification/ui-notification-service';
import { ConfigurationService } from '@app/core/services/configuration/configuration.service';
import { Oauth2DialogService } from '@app/ui/misc/oauth2-dialog/service/oauth2-dialog.service';
import { UserService } from '@app/core/services/user/user.service';
import { takeUntil } from 'rxjs/operators';
import { Principal } from '@app/core/model/auth/principal';
import { Role } from '@app/core/common/enum/role';
import { Location } from '@angular/common';
import { UserInfoListingModel } from '@app/core/model/user/user-info-listing';
import { DatasetStatus } from '@app/core/common/enum/dataset-status';
import { ConfirmationDialogComponent } from '@common/modules/confirmation-dialog/confirmation-dialog.component';
@Component({
selector: 'app-dataset-overview',
templateUrl: './dataset-overview.component.html',
styleUrls: ['./dataset-overview.component.scss']
})
export class DatasetOverviewComponent extends BaseComponent implements OnInit {
dataset: DatasetOverviewModel;
isNew = true;
isFinalized = false;
isPublicView = true;
hasPublishButton: boolean = true;
breadCrumbs: Observable<BreadcrumbItem[]> = observableOf();
isUserOwner: boolean;
expand = false;
hasDOIToken = false;
constructor(
private route: ActivatedRoute,
private router: Router,
private datasetService: DatasetService,
private translate: TranslateService,
private authentication: AuthService,
private dialog: MatDialog,
private language: TranslateService,
private uiNotificationService: UiNotificationService,
private configurationService: ConfigurationService,
private oauth2DialogService: Oauth2DialogService,
private userService: UserService,
private location: Location
) {
super();
}
ngOnInit() {
// Gets dataset data using parameter id
this.route.params
.pipe(takeUntil(this._destroyed))
.subscribe((params: Params) => {
const itemId = params['id'];
const publicId = params['publicId'];
if (itemId != null) {
this.isNew = false;
this.isPublicView = false;
this.datasetService.getOverviewSingle(itemId)
.pipe(takeUntil(this._destroyed))
.subscribe(data => {
this.dataset = data;
// this.checkLockStatus(this.dataset.id);
this.setIsUserOwner();
const breadCrumbs = [];
breadCrumbs.push({ parentComponentName: null, label: this.language.instant('NAV-BAR.MY-DATASET-DESCRIPTIONS'), url: "/datasets" });
breadCrumbs.push({ parentComponentName: 'DatasetListingComponent', label: this.dataset.label, url: '/datasets/overview/' + this.dataset.id });
this.breadCrumbs = observableOf(breadCrumbs);
}, (error: any) => {
if (error.status === 404) {
return this.onFetchingDeletedCallbackError('/datasets/');
}
if (error.status === 403) {
return this.onFetchingForbiddenCallbackError('/datasets/');
}
});
}
else if (publicId != null) {
this.isNew = false;
this.isFinalized = true;
this.isPublicView = true;
this.datasetService.getOverviewSinglePublic(publicId)
.pipe(takeUntil(this._destroyed))
.subscribe(data => {
this.dataset = data;
// this.checkLockStatus(this.dataset.id);
this.setIsUserOwner();
const breadCrumbs = [];
breadCrumbs.push({ parentComponentName: null, label: this.language.instant('NAV-BAR.PUBLIC DATASETS'), url: "/explore" });
breadCrumbs.push({ parentComponentName: 'DatasetListingComponent', label: this.dataset.label, url: '/datasets/publicOverview/' + this.dataset.id });
this.breadCrumbs = observableOf(breadCrumbs);
}, (error: any) => {
if (error.status === 404) {
return this.onFetchingDeletedCallbackError('/explore');
}
if (error.status === 403) {
return this.onFetchingForbiddenCallbackError('/explore');
}
});
}
});
}
onFetchingDeletedCallbackError(redirectRoot: string) {
this.uiNotificationService.snackBarNotification(this.language.instant('DATASET-OVERVIEW.ERROR.DELETED-DATASET'), SnackBarNotificationLevel.Error);
this.router.navigate([redirectRoot]);
}
onFetchingForbiddenCallbackError(redirectRoot: string) {
this.uiNotificationService.snackBarNotification(this.language.instant('DATASET-OVERVIEW.ERROR.FORBIDEN-DATASET'), SnackBarNotificationLevel.Error);
this.router.navigate([redirectRoot]);
}
goBack(): void {
this.location.back();
}
setIsUserOwner() {
if (this.dataset) {
const principal: Principal = this.authentication.current();
if (principal) this.isUserOwner = principal.id === this.dataset.users.find(x => x.role === Role.Owner).id;
}
}
isUserDatasetRelated() {
const principal: Principal = this.authentication.current();
let isRelated: boolean = false;
if (this.dataset && principal) {
this.dataset.users.forEach(element => {
if (element.id === principal.id) {
isRelated = true;
}
})
}
return isRelated;
}
roleDisplayFromList(value: UserInfoListingModel[]) {
const principal: Principal = this.authentication.current();
let role: number;
if (principal) {
value.forEach(element => {
if (principal.id === element.id) {
role = element.role;
}
});
}
if (role === Role.Owner) {
return this.translate.instant('DMP-LISTING.OWNER');
} else if (role === Role.Member) {
return this.translate.instant('DMP-LISTING.MEMBER');
} else {
return this.translate.instant('DMP-LISTING.OWNER');
}
}
public isAuthenticated(): boolean {
return !(!this.authentication.current());
}
cloneClicked(dataset: DatasetOverviewModel) {
this.router.navigate(['/datasets/clone/' + dataset.id]);
}
isDraftDataset(dataset: DatasetOverviewModel) {
return dataset.status == DatasetStatus.Draft;
}
editClicked(dataset: DatasetOverviewModel) {
this.router.navigate(['/datasets/edit/' + dataset.id]);
}
deleteClicked() {
const dialogRef = this.dialog.open(ConfirmationDialogComponent, {
maxWidth: '300px',
data: {
message: this.language.instant('GENERAL.CONFIRMATION-DIALOG.DELETE-ITEM'),
confirmButton: this.language.instant('GENERAL.CONFIRMATION-DIALOG.ACTIONS.DELETE'),
cancelButton: this.language.instant('GENERAL.CONFIRMATION-DIALOG.ACTIONS.CANCEL'),
isDeleteConfirmation: true
}
});
dialogRef.afterClosed().pipe(takeUntil(this._destroyed)).subscribe(result => {
if (result) {
this.datasetService.delete(this.dataset.id)
.pipe(takeUntil(this._destroyed))
.subscribe(
complete => { this.onCallbackSuccess() },
error => this.onDeleteCallbackError(error)
);
}
});
}
onCallbackSuccess(): void {
this.uiNotificationService.snackBarNotification(this.isNew ? this.language.instant('GENERAL.SNACK-BAR.SUCCESSFUL-CREATION') : this.language.instant('GENERAL.SNACK-BAR.SUCCESSFUL-UPDATE'), SnackBarNotificationLevel.Success);
this.router.navigate(['/datasets']);
}
onDeleteCallbackError(error) {
this.uiNotificationService.snackBarNotification(error.error.message ? error.error.message : this.language.instant('GENERAL.SNACK-BAR.UNSUCCESSFUL-DELETE'), SnackBarNotificationLevel.Error);
}
public getOrcidPath(): string {
return this.configurationService.orcidPath;
}
// showPublishButton(dataset: DatasetOverviewModel) {
// return this.isFinalizedDmp(dmp) && !dmp.isPublic && this.hasPublishButton;
// }
}

25
dmp-frontend/src/app/ui/dataset/overview/dataset-overview.module.ts Normal file
View File

@ -0,0 +1,25 @@
import { NgModule } from '@angular/core';
import { FormattingModule } from '@app/core/formatting.module';
import { AutoCompleteModule } from '@app/library/auto-complete/auto-complete.module';
import { ConfirmationDialogModule } from '@common/modules/confirmation-dialog/confirmation-dialog.module';
import { ExportMethodDialogModule } from '@app/library/export-method-dialog/export-method-dialog.module';
import { UrlListingModule } from '@app/library/url-listing/url-listing.module';
import { CommonFormsModule } from '@common/forms/common-forms.module';
import { CommonUiModule } from '@common/ui/common-ui.module';
import { DatasetOverviewComponent } from './dataset-overview.component';
@NgModule({
imports: [
CommonUiModule,
CommonFormsModule,
UrlListingModule,
ConfirmationDialogModule,
ExportMethodDialogModule,
FormattingModule,
AutoCompleteModule
],
declarations: [
DatasetOverviewComponent
]
})
export class DatasetOverviewModule { }

4
dmp-frontend/src/app/ui/dmp/overview/dmp-overview.component.html
View File

@ -9,7 +9,7 @@
<div class="col-md-8 col-lg-8 pl-4">
<div class="row">
<span class="dmp-logo">{{ 'DATASET-LISTING.COLUMNS.DMP' | translate }}</span>
<p class="dmp-label ml-2 mb-0">{{ dmp.label }}</p>
<p class="dmp-label ml-3 mb-0">{{ dmp.label }}</p>
</div>
<div class="row d-flex align-items-center mt-3 mb-4 label-txt">
<div *ngIf="isUserDMPRelated()" class="d-flex">
@ -78,7 +78,7 @@
<div class="row header">{{'DMP-OVERVIEW.RESEARCHERS' | translate}}</div>
<div class="row">
<div *ngFor="let researcher of dmp.researchers; let last = last">
<a href="{{getOrcidPath() + dmp.id }}" target="blank" class="researcher">
<a href="{{ getOrcidPath() + researcher.id}}" target="blank" class="researcher">
<div class="id-btn">&nbsp;</div>
<div *ngIf="!last">{{ researcher.name }}, </div>
<div *ngIf="last">{{ researcher.name }}</div>

4
dmp-frontend/src/app/ui/explore-dataset/explore-dataset.module.ts
View File

@ -7,13 +7,15 @@ import { ExploreDatasetFiltersComponent } from '@app/ui/explore-dataset/filters/
import { ExploreDatasetListingItemComponent } from '@app/ui/explore-dataset/listing-item/explore-dataset-listing-item.component';
import { CommonFormsModule } from '@common/forms/common-forms.module';
import { CommonUiModule } from '@common/ui/common-ui.module';
import { DatasetOverviewModule } from '../dataset/overview/dataset-overview.module';
@NgModule({
imports: [
CommonUiModule,
CommonFormsModule,
AutoCompleteModule,
ExploreDatasetRoutingModule
ExploreDatasetRoutingModule,
DatasetOverviewModule
],
declarations: [
ExploreDatasetListingComponent,

9
dmp-frontend/src/app/ui/explore-dataset/explore-dataset.routing.ts
View File

@ -1,6 +1,7 @@
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { ExploreDatasetListingComponent } from './explore-dataset-listing.component';
import { DatasetOverviewComponent } from '../dataset/overview/dataset-overview.component';
const routes: Routes = [
{
@ -9,6 +10,14 @@ const routes: Routes = [
data: {
breadcrumb: true
},
},
{
path: 'overview/:publicId',
component: DatasetOverviewComponent,
data: {
breadcrumb: true,
title: 'GENERAL.TITLES.EXPLORE-PLANS-OVERVIEW'
},
}
];

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

@ -566,6 +566,13 @@
"USE-DEFAULT": "Use Default Token"
}
},
"DATASET-OVERVIEW": {
"DATASET-AUTHORS": "Dataset description Authors",
"ERROR": {
"DELETED-DATASET": "The requested dataset is deleted",
"FORBIDEN-DATASET": "You are not allowed to access this dataset"
}
},
"DATASET-LISTING": {
"TITLE": "Dataset Descriptions",
"DATASET-DESCRIPTION": "Dataset Description",

9
dmp-frontend/src/assets/i18n/es.json
View File

@ -557,13 +557,20 @@
},
"ERROR": {
"DELETED-DMP": "El PGD solicitado está borrado",
"FORBIDEN-DMP": "You are not allowed to access this DMP"
"FORBIDEN-DMP": "No tiene permiso para acceder a esto DMP"
},
"MULTIPLE-DIALOG": {
"ZENODO-LOGIN": "Login with Zenodo",
"USE-DEFAULT": "Use Default Token"
}
},
"DATASET-OVERVIEW": {
"DATASET-AUTHORS": "Descripciones del Dataset Autores",
"ERROR": {
"DELETED-DATASET": "El Dataset solicitado está borrado",
"FORBIDEN-DATASET": "No tiene permiso para acceder a esto Dataset"
}
},
"DATASET-LISTING": {
"TITLE": "Descripciones del Dataset",
"DATASET-DESCRIPTION": "Descripción del Dataset",

7
dmp-frontend/src/assets/i18n/gr.json
View File

@ -565,6 +565,13 @@
"USE-DEFAULT": "Use Default Token"
}
},
"DATASET-OVERVIEW": {
"DATASET-AUTHORS": "Συγγραφείς Περιγραφής Δεδομένων",
"ERROR": {
"DELETED-DATASET": "H επιλεγμένη Περιγραφή Δεδομένων θα διαγραφεί",
"FORBIDEN-DATASET": "Δεν επιτρέπεται η πρόσβαση σε αυτή την Περιγραφή Δεδομένων"
}
},
"DATASET-LISTING": {
"TITLE": "Περιγραφές Συνόλων Δεδομένων",
"DATASET-DESCRIPTION": "Περιγραφή Δεδομένων",