changes for users, pages and entities pages - redesign
This commit is contained in:
parent
59ff682af7
commit
3fd632a2b7
|
@ -1,8 +1,11 @@
|
|||
<div page-content class="admin-pages" (stickyEmitter)="stickyPageHeader = $event">
|
||||
<div header>
|
||||
<div class="uk-margin-top info" [class.uk-active]="stickyPageHeader">
|
||||
<div class="uk-margin-remove uk-text-primary-gradient uk-text-bold uk-h6">Admin Dashboard</div>
|
||||
<h1 class="uk-h4 uk-margin-remove">{{name}}</h1>
|
||||
<div class="uk-flex uk-flex-middle uk-margin-top info" [class.uk-active]="stickyPageHeader">
|
||||
<img *ngIf="logo" [src]="logo" class="uk-width-small uk-margin-right">
|
||||
<div class="uk-width-expand">
|
||||
<div class="uk-margin-remove uk-text-primary-gradient uk-text-bold uk-h6">Admin Dashboard</div>
|
||||
<h1 class="uk-h4 uk-margin-remove">{{name}}</h1>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-margin">
|
||||
<admin-tabs tab="entity" [portal]="portal"></admin-tabs>
|
||||
|
@ -13,33 +16,35 @@
|
|||
<loading></loading>
|
||||
</div>
|
||||
<div *ngIf="!showLoading">
|
||||
<div class="uk-flex uk-flex-right@m uk-flex-center uk-flex-wrap uk-flex-middle uk-grid uk-margin-medium-top uk-margin-medium-bottom"
|
||||
uk-grid>
|
||||
<div #searchInputComponent search-input [control]="filterForm.controls.keyword" [showSearch]="false"
|
||||
placeholder="Search entity"
|
||||
[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 *ngIf="isPortalAdministrator">
|
||||
<a (click)="newEntity()"
|
||||
class="uk-flex uk-flex-middle uk-text-uppercase">
|
||||
<button class="large uk-icon-button uk-button-secondary">
|
||||
<icon name="add"></icon>
|
||||
</button>
|
||||
<button class="uk-button uk-button-link uk-margin-small-left uk-text-secondary">Add entity</button>
|
||||
</a>
|
||||
<div class="uk-grid uk-grid-medium-bottom" uk-grid>
|
||||
<div class="uk-width-expand">
|
||||
<ul *ngIf="!isPortalAdministrator" class="uk-subnav uk-subnav-pill">
|
||||
<li [class.uk-active]="filterForm.get('status').value === 'all'"><a
|
||||
(click)="filterForm.get('status').setValue('all')"><span
|
||||
class="title">All entities</span></a></li>
|
||||
<li [class.uk-active]="filterForm.get('status').value === 'enabled'"><a
|
||||
(click)="filterForm.get('status').setValue('enabled')"><span class="title">Enabled</span></a></li>
|
||||
<li [class.uk-active]="filterForm.get('status').value === 'disabled'"><a
|
||||
(click)="filterForm.get('status').setValue('disabled')"><span class="title">Disabled</span></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="uk-flex uk-flex-center uk-flex-wrap uk-flex-middle uk-grid"
|
||||
uk-grid>
|
||||
<div #searchInputComponent search-input [control]="filterForm.controls.keyword" [showSearch]="false"
|
||||
placeholder="Search entity"
|
||||
[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 *ngIf="isPortalAdministrator">
|
||||
<a (click)="newEntity()"
|
||||
class="uk-flex uk-flex-middle uk-text-uppercase">
|
||||
<button class="large uk-icon-button uk-button-secondary">
|
||||
<icon name="add"></icon>
|
||||
</button>
|
||||
<button class="uk-button uk-button-link uk-margin-small-left uk-text-secondary">Add entity</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-width-1-1">
|
||||
<ul *ngIf="!isPortalAdministrator" class="uk-subnav uk-subnav-pill">
|
||||
<li [class.uk-active]="filterForm.get('status').value === 'all'"><a
|
||||
(click)="filterForm.get('status').setValue('all')"><span
|
||||
class="title">All entities</span></a></li>
|
||||
<li [class.uk-active]="filterForm.get('status').value === 'enabled'"><a
|
||||
(click)="filterForm.get('status').setValue('enabled')"><span class="title">Enabled</span></a></li>
|
||||
<li [class.uk-active]="filterForm.get('status').value === 'disabled'"><a
|
||||
(click)="filterForm.get('status').setValue('disabled')"><span class="title">Disabled</span></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="!showLoading && checkboxes.length > 0" class="uk-padding">
|
||||
|
|
|
@ -40,6 +40,7 @@ export class EntitiesComponent implements OnInit {
|
|||
public communities: Portal[] = [];
|
||||
public portal: string;
|
||||
public name: string;
|
||||
public logo: string;
|
||||
|
||||
public toggleIds: string[];
|
||||
public toggleStatus: boolean;
|
||||
|
@ -82,6 +83,7 @@ export class EntitiesComponent implements OnInit {
|
|||
this.subscriptions.push(this.stakeholderService.getStakeholderAsObservable().subscribe(stakeholder => {
|
||||
if(stakeholder) {
|
||||
this.name = stakeholder.name;
|
||||
this.logo = stakeholder.logoUrl;
|
||||
this.title.setTitle(stakeholder.name + ' | Entities');
|
||||
}
|
||||
}));
|
||||
|
|
|
@ -1,8 +1,11 @@
|
|||
<div page-content (stickyEmitter)="stickyPageHeader = $event">
|
||||
<div header>
|
||||
<div class="uk-margin-top info" [class.uk-active]="stickyPageHeader">
|
||||
<div class="uk-margin-remove uk-text-primary-gradient uk-text-bold uk-h6">Admin Dashboard</div>
|
||||
<h1 class="uk-h4 uk-margin-remove">{{name}}</h1>
|
||||
<div class="uk-flex uk-flex-middle uk-margin-top info" [class.uk-active]="stickyPageHeader">
|
||||
<img *ngIf="logo" [src]="logo" class="uk-width-small uk-margin-right">
|
||||
<div class="uk-width-expand">
|
||||
<div class="uk-margin-remove uk-text-primary-gradient uk-text-bold uk-h6">Admin Dashboard</div>
|
||||
<h1 class="uk-h4 uk-margin-remove">{{name}}</h1>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-margin">
|
||||
<admin-tabs tab="page" [portal]="portal"></admin-tabs>
|
||||
|
@ -13,36 +16,38 @@
|
|||
<loading></loading>
|
||||
</div>
|
||||
<div *ngIf="!showLoading">
|
||||
<div
|
||||
class="uk-flex uk-flex-right@m uk-flex-center uk-flex-wrap uk-flex-middle uk-grid uk-margin-medium-top uk-margin-medium-bottom"
|
||||
uk-grid>
|
||||
<div #searchInputComponent search-input [control]="filterForm.controls.keyword" [showSearch]="false"
|
||||
placeholder="Search page"
|
||||
[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 *ngIf="isPortalAdministrator">
|
||||
<a (click)="newPage()"
|
||||
class="uk-flex uk-flex-middle uk-text-uppercase">
|
||||
<button class="large uk-icon-button uk-button-secondary">
|
||||
<icon name="add"></icon>
|
||||
</button>
|
||||
<button class="uk-button uk-button-link uk-margin-small-left uk-text-secondary">Add page</button>
|
||||
</a>
|
||||
<div class="uk-grid uk-margin-medium-bottom" uk-grid>
|
||||
<div class="uk-width-expand">
|
||||
<ul class="uk-subnav uk-subnav-pill">
|
||||
<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
|
||||
class="uk-flex uk-flex-center uk-flex-wrap uk-flex-middle uk-grid"
|
||||
uk-grid>
|
||||
<div #searchInputComponent search-input [control]="filterForm.controls.keyword" [showSearch]="false"
|
||||
placeholder="Search page"
|
||||
[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 *ngIf="isPortalAdministrator">
|
||||
<a (click)="newPage()"
|
||||
class="uk-flex uk-flex-middle uk-text-uppercase">
|
||||
<button class="large uk-icon-button uk-button-secondary">
|
||||
<icon name="add"></icon>
|
||||
</button>
|
||||
<button class="uk-button uk-button-link uk-margin-small-left uk-text-secondary">Add page</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-width-1-1">
|
||||
<ul class="uk-subnav uk-subnav-pill">
|
||||
<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>
|
||||
<div *ngIf="!showLoading && checkboxes.length > 0" class="uk-padding">
|
||||
<div *ngIf="!showLoading && checkboxes.length > 0" class="uk-padding uk-padding-remove-top">
|
||||
<div
|
||||
class="uk-display-inline"
|
||||
[attr.uk-tooltip]="getSelectedPages().length == 0 ? 'pos:left; cls: uk-active' : null"
|
||||
|
|
|
@ -44,6 +44,7 @@ export class PagesComponent implements OnInit {
|
|||
|
||||
public portal: string;
|
||||
public name: string;
|
||||
public logo: string;
|
||||
|
||||
public pagesType: string;
|
||||
public properties: EnvProperties = properties;
|
||||
|
@ -102,6 +103,7 @@ export class PagesComponent implements OnInit {
|
|||
this.subscriptions.push(this.stakeholderService.getStakeholderAsObservable().subscribe(stakeholder => {
|
||||
if(stakeholder) {
|
||||
this.name = stakeholder.name;
|
||||
this.logo = stakeholder.logoUrl;
|
||||
this.title.setTitle(stakeholder.name + ' | Pages');
|
||||
}
|
||||
}));
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
<div page-content (stickyEmitter)="emitStickyEvent($event)">
|
||||
<div page-content (stickyEmitter)="stickyEmitter.emit($event)">
|
||||
<div header>
|
||||
<ng-content></ng-content>
|
||||
</div>
|
||||
|
@ -6,36 +6,38 @@
|
|||
<div *ngIf="loadActive || loadPending" class="uk-position-center">
|
||||
<loading></loading>
|
||||
</div>
|
||||
<div [class.uk-invisible]="loadActive || loadPending"
|
||||
class="uk-width-auto@m uk-width-1-1 uk-grid uk-flex-middle uk-flex-right@m uk-flex-center uk-margin-medium-top uk-margin-medium-bottom uk-margin-remove-left" uk-grid>
|
||||
<div *ngIf="showCurrent" search-input [control]="filterForm.get('active')" [showSearch]="false" [placeholder]="'Search ' + role + 's'"
|
||||
[bordered]="true" colorClass="uk-text-secondary">
|
||||
<div class="uk-grid uk-margin-medium-bottom" 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 *ngIf="!showCurrent" search-input [control]="filterForm.get('active')" [showSearch]="false" [placeholder]="'Search invitations'"
|
||||
[bordered]="true" colorClass="uk-text-secondary">
|
||||
<div [class.uk-invisible]="loadActive || loadPending"
|
||||
class="uk-width-auto@m uk-width-1-1 uk-grid uk-flex-middle uk-flex-right@m uk-flex-center uk-margin-remove-left" uk-grid>
|
||||
<div *ngIf="showCurrent" search-input [control]="filterForm.get('active')" [showSearch]="false" [placeholder]="'Search ' + role + 's'"
|
||||
[bordered]="true" colorClass="uk-text-secondary">
|
||||
</div>
|
||||
<div *ngIf="!showCurrent" search-input [control]="filterForm.get('active')" [showSearch]="false" [placeholder]="'Search invitations'"
|
||||
[bordered]="true" colorClass="uk-text-secondary">
|
||||
</div>
|
||||
<div>
|
||||
<button *ngIf="exists" class="uk-button uk-button-default uk-text-primary uk-flex uk-flex-middle" [attr.uk-tooltip]="inviteDisableMessage"
|
||||
[disabled]="loadPending || !!inviteDisableMessage" (click)="openInviteModal()">
|
||||
<icon name="person_add" [flex]="true" type="filled"></icon>
|
||||
<span class="uk-margin-small-left uk-text-bold uk-text-uppercase">Invite {{role}}</span>
|
||||
</button>
|
||||
<button *ngIf="!exists && isPortalAdmin" class="uk-button uk-button-default uk-text-primary uk-flex uk-flex-middle"
|
||||
(click)="openCreateRoleModal()">
|
||||
<icon name="person_add" [flex]="true" type="filled"></icon>
|
||||
<span class="uk-margin-small-left uk-text-bold uk-text-uppercase">Create Group</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<button *ngIf="exists" class="uk-button uk-button-default uk-text-primary uk-flex uk-flex-middle" [attr.uk-tooltip]="inviteDisableMessage"
|
||||
[disabled]="loadPending || !!inviteDisableMessage" (click)="openInviteModal()">
|
||||
<icon name="person_add" [flex]="true" type="filled"></icon>
|
||||
<span class="uk-margin-small-left uk-text-bold uk-text-uppercase">Invite {{role}}</span>
|
||||
</button>
|
||||
<button *ngIf="!exists && isPortalAdmin" class="uk-button uk-button-default uk-text-primary uk-flex uk-flex-middle"
|
||||
(click)="openCreateRoleModal()">
|
||||
<icon name="person_add" [flex]="true" type="filled"></icon>
|
||||
<span class="uk-margin-small-left uk-text-bold uk-text-uppercase">Create Group</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-flex uk-flex-left@m uk-flex-center">
|
||||
<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 *ngIf="!loadActive && !loadPending">
|
||||
<div *ngIf="(showCurrent && showActive.length == 0) || (!showCurrent && showPending.length == 0)"
|
||||
|
|
|
@ -331,8 +331,4 @@ export class RoleUsersComponent implements OnInit, OnDestroy, OnChanges {
|
|||
this.showPending = this.pending.filter(pending => !value || pending.includes(value));
|
||||
this.pendingPage = 1;
|
||||
}
|
||||
|
||||
public emitStickyEvent(event) {
|
||||
this.stickyEmitter.emit(event);
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue