From 24c53e78a74234fa281958a64e6f85cd25f49789 Mon Sep 17 00:00:00 2001 From: Michael Shamoon <4887959+nikonratm@users.noreply.github.com> Date: Sat, 19 Dec 2020 02:08:33 -0800 Subject: [PATCH] Working bulk editor component --- .../filterable-dropdown-button.component.ts | 2 +- .../filterable-dropdown.component.html | 4 +- .../filterable-dropdown.component.ts | 40 +++++++-- .../bulk-editor/bulk-editor.component.html | 15 +++- .../bulk-editor/bulk-editor.component.ts | 86 ++++++++++--------- .../document-list.component.html | 11 +-- .../document-list/document-list.component.ts | 13 ++- 7 files changed, 109 insertions(+), 62 deletions(-) diff --git a/src-ui/src/app/components/common/filterable-dropdown/filterable-dropdown-button/filterable-dropdown-button.component.ts b/src-ui/src/app/components/common/filterable-dropdown/filterable-dropdown-button/filterable-dropdown-button.component.ts index 366bd19b4..a928d715e 100644 --- a/src-ui/src/app/components/common/filterable-dropdown/filterable-dropdown-button/filterable-dropdown-button.component.ts +++ b/src-ui/src/app/components/common/filterable-dropdown/filterable-dropdown-button/filterable-dropdown-button.component.ts @@ -35,7 +35,7 @@ export class FilterableDropdownButtonComponent implements OnInit { getSelectedIconName() { let iconName = '' if (this.selectableItem?.state == SelectableItemState.Selected) iconName = 'check' - else if (this.selectableItem?.state == SelectableItemState.PartiallySelected) iconName = 'minus' + else if (this.selectableItem?.state == SelectableItemState.PartiallySelected) iconName = 'dash' return iconName } } 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 257cec1e5..870ea41e4 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 @@ -1,12 +1,12 @@
- +
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 e5f722dc7..ae3d75aff 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 @@ -7,6 +7,7 @@ import { TagService } from 'src/app/services/rest/tag.service'; import { CorrespondentService } from 'src/app/services/rest/correspondent.service'; import { DocumentTypeService } from 'src/app/services/rest/document-type.service'; import { DocumentService } from 'src/app/services/rest/document.service'; +import { SelectableItem, SelectableItemState } from 'src/app/components/common/filterable-dropdown/filterable-dropdown.component'; @Component({ selector: 'app-bulk-editor', @@ -16,7 +17,7 @@ import { DocumentService } from 'src/app/services/rest/document.service'; export class BulkEditorComponent { @Input() - documentsSelected: Set + selectedDocuments: Set @Input() allDocuments: PaperlessDocument[] @@ -33,20 +34,11 @@ export class BulkEditorComponent { @Output() setCorrespondent = new EventEmitter() - @Output() - removeCorrespondent = new EventEmitter() - @Output() setDocumentType = new EventEmitter() @Output() - removeDocumentType = new EventEmitter() - - @Output() - addTag = new EventEmitter() - - @Output() - removeTag = new EventEmitter() + setTags = new EventEmitter() @Output() delete = new EventEmitter() @@ -55,34 +47,47 @@ export class BulkEditorComponent { correspondents: PaperlessCorrespondent[] documentTypes: PaperlessDocumentType[] - get selectedTags(): PaperlessTag[] { - let selectedTags = [] - this.allDocuments.forEach(d => { - if (this.documentsSelected.has(d.id)) { - if (d.tags && !d.tags.every(t => selectedTags.find(st => st.id == t) !== undefined)) d.tags$.subscribe(t => selectedTags = selectedTags.concat(t)) - } + get tagsSelectableItems(): SelectableItem[] { + let tagsSelectableItems = [] + let selectedDocuments: PaperlessDocument[] = this.allDocuments.filter(d => this.selectedDocuments.has(d.id)) + this.tags.forEach(t => { + let selectedDocumentsWithTag: PaperlessDocument[] = selectedDocuments.filter(d => d.tags.includes(t.id)) + let state = SelectableItemState.NotSelected + if (selectedDocumentsWithTag.length == selectedDocuments.length) state = SelectableItemState.Selected + else if (selectedDocumentsWithTag.length > 0 && selectedDocumentsWithTag.length < selectedDocuments.length) state = SelectableItemState.PartiallySelected + tagsSelectableItems.push( { item: t, state: state } ) }) - return selectedTags + return tagsSelectableItems } - get selectedCorrespondents(): PaperlessCorrespondent[] { - let selectedCorrespondents = [] - this.allDocuments.forEach(d => { - if (this.documentsSelected.has(d.id)) { - if (d.correspondent && selectedCorrespondents.find(sc => sc.id == d.correspondent) == undefined) d.correspondent$.subscribe(c => selectedCorrespondents.push(c)) - } + get correspondentsSelectableItems(): SelectableItem[] { + let correspondentsSelectableItems = [] + let selectedDocuments: PaperlessDocument[] = this.allDocuments.filter(d => this.selectedDocuments.has(d.id)) + + this.correspondents.forEach(c => { + let selectedDocumentsWithCorrespondent: PaperlessDocument[] = selectedDocuments.filter(d => d.correspondent == c.id) + let state = SelectableItemState.NotSelected + if (selectedDocumentsWithCorrespondent.length == selectedDocuments.length) state = SelectableItemState.Selected + else if (selectedDocumentsWithCorrespondent.length > 0 && selectedDocumentsWithCorrespondent.length < selectedDocuments.length) state = SelectableItemState.PartiallySelected + correspondentsSelectableItems.push( { item: c, state: state } ) }) - return selectedCorrespondents + + return correspondentsSelectableItems } - get selectedDocumentTypes(): PaperlessDocumentType[] { - let selectedDocumentTypes = [] - this.allDocuments.forEach(d => { - if (this.documentsSelected.has(d.id)) { - if (d.document_type && selectedDocumentTypes.find(sdt => sdt.id == d.document_type) == undefined) d.document_type$.subscribe(dt => selectedDocumentTypes.push(dt)) - } + get documentTypesSelectableItems(): SelectableItem[] { + let documentTypesSelectableItems = [] + let selectedDocuments: PaperlessDocument[] = this.allDocuments.filter(d => this.selectedDocuments.has(d.id)) + + this.documentTypes.forEach(dt => { + let selectedDocumentsWithDocumentType: PaperlessDocument[] = selectedDocuments.filter(d => d.document_type == dt.id) + let state = SelectableItemState.NotSelected + if (selectedDocumentsWithDocumentType.length == selectedDocuments.length) state = SelectableItemState.Selected + else if (selectedDocumentsWithDocumentType.length > 0 && selectedDocumentsWithDocumentType.length < selectedDocuments.length) state = SelectableItemState.PartiallySelected + documentTypesSelectableItems.push( { item: dt, state: state } ) }) - return selectedDocumentTypes + + return documentTypesSelectableItems } constructor( @@ -98,18 +103,19 @@ export class BulkEditorComponent { this.documentTypeService.listAll().subscribe(result => this.documentTypes = result.results) } - applyTags(tags) { - console.log(tags); - + applyTags(tags: PaperlessTag[]) { + this.setTags.emit(tags) } - applyCorrespondent(correspondent) { - console.log(correspondent); - + applyCorrespondent(selectedCorrespondent: ObjectWithId[]) { + this.setCorrespondent.emit(selectedCorrespondent) } - applyDocumentType(documentType) { - console.log(documentType); + applyDocumentType(selectedDocumentType: ObjectWithId[]) { + this.setDocumentType.emit(selectedDocumentType) + } + applyDelete() { + this.delete.next() } } diff --git a/src-ui/src/app/components/document-list/document-list.component.html b/src-ui/src/app/components/document-list/document-list.component.html index beb779636..b32ff52f7 100644 --- a/src-ui/src/app/components/document-list/document-list.component.html +++ b/src-ui/src/app/components/document-list/document-list.component.html @@ -82,16 +82,13 @@ diff --git a/src-ui/src/app/components/document-list/document-list.component.ts b/src-ui/src/app/components/document-list/document-list.component.ts index fd0b7ab31..a3f7f1e12 100644 --- a/src-ui/src/app/components/document-list/document-list.component.ts +++ b/src-ui/src/app/components/document-list/document-list.component.ts @@ -139,7 +139,9 @@ export class DocumentListComponent implements OnInit { ) } - bulkSetCorrespondent() { + bulkSetCorrespondent(correspondent) { + console.log(correspondent); + let modal = this.modalService.open(SelectDialogComponent, {backdrop: 'static'}) modal.componentInstance.title = "Select correspondent" modal.componentInstance.message = `Select the correspondent you wish to assign to ${this.list.selected.size} selected document(s):` @@ -166,7 +168,9 @@ export class DocumentListComponent implements OnInit { }) } - bulkSetDocumentType() { + bulkSetDocumentType(documentType) { + console.log(); + let modal = this.modalService.open(SelectDialogComponent, {backdrop: 'static'}) modal.componentInstance.title = "Select document type" modal.componentInstance.message = `Select the document type you wish to assign to ${this.list.selected.size} selected document(s):` @@ -193,6 +197,11 @@ export class DocumentListComponent implements OnInit { }) } + bulkSetTags(tags) { + console.log('bulkSetTags', tags); + + } + bulkAddTag() { let modal = this.modalService.open(SelectDialogComponent, {backdrop: 'static'}) modal.componentInstance.title = "Select tag"