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

better sorting directive

Browse Source
This commit is contained in:
jonaswinkler 2021-01-04 15:58:26 +01:00
parent 16559e83f5
commit 32f371fcb6
2 changed files with 29 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src-ui/src/app/components/manage/generic-list/generic-list.component.ts
View File

@ -26,7 +26,7 @@ export abstract class GenericListComponent<T extends ObjectWithId> implements On
public collectionSize = 0
public sortField: string
public sortDirection: string
public sortReverse: boolean
getMatching(o: MatchingModel) {
if (o.matching_algorithm == MATCH_AUTO) {
@ -40,17 +40,17 @@ export abstract class GenericListComponent<T extends ObjectWithId> implements On
onSort(event: SortEvent) {
if (event.direction && event.direction.length > 0) {
if (event.sorted) {
this.sortField = event.column
this.sortDirection = event.direction
this.sortReverse = event.reverse
} else {
this.sortField = null
this.sortDirection = null
this.sortReverse = false
}
this.headers.forEach(header => {
if (header.sortable !== this.sortField) {
header.direction = '';
header.sorted = false
}
});
@ -62,8 +62,7 @@ export abstract class GenericListComponent<T extends ObjectWithId> implements On
}
reloadData() {
// TODO: this is a hack
this.service.list(this.page, null, this.sortField, this.sortDirection == 'des').subscribe(c => {
this.service.list(this.page, null, this.sortField, this.sortReverse).subscribe(c => {
this.data = c.results
this.collectionSize = c.count
});

33
src-ui/src/app/directives/sortable.directive.ts
View File

@ -1,17 +1,16 @@
import { Directive, EventEmitter, Input, Output } from '@angular/core';
export interface SortEvent {
column: string;
direction: string;
column: string
sorted: boolean
reverse: boolean
}
const rotate: {[key: string]: string} = { 'asc': 'des', 'des': '', '': 'asc' };
@Directive({
selector: 'th[sortable]',
host: {
'[class.asc]': 'direction === "asc"',
'[class.des]': 'direction === "des"',
'[class.asc]': 'sorted && !reverse',
'[class.des]': 'sorted && reverse',
'(click)': 'rotate()'
}
})
@ -19,12 +18,26 @@ export class SortableDirective {
constructor() { }
@Input() sortable: string = '';
@Input() direction: string = '';
@Input()
sortable: string = '';
@Input()
sorted: boolean = false
@Input()
reverse: boolean = false
@Output() sort = new EventEmitter<SortEvent>();
rotate() {
this.direction = rotate[this.direction];
this.sort.emit({column: this.sortable, direction: this.direction});
if (!this.sorted) {
this.sorted = true
this.reverse = false
} else if (this.sorted && !this.reverse) {
this.reverse = true
} else {
this.sorted = false
}
this.sort.emit({column: this.sortable, sorted: this.sorted, reverse: this.reverse});
}
}