monitor-dashboard/src/app/app.component.html

71 lines
4.5 KiB
HTML

<div *ngIf="loading">
<loading [full]="true"></loading>
</div>
<div *ngIf="!loading" [class.monitor]="isFrontPage">
<div id="modal-container"></div>
<ng-container *ngIf="!isHidden">
<navbar *ngIf="hasHeader" portal="monitor_dashboard" [header]="menuHeader" [userMenuItems]=userMenuItems [menuItems]="menuItems" [user]="user"
[notificationConfiguration]="isMobile && user && notificationGroupsInitialized?notificationConfiguration:null"></navbar>
<div>
<div class="sidebar_main_swipe uk-flex uk-background-default" [class.sidebar_main_active]="open && (hasSidebar || hasAdminMenu || hasInternalSidebar)"
[class.sidebar_mini]="!open && (hasSidebar || hasAdminMenu || hasInternalSidebar)" [class.sidebar_hover]="hover">
<dashboard-sidebar *ngIf="stakeholder && isFrontPage && hasSidebar && !hasInternalSidebar" queryParamsHandling="merge" [items]="sideBarItems"
[activeItem]="activeTopic?activeTopic.alias:null" [activeSubItem]="activeCategory?activeCategory.alias:null"></dashboard-sidebar>
<dashboard-sidebar *ngIf="hasAdminMenu && !hasInternalSidebar" [items]="adminMenuItems" [backItem]="backItem"></dashboard-sidebar>
<main class="uk-width-1-1">
<router-outlet></router-outlet>
</main>
</div>
<bottom id="bottom" *ngIf="isFrontPage" [centered]="true" [properties]="properties" [showMenuItems]="true"></bottom>
<notification-sidebar *ngIf="!isMobile && user && notificationGroupsInitialized" [configuration]="notificationConfiguration" [user]="user"></notification-sidebar>
<cache-indicators *ngIf="stakeholder && !isFrontPage && isCurator()" [alias]="stakeholder.alias"></cache-indicators>
<div *ngIf="view" class="preview uk-text-small uk-flex uk-flex-middle">
<span>You are currently in a <span class="uk-text-bold">"Preview"</span> mode. <span class="uk-visible@m"><a (click)="removeView()">The current view</a> of this dashboard may differ.</span></span>
</div>
</div>
</ng-container>
<div *ngIf="projectUpdate && !isFrontPage" class="project-update">
<div *ngIf="projectUpdate === 'danger'" class="uk-alert uk-alert-danger" uk-alert>
<a class="uk-alert-close" uk-close></a>
<div class="uk-text-bold uk-text-small">Projects Status: Urgent Update Needed</div>
<div class="uk-margin-xsmall-top uk-text-xsmall">
Your project list was last updated more than a year ago. Please send an updated project list to
<a href="mailto:mining@openaire.eu">mining@openaire.eu</a> or contact <a [href]="monitorLink + '/contact-us'">support</a>.
</div>
</div>
<div *ngIf="projectUpdate === 'warning'" class="uk-alert uk-alert-warning" uk-alert>
<a class="uk-alert-close" uk-close></a>
<div class="uk-text-bold uk-text-small">Projects Status: Update Needed</div>
<div class="uk-margin-xsmall-top uk-text-xsmall">
Your project list was last updated between 6 to 12 months ago. Please send an updated project list to
<a href="mailto:mining@openaire.eu">mining@openaire.eu</a> or contact <a [href]="monitorLink + '/contact-us'" target="_blank" class="custom-external">support</a>.
</div>
</div>
</div>
<div *ngIf="isHidden" class="private-data uk-light dark">
<div class="uk-section uk-section-small uk-container uk-container-small uk-text-center">
<img src="assets/common-assets/logo-services/monitor/inverted.svg" style="height: 80px;">
<h1 class="uk-h4 uk-margin-large-top">Private Content</h1>
<div class="uk-text-large">
The contents of this dashboard are only visible to invited members.
</div>
<div class="uk-margin-large-top uk-margin-large-bottom">
<icon name="incognito" ratio="7"></icon>
</div>
<div class="uk-margin-medium-bottom">
<div *ngIf="!user">
If you are a member of this dashboard, please sign in.
</div>
<div>
If you want to be a member of this dashboard - Contact us.
</div>
</div>
<div class="uk-flex uk-flex-center uk-flex-middle">
<a *ngIf="!user" class="uk-button uk-button-primary uk-margin-right" (click)="login()">Sign in</a>
<a class="uk-button uk-button-secondary" [href]="monitorLink + '/contact-us'">Contact us</a>
</div>
</div>
</div>
<role-verification *ngIf="stakeholder" [id]="stakeholder.alias" [name]="stakeholder.name" [type]="stakeholder.type" [userInfoLink]="monitorLink + '/user-info'"></role-verification>
</div>