+
+
+ + chevron_left +

{{'DMP-WIZARD.ACTIONS.BACK' | translate}}

+ +
+
+
+ +

{{ dataset.label }}

+
+
+
+

+ {{ roleDisplayFromList(dataset.users) }} +

+
+
+
+ public + {{'DMP-OVERVIEW.PUBLIC' | translate}} +
+
+ public_off + {{'DMP-OVERVIEW.PRIVATE' | translate}} +
+
+ + +
{{'GENERAL.STATUSES.EDIT' | translate}} : + {{dataset.modified | date:"longDate"}} +
+ +
+
+ + + + +
+
{{'DATASET-LISTING.TOOLTIP.PART-OF' | translate}}
+
+ +
+ +
{{'DMP-OVERVIEW.GRANT' | translate}}
+
Grant label
+ +
{{'DMP-OVERVIEW.RESEARCHERS' | translate}}
+
+ +
+ +
{{'DATASET-LISTING.COLUMNS.DESCRIPTION' | translate}}
+
+

{{ dataset.description }}

+
+
+
+ +
+ + + + + + +
+
+
+
+
\ No newline at end of file diff --git a/dmp-frontend/src/app/ui/dataset/overview/dataset-overview.component.scss b/dmp-frontend/src/app/ui/dataset/overview/dataset-overview.component.scss new file mode 100644 index 000000000..cc76c8022 --- /dev/null +++ b/dmp-frontend/src/app/ui/dataset/overview/dataset-overview.component.scss @@ -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; +} \ No newline at end of file diff --git a/dmp-frontend/src/app/ui/dataset/overview/dataset-overview.component.ts b/dmp-frontend/src/app/ui/dataset/overview/dataset-overview.component.ts new file mode 100644 index 000000000..e7cbd4742 --- /dev/null +++ b/dmp-frontend/src/app/ui/dataset/overview/dataset-overview.component.ts @@ -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 = 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; + // } + +} diff --git a/dmp-frontend/src/app/ui/dataset/overview/dataset-overview.module.ts b/dmp-frontend/src/app/ui/dataset/overview/dataset-overview.module.ts new file mode 100644 index 000000000..293bffdfb --- /dev/null +++ b/dmp-frontend/src/app/ui/dataset/overview/dataset-overview.module.ts @@ -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 { } \ No newline at end of file diff --git a/dmp-frontend/src/app/ui/dmp/overview/dmp-overview.component.html b/dmp-frontend/src/app/ui/dmp/overview/dmp-overview.component.html index 5faabb907..cd5c4e1f2 100644 --- a/dmp-frontend/src/app/ui/dmp/overview/dmp-overview.component.html +++ b/dmp-frontend/src/app/ui/dmp/overview/dmp-overview.component.html @@ -9,7 +9,7 @@
-

{{ dmp.label }}

+

{{ dmp.label }}

@@ -78,7 +78,7 @@
{{'DMP-OVERVIEW.RESEARCHERS' | translate}}
- +
 
{{ researcher.name }},
{{ researcher.name }}
diff --git a/dmp-frontend/src/app/ui/explore-dataset/explore-dataset.module.ts b/dmp-frontend/src/app/ui/explore-dataset/explore-dataset.module.ts index b06554524..468946180 100644 --- a/dmp-frontend/src/app/ui/explore-dataset/explore-dataset.module.ts +++ b/dmp-frontend/src/app/ui/explore-dataset/explore-dataset.module.ts @@ -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, diff --git a/dmp-frontend/src/app/ui/explore-dataset/explore-dataset.routing.ts b/dmp-frontend/src/app/ui/explore-dataset/explore-dataset.routing.ts index fd9f14154..f1d28185b 100644 --- a/dmp-frontend/src/app/ui/explore-dataset/explore-dataset.routing.ts +++ b/dmp-frontend/src/app/ui/explore-dataset/explore-dataset.routing.ts @@ -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' + }, } ]; diff --git a/dmp-frontend/src/assets/i18n/en.json b/dmp-frontend/src/assets/i18n/en.json index 9393ad549..11ed9caaf 100644 --- a/dmp-frontend/src/assets/i18n/en.json +++ b/dmp-frontend/src/assets/i18n/en.json @@ -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", diff --git a/dmp-frontend/src/assets/i18n/es.json b/dmp-frontend/src/assets/i18n/es.json index 14d5538ed..dc4e1e6e4 100644 --- a/dmp-frontend/src/assets/i18n/es.json +++ b/dmp-frontend/src/assets/i18n/es.json @@ -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", diff --git a/dmp-frontend/src/assets/i18n/gr.json b/dmp-frontend/src/assets/i18n/gr.json index 0004865c3..75dc1c0e2 100644 --- a/dmp-frontend/src/assets/i18n/gr.json +++ b/dmp-frontend/src/assets/i18n/gr.json @@ -565,6 +565,13 @@ "USE-DEFAULT": "Use Default Token" } }, + "DATASET-OVERVIEW": { + "DATASET-AUTHORS": "Συγγραφείς Περιγραφής Δεδομένων", + "ERROR": { + "DELETED-DATASET": "H επιλεγμένη Περιγραφή Δεδομένων θα διαγραφεί", + "FORBIDEN-DATASET": "Δεν επιτρέπεται η πρόσβαση σε αυτή την Περιγραφή Δεδομένων" + } + }, "DATASET-LISTING": { "TITLE": "Περιγραφές Συνόλων Δεδομένων", "DATASET-DESCRIPTION": "Περιγραφή Δεδομένων",