Merge branch 'Development' of https://gitlab.eudat.eu/dmp/OpenAIRE-EUDAT-DMP-service-pilot into backend-refactoring
This commit is contained in:
commit
159dfd35ba
|
@ -295,8 +295,10 @@ public class Project implements DataEntity<Project, UUID> {
|
|||
this.created = entity.getCreated();
|
||||
this.definition = entity.getDefinition();
|
||||
this.dmps = entity.getDmps();
|
||||
this.startdate = entity.getStartdate();
|
||||
this.enddate = entity.getEnddate();
|
||||
this.modified = new Date();
|
||||
this.uri = entity.getUri();
|
||||
if (entity.getContent() != null) this.content = entity.getContent();
|
||||
}
|
||||
|
||||
|
|
|
@ -144,7 +144,7 @@
|
|||
"schematics": {
|
||||
"@schematics/angular:component": {
|
||||
"prefix": "app",
|
||||
"styleext": "css"
|
||||
"styleext": "scss"
|
||||
},
|
||||
"@schematics/angular:directive": {
|
||||
"prefix": "app"
|
||||
|
|
|
@ -0,0 +1,8 @@
|
|||
import { DatasetProfileModel } from "./dataset-profile";
|
||||
|
||||
export interface DatasetOverviewModel {
|
||||
id: String;
|
||||
label: String;
|
||||
status: any;
|
||||
datasetTemplate: DatasetProfileModel;
|
||||
}
|
|
@ -0,0 +1,4 @@
|
|||
export interface DatasetUrlListing {
|
||||
label: String;
|
||||
url: String;
|
||||
}
|
|
@ -0,0 +1,4 @@
|
|||
export interface DmpAssociatedProfileModel {
|
||||
id: String;
|
||||
label: String;
|
||||
}
|
|
@ -0,0 +1,25 @@
|
|||
import { OrganizationModel } from "../organisation/organization";
|
||||
import { DatasetUrlListing } from "../dataset/dataset-url-listing";
|
||||
import { UserInfoListingModel } from "../user/user-info-listing";
|
||||
import { DmpAssociatedProfileModel } from "../dmp-profile/dmp-associated-profile";
|
||||
import { ResearcherModel } from "../researcher/researcher";
|
||||
import { ProjectOverviewModel } from "../project/project-overview";
|
||||
import { DatasetOverviewModel } from "../dataset/dataset-overview";
|
||||
|
||||
export interface DmpOverviewModel {
|
||||
id: string;
|
||||
label: string;
|
||||
profile: string;
|
||||
creationTime: string;
|
||||
modifiedTime: string;
|
||||
version: number;
|
||||
status: number;
|
||||
groupId: string;
|
||||
description: string;
|
||||
project: ProjectOverviewModel;
|
||||
associatedProfiles: DmpAssociatedProfileModel[];
|
||||
users: UserInfoListingModel[];
|
||||
organisations: OrganizationModel[];
|
||||
datasets: DatasetOverviewModel[];
|
||||
researchers: ResearcherModel[];
|
||||
}
|
|
@ -0,0 +1,9 @@
|
|||
export interface ProjectOverviewModel {
|
||||
id: String;
|
||||
label: String;
|
||||
uri: String;
|
||||
abbreviation: String;
|
||||
description: String;
|
||||
startDate: Date;
|
||||
endDate: Date;
|
||||
}
|
|
@ -0,0 +1,5 @@
|
|||
export interface UserInfoListingModel {
|
||||
id: String;
|
||||
name: String;
|
||||
role: number;
|
||||
}
|
|
@ -16,6 +16,7 @@ import { ContentType } from '@angular/http/src/enums';
|
|||
import { BaseHttpParams } from '../../../common/http/base-http-params';
|
||||
import { InterceptorType } from '../../../common/http/interceptors/interceptor-type';
|
||||
import { ExploreDmpCriteriaModel } from '../../query/explore-dmp/explore-dmp-criteria';
|
||||
import { DmpOverviewModel } from '../../model/dmp/dmp-overview';
|
||||
|
||||
@Injectable()
|
||||
export class DmpService {
|
||||
|
@ -46,7 +47,7 @@ export class DmpService {
|
|||
}
|
||||
|
||||
getOverviewSingle(id: string): Observable<any> {
|
||||
return this.http.get<any>(this.actionUrl + 'overview/' + id, { headers: this.headers });
|
||||
return this.http.get<DmpOverviewModel>(this.actionUrl + 'overview/' + id, { headers: this.headers });
|
||||
}
|
||||
|
||||
unlock(id: String): Observable<DmpModel> {
|
||||
|
|
|
@ -4,7 +4,7 @@
|
|||
</div>
|
||||
<div class="row">
|
||||
<div class="col"></div>
|
||||
<div class="col-auto"><button mat-raised-button color="primary" type="button" (click)="cancel()">{{ data.cancelButton }}</button></div>
|
||||
<div class="col-auto"><button mat-raised-button color="primary" type="button" (click)="confirm()">{{ data.confirmButton }}</button></div>
|
||||
<div class="col-auto"><button mat-raised-button type="button" (click)="cancel()" class="cancel">{{ data.cancelButton }}</button></div>
|
||||
<div class="col-auto"><button mat-raised-button type="button" (click)="confirm()" class="confirm">{{ data.confirmButton }}</button></div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -2,4 +2,15 @@
|
|||
.confirmation-message {
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
|
||||
.cancel {
|
||||
background-color: #ba2c2c;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.confirm {
|
||||
background-color: #92d050;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
@ -0,0 +1,13 @@
|
|||
<div class="export-method-dialog">
|
||||
<div class="row d-flex flex-row">
|
||||
<div class="col-auto export-method-message">
|
||||
{{ data.message }}
|
||||
</div>
|
||||
<div class="col-auto close-btn" (click)="close()"><mat-icon>close</mat-icon></div>
|
||||
</div>
|
||||
<div class="row d-flex flex-row">
|
||||
<div class="col-4"><button mat-raised-button type="button" (click)="downloadXML()" >{{ data.XMLButton }}</button></div>
|
||||
<div class="col-4"><button mat-raised-button type="button" (click)="downloadDocument()">{{ data.documentButton }}</button></div>
|
||||
<div class="col-4"><button mat-raised-button type="button" (click)="downloadPdf()">{{ data.pdfButton }}</button></div>
|
||||
</div>
|
||||
</div>
|
|
@ -0,0 +1,16 @@
|
|||
.export-method-dialog {
|
||||
.export-method-message {
|
||||
padding-bottom: 20px;;
|
||||
}
|
||||
|
||||
.close-btn {
|
||||
margin-left: auto;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
button {
|
||||
// background-color: #aaaaaa;
|
||||
background-color: #4687f0;
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
|
@ -0,0 +1,36 @@
|
|||
import { Component, OnInit, Inject } from '@angular/core';
|
||||
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'app-export-method-dialog',
|
||||
templateUrl: './export-method-dialog.component.html',
|
||||
styleUrls: ['./export-method-dialog.component.scss']
|
||||
})
|
||||
export class ExportMethodDialogComponent implements OnInit {
|
||||
|
||||
constructor(
|
||||
public dialogRef: MatDialogRef<ExportMethodDialogComponent>,
|
||||
@Inject(MAT_DIALOG_DATA) public data: any
|
||||
) { }
|
||||
|
||||
ngOnInit() {
|
||||
}
|
||||
|
||||
close() {
|
||||
this.dialogRef.close(false);
|
||||
}
|
||||
|
||||
downloadXML() {
|
||||
this.dialogRef.close("xml");
|
||||
}
|
||||
|
||||
downloadDocument() {
|
||||
this.dialogRef.close("doc");
|
||||
}
|
||||
|
||||
downloadPdf() {
|
||||
this.dialogRef.close("pdf");
|
||||
}
|
||||
|
||||
}
|
|
@ -0,0 +1,13 @@
|
|||
import { NgModule } from '@angular/core';
|
||||
import { CommonUiModule } from '../../common/ui/common-ui.module';
|
||||
import { ExportMethodDialogComponent } from './export-method-dialog.component';
|
||||
|
||||
@NgModule({
|
||||
imports: [CommonUiModule],
|
||||
declarations: [ExportMethodDialogComponent],
|
||||
exports: [ExportMethodDialogComponent],
|
||||
entryComponents: [ExportMethodDialogComponent]
|
||||
})
|
||||
export class ExportMethodDialogModule {
|
||||
constructor() { }
|
||||
}
|
|
@ -88,7 +88,7 @@
|
|||
<h4> DATA MANAGEMENT PLANS </h4>
|
||||
<div class="info">
|
||||
<p class="subtitle">{{ dashboardStatisticsData?.totalDataManagementPlanCount }} Public Dmps</p>
|
||||
<p class="view-all" (click)=viewAllPublicDmpsClicked()>View All</p>
|
||||
<p class="view-all" (click)=viewAllPublicDmpsClicked()>{{ 'GENERAL.ACTIONS.VIEW-ALL' | translate }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<mat-divider></mat-divider>
|
||||
|
@ -102,7 +102,7 @@
|
|||
<h4> DATASETS </h4>
|
||||
<div class="info">
|
||||
<p class="subtitle">{{ dashboardStatisticsData?.totalDataSetCount }} Public Datasets</p>
|
||||
<p class="view-all" (click)=viewAllPublicDatasetsClicked()>View All</p>
|
||||
<p class="view-all" (click)=viewAllPublicDatasetsClicked()>{{ 'GENERAL.ACTIONS.VIEW-ALL' | translate }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<mat-divider class="col-12"></mat-divider>
|
||||
|
|
|
@ -51,4 +51,9 @@ td:hover .draft-desc:after {
|
|||
background-color: rgb(242, 242, 242);
|
||||
border-radius: 10em;
|
||||
text-align: center;
|
||||
max-width: 160px;
|
||||
padding-left: 0.5em;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
|
|
@ -24,7 +24,7 @@
|
|||
</div>
|
||||
<div class="draft-subtitle">{{ dataset.created | date: "shortDate"}}</div>
|
||||
<div class="draft-desc">{{ dataset.description }}</div>
|
||||
<div class="project-pill">{{ dataset.profile }}</div>
|
||||
<div matTooltip="{{ dataset.profile }}" class="project-pill">{{ dataset.profile }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
|
|
|
@ -1,25 +0,0 @@
|
|||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { DraftsComponent } from './drafts.component';
|
||||
|
||||
describe('DraftsComponent', () => {
|
||||
let component: DraftsComponent;
|
||||
let fixture: ComponentFixture<DraftsComponent>;
|
||||
|
||||
beforeEach(async(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ DraftsComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
}));
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(DraftsComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
|
@ -12,11 +12,31 @@ th {
|
|||
}
|
||||
|
||||
.template-name {
|
||||
padding-left: 0px;
|
||||
padding-left: 0.5em;
|
||||
border: 1px solid rgb(218, 227, 243);
|
||||
color: rgb(43, 104, 209);
|
||||
background-color: rgb(236, 241, 249);
|
||||
border-radius: 10em;
|
||||
text-align: center;
|
||||
max-width: 160px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.chip {
|
||||
padding: 0.1em 1em;
|
||||
margin-bottom: 1em;
|
||||
margin-left: 2.5em;
|
||||
margin-right: 2.5em;
|
||||
border-radius: 10em;
|
||||
background-color: #007bff;
|
||||
color: #fff;
|
||||
text-transform: uppercase;
|
||||
text-align: center;
|
||||
font-weight: 500;
|
||||
max-width: 160px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
|
|
@ -28,7 +28,7 @@
|
|||
style="cursor: pointer;">
|
||||
<td>{{ activity.label }}</td>
|
||||
<td>
|
||||
<div class="template-name">
|
||||
<div matTooltip="{{ dmpProfileDisplay(activity.profile) }}" class="template-name">
|
||||
{{ dmpProfileDisplay(activity.profile) }}
|
||||
</div>
|
||||
</td>
|
||||
|
|
|
@ -1,25 +0,0 @@
|
|||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { RecentEditedActivityComponent } from './recent-edited-activity.component';
|
||||
|
||||
describe('RecentEditedActivityComponent', () => {
|
||||
let component: RecentEditedActivityComponent;
|
||||
let fixture: ComponentFixture<RecentEditedActivityComponent>;
|
||||
|
||||
beforeEach(async(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ RecentEditedActivityComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
}));
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(RecentEditedActivityComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
|
@ -1,25 +0,0 @@
|
|||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { RecentVisitedActivityComponent } from './recent-visited-activity.component';
|
||||
|
||||
describe('RecentActivityComponent', () => {
|
||||
let component: RecentVisitedActivityComponent;
|
||||
let fixture: ComponentFixture<RecentVisitedActivityComponent>;
|
||||
|
||||
beforeEach(async(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ RecentVisitedActivityComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
}));
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(RecentVisitedActivityComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
|
@ -22,6 +22,8 @@ import { DmpListingItemComponent } from './listing/listing-item/dmp-listing-item
|
|||
import { DmpWizardComponent } from './wizard/dmp-wizard.component';
|
||||
import { DmpWizardEditorComponent } from './wizard/editor/dmp-wizard-editor.component';
|
||||
import { DmpWizardDatasetListingComponent } from './wizard/listing/dmp-wizard-dataset-listing.component';
|
||||
import { DmpOverviewComponent } from './overview/dmp-overview.component';
|
||||
import { ExportMethodDialogModule } from '../../library/export-method-dialog/export-method-dialog.module';
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
|
@ -29,6 +31,7 @@ import { DmpWizardDatasetListingComponent } from './wizard/listing/dmp-wizard-da
|
|||
CommonFormsModule,
|
||||
UrlListingModule,
|
||||
ConfirmationDialogModule,
|
||||
ExportMethodDialogModule,
|
||||
FormattingModule,
|
||||
AutoCompleteModule,
|
||||
DmpRoutingModule
|
||||
|
@ -49,7 +52,8 @@ import { DmpWizardDatasetListingComponent } from './wizard/listing/dmp-wizard-da
|
|||
DynamicFieldsProjectComponent,
|
||||
DynamicFieldProjectComponent,
|
||||
DmpUploadDialogue,
|
||||
DmpListingItemComponent
|
||||
DmpListingItemComponent,
|
||||
DmpOverviewComponent
|
||||
],
|
||||
entryComponents: [
|
||||
DmpInvitationDialogComponent,
|
||||
|
|
|
@ -4,6 +4,7 @@ import { DmpEditorComponent } from './editor/dmp-editor.component';
|
|||
import { InvitationAcceptedComponent } from './invitation/accepted/dmp-invitation-accepted.component';
|
||||
import { DmpListingComponent } from './listing/dmp-listing.component';
|
||||
import { DmpWizardComponent } from './wizard/dmp-wizard.component';
|
||||
import { DmpOverviewComponent } from './overview/dmp-overview.component';
|
||||
|
||||
const routes: Routes = [
|
||||
{
|
||||
|
@ -34,6 +35,13 @@ const routes: Routes = [
|
|||
breadcrumb: true
|
||||
},
|
||||
},
|
||||
{
|
||||
path: 'overview/:id',
|
||||
component: DmpOverviewComponent,
|
||||
data: {
|
||||
breadcrumb: true
|
||||
},
|
||||
},
|
||||
{
|
||||
path: 'publicEdit/:publicId',
|
||||
component: DmpEditorComponent,
|
||||
|
|
|
@ -161,7 +161,7 @@
|
|||
|
||||
<div class="col-md-12">
|
||||
<div class="row">
|
||||
<div class="col-auto"><button mat-raised-button color="primary" (click)="cancel()"
|
||||
<div class="col-auto"><button mat-raised-button color="primary" (click)="cancel(dmp.id)"
|
||||
type="button">{{'DMP-EDITOR.ACTIONS.CANCEL'
|
||||
| translate}}</button></div>
|
||||
<div class="col"></div>
|
||||
|
|
|
@ -48,7 +48,8 @@ import { AuthService } from '../../../core/services/auth/auth.service';
|
|||
})
|
||||
export class DmpEditorComponent extends BaseComponent implements OnInit, IBreadCrumbComponent {
|
||||
|
||||
editMode = false;
|
||||
editMode = true;
|
||||
// editMode = false;
|
||||
|
||||
breadCrumbs: Observable<BreadcrumbItem[]>;
|
||||
isNew = true;
|
||||
|
@ -298,8 +299,9 @@ export class DmpEditorComponent extends BaseComponent implements OnInit, IBreadC
|
|||
});
|
||||
}
|
||||
|
||||
public cancel(): void {
|
||||
this.router.navigate(['/plans']);
|
||||
public cancel(id: String): void {
|
||||
this.router.navigate(['/plans/overview/' + id]);
|
||||
// this.router.navigate(['/plans']);
|
||||
}
|
||||
|
||||
public invite(): void {
|
||||
|
|
|
@ -131,7 +131,8 @@ export class DmpListingComponent extends BaseComponent implements OnInit, IBread
|
|||
}
|
||||
|
||||
rowClicked(dmp: DmpListingModel) {
|
||||
this.router.navigate(['/plans/edit/' + dmp.id]);
|
||||
this.router.navigate(['/plans/overview/' + dmp.id]);
|
||||
// this.router.navigate(['/plans/edit/' + dmp.id]);
|
||||
}
|
||||
|
||||
addDataset(rowId: String) {
|
||||
|
|
|
@ -34,7 +34,7 @@ export class DmpListingItemComponent implements OnInit {
|
|||
private route: ActivatedRoute,
|
||||
private datasetService: DatasetService,
|
||||
private authentication: AuthService,
|
||||
private language: TranslateService) { }
|
||||
private translate: TranslateService) { }
|
||||
|
||||
ngOnInit() {
|
||||
if (this.dmp.status == 0) { this.isDraft = true }
|
||||
|
@ -87,13 +87,13 @@ export class DmpListingItemComponent implements OnInit {
|
|||
});
|
||||
}
|
||||
if (role === 0) {
|
||||
return this.language.instant('DMP-LISTING.OWNER');
|
||||
return this.translate.instant('DMP-LISTING.OWNER');
|
||||
}
|
||||
else if (role === 1) {
|
||||
return this.language.instant('DMP-LISTING.MEMBER');
|
||||
return this.translate.instant('DMP-LISTING.MEMBER');
|
||||
}
|
||||
else {
|
||||
return this.language.instant('DMP-LISTING.OWNER');
|
||||
return this.translate.instant('DMP-LISTING.OWNER');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -0,0 +1,113 @@
|
|||
<div class="main-content">
|
||||
<div class="container-fluid">
|
||||
<div *ngIf="dmp" class="card col-12 pb-4">
|
||||
<div class="card-header card-header-plain d-flex">
|
||||
<div class="card-desc d-flex flex-column justify-content-center">
|
||||
<h4 class="card-title">{{ dmp.label }}</h4>
|
||||
</div>
|
||||
<div class="d-flex ml-auto p-2">
|
||||
<button mat-icon-button [matMenuTriggerFor]="actionsMenu" class="ml-auto more-icon"
|
||||
(click)="$event.stopImmediatePropagation();">
|
||||
<mat-icon class="more-horiz">more_horiz</mat-icon>
|
||||
</button>
|
||||
<mat-menu #actionsMenu="matMenu">
|
||||
<button mat-menu-item (click)="editClicked(dmp)" class="menu-item">
|
||||
<mat-icon>edit</mat-icon>{{ 'DMP-LISTING.ACTIONS.EDIT' | translate }}
|
||||
</button>
|
||||
<button mat-menu-item (click)="cloneClicked(dmp)" class="menu-item">
|
||||
<mat-icon>add</mat-icon>{{ 'DMP-LISTING.ACTIONS.CLONE' | translate }}
|
||||
</button>
|
||||
<button mat-menu-item (click)="deleteClicked()" class="menu-item">
|
||||
<mat-icon>delete</mat-icon>{{ 'DMP-LISTING.ACTIONS.DELETE' | translate }}
|
||||
</button>
|
||||
<button mat-menu-item (click)="advancedClicked()" class="menu-item">
|
||||
<mat-icon>save_alt</mat-icon>{{ 'DMP-LISTING.ACTIONS.ADV-EXP' | translate }}
|
||||
</button>
|
||||
</mat-menu>
|
||||
<button mat-raised-button color="primary" (click)="downloadPDF(dmp.id)" class="lightblue-btn ml-2">
|
||||
<mat-icon>save_alt</mat-icon> {{ 'DMP-LISTING.ACTIONS.EXPORT' | translate }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row ml-2">
|
||||
<div class="col-md-9 col-lg-9">
|
||||
<div class="row">
|
||||
<div class="col-6 dmp-info">
|
||||
<p class="card-subtitle">{{ dmp.label }}</p>
|
||||
<p>{{ dmp.description }}</p>
|
||||
<div class="row total-info">
|
||||
<div class="col-12 d-flex flex-row">
|
||||
<mat-icon class="gray-icon pt-2">settings</mat-icon>
|
||||
<p class="mt-2 ml-1 mr-3 p-1">{{ roleDisplay(dmp.users) }}</p>
|
||||
|
||||
<div class="datasets-counter">
|
||||
<mat-icon class="gray-icon pt-2" (click)="datasetsClicked(dmp.id)">storage
|
||||
</mat-icon>
|
||||
<p class="mt-2 ml-1 p-1" (click)="datasetsClicked(dmp.id)">
|
||||
{{ dmp.datasets.length }}</p>
|
||||
<p class="mt-2 mr-3 p-1" (click)="datasetsClicked(dmp.id)">
|
||||
{{'NAV-BAR.DATASETS' | translate}}</p>
|
||||
</div>
|
||||
|
||||
<mat-icon class="gray-icon pt-2">assignment</mat-icon>
|
||||
<p class="mt-2 ml-1 p-1">{{ dmp.associatedProfiles.length }}</p>
|
||||
<p class="mt-2 mr-3 p-1">{{ 'DMP-EDITOR.FIELDS.TEMPLATES' | translate }}</p>
|
||||
|
||||
<mat-icon class="gray-icon pt-2">person</mat-icon>
|
||||
<p class="mt-2 ml-1 p-1">{{ dmp.researchers.length }}</p>
|
||||
<p class="mt-2 mr-3 p-1">{{ 'DMP-EDITOR.FIELDS.RESEARCHERS' | translate }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div *ngFor="let dataset of dmp.datasets" class="col-md-4">
|
||||
<div class="dataset-card" (click)="datasetClicked(dataset.id)">
|
||||
<mat-icon *ngIf="isDraft(dataset)" class="draft-bookmark">bookmark</mat-icon>
|
||||
<mat-icon *ngIf="!isDraft(dataset)" class="finalized-bookmark">bookmark</mat-icon>
|
||||
<h4 *ngIf="isDraft(dataset)"><span>DRAFT:</span> {{ dataset.label }}</h4>
|
||||
<h4 *ngIf="!isDraft(dataset)">{{ dataset.label }}</h4>
|
||||
<div matTooltip="{{ dataset.datasetTemplate.label }}" class="chip">
|
||||
{{ dataset.datasetTemplate.label }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="dmp.datasets.length > 9" class="gray-container d-flex justify-content-center">
|
||||
<button mat-button (click)="datasetsClicked(dmp.id)" class="show-more">
|
||||
<mat-icon class="mr-2">expand_more</mat-icon>{{ 'GENERAL.ACTIONS.SHOW-MORE' | translate }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3 col-lg-3">
|
||||
<div class="project-item">
|
||||
<div class="gray-container container-header">
|
||||
<span class="ml-2 pt-2"
|
||||
(click)="projectClicked(dmp.project.id)">{{ dmp.project.abbreviation }}</span>
|
||||
</div>
|
||||
<p class="card-subtitle mt-3 mb-1 ml-3 mr-3">{{ dmp.project.label }}</p>
|
||||
<p class="mb-1 ml-3 mr-3">{{ dmp.project.startDate | date: "shortDate" }} -
|
||||
{{ dmp.project.endDate | date: "shortDate" }}</p>
|
||||
|
||||
|
||||
<p class="ml-3 mr-3 desc">{{ dmp.project.description }}</p>
|
||||
<button mat-flat-button class="show-more" (click)="projectClicked(dmp.project.id)">
|
||||
<!-- <mat-icon class="mr-2">expand_more</mat-icon> -->
|
||||
{{ 'GENERAL.ACTIONS.SHOW-MORE' | translate }}
|
||||
</button>
|
||||
|
||||
<a mat-raised-button class="visit-website" href="{{dmp.project.uri}}" target="_blank">
|
||||
<mat-icon class="mr-2">open_in_new</mat-icon>
|
||||
{{ 'PROJECT-EDITOR.ACTIONS.VISIT-WEBSITE' | translate }}
|
||||
</a>
|
||||
</div>
|
||||
<div class="researchers">
|
||||
<h6 class="researchers-title">Researchers</h6>
|
||||
<div *ngFor="let researcher of dmp.researchers">
|
||||
<div matTooltip="{{ researcher.name }}" class="avatar">{{ researcher.name }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
|
@ -0,0 +1,197 @@
|
|||
.card-content {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.actions {
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.more-horiz {
|
||||
font-size: 28px;
|
||||
color: #aaaaaa;
|
||||
}
|
||||
|
||||
.more-icon :hover {
|
||||
color: #4687e6;
|
||||
}
|
||||
|
||||
.menu-item {
|
||||
width: 248px;
|
||||
}
|
||||
|
||||
.dmp-info {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
// margin: 2em 2em;
|
||||
padding: 1em 1em;
|
||||
}
|
||||
|
||||
.card-subtitle {
|
||||
font-size: 14px;
|
||||
font-weight: 700;
|
||||
color: black;
|
||||
text-transform: uppercase;
|
||||
margin-top: 0;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.gray-container {
|
||||
letter-spacing: 5px;
|
||||
color: #aaaaaa;
|
||||
}
|
||||
|
||||
.project-item,
|
||||
.researchers {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border: 2px solid #f2f2f2;
|
||||
margin-right: 2em;
|
||||
margin-top: 2em;
|
||||
padding: 0.5em;
|
||||
}
|
||||
|
||||
.researchers-title {
|
||||
width: 120px;
|
||||
color: #4687e6;
|
||||
background-color: white;
|
||||
padding: 0px 10px;
|
||||
margin-top: -16px;
|
||||
cursor: default;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.container-header {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
margin-top: 0px;
|
||||
text-transform: uppercase;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.container-header p {
|
||||
letter-spacing: 5px;
|
||||
color: #aaaaaa;
|
||||
padding-top: 10px;
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
|
||||
.container-header :hover {
|
||||
color: #4687e6;
|
||||
}
|
||||
|
||||
.dataset-card {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-width: 0;
|
||||
word-wrap: break-word;
|
||||
border-radius: 6px;
|
||||
color: #333333;
|
||||
background: #fff;
|
||||
width: 100%;
|
||||
margin-top: 1em;
|
||||
margin-bottom: 1em;
|
||||
cursor: pointer;
|
||||
box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.14);
|
||||
}
|
||||
|
||||
.dataset-card h4 {
|
||||
padding-left: 1em;
|
||||
margin: 1em 1.5em;
|
||||
}
|
||||
|
||||
.show-more {
|
||||
background-color: #ffffff00;
|
||||
color: #4687f0;
|
||||
font-weight: 700;
|
||||
justify-self: center;
|
||||
}
|
||||
|
||||
.visit-website {
|
||||
background-color: #4687f0;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.draft-bookmark {
|
||||
color: #e7e6e6;
|
||||
display: inline;
|
||||
position: absolute;
|
||||
margin-top: 0.5em;
|
||||
margin-left: 0.5em;
|
||||
}
|
||||
|
||||
.finalized-bookmark {
|
||||
color: #92d050;
|
||||
display: inline;
|
||||
position: absolute;
|
||||
margin-top: 0.5em;
|
||||
margin-left: 0.5em;
|
||||
}
|
||||
|
||||
h4 span {
|
||||
color: #619ce3;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.chip {
|
||||
padding: 0.1em 1em;
|
||||
margin-bottom: 1em;
|
||||
margin-left: 2.5em;
|
||||
margin-right: 2.5em;
|
||||
border-radius: 10em;
|
||||
background-color: rgb(70, 135, 230);
|
||||
color: #fff;
|
||||
text-transform: uppercase;
|
||||
font-weight: 500;
|
||||
max-width: 160px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
padding: 0.1em 1em;
|
||||
margin: 0.5em;
|
||||
border-radius: 10em;
|
||||
background-color: #eeeeee;
|
||||
color: black;
|
||||
max-width: 160px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.datasets-counter {
|
||||
display: flex;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.datasets-counter :hover {
|
||||
color: #4687e6 !important;
|
||||
}
|
||||
|
||||
.total-info {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.desc {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
height: 80px;
|
||||
font-size: 14px;
|
||||
padding-top: 15px;
|
||||
margin-bottom: 30px;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.desc:after {
|
||||
content: "";
|
||||
text-align: right;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
width: 70%;
|
||||
height: 1.4em;
|
||||
background: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 1) 50%);
|
||||
}
|
|
@ -0,0 +1,209 @@
|
|||
import { Component, OnInit } from '@angular/core';
|
||||
import { Params, ActivatedRoute, Router } from '@angular/router';
|
||||
import { BaseComponent } from '../../../core/common/base/base.component';
|
||||
import { DmpService } from '../../../core/services/dmp/dmp.service';
|
||||
import { takeUntil } from 'rxjs/operators';
|
||||
import { DmpOverviewModel } from '../../../core/model/dmp/dmp-overview';
|
||||
import { TranslateService } from '@ngx-translate/core';
|
||||
import { Principal } from '../../../core/model/auth/Principal';
|
||||
import { AuthService } from '../../../core/services/auth/auth.service';
|
||||
import { UserInfoListingModel } from '../../../core/model/user/user-info-listing';
|
||||
import { DatasetOverviewModel } from '../../../core/model/dataset/dataset-overview';
|
||||
import { MatDialog } from '@angular/material';
|
||||
import { ConfirmationDialogComponent } from '../../../library/confirmation-dialog/confirmation-dialog.component';
|
||||
import { UiNotificationService, SnackBarNotificationLevel } from '../../../core/services/notification/ui-notification-service';
|
||||
import * as FileSaver from 'file-saver';
|
||||
import { ExportMethodDialogComponent } from '../../../library/export-method-dialog/export-method-dialog.component';
|
||||
|
||||
@Component({
|
||||
selector: 'app-dmp-overview',
|
||||
templateUrl: './dmp-overview.component.html',
|
||||
styleUrls: ['./dmp-overview.component.scss']
|
||||
})
|
||||
export class DmpOverviewComponent extends BaseComponent implements OnInit {
|
||||
|
||||
dmp: DmpOverviewModel;
|
||||
isNew = true;
|
||||
|
||||
constructor(
|
||||
private route: ActivatedRoute,
|
||||
private router: Router,
|
||||
private dmpService: DmpService,
|
||||
private translate: TranslateService,
|
||||
private authentication: AuthService,
|
||||
private dialog: MatDialog,
|
||||
private language: TranslateService,
|
||||
private uiNotificationService: UiNotificationService
|
||||
) {
|
||||
super();
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
// Gets dmp data using parameter id
|
||||
this.route.params
|
||||
.pipe(takeUntil(this._destroyed))
|
||||
.subscribe((params: Params) => {
|
||||
const itemId = params['id'];
|
||||
if (itemId != null) {
|
||||
this.isNew = false;
|
||||
this.dmpService.getOverviewSingle(itemId)
|
||||
.pipe(takeUntil(this._destroyed))
|
||||
.subscribe(data => {
|
||||
this.dmp = data;
|
||||
})
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
editClicked(dmp: DmpOverviewModel) {
|
||||
this.router.navigate(['/plans/edit/' + dmp.id]);
|
||||
}
|
||||
|
||||
cloneClicked(dmp: DmpOverviewModel) {
|
||||
this.router.navigate(['/plans/clone/' + dmp.id]);
|
||||
}
|
||||
|
||||
projectClicked(projectId: String) {
|
||||
this.router.navigate(['/projects/edit/' + projectId]);
|
||||
}
|
||||
|
||||
datasetClicked(datasetId: String) {
|
||||
this.router.navigate(['/datasets/edit/' + datasetId]);
|
||||
}
|
||||
|
||||
datasetsClicked(dmpId: String) {
|
||||
this.router.navigate(['/datasets'], { queryParams: { dmpId: dmpId } });
|
||||
}
|
||||
|
||||
goToUri(uri: string){
|
||||
window.open(uri, "_blank");
|
||||
}
|
||||
|
||||
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.CONFIRM'),
|
||||
cancelButton: this.language.instant('GENERAL.CONFIRMATION-DIALOG.ACTIONS.CANCEL')
|
||||
}
|
||||
});
|
||||
dialogRef.afterClosed().pipe(takeUntil(this._destroyed)).subscribe(result => {
|
||||
if (result) {
|
||||
this.dmpService.delete(this.dmp.id)
|
||||
.pipe(takeUntil(this._destroyed))
|
||||
.subscribe(
|
||||
complete => { this.onCallbackSuccess() },
|
||||
error => this.onDeleteCallbackError(error)
|
||||
);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
advancedClicked() {
|
||||
const dialogRef = this.dialog.open(ExportMethodDialogComponent, {
|
||||
maxWidth: '400px',
|
||||
data: {
|
||||
message: "Download as:",
|
||||
XMLButton: "XML",
|
||||
documentButton: "Document",
|
||||
pdfButton: "PDF"
|
||||
}
|
||||
});
|
||||
dialogRef.afterClosed().pipe(takeUntil(this._destroyed)).subscribe(result => {
|
||||
if (result == "pdf") {
|
||||
this.downloadPDF(this.dmp.id);
|
||||
} else if (result == "xml") {
|
||||
this.downloadXml(this.dmp.id);
|
||||
} else if (result == "doc") {
|
||||
this.downloadDocx(this.dmp.id);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
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(['/plans']);
|
||||
}
|
||||
|
||||
onDeleteCallbackError(error) {
|
||||
this.uiNotificationService.snackBarNotification(error.error.message ? error.error.message : this.language.instant('GENERAL.SNACK-BAR.UNSUCCESSFUL-DELETE'), SnackBarNotificationLevel.Error);
|
||||
}
|
||||
|
||||
downloadXml(id: string) {
|
||||
this.dmpService.downloadXML(id)
|
||||
.pipe(takeUntil(this._destroyed))
|
||||
.subscribe(response => {
|
||||
const blob = new Blob([response.body], { type: 'application/xml' });
|
||||
const filename = this.getFilenameFromContentDispositionHeader(response.headers.get('Content-Disposition'));
|
||||
|
||||
FileSaver.saveAs(blob, filename);
|
||||
});
|
||||
}
|
||||
|
||||
downloadDocx(id: string) {
|
||||
this.dmpService.downloadDocx(id)
|
||||
.pipe(takeUntil(this._destroyed))
|
||||
.subscribe(response => {
|
||||
const blob = new Blob([response.body], { type: 'application/msword' });
|
||||
const filename = this.getFilenameFromContentDispositionHeader(response.headers.get('Content-Disposition'));
|
||||
|
||||
FileSaver.saveAs(blob, filename);
|
||||
});
|
||||
}
|
||||
|
||||
downloadPDF(id: string) {
|
||||
this.dmpService.downloadPDF(id)
|
||||
.pipe(takeUntil(this._destroyed))
|
||||
.subscribe(response => {
|
||||
const blob = new Blob([response.body], { type: 'application/pdf' });
|
||||
const filename = this.getFilenameFromContentDispositionHeader(response.headers.get('Content-Disposition'));
|
||||
|
||||
FileSaver.saveAs(blob, filename);
|
||||
});
|
||||
}
|
||||
|
||||
getFilenameFromContentDispositionHeader(header: string): string {
|
||||
const regex: RegExp = new RegExp(/filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/g);
|
||||
|
||||
const matches = header.match(regex);
|
||||
let filename: string;
|
||||
for (let i = 0; i < matches.length; i++) {
|
||||
const match = matches[i];
|
||||
if (match.includes('filename="')) {
|
||||
filename = match.substring(10, match.length - 1);
|
||||
break;
|
||||
} else if (match.includes('filename=')) {
|
||||
filename = match.substring(9);
|
||||
break;
|
||||
}
|
||||
}
|
||||
return filename;
|
||||
}
|
||||
|
||||
roleDisplay(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 === 0) {
|
||||
return this.translate.instant('DMP-LISTING.OWNER');
|
||||
}
|
||||
else if (role === 1) {
|
||||
return this.translate.instant('DMP-LISTING.MEMBER');
|
||||
}
|
||||
else {
|
||||
return this.translate.instant('DMP-LISTING.OWNER');
|
||||
}
|
||||
}
|
||||
|
||||
isDraft(dataset: DatasetOverviewModel) {
|
||||
if (dataset.status == 0) { return true }
|
||||
else { return false }
|
||||
}
|
||||
}
|
|
@ -41,6 +41,7 @@
|
|||
},
|
||||
"ACTIONS": {
|
||||
"VIEW-ALL": "View All",
|
||||
"SHOW-MORE": "Show more",
|
||||
"LOG-IN": "Log in"
|
||||
}
|
||||
},
|
||||
|
@ -235,6 +236,9 @@
|
|||
"NEW-VERSION": "New Version",
|
||||
"VIEW-VERSION": "All DMP Versions",
|
||||
"CLONE": "Clone",
|
||||
"DELETE": "Delete",
|
||||
"EXPORT": "Export",
|
||||
"ADV-EXP": "Advanced Export",
|
||||
"DOWNLOAD-XML": "Download XML",
|
||||
"DOWNLOAD-DOCX": "Download Document",
|
||||
"DOWNLOAD-PDF": "Download PDF"
|
||||
|
@ -414,7 +418,8 @@
|
|||
"SAVE": "Save",
|
||||
"CANCEL": "Cancel",
|
||||
"DELETE": "Delete",
|
||||
"GO-TO-DMPS": "Go To DMPs"
|
||||
"GO-TO-DMPS": "Go To DMPs",
|
||||
"VISIT-WEBSITE": "Visit Website"
|
||||
}
|
||||
},
|
||||
"DMP-EDITOR": {
|
||||
|
@ -428,6 +433,7 @@
|
|||
"DESCRIPTION": "Description",
|
||||
"ORGANISATIONS": "Organisations",
|
||||
"RESEARCHERS": "Researchers",
|
||||
"TEMPLATES": "Templates",
|
||||
"PROFILES": "Available Dataset Profiles",
|
||||
"PROFILE": "DMP Profile",
|
||||
"GRANT": "Grant",
|
||||
|
|
Loading…
Reference in New Issue