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

[Library | Trunk]: Change search input on admin-tools pages 

git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-services-library/trunk/ng-openaire-library/src/app@60341 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
k.triantafyllou 2021-02-02 12:29:18 +00:00
parent f1cc59da34
commit a5a57976dd
10 changed files with 66 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -14,8 +14,9 @@
</ul>
</div>
<div class="uk-width-1-1 uk-flex uk-flex-right@m uk-flex-center uk-flex-wrap uk-flex-middle uk-grid" uk-grid>
<div search-input [control]="filterForm.controls.keyword" [showSearch]="false" placeholder="Search"
[bordered]="true" colorClass="uk-text-secondary"></div>
<div #searchInputComponent search-input [control]="filterForm.controls.keyword" [showSearch]="false" placeholder="Search class"
[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="show-options">
<button class="uk-button uk-button-secondary">Bulk Actions</button>
<div uk-dropdown="mode: click">

13
dashboard/divId/divIds.component.ts
View File

@ -14,6 +14,7 @@ import {properties} from "../../../../environments/environment";
import {PortalUtils} from "../portal/portalHelper";
import {AlertModal} from "../../utils/modal/alert";
import {Option} from "../../sharedComponents/input/input.component";
import {SearchInputComponent} from "../../sharedComponents/search-input/search-input.component";
declare var UIkit;
@ -46,7 +47,8 @@ export class DivIdsComponent implements OnInit {
selectedCommunityPid = null;
public portalUtils:PortalUtils = new PortalUtils();
private index: number;
public selectedKeyword: string;
@ViewChild('searchInputComponent') searchInputComponent: SearchInputComponent;
ngOnInit() {
this.filterForm = this._fb.group({
@ -350,4 +352,13 @@ export class DivIdsComponent implements OnInit {
error => this.handleError('System error retrieving pages', error)
));
}
public onSearchClose() {
this.selectedKeyword = this.filterForm.get('keyword').value;
}
public reset() {
this.selectedKeyword = null;
this.searchInputComponent.reset()
}
}

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

@ -14,8 +14,9 @@
</ul>
</div>
<div class="uk-width-1-1 uk-flex uk-flex-right@m uk-flex-center uk-flex-wrap uk-flex-middle uk-grid" uk-grid>
<div search-input [control]="filterForm.controls.keyword" [showSearch]="false" placeholder="Search entity"
[bordered]="true" colorClass="uk-text-secondary"></div>
<div #searchInputComponent search-input [control]="filterForm.controls.keyword" [showSearch]="false" placeholder="Search entity"
[selected]="selectedKeyword" (closeEmitter)="onSearchClose()" (resetEmitter)="reset()"
[bordered]="true" colorClass="uk-text-secondary" class="uk-width-1-3@xl uk-width-2-5@l uk-width-1-2@m uk-width-1-1"></div>
<div class="show-options">
<button class="uk-button uk-button-secondary">Bulk Actions</button>
<div uk-dropdown="mode: click">

12
dashboard/entity/entities.component.ts
View File

@ -12,6 +12,7 @@ import {Subscriber} from "rxjs";
import {properties} from "../../../../environments/environment";
import {ConnectHelper} from "../../connect/connectHelper";
import {AlertModal} from "../../utils/modal/alert";
import {SearchInputComponent} from "../../sharedComponents/search-input/search-input.component";
declare var UIkit;
@ -50,6 +51,8 @@ export class EntitiesComponent implements OnInit {
public filterForm: FormGroup;
private subscriptions: any[] = [];
private index: number;
public selectedKeyword: string;
@ViewChild('searchInputComponent') searchInputComponent: SearchInputComponent;
constructor(private element: ElementRef, private route: ActivatedRoute,
private _router: Router,
@ -377,4 +380,13 @@ export class EntitiesComponent implements OnInit {
);
}
}
public onSearchClose() {
this.selectedKeyword = this.filterForm.get('keyword').value;
}
public reset() {
this.selectedKeyword = null;
this.searchInputComponent.reset()
}
}

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

@ -12,8 +12,9 @@
</ul>
</div>
<div class="uk-width-1-1 uk-flex uk-flex-right@m uk-flex-center uk-flex-wrap uk-flex-middle uk-grid" uk-grid>
<div search-input [control]="filterForm.controls.keyword" [showSearch]="false" placeholder="Search page"
[bordered]="true" colorClass="uk-text-secondary"></div>
<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="show-options">
<button class="uk-button uk-button-secondary">Bulk Actions</button>
<div uk-dropdown="mode: click">

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

@ -14,6 +14,7 @@ import {properties} from "../../../../environments/environment";
import {ConnectHelper} from "../../connect/connectHelper";
import {Option} from "../../sharedComponents/input/input.component";
import {AlertModal} from "../../utils/modal/alert";
import {SearchInputComponent} from "../../sharedComponents/search-input/search-input.component";
declare var UIkit;
@ -63,6 +64,8 @@ export class PagesComponent implements OnInit {
private subscriptions: any[] = [];
public portalUtils: PortalUtils = new PortalUtils();
private index: number;
public selectedKeyword: string;
@ViewChild('searchInputComponent') searchInputComponent: SearchInputComponent;
constructor(private element: ElementRef, private route: ActivatedRoute,
private _router: Router, private _helpContentService: HelpContentService,
@ -501,4 +504,13 @@ export class PagesComponent implements OnInit {
public capitalizeFirstLetter(str: string) {
return str.charAt(0).toUpperCase() + str.slice(1);
}
public onSearchClose() {
this.selectedKeyword = this.filterForm.get('keyword').value;
}
public reset() {
this.selectedKeyword = null;
this.searchInputComponent.reset()
}
}

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

@ -14,8 +14,9 @@
</ul>
</div>
<div class="uk-width-1-1 uk-flex uk-flex-right@m uk-flex-center uk-flex-wrap uk-flex-middle uk-grid" uk-grid>
<div search-input [control]="filterForm.controls.keyword" [showSearch]="false" placeholder="Search page"
[bordered]="true" colorClass="uk-text-secondary"></div>
<div #searchInputComponent search-input [control]="filterForm.controls.keyword" [showSearch]="false" placeholder="Search portal"
[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="show-options">
<button class="uk-button uk-button-secondary">Bulk Actions</button>
<div uk-dropdown="mode: click">

12
dashboard/portal/portals.component.ts
View File

@ -12,6 +12,7 @@ import {CheckPortal, Portal} from "../../utils/entities/adminTool/portal";
import {PortalUtils} from "./portalHelper";
import {properties} from "../../../../environments/environment";
import {AlertModal} from "../../utils/modal/alert";
import {SearchInputComponent} from "../../sharedComponents/search-input/search-input.component";
declare var UIkit;
@ -44,6 +45,8 @@ export class PortalsComponent implements OnInit {
public modalErrorMessage = '';
public portalUtils: PortalUtils = new PortalUtils();
private index: number;
public selectedKeyword: string;
@ViewChild('searchInputComponent') searchInputComponent: SearchInputComponent;
ngOnInit() {
this.filterForm = this._fb.group({
@ -326,4 +329,13 @@ export class PortalsComponent implements OnInit {
console.log('Server responded: ' + error);
this.showLoading = false;
}
public onSearchClose() {
this.selectedKeyword = this.filterForm.get('keyword').value;
}
public reset() {
this.selectedKeyword = null;
this.searchInputComponent.reset()
}
}

2
sharedComponents/search-input/search-input.component.css
View File

@ -22,7 +22,7 @@ input::placeholder {
font-size: 14px;
}
.search-mobile {
.search-input {
padding-bottom: 5px;
border-bottom: 2px solid currentColor;
}

7
sharedComponents/search-input/search-input.component.ts
View File

@ -6,8 +6,8 @@ import {MatAutocompleteTrigger} from '@angular/material/autocomplete';
selector: '[search-input]',
styleUrls: ['search-input.component.css'],
template: `
<div class="uk-flex uk-flex-middle uk-flex-center search-mobile" [ngClass]="colorClass">
<div *ngIf="control" class="uk-width-expand" [class.bordered]="bordered">
<div class="uk-flex uk-flex-middle uk-flex-center search-input" [ngClass]="colorClass">
<div *ngIf="control" class="uk-width-expand" [class.bordered]="bordered && showSearch">
<form (ngSubmit)="search()">
<input #input type="text" class="uk-width-1-1"
[class.uk-animation-slide-right-medium]="showSearch"
@ -76,6 +76,8 @@ export class SearchInputComponent {
searchEmitter: EventEmitter<boolean> = new EventEmitter<boolean>();
@Output()
resetEmitter: EventEmitter<any> = new EventEmitter<any>();
@Output()
closeEmitter: EventEmitter<any> = new EventEmitter<any>();
toggle() {
if(!this.selected) {
@ -90,6 +92,7 @@ export class SearchInputComponent {
closeSearch() {
this.showSearch = false;
this.closeEmitter.emit();
}
public search(emit = true) {