import { TagEditDialogComponent } from './components/common/edit-dialog/tag-edit-dialog/tag-edit-dialog.component'
import { DocumentTypeEditDialogComponent } from './components/common/edit-dialog/document-type-edit-dialog/document-type-edit-dialog.component'
import { TagComponent } from './components/common/tag/tag.component'
-import { ClearableBadge } from './components/common/clearable-badge/clearable-badge.component'
+import { ClearableBadgeComponent } from './components/common/clearable-badge/clearable-badge.component'
import { PageHeaderComponent } from './components/common/page-header/page-header.component'
import { AppFrameComponent } from './components/app-frame/app-frame.component'
import { ToastsComponent } from './components/common/toasts/toasts.component'
DocumentTypeEditDialogComponent,
StoragePathEditDialogComponent,
TagComponent,
- ClearableBadge,
+ ClearableBadgeComponent,
PageHeaderComponent,
AppFrameComponent,
ToastsComponent,
templateUrl: './clearable-badge.component.html',
styleUrls: ['./clearable-badge.component.scss'],
})
-export class ClearableBadge {
+export class ClearableBadgeComponent {
constructor() {}
@Input()
object: T
@Output()
- success = new EventEmitter()
+ succeeded = new EventEmitter()
networkActive = false
serverResponse.subscribe({
next: (result) => {
this.activeModal.close()
- this.success.emit(result)
+ this.succeeded.emit(result)
},
error: (error) => {
this.error = error.error
</div>
<div class="modal-body">
- <p *ngIf="this.dialogMode == 'edit'" i18n>
+ <p *ngIf="this.dialogMode === 'edit'" i18n>
<em>Note that editing a path does not apply changes to stored files until you have run the 'document_renamer' utility. See the <a target="_blank" href="https://docs.paperless-ngx.com/administration/#renamer">documentation</a>.</em>
</p>
apply = new EventEmitter<ChangedItems>()
@Output()
- open = new EventEmitter()
+ opened = new EventEmitter()
get operatorToggleEnabled(): boolean {
return (
if (this.editing) {
this.selectionModel.reset()
}
- this.open.next(this)
+ this.opened.next(this)
} else {
this.filterText = ''
if (this.applyOnClose && this.selectionModel.isDirty()) {
-import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'
+import { Component, EventEmitter, Input, Output } from '@angular/core'
import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap'
import { ObjectWithId } from 'src/app/data/object-with-id'
templateUrl: './select-dialog.component.html',
styleUrls: ['./select-dialog.component.scss'],
})
-export class SelectDialogComponent implements OnInit {
+export class SelectDialogComponent {
constructor(public activeModal: NgbActiveModal) {}
@Output()
selected: number
- ngOnInit(): void {}
-
cancelClicked() {
this.activeModal.close()
}
-import { Component, Input, OnInit } from '@angular/core'
+import { Component, Input } from '@angular/core'
import { PaperlessTag } from 'src/app/data/paperless-tag'
@Component({
templateUrl: './tag.component.html',
styleUrls: ['./tag.component.scss'],
})
-export class TagComponent implements OnInit {
+export class TagComponent {
constructor() {}
@Input()
@Input()
clickable: boolean = false
-
- ngOnInit(): void {}
}
<app-widget-frame title="Statistics" [loading]="loading" i18n-title>
<ng-container content>
- <p class="card-text" i18n *ngIf="statistics?.documents_inbox != null">Documents in inbox: {{statistics?.documents_inbox}}</p>
+ <p class="card-text" i18n *ngIf="statistics?.documents_inbox !== null">Documents in inbox: {{statistics?.documents_inbox}}</p>
<p class="card-text" i18n>Total documents: {{statistics?.documents_total}}</p>
</ng-container>
</app-widget-frame>
-import { HttpEventType } from '@angular/common/http'
-import { Component, OnInit } from '@angular/core'
-import { FileSystemFileEntry, NgxFileDropEntry } from 'ngx-file-drop'
+import { Component } from '@angular/core'
+import { NgxFileDropEntry } from 'ngx-file-drop'
import {
ConsumerStatusService,
FileStatus,
templateUrl: './upload-file-widget.component.html',
styleUrls: ['./upload-file-widget.component.scss'],
})
-export class UploadFileWidgetComponent implements OnInit {
+export class UploadFileWidgetComponent {
alertsExpanded = false
constructor(
this.consumerStatusService.dismissCompleted()
}
- ngOnInit(): void {}
-
public fileOver(event) {}
public fileLeave(event) {}
-import { Component, OnInit } from '@angular/core'
+import { Component } from '@angular/core'
import { TourService } from 'ngx-ui-tour-ng-bootstrap'
@Component({
templateUrl: './welcome-widget.component.html',
styleUrls: ['./welcome-widget.component.scss'],
})
-export class WelcomeWidgetComponent implements OnInit {
+export class WelcomeWidgetComponent {
constructor(public readonly tourService: TourService) {}
-
- ngOnInit(): void {}
}
-import { Component, Input, OnInit } from '@angular/core'
+import { Component, Input } from '@angular/core'
@Component({
selector: 'app-widget-frame',
templateUrl: './widget-frame.component.html',
styleUrls: ['./widget-frame.component.scss'],
})
-export class WidgetFrameComponent implements OnInit {
+export class WidgetFrameComponent {
constructor() {}
@Input()
@Input()
loading: boolean = false
-
- ngOnInit(): void {}
}
<app-page-header [(title)]="title">
- <div class="input-group input-group-sm me-5 d-none d-md-flex" *ngIf="getContentType() == 'application/pdf' && !useNativePdfViewer">
+ <div class="input-group input-group-sm me-5 d-none d-md-flex" *ngIf="getContentType() === 'application/pdf' && !useNativePdfViewer">
<div class="input-group-text" i18n>Page</div>
<input class="form-control flex-grow-0 w-auto" type="number" min="1" [max]="previewNumPages" [(ngModel)]="previewCurrentPage" />
<div class="input-group-text" i18n>of {{previewNumPages}}</div>
<li [ngbNavItem]="4" class="d-md-none">
<a ngbNavLink>Preview</a>
- <ng-template ngbNavContent *ngIf="pdfPreview.offsetParent == undefined">
+ <ng-template ngbNavContent *ngIf="pdfPreview.offsetParent === undefined">
<div class="position-relative">
- <ng-container *ngIf="getContentType() == 'application/pdf'">
+ <ng-container *ngIf="getContentType() === 'application/pdf'">
<div class="preview-sticky pdf-viewer-container" *ngIf="!useNativePdfViewer ; else nativePdfViewer">
<pdf-viewer [src]="{ url: previewUrl, password: password }" [original-size]="false" [show-borders]="true" [show-all]="true" [(page)]="previewCurrentPage" [render-text-mode]="2" (error)="onError($event)" (after-load-complete)="pdfPreviewLoaded($event)"></pdf-viewer>
</div>
<object [data]="previewUrl | safeUrl" class="preview-sticky" width="100%"></object>
</ng-template>
</ng-container>
- <ng-container *ngIf="getContentType() == 'text/plain'">
+ <ng-container *ngIf="getContentType() === 'text/plain'">
<object [data]="previewUrl | safeUrl" type="text/plain" class="preview-sticky bg-white" width="100%"></object>
</ng-container>
<div *ngIf="requiresPassword" class="password-prompt">
<div [ngbNavOutlet]="nav" class="mt-2"></div>
- <button type="button" class="btn btn-outline-secondary" (click)="discard()" i18n [disabled]="networkActive || !(isDirty$ | async)">Discard</button>
- <button type="button" class="btn btn-outline-primary" (click)="saveEditNext()" *ngIf="hasNext()" i18n [disabled]="networkActive || !(isDirty$ | async) || error">Save & next</button>
- <button type="submit" class="btn btn-primary" i18n [disabled]="networkActive || !(isDirty$ | async) || error">Save</button>
+ <button type="button" class="btn btn-outline-secondary" (click)="discard()" i18n [disabled]="networkActive || (isDirty$ | async) === false">Discard</button>
+ <button type="button" class="btn btn-outline-primary" (click)="saveEditNext()" *ngIf="hasNext()" i18n [disabled]="networkActive || (isDirty$ | async) === false || error">Save & next</button>
+ <button type="submit" class="btn btn-primary" i18n [disabled]="networkActive || (isDirty$ | async) === false || error">Save</button>
</form>
</div>
<div class="col-md-6 col-xl-8 mb-3 d-none d-md-block position-relative" #pdfPreview>
- <ng-container *ngIf="getContentType() == 'application/pdf'">
+ <ng-container *ngIf="getContentType() === 'application/pdf'">
<div class="preview-sticky pdf-viewer-container" *ngIf="!useNativePdfViewer ; else nativePdfViewer">
<pdf-viewer [src]="{ url: previewUrl, password: password }" [original-size]="false" [show-borders]="true" [show-all]="true" [(page)]="previewCurrentPage" [render-text-mode]="2" (error)="onError($event)" (after-load-complete)="pdfPreviewLoaded($event)"></pdf-viewer>
</div>
<object [data]="previewUrl | safeUrl" class="preview-sticky" width="100%"></object>
</ng-template>
</ng-container>
- <ng-container *ngIf="getContentType() == 'text/plain'">
+ <ng-container *ngIf="getContentType() === 'text/plain'">
<object [data]="previewUrl | safeUrl" type="text/plain" class="preview-sticky bg-white" width="100%"></object>
</ng-container>
<div *ngIf="requiresPassword" class="password-prompt">
-import { Component, Input, OnInit } from '@angular/core'
+import { Component, Input } from '@angular/core'
@Component({
selector: 'app-metadata-collapse',
templateUrl: './metadata-collapse.component.html',
styleUrls: ['./metadata-collapse.component.scss'],
})
-export class MetadataCollapseComponent implements OnInit {
+export class MetadataCollapseComponent {
constructor() {}
expand = false
@Input()
title = $localize`Metadata`
-
- ngOnInit(): void {}
}
-import { Component } from '@angular/core'
+import { Component, OnDestroy, OnInit } from '@angular/core'
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'
templateUrl: './bulk-editor.component.html',
styleUrls: ['./bulk-editor.component.scss'],
})
-export class BulkEditorComponent {
+export class BulkEditorComponent implements OnInit, OnDestroy {
tags: PaperlessTag[]
correspondents: PaperlessCorrespondent[]
documentTypes: PaperlessDocumentType[]
Component,
EventEmitter,
Input,
- OnInit,
Output,
ViewChild,
} from '@angular/core'
'../popover-preview/popover-preview.scss',
],
})
-export class DocumentCardLargeComponent implements OnInit {
+export class DocumentCardLargeComponent {
constructor(
private documentService: DocumentService,
private settingsService: SettingsService
}
}
- ngOnInit(): void {}
-
getIsThumbInverted() {
return this.settingsService.get(SETTINGS_KEYS.DARK_MODE_THUMB_INVERTED)
}
Component,
EventEmitter,
Input,
- OnInit,
Output,
ViewChild,
} from '@angular/core'
'../popover-preview/popover-preview.scss',
],
})
-export class DocumentCardSmallComponent implements OnInit {
+export class DocumentCardSmallComponent {
constructor(
private documentService: DocumentService,
private settingsService: SettingsService
mouseOnPreview = false
popoverHidden = true
- ngOnInit(): void {}
-
getIsThumbInverted() {
return this.settingsService.get(SETTINGS_KEYS.DARK_MODE_THUMB_INVERTED)
}
</div>
<div>
<button *ngFor="let f of getSortFields()" ngbDropdownItem (click)="setSortField(f.field)"
- [class.active]="list.sortField == f.field">{{f.name}}
+ [class.active]="list.sortField === f.field">{{f.name}}
</button>
</div>
</div>
</ng-container>
<span i18n *ngIf="list.selected.size > 0">{list.collectionSize, plural, =1 {Selected {{list.selected.size}} of one document} other {Selected {{list.selected.size}} of {{list.collectionSize || 0}} documents}}</span>
<ng-container *ngIf="!list.isReloading">
- <span i18n *ngIf="list.selected.size == 0">{list.collectionSize, plural, =1 {One document} other {{{list.collectionSize || 0}} documents}}</span> <span i18n *ngIf="isFiltered">(filtered)</span>
+ <span i18n *ngIf="list.selected.size === 0">{list.collectionSize, plural, =1 {One document} other {{{list.collectionSize || 0}} documents}}</span> <span i18n *ngIf="isFiltered">(filtered)</span>
</ng-container>
</p>
<ngb-pagination *ngIf="list.collectionSize" [pageSize]="list.currentPageSize" [collectionSize]="list.collectionSize" [(page)]="list.currentPage" [maxSize]="5"
</ng-container>
<ng-template #documentListNoError>
- <div *ngIf="displayMode == 'largeCards'">
+ <div *ngIf="displayMode === 'largeCards'">
<app-document-card-large [selected]="list.isSelected(d)" (toggleSelected)="toggleSelected(d, $event)" *ngFor="let d of list.documents; trackBy: trackByDocumentId" [document]="d" (clickTag)="clickTag($event)" (clickCorrespondent)="clickCorrespondent($event)" (clickDocumentType)="clickDocumentType($event)" (clickStoragePath)="clickStoragePath($event)" (clickMoreLike)="clickMoreLike(d.id)">
</app-document-card-large>
</div>
- <table class="table table-sm align-middle border shadow-sm" *ngIf="displayMode == 'details'">
+ <table class="table table-sm align-middle border shadow-sm" *ngIf="displayMode === 'details'">
<thead>
<th></th>
<th class="d-none d-lg-table-cell"
- sortable="archive_serial_number"
+ appSortable="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"
+ appSortable="correspondent__name"
[currentSortField]="list.sortField"
[currentSortReverse]="list.sortReverse"
(sort)="onSort($event)"
i18n>Correspondent</th>
<th
- sortable="title"
+ appSortable="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"
+ appSortable="document_type__name"
[currentSortField]="list.sortField"
[currentSortReverse]="list.sortReverse"
(sort)="onSort($event)"
i18n>Document type</th>
<th class="d-none d-xl-table-cell"
- sortable="storage_path__name"
+ appSortable="storage_path__name"
[currentSortField]="list.sortField"
[currentSortReverse]="list.sortReverse"
(sort)="onSort($event)"
i18n>Storage path</th>
<th
- sortable="created"
+ appSortable="created"
[currentSortField]="list.sortField"
[currentSortReverse]="list.sortReverse"
(sort)="onSort($event)"
i18n>Created</th>
<th class="d-none d-xl-table-cell"
- sortable="added"
+ appSortable="added"
[currentSortField]="list.sortField"
[currentSortReverse]="list.sortReverse"
(sort)="onSort($event)"
</tbody>
</table>
- <div class="row row-cols-paperless-cards" *ngIf="displayMode == 'smallCards'">
+ <div class="row row-cols-paperless-cards" *ngIf="displayMode === 'smallCards'">
<app-document-card-small class="p-0" [selected]="list.isSelected(d)" (toggleSelected)="toggleSelected(d, $event)" [document]="d" *ngFor="let d of list.documents; trackBy: trackByDocumentId" (clickTag)="clickTag($event)" (clickCorrespondent)="clickCorrespondent($event)" (clickStoragePath)="clickStoragePath($event)" (clickDocumentType)="clickDocumentType($event)"></app-document-card-small>
</div>
<div *ngIf="list.documents?.length > 15" class="mt-3">
<div ngbDropdown>
<button class="btn btn-sm btn-outline-primary" ngbDropdownToggle>{{textFilterTargetName}}</button>
<div class="dropdown-menu shadow" ngbDropdownMenu>
- <button *ngFor="let t of textFilterTargets" ngbDropdownItem [class.active]="textFilterTarget == t.id" (click)="changeTextFilterTarget(t.id)">{{t.name}}</button>
+ <button *ngFor="let t of textFilterTargets" ngbDropdownItem [class.active]="textFilterTarget === t.id" (click)="changeTextFilterTarget(t.id)">{{t.name}}</button>
</div>
</div>
- <select *ngIf="textFilterTarget == 'asn'" class="form-select flex-grow-0 w-auto" [(ngModel)]="textFilterModifier" (change)="textFilterModifierChange()">
+ <select *ngIf="textFilterTarget === 'asn'" class="form-select flex-grow-0 w-auto" [(ngModel)]="textFilterModifier" (change)="textFilterModifierChange()">
<option *ngFor="let m of textFilterModifiers" ngbDropdownItem [value]="m.id">{{m.label}}</option>
</select>
<button *ngIf="_textFilter" class="btn btn-link btn-sm px-0 position-absolute top-0 end-0 z-10" (click)="resetTextField()">
<path fill-rule="evenodd" d="M4.646 4.646a.5.5 0 0 1 .708 0L8 7.293l2.646-2.647a.5.5 0 0 1 .708.708L8.707 8l2.647 2.646a.5.5 0 0 1-.708.708L8 8.707l-2.646 2.647a.5.5 0 0 1-.708-.708L7.293 8 4.646 5.354a.5.5 0 0 1 0-.708z"/>
</svg>
</button>
- <input #textFilterInput class="form-control form-control-sm" type="text" [disabled]="textFilterModifierIsNull" [(ngModel)]="textFilter" (keyup)="textFilterKeyup($event)" [readonly]="textFilterTarget == 'fulltext-morelike'">
+ <input #textFilterInput class="form-control form-control-sm" type="text" [disabled]="textFilterModifierIsNull" [(ngModel)]="textFilter" (keyup)="textFilterKeyup($event)" [readonly]="textFilterTarget === 'fulltext-morelike'">
</div>
</div>
</div>
<table class="table table-striped align-middle border shadow-sm">
<thead>
<tr>
- <th scope="col" sortable="name" [currentSortField]="sortField" [currentSortReverse]="sortReverse" (sort)="onSort($event)" i18n>Name</th>
- <th scope="col" class="d-none d-sm-table-cell" 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" *ngFor="let column of extraColumns" sortable="{{column.key}}" [currentSortField]="sortField" [currentSortReverse]="sortReverse" (sort)="onSort($event)">{{column.name}}</th>
+ <th scope="col" appSortable="name" [currentSortField]="sortField" [currentSortReverse]="sortReverse" (sort)="onSort($event)" i18n>Name</th>
+ <th scope="col" class="d-none d-sm-table-cell" appSortable="matching_algorithm" [currentSortField]="sortField" [currentSortReverse]="sortReverse" (sort)="onSort($event)" i18n>Matching</th>
+ <th scope="col" appSortable="document_count" [currentSortField]="sortField" [currentSortReverse]="sortReverse" (sort)="onSort($event)" i18n>Document count</th>
+ <th scope="col" *ngFor="let column of extraColumns" appSortable="{{column.key}}" [currentSortField]="sortField" [currentSortReverse]="sortReverse" (sort)="onSort($event)">{{column.name}}</th>
<th scope="col" i18n>Actions</th>
</tr>
</thead>
<div class="col">
<select class="form-select" formControlName="displayLanguage">
- <option *ngFor="let lang of displayLanguageOptions" [ngValue]="lang.code">{{lang.name}}<span *ngIf="lang.code && currentLocale != 'en-US'"> - {{lang.englishName}}</span></option>
+ <option *ngFor="let lang of displayLanguageOptions" [ngValue]="lang.code">{{lang.name}}<span *ngIf="lang.code && currentLocale !== 'en-US'"> - {{lang.englishName}}</span></option>
</select>
<small *ngIf="displayLanguageIsDirty" class="form-text text-primary" i18n>You need to reload the page after applying a new language.</small>
</div>
</div>
- <div *ngIf="savedViews && savedViews.length == 0" i18n>No saved views defined.</div>
+ <div *ngIf="savedViews && savedViews.length === 0" i18n>No saved views defined.</div>
<div *ngIf="!savedViews">
<div class="spinner-border spinner-border-sm fw-normal ms-2 me-auto" role="status"></div>
</div>
</li>
- <div *ngIf="mailAccounts.length == 0" i18n>No mail accounts defined.</div>
+ <div *ngIf="mailAccounts.length === 0" i18n>No mail accounts defined.</div>
</ul>
<h4 class="mt-4">
</div>
</li>
- <div *ngIf="mailRules.length == 0" i18n>No mail rules defined.</div>
+ <div *ngIf="mailRules.length === 0" i18n>No mail rules defined.</div>
</ul>
</ng-container>
<div [ngbNavOutlet]="nav" class="border-start border-end border-bottom p-3 mb-3 shadow-sm"></div>
- <button type="submit" class="btn btn-primary mb-2" [disabled]="!(isDirty$ | async)" i18n>Save</button>
+ <button type="submit" class="btn btn-primary mb-2" [disabled]="(isDirty$ | async) === false" i18n>Save</button>
</form>
<app-page-header title="File Tasks" i18n-title>
<div class="btn-toolbar col col-md-auto">
- <button class="btn btn-sm btn-outline-secondary me-2" (click)="clearSelection()" [hidden]="selectedTasks.size == 0">
+ <button class="btn btn-sm btn-outline-secondary me-2" (click)="clearSelection()" [hidden]="selectedTasks.size === 0">
<svg class="sidebaricon" fill="currentColor">
<use xlink:href="assets/bootstrap-icons.svg#x"/>
</svg> <ng-container i18n>Clear selection</ng-container>
</button>
- <button class="btn btn-sm btn-outline-primary me-4" (click)="dismissTasks()" [disabled]="tasksService.total == 0">
+ <button class="btn btn-sm btn-outline-primary me-4" (click)="dismissTasks()" [disabled]="tasksService.total === 0">
<svg class="sidebaricon" fill="currentColor">
<use xlink:href="assets/bootstrap-icons.svg#check2-all"/>
</svg> <ng-container i18n>{{dismissButtonText}}</ng-container>
<tr>
<th scope="col">
<div class="form-check">
- <input type="checkbox" class="form-check-input" id="all-tasks" [disabled]="currentTasks.length == 0" (click)="toggleAll($event); $event.stopPropagation();">
+ <input type="checkbox" class="form-check-input" id="all-tasks" [disabled]="currentTasks.length === 0" (click)="toggleAll($event); $event.stopPropagation();">
<label class="form-check-label" for="all-tasks"></label>
</div>
</th>
<th scope="col" i18n>Name</th>
<th scope="col" class="d-none d-lg-table-cell" i18n>Created</th>
- <th scope="col" class="d-none d-lg-table-cell" *ngIf="activeTab != 'started' && activeTab != 'queued'" i18n>Results</th>
+ <th scope="col" class="d-none d-lg-table-cell" *ngIf="activeTab !== 'started' && activeTab !== 'queued'" i18n>Results</th>
<th scope="col" class="d-table-cell d-lg-none" i18n>Info</th>
<th scope="col" i18n>Actions</th>
</tr>
</th>
<td class="overflow-auto">{{ task.task_file_name }}</td>
<td class="d-none d-lg-table-cell">{{ task.date_created | customDate:'short' }}</td>
- <td class="d-none d-lg-table-cell" *ngIf="activeTab != 'started' && activeTab != 'queued'">
+ <td class="d-none d-lg-table-cell" *ngIf="activeTab !== 'started' && activeTab !== 'queued'">
<div *ngIf="task.result?.length > 50" class="result" (click)="expandTask(task); $event.stopPropagation();"
[ngbPopover]="resultPopover" popoverClass="shadow small mobile" triggers="mouseenter:mouseleave" container="body">
<span class="small d-none d-md-inline-block font-monospace text-muted">{{ task.result | slice:0:50 }}…</span>
</td>
</tr>
<tr>
- <td class="p-0" [class.border-0]="expandedTask != task.id" colspan="5">
+ <td class="p-0" [class.border-0]="expandedTask !== task.id" colspan="5">
<pre #collapse="ngbCollapse" [ngbCollapse]="expandedTask !== task.id" class="small mb-0"><div class="small p-1 p-lg-3 ms-lg-3">{{ task.result }}</div></pre>
</td>
</tr>
-import { Component, OnInit } from '@angular/core'
+import { Component } from '@angular/core'
@Component({
selector: 'app-not-found',
templateUrl: './not-found.component.html',
styleUrls: ['./not-found.component.scss'],
})
-export class NotFoundComponent implements OnInit {
+export class NotFoundComponent {
constructor() {}
-
- ngOnInit(): void {}
}
-import { Directive, EventEmitter, Input, Output } from '@angular/core'
+import {
+ Directive,
+ EventEmitter,
+ HostBinding,
+ HostListener,
+ Input,
+ Output,
+} from '@angular/core'
export interface SortEvent {
column: string
}
@Directive({
- selector: 'th[sortable]',
- host: {
- '[class.asc]': 'currentSortField == sortable && !currentSortReverse',
- '[class.des]': 'currentSortField == sortable && currentSortReverse',
- '(click)': 'rotate()',
- },
+ selector: 'th[appSortable]',
})
export class SortableDirective {
constructor() {}
@Input()
- sortable: string = ''
+ appSortable: string = ''
@Input()
currentSortReverse: boolean = false
@Output() sort = new EventEmitter<SortEvent>()
- rotate() {
- if (this.currentSortField != this.sortable) {
- this.sort.emit({ column: this.sortable, reverse: false })
+ @HostBinding('class.asc') get asc() {
+ return (
+ this.currentSortField === this.appSortable && !this.currentSortReverse
+ )
+ }
+ @HostBinding('class.des') get des() {
+ return this.currentSortField === this.appSortable && this.currentSortReverse
+ }
+
+ @HostListener('click') rotate() {
+ if (this.currentSortField != this.appSortable) {
+ this.sort.emit({ column: this.appSortable, reverse: false })
} else if (
- this.currentSortField == this.sortable &&
+ this.currentSortField == this.appSortable &&
!this.currentSortReverse
) {
this.sort.emit({ column: this.currentSortField, reverse: true })