paradizelost/paperless-ngx
1
0
Fork 0
mirror of https://github.com/paperless-ngx/paperless-ngx.git synced 2025-04-17 10:13:56 -05:00
Code Issues Packages Projects Releases Wiki Activity

Add apply button to dropdowns

Browse Source
This commit is contained in:
Michael Shamoon 2020-12-20 01:04:54 -08:00
parent 37c2051e01
commit fa7b90a584
2 changed files with 10 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src-ui/src/app/components/common/filterable-dropdown/filterable-dropdown.component.html
View File

@ -24,6 +24,12 @@
<app-toggleable-dropdown-button [toggleableItem]="toggleableItem" [showCounts]="showCounts" (toggle)="toggleItem($event)"></app-toggleable-dropdown-button> <app-toggleable-dropdown-button [toggleableItem]="toggleableItem" [showCounts]="showCounts" (toggle)="toggleItem($event)"></app-toggleable-dropdown-button>
</ng-container> </ng-container>
</div> </div>
<button *ngIf="type == types.Editing" class="list-group-item list-group-item-action bg-light" (click)="dropdown.close()" [disabled]="!hasBeenToggled || (toggleableItems | filter: filterText).length == 0">
<small class="ml-1" [ngClass]="{'font-weight-bold': hasBeenToggled && (toggleableItems | filter: filterText).length > 0}">Apply</small>
<svg width="1.5em" height="1em" viewBox="0 0 16 16" fill="currentColor">
<use xlink:href="assets/bootstrap-icons.svg#arrow-right" />
</svg>
</button>
</div> </div>
</div> </div>
</div> </div>

4
src-ui/src/app/components/common/filterable-dropdown/filterable-dropdown.component.ts
View File

@ -89,12 +89,15 @@ export class FilterableDropdownComponent {
return this._showCounts && (this.type == FilterableDropdownType.Editing || (this.type == FilterableDropdownType.Filtering && this.itemsSelected.length == 0)) return this._showCounts && (this.type == FilterableDropdownType.Editing || (this.type == FilterableDropdownType.Filtering && this.itemsSelected.length == 0))
} }
hasBeenToggled:boolean = false
constructor(private filterPipe: FilterPipe) { } constructor(private filterPipe: FilterPipe) { }
toggleItem(toggleableItem: ToggleableItem): void { toggleItem(toggleableItem: ToggleableItem): void {
if (this.singular && toggleableItem.state == ToggleableItemState.Selected) { if (this.singular && toggleableItem.state == ToggleableItemState.Selected) {
this._toggleableItems.filter(ti => ti.item.id !== toggleableItem.item.id).forEach(ti => ti.state = ToggleableItemState.NotSelected) this._toggleableItems.filter(ti => ti.item.id !== toggleableItem.item.id).forEach(ti => ti.state = ToggleableItemState.NotSelected)
} }
this.hasBeenToggled = true
this.toggle.emit(toggleableItem.item) this.toggle.emit(toggleableItem.item)
} }
@ -103,6 +106,7 @@ export class FilterableDropdownComponent {
setTimeout(() => { setTimeout(() => {
this.listFilterTextInput.nativeElement.focus(); this.listFilterTextInput.nativeElement.focus();
}, 0) }, 0)
this.hasBeenToggled = false
this.open.next() this.open.next()
} else { } else {
this.filterText = '' this.filterText = ''