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

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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

86
claims/claim-utils/displayClaims/displayClaims.component.html
View File

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

71
dashboard/divId/divIds.component.html
View File

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

16
dashboard/divhelpcontent/class-help-content-form.component.html
View File

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

63
dashboard/divhelpcontent/class-help-content-form.component.ts
View File

@ -11,6 +11,7 @@ import {properties} from '../../../../environments/environment';
import {Subscriber, Subscription, zip} from 'rxjs'; import {Subscriber, Subscription, zip} from 'rxjs';
import {HelperFunctions} from '../../utils/HelperFunctions.class'; import {HelperFunctions} from '../../utils/HelperFunctions.class';
import {DivHelpContent} from '../../utils/entities/adminTool/div-help-content'; import {DivHelpContent} from '../../utils/entities/adminTool/div-help-content';
import {NotificationHandler} from "../../utils/notification-handler";
declare var UIkit; declare var UIkit;
@ -28,8 +29,6 @@ export class ClassContentFormComponent implements OnInit {
classOptions = []; classOptions = [];
public properties: EnvProperties = properties; public properties: EnvProperties = properties;
public showLoading: boolean = true; public showLoading: boolean = true;
public errorMessage: string = '';
@Input() updateErrorMessage: string = '';
private subs: Subscription[] = []; private subs: Subscription[] = [];
public pageHelpContent: DivHelpContent; public pageHelpContent: DivHelpContent;
public stickyPageHeader: boolean = false; public stickyPageHeader: boolean = false;
@ -133,44 +132,34 @@ export class ClassContentFormComponent implements OnInit {
this.myForm.markAsPristine(); this.myForm.markAsPristine();
} }
handleError(message: string, error) { handleError(message: string, error = null) {
this.errorMessage = message; if(error) {
console.error('Server responded: ' + error); console.error('Server responded: ' + error);
}
NotificationHandler.rise(message, 'danger');
this.showLoading = false; this.showLoading = false;
} }
public saveCustom() { public saveCustom() {
if (!Session.isLoggedIn()) { if (this.myForm.valid) {
this._router.navigate(['/user-info'], { this.showLoading = true;
queryParams: { this.myForm.get('divId').enable();
"errorCode": LoginErrorCodes.NOT_VALID, let pageHelpContent: DivHelpContent = this.myForm.value;
"redirectUrl": this._router.url 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 { } else {
this.showLoading = false;
if (this.myForm.valid) { this.handleError('Please fill all required fields');
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";
}
} }
} }
@ -181,10 +170,8 @@ export class ClassContentFormComponent implements OnInit {
} }
handleUpdateError(message: string, error) { handleUpdateError(message: string, error) {
this.updateErrorMessage = message;
console.error('Server responded: ' + error); console.error('Server responded: ' + error);
NotificationHandler.rise(message, 'danger');
this.showLoading = false; this.showLoading = false;
} }

46
dashboard/divhelpcontent/class-help-contents.component.html
View File

@ -1,35 +1,39 @@
<div page-content (stickyEmitter)="stickyPageHeader = $event"> <div page-content (stickyEmitter)="stickyPageHeader = $event">
<div header> <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"> [class.uk-active]="stickyPageHeader">
<a routerLink="../pages" class="uk-button uk-button-link uk-margin-right"> <a routerLink="../pages" class="uk-button uk-button-link uk-margin-right">
<icon name="west" ratio="2" [flex]="true"></icon> <icon name="west" ratio="2" [flex]="true"></icon>
</a> </a>
<div> <div>
<div class="uk-margin-remove uk-text-background uk-text-bold uk-h6"> <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> </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>
</div> </div>
<div inner> <div inner>
<div *ngIf="showLoading" class="uk-position-center"> <div class="uk-margin-top uk-margin-medium-bottom uk-flex-right@m uk-flex-center uk-flex-middle uk-grid" uk-grid>
<loading></loading> <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 *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> </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 *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 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"> <div *ngFor="let check of checkboxes; let i=index">
@ -77,11 +81,7 @@
</div> </div>
</div> </div>
</div> </div>
<div *ngIf="checkboxes.length == 0" </ng-container>
class="uk-card uk-card-default uk-padding-large uk-text-center uk-text-bold">
<div>No class help texts found</div>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>

71
dashboard/entity/entities.component.html
View File

@ -14,34 +14,39 @@
</div> </div>
</div> </div>
<div inner> <div inner>
<div *ngIf="showLoading" class="uk-position-center"> <div class="uk-grid uk-flex-middle uk-margin-top" uk-grid>
<loading></loading> <div class="uk-width-1-1">
</div> <ul *ngIf="!isPortalAdministrator" class="uk-subnav uk-subnav-pill">
<div *ngIf="!showLoading"> <li [class.uk-active]="filterForm.get('status').value === 'all'"><a
<div class="uk-grid uk-flex-middle uk-margin-top" uk-grid> (click)="filterForm.get('status').setValue('all')"><span
<div class="uk-width-1-1"> class="title">All entities</span></a></li>
<ul *ngIf="!isPortalAdministrator" class="uk-subnav uk-subnav-pill"> <li [class.uk-active]="filterForm.get('status').value === 'enabled'"><a
<li [class.uk-active]="filterForm.get('status').value === 'all'"><a (click)="filterForm.get('status').setValue('enabled')"><span class="title">Enabled</span></a></li>
(click)="filterForm.get('status').setValue('all')"><span <li [class.uk-active]="filterForm.get('status').value === 'disabled'"><a
class="title">All entities</span></a></li> (click)="filterForm.get('status').setValue('disabled')"><span class="title">Disabled</span></a></li>
<li [class.uk-active]="filterForm.get('status').value === 'enabled'"><a </ul>
(click)="filterForm.get('status').setValue('enabled')"><span class="title">Enabled</span></a></li> </div>
<li [class.uk-active]="filterForm.get('status').value === 'disabled'"><a <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>
(click)="filterForm.get('status').setValue('disabled')"><span class="title">Disabled</span></a></li> <div search-input [expandable]="true" [searchControl]="filterForm.get('keyword')" searchInputClass="outer" placeholder="Search entity"
</ul> [disabled]="showLoading" class="uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1"></div>
</div> <div *ngIf="isPortalAdministrator">
<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> <button class="uk-button uk-button-default uk-flex uk-flex-middle" (click)="newEntity()"
<div search-input [expandable]="true" [searchControl]="filterForm.get('keyword')" searchInputClass="outer" placeholder="Search entity" [disabled]="showLoading" [class.uk-disabled]="showLoading">
class="uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1"></div> <icon name="add" [flex]="true"></icon>
<div *ngIf="isPortalAdministrator"> <span class="uk-margin-small-left uk-text-bold uk-text-uppercase">Add entity</span>
<button class="uk-button uk-button-default uk-flex uk-flex-middle" (click)="newEntity()"> </button>
<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>
</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"> <table *ngIf="checkboxes.length > 0 " class="uk-table uk-table-striped uk-table-large">
<thead> <thead>
<tr class="uk-child-width-1-3"> <tr class="uk-child-width-1-3">
@ -86,18 +91,16 @@
></mat-slide-toggle> ></mat-slide-toggle>
</td> </td>
<td *ngIf="isPortalAdministrator"> <td *ngIf="isPortalAdministrator">
<icon class="clickable" name="edit" [customClass]="'uk-text-primary'" (click)="editEntity(i)"></icon> <div class="uk-flex uk-flex-middle">
<icon class="clickable uk-margin-small-left" [customClass]="'uk-text-danger'" name="delete" (click)="confirmDeleteEntity(check.entity._id)"></icon> <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> </td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
<div *ngIf="checkboxes.length == 0" </ng-container>
class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-top uk-margin-bottom uk-text-bold"> </div>
<div>No entities found</div>
</div>
</div>
</div>
</div> </div>
</div> </div>
<modal-alert #editModal (alertOutput)="entitySaveConfirmed($event)" <modal-alert #editModal (alertOutput)="entitySaveConfirmed($event)"

13
dashboard/helpTexts/page-help-content-form.component.html
View File

@ -1,6 +1,6 @@
<div page-content (stickyEmitter)="stickyPageHeader = $event"> <div page-content (stickyEmitter)="stickyPageHeader = $event">
<div header> <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" <div class="uk-width-expand uk-flex uk-flex-middle uk-margin-top uk-margin-bottom info"
[class.uk-active]="stickyPageHeader"> [class.uk-active]="stickyPageHeader">
<a routerLink="../" [queryParams]=" { 'pageId': pageId }" class="uk-button uk-button-link uk-margin-right"> <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"> <div class="uk-margin-remove uk-text-background uk-text-bold uk-h6">
Admin Dashboard - {{pageHelpContent ? 'Update ' : 'Add new '}} page help text Admin Dashboard - {{pageHelpContent ? 'Update ' : 'Add new '}} page help text
</div> </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> </div>
<div class="uk-width-auto uk-text-right@m uk-text-center"> <div class="uk-width-auto uk-text-right@m uk-text-center">
<button class="uk-button uk-button-default uk-margin-right" <button class="uk-button uk-button-default uk-margin-right"
(click)="resetCustom()" [class.uk-disabled]="!myForm.dirty" (click)="resetCustom()" [class.uk-disabled]="!myForm.dirty"
[disabled]="!myForm.dirty">Reset [disabled]="!myForm.dirty || showLoading">Reset
</button> </button>
<button class="uk-button uk-button-primary" [class.uk-disabled]="!myForm.dirty || myForm.disabled" <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> </button>
</div> </div>
</div> </div>
</div> </div>
<div inner> <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"> <div *ngIf="showLoading" class="uk-position-center">
<loading *ngIf="showLoading"></loading> <loading *ngIf="showLoading"></loading>
</div> </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 class="uk-grid uk-child-width-1-2">
<div *ngIf="placementsOptions.length > 0" input [formInput]="myForm.get('placement')" <div *ngIf="placementsOptions.length > 0" input [formInput]="myForm.get('placement')"
placeholder="Select placement" [options]="placementsOptions" type="select"></div> placeholder="Select placement" [options]="placementsOptions" type="select"></div>

6
dashboard/helpTexts/page-help-content-form.component.ts
View File

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

46
dashboard/helpTexts/page-help-contents.component.html
View File

@ -1,35 +1,39 @@
<div page-content (stickyEmitter)="stickyPageHeader = $event"> <div page-content (stickyEmitter)="stickyPageHeader = $event">
<div header> <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"> [class.uk-active]="stickyPageHeader">
<a routerLink="../pages" class="uk-button uk-button-link uk-margin-right"> <a routerLink="../pages" class="uk-button uk-button-link uk-margin-right">
<icon name="west" ratio="2" [flex]="true"></icon> <icon name="west" ratio="2" [flex]="true"></icon>
</a> </a>
<div> <div>
<div class="uk-margin-remove uk-text-background uk-text-bold uk-h6"> <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> </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>
</div> </div>
<div inner> <div inner>
<div *ngIf="showLoading" class="uk-position-center"> <div class="uk-margin-top uk-margin-medium-bottom uk-flex-right@m uk-flex-center uk-flex-middle uk-grid" uk-grid>
<loading></loading> <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 *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> </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 *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 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"> <div *ngFor="let check of checkboxes; let i=index">
@ -80,11 +84,7 @@
</div> </div>
</div> </div>
</div> </div>
<div *ngIf="checkboxes.length == 0" </ng-container>
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>
</div> </div>
</div> </div>
</div> </div>

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

@ -14,11 +14,7 @@
</div> </div>
</div> </div>
<div inner> <div inner>
<div *ngIf="showLoading" class="uk-position-center"> <div class="uk-grid uk-flex-middle uk-margin-top" uk-grid>
<loading></loading>
</div>
<div *ngIf="!showLoading">
<div class="uk-grid uk-flex-middle uk-margin-top" uk-grid>
<div class="uk-width-1-1"> <div class="uk-width-1-1">
<ul class="uk-subnav uk-subnav-pill"> <ul class="uk-subnav uk-subnav-pill">
<li [class.uk-active]="filterForm.get('type').value === 'all'"><a <li [class.uk-active]="filterForm.get('type').value === 'all'"><a
@ -30,18 +26,23 @@
</div> </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 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" <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> class="uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1"></div>
<div *ngIf="isPortalAdministrator"> <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> <icon name="add" [flex]="true"></icon>
<span class="uk-margin-small-left uk-text-bold uk-text-uppercase">Add page</span> <span class="uk-margin-small-left uk-text-bold uk-text-uppercase">Add page</span>
</button> </button>
</div> </div>
</div> </div>
</div> </div>
<div class="uk-section"> <div class="uk-section uk-section-small uk-position-relative" style="min-height: 60vh">
<div *ngIf="checkboxes.length > 0 && !portal" class="uk-padding uk-padding-remove-top uk-flex uk-flex-middle"> <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> <label>
<input id="checkAll" type="checkbox" (click)="selectAll()" class="uk-checkbox" <input id="checkAll" type="checkbox" (click)="selectAll()" class="uk-checkbox"
[ngModel]="getSelectedPages().length ==checkboxes.length"/> [ngModel]="getSelectedPages().length ==checkboxes.length"/>
@ -64,6 +65,10 @@
</div> </div>
</div> </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 *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 *ngFor="let check of checkboxes; let i=index">
<div class="uk-card uk-card-default"> <div class="uk-card uk-card-default">
@ -153,11 +158,7 @@
</div> </div>
</div> </div>
</div> </div>
<div *ngIf="checkboxes.length == 0" </ng-container>
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>
</div> </div>
</div> </div>
</div> </div>
@ -175,7 +176,7 @@
<div input placeholder="Choose a type" [formInput]="pageForm.get('portalType')" <div input placeholder="Choose a type" [formInput]="pageForm.get('portalType')"
type="select" [options]="portalUtils.portalTypes"></div> type="select" [options]="portalUtils.portalTypes"></div>
<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 class="uk-grid uk-grid-small uk-child-width-1-4" uk-grid>
<div> <div>
<label> <label>

71
dashboard/portal/portals.component.html
View File

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

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

@ -36,7 +36,7 @@
</div> </div>
</div> </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"> <div *ngIf="loadActive || loadPending" class="uk-position-center">
<loading></loading> <loading></loading>
</div> </div>
@ -73,6 +73,16 @@
</div> </div>
</div> </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> </div>
</div> </div>

3
dashboard/users/role-users/role-users.module.ts
View File

@ -11,9 +11,10 @@ import {SafeHtmlPipeModule} from "../../../utils/pipes/safeHTMLPipe.module";
import {NotifyFormModule} from "../../../notifications/notify-form/notify-form.module"; import {NotifyFormModule} from "../../../notifications/notify-form/notify-form.module";
import {NoLoadPaging} from "../../../searchPages/searchUtils/no-load-paging.module"; import {NoLoadPaging} from "../../../searchPages/searchUtils/no-load-paging.module";
import {SearchInputModule} from "../../../sharedComponents/search-input/search-input.module"; import {SearchInputModule} from "../../../sharedComponents/search-input/search-input.module";
import {PagingModule} from "../../../utils/paging.module";
@NgModule({ @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], declarations: [RoleUsersComponent],
exports: [RoleUsersComponent] exports: [RoleUsersComponent]
}) })

64
dashboard/users/subscribers/subscribers.component.html
View File

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