This is an automated email from the ASF dual-hosted git repository.
tobiasistvan pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/ambari-logsearch.git
The following commit(s) were added to refs/heads/master by this push:
new 02ae3ad [AMBARI-24891] [Log Serach UI] The Log Index Filter panel
does not work (#23)
02ae3ad is described below
commit 02ae3ad0ee9df1e82a08f336b565fa826a3d16e8
Author: Istvan Tobias <[email protected]>
AuthorDate: Fri Nov 16 10:36:47 2018 +0100
[AMBARI-24891] [Log Serach UI] The Log Index Filter panel does not work
(#23)
* [AMBARI-24891] [Log Serach UI] The Log Index Filter panel does not work -
dropdown selection fixes
* [AMBARI-24891] [Log Serach UI] The Log Index Filter panel does not work -
auto selection fix
---
.../action-menu/action-menu.component.ts | 3 +++
.../filter-button/filter-button.component.ts | 2 +-
.../menu-button/menu-button.component.html | 2 +-
.../menu-button/menu-button.component.ts | 8 ++++++++
.../dropdown-button/dropdown-button.component.html | 8 +++++---
.../dropdown-button/dropdown-button.component.ts | 23 +++++++++++++++++++---
.../dropdown-list/dropdown-list.component.ts | 5 ++---
.../filter-dropdown/filter-dropdown.component.ts | 16 +--------------
8 files changed, 41 insertions(+), 26 deletions(-)
diff --git
a/ambari-logsearch-web/src/app/components/action-menu/action-menu.component.ts
b/ambari-logsearch-web/src/app/components/action-menu/action-menu.component.ts
index 721ae93..a5d9ae2 100644
---
a/ambari-logsearch-web/src/app/components/action-menu/action-menu.component.ts
+++
b/ambari-logsearch-web/src/app/components/action-menu/action-menu.component.ts
@@ -75,6 +75,9 @@ export class ActionMenuComponent implements OnInit,
OnDestroy {
this.selectedClusterName$.takeUntil(this.destroyed$).subscribe(
(clusterName: string) => this.setModalSubmitDisabled(!clusterName)
);
+ this.clustersListItems$.filter((items: ListItem[]) => items.some((item:
ListItem) => item.isChecked)).first()
+ .map((items: ListItem[]) => items.find((item: ListItem) =>
item.isChecked))
+ .subscribe((item) => this.selectedClusterName$.next(item.value));
}
ngOnDestroy() {
diff --git
a/ambari-logsearch-web/src/app/components/filter-button/filter-button.component.ts
b/ambari-logsearch-web/src/app/components/filter-button/filter-button.component.ts
index d6f24e5..21cc151 100644
---
a/ambari-logsearch-web/src/app/components/filter-button/filter-button.component.ts
+++
b/ambari-logsearch-web/src/app/components/filter-button/filter-button.component.ts
@@ -51,7 +51,7 @@ export class FilterButtonComponent extends
MenuButtonComponent implements Contro
}
writeValue(items: ListItem[]) {
- this.selection = items;
+ this.selection = items ? (Array.isArray(items) ? items : [items] ) : [];
}
registerOnChange(callback: any): void {
diff --git
a/ambari-logsearch-web/src/app/components/menu-button/menu-button.component.html
b/ambari-logsearch-web/src/app/components/menu-button/menu-button.component.html
index 7061def..28cde2b 100644
---
a/ambari-logsearch-web/src/app/components/menu-button/menu-button.component.html
+++
b/ambari-logsearch-web/src/app/components/menu-button/menu-button.component.html
@@ -15,7 +15,7 @@
limitations under the License.
-->
-<div #dropdown [ngClass]="{'dropdown': hasSubItems, 'text-center': true,
'open': dropdownIsOpen, 'disabled': isDisabled}">
+<div #dropdown [ngClass]="{'dropdown': hasSubItems, 'text-center': true,
'open': dropdownIsOpen, 'disabled': isDisabled, 'has-selection': hasSelection}">
<a class="dropdown-toggle" [ngClass]="(labelClass || '') + (hasCaret ? '
has-caret' : '')"
(click)="onMouseClick($event)"
(mousedown)="onMouseDown($event)">
diff --git
a/ambari-logsearch-web/src/app/components/menu-button/menu-button.component.ts
b/ambari-logsearch-web/src/app/components/menu-button/menu-button.component.ts
index faf2165..3174991 100644
---
a/ambari-logsearch-web/src/app/components/menu-button/menu-button.component.ts
+++
b/ambari-logsearch-web/src/app/components/menu-button/menu-button.component.ts
@@ -127,6 +127,14 @@ export class MenuButtonComponent {
return this.subItems && this.subItems.filter((option: ListItem): boolean
=> option.isChecked);
}
+ get hasSelection(): boolean {
+ return this.subItems && this.subItems.filter((option: ListItem): boolean
=> option.isChecked).length > 0;
+ }
+
+ get totalSelection(): number {
+ return this.subItems ? this.subItems.filter((option: ListItem): boolean =>
option.isChecked).length : 0;
+ }
+
constructor(private utils: UtilsService) {}
findItemIndexInList(item: ListItem, itemList: ListItem[] = this.subItems):
number {
diff --git
a/ambari-logsearch-web/src/app/modules/shared/components/dropdown-button/dropdown-button.component.html
b/ambari-logsearch-web/src/app/modules/shared/components/dropdown-button/dropdown-button.component.html
index 7140028..f4fdf4f 100644
---
a/ambari-logsearch-web/src/app/modules/shared/components/dropdown-button/dropdown-button.component.html
+++
b/ambari-logsearch-web/src/app/modules/shared/components/dropdown-button/dropdown-button.component.html
@@ -15,17 +15,19 @@
limitations under the License.
-->
-<div [ngClass]="{'dropup': isDropup}">
+<div [ngClass]="{'dropup': isDropup, 'has-selection': hasSelection}">
<button [ngClass]="['btn', 'dropdown-toggle', buttonClass]"
data-toggle="dropdown">
<span class="filter-label">
<span *ngIf="iconClass || label" [class.plain]="!isMultipleChoice &&
!hideCaret && showSelectedValue">
<span *ngIf="iconClass" [ngClass]="iconClass"></span>
- <span *ngIf="label && (!selection.length || isMultipleChoice ||
showCommonLabelWithSelection)"
+ <span *ngIf="label && (!hasSelection || isMultipleChoice ||
showCommonLabelWithSelection)"
[class.label-before-selection]="isSelectionDisplayable">
{{label}}
</span>
</span>
- <span *ngIf="isSelectionDisplayable">{{selection[0].label |
translate}}</span>
+ <span *ngIf="isSelectionDisplayable">
+ <span class="selected-item-label" *ngFor="let item of
selectedItems">{{ item.label | translate }}</span>
+ </span>
<span *ngIf="!hideCaret" class="caret"></span>
</span>
</button>
diff --git
a/ambari-logsearch-web/src/app/modules/shared/components/dropdown-button/dropdown-button.component.ts
b/ambari-logsearch-web/src/app/modules/shared/components/dropdown-button/dropdown-button.component.ts
index 74341ae..2d04f21 100644
---
a/ambari-logsearch-web/src/app/modules/shared/components/dropdown-button/dropdown-button.component.ts
+++
b/ambari-logsearch-web/src/app/modules/shared/components/dropdown-button/dropdown-button.component.ts
@@ -67,14 +67,31 @@ export class DropdownButtonComponent {
@Input()
useClearToDefaultSelection = false;
- protected selectedItems?: ListItem[] = [];
+ protected selectedItems: ListItem[] = [];
get selection(): ListItem[] {
return this.selectedItems;
}
set selection(items: ListItem[]) {
- this.selectedItems = items;
+ this.selectedItems = <ListItem[]>(Array.isArray(items) ? items : (items ||
[]));
+ if (this.selectedItems.length > 1 && !this.isMultipleChoice) {
+ this.selectedItems = this.selectedItems.slice(0, 1);
+ }
+ if (this.isMultipleChoice && this.options) {
+ this.options.forEach((option: ListItem): void => {
+ const selectionItem = this.selectedItems.find((item: ListItem):
boolean => this.utils.isEqual(item.value, option.value));
+ option.isChecked = !!selectionItem;
+ });
+ }
+ }
+
+ get hasSelection(): boolean {
+ return this.selectedItems.length > 0;
+ }
+
+ get totalSelection(): number {
+ return this.selectedItems.length;
}
// TODO handle case of selections with multiple items
@@ -84,7 +101,7 @@ export class DropdownButtonComponent {
* @returns {boolean}
*/
get isSelectionDisplayable(): boolean {
- return this.showSelectedValue && !this.isMultipleChoice &&
this.selection.length > 0;
+ return this.showSelectedValue && !this.isMultipleChoice &&
this.hasSelection;
}
constructor(
diff --git
a/ambari-logsearch-web/src/app/modules/shared/components/dropdown-list/dropdown-list.component.ts
b/ambari-logsearch-web/src/app/modules/shared/components/dropdown-list/dropdown-list.component.ts
index 9967c80..14537b6 100644
---
a/ambari-logsearch-web/src/app/modules/shared/components/dropdown-list/dropdown-list.component.ts
+++
b/ambari-logsearch-web/src/app/modules/shared/components/dropdown-list/dropdown-list.component.ts
@@ -20,9 +20,8 @@ import {
Component, OnChanges, AfterViewChecked, OnDestroy, SimpleChanges, Input,
Output, EventEmitter,
ViewChildren, ViewContainerRef, QueryList, ChangeDetectorRef, ElementRef,
ViewChild, OnInit
} from '@angular/core';
-import {Subscription} from 'rxjs/Subscription';
-import {ListItem} from '@app/classes/list-item';
-import {ComponentGeneratorService} from
'@app/services/component-generator.service';
+import { ListItem } from '@app/classes/list-item';
+import { ComponentGeneratorService } from
'@app/services/component-generator.service';
import { Subject } from 'rxjs/Subject';
@Component({
diff --git
a/ambari-logsearch-web/src/app/modules/shared/components/filter-dropdown/filter-dropdown.component.ts
b/ambari-logsearch-web/src/app/modules/shared/components/filter-dropdown/filter-dropdown.component.ts
index 669fcc9..b0c766e 100644
---
a/ambari-logsearch-web/src/app/modules/shared/components/filter-dropdown/filter-dropdown.component.ts
+++
b/ambari-logsearch-web/src/app/modules/shared/components/filter-dropdown/filter-dropdown.component.ts
@@ -36,20 +36,6 @@ export class FilterDropdownComponent extends
DropdownButtonComponent implements
private onChange;
- get selection(): ListItem[] {
- return this.selectedItems;
- }
-
- set selection(items: ListItem[]) {
- this.selectedItems = items;
- if (this.isMultipleChoice && this.options) {
- this.options.forEach((option: ListItem): void => {
- const selectionItem = items.find((item: ListItem): boolean =>
this.utils.isEqual(item.value, option.value));
- option.isChecked = Boolean(selectionItem);
- });
- }
- }
-
private _onChange(value) {
if (this.onChange) {
this.onChange(value);
@@ -65,7 +51,7 @@ export class FilterDropdownComponent extends
DropdownButtonComponent implements
}
writeValue(items: ListItem[]) {
- this.selection = items || [];
+ this.selection = items ? (Array.isArray(items) ? items : [items] ) : [];
}
registerOnChange(callback: any): void {
