From dad03c8c10ddd3cf6af02ba212239b9527cbff8b Mon Sep 17 00:00:00 2001 From: Tobias Istvan Date: Thu, 16 Aug 2018 12:34:47 +0200 Subject: [PATCH] [AMBARI-24433] [Log Search UI] Reset to default selection in the dropdowns (cherry picked from commit f40586f601072baadd694988515770531d268738) --- .../service-logs-table.component.html | 6 +- .../dropdown-button.component.html | 7 ++- .../dropdown-button.component.ts | 27 ++++---- .../dropdown-list.component.html | 9 ++- .../dropdown-list.component.less | 23 ++++++- .../dropdown-list/dropdown-list.component.ts | 61 +++++++++++++++---- .../src/assets/i18n/en.json | 1 + 7 files changed, 102 insertions(+), 32 deletions(-) diff --git a/ambari-logsearch/ambari-logsearch-web/src/app/components/service-logs-table/service-logs-table.component.html b/ambari-logsearch/ambari-logsearch-web/src/app/components/service-logs-table/service-logs-table.component.html index cacee46536f..fb8a9b412e6 100644 --- a/ambari-logsearch/ambari-logsearch-web/src/app/components/service-logs-table/service-logs-table.component.html +++ b/ambari-logsearch/ambari-logsearch-web/src/app/components/service-logs-table/service-logs-table.component.html @@ -28,8 +28,10 @@ [isRightAlign]="true"> + (selectItem)="updateSelectedColumns($event)" + [listItemArguments]="logsTypeMapObject.fieldsModel" + [isMultipleChoice]="true" + [useClearToDefaultSelection]="true">
diff --git a/ambari-logsearch/ambari-logsearch-web/src/app/modules/shared/components/dropdown-button/dropdown-button.component.html b/ambari-logsearch/ambari-logsearch-web/src/app/modules/shared/components/dropdown-button/dropdown-button.component.html index 396a277f98b..714002854a4 100644 --- a/ambari-logsearch/ambari-logsearch-web/src/app/modules/shared/components/dropdown-button/dropdown-button.component.html +++ b/ambari-logsearch/ambari-logsearch-web/src/app/modules/shared/components/dropdown-button/dropdown-button.component.html @@ -29,7 +29,8 @@ -
    +
      diff --git a/ambari-logsearch/ambari-logsearch-web/src/app/modules/shared/components/dropdown-button/dropdown-button.component.ts b/ambari-logsearch/ambari-logsearch-web/src/app/modules/shared/components/dropdown-button/dropdown-button.component.ts index 837d03ab4a1..534b69dcd57 100644 --- a/ambari-logsearch/ambari-logsearch-web/src/app/modules/shared/components/dropdown-button/dropdown-button.component.ts +++ b/ambari-logsearch/ambari-logsearch-web/src/app/modules/shared/components/dropdown-button/dropdown-button.component.ts @@ -31,36 +31,41 @@ export class DropdownButtonComponent { label?: string; @Input() - buttonClass: string = 'btn-link'; + buttonClass = 'btn-link'; @Input() iconClass?: string; @Input() - hideCaret: boolean = false; + hideCaret = false; @Input() - showSelectedValue: boolean = true; + showSelectedValue = true; - @Input() options: ListItem[] = []; + @Input() + isRightAlign = false; @Input() - listItemArguments: any[] = []; + isDropup = false; @Input() - isMultipleChoice: boolean = false; + showCommonLabelWithSelection = false; + + @Output() + selectItem: EventEmitter = new EventEmitter(); + // PROXY PROPERTIES TO DROPDOWN LIST COMPONENT @Input() - isRightAlign: boolean = false; + options: ListItem[] = []; @Input() - isDropup: boolean = false; + listItemArguments: any[] = []; @Input() - showCommonLabelWithSelection: boolean = false; + isMultipleChoice = false; - @Output() - selectItem: EventEmitter = new EventEmitter(); + @Input() + useClearToDefaultSelection = false; protected selectedItems?: ListItem[] = []; diff --git a/ambari-logsearch/ambari-logsearch-web/src/app/modules/shared/components/dropdown-list/dropdown-list.component.html b/ambari-logsearch/ambari-logsearch-web/src/app/modules/shared/components/dropdown-list/dropdown-list.component.html index 3423f543438..a15b1c315c7 100644 --- a/ambari-logsearch/ambari-logsearch-web/src/app/modules/shared/components/dropdown-list/dropdown-list.component.html +++ b/ambari-logsearch/ambari-logsearch-web/src/app/modules/shared/components/dropdown-list/dropdown-list.component.html @@ -53,9 +53,12 @@
    • -
    • - {{'dropdown.selection' | translate:({total: itemsSelected.length})}} - {{'dropdown.selection.clear' | translate}} +
    • + {{'dropdown.selection' | translate:({total: itemsSelected.length})}} + {{'dropdown.selection.clearToDefault' | translate}} + {{'dropdown.selection.clear' | translate}}
      • = new EventEmitter(); @@ -59,6 +61,9 @@ export class DropdownListComponent implements OnInit, OnChanges, AfterViewChecke @Input() useLocalFilter = false; + @Input() + useClearToDefaultSelection = false; + @ViewChild('filter') filterRef: ElementRef; @@ -78,11 +83,17 @@ export class DropdownListComponent implements OnInit, OnChanges, AfterViewChecke ngOnInit() { this.separateSelections(); + this.setDefaultSelection(this.items); + this.selectedItemChange.subscribe(this.separateSelections); } ngOnChanges(changes: SimpleChanges): void { if (changes.hasOwnProperty('items')) { + const previousItems = changes.items.previousValue; this.separateSelections(); + if ((!this.defaultSelection || !this.defaultSelection.length) && (!previousItems || !previousItems.length)) { + this.setDefaultSelection(this.items); + } this.shouldRenderAdditionalComponents = true; } } @@ -91,18 +102,46 @@ export class DropdownListComponent implements OnInit, OnChanges, AfterViewChecke this.renderAdditionalComponents(); } - private separateSelections() { - this.itemsSelected = this.items ? this.items.filter((item: ListItem) => item.isChecked) : []; - this.itemsUnSelected = this.items ? this.items.filter((item: ListItem) => !item.isChecked) : []; + getSelectedItems(): ListItem[] { + return this.items ? this.items.filter((item: ListItem) => item.isChecked) : []; + } + + getUnSelectedItems(): ListItem[] { + return this.items ? this.items.filter((item: ListItem) => !item.isChecked) : []; + } + + private setDefaultSelection(items) { + this.defaultSelection = this.getSelectedItems(); + } + + private separateSelections = () => { + this.itemsSelected = this.getSelectedItems(); + this.itemsUnSelected = this.getUnSelectedItems(); this.shouldRenderAdditionalComponents = true; } private clearSelection() { this.unSelectAll(); - this.separateSelections(); } - private onClearSelectionClick = (event): void => { + private clearToDefaultSelection() { + if (this.defaultSelection && this.defaultSelection.length) { + this.items.forEach((item: ListItem) => { + item.isChecked = this.defaultSelection.findIndex((defaultItem) => defaultItem.value === item.value) !== -1; + if (item.onSelect && item.isChecked) { + item.onSelect(...this.actionArguments); + } + }); + this.selectedItemChange.emit(this.items); + } + } + + onClearToDefaultSelectionClick = (event): void => { + event.preventDefault(); + event.stopPropagation(); + this.clearToDefaultSelection(); + } + onClearSelectionClick = (event): void => { event.preventDefault(); event.stopPropagation(); this.clearSelection(); @@ -115,7 +154,6 @@ export class DropdownListComponent implements OnInit, OnChanges, AfterViewChecke } else { this.unSelectAll(); } - this.separateSelections(); } selectAll() { @@ -172,7 +210,6 @@ export class DropdownListComponent implements OnInit, OnChanges, AfterViewChecke if (item.onSelect) { item.onSelect(...this.actionArguments); } - this.separateSelections(); this.selectedItemChange.emit(item); } diff --git a/ambari-logsearch/ambari-logsearch-web/src/assets/i18n/en.json b/ambari-logsearch/ambari-logsearch-web/src/assets/i18n/en.json index 9f6c772e226..66b68cbee86 100644 --- a/ambari-logsearch/ambari-logsearch-web/src/assets/i18n/en.json +++ b/ambari-logsearch/ambari-logsearch-web/src/assets/i18n/en.json @@ -12,6 +12,7 @@ "dropdown.selection": "Selected ({{total}})", "dropdown.selection.clear": "(Clear)", + "dropdown.selection.clearToDefault": "(Set defaults)", "dropdown.selection.all": "All {{listName}} ({{total}})", "modal.submit": "OK",