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

1. Navbar: Change navbar to be sticky always. 2. Search Filter: Add new inputs. 3. Page-content: Remove offset changing base on menu. 4. Pages add new search-input. 5. Advanced Search Input: Add enter behaviour and make inputs by default equal size.

This commit is contained in:
Konstantinos Triantafyllou 2022-04-07 18:17:52 +03:00
parent ac3e721dfc
commit f20fe90aa2
8 changed files with 138 additions and 189 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -15,9 +15,9 @@
<div *ngIf="showLoading" class="uk-position-center">
<loading></loading>
</div>
<div *ngIf="!showLoading">
<div class="uk-grid uk-margin-medium-bottom" uk-grid>
<div class="uk-width-expand">
<ng-container *ngIf="!showLoading">
<div class="uk-grid uk-flex-middle uk-margin-top uk-margin-medium-bottom" uk-grid>
<div class="uk-width-expand@m uk-width-1-1">
<ul class="uk-subnav uk-subnav-pill">
<li [class.uk-active]="filterForm.get('type').value === 'all'"><a
(click)="filterForm.get('type').setValue('all')"><span>All pages</span></a></li>
@ -26,18 +26,11 @@
(click)="filterForm.get('type').setValue(type.value)"><span>{{type.label}}</span></a></li>
</ul>
</div>
<div
class="uk-flex uk-flex-center uk-flex-wrap uk-flex-middle uk-grid"
uk-grid>
<div #searchInputComponent search-input [control]="filterForm.controls.keyword" [showSearch]="false"
placeholder="Search page"
[selected]="selectedKeyword" (closeEmitter)="onSearchClose()" (resetEmitter)="reset()"
[bordered]="true" colorClass="uk-text-secondary"
class="uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1"></div>
<div class="uk-width-1-3@m uk-width-1-1 uk-flex uk-flex-center uk-flex-wrap uk-flex-middle uk-grid" uk-grid>
<div search-input [expandable]="true" [searchControl]="filterForm.get('keyword')" searchInputClass="outer" placeholder="Search page" class="uk-width-expand"></div>
<div *ngIf="isPortalAdministrator">
<a (click)="newPage()"
class="uk-flex uk-flex-middle uk-text-uppercase">
class="uk-flex uk-flex-middle uk-text-uppercase">
<button class="large uk-icon-button uk-button-secondary">
<icon name="add"></icon>
</button>
@ -46,111 +39,109 @@
</div>
</div>
</div>
</div>
<div *ngIf="!showLoading && checkboxes.length > 0" class="uk-padding uk-padding-remove-top">
<div
class="uk-display-inline"
[attr.uk-tooltip]="getSelectedPages().length == 0 ? 'pos:left; cls: uk-active' : null"
title="Select at least one page"><input id="checkAll" type="checkbox" (click)="selectAll()"
[ngModel]="getSelectedPages().length ==checkboxes.length"/>
<span *ngIf="getSelectedPages().length > 0" class="uk-margin-left uk-text-muted">
<div *ngIf="checkboxes.length > 0" class="uk-section uk-section-small">
<div
class="uk-display-inline"
[attr.uk-tooltip]="getSelectedPages().length == 0 ? 'pos:left; cls: uk-active' : null"
title="Select at least one page"><input id="checkAll" type="checkbox" (click)="selectAll()"
[ngModel]="getSelectedPages().length ==checkboxes.length"/>
<span *ngIf="getSelectedPages().length > 0" class="uk-margin-left uk-text-muted">
{{getSelectedPages().length}} pages selected </span>
<a class="uk-margin-left">Actions</a>
<div uk-dropdown="mode: click">
<ul class="uk-nav uk-dropdown-nav"
[attr.uk-tooltip]="getSelectedPages().length == 0 ? 'pos:left; cls: uk-active' : 'cls: uk-invisible'"
title="Select at least one page">
<li *ngIf="!isPortalAdministrator"><a [class]="getSelectedPages().length == 0 ? 'uk-disabled' : ''"
(click)="togglePages(true,getSelectedPages())"><i></i> Enable
</a></li>
<li *ngIf="!isPortalAdministrator"><a [class]="getSelectedPages().length == 0 ? 'uk-disabled' : ''"
(click)="togglePages(false,getSelectedPages())"><i></i> Disable
</a>
</li>
<li *ngIf="isPortalAdministrator"><a [class]="getSelectedPages().length == 0 ? 'uk-disabled' : ''"
(click)="confirmDeleteSelectedPages()"><i></i> Delete </a></li>
</ul>
<a class="uk-margin-left">Actions</a>
<div uk-dropdown="mode: click">
<ul class="uk-nav uk-dropdown-nav"
[attr.uk-tooltip]="getSelectedPages().length == 0 ? 'pos:left; cls: uk-active' : 'cls: uk-invisible'"
title="Select at least one page">
<li *ngIf="!isPortalAdministrator"><a [class]="getSelectedPages().length == 0 ? 'uk-disabled' : ''"
(click)="togglePages(true,getSelectedPages())"><i></i> Enable
</a></li>
<li *ngIf="!isPortalAdministrator"><a [class]="getSelectedPages().length == 0 ? 'uk-disabled' : ''"
(click)="togglePages(false,getSelectedPages())"><i></i> Disable
</a>
</li>
<li *ngIf="isPortalAdministrator"><a [class]="getSelectedPages().length == 0 ? 'uk-disabled' : ''"
(click)="confirmDeleteSelectedPages()"><i></i> Delete </a></li>
</ul>
</div>
</div>
</div>
</div>
<div *ngIf="!showLoading">
<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">
<div class="uk-grid uk-grid-divider uk-padding" uk-grid>
<div class="uk-grid uk-width-expand" uk-grid>
<div class=""><input id="{{check.page._id}}" class="checkBox" type="checkbox"
name="pagescb[]" value="{{check.page._id}}" [(ngModel)]="check.checked">
</div>
<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 *ngIf="!portal && check.page.portalPid" class=" uk-margin-small-bottom">
<span class="title">Portal PID: </span>{{check.page.portalPid}}
</div>
</div>
<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">
<div class="title uk-margin-medium-bottom">Help texts</div>
<div class=" uk-margin-small-bottom">
<a *ngIf="check.page.top || check.page.bottom || check.page.left || check.page.right"
class="helpContents"
[queryParams]="{pageId: check.page._id}"
routerLink="../helptexts">
Manage page help texts
<span *ngIf="pageHelpContentsCount[check.page._id]">({{pageHelpContentsCount[check.page._id]}})</span>
</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 *ngIf="!isPortalAdministrator" class="uk-width-1-4">
<div class="title uk-margin-medium-bottom">Enable/disable</div>
<mat-slide-toggle [checked]="check.page.isEnabled"
(change)="($event.source.checked = check.page.isEnabled);togglePages(!check.page.isEnabled,[check.page._id])"
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>">
</mat-slide-toggle>
</div>
</div>
<div *ngIf="isPortalAdministrator || (check.page.portalType == properties.adminToolsPortalType && check.page.portalPid == portal)" class="uk-width-1-5">
<div class="uk-flex uk-flex-center uk-flex-column uk-height-1-1">
<div class="uk-flex uk-flex-center">
<div class="actions">
<button [disabled]="!portal && check.page.portalPid" [attr.uk-tooltip]="((!portal && check.page.portalPid)?'This page belongs to ' + check.page.portalPid:null)"
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>
</li>
<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">
<div class="uk-grid uk-grid-divider uk-padding" uk-grid>
<div class="uk-grid uk-width-expand" uk-grid>
<div class=""><input id="{{check.page._id}}" class="checkBox" type="checkbox"
name="pagescb[]" value="{{check.page._id}}" [(ngModel)]="check.checked">
</div>
<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 *ngIf="!portal && check.page.portalPid" class=" uk-margin-small-bottom">
<span class="title">Portal PID: </span>{{check.page.portalPid}}
</div>
</div>
<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">
<div class="title uk-margin-medium-bottom">Help texts</div>
<div class=" uk-margin-small-bottom">
<a *ngIf="check.page.top || check.page.bottom || check.page.left || check.page.right"
class="helpContents"
[queryParams]="{pageId: check.page._id}"
routerLink="../helptexts">
Manage page help texts
<span *ngIf="pageHelpContentsCount[check.page._id]">({{pageHelpContentsCount[check.page._id]}})</span>
</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 *ngIf="!isPortalAdministrator" class="uk-width-1-4">
<div class="title uk-margin-medium-bottom">Enable/disable</div>
<mat-slide-toggle [checked]="check.page.isEnabled"
(change)="($event.source.checked = check.page.isEnabled);togglePages(!check.page.isEnabled,[check.page._id])"
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>">
</mat-slide-toggle>
</div>
</div>
<div *ngIf="isPortalAdministrator || (check.page.portalType == properties.adminToolsPortalType && check.page.portalPid == portal)" class="uk-width-1-5">
<div class="uk-flex uk-flex-center uk-flex-column uk-height-1-1">
<div class="uk-flex uk-flex-center">
<div class="actions">
<button [disabled]="!portal && check.page.portalPid" [attr.uk-tooltip]="((!portal && check.page.portalPid)?'This page belongs to ' + check.page.portalPid:null)"
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>
</li>
</ul>
<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>
</ul>
<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>
</ng-container>
</div>
</div>
<modal-alert #editModal (alertOutput)="pageSaveConfirmed($event)"

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

@ -64,8 +64,6 @@ export class PagesComponent implements OnInit {
private subscriptions: any[] = [];
public portalUtils: PortalUtils = new PortalUtils();
private index: number;
public selectedKeyword: string;
@ViewChild('searchInputComponent') searchInputComponent: SearchInputComponent;
pageHelpContentsCount = {};
pageClassContentsCount = {};
public stickyPageHeader: boolean = false;
@ -434,15 +432,6 @@ export class PagesComponent implements OnInit {
}
}
public onSearchClose() {
this.selectedKeyword = this.filterForm.get('keyword').value;
}
public reset() {
this.selectedKeyword = null;
this.searchInputComponent.reset()
}
selectAll() {
let checked = this.getSelectedPages().length != this.checkboxes.length;
for (let check of this.checkboxes) {

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

@ -1,4 +1,4 @@
import {AfterViewInit, Component, ElementRef, EventEmitter, OnDestroy, OnInit, Output, ViewChild} from "@angular/core";
import {AfterViewInit, Component, EventEmitter, OnDestroy, OnInit, Output} from "@angular/core";
import {Subscription} from "rxjs";
declare var UIkit;
@ -8,7 +8,7 @@ declare var UIkit;
template: `
<div id="page_content">
<div id="header">
<div id="page_content_header" [attr.uk-sticky]="shouldSticky?'media: @m':null" [attr.offset]="shouldSticky?offset:null">
<div id="page_content_header" [attr.uk-sticky]="shouldSticky?'media: @m':null" [attr.offset]="offset">
<div class="uk-container uk-container-large uk-padding-remove-vertical">
<div class="uk-padding-small uk-padding-remove-vertical">
<ng-content select="[header]"></ng-content>
@ -60,12 +60,6 @@ export class PageContentComponent implements OnInit, AfterViewInit, OnDestroy {
initSticky() {
this.clear();
if(this.shouldSticky) {
this.subscriptions.push(UIkit.util.on(document, 'active', '#sticky-menu', () => {
this.offset = Number.parseInt(getComputedStyle(document.documentElement).getPropertyValue('--structure-header-height'));
}));
this.subscriptions.push(UIkit.util.on(document, 'inactive', '#sticky-menu', () => {
this.offset = 0;
}));
this.subscriptions.push(UIkit.util.on(document, 'active', '#page_content_header', () => {
this.sticky = true;
this.stickyEmitter.emit(this.sticky);

38
searchPages/searchUtils/searchFilter.component.html
View File

@ -16,41 +16,17 @@
<span *ngIf="!isOpen">+ View all</span>
</a>
<div *ngIf="isOpen" class="uk-text-small uk-margin-small-bottom">
<div class="">
<span class="uk-text-meta uk-margin-small-left">Top 100 values are
shown in the filters</span>
<div class="uk-grid uk-margin-small-left uk-flex uk-flex-bottom">
<!-- <input class="uk-input uk-margin-small-top uk-form-small uk-width-2-3@m uk-width-3-5@s text-input-box "
name="filter-keyword"
placeholder="Search..." type="text" [(ngModel)]="keyword"> -->
<div input class="uk-width-2-3@m uk-width-3-5@s" placeholder="Search"
inputClass="inner x-small" [(value)]="keyword"></div>
<span *ngIf="showResultCount === true"
class="uk-width-1-3@m uk-width-2-5@s uk-padding-small uk-padding-remove-vertical uk-padding-remove-right">
<span class="uk-width-1-4 uk-text-muted"> Sort by:</span>
<!-- <select [(ngModel)]="sortBy"
class=" uk-width-expand uk-select uk-hidden@m uk-form-small"
id="form-horizontal-select" name="select_order">
<option value="num">Results number</option>
<option value="name">Name</option>
</select>-->
<mat-select [(ngModel)]="sortBy" (ngModelChange)="sort(filter.values)"
class="uk-width-expand matSelection uk-visible@m"
id="form-horizontal-select1" name="select_order"
[disableOptionCentering]="true" panelClass="matSelectionPanel">
<mat-option value="num">Results number</mat-option>
<mat-option value="name">Name</mat-option>
</mat-select>
</span>
<div class="uk-margin-small-left">
<div class="uk-text-meta">Top 100 values are shown in the filters</div>
<div class="uk-flex uk-flex-bottom uk-margin-top">
<div input class="uk-width-1-2@m uk-margin-right" [placeholder]="{label: 'Search', static: true}" inputClass="inner x-small" [(value)]="keyword"></div>
<div *ngIf="showResultCount === true" input type="select" class="uk-width-expand" placeholder="Sort by" inputClass="border-bottom" [(value)]="sortBy" [options]="sortByOptions"></div>
</div>
</div>
<div class="uk-overflow-auto uk-height-max-small uk-padding-remove
uk-margin-small-left uk-margin-small-right uk-margin-small-top uk-width-1-1">
<div class="uk-overflow-auto uk-height-max-small uk-margin-small-left uk-margin-small-right uk-margin-top">
<ng-container *ngFor="let value of this.sortedValues">
<div *ngIf="filterKeywords(value.name)" title="{{value.name}}"
class="uk-animation-fade filterItem searchFilterItem uk-text-small">
class="uk-animation-fade uk-text-small">
<ng-container
*ngTemplateOutlet="input_label_wrapper; context: {filter: filter, value: value}"></ng-container>
</div>

2
searchPages/searchUtils/searchFilter.component.ts
View File

@ -11,6 +11,7 @@ import {Filter, Value} from './searchHelperClasses.class';
import {ActivatedRoute, Router} from "@angular/router";
import {SearchFields} from "../../utils/properties/searchFields";
import {HelperFunctions} from "../../utils/HelperFunctions.class";
import {Option} from "../../sharedComponents/input/input.component";
@Component({
selector: 'search-filter',
templateUrl: 'searchFilter.component.html'
@ -33,6 +34,7 @@ export class SearchFilterComponent implements OnInit, OnChanges {
@Output() onFilterChange = new EventEmitter();
keyword = "";
sortBy: "name" | "num" = "name";
sortByOptions: Option[] = [{label: 'Results number', value: 'num'}, {label: 'Name', value: 'name'}];
queryParams = {};
paramPosition = 0;
@Input() actionRoute: boolean = false;

18
sharedComponents/advanced-search-input/advanced-search-input.component.ts
View File

@ -2,7 +2,7 @@ import {
AfterContentInit,
Component,
ContentChildren,
EventEmitter,
EventEmitter, HostListener,
Input,
OnDestroy,
Output,
@ -13,10 +13,10 @@ import {InputComponent} from "../input/input.component";
@Component({
selector: 'advanced-search-input',
template: `
<div class="search-input" [ngClass]="searchInputClass" [class.small-vertical]="smallVertical">
<div class="uk-grid uk-flex-middle" uk-grid>
<div *ngIf="inputs.length > 0" class="search-input" [ngClass]="searchInputClass" [class.small-vertical]="smallVertical">
<div class="uk-flex uk-flex-middle">
<div class="uk-width-expand">
<div class="uk-grid uk-grid-collapse inputs" uk-grid>
<div class="uk-grid uk-grid-collapse inputs" [ngClass]="'uk-child-width-1-' + inputs.length" uk-grid>
<ng-content></ng-content>
</div>
</div>
@ -36,6 +36,16 @@ export class AdvancedSearchInputComponent implements AfterContentInit, OnDestroy
@Input() smallVertical: boolean = false;
@Output() searchEmitter: EventEmitter<void> = new EventEmitter<void>();
@HostListener('window:keydown', ['$event'])
keyEvent(event: KeyboardEvent) {
if(this.inputs.toArray().filter(input => input.focused).length > 0) {
if(event.code === 'Enter') {
event.preventDefault();
this.searchEmitter.emit();
}
}
}
constructor() {
}

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

@ -65,12 +65,9 @@ declare var UIkit;
<div *ngIf="!formControl.value && placeholderInfo.static" class="input placeholder">{{placeholderInfo.label}}</div>
</ng-template>
<ng-template [ngIf]="type === 'autocomplete'">
<div class="uk-grid uk-width-expand" uk-grid>
<div class="uk-width-expand">
<input [attr.placeholder]="placeholderInfo.static?placeholderInfo.label:hint"
#searchInput class="input" [formControl]="searchControl">
</div>
</div>
<input *ngIf="focused" [attr.placeholder]="placeholderInfo.static?placeholderInfo.label:hint"
#searchInput class="input" [formControl]="searchControl">
<div *ngIf="!focused" class="input">{{getLabel(formAsControl.value)}}</div>
</ng-template>
<ng-template [ngIf]="type === 'chips'">
<div class="uk-grid uk-grid-small uk-grid-row-collapse uk-width-expand" uk-grid>
@ -89,12 +86,12 @@ declare var UIkit;
</div>
</ng-template>
<div *ngIf="formControl.disabled || icon || (type === 'select' && selectArrow) || type === 'autocomplete'"
class="uk-margin-left uk-margin-right icon">
class="uk-margin-left icon">
<icon *ngIf="formControl.disabled" [name]="'lock'" [flex]="true"></icon>
<ng-template [ngIf]="formControl.enabled">
<icon *ngIf="!formControl.value && icon" [name]="icon" [flex]="true"></icon>
<icon *ngIf="!icon && type === 'select' && selectArrow" name="arrow_drop_down" [flex]="true"></icon>
<icon *ngIf="formControl.value && type === 'autocomplete'" class="clickable" (click)="resetSearch($event)"
<icon *ngIf="searchControl?.value && type === 'autocomplete'" class="clickable" (click)="resetSearch($event)"
[flex]="true" name="close"></icon>
</ng-template>
</div>
@ -335,9 +332,6 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
if (!this.searchControl) {
this.searchControl = new FormControl('', this.validators);
}
if(this.formAsControl) {
this.searchControl.setValue(this.getLabel(this.formControl.value));
}
this.subscriptions.push(this.searchControl.valueChanges.subscribe(value => {
this.filteredOptions = this.filter(value);
this.cdr.detectChanges();
@ -364,9 +358,6 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
} else {
this.formControl.markAsDirty();
}
if (this.searchControl && this.formAsControl) {
this.searchControl.setValue(this.getLabel(this.formControl.value));
}
this.valueChange.emit(this.formControl.value);
}));
if (this.input) {
@ -434,6 +425,7 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
this.formControl.markAsTouched();
}
this.focused = value;
this.cdr.detectChanges();
if (this.focused) {
if (this.input) {
this.input.nativeElement.focus();
@ -451,7 +443,7 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
this.open(false);
if (this.searchControl) {
if(this.formAsControl) {
this.searchControl.setValue(this.getLabel(this.formControl.value));
this.searchControl.setValue('');
}
this.add(event);
}
@ -477,9 +469,6 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
resetSearch(event: any) {
event.stopPropagation();
this.formControl.markAsDirty();
this.formControl.setValue(null);
this.focus(true);
this.searchControl.setValue('');
}

4
sharedComponents/navigationBar.component.html
View File

@ -93,9 +93,7 @@
</div>
</div>
<div id="main-menu" class="uk-visible@m">
<div id="sticky-menu" class="uk-navbar-container" [ngClass]="portal + '-menu'"
uk-sticky="show-on-up: true; top: #main-menu" media="@m" cls-active="uk-active uk-navbar-sticky"
[attr.animation]="(header.stickyAnimation?'uk-animation-slide-top':null)">
<div id="sticky-menu" class="uk-navbar-container" [ngClass]="portal + '-menu'" uk-sticky media="@m">
<div
*ngIf="(properties.environment =='beta' || properties.environment =='development') && showLogo && header.badge">
<img class="uk-position-top-left"