Cut out dropdown component middle man

This commit is contained in:
shamoon 2025-03-17 01:24:17 -07:00
parent aaf7590ed8
commit b93fc7ef32
No known key found for this signature in database
3 changed files with 52 additions and 50 deletions

View File

@ -62,8 +62,22 @@ export class FilterableDropdownSelectionModel {
}
set items(items: MatchingModel[]) {
this._items = items
this.sortItems()
if (items) {
this._items = Array.from(items)
this._items.unshift({
name: $localize`:Filter drop down element to filter for documents with no correspondent/type/tag assigned:Not assigned`,
id:
this.intersection === Intersection.Include
? null
: NEGATIVE_NULL_FILTER_VALUE,
})
this.sortItems()
}
}
constructor(manyToOne: boolean = false, singleSelect: boolean = false) {
this.manyToOne = manyToOne
this.singleSelect = singleSelect
}
private sortItems() {
@ -249,7 +263,18 @@ export class FilterableDropdownSelectionModel {
this.temporaryIntersection = intersection
}
private checkForNullItem() {
console.log('checkForNullItem', this.items)
if (this.temporaryIntersection === Intersection.Exclude) {
this.temporarySelectionStates.delete(null)
this.items.shift()
}
}
toggleIntersection() {
console.log('toggleIntersection')
if (this.temporarySelectionStates.size === 0) return
let newState =
this.intersection == Intersection.Include
@ -400,28 +425,13 @@ export class FilterableDropdownComponent
filterText: string
@Input()
set items(items: MatchingModel[]) {
if (items) {
this._selectionModel.items = Array.from(items)
this._selectionModel.items.unshift({
name: $localize`:Filter drop down element to filter for documents with no correspondent/type/tag assigned:Not assigned`,
id:
this.selectionModel.intersection === Intersection.Include
? null
: NEGATIVE_NULL_FILTER_VALUE,
})
}
}
_selectionModel: FilterableDropdownSelectionModel
get items(): MatchingModel[] {
return this._selectionModel.items
}
_selectionModel: FilterableDropdownSelectionModel =
new FilterableDropdownSelectionModel()
@Input()
@Input({ required: true })
set selectionModel(model: FilterableDropdownSelectionModel) {
if (this.selectionModel) {
this.selectionModel.changed.complete()
@ -442,11 +452,6 @@ export class FilterableDropdownComponent
@Output()
selectionModelChange = new EventEmitter<FilterableDropdownSelectionModel>()
@Input()
set manyToOne(manyToOne: boolean) {
this.selectionModel.manyToOne = manyToOne
}
get manyToOne() {
return this.selectionModel.manyToOne
}

View File

@ -35,49 +35,48 @@
<div class="col-auto">
<div class="d-flex flex-wrap gap-3">
<div class="d-flex flex-wrap gap-2">
@if (permissionsService.currentUserCan(PermissionAction.View, PermissionType.Tag) && tags.length > 0) {
@if (permissionsService.currentUserCan(PermissionAction.View, PermissionType.Tag) && tagSelectionModel.items.length > 0) {
<pngx-filterable-dropdown class="flex-fill fade" [class.show]="show" title="Tags" icon="tag-fill" i18n-title
filterPlaceholder="Filter tags" i18n-filterPlaceholder
[items]="tags"
[manyToOne]="true"
[(selectionModel)]="tagSelectionModel"
(selectionModelChange)="updateRules()"
[items]="tags"
(opened)="onTagsDropdownOpen()"
[documentCounts]="tagDocumentCounts"
[allowSelectNone]="true"
[disabled]="disabled"
shortcutKey="t"></pngx-filterable-dropdown>
}
@if (permissionsService.currentUserCan(PermissionAction.View, PermissionType.Correspondent) && correspondents.length > 0) {
@if (permissionsService.currentUserCan(PermissionAction.View, PermissionType.Correspondent) && correspondentSelectionModel.items.length > 0) {
<pngx-filterable-dropdown class="flex-fill fade" [class.show]="show" title="Correspondent" icon="person-fill" i18n-title
filterPlaceholder="Filter correspondents" i18n-filterPlaceholder
[items]="correspondents"
[(selectionModel)]="correspondentSelectionModel"
(selectionModelChange)="updateRules()"
[items]="correspondents"
(opened)="onCorrespondentDropdownOpen()"
[documentCounts]="correspondentDocumentCounts"
[allowSelectNone]="true"
[disabled]="disabled"
shortcutKey="y"></pngx-filterable-dropdown>
}
@if (permissionsService.currentUserCan(PermissionAction.View, PermissionType.DocumentType) && documentTypes.length > 0) {
@if (permissionsService.currentUserCan(PermissionAction.View, PermissionType.DocumentType) && documentTypeSelectionModel.items.length > 0) {
<pngx-filterable-dropdown class="flex-fill fade" [class.show]="show" title="Document type" icon="file-earmark-fill" i18n-title
filterPlaceholder="Filter document types" i18n-filterPlaceholder
[items]="documentTypes"
[(selectionModel)]="documentTypeSelectionModel"
(selectionModelChange)="updateRules()"
[items]="documentTypes"
(opened)="onDocumentTypeDropdownOpen()"
[documentCounts]="documentTypeDocumentCounts"
[allowSelectNone]="true"
[disabled]="disabled"
shortcutKey="u"></pngx-filterable-dropdown>
}
@if (permissionsService.currentUserCan(PermissionAction.View, PermissionType.StoragePath) && storagePaths.length > 0) {
@if (permissionsService.currentUserCan(PermissionAction.View, PermissionType.StoragePath) && storagePathSelectionModel.items.length > 0) {
<pngx-filterable-dropdown class="flex-fill fade" [class.show]="show" title="Storage path" icon="folder-fill" i18n-title
filterPlaceholder="Filter storage paths" i18n-filterPlaceholder
[items]="storagePaths"
[(selectionModel)]="storagePathSelectionModel"
(selectionModelChange)="updateRules()"
[items]="storagePaths"
(opened)="onStoragePathDropdownOpen()"
[documentCounts]="storagePathDocumentCounts"
[allowSelectNone]="true"

View File

@ -26,14 +26,12 @@ import {
switchMap,
takeUntil,
} from 'rxjs/operators'
import { Correspondent } from 'src/app/data/correspondent'
import { CustomField } from 'src/app/data/custom-field'
import {
CustomFieldQueryLogicalOperator,
CustomFieldQueryOperator,
} from 'src/app/data/custom-field-query'
import { Document } from 'src/app/data/document'
import { DocumentType } from 'src/app/data/document-type'
import { FilterRule } from 'src/app/data/filter-rule'
import {
FILTER_ADDED_AFTER,
@ -77,8 +75,6 @@ import {
FILTER_TITLE_CONTENT,
NEGATIVE_NULL_FILTER_VALUE,
} from 'src/app/data/filter-rule-type'
import { StoragePath } from 'src/app/data/storage-path'
import { Tag } from 'src/app/data/tag'
import {
PermissionAction,
PermissionType,
@ -252,7 +248,9 @@ export class FilterEditorComponent
case FILTER_HAS_CORRESPONDENT_ANY:
if (rule.value) {
return $localize`Correspondent: ${
this.correspondents.find((c) => c.id == +rule.value)?.name
this.correspondentSelectionModel.items.find(
(c) => c.id == +rule.value
)?.name
}`
} else {
return $localize`Without correspondent`
@ -262,7 +260,9 @@ export class FilterEditorComponent
case FILTER_HAS_DOCUMENT_TYPE_ANY:
if (rule.value) {
return $localize`Document type: ${
this.documentTypes.find((dt) => dt.id == +rule.value)?.name
this.documentTypeSelectionModel.items.find(
(dt) => dt.id == +rule.value
)?.name
}`
} else {
return $localize`Without document type`
@ -272,7 +272,9 @@ export class FilterEditorComponent
case FILTER_HAS_STORAGE_PATH_ANY:
if (rule.value) {
return $localize`Storage path: ${
this.storagePaths.find((sp) => sp.id == +rule.value)?.name
this.storagePathSelectionModel.items.find(
(sp) => sp.id == +rule.value
)?.name
}`
} else {
return $localize`Without storage path`
@ -280,7 +282,7 @@ export class FilterEditorComponent
case FILTER_HAS_TAGS_ALL:
return $localize`Tag: ${
this.tags.find((t) => t.id == +rule.value)?.name
this.tagSelectionModel.items.find((t) => t.id == +rule.value)?.name
}`
case FILTER_HAS_ANY_TAG:
@ -327,10 +329,6 @@ export class FilterEditorComponent
@ViewChild('textFilterInput')
textFilterInput: ElementRef
tags: Tag[] = []
correspondents: Correspondent[] = []
documentTypes: DocumentType[] = []
storagePaths: StoragePath[] = []
customFields: CustomField[] = []
tagDocumentCounts: SelectionDataItem[]
@ -371,7 +369,7 @@ export class FilterEditorComponent
)
}
tagSelectionModel = new FilterableDropdownSelectionModel()
tagSelectionModel = new FilterableDropdownSelectionModel(true)
correspondentSelectionModel = new FilterableDropdownSelectionModel()
documentTypeSelectionModel = new FilterableDropdownSelectionModel()
storagePathSelectionModel = new FilterableDropdownSelectionModel()
@ -1082,7 +1080,7 @@ export class FilterEditorComponent
) {
this.loadingCountTotal++
this.tagService.listAll().subscribe((result) => {
this.tags = result.results
this.tagSelectionModel.items = result.results
this.maybeCompleteLoading()
})
}
@ -1094,7 +1092,7 @@ export class FilterEditorComponent
) {
this.loadingCountTotal++
this.correspondentService.listAll().subscribe((result) => {
this.correspondents = result.results
this.correspondentSelectionModel.items = result.results
this.maybeCompleteLoading()
})
}
@ -1106,7 +1104,7 @@ export class FilterEditorComponent
) {
this.loadingCountTotal++
this.documentTypeService.listAll().subscribe((result) => {
this.documentTypes = result.results
this.documentTypeSelectionModel.items = result.results
this.maybeCompleteLoading()
})
}
@ -1118,7 +1116,7 @@ export class FilterEditorComponent
) {
this.loadingCountTotal++
this.storagePathService.listAll().subscribe((result) => {
this.storagePaths = result.results
this.storagePathSelectionModel.items = result.results
this.maybeCompleteLoading()
})
}