Merge branch 'new-theme' of code-repo.d4science.org:MaDgIK/openaire-library into new-theme
This commit is contained in:
commit
98eb169a54
|
@ -1,5 +1,19 @@
|
|||
<div page-content class="admin-pages">
|
||||
<div header>
|
||||
<div page-content (stickyEmitter)="stickyPageHeader = $event">
|
||||
<div header>
|
||||
<div class="uk-flex uk-flex-middle uk-margin-top info" [class.uk-active]="stickyPageHeader">
|
||||
<ng-container *ngIf="showLogo">
|
||||
<img [src]="entity | logoUrl" class="uk-margin-right uk-blend-multiply">
|
||||
</ng-container>
|
||||
<div>
|
||||
<div class="uk-margin-remove uk-text-background uk-text-bold uk-h6">Admin Dashboard - Manage Menu Items</div>
|
||||
<h1 class="uk-h4 uk-margin-remove">{{name ? name : 'Super Admin'}}</h1>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-margin uk-margin-remove-bottom">
|
||||
<admin-tabs tab="menu" [portal]="portal"></admin-tabs>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div header>
|
||||
<admin-tabs tab="menu" [portal]="portal"></admin-tabs>
|
||||
<div *ngIf="!showLoading" class="uk-grid" uk-grid>
|
||||
<div class="uk-width-1-1">
|
||||
|
@ -45,10 +59,10 @@
|
|||
class="uk-width-1-1 uk-flex uk-flex-right@m uk-flex-center uk-flex-wrap uk-flex-middle uk-grid uk-margin-remove-top"
|
||||
uk-grid>
|
||||
<div #searchInputComponent search-input [control]="filterForm.controls.keyword" [showSearch]="false"
|
||||
placeholder="Search menu item"
|
||||
[selected]="selectedKeyword" (closeEmitter)="onSearchClose()" (resetEmitter)="reset()"
|
||||
[bordered]="true" colorClass="uk-text-secondary"
|
||||
class="uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1"></div>
|
||||
placeholder="Search menu item"
|
||||
[selected]="selectedKeyword" (closeEmitter)="onSearchClose()" (resetEmitter)="reset()"
|
||||
[bordered]="true" colorClass="uk-text-secondary"
|
||||
class="uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1"></div>
|
||||
<div>
|
||||
<a (click)="newMenuItem(true)" class="uk-flex uk-flex-middle uk-text-uppercase">
|
||||
<button class="large uk-icon-button uk-button-secondary">
|
||||
|
@ -60,63 +74,76 @@
|
|||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
<div inner>
|
||||
<div *ngIf="showLoading" class="uk-position-center">
|
||||
<loading></loading>
|
||||
</div>
|
||||
<div *ngIf="!showLoading">
|
||||
<ul *ngIf='activeRootMenuId' class="uk-list submenu-items">
|
||||
<li *ngFor="let child of childrenMenuItems" class="uk-card uk-card-default uk-margin-bottom">
|
||||
<div class="uk-grid uk-grid-divider uk-padding" uk-grid>
|
||||
<div class="uk-width-4-5">
|
||||
<div class="uk-grid uk-flex uk-flex-middle">
|
||||
<div class="uk-width-expand uk-margin-medium-bottom">
|
||||
{{child.title}}
|
||||
</div>
|
||||
<div *ngIf="child.url && child.type == 'external'" class="uk-grid uk-width-1-1 uk-margin-left">
|
||||
<span class="title uk-padding-remove">URL: </span><a href="{{child.url}}" target="_blank"
|
||||
class="uk-padding-remove uk-margin-left">{{child.url}}</a>
|
||||
</div>
|
||||
<div *ngIf="child.route && child.type == 'internal'" class="uk-grid uk-width-1-1 uk-margin-left">
|
||||
<span class="title uk-padding-remove">Route: </span><span
|
||||
class="uk-padding-remove uk-margin-left">{{child.route}}</span>
|
||||
</div>
|
||||
<div *ngIf="(menuRouteStatus != null && !menuRouteStatus.get(child._id) && child.type == 'internal')" class="uk-grid uk-width-1-1 uk-margin-left">
|
||||
<span class="uk-padding-remove uk-text-warning">The item is not used either because the required page does not exist or it is disabled</span>
|
||||
<div class="uk-flex uk-flex-right@m uk-flex-center uk-flex-middle uk-grid uk-margin-top" uk-grid>
|
||||
<div>
|
||||
<button class="uk-button uk-button-default uk-flex uk-flex-middle"
|
||||
[disabled]="showLoading" [class.uk-disabled]="showLoading"
|
||||
(click)="newMenuItem()"
|
||||
uk-tooltip="title:<div>?</div>">
|
||||
<icon name="add" [flex]="true"></icon>
|
||||
<span class="uk-margin-small-left">New Menu Item</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-section uk-section-small uk-position-relative" style="min-height: 60vh">
|
||||
<div *ngIf="showLoading" class="uk-position-center">
|
||||
<loading></loading>
|
||||
</div>
|
||||
<div *ngIf="!showLoading">
|
||||
<!-- <ul *ngIf='activeRootMenuId' class="uk-list submenu-items">
|
||||
<li *ngFor="let child of childrenMenuItems" class="uk-card uk-card-default uk-margin-bottom">
|
||||
<div class="uk-grid uk-grid-divider uk-padding" uk-grid>
|
||||
<div class="uk-width-4-5">
|
||||
<div class="uk-grid uk-flex uk-flex-middle">
|
||||
<div class="uk-width-expand uk-margin-medium-bottom">
|
||||
{{child.title}}
|
||||
</div>
|
||||
<div *ngIf="child.url && child.type == 'external'" class="uk-grid uk-width-1-1 uk-margin-left">
|
||||
<span class="title uk-padding-remove">URL: </span><a href="{{child.url}}" target="_blank"
|
||||
class="uk-padding-remove uk-margin-left">{{child.url}}</a>
|
||||
</div>
|
||||
<div *ngIf="child.route && child.type == 'internal'" class="uk-grid uk-width-1-1 uk-margin-left">
|
||||
<span class="title uk-padding-remove">Route: </span><span
|
||||
class="uk-padding-remove uk-margin-left">{{child.route}}</span>
|
||||
</div>
|
||||
<div *ngIf="(menuRouteStatus != null && !menuRouteStatus.get(child._id) && child.type == 'internal')" class="uk-grid uk-width-1-1 uk-margin-left">
|
||||
<span class="uk-padding-remove uk-text-warning">The item is not used either because the required page does not exist or it is disabled</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-width-1-5">
|
||||
<div class="uk-flex uk-flex-center uk-flex-column uk-height-1-1">
|
||||
<div class="uk-flex uk-flex-center">
|
||||
<div class="actions">
|
||||
<button class="uk-button uk-button-secondary uk-margin-top uk-flex uk-flex-middle"
|
||||
(click)="editMenuItem(child, true)">
|
||||
<icon name="edit" [flex]="true"></icon>
|
||||
<span class="uk-margin-small-left"> Edit</span>
|
||||
</button>
|
||||
<button class="uk-button uk-button-danger uk-margin-top uk-flex uk-flex-middle"
|
||||
(click)="confirmDeleteMenuItem(child._id, true)">
|
||||
<icon name="delete" [flex]="true"></icon>
|
||||
<span class="uk-margin-small-left"> Delete</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
<div *ngIf="childrenMenuItems.length == 0 && !activeRootMenu.isFeatured"
|
||||
class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-bottom uk-text-bold">
|
||||
<div>No menu items found</div>
|
||||
</div>
|
||||
<div *ngIf="activeRootMenu.isFeatured"
|
||||
class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-bottom uk-text-bold">
|
||||
<div>Featured menu items can't have any sub menu items</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-width-1-5">
|
||||
<div class="uk-flex uk-flex-center uk-flex-column uk-height-1-1">
|
||||
<div class="uk-flex uk-flex-center">
|
||||
<div class="actions">
|
||||
<button class="uk-button uk-button-secondary uk-margin-top uk-flex uk-flex-middle"
|
||||
(click)="editMenuItem(child, true)">
|
||||
<icon name="edit" [flex]="true"></icon>
|
||||
<span class="uk-margin-small-left"> Edit</span>
|
||||
</button>
|
||||
<button class="uk-button uk-button-danger uk-margin-top uk-flex uk-flex-middle"
|
||||
(click)="confirmDeleteMenuItem(child._id, true)">
|
||||
<icon name="delete" [flex]="true"></icon>
|
||||
<span class="uk-margin-small-left"> Delete</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul> -->
|
||||
<div *ngIf="childrenMenuItems.length == 0 && !activeRootMenu.isFeatured"
|
||||
class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-bottom uk-text-bold">
|
||||
<div>No menu items found</div>
|
||||
</div>
|
||||
<div *ngIf="activeRootMenu.isFeatured"
|
||||
class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-bottom uk-text-bold">
|
||||
<div>Featured menu items can't have any sub menu items</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<modal-alert #editModal (alertOutput)="menuItemSaveConfirmed($event)"
|
||||
|
|
|
@ -15,6 +15,10 @@ import {MenuItem} from '../../sharedComponents/menu';
|
|||
import {SearchInputComponent} from '../../sharedComponents/search-input/search-input.component';
|
||||
import {Page} from '../../utils/entities/adminTool/page';
|
||||
import {Option} from '../../sharedComponents/input/input.component';
|
||||
import {CommunityInfo} from '../../connect/community/communityInfo';
|
||||
import {Stakeholder} from '../../monitor/entities/stakeholder';
|
||||
import {StakeholderService} from '../../monitor/services/stakeholder.service';
|
||||
import {CommunityService} from '../../connect/community/community.service';
|
||||
|
||||
declare var UIkit;
|
||||
|
||||
|
@ -45,6 +49,9 @@ export class MenuComponent implements OnInit {
|
|||
|
||||
public communities: Portal[] = [];
|
||||
public portal: string;
|
||||
public name: string;
|
||||
public entity: CommunityInfo | Stakeholder;
|
||||
public showLogo: boolean = true;
|
||||
|
||||
public newPageWindowOpen: boolean = false;
|
||||
public showLoading = true;
|
||||
|
@ -65,11 +72,14 @@ export class MenuComponent implements OnInit {
|
|||
public properties: EnvProperties = properties;
|
||||
private subscriptions: any[] = [];
|
||||
private typeSub: Subscription = null;
|
||||
public stickyPageHeader: boolean = false;
|
||||
|
||||
constructor(private element: ElementRef, private route: ActivatedRoute,
|
||||
private _router: Router, private title: Title,
|
||||
private _helpContentService: HelpContentService,
|
||||
private userManagementService: UserManagementService, private _fb: FormBuilder) {
|
||||
private userManagementService: UserManagementService, private _fb: FormBuilder,
|
||||
private stakeholderService: StakeholderService,
|
||||
private communityService: CommunityService) {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
|
@ -84,9 +94,28 @@ export class MenuComponent implements OnInit {
|
|||
this.portal = (this.route.snapshot.data.portal) ? this.route.snapshot.data.portal : this.route.snapshot.params[this.route.snapshot.data.param];
|
||||
this.getMenuItems();
|
||||
if (this.route.snapshot.data.portal) {
|
||||
this.name = StringUtils.capitalize(this.portal);
|
||||
this.title.setTitle(StringUtils.capitalize(this.portal) + ' | Menu');
|
||||
} else if (this.route.snapshot.params[this.route.snapshot.data.param]) {
|
||||
this.title.setTitle(this.portal.toUpperCase() + ' | Menu');
|
||||
// this.title.setTitle(this.portal.toUpperCase() + ' | Menu');
|
||||
if(this.route.snapshot.data.param === 'stakeholder') {
|
||||
this.subscriptions.push(this.stakeholderService.getStakeholderAsObservable().subscribe(stakeholder => {
|
||||
if(stakeholder) {
|
||||
this.name = stakeholder.name;
|
||||
this.entity = stakeholder;
|
||||
this.title.setTitle(this.name + ' | Menu');
|
||||
}
|
||||
}));
|
||||
} else {
|
||||
this.subscriptions.push(this.communityService.getCommunityAsObservable().subscribe(community => {
|
||||
if(community) {
|
||||
this.showLogo = false;
|
||||
this.name = community.shortTitle;
|
||||
this.entity = community;
|
||||
this.title.setTitle(this.name + ' | Menu');
|
||||
}
|
||||
}));
|
||||
}
|
||||
} else {
|
||||
this.title.setTitle('Administrator Dashboard | Menu');
|
||||
}
|
||||
|
@ -251,7 +280,7 @@ export class MenuComponent implements OnInit {
|
|||
});
|
||||
this.isChild = isChild;
|
||||
this.addValidatorForUrlOrRoute();
|
||||
this.menuItemsModalOpen('Create Menu Item', 'Create');
|
||||
this.menuItemsModalOpen('Add Menu Item', 'Create');
|
||||
}
|
||||
|
||||
public editMenuItem(menuItem: MenuItem, isChild: boolean = false) {
|
||||
|
|
|
@ -12,7 +12,9 @@ import { properties } from 'src/environments/environment';
|
|||
<li *ngIf="isPortalAdmin && !portal" [class.uk-active]="tab === 'portal'"><a routerLink="../portals">Portals</a></li>
|
||||
<li [class.uk-active]="tab === 'page'"><a routerLink="../pages">Pages</a></li>
|
||||
<li [class.uk-active]="tab === 'entity'"><a routerLink="../entities">Entities</a></li>
|
||||
<li *ngIf="env === 'development' && portal && type === 'community'" [class.uk-active]="tab === 'menu'"><a routerLink="../menu">Menu</a></li>
|
||||
<!-- removing the type === 'community' condition below for now -->
|
||||
<!-- && type === 'community' -->
|
||||
<li *ngIf="env === 'development' && portal" [class.uk-active]="tab === 'menu'"><a routerLink="../menu">Menu</a></li>
|
||||
<li *ngIf="isPortalAdmin && !portal" [class.uk-active]="tab === 'class'"><a routerLink="../classes">Classes</a></li>
|
||||
</ul>
|
||||
`
|
||||
|
|
|
@ -49,7 +49,9 @@ declare var UIkit: any;
|
|||
* API to an open alert window.
|
||||
*/
|
||||
export class AlertModal {
|
||||
@Input() id: string = "modal";
|
||||
private static MODAL_COUNTER: number = 0;
|
||||
|
||||
id: string = "modal";
|
||||
@Input() classTitle: string = "uk-background-primary-opacity";
|
||||
@Input() classBody: string = "";
|
||||
@Input() large: boolean = false;
|
||||
|
@ -137,7 +139,23 @@ export class AlertModal {
|
|||
|
||||
constructor() {
|
||||
}
|
||||
|
||||
|
||||
ngOnInit() {
|
||||
AlertModal.MODAL_COUNTER++;
|
||||
this.id = 'modal-' + AlertModal.MODAL_COUNTER;
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
if(typeof document !== "undefined") {
|
||||
const element = document.getElementById("modal-container");
|
||||
for (let i = element.childNodes.length - 1; i >= 0; --i) {
|
||||
let child: ChildNode = element.childNodes[i];
|
||||
if (child['id'] == this.id) {
|
||||
child.remove();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Opens an alert window creating backdrop.
|
||||
|
|
|
@ -51,7 +51,9 @@ declare var ResizeObserver;
|
|||
`
|
||||
})
|
||||
export class FullScreenModalComponent implements AfterViewInit, OnDestroy {
|
||||
@Input() id: string = "fs-modal";
|
||||
private static FS_MODAL_COUNTER: number = 0;
|
||||
|
||||
id: string = "fs-modal";
|
||||
@Input() classTitle: string = "uk-background-primary uk-light";
|
||||
@Input() classBody: string = 'uk-container-large';
|
||||
back: boolean = false;
|
||||
|
@ -78,7 +80,12 @@ export class FullScreenModalComponent implements AfterViewInit, OnDestroy {
|
|||
onResize() {
|
||||
this.changeHeight();
|
||||
}
|
||||
|
||||
|
||||
ngOnInit() {
|
||||
FullScreenModalComponent.FS_MODAL_COUNTER++;
|
||||
this.id = 'fs-modal-' + FullScreenModalComponent.FS_MODAL_COUNTER;
|
||||
}
|
||||
|
||||
ngAfterViewInit() {
|
||||
if(typeof window !== "undefined") {
|
||||
this.observer = new ResizeObserver(entries => {
|
||||
|
@ -102,6 +109,16 @@ export class FullScreenModalComponent implements AfterViewInit, OnDestroy {
|
|||
if(this.observer && this.observer instanceof ResizeObserver) {
|
||||
this.observer.disconnect();
|
||||
}
|
||||
if(typeof document !== "undefined") {
|
||||
const element = document.getElementById("modal-container");
|
||||
for (let i = element.childNodes.length - 1; i >= 0; --i) {
|
||||
let child: ChildNode = element.childNodes[i];
|
||||
if (child['id'] == this.id) {
|
||||
child.remove();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
get isOpen() {
|
||||
|
|
Loading…
Reference in New Issue