mirror of
				https://github.com/paperless-ngx/paperless-ngx.git
				synced 2025-11-03 03:16:10 -06:00 
			
		
		
		
	fixes #128
This commit is contained in:
		@@ -99,12 +99,54 @@
 | 
			
		||||
<table class="table table-sm border shadow-sm" *ngIf="displayMode == 'details'">
 | 
			
		||||
  <thead>
 | 
			
		||||
    <th></th>
 | 
			
		||||
    <th class="d-none d-lg-table-cell" i18n>ASN</th>
 | 
			
		||||
    <th class="d-none d-md-table-cell" i18n>Correspondent</th>
 | 
			
		||||
    <th i18n>Title</th>
 | 
			
		||||
    <th class="d-none d-xl-table-cell" i18n>Document type</th>
 | 
			
		||||
    <th i18n>Created</th>
 | 
			
		||||
    <th class="d-none d-xl-table-cell" i18n>Added</th>
 | 
			
		||||
    <th class="d-none d-lg-table-cell"
 | 
			
		||||
      sortable="archive_serial_number"
 | 
			
		||||
      [currentSortField]="list.sortField"
 | 
			
		||||
      [currentSortReverse]="list.sortReverse"
 | 
			
		||||
      (sort)="onSort($event)"
 | 
			
		||||
      i18n>
 | 
			
		||||
      ASN
 | 
			
		||||
    </th>
 | 
			
		||||
    <th class="d-none d-md-table-cell"
 | 
			
		||||
      sortable="correspondent__name"
 | 
			
		||||
      [currentSortField]="list.sortField"
 | 
			
		||||
      [currentSortReverse]="list.sortReverse"
 | 
			
		||||
      (sort)="onSort($event)"
 | 
			
		||||
      i18n>
 | 
			
		||||
      Correspondent
 | 
			
		||||
    </th>
 | 
			
		||||
    <th
 | 
			
		||||
      sortable="title"
 | 
			
		||||
      [currentSortField]="list.sortField"
 | 
			
		||||
      [currentSortReverse]="list.sortReverse"
 | 
			
		||||
      (sort)="onSort($event)"
 | 
			
		||||
      i18n>
 | 
			
		||||
      Title
 | 
			
		||||
    </th>
 | 
			
		||||
    <th class="d-none d-xl-table-cell"
 | 
			
		||||
      sortable="document_type__name"
 | 
			
		||||
      [currentSortField]="list.sortField"
 | 
			
		||||
      [currentSortReverse]="list.sortReverse"
 | 
			
		||||
      (sort)="onSort($event)"
 | 
			
		||||
      i18n>
 | 
			
		||||
      Document type
 | 
			
		||||
    </th>
 | 
			
		||||
    <th
 | 
			
		||||
      sortable="created"
 | 
			
		||||
      [currentSortField]="list.sortField"
 | 
			
		||||
      [currentSortReverse]="list.sortReverse"
 | 
			
		||||
      (sort)="onSort($event)"
 | 
			
		||||
      i18n>
 | 
			
		||||
      Created
 | 
			
		||||
    </th>
 | 
			
		||||
    <th class="d-none d-xl-table-cell"
 | 
			
		||||
      sortable="added"
 | 
			
		||||
      [currentSortField]="list.sortField"
 | 
			
		||||
      [currentSortReverse]="list.sortReverse"
 | 
			
		||||
      (sort)="onSort($event)"
 | 
			
		||||
      i18n>
 | 
			
		||||
      Added
 | 
			
		||||
    </th>
 | 
			
		||||
  </thead>
 | 
			
		||||
  <tbody>
 | 
			
		||||
    <tr *ngFor="let d of list.documents; trackBy: trackByDocumentId" [ngClass]="list.isSelected(d) ? 'table-row-selected' : ''">
 | 
			
		||||
 
 | 
			
		||||
@@ -1,8 +1,9 @@
 | 
			
		||||
import { Component, OnInit, ViewChild } from '@angular/core';
 | 
			
		||||
import { AfterViewInit, Component, OnInit, QueryList, ViewChild, ViewChildren } from '@angular/core';
 | 
			
		||||
import { ActivatedRoute, Router } from '@angular/router';
 | 
			
		||||
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
 | 
			
		||||
import { PaperlessDocument } from 'src/app/data/paperless-document';
 | 
			
		||||
import { PaperlessSavedView } from 'src/app/data/paperless-saved-view';
 | 
			
		||||
import { SortableDirective, SortEvent } from 'src/app/directives/sortable.directive';
 | 
			
		||||
import { DocumentListViewService } from 'src/app/services/document-list-view.service';
 | 
			
		||||
import { DOCUMENT_SORT_FIELDS } from 'src/app/services/rest/document.service';
 | 
			
		||||
import { SavedViewService } from 'src/app/services/rest/saved-view.service';
 | 
			
		||||
@@ -28,6 +29,8 @@ export class DocumentListComponent implements OnInit {
 | 
			
		||||
  @ViewChild("filterEditor")
 | 
			
		||||
  private filterEditor: FilterEditorComponent
 | 
			
		||||
 | 
			
		||||
  @ViewChildren(SortableDirective) headers: QueryList<SortableDirective>;
 | 
			
		||||
  
 | 
			
		||||
  displayMode = 'smallCards' // largeCards, smallCards, details
 | 
			
		||||
 | 
			
		||||
  get isFiltered() {
 | 
			
		||||
@@ -42,6 +45,10 @@ export class DocumentListComponent implements OnInit {
 | 
			
		||||
    return DOCUMENT_SORT_FIELDS
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  onSort(event: SortEvent) {
 | 
			
		||||
    this.list.setSort(event.column, event.reverse)
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  get isBulkEditing(): boolean {
 | 
			
		||||
    return this.list.selected.size > 0
 | 
			
		||||
  }
 | 
			
		||||
@@ -73,7 +80,6 @@ export class DocumentListComponent implements OnInit {
 | 
			
		||||
    })
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
  loadViewConfig(view: PaperlessSavedView) {
 | 
			
		||||
    this.list.load(view)
 | 
			
		||||
    this.list.reload()
 | 
			
		||||
 
 | 
			
		||||
@@ -9,10 +9,10 @@
 | 
			
		||||
<table class="table table-striped border shadow">
 | 
			
		||||
    <thead>
 | 
			
		||||
    <tr>
 | 
			
		||||
      <th scope="col" sortable="name" (sort)="onSort($event)" i18n>Name</th>
 | 
			
		||||
      <th scope="col" sortable="matching_algorithm" (sort)="onSort($event)" i18n>Matching</th>
 | 
			
		||||
      <th scope="col" sortable="document_count" (sort)="onSort($event)" i18n>Document count</th>
 | 
			
		||||
      <th scope="col" sortable="last_correspondence" (sort)="onSort($event)" i18n>Last correspondence</th>
 | 
			
		||||
      <th scope="col" sortable="name" [currentSortField]="sortField" [currentSortReverse]="sortReverse" (sort)="onSort($event)" i18n>Name</th>
 | 
			
		||||
      <th scope="col" sortable="matching_algorithm" [currentSortField]="sortField" [currentSortReverse]="sortReverse" (sort)="onSort($event)" i18n>Matching</th>
 | 
			
		||||
      <th scope="col" sortable="document_count" [currentSortField]="sortField" [currentSortReverse]="sortReverse" (sort)="onSort($event)" i18n>Document count</th>
 | 
			
		||||
      <th scope="col" sortable="last_correspondence" [currentSortField]="sortField" [currentSortReverse]="sortReverse" (sort)="onSort($event)" i18n>Last correspondence</th>
 | 
			
		||||
      <th scope="col" i18n>Actions</th>
 | 
			
		||||
    </tr>
 | 
			
		||||
    </thead>
 | 
			
		||||
 
 | 
			
		||||
@@ -10,9 +10,9 @@
 | 
			
		||||
<table class="table table-striped border shadow">
 | 
			
		||||
  <thead>
 | 
			
		||||
    <tr>
 | 
			
		||||
      <th scope="col" sortable="name" (sort)="onSort($event)" i18n>Name</th>
 | 
			
		||||
      <th scope="col" sortable="matching_algorithm" (sort)="onSort($event)" i18n>Matching</th>
 | 
			
		||||
      <th scope="col" sortable="document_count" (sort)="onSort($event)" i18n>Document count</th>
 | 
			
		||||
      <th scope="col" sortable="name" [currentSortField]="sortField" [currentSortReverse]="sortReverse" (sort)="onSort($event)" i18n>Name</th>
 | 
			
		||||
      <th scope="col" sortable="matching_algorithm" [currentSortField]="sortField" [currentSortReverse]="sortReverse" (sort)="onSort($event)" i18n>Matching</th>
 | 
			
		||||
      <th scope="col" sortable="document_count" [currentSortField]="sortField" [currentSortReverse]="sortReverse" (sort)="onSort($event)" i18n>Document count</th>
 | 
			
		||||
      <th scope="col" i18n>Actions</th>
 | 
			
		||||
    </tr>
 | 
			
		||||
  </thead>
 | 
			
		||||
 
 | 
			
		||||
@@ -39,21 +39,8 @@ export abstract class GenericListComponent<T extends ObjectWithId> implements On
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  onSort(event: SortEvent) {
 | 
			
		||||
 | 
			
		||||
    if (event.sorted) {
 | 
			
		||||
      this.sortField = event.column
 | 
			
		||||
      this.sortReverse = event.reverse
 | 
			
		||||
    } else {
 | 
			
		||||
      this.sortField = null
 | 
			
		||||
      this.sortReverse = false
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    this.headers.forEach(header => {
 | 
			
		||||
      if (header.sortable !== this.sortField) {
 | 
			
		||||
        header.sorted = false
 | 
			
		||||
      }
 | 
			
		||||
    });
 | 
			
		||||
 | 
			
		||||
    this.sortField = event.column
 | 
			
		||||
    this.sortReverse = event.reverse
 | 
			
		||||
    this.reloadData()
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
 
 | 
			
		||||
@@ -10,10 +10,10 @@
 | 
			
		||||
<table class="table table-striped border shadow-sm">
 | 
			
		||||
  <thead>
 | 
			
		||||
    <tr>
 | 
			
		||||
      <th scope="col" sortable="name" (sort)="onSort($event)" i18n>Name</th>
 | 
			
		||||
      <th scope="col" sortable="name" [currentSortField]="sortField" [currentSortReverse]="sortReverse" (sort)="onSort($event)" i18n>Name</th>
 | 
			
		||||
      <th scope="col" i18n>Color</th>
 | 
			
		||||
      <th scope="col" sortable="matching_algorithm" (sort)="onSort($event)" i18n>Matching</th>
 | 
			
		||||
      <th scope="col" sortable="document_count" (sort)="onSort($event)" i18n>Document count</th>
 | 
			
		||||
      <th scope="col" sortable="matching_algorithm" [currentSortField]="sortField" [currentSortReverse]="sortReverse" (sort)="onSort($event)" i18n>Matching</th>
 | 
			
		||||
      <th scope="col" sortable="document_count" [currentSortField]="sortField" [currentSortReverse]="sortReverse" (sort)="onSort($event)" i18n>Document count</th>
 | 
			
		||||
      <th scope="col" i18n>Actions</th>
 | 
			
		||||
    </tr>
 | 
			
		||||
  </thead>
 | 
			
		||||
 
 | 
			
		||||
@@ -2,15 +2,14 @@ import { Directive, EventEmitter, Input, Output } from '@angular/core';
 | 
			
		||||
 | 
			
		||||
export interface SortEvent {
 | 
			
		||||
  column: string
 | 
			
		||||
  sorted: boolean
 | 
			
		||||
  reverse: boolean
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
@Directive({
 | 
			
		||||
  selector: 'th[sortable]',
 | 
			
		||||
  host: {
 | 
			
		||||
    '[class.asc]': 'sorted && !reverse',
 | 
			
		||||
    '[class.des]': 'sorted && reverse',
 | 
			
		||||
    '[class.asc]': 'currentSortField == sortable && !currentSortReverse',
 | 
			
		||||
    '[class.des]': 'currentSortField == sortable && currentSortReverse',
 | 
			
		||||
    '(click)': 'rotate()'
 | 
			
		||||
  }
 | 
			
		||||
})
 | 
			
		||||
@@ -22,22 +21,20 @@ export class SortableDirective {
 | 
			
		||||
  sortable: string = '';
 | 
			
		||||
 | 
			
		||||
  @Input()
 | 
			
		||||
  sorted: boolean = false
 | 
			
		||||
  currentSortReverse: boolean = false
 | 
			
		||||
 | 
			
		||||
  @Input()
 | 
			
		||||
  reverse: boolean = false
 | 
			
		||||
  currentSortField: string
 | 
			
		||||
 | 
			
		||||
  @Output() sort = new EventEmitter<SortEvent>();
 | 
			
		||||
 | 
			
		||||
  rotate() {
 | 
			
		||||
    if (!this.sorted) {
 | 
			
		||||
      this.sorted = true
 | 
			
		||||
      this.reverse = false
 | 
			
		||||
    } else if (this.sorted && !this.reverse) {
 | 
			
		||||
      this.reverse = true
 | 
			
		||||
    if (this.currentSortField != this.sortable) {
 | 
			
		||||
      this.sort.emit({column: this.sortable, reverse: false});
 | 
			
		||||
    } else if (this.currentSortField == this.sortable && !this.currentSortReverse) {
 | 
			
		||||
      this.sort.emit({column: this.currentSortField, reverse: true});
 | 
			
		||||
    } else {
 | 
			
		||||
      this.sorted = false
 | 
			
		||||
      this.sort.emit({column: null, reverse: false});
 | 
			
		||||
    }
 | 
			
		||||
    this.sort.emit({column: this.sortable, sorted: this.sorted, reverse: this.reverse});
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user