diff --git a/src-ui/src/app/components/common/filterable-dropdown/filterable-dropdown.component.html b/src-ui/src/app/components/common/filterable-dropdown/filterable-dropdown.component.html index 9bc525684..5a05e66b4 100644 --- a/src-ui/src/app/components/common/filterable-dropdown/filterable-dropdown.component.html +++ b/src-ui/src/app/components/common/filterable-dropdown/filterable-dropdown.component.html @@ -21,7 +21,7 @@
- +
diff --git a/src-ui/src/app/components/common/filterable-dropdown/filterable-dropdown.component.ts b/src-ui/src/app/components/common/filterable-dropdown/filterable-dropdown.component.ts index dc1139783..a5dadc603 100644 --- a/src-ui/src/app/components/common/filterable-dropdown/filterable-dropdown.component.ts +++ b/src-ui/src/app/components/common/filterable-dropdown/filterable-dropdown.component.ts @@ -1,5 +1,4 @@ import { Component, EventEmitter, Input, Output, ElementRef, ViewChild } from '@angular/core'; -import { ObjectWithId } from 'src/app/data/object-with-id'; import { PaperlessTag } from 'src/app/data/paperless-tag'; import { PaperlessCorrespondent } from 'src/app/data/paperless-correspondent'; import { PaperlessDocumentType } from 'src/app/data/paperless-document-type'; @@ -25,10 +24,10 @@ export class FilterableDropdownComponent { filterText: string @Input() - set items(items: ObjectWithId[]) { + set items(items: (PaperlessTag | PaperlessCorrespondent | PaperlessDocumentType)[]) { if (items) { this._toggleableItems = items.map(i => { - return {item: i, state: ToggleableItemState.NotSelected} + return {item: i, state: ToggleableItemState.NotSelected, count: i.document_count} }) } } @@ -46,13 +45,13 @@ export class FilterableDropdownComponent { } @Input() - set itemsSelected(itemsSelected: ObjectWithId[]) { + set itemsSelected(itemsSelected: (PaperlessTag | PaperlessCorrespondent | PaperlessDocumentType)[]) { this.toggleableItems.forEach(i => { i.state = (itemsSelected.find(is => is.id == i.item.id)) ? ToggleableItemState.Selected : ToggleableItemState.NotSelected }) } - get itemsSelected() :ObjectWithId[] { + get itemsSelected() :(PaperlessTag | PaperlessCorrespondent | PaperlessDocumentType)[] { return this.toggleableItems.filter(si => si.state == ToggleableItemState.Selected).map(si => si.item) } @@ -79,6 +78,10 @@ export class FilterableDropdownComponent { @Output() editingComplete = new EventEmitter() + get showCounts(): boolean { + return this.type == FilterableDropdownType.Editing || (this.type == FilterableDropdownType.Filtering && this.itemsSelected == 0) + } + constructor(private filterPipe: FilterPipe) { } toggleItem(toggleableItem: ToggleableItem): void { diff --git a/src-ui/src/app/components/common/filterable-dropdown/toggleable-dropdown-button/toggleable-dropdown-button.component.html b/src-ui/src/app/components/common/filterable-dropdown/toggleable-dropdown-button/toggleable-dropdown-button.component.html index 75dadba53..32f9c58ad 100644 --- a/src-ui/src/app/components/common/filterable-dropdown/toggleable-dropdown-button/toggleable-dropdown-button.component.html +++ b/src-ui/src/app/components/common/filterable-dropdown/toggleable-dropdown-button/toggleable-dropdown-button.component.html @@ -8,5 +8,5 @@ {{toggleableItem?.item.name}} -
{{toggleableItem?.item.document_count}}
+
{{toggleableItem?.count}}
diff --git a/src-ui/src/app/components/common/filterable-dropdown/toggleable-dropdown-button/toggleable-dropdown-button.component.ts b/src-ui/src/app/components/common/filterable-dropdown/toggleable-dropdown-button/toggleable-dropdown-button.component.ts index 7c9c02a49..4d58023ad 100644 --- a/src-ui/src/app/components/common/filterable-dropdown/toggleable-dropdown-button/toggleable-dropdown-button.component.ts +++ b/src-ui/src/app/components/common/filterable-dropdown/toggleable-dropdown-button/toggleable-dropdown-button.component.ts @@ -5,7 +5,8 @@ import { PaperlessDocumentType } from 'src/app/data/paperless-document-type'; export interface ToggleableItem { item: PaperlessTag | PaperlessDocumentType | PaperlessCorrespondent, - state: ToggleableItemState + state: ToggleableItemState, + count: number } export enum ToggleableItemState { @@ -24,6 +25,9 @@ export class ToggleableDropdownButtonComponent { @Input() toggleableItem: ToggleableItem + @Input() + showCounts: boolean = true + @Output() toggle = new EventEmitter() diff --git a/src-ui/src/app/components/document-list/bulk-editor/bulk-editor.component.ts b/src-ui/src/app/components/document-list/bulk-editor/bulk-editor.component.ts index 21355fe4c..af6934e32 100644 --- a/src-ui/src/app/components/document-list/bulk-editor/bulk-editor.component.ts +++ b/src-ui/src/app/components/document-list/bulk-editor/bulk-editor.component.ts @@ -63,7 +63,7 @@ export class BulkEditorComponent { let state = ToggleableItemState.NotSelected if (selectedDocumentsWithTag.length == selectedDocuments.length) state = ToggleableItemState.Selected else if (selectedDocumentsWithTag.length > 0 && selectedDocumentsWithTag.length < selectedDocuments.length) state = ToggleableItemState.PartiallySelected - tagsToggleableItems.push( { item: t, state: state } ) + tagsToggleableItems.push( { item: t, state: state, count: selectedDocumentsWithTag.length } ) }) return tagsToggleableItems } @@ -77,7 +77,7 @@ export class BulkEditorComponent { let state = ToggleableItemState.NotSelected if (selectedDocumentsWithCorrespondent.length == selectedDocuments.length) state = ToggleableItemState.Selected else if (selectedDocumentsWithCorrespondent.length > 0 && selectedDocumentsWithCorrespondent.length < selectedDocuments.length) state = ToggleableItemState.PartiallySelected - correspondentsToggleableItems.push( { item: c, state: state } ) + correspondentsToggleableItems.push( { item: c, state: state, count: selectedDocumentsWithCorrespondent.length } ) }) return correspondentsToggleableItems } @@ -91,7 +91,7 @@ export class BulkEditorComponent { let state = ToggleableItemState.NotSelected if (selectedDocumentsWithDocumentType.length == selectedDocuments.length) state = ToggleableItemState.Selected else if (selectedDocumentsWithDocumentType.length > 0 && selectedDocumentsWithDocumentType.length < selectedDocuments.length) state = ToggleableItemState.PartiallySelected - documentTypesToggleableItems.push( { item: dt, state: state } ) + documentTypesToggleableItems.push( { item: dt, state: state, count: selectedDocumentsWithDocumentType.length } ) }) return documentTypesToggleableItems }