Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 | 8x 8x 8x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 2x 1x 2x 2x 6x 2x | import { Component, ElementRef, Input, OnChanges, OnDestroy, SimpleChanges, ViewChild } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { NavigationEnd, Router } from '@angular/router';
import { autorun, IReactionDisposer, toJS } from 'mobx';
import { filter } from 'rxjs';
import { AdminService } from '../../service/admin.service';
import { Store } from '../../store/store';
import { Type } from '../../store/view';
import { convertSort, defaultDesc, SortItem } from '../../util/query';
@Component({
selector: 'app-sort',
templateUrl: './sort.component.html',
styleUrls: ['./sort.component.scss'],
host: { 'class': 'sort form-group' },
imports: [ReactiveFormsModule, FormsModule]
})
export class SortComponent implements OnChanges, OnDestroy {
private disposers: IReactionDisposer[] = [];
@ViewChild('create')
create?: ElementRef<HTMLSelectElement>;
@Input()
type?: Type;
allRefSorts = this.admin.refSorts.map(convertSort);
allTagSorts = this.admin.tagSorts.map(convertSort);
allSorts: SortItem[] = [
{ value: 'modified', label: $localize`🕓️ modified` },
{ value: 'origin:len', label: $localize`🪆 nesting` },
];
sorts: string[] = [];
replace = false;
constructor(
public router: Router,
public admin: AdminService,
public store: Store,
) {
this.type = 'ref';
this.disposers.push(autorun(() => {
this.sorts = toJS(this.store.view.sort);
Iif (!Array.isArray(this.sorts)) this.sorts = [this.sorts];
}));
this.disposers.push(autorun(() => {
this.rebuildSorts(this.store.view.isSearch);
}));
router.events.pipe(
filter(event => event instanceof NavigationEnd),
).subscribe(() => this.replace = false);
}
ngOnChanges(changes: SimpleChanges) {
if (changes.type) {
this.rebuildSorts(this.store.view.isSearch);
}
}
private rebuildSorts(isSearch: boolean) {
if (this.type === 'ref') {
this.allSorts = [...this.allRefSorts];
Iif (isSearch) {
this.allSorts.unshift({ value: 'rank', label: $localize`🔍️ relevance`, title: $localize`Search rank` });
}
} else E{
this.allSorts = [...this.allTagSorts];
}
}
ngOnDestroy() {
for (const dispose of this.disposers) dispose();
this.disposers.length = 0;
}
addSort(value: string) {
this.replace = false;
if (!this.sorts) this.sorts = [];
this.sorts.push('');
this.create!.nativeElement.selectedIndex = 0;
this.setSortCol(this.sorts.length - 1, value);
}
setSortCol(index: number, value: string) {
const dir = this.sortDir(value)
this.sorts[index] = value + ',' + dir;
this.setSort();
}
setSortDir(index: number, value: string) {
const col = this.sortCol(this.sorts[index])
this.sorts[index] = col + ',' + value;
if (col) this.setSort();
}
removeSort(index: number) {
this.replace = false;
this.sorts.splice(index, 1);
this.setSort();
}
setSort() {
const sort = this.sorts.filter(f => !!f && !f.startsWith(','));
this.router.navigate([], {
queryParams: { sort: sort.length ? sort : null, pageNumber: null },
queryParamsHandling: 'merge',
replaceUrl: this.replace,
});
this.replace ||= !!sort.length;
}
title(value: string) {
for (const s of this.allSorts) {
if (s.value === value) return s.title || '';
}
return '';
}
sortCol(sort: string) {
Eif (!sort.includes(',')) return sort;
return sort.split(',')[0];
}
sortDir(sort: string) {
Eif (!sort.includes(',')) return defaultDesc(sort) ? 'DESC' : 'ASC';
return sort.split(',')[1].toUpperCase() === 'DESC' ? 'DESC' : 'ASC';
}
}
|