MaDgIK
/
openaire-library
13
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Fix condition for menu tab in pages and entities. Page content: Add isStickyActive accessor. Users: Check if sticky is Active in order to apply margins.

This commit is contained in:
Konstantinos Triantafyllou 2022-07-14 11:29:29 +03:00
parent 3b6498cb2e
commit 333973aefd
6 changed files with 59 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
dashboard/entity/entities.component.ts
View File

@ -10,14 +10,12 @@ import {UserManagementService} from '../../services/user-management.service';
import {Subscriber} from "rxjs";
import {properties} from "../../../../environments/environment";
import {AlertModal} from "../../utils/modal/alert";
import {SearchInputComponent} from "../../sharedComponents/search-input/search-input.component";
import {StringUtils} from "../../utils/string-utils.class";
import {Title} from "@angular/platform-browser";
import {StakeholderService} from '../../monitor/services/stakeholder.service';
import {CommunitiesService} from "../../connect/communities/communities.service";
import {CommunityService} from "../../connect/community/community.service";
import {CommunityInfo} from "../../connect/community/communityInfo";
import {Stakeholder, StakeholderInfo} from "../../monitor/entities/stakeholder";
import {Stakeholder} from "../../monitor/entities/stakeholder";
import {ClearCacheService} from "../../services/clear-cache.service";
import {NotificationHandler} from "../../utils/notification-handler";
@ -43,6 +41,7 @@ export class EntitiesComponent implements OnInit {
public communities: Portal[] = [];
public portal: string;
public type: any;
public name: string;
public entity: CommunityInfo | Stakeholder;
public showLogo: boolean = true;
@ -84,6 +83,7 @@ export class EntitiesComponent implements OnInit {
this.name = StringUtils.capitalize(this.portal);
this.title.setTitle(StringUtils.capitalize(this.portal) + ' | Entities');
} else if (this.route.snapshot.params[this.route.snapshot.data.param]) {
this.type = this.route.snapshot.data.param;
if(this.route.snapshot.data.param === 'stakeholder') {
this.subscriptions.push(this.stakeholderService.getStakeholderAsObservable().subscribe(stakeholder => {
if(stakeholder) {

36
dashboard/page/pages.component.html
View File

@ -9,29 +9,29 @@
<h1 class="uk-h4 uk-margin-remove">{{name ? name : 'Super Admin'}}</h1>
</div>
</div>
<admin-tabs tab="page" [portal]="portal"></admin-tabs>
<admin-tabs tab="page" [portal]="portal" [type]="type"></admin-tabs>
<ul class="uk-subnav uk-subnav-pill uk-margin-medium-top">
<li [class.uk-active]="filterForm.get('type').value === 'all'"><a
(click)="filterForm.get('type').setValue('all')"><span>All pages</span></a></li>
<li *ngFor="let type of typeOptions; let i=index"
[class.uk-active]="filterForm.get('type').value === type.value"><a
(click)="filterForm.get('type').setValue(type.value)"><span>{{type.label}}</span></a></li>
</ul>
<li [class.uk-active]="filterForm.get('type').value === 'all'"><a
(click)="filterForm.get('type').setValue('all')"><span>All pages</span></a></li>
<li *ngFor="let type of typeOptions; let i=index"
[class.uk-active]="filterForm.get('type').value === type.value"><a
(click)="filterForm.get('type').setValue(type.value)"><span>{{type.label}}</span></a></li>
</ul>
</div>
<div actions>
<div class="uk-section-xsmall">
<div class="uk-flex uk-flex-right@m uk-flex-center uk-flex-wrap uk-flex-middle uk-grid" uk-grid>
<div search-input [expandable]="true" [searchControl]="filterForm.get('keyword')" searchInputClass="outer"
placeholder="Search page" [disabled]="showLoading"
class="uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1"></div>
<div *ngIf="isPortalAdministrator">
<button class="uk-button uk-button-default uk-flex uk-flex-middle" (click)="newPage()"
[disabled]="showLoading" [class.uk-disabled]="showLoading">
<icon name="add" [flex]="true"></icon>
<span class="uk-margin-small-left uk-text-bold uk-text-uppercase">Add page</span>
</button>
</div>
</div>
<div search-input [expandable]="true" [searchControl]="filterForm.get('keyword')" searchInputClass="outer"
placeholder="Search page" [disabled]="showLoading"
class="uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1"></div>
<div *ngIf="isPortalAdministrator">
<button class="uk-button uk-button-default uk-flex uk-flex-middle" (click)="newPage()"
[disabled]="showLoading" [class.uk-disabled]="showLoading">
<icon name="add" [flex]="true"></icon>
<span class="uk-margin-small-left uk-text-bold uk-text-uppercase">Add page</span>
</button>
</div>
</div>
</div>
</div>
<div inner>

2
dashboard/page/pages.component.ts
View File

@ -46,6 +46,7 @@ export class PagesComponent implements OnInit {
public keyword: string = '';
public portal: string;
public type: any;
public name: string;
public entity: CommunityInfo | Stakeholder;
public showLogo: boolean = true;
@ -102,6 +103,7 @@ export class PagesComponent implements OnInit {
this.name = StringUtils.capitalize(this.portal);
this.title.setTitle(StringUtils.capitalize(this.portal) + ' | Pages');
} else if (this.route.snapshot.params[this.route.snapshot.data.param]) {
this.type = this.route.snapshot.data.param;
if(this.route.snapshot.data.param === 'stakeholder') {
this.subscriptions.push(this.stakeholderService.getStakeholderAsObservable().subscribe(stakeholder => {
if(stakeholder) {

7
dashboard/sharedComponents/admin-tabs/admin-tabs.component.ts
View File

@ -12,23 +12,20 @@ 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>
<!-- 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="portal && type === 'community'" [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>
`
})
export class AdminTabsComponent implements OnInit {
@Input()
public type: string;
public type: 'community' | 'stakeholder' = null;
@Input()
portal = null;
@Input()
public user: User;
@Input()
public tab: "portal" | "page" | "entity" | "menu" | "class" = 'page';
public env = properties.environment;
private subscriptions: any[] = [];
constructor(private route: ActivatedRoute, private userManagementService: UserManagementService) {

20
dashboard/sharedComponents/page-content/page-content.component.ts
View File

@ -1,17 +1,19 @@
import {AfterViewInit, Component, Input, OnDestroy, OnInit} from "@angular/core";
import {AfterViewInit, Component, ElementRef, Input, OnDestroy, OnInit, ViewChild} from "@angular/core";
declare var UIkit;
@Component({
selector: '[page-content]',
template: `
<div id="page_content">
<div id="page_content_header" [attr.uk-sticky]="(headerSticky && shouldSticky)?'media: @m':null" [attr.offset]="offset">
<div id="page_content_header" #header [attr.uk-sticky]="(headerSticky && shouldSticky)?'media: @m':null" [attr.offset]="offset">
<div class="uk-container uk-container-large">
<div class="uk-padding-small uk-padding-remove-vertical">
<ng-content select="[header]"></ng-content>
</div>
</div>
</div>
<div id="page_content_actions" [attr.uk-sticky]="(!headerSticky && shouldSticky)?'media: @m':null" [attr.offset]="offset">
<div id="page_content_actions" #actions [attr.uk-sticky]="(!headerSticky && shouldSticky)?'media: @m':null" [attr.offset]="offset">
<div class="uk-container uk-container-large">
<div class="uk-padding-small uk-padding-remove-vertical">
<ng-content select="[actions]"></ng-content>
@ -31,6 +33,9 @@ export class PageContentComponent implements OnInit, AfterViewInit, OnDestroy {
public headerSticky: boolean = false;
public offset: number;
public shouldSticky: boolean = true;
@ViewChild('header') header: ElementRef;
@ViewChild('actions') actions: ElementRef;
public
private observer: IntersectionObserver;
constructor() {
@ -42,6 +47,15 @@ export class PageContentComponent implements OnInit, AfterViewInit, OnDestroy {
}
}
get isStickyActive() {
if(this.header && this.actions) {
let sticky = (this.headerSticky)?this.header.nativeElement:this.actions.nativeElement;
return UIkit.sticky(sticky).isActive;
} else {
return false;
}
}
ngAfterViewInit() {
if(typeof document !== "undefined") {
let bottom = document.getElementById('bottom');

32
dashboard/users/role-users/role-users.component.html
View File

@ -1,24 +1,25 @@
<div page-content>
<div #content page-content>
<div header>
<ng-content></ng-content>
<div class="uk-margin-medium-top">
<ul class="uk-subnav uk-subnav-pill">
<li [class.uk-active]="showCurrent" (click)="showCurrent = true">
<a class="uk-text-capitalize">{{role}}s</a>
</li>
<li [class.uk-active]="!showCurrent" (click)="showCurrent = false">
<a>Pending {{role}}s</a>
</li>
</ul>
</div>
</div>
<div actions>
<div class="uk-section-xsmall">
<div class="uk-grid uk-flex-right@m uk-flex-center uk-flex-middle" uk-grid>
<div *ngIf="showCurrent" [disabled]="loadActive" search-input class="uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1"
<div class="uk-section-xsmall" [class.uk-padding-remove-top]="!content.isStickyActive" [class.uk-margin-xsmall-top]="!content.isStickyActive">
<div class="uk-grid" uk-grid>
<div class="uk-flex uk-flex-left@m uk-flex-center uk-width-expand">
<ul class="uk-subnav uk-subnav-pill">
<li [class.uk-active]="showCurrent" (click)="showCurrent = true">
<a class="uk-text-capitalize">{{role}}s</a>
</li>
<li [class.uk-active]="!showCurrent" (click)="showCurrent = false">
<a>Pending {{role}}s</a>
</li>
</ul>
</div>
<div class="uk-width-expand@m uk-width-1-1 uk-grid uk-flex-right@m uk-flex-center uk-flex-middle" uk-grid>
<div *ngIf="showCurrent" [disabled]="loadActive" search-input class="uk-width-expand@l uk-width-1-1"
[searchControl]="filterForm.get('active')" [expandable]="true" [placeholder]="'Search ' + role + 's'" searchInputClass="outer">
</div>
<div *ngIf="!showCurrent" [disabled]="loadPending" search-input class="uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1"
<div *ngIf="!showCurrent" [disabled]="loadPending" search-input class="uk-width-expand@l uk-width-1-1"
[searchControl]="filterForm.get('pending')" [expandable]="true" [placeholder]="'Search invitations'" searchInputClass="outer">
</div>
<div>
@ -35,6 +36,7 @@
</button>
</div>
</div>
</div>
</div>
</div>
<div inner>