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

Merge changes from master

This commit is contained in:
Konstantinos Triantafyllou 2022-01-13 15:57:35 +02:00
parent 52e04d7b48 9c014f8f0b
commit 83a9f259bf
22 changed files with 385 additions and 271 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -77,11 +77,9 @@
</div> </div>
</td> </td>
<td> <td>
<div class="actions" href="#"> <div class="actions" href="#">
<i class="clickable" uk-icon="pencil" (click)="editDivId(i)"></i> <icon class="clickable" name="edit" (click)="editDivId(i)"></icon>
<i class="clickable uk-text-danger" uk-icon="trash" <icon class="clickable uk-margin-small-left" [customClass]="'uk-text-danger'" name="remove" (click)="confirmDeleteDivId(check.divId._id)"></icon>
(click)="confirmDeleteDivId(check.divId._id)"></i>
</div> </div>
</td> </td>
</tr> </tr>

4
dashboard/divId/divIds.module.ts
View File

@ -20,7 +20,7 @@ import {ClassesRoutingModule} from "./classes-routing.module";
import {SearchInputModule} from "../../sharedComponents/search-input/search-input.module"; import {SearchInputModule} from "../../sharedComponents/search-input/search-input.module";
import {IconsModule} from "../../utils/icons/icons.module"; import {IconsModule} from "../../utils/icons/icons.module";
import {IconsService} from "../../utils/icons/icons.service"; import {IconsService} from "../../utils/icons/icons.service";
import {add} from "../../utils/icons/icons"; import {add, edit, remove} from "../../utils/icons/icons";
import {LoadingModule} from "../../utils/loading/loading.module"; import {LoadingModule} from "../../utils/loading/loading.module";
@NgModule({ @NgModule({
@ -34,6 +34,6 @@ import {LoadingModule} from "../../utils/loading/loading.module";
}) })
export class DivIdsModule { export class DivIdsModule {
constructor(private iconsService: IconsService) { constructor(private iconsService: IconsService) {
this.iconsService.registerIcons([add]); this.iconsService.registerIcons([add, edit, remove]);
} }
} }

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

@ -94,22 +94,15 @@
<div class=" uk-flex-center uk-flex"> <div class=" uk-flex-center uk-flex">
<div class="actions" href="#"> <div class="actions" href="#">
<div class="" (click)="editPageHelpContent(check.divHelpContent._id)" <button (click)="editPageHelpContent(check.divHelpContent._id)" class="uk-button action uk-margin-top uk-flex uk-flex-middle">
class="uk-button action uk-margin-top uk-flex uk-flex-middle "> <icon name="edit"></icon>
<i class="clickable" uk-icon="pencil" <span class="uk-margin-small-left">Edit</span>
></i> </button>
<span class="uk-margin-small-left"> <button (click)="confirmDeletePageHelpContent(check.divHelpContent._id)"
Edit class="uk-button action uk-margin-top uk-flex uk-flex-middle">
</span> <icon name="remove"></icon>
</div> <span class="uk-margin-small-left">Delete</span>
<div (click)="confirmDeletePageHelpContent(check.divHelpContent._id)" </button>
class="uk-button action uk-margin-top uk-flex uk-flex-middle ">
<i class="clickable " uk-icon="trash"
></i>
<span class="uk-margin-small-left">
Delete
</span>
</div>
</div> </div>
</div> </div>
</div> </div>

4
dashboard/divhelpcontent/class-help-contents.module.ts
View File

@ -12,7 +12,7 @@ import {InputModule} from '../../sharedComponents/input/input.module';
import {SearchInputModule} from '../../sharedComponents/search-input/search-input.module'; import {SearchInputModule} from '../../sharedComponents/search-input/search-input.module';
import {IconsModule} from '../../utils/icons/icons.module'; import {IconsModule} from '../../utils/icons/icons.module';
import {IconsService} from '../../utils/icons/icons.service'; import {IconsService} from '../../utils/icons/icons.service';
import {add, arrow_left} from '../../utils/icons/icons'; import {add, arrow_left, edit, remove} from '../../utils/icons/icons';
import {LoadingModule} from '../../utils/loading/loading.module'; import {LoadingModule} from '../../utils/loading/loading.module';
import {HTMLToStringPipeModule} from '../../utils/pipes/HTMLToStringPipe.module'; import {HTMLToStringPipeModule} from '../../utils/pipes/HTMLToStringPipe.module';
import {ClassHelpContentsRoutingModule} from './class-help-contents-routing.module'; import {ClassHelpContentsRoutingModule} from './class-help-contents-routing.module';
@ -33,6 +33,6 @@ import {PageContentModule} from '../sharedComponents/page-content/page-content.m
}) })
export class ClassHelpContentsModule { export class ClassHelpContentsModule {
constructor(private iconsService: IconsService) { constructor(private iconsService: IconsService) {
this.iconsService.registerIcons([add, arrow_left]) this.iconsService.registerIcons([add, arrow_left, edit, remove])
} }
} }

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

@ -91,9 +91,8 @@
<td *ngIf="isPortalAdministrator"> <td *ngIf="isPortalAdministrator">
<div class="actions" href="#"> <div class="actions" href="#">
<i class="clickable " uk-icon="pencil" (click)="editEntity(i)"></i> <icon class="clickable" name="edit" (click)="editEntity(i)"></icon>
<i class="clickable uk-text-danger" uk-icon="trash" <icon class="clickable uk-margin-small-left" [customClass]="'uk-text-danger'" name="remove" (click)="confirmDeleteEntity(check.entity._id)"></icon>
(click)="confirmDeleteEntity(check.entity._id)"></i>
</div> </div>
</td> </td>
</tr> </tr>

4
dashboard/entity/entities.module.ts
View File

@ -13,7 +13,7 @@ import {EntitiesRoutingModule} from "./entities-routing.module";
import {SearchInputModule} from "../../sharedComponents/search-input/search-input.module"; import {SearchInputModule} from "../../sharedComponents/search-input/search-input.module";
import {IconsModule} from "../../utils/icons/icons.module"; import {IconsModule} from "../../utils/icons/icons.module";
import {IconsService} from "../../utils/icons/icons.service"; import {IconsService} from "../../utils/icons/icons.service";
import {add} from "../../utils/icons/icons"; import {add, edit, remove} from "../../utils/icons/icons";
import {LoadingModule} from "../../utils/loading/loading.module"; import {LoadingModule} from "../../utils/loading/loading.module";
@NgModule({ @NgModule({
@ -26,6 +26,6 @@ import {LoadingModule} from "../../utils/loading/loading.module";
}) })
export class EntitiesModule { export class EntitiesModule {
constructor(private iconsService: IconsService) { constructor(private iconsService: IconsService) {
this.iconsService.registerIcons([add]); this.iconsService.registerIcons([add, edit, remove]);
} }
} }

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

@ -61,60 +61,56 @@
<div *ngIf="!showLoading"> <div *ngIf="!showLoading">
<div *ngIf="checkboxes.length > 0" class="uk-margin-medium-bottom"> <div *ngIf="checkboxes.length > 0" class="uk-margin-medium-bottom">
<ul class="uk-list pages"> <ul class="uk-list pages">
<li *ngFor="let check of checkboxes; let i=index" class="uk-card uk-card-default uk-margin-bottom"> <li *ngFor="let check of checkboxes; let i=index" class="uk-card uk-card-default uk-margin-bottom">
<div class="uk-grid uk-grid-divider uk-padding" uk-grid> <div class="uk-grid uk-grid-divider uk-padding" uk-grid>
<div class="uk-width-4-5 uk-first-column "> <div class="uk-width-4-5 ">
<div class="uk-grid uk-flex uk-flex-middle"> <div class="uk-grid uk-flex uk-flex-middle">
<div><input id="{{check.pageHelpContent._id}}" class="checkBox" type="checkbox" <div><input id="{{check.pageHelpContent._id}}" class="checkBox" type="checkbox"
name="entitiescb[]" value="{{check.pageHelpContent._id}}" [(ngModel)]="check.checked"> name="entitiescb[]" value="{{check.pageHelpContent._id}}" [(ngModel)]="check.checked">
</div>
<div class="uk-width-expand uk-margin-medium-bottom">
<div *ngIf="!selectedPageId">
<div class="page" href="#">{{check.pageHelpContent.page.name}}</div>
</div>
<div class="content multi-line-ellipsis lines-2">
<p>{{check.pageHelpContent.content|htmlToString}}</p></div>
</div>
<div class="uk-grid uk-width-1-1 uk-margin-left">
<div class=" ">
<span class="title">Placement: </span>{{check.pageHelpContent.placement}}
</div>
<div class=" ">
<span class="title">Order: </span>{{check.pageHelpContent.order}}
</div>
<div class=" ">
<span class="title uk-margin-small-right">Enable/disable: </span>
<mat-slide-toggle [checked]="check.pageHelpContent.isActive"
(change)="($event.source.checked = check.pageHelpContent.isActive);togglePageHelpContents(!check.pageHelpContent.isActive,[check.pageHelpContent._id])"
uk-tooltip="title:<div class='uk-padding-small uk-width-large'><div class='uk-text-bold '> Enable or disable help text to show or hide it from the dashboard</div></div>"
></mat-slide-toggle>
</div>
</div>
</div> </div>
<div class="uk-width-expand uk-margin-medium-bottom"> </div>
<div *ngIf="!selectedPageId"> <div class="uk-width-1-5">
<div class="page" href="#">{{check.pageHelpContent.page.name}}</div> <div class="uk-flex uk-flex-center uk-flex-column uk-height-1-1">
</div> <div class="uk-flex uk-flex-center">
<div class="content multi-line-ellipsis lines-2"> <div class="actions" href="#">
<p>{{check.pageHelpContent.content|htmlToString}}</p></div> <button (click)="editPageHelpContent(check.pageHelpContent._id)" class="uk-button action uk-margin-top uk-flex uk-flex-middle">
</div> <icon name="edit"></icon>
<div class="uk-grid uk-width-1-1 uk-margin-left"> <span class="uk-margin-small-left">Edit</span>
<div class=" "> </button>
<span class="title">Placement: </span>{{check.pageHelpContent.placement}} <button (click)="confirmDeletePageHelpContent(check.pageHelpContent._id)" class="uk-button action uk-margin-top uk-flex uk-flex-middle">
</div> <icon name="remove"></icon>
<div class=" "> <span class="uk-margin-small-left">Delete</span>
<span class="title">Order: </span>{{check.pageHelpContent.order}} </button>
</div> </div>
<div class=" ">
<span class="title uk-margin-small-right">Enable/disable: </span>
<mat-slide-toggle [checked]="check.pageHelpContent.isActive"
(change)="($event.source.checked = check.pageHelpContent.isActive);togglePageHelpContents(!check.pageHelpContent.isActive,[check.pageHelpContent._id])"
uk-tooltip="title:<div class='uk-padding-small uk-width-large'><div class='uk-text-bold '> Enable or disable help text to show or hide it from the dashboard</div></div>"
></mat-slide-toggle>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="uk-width-1-5 uk-first-column"> </li>
<div class=" uk-flex-center uk-flex"> </ul>
<div class="actions" href="#">
<div class="" (click)="editPageHelpContent(check.pageHelpContent._id)"
class="uk-button action uk-margin-top uk-flex uk-flex-middle ">
<i class="clickable" uk-icon="pencil"
></i>
<span class="uk-margin-small-left">Edit</span>
</div>
<div (click)="confirmDeletePageHelpContent(check.pageHelpContent._id)"
class="uk-button action uk-margin-top uk-flex uk-flex-middle ">
<i class="clickable " uk-icon="trash"
></i>
<span class="uk-margin-small-left">
Delete
</span>
</div>
</div>
</div>
</div>
</div>
</li>
</ul>
</div> </div>
<div *ngIf="checkboxes.length == 0" <div *ngIf="checkboxes.length == 0"
class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-bottom uk-text-bold"> class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-bottom uk-text-bold">

4
dashboard/helpTexts/page-help-contents.module.ts
View File

@ -13,7 +13,7 @@ import {PageContentModule} from '../sharedComponents/page-content/page-content.m
import {SearchInputModule} from '../../sharedComponents/search-input/search-input.module'; import {SearchInputModule} from '../../sharedComponents/search-input/search-input.module';
import {IconsModule} from '../../utils/icons/icons.module'; import {IconsModule} from '../../utils/icons/icons.module';
import {IconsService} from '../../utils/icons/icons.service'; import {IconsService} from '../../utils/icons/icons.service';
import {add, arrow_left} from '../../utils/icons/icons'; import {add, arrow_left, edit, remove} from '../../utils/icons/icons';
import {LoadingModule} from '../../utils/loading/loading.module'; import {LoadingModule} from '../../utils/loading/loading.module';
import {HTMLToStringPipeModule} from '../../utils/pipes/HTMLToStringPipe.module'; import {HTMLToStringPipeModule} from '../../utils/pipes/HTMLToStringPipe.module';
@ -30,6 +30,6 @@ import {HTMLToStringPipeModule} from '../../utils/pipes/HTMLToStringPipe.module'
}) })
export class PageHelpContentsModule { export class PageHelpContentsModule {
constructor(private iconsService: IconsService) { constructor(private iconsService: IconsService) {
this.iconsService.registerIcons([add, arrow_left]) this.iconsService.registerIcons([add, arrow_left, edit, remove])
} }
} }

221
dashboard/menu/menu.component.html
View File

@ -1,17 +1,18 @@
<div page-content class="admin-pages"> <div page-content class="admin-pages">
<div header> <div header>
<admin-tabs tab="menu" [portal]="portal"></admin-tabs> <admin-tabs tab="menu" [portal]="portal"></admin-tabs>
<div *ngIf="!showLoading" class="uk-grid" uk-grid> <div *ngIf="!showLoading" class="uk-grid" uk-grid>
<div class="uk-width-1-1"> <div class="uk-width-1-1">
<ul *ngIf="!isPortalAdministrator" class="uk-subnav uk-subnav-pill uk-flex uk-flex-middle"> <ul *ngIf="!isPortalAdministrator" class="uk-subnav uk-subnav-pill uk-flex uk-flex-middle">
<li *ngFor="let item of rootMenuItems; let i=index" [class.uk-active]="activeRootMenuId==item['_id']" class="uk-visible-toggle uk-position-relative uk-padding-remove-horizontal"> <li *ngFor="let item of rootMenuItems; let i=index" [class.uk-active]="activeRootMenuId==item['_id']"
class="uk-visible-toggle uk-position-relative uk-padding-remove-horizontal">
<span> <span>
<a (click)="changeActiveRootMenuItem(item)"> <a (click)="changeActiveRootMenuItem(item)">
<span class="title">{{item.title}}</span> <span class="title">{{item.title}}</span>
</a> </a>
<span class="uk-invisible-hover uk-position-center-right color z-index-2"> <span class="uk-invisible-hover uk-position-center-right color z-index-2">
<span class="clickable" uk-icon="more-vertical"></span> <span class="clickable" uk-icon="more-vertical"></span>
<div #element uk-dropdown="mode: click; pos: bottom-right; offset: 10; delay-hide: 0; flip: false"> <div #element uk-dropdown="mode: click; pos: bottom-right; offset: 20; delay-hide: 0; flip: false">
<ul class="uk-nav uk-dropdown-nav"> <ul class="uk-nav uk-dropdown-nav">
<li (click)="editMenuItem(item, false)"> <li (click)="editMenuItem(item, false)">
<a>Edit</a> <a>Edit</a>
@ -24,8 +25,8 @@
</div> </div>
</span> </span>
</span> </span>
</li> </li>
<li (click)="newMenuItem(false)" class="uk-visible-toggle"> <li (click)="newMenuItem(false)" class="uk-visible-toggle">
<span class="clickable"> <span class="clickable">
<span class="uk-icon-button small portal-icon-button"> <span class="uk-icon-button small portal-icon-button">
<icon name="add"></icon> <icon name="add"></icon>
@ -34,106 +35,118 @@
Create new root menu Create new root menu
</span> </span>
</span> </span>
</li> </li>
</ul> </ul>
</div> </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-margin-remove-top" uk-grid> <div
<div #searchInputComponent search-input [control]="filterForm.controls.keyword" [showSearch]="false" placeholder="Search menu item" class="uk-width-1-1 uk-flex uk-flex-right@m uk-flex-center uk-flex-wrap uk-flex-middle uk-grid uk-margin-remove-top"
[selected]="selectedKeyword" (closeEmitter)="onSearchClose()" (resetEmitter)="reset()" uk-grid>
[bordered]="true" colorClass="uk-text-secondary" <div #searchInputComponent search-input [control]="filterForm.controls.keyword" [showSearch]="false"
class="uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1"></div> placeholder="Search menu item"
<div> [selected]="selectedKeyword" (closeEmitter)="onSearchClose()" (resetEmitter)="reset()"
<a (click)="newMenuItem(true)" class="uk-flex uk-flex-middle uk-text-uppercase"> [bordered]="true" colorClass="uk-text-secondary"
<button class="large uk-icon-button uk-button-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"></icon> <div>
</button> <a (click)="newMenuItem(true)" class="uk-flex uk-flex-middle uk-text-uppercase">
<button class="uk-button uk-button-link uk-margin-small-left uk-text-secondary"> <button class="large uk-icon-button uk-button-secondary">
Add new menu item <icon name="add"></icon>
</button> </button>
</a> <button class="uk-button uk-button-link uk-margin-small-left uk-text-secondary">
</div> Add new menu item
</div> </button>
</div> </a>
<div inner> </div>
<div *ngIf="showLoading" class="uk-position-center"> </div>
<loading></loading> </div>
</div> <div inner>
<div *ngIf="!showLoading"> <div *ngIf="showLoading" class="uk-position-center">
<ul *ngIf='activeRootMenuId' class="uk-list submenu-items"> <loading></loading>
<li *ngFor="let child of childrenMenuItems" class="uk-card uk-card-default uk-margin-bottom"> </div>
<div class="uk-grid uk-grid-divider uk-padding" uk-grid> <div *ngIf="!showLoading">
<div class="uk-width-4-5"> <ul *ngIf='activeRootMenuId' class="uk-list submenu-items">
<div class="uk-grid uk-flex uk-flex-middle"> <li *ngFor="let child of childrenMenuItems" class="uk-card uk-card-default uk-margin-bottom">
<div class="uk-width-expand uk-margin-medium-bottom"> <div class="uk-grid uk-grid-divider uk-padding" uk-grid>
{{child.title}} <div class="uk-width-4-5">
</div> <div class="uk-grid uk-flex uk-flex-middle">
<div *ngIf="child.url && child.type == 'external'" class="uk-grid uk-width-1-1 uk-margin-left"> <div class="uk-width-expand uk-margin-medium-bottom">
<span class="title uk-padding-remove">URL: </span><a href="{{child.url}}" target="_blank" class="uk-padding-remove uk-margin-left">{{child.url}}</a> {{child.title}}
</div> </div>
<div *ngIf="child.route && child.type == 'internal'" class="uk-grid uk-width-1-1 uk-margin-left"> <div *ngIf="child.url && child.type == 'external'" class="uk-grid uk-width-1-1 uk-margin-left">
<span class="title uk-padding-remove">Route: </span><span class="uk-padding-remove uk-margin-left">{{child.route}}</span> <span class="title uk-padding-remove">URL: </span><a href="{{child.url}}" target="_blank"
</div> class="uk-padding-remove uk-margin-left">{{child.url}}</a>
</div> </div>
</div> <div *ngIf="child.route && child.type == 'internal'" class="uk-grid uk-width-1-1 uk-margin-left">
<div class="uk-width-1-5"> <span class="title uk-padding-remove">Route: </span><span
<div class="uk-flex uk-flex-center"> class="uk-padding-remove uk-margin-left">{{child.route}}</span>
<div href="#" class="actions"> </div>
<div class="uk-button action uk-margin-top uk-flex uk-flex-middle" (click)="editMenuItem(child, true)"> </div>
<i uk-icon="pencil" class="clickable uk-icon"></i> </div>
<span class="uk-margin-small-left"> Edit</span> <div class="uk-width-1-5">
</div> <div class="uk-flex uk-flex-center uk-flex-column uk-height-1-1">
<div class="uk-button action uk-margin-top uk-flex uk-flex-middle" (click)="confirmDeleteMenuItem(child._id, true)"> <div class="uk-flex uk-flex-center">
<i uk-icon="trash" class="clickable uk-icon"></i> <div class="actions">
<span class="uk-margin-small-left"> Delete</span> <button class="uk-button action uk-margin-top uk-flex uk-flex-middle"
</div> (click)="editMenuItem(child, true)">
</div> <icon name="edit"></icon>
</div> <span class="uk-margin-small-left"> Edit</span>
</div> </button>
</div> <button class="uk-button action uk-margin-top uk-flex uk-flex-middle"
</li> (click)="confirmDeleteMenuItem(child._id, true)">
</ul> <icon name="remove"></icon>
<div *ngIf="childrenMenuItems.length == 0" <span class="uk-margin-small-left"> Delete</span>
class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-bottom uk-text-bold"> </button>
</div>
</div>
</div>
</div>
</div>
</li>
</ul>
<div *ngIf="childrenMenuItems.length == 0"
class="uk-card uk-card-default uk-padding-large uk-text-center uk-margin-bottom uk-text-bold">
<div>No menu items found</div> <div>No menu items found</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<modal-alert #editModal (alertOutput)="menuItemSaveConfirmed($event)" <modal-alert #editModal (alertOutput)="menuItemSaveConfirmed($event)"
[okDisabled]="menuItemForm && (menuItemForm.invalid || !menuItemForm.dirty)"> [okDisabled]="menuItemForm && (menuItemForm.invalid || !menuItemForm.dirty)">
<form *ngIf="menuItemForm" [formGroup]="menuItemForm" class="uk grid uk-child-width-1-1" uk-grid> <form *ngIf="menuItemForm" [formGroup]="menuItemForm" class="uk grid uk-child-width-1-1" uk-grid>
<div dashboard-input [formInput]="menuItemForm.get('title')" type="text" label="Name" placeholder="Write a name"></div> <div dashboard-input [formInput]="menuItemForm.get('title')" type="text" label="Name"
<div dashboard-input [formInput]="menuItemForm.get('type')" type="select" label="Type" placeholder="Choose a type" [options]="getTypeOptions()"></div> placeholder="Write a name"></div>
<!-- Workflow for EXTERNAL --> <div dashboard-input [formInput]="menuItemForm.get('type')" type="select" label="Type" placeholder="Choose a type"
<div dashboard-input *ngIf="menuItemForm.get('type').value === 'external'" [formInput]="menuItemForm.get('url')" type="URL" label="URL *" placeholder="Write a URL"></div> [options]="getTypeOptions()" [tooltip]="false"></div>
<!-- Workflow for INTERNAL --> <!-- Workflow for EXTERNAL -->
<div *ngIf="menuItemForm.get('type').value === 'internal'"> <div dashboard-input *ngIf="menuItemForm.get('type').value === 'external'" [formInput]="menuItemForm.get('url')"
<div class="uk-text-center">Select one of the pages</div> [validators]="menuItemForm.get('url').validator" type="URL" label="URL" placeholder="Write a URL"></div>
<div dashboard-input [formInput]="menuItemForm.get('route')" type="autocomplete" label="Page" placeholder="Search all pages" [options]="allPages" [showOptionsOnEmpty]="false"> <!-- Workflow for INTERNAL -->
<div *ngIf="menuItemForm.get('type').value === 'internal'">
<div class="uk-text-center">Select one of the pages</div>
<div dashboard-input [formInput]="menuItemForm.get('route')" [validators]="menuItemForm.get('route').validator"
type="autocomplete" label="Page" placeholder="Search all pages" [options]="allPages"
[showOptionsOnEmpty]="false">
</div> </div>
<div class="uk-text-center uk-margin-top">Or <a (click)="newPageWindow()">create a new one</a></div> <div class="uk-text-center uk-margin-top">Or <a (click)="newPageWindow()">create a new one</a></div>
<div *ngIf="newPageWindowOpen" class="uk-card uk-card-default uk-card-body uk-margin-top"> <div *ngIf="newPageWindowOpen" class="uk-card uk-card-default uk-card-body uk-margin-top">
<div> <div>
<button (click)="newPageWindow()" class="uk-close uk-icon uk-float-right" uk-close></button> <button (click)="newPageWindow()" class="uk-close uk-icon uk-float-right" uk-close></button>
<h6 class="uk-text-bold uk-margin-remove-top">Create New Page</h6> <h6 class="uk-text-bold uk-margin-remove-top">Create New Page</h6>
</div> </div>
<form *ngIf="pageForm" [formGroup]="pageForm" class="uk grid uk-child-width-1-1" uk-grid> <form *ngIf="pageForm" [formGroup]="pageForm" class="uk grid uk-child-width-1-1" uk-grid>
<div dashboard-input [formInput]="pageForm.get('name')" type="text" label="Name" placeholder="Write a name"></div> <div dashboard-input [formInput]="pageForm.get('name')" type="text" label="Name"
<div dashboard-input [formInput]="pageForm.get('route')" type="text" label="Route" placeholder="Write a route"></div> placeholder="Write a name"></div>
<!-- <div> <div dashboard-input [formInput]="pageForm.get('route')" type="text" label="Route"
<div class="uk-text-bold uk-form-label uk-margin-small-bottom">Enable/disable</div> placeholder="Write a route"></div>
<mat-slide-toggle [checked]="pageForm.get('isEnabled')" <div class="uk-flex uk-flex-right">
uk-tooltip="title:<div class='uk-padding-small uk-width-large'><div class='uk-text-bold '>Disable a page to hide it from community dashboard portal.</div><div class=' uk-margin-top'>If the page is disabled, a message 'Can't find that page' will appear in case the url of that page is loaded. If the disabled page belongs to the menu, the link will be removed from menu, too.</div></div>"> <button [disabled]="!(pageForm.get('name').value && pageForm.get('route').value)"
</mat-slide-toggle> class="uk-button uk-button-secondary outlined" (click)="createPage()">Create Page
</div> --> </button>
<div class="uk-flex uk-flex-right"> </div>
<button class="uk-button uk-button-default" (click)="createPage()">Create Page</button> </form>
</div> </div>
</form> </div>
</div> </form>
</div>
</form>
</modal-alert> </modal-alert>
<modal-alert #deleteModal (alertOutput)="confirmedDeleteMenuItem($event)"></modal-alert> <modal-alert #deleteModal (alertOutput)="confirmedDeleteMenuItem($event)"></modal-alert>

51
dashboard/menu/menu.component.ts
View File

@ -1,4 +1,4 @@
import {Component, ElementRef, OnInit, ViewChild} from '@angular/core'; import {Component, ElementRef, OnInit, ViewChild, Input} from '@angular/core';
import {ActivatedRoute, Router} from '@angular/router'; import {ActivatedRoute, Router} from '@angular/router';
import {HelpContentService} from '../../services/help-content.service'; import {HelpContentService} from '../../services/help-content.service';
import {FormBuilder, FormGroup, Validators} from '@angular/forms'; import {FormBuilder, FormGroup, Validators} from '@angular/forms';
@ -36,12 +36,12 @@ export class MenuComponent implements OnInit {
public activeRootMenuId: string; public activeRootMenuId: string;
public activeRootMenu: MenuItem; public activeRootMenu: MenuItem;
public childrenMenuItems: MenuItem[] = []; public childrenMenuItems: MenuItem[] = [];
private index: number; private index: number;
public menuItemForm: FormGroup; public menuItemForm: FormGroup;
public pageForm: FormGroup; public pageForm: FormGroup;
public rootMenuItems = []; public rootMenuItems = [];
public menuItems = [];
public allPages = []; public allPages = [];
public selectedMenuItem: string; public selectedMenuItem: string;
@ -123,11 +123,11 @@ export class MenuComponent implements OnInit {
data => { data => {
this.rootMenuItems = data; this.rootMenuItems = data;
if(data && data.length > 0) { if(data && data.length > 0) {
// this.activeRootMenuId = data[0]['_id'];
this.changeActiveRootMenuItem(data[0]); this.changeActiveRootMenuItem(data[0]);
} }
}, },
err => console.error("Server error fetching menu items: ", err) // err => console.error("Server error fetching menu items: ", err)
error => this.handleError("Server error fetching menu items", error)
) )
); );
} }
@ -163,7 +163,7 @@ export class MenuComponent implements OnInit {
} }
} }
}, },
err => console.error("Server error fetching pages: ", err) error => this.handleError("Server error fetching pages", error)
) )
); );
} }
@ -172,7 +172,7 @@ export class MenuComponent implements OnInit {
this.newPageWindowOpen = !this.newPageWindowOpen; this.newPageWindowOpen = !this.newPageWindowOpen;
this.pageForm = this._fb.group({ this.pageForm = this._fb.group({
_id: this._fb.control(null), _id: this._fb.control(null),
route: this._fb.control('', Validators.required), route: this._fb.control('', [Validators.required, StringUtils.validRoute(this.allPages, 'value')]),
name: this._fb.control('', Validators.required), name: this._fb.control('', Validators.required),
isEnabled: this._fb.control(true), isEnabled: this._fb.control(true),
portalType: this._fb.control(this.properties.adminToolsPortalType, Validators.required), portalType: this._fb.control(this.properties.adminToolsPortalType, Validators.required),
@ -202,7 +202,10 @@ export class MenuComponent implements OnInit {
}); });
this.newPageWindowOpen = !this.newPageWindowOpen; this.newPageWindowOpen = !this.newPageWindowOpen;
this.menuItemForm.get('route').setValue(page.route); this.menuItemForm.get('route').setValue(page.route);
} this.menuItemForm.get('route').markAsDirty();
this.showLoading = false;
},
error => this.handleError('System error creating page', error)
) )
); );
} }
@ -211,14 +214,15 @@ export class MenuComponent implements OnInit {
this.destroyTypeSubscription(); this.destroyTypeSubscription();
this.typeSub = this.menuItemForm.get('type').valueChanges.subscribe(value => { this.typeSub = this.menuItemForm.get('type').valueChanges.subscribe(value => {
setTimeout(() => { setTimeout(() => {
// console.log(value); this.menuItemForm.controls['route'].clearValidators();
this.menuItemForm.controls['url'].clearValidators();
if(value === "internal") { if(value === "internal") {
this.menuItemForm.controls['route'].setValidators([Validators.required]); this.menuItemForm.controls['route'].setValidators([Validators.required]);
this.menuItemForm.controls['route'].updateValueAndValidity();
} else if(value === "external") { } else if(value === "external") {
this.menuItemForm.controls['url'].setValidators([Validators.required]); this.menuItemForm.controls['url'].setValidators([Validators.required, StringUtils.urlValidator()]);
this.menuItemForm.controls['url'].updateValueAndValidity();
} }
this.menuItemForm.controls['route'].updateValueAndValidity();
this.menuItemForm.controls['url'].updateValueAndValidity();
}, 0); }, 0);
}); });
} }
@ -243,8 +247,8 @@ export class MenuComponent implements OnInit {
_id: this._fb.control(menuItem['_id']), _id: this._fb.control(menuItem['_id']),
title: this._fb.control(menuItem.title,Validators.required), title: this._fb.control(menuItem.title,Validators.required),
type: this._fb.control(menuItem['type'],Validators.required), type: this._fb.control(menuItem['type'],Validators.required),
route: this._fb.control(menuItem.route), route: this._fb.control(menuItem.route, (menuItem['type'] == "internal") ? [Validators.required] : []),
url: this._fb.control(menuItem.url), url: this._fb.control(menuItem.url, (menuItem['type'] == "external") ? [Validators.required, StringUtils.urlValidator()] : []),
parentItemId: this._fb.control(menuItem['parentItemId']) parentItemId: this._fb.control(menuItem['parentItemId'])
}); });
this.isChild = isChild; this.isChild = isChild;
@ -284,7 +288,8 @@ export class MenuComponent implements OnInit {
pos: 'bottom-right' pos: 'bottom-right'
}); });
this.showLoading = false; this.showLoading = false;
} },
error => this.handleError("Server error deleting menu item", error)
) )
) )
} }
@ -323,7 +328,8 @@ export class MenuComponent implements OnInit {
timeout: 6000, timeout: 6000,
pos: 'bottom-right' pos: 'bottom-right'
}); });
} },
error => this.handleError("System error creating menu item", error)
) )
) )
} else { } else {
@ -336,7 +342,8 @@ export class MenuComponent implements OnInit {
timeout: 6000, timeout: 6000,
pos: 'bottom-right' pos: 'bottom-right'
}); });
} },
error => this.handleError("System error updating menu item", error)
) )
) )
} }
@ -360,8 +367,18 @@ export class MenuComponent implements OnInit {
this.showLoading = false; this.showLoading = false;
} }
handleError(message: string, error) {
UIkit.notification(message, {
status: 'danger',
timeout: 6000,
pos: 'bottom-right'
});
console.log('Server responded: ' + error);
this.showLoading = false;
}
public applyFilters() { public applyFilters() {
this.childrenMenuItems = this.activeRootMenu.items.filter(item => item.title.toLowerCase().includes(this.searchText)); this.childrenMenuItems = this.activeRootMenu.items.filter(item => item.title.toLowerCase().includes(this.searchText) || (item.url||'').toLowerCase().includes(this.searchText) || (item.route||'').toLowerCase().includes(this.searchText));
} }
public onSearchClose() { public onSearchClose() {

4
dashboard/menu/menu.module.ts
View File

@ -13,7 +13,7 @@ import {MenuRoutingModule} from "./menu-routing.module";
import {SearchInputModule} from "../../sharedComponents/search-input/search-input.module"; import {SearchInputModule} from "../../sharedComponents/search-input/search-input.module";
import {IconsModule} from "../../utils/icons/icons.module"; import {IconsModule} from "../../utils/icons/icons.module";
import {IconsService} from "../../utils/icons/icons.service"; import {IconsService} from "../../utils/icons/icons.service";
import {add} from "../../utils/icons/icons"; import {add, edit, remove} from "../../utils/icons/icons";
import {LoadingModule} from "../../utils/loading/loading.module"; import {LoadingModule} from "../../utils/loading/loading.module";
@NgModule({ @NgModule({
@ -26,6 +26,6 @@ import {LoadingModule} from "../../utils/loading/loading.module";
}) })
export class MenuModule { export class MenuModule {
constructor(private iconsService: IconsService) { constructor(private iconsService: IconsService) {
this.iconsService.registerIcons([add]); this.iconsService.registerIcons([add, edit, remove]);
} }
} }

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

@ -63,57 +63,71 @@
<div *ngIf="!showLoading"> <div *ngIf="!showLoading">
<ul *ngIf="checkboxes.length > 0" class="uk-list pages"> <ul *ngIf="checkboxes.length > 0" class="uk-list pages">
<li *ngFor="let check of checkboxes; let i=index" class="uk-card uk-card-default uk-margin-bottom"> <li *ngFor="let check of checkboxes; let i=index" class="uk-card uk-card-default uk-margin-bottom">
<div class="uk-grid uk-padding"> <div class="uk-grid uk-grid-divider uk-padding" uk-grid>
<div class=""><input id="{{check.page._id}}" class="checkBox" type="checkbox" <div class="uk-grid uk-width-expand" uk-grid>
name="pagescb[]" value="{{check.page._id}}" [(ngModel)]="check.checked"> <div class=""><input id="{{check.page._id}}" class="checkBox" type="checkbox"
</div> name="pagescb[]" value="{{check.page._id}}" [(ngModel)]="check.checked">
<div class="uk-width-expand">
<div class="title uk-margin-medium-bottom">Name</div>
<div class="name uk-margin-medium-bottom" href="#">{{check.page.name}}</div>
<div *ngIf="check.page.entities && check.page.entities.length > 0"><span
class="title">Entities: </span>
{{getEntitiesAsString(check.page)}}</div>
<div class=" uk-margin-small-bottom"><span class="title">Route: </span> {{check.page.route}}</div>
<div *ngIf="!pagesType" class=" uk-margin-small-bottom"><span
class="title">Type: </span> {{check.page.type}}</div>
<div *ngIf="!portal" class=" uk-margin-small-bottom">
<span class="title">Portal type: </span>{{check.page.portalType}}
</div> </div>
</div> <div class="uk-width-expand">
<div *ngIf="isPortalAdministrator || (check.page.portalType == properties.adminToolsPortalType && check.page.portalPid == portal)" class="uk-width-1-4"> <div class="title uk-margin-medium-bottom">Name</div>
<div class="title uk-margin-medium-bottom">Actions</div> <div class="name uk-margin-medium-bottom" href="#">{{check.page.name}}</div>
<div class="actions" href="#"> <div *ngIf="check.page.entities && check.page.entities.length > 0"><span
<i class="clickable " (click)="editPage(i)" uk-icon="pencil"></i> class="title">Entities: </span>
<i class="clickable uk-text-danger" {{getEntitiesAsString(check.page)}}</div>
(click)="confirmDeletePage(check.page._id)" uk-icon="trash"></i> <div class=" uk-margin-small-bottom"><span class="title">Route: </span> {{check.page.route}}</div>
<div *ngIf="!pagesType" class=" uk-margin-small-bottom"><span
class="title">Type: </span> {{check.page.type}}</div>
<div *ngIf="!portal" class=" uk-margin-small-bottom">
<span class="title">Portal type: </span>{{check.page.portalType}}
</div>
<div *ngIf="!portal && check.page.portalPid" class=" uk-margin-small-bottom">
<span class="title">Portal PID: </span>{{check.page.portalPid}}
</div>
</div> </div>
</div> <div *ngIf="!isPortalAdministrator && ((check.page.top || check.page.bottom || check.page.left ||
<div *ngIf="!isPortalAdministrator && ((check.page.top || check.page.bottom || check.page.left ||
check.page.right) || pageWithDivIds.includes(check.page._id) )" class="uk-width-1-4"> check.page.right) || pageWithDivIds.includes(check.page._id) )" class="uk-width-1-4">
<div class="title uk-margin-medium-bottom">Help texts</div> <div class="title uk-margin-medium-bottom">Help texts</div>
<div class=" uk-margin-small-bottom"> <div class=" uk-margin-small-bottom">
<a *ngIf="check.page.top || check.page.bottom || check.page.left || check.page.right" <a *ngIf="check.page.top || check.page.bottom || check.page.left || check.page.right"
class="helpContents" class="helpContents"
[queryParams]="{pageId: check.page._id}" [queryParams]="{pageId: check.page._id}"
routerLink="../helptexts"> routerLink="../helptexts">
Manage page help texts Manage page help texts
<span *ngIf="pageHelpContentsCount[check.page._id]">({{pageHelpContentsCount[check.page._id]}})</span> <span *ngIf="pageHelpContentsCount[check.page._id]">({{pageHelpContentsCount[check.page._id]}})</span>
</a> </a>
</div>
<div>
<a *ngIf="pageWithDivIds.includes(check.page._id)"
[queryParams]="{ pageId: check.page._id}"
routerLink="../classContents">Manage class help texts
<span *ngIf="pageClassContentsCount[check.page._id]">({{pageClassContentsCount[check.page._id]}})</span>
</a>
</div>
</div> </div>
<div> <div *ngIf="!isPortalAdministrator" class="uk-width-1-4">
<a *ngIf="pageWithDivIds.includes(check.page._id)" <div class="title uk-margin-medium-bottom">Enable/disable</div>
[queryParams]="{ pageId: check.page._id}" <mat-slide-toggle [checked]="check.page.isEnabled"
routerLink="../classContents">Manage class help texts (change)="($event.source.checked = check.page.isEnabled);togglePages(!check.page.isEnabled,[check.page._id])"
<span *ngIf="pageClassContentsCount[check.page._id]">({{pageClassContentsCount[check.page._id]}})</span> uk-tooltip="title:<div class='uk-padding-small uk-width-large'><div class='uk-text-bold '>Disable a page to hide it from community dashboard portal.</div><div class=' uk-margin-top'>If the page is disabled, a message 'Can't find that page' will appear in case the url of that page is loaded. If the disabled page belongs to the menu, the link will be removed from menu, too.</div></div>">
</a> </mat-slide-toggle>
</div> </div>
</div> </div>
<div *ngIf="!isPortalAdministrator" class="uk-width-1-4"> <div *ngIf="isPortalAdministrator || (check.page.portalType == properties.adminToolsPortalType && check.page.portalPid == portal)" class="uk-width-1-5">
<div class="title uk-margin-medium-bottom">Enable/disable</div> <div class="uk-flex uk-flex-center uk-flex-column uk-height-1-1">
<mat-slide-toggle [checked]="check.page.isEnabled" <div class="uk-flex uk-flex-center">
(change)="($event.source.checked = check.page.isEnabled);togglePages(!check.page.isEnabled,[check.page._id])" <div class="actions">
uk-tooltip="title:<div class='uk-padding-small uk-width-large'><div class='uk-text-bold '>Disable a page to hide it from community dashboard portal.</div><div class=' uk-margin-top'>If the page is disabled, a message 'Can't find that page' will appear in case the url of that page is loaded. If the disabled page belongs to the menu, the link will be removed from menu, too.</div></div>"> <button [disabled]="!portal && check.page.portalPid" [attr.uk-tooltip]="((!portal && check.page.portalPid)?'This page belongs to ' + check.page.portalPid:null)"
</mat-slide-toggle> class="uk-button action uk-margin-top uk-flex uk-flex-middle" (click)="editPage(i)">
<icon name="edit"></icon>
<span class="uk-margin-small-left"> Edit</span>
</button>
<button class="uk-button action uk-margin-top uk-flex uk-flex-middle" (click)="confirmDeletePage(check.page._id)">
<icon name="remove"></icon>
<span class="uk-margin-small-left"> Delete</span>
</button>
</div>
</div>
</div>
</div> </div>
</div> </div>
</li> </li>
@ -136,7 +150,7 @@
type="text" placeholder="Write a name" type="text" placeholder="Write a name"
label="Page Name"> label="Page Name">
</div> </div>
<ng-template [ngIf]="isPortalAdministrator"> <ng-container *ngIf="isPortalAdministrator">
<div dashboard-input [formInput]="pageForm.get('type')" <div dashboard-input [formInput]="pageForm.get('type')"
type="select" placeholder="Choose a page Type" type="select" placeholder="Choose a page Type"
label="Type" [options]="typeOptions"> label="Type" [options]="typeOptions">
@ -171,7 +185,7 @@
By disabling a position, all contents in this position will be deleted. By disabling a position, all contents in this position will be deleted.
</label> </label>
</div> </div>
</ng-template> </ng-container>
</form> </form>
</modal-alert> </modal-alert>

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

@ -242,7 +242,7 @@ export class PagesComponent implements OnInit {
this.index = this.pages.findIndex(value => value._id === page._id); this.index = this.pages.findIndex(value => value._id === page._id);
this.pageForm = this._fb.group({ this.pageForm = this._fb.group({
_id: this._fb.control(page._id), _id: this._fb.control(page._id),
route: this._fb.control(page.route, Validators.required), route: this._fb.control(page.route, [Validators.required, StringUtils.validRoute(this.pages, 'route', page.route)]),
name: this._fb.control(page.name, Validators.required), name: this._fb.control(page.name, Validators.required),
isEnabled: this._fb.control(page.isEnabled), isEnabled: this._fb.control(page.isEnabled),
portalType: this._fb.control(page.portalType, Validators.required), portalType: this._fb.control(page.portalType, Validators.required),
@ -268,7 +268,7 @@ export class PagesComponent implements OnInit {
this.entitiesCtrl = this._fb.array([]); this.entitiesCtrl = this._fb.array([]);
this.pageForm = this._fb.group({ this.pageForm = this._fb.group({
_id: this._fb.control(null), _id: this._fb.control(null),
route: this._fb.control('', Validators.required), route: this._fb.control('', [Validators.required, StringUtils.validRoute(this.pages, 'route')]),
name: this._fb.control('', Validators.required), name: this._fb.control('', Validators.required),
isEnabled: this._fb.control(true), isEnabled: this._fb.control(true),
portalType: this._fb.control('', Validators.required), portalType: this._fb.control('', Validators.required),
@ -364,7 +364,7 @@ export class PagesComponent implements OnInit {
if (error == null) { if (error == null) {
// this.formComponent.reset(); // this.formComponent.reset();
this.pageForm = this._fb.group({ this.pageForm = this._fb.group({
route: this._fb.control('', Validators.required), route: this._fb.control('', [Validators.required, StringUtils.validRoute(this.pages, 'route')]),
name: this._fb.control('', Validators.required), name: this._fb.control('', Validators.required),
isEnabled: this._fb.control(true), isEnabled: this._fb.control(true),
portalType: this._fb.control('', Validators.required), portalType: this._fb.control('', Validators.required),

4
dashboard/page/pages.module.ts
View File

@ -16,7 +16,7 @@ import {PagesRoutingModule} from "./pages-routing.module";
import {SearchInputModule} from "../../sharedComponents/search-input/search-input.module"; import {SearchInputModule} from "../../sharedComponents/search-input/search-input.module";
import {IconsModule} from "../../utils/icons/icons.module"; import {IconsModule} from "../../utils/icons/icons.module";
import {IconsService} from "../../utils/icons/icons.service"; import {IconsService} from "../../utils/icons/icons.service";
import {add} from "../../utils/icons/icons"; import {add, edit, remove} from "../../utils/icons/icons";
import {LoadingModule} from "../../utils/loading/loading.module"; import {LoadingModule} from "../../utils/loading/loading.module";
@NgModule({ @NgModule({
@ -29,6 +29,6 @@ import {LoadingModule} from "../../utils/loading/loading.module";
}) })
export class PagesModule { export class PagesModule {
constructor(private iconsService: IconsService) { constructor(private iconsService: IconsService) {
this.iconsService.registerIcons([add]); this.iconsService.registerIcons([add, edit, remove]);
} }
} }

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

@ -69,9 +69,8 @@
</td> </td>
<td> <td>
<div class="actions" href="#"> <div class="actions" href="#">
<i class="clickable" uk-icon="pencil" (click)="editPortal(i)"></i> <icon class="clickable" name="edit" (click)="editPortal(i)"></icon>
<i class="clickable uk-text-danger" uk-icon="trash" <icon class="clickable uk-margin-small-left" [customClass]="'uk-text-danger'" name="remove" (click)="confirmDeletePortal(check.portal._id)"></icon>
(click)="confirmDeletePortal(check.portal._id)"></i>
</div> </div>
</td> </td>

4
dashboard/portal/portals.module.ts
View File

@ -10,7 +10,7 @@ import {AdminTabsModule} from "../sharedComponents/admin-tabs/admin-tabs.module"
import {PageContentModule} from "../sharedComponents/page-content/page-content.module"; import {PageContentModule} from "../sharedComponents/page-content/page-content.module";
import {PortalsRoutingModule} from "./portals-routing.module"; import {PortalsRoutingModule} from "./portals-routing.module";
import {IconsService} from "../../utils/icons/icons.service"; import {IconsService} from "../../utils/icons/icons.service";
import {add} from "../../utils/icons/icons"; import {add, edit, remove} from "../../utils/icons/icons";
import {IconsModule} from "../../utils/icons/icons.module"; import {IconsModule} from "../../utils/icons/icons.module";
import {SearchInputModule} from "../../sharedComponents/search-input/search-input.module"; import {SearchInputModule} from "../../sharedComponents/search-input/search-input.module";
import {LoadingModule} from "../../utils/loading/loading.module"; import {LoadingModule} from "../../utils/loading/loading.module";
@ -26,6 +26,6 @@ import {LoadingModule} from "../../utils/loading/loading.module";
}) })
export class PortalsModule { export class PortalsModule {
constructor(private iconsService: IconsService) { constructor(private iconsService: IconsService) {
this.iconsService.registerIcons([add]); this.iconsService.registerIcons([add, edit, remove]);
} }
} }

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

@ -12,7 +12,7 @@ import { properties } from 'src/environments/environment';
<li *ngIf="isPortalAdmin && !portal" [class.uk-active]="tab === 'portal'"><a routerLink="../portals"><span class="title">Portals</span></a></li> <li *ngIf="isPortalAdmin && !portal" [class.uk-active]="tab === 'portal'"><a routerLink="../portals"><span class="title">Portals</span></a></li>
<li [class.uk-active]="tab === 'page'"><a routerLink="../pages"><span class="title">Pages</span></a></li> <li [class.uk-active]="tab === 'page'"><a routerLink="../pages"><span class="title">Pages</span></a></li>
<li [class.uk-active]="tab === 'entity'"><a routerLink="../entities"><span class="title">Entities</span></a></li> <li [class.uk-active]="tab === 'entity'"><a routerLink="../entities"><span class="title">Entities</span></a></li>
<li *ngIf="env == 'development'" [class.uk-active]="tab === 'menu'"><a routerLink="../menu"><span class="title">Menu</span></a></li> <li *ngIf="env === 'development' && portal" [class.uk-active]="tab === 'menu'"><a routerLink="../menu"><span class="title">Menu</span></a></li>
<li *ngIf="isPortalAdmin && !portal" [class.uk-active]="tab === 'class'"><a routerLink="../classes"><span class="title">Classes</span></a></li> <li *ngIf="isPortalAdmin && !portal" [class.uk-active]="tab === 'class'"><a routerLink="../classes"><span class="title">Classes</span></a></li>
</ul> </ul>
` `

8
sharedComponents/input/input.component.ts
View File

@ -77,7 +77,7 @@ export interface Option {
(openedChange)="stopPropagation()" [formControl]="formControl" (openedChange)="stopPropagation()" [formControl]="formControl"
[disableOptionCentering]="true"> [disableOptionCentering]="true">
<mat-option *ngIf="placeholder" class="uk-hidden" [value]="''">{{placeholder}}</mat-option> <mat-option *ngIf="placeholder" class="uk-hidden" [value]="''">{{placeholder}}</mat-option>
<mat-option *ngFor="let option of options" [value]="option.value" [attr.uk-tooltip]="option.label"> <mat-option *ngFor="let option of options" [value]="option.value" [attr.uk-tooltip]="(tooltip) ? option.label : null">
{{option.label}} {{option.label}}
</mat-option> </mat-option>
</mat-select> </mat-select>
@ -200,7 +200,7 @@ export class InputComponent implements OnInit, OnDestroy, OnChanges {
@Input() panelWidth: number = 300; @Input() panelWidth: number = 300;
@Input() panelClass: string = null; @Input() panelClass: string = null;
@Input() showOptionsOnEmpty: boolean = true; @Input() showOptionsOnEmpty: boolean = true;
@Input() validators: ValidatorFn[]; @Input() validators: ValidatorFn[] | ValidatorFn;
@Output() focusEmitter: EventEmitter<boolean> = new EventEmitter<boolean>(); @Output() focusEmitter: EventEmitter<boolean> = new EventEmitter<boolean>();
/** LogoUrl information */ /** LogoUrl information */
public secure: boolean = true; public secure: boolean = true;
@ -211,6 +211,7 @@ export class InputComponent implements OnInit, OnDestroy, OnChanges {
public filteredOptions: Observable<Option[]>; public filteredOptions: Observable<Option[]>;
public searchControl: FormControl; public searchControl: FormControl;
private subscriptions: any[] = []; private subscriptions: any[] = [];
@Input() tooltip: boolean = true;
@ViewChild('select') select: MatSelect; @ViewChild('select') select: MatSelect;
@ViewChild('searchInput') searchInput: ElementRef; @ViewChild('searchInput') searchInput: ElementRef;
focused: boolean = false; focused: boolean = false;
@ -229,7 +230,7 @@ export class InputComponent implements OnInit, OnDestroy, OnChanges {
} }
ngOnChanges(changes: SimpleChanges) { ngOnChanges(changes: SimpleChanges) {
if (changes.formControl) { if (changes.formControl || changes.validators) {
this.reset(); this.reset();
} }
} }
@ -346,6 +347,7 @@ export class InputComponent implements OnInit, OnDestroy, OnChanges {
resetSearch(event: any) { resetSearch(event: any) {
event.stopPropagation(); event.stopPropagation();
this.searchControl.setValue(''); this.searchControl.setValue('');
this.formControl.markAsDirty(); // TODO check - should it also become dirty on addition?
this.formControl.setValue(null); this.formControl.setValue(null);
} }
} }

51
sharedComponents/navigationBar.component.html
View File

@ -241,6 +241,57 @@
</li> </li>
</ng-container> </ng-container>
<!-- Custom menu items -->
<ng-container *ngIf="customMenuItems?.length > 0 && properties.environment == 'development'">
<ng-container *ngFor="let menu of customMenuItems">
<li class="uk-parent">
<!-- INTERNAL ROOT-->
<a *ngIf="menu.type == 'internal' && menu.route && isEnabled([menu.route], showPage)" routerLinkActive="uk-link"
routerLink="{{menu.route}}"
[queryParams]="menu.params"
[fragment]="menu.fragment">
{{menu.title}}
</a>
<!-- EXTERNAL ROOT-->
<a *ngIf="menu.type == 'external' && menu.url"
href="{{menu.url}}"
target="_blank">
{{menu.title}}
</a>
<!-- NO ACTION ROOT-->
<a *ngIf="menu.type == 'noAction'">
{{menu.title}}
</a>
<div *ngIf="menu.items.length > 0" class="uk-navbar-dropdown uk-navbar-dropdown-bottom-left"
style="top: 80px; left: 0px;" id="{{menu._id}}" uk-toggle>
<div class="uk-navbar-dropdown-grid uk-child-width-1-1 uk-grid uk-grid-stack" uk-grid="">
<div class="uk-first-column uk-height-max-medium uk-overflow-auto">
<ul class="uk-nav uk-navbar-dropdown-nav">
<ng-container *ngFor="let submenu of menu.items">
<li>
<!-- INTERNAL CHILD -->
<a *ngIf="submenu.type == 'internal' && submenu.route && isEnabled([submenu.route], showPage)" routerLinkActive="uk-link"
routerLink="{{submenu.route}}"
[queryParams]="submenu.params"
[fragment]="submenu.fragment"
[class.uk-active]="isTheActiveMenuItem(submenu)">
{{submenu.title}}
</a>
<!-- EXTERNAL CHILD -->
<a *ngIf="submenu.type == 'external' && submenu.url" routerLinkActive="uk-link"
href="{{submenu.url}}"
target="_blank">
{{submenu.title}}
</a>
</li>
</ng-container>
</ul>
</div>
</div>
</div>
</li>
</ng-container>
</ng-container>
</ul> </ul>
<!-- </div> --> <!-- </div> -->

15
sharedComponents/navigationBar.component.ts
View File

@ -5,6 +5,7 @@ import {ConfigurationService} from '../utils/configuration/configuration.service
import {MenuItem, RootMenuItem} from './menu'; import {MenuItem, RootMenuItem} from './menu';
import {EnvProperties} from '../utils/properties/env-properties'; import {EnvProperties} from '../utils/properties/env-properties';
import {Subscription} from 'rxjs'; import {Subscription} from 'rxjs';
import {HelpContentService} from '../services/help-content.service';
export interface Header { export interface Header {
route?: string, route?: string,
@ -49,10 +50,12 @@ export class NavigationBarComponent implements OnInit, OnDestroy {
showPage = {}; showPage = {};
specialAnnouncementContent: string = null; specialAnnouncementContent: string = null;
public customMenuItems: MenuItem[] = [];
constructor(private router: Router, constructor(private router: Router,
private route: ActivatedRoute, private route: ActivatedRoute,
private config: ConfigurationService) { private config: ConfigurationService,
private _helpContentService: HelpContentService) {
} }
ngOnInit() { ngOnInit() {
@ -100,6 +103,16 @@ export class NavigationBarComponent implements OnInit, OnDestroy {
this.handleError('Error getting community information (e.g. pages,entities) for community with id: ' + this.communityId, error); this.handleError('Error getting community information (e.g. pages,entities) for community with id: ' + this.communityId, error);
})); }));
} }
if(this.portal != 'connect') {
this.subs.push(
this._helpContentService.getMenuItems(this.portal).subscribe(
data => {
this.customMenuItems = data;
},
error => this.handleError("Server error fetching custom menu items", error)
)
);
}
} }

3
sharedComponents/navigationBar.module.ts
View File

@ -8,6 +8,7 @@ import { NavigationBarComponent} from './navigationBar.component';
import { UserMiniModule} from '../login/userMiniModule.module'; import { UserMiniModule} from '../login/userMiniModule.module';
import {SearchBarModule} from "./searchBar/searchBar.module"; import {SearchBarModule} from "./searchBar/searchBar.module";
import {HelpContentService} from '../services/help-content.service';
@NgModule({ @NgModule({
imports: [ imports: [
@ -19,7 +20,7 @@ import {SearchBarModule} from "./searchBar/searchBar.module";
declarations: [ declarations: [
NavigationBarComponent NavigationBarComponent
], ],
providers:[], providers:[HelpContentService],
exports: [ exports: [
NavigationBarComponent NavigationBarComponent
] ]

20
utils/string-utils.class.ts
View File

@ -1,8 +1,9 @@
import {UrlSegment} from '@angular/router'; import {UrlSegment} from '@angular/router';
import {AbstractControl, ValidatorFn, Validators} from "@angular/forms"; import {AbstractControl, ValidationErrors, ValidatorFn, Validators} from "@angular/forms";
import {Stakeholder} from "../monitor/entities/stakeholder"; import {Stakeholder} from "../monitor/entities/stakeholder";
import {CommunityInfo} from "../connect/community/communityInfo"; import {CommunityInfo} from "../connect/community/communityInfo";
import {properties} from "../../../environments/environment"; import {properties} from "../../../environments/environment";
import {Page} from "./entities/adminTool/page";
export class Dates { export class Dates {
public static yearMin = 1800; public static yearMin = 1800;
@ -247,6 +248,8 @@ export class StringUtils {
'[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9]\.[^\s]{2,}|https?:\/\/(?:www\.|(?!www))[a-zA-Z0-9]+\.[^\s]{2,}|www\.' + '[a-zA-Z0-9][a-zA-Z0-9-]+[a-zA-Z0-9]\.[^\s]{2,}|https?:\/\/(?:www\.|(?!www))[a-zA-Z0-9]+\.[^\s]{2,}|www\.' +
'[a-zA-Z0-9]+\.[^\s]{2,}'; '[a-zA-Z0-9]+\.[^\s]{2,}';
public static routeRegex = '^[a-zA-Z0-9\/][a-zA-Z0-9\/-]*$';
public static urlPrefix(url: string): string { public static urlPrefix(url: string): string {
if (url.startsWith("http://") || url.startsWith("https://") || url.startsWith("//")) { if (url.startsWith("http://") || url.startsWith("https://") || url.startsWith("//")) {
return ""; return "";
@ -302,6 +305,21 @@ export class StringUtils {
return Validators.pattern(StringUtils.urlRegex); return Validators.pattern(StringUtils.urlRegex);
} }
public static validRoute(pages: any[], field: string, initial: string = null): ValidatorFn {
return (control: AbstractControl): ValidationErrors | null => {
if(control.value) {
if(!new RegExp(this.routeRegex).test(control.value)) {
return {error: 'Route should contain only letters or numbers, e.g /route or route'}
}
if(pages && pages.length > 0 && control.value !== initial) {
const forbidden = pages.filter(page => page[field].replace('/', '') === control.value.replace('/', '')).length > 0;
return forbidden ? {error: 'This route is used by an other page'} : null;
}
}
return null;
};
}
public static sliceString(mystr, size: number): string { public static sliceString(mystr, size: number): string {
const sliced = String(mystr).substr(0, size); const sliced = String(mystr).substr(0, size);
return sliced + (String(mystr).length > size ? '...' : ''); return sliced + (String(mystr).length > size ? '...' : '');