Make some page alignments in all dashboard pages

This commit is contained in:
Konstantinos Triantafyllou 2022-06-30 18:22:35 +03:00
parent 7ebf4f7f90
commit 936c870abc
14 changed files with 302 additions and 297 deletions

View File

@ -1,6 +1,6 @@
<schema2jsonld *ngIf="url" [URL]="url" [name]="pageTitle" type="other"></schema2jsonld>
<div class="uk-grid">
<div class="uk-width-expand uk-position-relative" style="min-height: 60vh">
<div class="uk-width-expand uk-position-relative">
<div *ngIf="!loading">
<helper *ngIf="pageContents && pageContents['top'] && pageContents['top'].length > 0"
[texts]="pageContents['top']"></helper>
@ -43,51 +43,55 @@
</div>
</div>
</div>
<loading *ngIf="loading" class="uk-position-center"></loading>
<div *ngIf="!loading" class="uk-section uk-section-small">
<div *ngIf="claims && claims.length == 0" class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-bottom uk-text-bold">
<div>No links found</div>
<div class="uk-section uk-section-small uk-position-relative" style="min-height: 60vh">
<div *ngIf="loading" class="uk-position-center">
<loading></loading>
</div>
<ul class="uk-margin-small-top uk-list uk-list-xlarge">
<li *ngFor="let claim of claims; let i=index" class="uk-card uk-card-default">
<div class="uk-card-body">
<div class="uk-grid" uk-grid>
<div class="uk-width-expand">
<div class="uk-margin-bottom">
<claim-entity [entity]="claim.target" [type]="claim.targetType" [properties]=properties
[externalPortalUrl]=externalPortalUrl [source]="true"></claim-entity>
</div>
<div class="uk-margin-bottom">
<span *ngIf="isClaimAvailable(claim) else notAvailable" class="uk-label uk-label-success"
[attr.uk-tooltip]="'title:<div class=\'uk-margin uk-padding-small\'>The link information is available in the portal and the APIs.</div>'"
>available
</span>
<ng-template #notAvailable><span class="uk-label uk-label-danger"
[attr.uk-tooltip]="'title:<div class=\'uk-margin uk-padding-small\'>The link information will be added in the portal and the APIs in the next content provision workflow.</div>'"
>pending</span></ng-template>
</div>
<div *ngIf="!loading">
<div *ngIf="claims && claims.length == 0" class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-bottom uk-text-bold">
<div>No links found</div>
</div>
<ul class="uk-margin-small-top uk-list uk-list-xlarge">
<li *ngFor="let claim of claims; let i=index" class="uk-card uk-card-default">
<div class="uk-card-body">
<div class="uk-grid" uk-grid>
<div class="uk-width-expand">
<div class="uk-margin-bottom">
<claim-entity [entity]="claim.target" [type]="claim.targetType" [properties]=properties
[externalPortalUrl]=externalPortalUrl [source]="true"></claim-entity>
</div>
<div class="uk-margin-bottom">
<span *ngIf="isClaimAvailable(claim) else notAvailable" class="uk-label uk-label-success"
[attr.uk-tooltip]="'title:<div class=\'uk-margin uk-padding-small\'>The link information is available in the portal and the APIs.</div>'"
>available
</span>
<ng-template #notAvailable><span class="uk-label uk-label-danger"
[attr.uk-tooltip]="'title:<div class=\'uk-margin uk-padding-small\'>The link information will be added in the portal and the APIs in the next content provision workflow.</div>'"
>pending</span></ng-template>
</div>
<div class="uk-margin-small-bottom uk-text-small"><span *ngIf="showUserEmail"
class="uk-margin-right"><span class="title">Claimed by:</span>
{{claim.userMail}}</span>
<span
class="title">Claimed date:</span> {{claim.date}}</div>
<div class="uk-text-small">
<!-- <span class="title">Link to:</span> -->
<claim-entity [entity]="claim.source" [type]="claim.sourceType" [source]="false" [properties]=properties
[externalPortalUrl]=externalPortalUrl></claim-entity>
<div class="uk-margin-small-bottom uk-text-small"><span *ngIf="showUserEmail"
class="uk-margin-right"><span class="title">Claimed by:</span>
{{claim.userMail}}</span>
<span
class="title">Claimed date:</span> {{claim.date}}</div>
<div class="uk-text-small">
<!-- <span class="title">Link to:</span> -->
<claim-entity [entity]="claim.source" [type]="claim.sourceType" [source]="false" [properties]=properties
[externalPortalUrl]=externalPortalUrl></claim-entity>
</div>
</div>
</div>
</div>
</div>
<div class="uk-card-footer uk-flex uk-flex-right">
<button class="uk-button uk-button-link" (click)="deleteOpen(i)">Delete</button>
</div>
</li>
</ul>
<div class="uk-margin-medium-top uk-flex uk-flex-center uk-flex-right@m">
<paging-no-load *ngIf="resultsNum" [currentPage]="page" [totalResults]="resultsNum" [size]="size"
(pageChange)="pageChange($event)"></paging-no-load>
<div class="uk-card-footer uk-flex uk-flex-right">
<button class="uk-button uk-button-link" (click)="deleteOpen(i)">Delete</button>
</div>
</li>
</ul>
<div class="uk-margin-medium-top uk-flex uk-flex-center uk-flex-right@m">
<paging-no-load *ngIf="resultsNum" [currentPage]="page" [totalResults]="resultsNum" [size]="size"
(pageChange)="pageChange($event)"></paging-no-load>
</div>
</div>
</div>
</div>

View File

@ -12,34 +12,39 @@
</div>
</div>
<div inner>
<div *ngIf="showLoading" class="uk-position-center">
<loading></loading>
</div>
<ng-container *ngIf="!showLoading">
<div class="uk-grid uk-flex-middle uk-margin-top" uk-grid>
<div class="uk-width-1-1">
<ul class="uk-subnav uk-subnav-pill">
<li [class.uk-active]="filterForm.get('type').value === 'all'" class="uk-margin-small-bottom"><a
(click)="filterForm.get('type').setValue('all')"><span
class="title">All portals</span></a></li>
<li *ngFor="let type of portalUtils.portalTypes; let i=index"
[class.uk-active]="filterForm.get('type').value === type.value" class="uk-margin-small-bottom"><a
(click)="filterForm.get('type').setValue(type.value)"><span
class="title">{{type.label}}</span></a></li>
</ul>
</div>
<div class="uk-width-1-1 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 class" class="uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1"></div>
<div>
<button class="uk-button uk-button-default uk-flex uk-flex-middle" (click)="newDivId()">
<icon name="add" [flex]="true"></icon>
<span class="uk-margin-small-left uk-text-bold uk-text-uppercase">Add class</span>
</button>
</div>
<div class="uk-grid uk-flex-middle uk-margin-top" uk-grid>
<div class="uk-width-1-1">
<ul class="uk-subnav uk-subnav-pill">
<li [class.uk-active]="filterForm.get('type').value === 'all'" class="uk-margin-small-bottom"><a
(click)="filterForm.get('type').setValue('all')"><span
class="title">All portals</span></a></li>
<li *ngFor="let type of portalUtils.portalTypes; let i=index"
[class.uk-active]="filterForm.get('type').value === type.value" class="uk-margin-small-bottom"><a
(click)="filterForm.get('type').setValue(type.value)"><span
class="title">{{type.label}}</span></a></li>
</ul>
</div>
<div class="uk-width-1-1 uk-flex uk-flex-right@m uk-flex-center uk-flex-wrap uk-flex-middle uk-grid" uk-grid>
<div search-input [disabled]="showLoading" [expandable]="true" [searchControl]="filterForm.get('keyword')" searchInputClass="outer" placeholder="Search class" class="uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1"></div>
<div>
<button class="uk-button uk-button-default uk-flex uk-flex-middle" (click)="newDivId()"
[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 class</span>
</button>
</div>
</div>
<div class="uk-section">
<table *ngIf="checkboxes.length > 0"class="uk-table uk-table-striped uk-table-large">
</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>
<ng-container *ngIf="!showLoading">
<div *ngIf="checkboxes.length == 0"
class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-bottom uk-text-bold">
<div>No classes found</div>
</div>
<table *ngIf="checkboxes.length > 0" class="uk-table uk-table-striped uk-table-large">
<thead>
<tr class="uk-child-width-1-5">
<th>
@ -86,18 +91,16 @@
</div>
</td>
<td>
<icon class="clickable" name="edit" [customClass]="'uk-text-primary'" (click)="editDivId(i)"></icon>
<icon class="clickable uk-margin-small-left" [customClass]="'uk-text-danger'" name="delete" (click)="confirmDeleteDivId(check.divId._id)"></icon>
<div class="uk-flex uk-flex-middle">
<icon class="clickable" [flex]="true" name="edit" [customClass]="'uk-text-primary'" (click)="editDivId(i)"></icon>
<icon class="clickable uk-margin-small-left" [flex]="true" [customClass]="'uk-text-danger'" name="delete" (click)="confirmDeleteDivId(check.divId._id)"></icon>
</div>
</td>
</tr>
</tbody>
</table>
<div *ngIf="checkboxes.length == 0"
class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-bottom uk-text-bold">
<div>No classes found</div>
</div>
</div>
</ng-container>
</ng-container>
</div>
</div>
</div>
<modal-alert #editModal (alertOutput)="divIdSaveConfirmed($event)"

View File

@ -1,6 +1,6 @@
<div page-content (stickyEmitter)="stickyPageHeader = $event">
<div header>
<div *ngIf="!showLoading" class="uk-flex uk-flex-middle uk-grid" uk-grid>
<div class="uk-flex uk-flex-middle uk-grid" uk-grid>
<div class="uk-width-expand uk-flex uk-flex-middle uk-margin-top uk-margin-bottom info"
[class.uk-active]="stickyPageHeader">
<a routerLink="../" [queryParams]=" { 'pageId': pageId }" class="uk-button uk-button-link uk-margin-right">
@ -10,28 +10,27 @@
<div class="uk-margin-remove uk-text-background uk-text-bold uk-h6">
Admin Dashboard - {{pageHelpContent ? 'Update ' : 'Add new '}} class help text
</div>
<h1 class="uk-h4 uk-margin-remove">{{page.name}}<span *ngIf="myForm.dirty" class="uk-text-large"> (unsaved changes)</span></h1>
<h1 *ngIf="page" class="uk-h4 uk-margin-remove">{{page.name}}<span *ngIf="myForm.dirty" class="uk-text-large"> (unsaved changes)</span></h1>
</div>
</div>
<div class="uk-width-auto uk-text-right@m uk-text-center">
<button class="uk-button uk-button-default uk-margin-right"
(click)="resetCustom()" [class.uk-disabled]="!myForm.dirty"
[disabled]="!myForm.dirty">Reset
[disabled]="!myForm.dirty || showLoading">Reset
</button>
<button class="uk-button uk-button-primary" [class.uk-disabled]="!myForm.dirty || myForm.disabled"
(click)="saveCustom()" [disabled]="!myForm.dirty || myForm.disabled">Save
(click)="saveCustom()" [disabled]="!myForm.dirty || myForm.disabled || showLoading">Save
</button>
</div>
</div>
</div>
<div inner>
<div *ngIf="myForm" class="uk-section uk-container uk-container-small">
<div *ngIf="errorMessage" class="uk-alert uk-alert-danger" role="alert">{{errorMessage}}</div>
<div *ngIf="updateErrorMessage" class="uk-alert uk-alert-danger" role="alert">{{updateErrorMessage}}</div>
<div *ngIf="myForm" style="min-height: 60vh"
class="uk-section uk-section-small uk-position-relative">
<div *ngIf="showLoading" class="uk-position-center">
<loading *ngIf="showLoading"></loading>
</div>
<form [formGroup]="myForm" [class.hidden]="showLoading">
<form *ngIf="!showLoading" [formGroup]="myForm" class="uk-container uk-container-small">
<div class="uk-width-1-2" *ngIf="classOptions.length > 0" input [formInput]="myForm.get('divId')" placeholder="Select Class" [options]="classOptions" type="select"></div>
<div class="form-group uk-margin-medium-top">
<span class="uk-text-bold uk-margin-small-right">Select Status (Enable/ disable)</span>
@ -57,7 +56,6 @@
extraPlugins: 'divarea'}">
</ckeditor>
</div>
</div>
<input type="hidden" formControlName="_id">
</form>

View File

@ -11,6 +11,7 @@ import {properties} from '../../../../environments/environment';
import {Subscriber, Subscription, zip} from 'rxjs';
import {HelperFunctions} from '../../utils/HelperFunctions.class';
import {DivHelpContent} from '../../utils/entities/adminTool/div-help-content';
import {NotificationHandler} from "../../utils/notification-handler";
declare var UIkit;
@ -28,8 +29,6 @@ export class ClassContentFormComponent implements OnInit {
classOptions = [];
public properties: EnvProperties = properties;
public showLoading: boolean = true;
public errorMessage: string = '';
@Input() updateErrorMessage: string = '';
private subs: Subscription[] = [];
public pageHelpContent: DivHelpContent;
public stickyPageHeader: boolean = false;
@ -133,44 +132,34 @@ export class ClassContentFormComponent implements OnInit {
this.myForm.markAsPristine();
}
handleError(message: string, error) {
this.errorMessage = message;
console.error('Server responded: ' + error);
handleError(message: string, error = null) {
if(error) {
console.error('Server responded: ' + error);
}
NotificationHandler.rise(message, 'danger');
this.showLoading = false;
}
public saveCustom() {
if (!Session.isLoggedIn()) {
this._router.navigate(['/user-info'], {
queryParams: {
"errorCode": LoginErrorCodes.NOT_VALID,
"redirectUrl": this._router.url
}
});
if (this.myForm.valid) {
this.showLoading = true;
this.myForm.get('divId').enable();
let pageHelpContent: DivHelpContent = this.myForm.value;
this.subs.push(this._helpContentService.insertOrUpdateDivHelpContent(pageHelpContent, this.properties.adminToolsAPIURL, this.portal).subscribe(
_ => {
this._router.navigate(['../'], {queryParams: {"pageId": this.pageId}, relativeTo: this.route});
UIkit.notification('Page content has been <b>successfully updated</b>', {
status: 'success',
timeout: 6000,
pos: 'bottom-right'
});
this.showLoading = false;
},
err => this.handleUpdateError('System error saving page content', err)
));
} else {
if (this.myForm.valid) {
this.showLoading = true;
this.updateErrorMessage = "";
this.myForm.get('divId').enable();
let pageHelpContent: DivHelpContent = this.myForm.value;
this.subs.push(this._helpContentService.insertOrUpdateDivHelpContent(pageHelpContent, this.properties.adminToolsAPIURL, this.portal).subscribe(
_ => {
this._router.navigate(['../'], {queryParams: {"pageId": this.pageId}, relativeTo: this.route});
UIkit.notification('Page content has been <b>successfully updated</b>', {
status: 'success',
timeout: 6000,
pos: 'bottom-right'
});
this.showLoading = false;
},
err => this.handleUpdateError('System error saving page content', err)
));
} else {
this.showLoading = false;
this.errorMessage = "Please fill all required fields";
}
this.showLoading = false;
this.handleError('Please fill all required fields');
}
}
@ -181,10 +170,8 @@ export class ClassContentFormComponent implements OnInit {
}
handleUpdateError(message: string, error) {
this.updateErrorMessage = message;
console.error('Server responded: ' + error);
NotificationHandler.rise(message, 'danger');
this.showLoading = false;
}

View File

@ -1,35 +1,39 @@
<div page-content (stickyEmitter)="stickyPageHeader = $event">
<div header>
<div *ngIf="!showLoading" class="uk-flex uk-flex-middle uk-margin-top info"
<div class="uk-flex uk-flex-middle uk-margin-top info"
[class.uk-active]="stickyPageHeader">
<a routerLink="../pages" class="uk-button uk-button-link uk-margin-right">
<icon name="west" ratio="2" [flex]="true"></icon>
</a>
<div>
<div class="uk-margin-remove uk-text-background uk-text-bold uk-h6">
Admin Dashboard <span *ngIf="selectedPageId && page"> - Manage class help texts</span>
Admin Dashboard - Manage class help texts
</div>
<h1 class="uk-h4 uk-margin-remove">{{page.name}}</h1>
<h1 *ngIf="page" class="uk-h4 uk-margin-remove">{{page.name}}</h1>
</div>
</div>
</div>
<div inner>
<div *ngIf="showLoading" class="uk-position-center">
<loading></loading>
</div>
<div *ngIf="!showLoading">
<div class="uk-margin-top uk-margin-medium-bottom uk-flex-right@m uk-flex-center uk-flex-middle uk-grid" uk-grid>
<div search-input [expandable]="true" [searchControl]="filterForm" searchInputClass="outer" placeholder="Search helptext" class="uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1">
</div>
<div>
<a (click)="newPageContent()"
class="uk-flex uk-flex-middle uk-button uk-button-default">
<icon [flex]="true" name="add"></icon>
<span class="uk-margin-small-left">Add class help text</span>
</a>
</div>
<div class="uk-margin-top uk-margin-medium-bottom uk-flex-right@m uk-flex-center uk-flex-middle uk-grid" uk-grid>
<div search-input [disabled]="showLoading" [expandable]="true" [searchControl]="filterForm" searchInputClass="outer" placeholder="Search helptext" class="uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1">
</div>
<div class="uk-section">
<div>
<button (click)="newPageContent()" [disabled]="showLoading" [class.uk-disabled]="showLoading"
class="uk-flex uk-flex-middle uk-button uk-button-default">
<icon [flex]="true" name="add"></icon>
<span class="uk-margin-small-left">Add class help text</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>
<ng-container *ngIf="!showLoading">
<div *ngIf="checkboxes.length == 0"
class="uk-card uk-card-default uk-padding-large uk-text-center uk-text-bold">
<div>No class help texts found</div>
</div>
<div *ngIf="checkboxes.length > 0">
<div class="uk-grid uk-child-width-1-2@l uk-child-width-1-1" uk-height-match=".uk-card-body" uk-grid>
<div *ngFor="let check of checkboxes; let i=index">
@ -77,11 +81,7 @@
</div>
</div>
</div>
<div *ngIf="checkboxes.length == 0"
class="uk-card uk-card-default uk-padding-large uk-text-center uk-text-bold">
<div>No class help texts found</div>
</div>
</div>
</ng-container>
</div>
</div>
</div>

View File

@ -14,34 +14,39 @@
</div>
</div>
<div inner>
<div *ngIf="showLoading" class="uk-position-center">
<loading></loading>
</div>
<div *ngIf="!showLoading">
<div class="uk-grid uk-flex-middle uk-margin-top" uk-grid>
<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 class="uk-width-1-1 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 entity"
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)="newEntity()">
<icon name="add" [flex]="true"></icon>
<span class="uk-margin-small-left uk-text-bold uk-text-uppercase">Add entity</span>
</button>
</div>
<div class="uk-grid uk-flex-middle uk-margin-top" uk-grid>
<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 class="uk-width-1-1 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 entity"
[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)="newEntity()"
[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 entity</span>
</button>
</div>
</div>
<div class="uk-section">
</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>
<ng-container *ngIf="!showLoading">
<div *ngIf="checkboxes.length == 0"
class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-top uk-margin-bottom uk-text-bold">
<div>No entities found</div>
</div>
<table *ngIf="checkboxes.length > 0 " class="uk-table uk-table-striped uk-table-large">
<thead>
<tr class="uk-child-width-1-3">
@ -86,18 +91,16 @@
></mat-slide-toggle>
</td>
<td *ngIf="isPortalAdministrator">
<icon class="clickable" name="edit" [customClass]="'uk-text-primary'" (click)="editEntity(i)"></icon>
<icon class="clickable uk-margin-small-left" [customClass]="'uk-text-danger'" name="delete" (click)="confirmDeleteEntity(check.entity._id)"></icon>
<div class="uk-flex uk-flex-middle">
<icon class="clickable" [flex]="true" name="edit" [customClass]="'uk-text-primary'" (click)="editEntity(i)"></icon>
<icon class="clickable uk-margin-small-left" [flex]="true" [customClass]="'uk-text-danger'" name="delete" (click)="confirmDeleteEntity(check.entity._id)"></icon>
</div>
</td>
</tr>
</tbody>
</table>
<div *ngIf="checkboxes.length == 0"
class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-top uk-margin-bottom uk-text-bold">
<div>No entities found</div>
</div>
</div>
</div>
</ng-container>
</div>
</div>
</div>
<modal-alert #editModal (alertOutput)="entitySaveConfirmed($event)"

View File

@ -1,6 +1,6 @@
<div page-content (stickyEmitter)="stickyPageHeader = $event">
<div header>
<div *ngIf="!showLoading" class="uk-flex uk-flex-middle uk-grid" uk-grid>
<div class="uk-flex uk-flex-middle uk-grid" uk-grid>
<div class="uk-width-expand uk-flex uk-flex-middle uk-margin-top uk-margin-bottom info"
[class.uk-active]="stickyPageHeader">
<a routerLink="../" [queryParams]=" { 'pageId': pageId }" class="uk-button uk-button-link uk-margin-right">
@ -10,26 +10,27 @@
<div class="uk-margin-remove uk-text-background uk-text-bold uk-h6">
Admin Dashboard - {{pageHelpContent ? 'Update ' : 'Add new '}} page help text
</div>
<h1 class="uk-h4 uk-margin-remove">{{page.name}}<span *ngIf="myForm.dirty" class="uk-text-large"> (unsaved changes)</span></h1>
<h1 *ngIf="page" class="uk-h4 uk-margin-remove">{{page.name}}<span *ngIf="myForm.dirty" class="uk-text-large"> (unsaved changes)</span></h1>
</div>
</div>
<div class="uk-width-auto uk-text-right@m uk-text-center">
<button class="uk-button uk-button-default uk-margin-right"
(click)="resetCustom()" [class.uk-disabled]="!myForm.dirty"
[disabled]="!myForm.dirty">Reset
[disabled]="!myForm.dirty || showLoading">Reset
</button>
<button class="uk-button uk-button-primary" [class.uk-disabled]="!myForm.dirty || myForm.disabled"
(click)="saveCustom()" [disabled]="!myForm.dirty || myForm.disabled">Save
(click)="saveCustom()" [disabled]="!myForm.dirty || myForm.disabled || showLoading">Save
</button>
</div>
</div>
</div>
<div inner>
<div *ngIf="myForm" class="uk-section uk-container uk-container-small">
<div *ngIf="myForm" style="min-height: 60vh"
class="uk-section uk-section-small uk-position-relative">
<div *ngIf="showLoading" class="uk-position-center">
<loading *ngIf="showLoading"></loading>
</div>
<form [formGroup]="myForm" [class.hidden]="showLoading">
<form *ngIf="!showLoading" [formGroup]="myForm" class="uk-container uk-container-small">
<div class="uk-grid uk-child-width-1-2">
<div *ngIf="placementsOptions.length > 0" input [formInput]="myForm.get('placement')"
placeholder="Select placement" [options]="placementsOptions" type="select"></div>

View File

@ -67,16 +67,10 @@ export class PageContentFormComponent implements OnInit {
this._router.navigate(['../'], {relativeTo: this.route});
}
let countPageContents = results[1] ? results[1].length : 0;
console.log(results[1]);
for (let content of (results[1] as Array<PageHelpContent>)) {
// if(content.page['_id'] == pageId){
// countPageContents++;
if (this.pageContentId && this.pageContentId == content._id) {
this.pageHelpContent = content;
// this.pageHelpContent.page = pageId;
// this.pageHelpContent.portal = this.communityPid;
}
// }
}
this.setOptions(this.page, countPageContents + (this.pageHelpContent ? 0 : 1));
if (!this.pageContentId) {

View File

@ -1,35 +1,39 @@
<div page-content (stickyEmitter)="stickyPageHeader = $event">
<div header>
<div *ngIf="!showLoading" class="uk-flex uk-flex-middle uk-margin-top info"
<div class="uk-flex uk-flex-middle uk-margin-top info"
[class.uk-active]="stickyPageHeader">
<a routerLink="../pages" class="uk-button uk-button-link uk-margin-right">
<icon name="west" ratio="2" [flex]="true"></icon>
</a>
<div>
<div class="uk-margin-remove uk-text-background uk-text-bold uk-h6">
Admin Dashboard <span *ngIf="selectedPageId && page"> - Manage page help texts</span>
Admin Dashboard - Manage page help texts
</div>
<h1 class="uk-h4 uk-margin-remove">{{page.name}}</h1>
<h1 *ngIf="page" class="uk-h4 uk-margin-remove">{{page.name}}</h1>
</div>
</div>
</div>
<div inner>
<div *ngIf="showLoading" class="uk-position-center">
<loading></loading>
</div>
<div *ngIf="!showLoading">
<div class="uk-margin-top uk-margin-medium-bottom uk-flex-right@m uk-flex-center uk-flex-middle uk-grid" uk-grid>
<div search-input [expandable]="true" [searchControl]="filterForm" searchInputClass="outer" placeholder="Search helptext" class="uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1">
</div>
<div>
<a (click)="newPageContent()"
class="uk-flex uk-flex-middle uk-button uk-button-default">
<icon [flex]="true" name="add"></icon>
<span class="uk-margin-small-left">Add page help text</span>
</a>
</div>
<div class="uk-margin-top uk-margin-medium-bottom uk-flex-right@m uk-flex-center uk-flex-middle uk-grid" uk-grid>
<div search-input [disabled]="showLoading" [expandable]="true" [searchControl]="filterForm" searchInputClass="outer" placeholder="Search helptext" class="uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1">
</div>
<div class="uk-section">
<div>
<button (click)="newPageContent()" [disabled]="showLoading" [class.uk-disabled]="showLoading"
class="uk-flex uk-flex-middle uk-button uk-button-default">
<icon [flex]="true" name="add"></icon>
<span class="uk-margin-small-left">Add page help text</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>
<ng-container *ngIf="!showLoading">
<div *ngIf="checkboxes.length == 0"
class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-bottom uk-text-bold">
<div>No page help texts found</div>
</div>
<div *ngIf="checkboxes.length > 0">
<div class="uk-grid uk-child-width-1-2@l uk-child-width-1-1" uk-height-match=".uk-card-body" uk-grid>
<div *ngFor="let check of checkboxes; let i=index">
@ -80,11 +84,7 @@
</div>
</div>
</div>
<div *ngIf="checkboxes.length == 0"
class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-bottom uk-text-bold">
<div>No page help texts found</div>
</div>
</div>
</ng-container>
</div>
</div>
</div>

View File

@ -14,11 +14,7 @@
</div>
</div>
<div inner>
<div *ngIf="showLoading" class="uk-position-center">
<loading></loading>
</div>
<div *ngIf="!showLoading">
<div class="uk-grid uk-flex-middle uk-margin-top" uk-grid>
<div class="uk-grid uk-flex-middle uk-margin-top" uk-grid>
<div class="uk-width-1-1">
<ul class="uk-subnav uk-subnav-pill">
<li [class.uk-active]="filterForm.get('type').value === 'all'"><a
@ -30,18 +26,23 @@
</div>
<div class="uk-width-1-1 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"
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()">
<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 class="uk-section">
<div *ngIf="checkboxes.length > 0 && !portal" class="uk-padding uk-padding-remove-top uk-flex uk-flex-middle">
<div class="uk-section uk-section-small uk-position-relative" style="min-height: 60vh">
<div *ngIf="showLoading" class="uk-position-center">
<loading></loading>
</div>
<ng-container *ngIf="!showLoading">
<div *ngIf="checkboxes.length > 0 && !portal" class="uk-flex uk-flex-middle uk-padding uk-padding-remove-top">
<label>
<input id="checkAll" type="checkbox" (click)="selectAll()" class="uk-checkbox"
[ngModel]="getSelectedPages().length ==checkboxes.length"/>
@ -64,6 +65,10 @@
</div>
</div>
</div>
<div *ngIf="checkboxes.length == 0"
class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-top uk-margin-bottom uk-text-bold">
<div>No pages found</div>
</div>
<div *ngIf="checkboxes.length > 0" class="uk-grid uk-child-width-1-1" uk-height-match=".uk-card-body" uk-grid>
<div *ngFor="let check of checkboxes; let i=index">
<div class="uk-card uk-card-default">
@ -153,11 +158,7 @@
</div>
</div>
</div>
<div *ngIf="checkboxes.length == 0"
class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-top uk-margin-bottom uk-text-bold">
<div>No pages found</div>
</div>
</div>
</ng-container>
</div>
</div>
</div>
@ -175,7 +176,7 @@
<div input placeholder="Choose a type" [formInput]="pageForm.get('portalType')"
type="select" [options]="portalUtils.portalTypes"></div>
<div>
<div class="uk-form-label uk-text-bold uk-margin-bottom">Select if this page have helptext at:</div>
<div class="uk-text-bold uk-margin-small-bottom">Select if this page have helptext at:</div>
<div class="uk-grid uk-grid-small uk-child-width-1-4" uk-grid>
<div>
<label>

View File

@ -12,34 +12,39 @@
</div>
</div>
<div inner>
<div *ngIf="showLoading" class="uk-position-center">
<loading></loading>
</div>
<ng-container *ngIf="!showLoading">
<div class="uk-grid uk-flex-middle uk-margin-top" uk-grid>
<div class="uk-width-1-1">
<ul class="uk-subnav uk-subnav-pill">
<li [class.uk-active]="filterForm.get('type').value === 'all'" class="uk-margin-small-bottom"><a
(click)="filterForm.get('type').setValue('all')"><span
class="title">All portals</span></a></li>
<li *ngFor="let type of portalUtils.portalTypes; let i=index"
[class.uk-active]="filterForm.get('type').value === type.value" class="uk-margin-small-bottom"><a
(click)="filterForm.get('type').setValue(type.value)"><span
class="title">{{type.label}}</span></a></li>
</ul>
</div>
<div class="uk-width-1-1 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 portal"
[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>
<button class="uk-button uk-button-default uk-flex uk-flex-middle" (click)="newPortal()">
<icon name="add" [flex]="true"></icon>
<span class="uk-margin-small-left uk-text-bold uk-text-uppercase">Add portal</span>
</button>
</div>
<div class="uk-grid uk-flex-middle uk-margin-top" uk-grid>
<div class="uk-width-1-1">
<ul class="uk-subnav uk-subnav-pill">
<li [class.uk-active]="filterForm.get('type').value === 'all'" class="uk-margin-small-bottom"><a
(click)="filterForm.get('type').setValue('all')"><span
class="title">All portals</span></a></li>
<li *ngFor="let type of portalUtils.portalTypes; let i=index"
[class.uk-active]="filterForm.get('type').value === type.value" class="uk-margin-small-bottom"><a
(click)="filterForm.get('type').setValue(type.value)"><span
class="title">{{type.label}}</span></a></li>
</ul>
</div>
<div class="uk-width-1-1 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 portal"
[disabled]="showLoading" 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>
<button class="uk-button uk-button-default uk-flex uk-flex-middle" (click)="newPortal()"
[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 portal</span>
</button>
</div>
</div>
<div class="uk-section">
</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>
<ng-container *ngIf="!showLoading">
<div *ngIf="checkboxes.length == 0"
class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-bottom uk-text-bold">
<div>No portals found</div>
</div>
<table *ngIf="checkboxes.length > 0" class="uk-table uk-table-striped">
<thead>
<tr class="uk-child-width-1-4">
@ -80,21 +85,17 @@
<div class="type" href="#">{{check.portal.type}}</div>
</td>
<td>
<div class="actions" href="#">
<icon class="clickable" name="edit" [customClass]="'uk-text-primary'" (click)="editPortal(i)"></icon>
<icon class="clickable uk-margin-small-left" [customClass]="'uk-text-danger'" name="delete" (click)="confirmDeletePortal(check.portal._id)"></icon>
<div class="uk-flex uk-flex-middle">
<icon class="clickable" [flex]="true" name="edit" [customClass]="'uk-text-primary'" (click)="editPortal(i)"></icon>
<icon class="clickable uk-margin-small-left" [flex]="true" [customClass]="'uk-text-danger'" name="delete" (click)="confirmDeletePortal(check.portal._id)"></icon>
</div>
</td>
</tr>
</tbody>
</table>
<div *ngIf="checkboxes.length == 0"
class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-bottom uk-text-bold">
<div>No portals found</div>
</div>
</div>
</ng-container>
</ng-container>
</div>
</div>
</div>
<modal-alert #editModal (alertOutput)="portalSaveConfirmed($event)"

View File

@ -36,7 +36,7 @@
</div>
</div>
</div>
<div class="uk-section uk-section-small">
<div class="uk-section uk-section-small uk-position-relative" style="min-height: 60vh">
<div *ngIf="loadActive || loadPending" class="uk-position-center">
<loading></loading>
</div>
@ -73,6 +73,16 @@
</div>
</div>
</div>
<div class="uk-margin-small-top">
<paging-no-load *ngIf="showCurrent" [currentPage]="activePage"
[totalResults]="showActive.length" [size]="pageSize"
(pageChange)="updateActivePage($event)" customClasses="uk-flex-right@m uk-flex-center">
</paging-no-load>
<paging-no-load *ngIf="!showCurrent" [currentPage]="pendingPage"
[totalResults]="showPending.length" [size]="pageSize"
(pageChange)="updatePendingPage($event)" customClasses="uk-flex-right@m uk-flex-center">
</paging-no-load>
</div>
</div>
</div>
</div>

View File

@ -11,9 +11,10 @@ import {SafeHtmlPipeModule} from "../../../utils/pipes/safeHTMLPipe.module";
import {NotifyFormModule} from "../../../notifications/notify-form/notify-form.module";
import {NoLoadPaging} from "../../../searchPages/searchUtils/no-load-paging.module";
import {SearchInputModule} from "../../../sharedComponents/search-input/search-input.module";
import {PagingModule} from "../../../utils/paging.module";
@NgModule({
imports: [CommonModule, AlertModalModule, ReactiveFormsModule, LoadingModule, IconsModule, InputModule, PageContentModule, SafeHtmlPipeModule, NotifyFormModule, NoLoadPaging, SearchInputModule],
imports: [CommonModule, AlertModalModule, ReactiveFormsModule, LoadingModule, IconsModule, InputModule, PageContentModule, SafeHtmlPipeModule, NotifyFormModule, NoLoadPaging, SearchInputModule, PagingModule],
declarations: [RoleUsersComponent],
exports: [RoleUsersComponent]
})

View File

@ -22,41 +22,43 @@
</button>
</div>
</div>
<div *ngIf="loading" class="uk-position-center">
<loading></loading>
</div>
<div *ngIf="!loading" class="uk-section uk-section-small">
<div *ngIf="showSubscribers.length == 0"
class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-bottom uk-text-bold">
<div>No members found</div>
<div class="uk-section uk-section-small uk-position-relative" style="min-height: 60vh">
<div *ngIf="loading" class="uk-position-center">
<loading></loading>
</div>
<div *ngIf="showSubscribers.length > 0">
<no-load-paging [type]="(subscribers.length > 1)?'members':'member'"
(pageChange)="updatePage($event)"
[page]="page" [pageSize]="pageSize"
[totalResults]="showSubscribers.length">
</no-load-paging>
<div class="uk-grid uk-grid-large uk-child-width-1-1@s uk-child-width-1-2@m uk-margin-top uk-margin-bottom" uk-grid>
<div *ngFor="let item of currentPage">
<div class="uk-card uk-card-default">
<div class="uk-card-body">
<span class="uk-text-bold uk-text-large">{{item.email}}</span>
</div>
<div class="uk-card-footer uk-flex uk-flex-right">
<button (click)="openDeleteModal(item)" class="uk-button uk-button-link uk-flex uk-flex-middle"
[disabled]="item.isManager" [attr.uk-tooltip]="item.isManager?'This user is a manager and cannot be removed.':null">
<icon name="delete" [flex]="true" type="filled"></icon>
<span class="uk-margin-small-left uk-text-bold uk-text-uppercase">{{'Delete'}}</span>
</button>
<div *ngIf="!loading">
<div *ngIf="showSubscribers.length == 0"
class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-bottom uk-text-bold">
<div>No members found</div>
</div>
<div *ngIf="showSubscribers.length > 0">
<no-load-paging [type]="(subscribers.length > 1)?'members':'member'"
(pageChange)="updatePage($event)"
[page]="page" [pageSize]="pageSize"
[totalResults]="showSubscribers.length">
</no-load-paging>
<div class="uk-grid uk-grid-large uk-child-width-1-1@s uk-child-width-1-2@m uk-margin-top uk-margin-bottom" uk-grid>
<div *ngFor="let item of currentPage">
<div class="uk-card uk-card-default">
<div class="uk-card-body">
<span class="uk-text-bold uk-text-large">{{item.email}}</span>
</div>
<div class="uk-card-footer uk-flex uk-flex-right">
<button (click)="openDeleteModal(item)" class="uk-button uk-button-link uk-flex uk-flex-middle"
[disabled]="item.isManager" [attr.uk-tooltip]="item.isManager?'This user is a manager and cannot be removed.':null">
<icon name="delete" [flex]="true" type="filled"></icon>
<span class="uk-margin-small-left uk-text-bold uk-text-uppercase">{{'Delete'}}</span>
</button>
</div>
</div>
</div>
</div>
</div>
<div class="uk-flex uk-flex-right uk-margin-small-top">
<paging-no-load [currentPage]="page"
[totalResults]="subscribers.length" [size]="pageSize"
(pageChange)="updatePage($event)">
</paging-no-load>
<div class="uk-margin-small-top">
<paging-no-load [currentPage]="page" customClasses="uk-flex-right@m uk-flex-center"
[totalResults]="subscribers.length" [size]="pageSize"
(pageChange)="updatePage($event)">
</paging-no-load>
</div>
</div>
</div>
</div>