paradizelost/paperless-ngx
1
0
Fork 0
mirror of https://github.com/paperless-ngx/paperless-ngx.git synced 2025-04-02 13:45:10 -05:00
Code Issues Packages Projects Releases Wiki Activity

dynamic loading of settings tab contents

Browse Source
This commit is contained in:
Michael Shamoon 2022-11-12 14:46:57 -08:00
parent 40c8629aef
commit 24444237f2
2 changed files with 51 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src-ui/src/app/components/manage/settings/settings.component.html
View File

@ -10,8 +10,8 @@
<form [formGroup]="settingsForm" (ngSubmit)="saveSettings()"> <form [formGroup]="settingsForm" (ngSubmit)="saveSettings()">
<ul ngbNav #nav="ngbNav" class="nav-tabs"> <ul ngbNav #nav="ngbNav" (navChange)="maybeInitializeTab($event)" [(activeId)]="activeNavID" class="nav-tabs">
<li [ngbNavItem]="1"> <li [ngbNavItem]="SettingsNavIDs.General">
<a ngbNavLink i18n>General</a> <a ngbNavLink i18n>General</a>
<ng-template ngbNavContent> <ng-template ngbNavContent>
@ -167,7 +167,7 @@
</ng-template> </ng-template>
</li> </li>
<li [ngbNavItem]="2"> <li [ngbNavItem]="SettingsNavIDs.Notifications">
<a ngbNavLink i18n>Notifications</a> <a ngbNavLink i18n>Notifications</a>
<ng-template ngbNavContent> <ng-template ngbNavContent>
@ -185,7 +185,7 @@
</ng-template> </ng-template>
</li> </li>
<li [ngbNavItem]="3"> <li [ngbNavItem]="SettingsNavIDs.SavedViews" (mouseover)="maybeInitializeTab(SettingsNavIDs.SavedViews)" (focusin)="maybeInitializeTab(SettingsNavIDs.SavedViews)">
<a ngbNavLink i18n>Saved views</a> <a ngbNavLink i18n>Saved views</a>
<ng-template ngbNavContent> <ng-template ngbNavContent>
@ -215,7 +215,12 @@
</div> </div>
</div> </div>
<div *ngIf="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 class="visually-hidden" i18n>Loading...</div>
</div>
</div> </div>

67
src-ui/src/app/components/manage/settings/settings.component.ts
View File

@ -37,6 +37,15 @@ import { NgbModal } from '@ng-bootstrap/ng-bootstrap'
import { MailAccountEditDialogComponent } from '../../common/edit-dialog/mail-account-edit-dialog/mail-account-edit-dialog.component' import { MailAccountEditDialogComponent } from '../../common/edit-dialog/mail-account-edit-dialog/mail-account-edit-dialog.component'
import { MailRuleEditDialogComponent } from '../../common/edit-dialog/mail-rule-edit-dialog/mail-rule-edit-dialog.component' import { MailRuleEditDialogComponent } from '../../common/edit-dialog/mail-rule-edit-dialog/mail-rule-edit-dialog.component'
import { ConfirmDialogComponent } from '../../common/confirm-dialog/confirm-dialog.component' import { ConfirmDialogComponent } from '../../common/confirm-dialog/confirm-dialog.component'
import { NgbNavChangeEvent } from '@ng-bootstrap/ng-bootstrap'
enum SettingsNavIDs {
General = 1,
Notifications = 2,
SavedViews = 3,
Mail = 4,
UsersGroups = 5,
}
@Component({ @Component({
selector: 'app-settings', selector: 'app-settings',
@ -46,6 +55,9 @@ import { ConfirmDialogComponent } from '../../common/confirm-dialog/confirm-dial
export class SettingsComponent export class SettingsComponent
implements OnInit, AfterViewInit, OnDestroy, DirtyComponent implements OnInit, AfterViewInit, OnDestroy, DirtyComponent
{ {
SettingsNavIDs = SettingsNavIDs
activeNavID: number
savedViewGroup = new FormGroup({}) savedViewGroup = new FormGroup({})
mailAccountGroup = new FormGroup({}) mailAccountGroup = new FormGroup({})
@ -171,19 +183,20 @@ export class SettingsComponent
} }
ngOnInit() { ngOnInit() {
this.savedViewService.listAll().subscribe((r) => { this.initialize()
this.savedViews = r.results }
this.mailAccountService.listAll().subscribe((r) => { // Load tab contents 'on demand', either on mouseover or focusin (i.e. before click) or on nav change event
this.mailAccounts = r.results maybeInitializeTab(navIDorEvent: number | NgbNavChangeEvent): void {
const navID =
this.mailRuleService.listAll().subscribe((r) => { typeof navIDorEvent == 'number' ? navIDorEvent : navIDorEvent.nextId
this.mailRules = r.results // initialize saved views
if (navID == SettingsNavIDs.SavedViews && !this.savedViews) {
this.initialize() this.savedViewService.listAll().subscribe((r) => {
}) this.savedViews = r.results
this.initialize()
}) })
}) }
} }
initialize() { initialize() {
@ -191,22 +204,24 @@ export class SettingsComponent
let storeData = this.getCurrentSettings() let storeData = this.getCurrentSettings()
for (let view of this.savedViews) { if (this.savedViews) {
storeData.savedViews[view.id.toString()] = { for (let view of this.savedViews) {
id: view.id, storeData.savedViews[view.id.toString()] = {
name: view.name, id: view.id,
show_on_dashboard: view.show_on_dashboard, name: view.name,
show_in_sidebar: view.show_in_sidebar, show_on_dashboard: view.show_on_dashboard,
show_in_sidebar: view.show_in_sidebar,
}
this.savedViewGroup.addControl(
view.id.toString(),
new FormGroup({
id: new FormControl(null),
name: new FormControl(null),
show_on_dashboard: new FormControl(null),
show_in_sidebar: new FormControl(null),
})
)
} }
this.savedViewGroup.addControl(
view.id.toString(),
new FormGroup({
id: new FormControl(null),
name: new FormControl(null),
show_on_dashboard: new FormControl(null),
show_in_sidebar: new FormControl(null),
})
)
} }
for (let account of this.mailAccounts) { for (let account of this.mailAccounts) {