mirror of
https://github.com/paperless-ngx/paperless-ngx.git
synced 2025-10-30 03:56:23 -05:00
Working date filtering
This commit is contained in:
Michael Shamoon
@@ -11,7 +11,7 @@ import { SavedViewConfigService } from 'src/app/services/saved-view-config.servi
|
||||
import { Toast, ToastService } from 'src/app/services/toast.service';
|
||||
import { environment } from 'src/environments/environment';
|
||||
import { SaveViewConfigDialogComponent } from './save-view-config-dialog/save-view-config-dialog.component';
|
||||
import { FilterEditorComponent } from './filter-editor/filter-editor.component';
|
||||
import { FilterEditorComponent } from 'src/app/components/filter-editor/filter-editor.component';
|
||||
import { PaperlessTag } from 'src/app/data/paperless-tag';
|
||||
import { PaperlessCorrespondent } from 'src/app/data/paperless-correspondent';
|
||||
import { PaperlessDocumentType } from 'src/app/data/paperless-document-type';
|
||||
|
||||
@@ -3,15 +3,15 @@
|
||||
<div class="dropdown-menu date-filter shadow" ngbDropdownMenu attr.aria-labelledby="dropdown{{title}}">
|
||||
<div class="list-group list-group-flush">
|
||||
<div class="list-group-item d-flex flex-column align-items-start">
|
||||
<button class="btn btn-sm btn-link pl-0" (click)="setQuickFilter(7)">Last 7 days</button>
|
||||
<button class="btn btn-sm btn-link pl-0" (click)="setQuickFilter(30)">Last 30 days</button>
|
||||
<button class="btn btn-sm btn-link pl-0" *ngIf="showMonth" (click)="setQuickFilter('month')">This month</button>
|
||||
<button class="btn btn-sm btn-link pl-0" *ngIf="showYear" (click)="setQuickFilter('year')">This year</button>
|
||||
<button class="btn btn-sm btn-link pl-0" (click)="setDateQuickFilter(7)">Last 7 days</button>
|
||||
<button class="btn btn-sm btn-link pl-0" (click)="setDateQuickFilter(30)">Last 30 days</button>
|
||||
<button class="btn btn-sm btn-link pl-0" (click)="setDateQuickFilter('month')">This month</button>
|
||||
<button class="btn btn-sm btn-link pl-0" (click)="setDateQuickFilter('year')">This year</button>
|
||||
</div>
|
||||
<div class="list-group-item d-flex flex-column align-items-start" role="menuitem">
|
||||
<div class="mb-1"><small>Before</small></div>
|
||||
<div class="input-group input-group-sm">
|
||||
<input class="form-control" type="text" placeholder="yyyy-mm-dd" name="before" [(ngModel)]="dateBefore" ngbDatepicker #dpBefore="ngbDatepicker">
|
||||
<input class="form-control" type="text" placeholder="yyyy-mm-dd" name="before" [(ngModel)]="dateBefore" ngbDatepicker (dateSelect)="dateSelected($event)" #dpBefore="ngbDatepicker">
|
||||
<div class="input-group-append">
|
||||
<button class="btn btn-outline-secondary btn-sm" (click)="dpBefore.toggle()" type="button">
|
||||
<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-calendar-date" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
|
||||
@@ -25,7 +25,7 @@
|
||||
<div class="list-group-item d-flex flex-column align-items-start" role="menuitem">
|
||||
<div class="mb-1"><small>After</small></div>
|
||||
<div class="input-group">
|
||||
<input class="form-control form-control-sm" type="text" placeholder="yyyy-mm-dd" name="after" [(ngModel)]="dateAfter" ngbDatepicker #dpAfter="ngbDatepicker">
|
||||
<input class="form-control form-control-sm" type="text" placeholder="yyyy-mm-dd" name="after" [(ngModel)]="dateAfter" ngbDatepicker (dateSelect)="dateSelected($event)" #dpAfter="ngbDatepicker">
|
||||
<div class="input-group-append">
|
||||
<button class="btn btn-outline-secondary btn-sm" (click)="dpAfter.toggle()" type="button">
|
||||
<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-calendar-date" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import { Component, EventEmitter, Input, OnInit, Output, ElementRef, ViewChild } from '@angular/core';
|
||||
import { FilterRule } from 'src/app/data/filter-rule';
|
||||
import { FilterRuleType, FILTER_RULE_TYPES } from 'src/app/data/filter-rule-type';
|
||||
import { ObjectWithId } from 'src/app/data/object-with-id';
|
||||
import { FilterDropdownComponent } from '../filter-dropdown.component'
|
||||
@@ -18,8 +19,6 @@ export class FilterDropdownDateComponent extends FilterDropdownComponent {
|
||||
selected = new EventEmitter()
|
||||
|
||||
filterRuleTypes: FilterRuleType[] = []
|
||||
showYear: boolean = false
|
||||
showMonth: boolean = false
|
||||
dateAfter: NgbDateStruct
|
||||
dateBefore: NgbDateStruct
|
||||
|
||||
@@ -27,27 +26,36 @@ export class FilterDropdownDateComponent extends FilterDropdownComponent {
|
||||
this.filterRuleTypes = this.filterRuleTypeIDs.map(id => FILTER_RULE_TYPES.find(rt => rt.id == id))
|
||||
this.filterRuleTypeID = this.filterRuleTypeIDs[0]
|
||||
super.ngOnInit()
|
||||
|
||||
this.showYear = this.filterRuleTypes.find(rt => rt.filtervar.indexOf('year') > -1) !== undefined
|
||||
this.showMonth = this.filterRuleTypes.find(rt => rt.filtervar.indexOf('month') > -1) !== undefined
|
||||
}
|
||||
|
||||
setQuickFilter(range: any) {
|
||||
setDateQuickFilter(range: any) {
|
||||
this.dateAfter = this.dateBefore = undefined
|
||||
let now = new Date()
|
||||
switch (typeof range) {
|
||||
case 'number':
|
||||
let date = new Date();
|
||||
date.setDate(date.getDate() - range)
|
||||
this.dateAfter = { year: date.getFullYear(), month: date.getMonth() + 1, day: date.getDate() }
|
||||
now.setDate(now.getDate() - range)
|
||||
this.dateAfter = { year: now.getFullYear(), month: now.getMonth() + 1, day: now.getDate() }
|
||||
this.dateSelected(this.dateAfter)
|
||||
break;
|
||||
|
||||
case 'string':
|
||||
let filterRuleType = this.filterRuleTypes.find(rt => rt.filtervar.indexOf(range) > -1)
|
||||
console.log(range);
|
||||
let date = { year: now.getFullYear(), month: now.getMonth() + 1, day: 1 }
|
||||
if (range == 'year') date.month = 1
|
||||
this.dateAfter = date
|
||||
this.dateSelected(this.dateAfter)
|
||||
break;
|
||||
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
dateSelected(date:NgbDateStruct) {
|
||||
let isAfter = this.dateAfter !== undefined
|
||||
let filterRuleType = this.filterRuleTypes.find(rt => rt.filtervar.indexOf(isAfter ? 'gt' : 'lt') > -1)
|
||||
if (filterRuleType) {
|
||||
let dateFilterRule:FilterRule = {value: `${date.year}-${date.month}-${date.day}`, type: filterRuleType}
|
||||
this.selected.emit(dateFilterRule)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
|
||||
<app-filter-dropdown class="col-auto" *ngFor="let quickFilterRuleTypeID of quickFilterRuleTypeIDs" [filterRuleTypeID]="quickFilterRuleTypeID" (toggle)="toggleFilterByItem($event, quickFilterRuleTypeID)"></app-filter-dropdown>
|
||||
|
||||
<app-filter-dropdown-date class="col-auto" *ngFor="let dateAddedFilterRuleTypeID of dateAddedFilterRuleTypeIDs" [filterRuleTypeIDs]="dateAddedFilterRuleTypeID" (toggle)="toggleFilterByItem($event, quickFilterRuleTypeID)"></app-filter-dropdown-date>
|
||||
<app-filter-dropdown-date class="col-auto" *ngFor="let dateAddedFilterRuleTypeID of dateAddedFilterRuleTypeIDs" [filterRuleTypeIDs]="dateAddedFilterRuleTypeID" (selected)="setDateFilter($event)"></app-filter-dropdown-date>
|
||||
|
||||
<button class="btn btn-link btn-sm" [disabled]="!hasFilters()" (click)="clearSelected()">
|
||||
<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-x" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
|
||||
|
||||
@@ -12,6 +12,7 @@ import { TagService } from 'src/app/services/rest/tag.service';
|
||||
import { FilterDropdownComponent } from './filter-dropdown/filter-dropdown.component'
|
||||
import { fromEvent } from 'rxjs';
|
||||
import { debounceTime, distinctUntilChanged, tap } from 'rxjs/operators';
|
||||
import { NgbDateStruct } from '@ng-bootstrap/ng-bootstrap';
|
||||
|
||||
@Component({
|
||||
selector: 'app-filter-editor',
|
||||
@@ -35,7 +36,7 @@ export class FilterEditorComponent implements OnInit, AfterViewInit {
|
||||
@ViewChildren(FilterDropdownComponent) quickFilterDropdowns!: QueryList<FilterDropdownComponent>;
|
||||
|
||||
quickFilterRuleTypeIDs: number[] = [FILTER_HAS_TAG, FILTER_CORRESPONDENT, FILTER_DOCUMENT_TYPE]
|
||||
dateAddedFilterRuleTypeIDs: any[] = [[FILTER_ADDED_BEFORE, FILTER_ADDED_AFTER], [FILTER_CREATED_BEFORE, FILTER_CREATED_AFTER, FILTER_CREATED_YEAR, FILTER_CREATED_MONTH, FILTER_CREATED_DAY]]
|
||||
dateAddedFilterRuleTypeIDs: any[] = [[FILTER_ADDED_BEFORE, FILTER_ADDED_AFTER], [FILTER_CREATED_BEFORE, FILTER_CREATED_AFTER]]
|
||||
|
||||
correspondents: PaperlessCorrespondent[] = []
|
||||
tags: PaperlessTag[] = []
|
||||
@@ -147,4 +148,18 @@ export class FilterEditorComponent implements OnInit, AfterViewInit {
|
||||
this.applySelected()
|
||||
}
|
||||
|
||||
setDateFilter(newFilterRule: FilterRule) {
|
||||
let filterRules = this.filterRules
|
||||
let existingRule = filterRules.find(rule => rule.type.id == newFilterRule.type.id)
|
||||
|
||||
if (existingRule) {
|
||||
existingRule.value = newFilterRule.value
|
||||
} else {
|
||||
filterRules.push(newFilterRule)
|
||||
}
|
||||
|
||||
this.filterRules = filterRules
|
||||
this.applySelected()
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user