Fix pagination

This commit is contained in:
shamoon 2024-04-30 16:08:58 -07:00
parent 413320674b
commit ecee3ae477
6 changed files with 33 additions and 26 deletions

View File

@ -18,7 +18,7 @@ info="Manage trashed items."
</pngx-page-header> </pngx-page-header>
<div class="row mb-3"> <div class="row mb-3">
<ngb-pagination class="col-auto" [pageSize]="25" [collectionSize]="documentsInTrash.length" [(page)]="page" [maxSize]="5" (pageChange)="reload()" size="sm" aria-label="Pagination"></ngb-pagination> <ngb-pagination class="col-auto" [pageSize]="25" [collectionSize]="totalDocuments" [(page)]="page" [maxSize]="5" (pageChange)="reload()" size="sm" aria-label="Pagination"></ngb-pagination>
</div> </div>
<div class="card border table-responsive mb-3"> <div class="card border table-responsive mb-3">
@ -85,13 +85,13 @@ info="Manage trashed items."
@if (!isLoading) { @if (!isLoading) {
<div class="d-flex mb-2"> <div class="d-flex mb-2">
<div> <div>
<ng-container i18n>{documentsInTrash.length, plural, =1 {One object in trash} other {{{documentsInTrash.length || 0}} total documents in trash}}</ng-container> <ng-container i18n>{totalDocuments, plural, =1 {One object in trash} other {{{totalDocuments || 0}} total documents in trash}}</ng-container>
@if (selectedDocuments.size > 0) { @if (selectedDocuments.size > 0) {
&nbsp;({{selectedDocuments.size}} selected) &nbsp;({{selectedDocuments.size}} selected)
} }
</div> </div>
@if (documentsInTrash.length > 20) { @if (documentsInTrash.length > 20) {
<ngb-pagination class="ms-auto" [pageSize]="25" [collectionSize]="documentsInTrash.length" [(page)]="page" [maxSize]="5" (pageChange)="reload()" size="sm" aria-label="Pagination"></ngb-pagination> <ngb-pagination class="ms-auto" [pageSize]="25" [collectionSize]="totalDocuments" [(page)]="page" [maxSize]="5" (pageChange)="reload()" size="sm" aria-label="Pagination"></ngb-pagination>
} }
</div> </div>
} }

View File

@ -62,7 +62,13 @@ describe('TrashComponent', () => {
it('should call correct service method on reload', () => { it('should call correct service method on reload', () => {
const trashSpy = jest.spyOn(trashService, 'getTrash') const trashSpy = jest.spyOn(trashService, 'getTrash')
trashSpy.mockReturnValue(of(documentsInTrash)) trashSpy.mockReturnValue(
of({
count: 2,
all: documentsInTrash.map((d) => d.id),
results: documentsInTrash,
})
)
component.reload() component.reload()
expect(trashSpy).toHaveBeenCalled() expect(trashSpy).toHaveBeenCalled()
expect(component.documentsInTrash).toEqual(documentsInTrash) expect(component.documentsInTrash).toEqual(documentsInTrash)

View File

@ -18,6 +18,7 @@ export class TrashComponent implements OnDestroy {
public selectedDocuments: Set<number> = new Set() public selectedDocuments: Set<number> = new Set()
public allToggled: boolean = false public allToggled: boolean = false
public page: number = 1 public page: number = 1
public totalDocuments: number
public isLoading: boolean = false public isLoading: boolean = false
unsubscribeNotifier: Subject<void> = new Subject() unsubscribeNotifier: Subject<void> = new Subject()
@ -37,8 +38,9 @@ export class TrashComponent implements OnDestroy {
reload() { reload() {
this.isLoading = true this.isLoading = true
this.trashService.getTrash().subscribe((documentsInTrash) => { this.trashService.getTrash(this.page).subscribe((r) => {
this.documentsInTrash = documentsInTrash this.documentsInTrash = r.results
this.totalDocuments = r.count
this.isLoading = false this.isLoading = false
this.selectedDocuments.clear() this.selectedDocuments.clear()
}) })

View File

@ -22,7 +22,7 @@ describe('TrashServiceService', () => {
it('should call correct endpoint for getTrash', () => { it('should call correct endpoint for getTrash', () => {
service.getTrash().subscribe() service.getTrash().subscribe()
const req = httpTestingController.expectOne( const req = httpTestingController.expectOne(
`${environment.apiBaseUrl}trash/` `${environment.apiBaseUrl}trash/?page=1`
) )
expect(req.request.method).toEqual('GET') expect(req.request.method).toEqual('GET')
}) })

View File

@ -1,8 +1,9 @@
import { HttpClient } from '@angular/common/http' import { HttpClient, HttpParams } from '@angular/common/http'
import { Injectable } from '@angular/core' import { Injectable } from '@angular/core'
import { Observable } from 'rxjs' import { Observable } from 'rxjs'
import { environment } from 'src/environments/environment' import { environment } from 'src/environments/environment'
import { Document } from '../data/document' import { Document } from '../data/document'
import { Results } from '../data/results'
@Injectable({ @Injectable({
providedIn: 'root', providedIn: 'root',
@ -10,8 +11,11 @@ import { Document } from '../data/document'
export class TrashService { export class TrashService {
constructor(private http: HttpClient) {} constructor(private http: HttpClient) {}
public getTrash(): Observable<Document[]> { public getTrash(page: number = 1): Observable<Results<Document>> {
return this.http.get<Document[]>(`${environment.apiBaseUrl}trash/`) const httpParams = new HttpParams().set('page', page.toString())
return this.http.get<Results<Document>>(`${environment.apiBaseUrl}trash/`, {
params: httpParams,
})
} }
public emptyTrash(documents: number[] = []): Observable<any> { public emptyTrash(documents: number[] = []): Observable<any> {

View File

@ -2056,24 +2056,19 @@ class SystemStatusView(PassUserMixin):
) )
class TrashView(PassUserMixin): class TrashView(ListModelMixin, PassUserMixin):
permission_classes = (IsAuthenticated,) permission_classes = (IsAuthenticated, PaperlessObjectPermissions)
serializer_class = TrashSerializer serializer_class = TrashSerializer
filter_backends = (ObjectOwnedOrGrantedPermissionsFilter,)
pagination_class = StandardPagination
model = Document
queryset = Document.deleted_objects.all()
def get(self, request, format=None): def get(self, request, format=None):
user = self.request.user self.serializer_class = DocumentSerializer
documents = Document.deleted_objects.filter( return self.list(request, format)
owner=user,
) | Document.deleted_objects.filter(
owner=None,
)
context = {
"request": request,
}
serializer = DocumentSerializer(documents, many=True, context=context)
return Response(serializer.data)
def post(self, request, *args, **kwargs): def post(self, request, *args, **kwargs):
serializer = self.get_serializer(data=request.data) serializer = self.get_serializer(data=request.data)