lgcosta/paperless-ngx
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

menu closing on mobile

Browse Source
This commit is contained in:
Jonas Winkler 2020-11-22 17:48:54 +01:00
parent 8e7a3d309f
commit 6c0e0755b9
2 changed files with 15 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src-ui/src/app/components/app-frame/app-frame.component.html
View File

@ -17,7 +17,7 @@
<div class="sidebar-sticky pt-3"> <div class="sidebar-sticky pt-3">
<ul class="nav flex-column"> <ul class="nav flex-column">
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" routerLink="dashboard" routerLinkActive="active"> <a class="nav-link" routerLink="dashboard" routerLinkActive="active" (click)="closeMenu()">
<svg class="sidebaricon" fill="currentColor"> <svg class="sidebaricon" fill="currentColor">
<use xlink:href="assets/bootstrap-icons.svg#house"/> <use xlink:href="assets/bootstrap-icons.svg#house"/>
</svg> </svg>
@ -25,7 +25,7 @@
</a> </a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" routerLink="documents" routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}"> <a class="nav-link" routerLink="documents" routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}" (click)="closeMenu()">
<svg class="sidebaricon" fill="currentColor"> <svg class="sidebaricon" fill="currentColor">
<use xlink:href="assets/bootstrap-icons.svg#files"/> <use xlink:href="assets/bootstrap-icons.svg#files"/>
</svg> </svg>
@ -39,7 +39,7 @@
</h6> </h6>
<ul class="nav flex-column mb-2"> <ul class="nav flex-column mb-2">
<li class="nav-item w-100" *ngFor='let config of viewConfigService.getSideBarConfigs()'> <li class="nav-item w-100" *ngFor='let config of viewConfigService.getSideBarConfigs()'>
<a class="nav-link text-truncate" routerLink="view/{{config.id}}" routerLinkActive="active"> <a class="nav-link text-truncate" routerLink="view/{{config.id}}" routerLinkActive="active" (click)="closeMenu()">
<svg class="sidebaricon" fill="currentColor"> <svg class="sidebaricon" fill="currentColor">
<use xlink:href="assets/bootstrap-icons.svg#funnel"/> <use xlink:href="assets/bootstrap-icons.svg#funnel"/>
</svg> </svg>
@ -53,7 +53,7 @@
</h6> </h6>
<ul class="nav flex-column mb-2"> <ul class="nav flex-column mb-2">
<li class="nav-item w-100" *ngFor='let d of openDocuments'> <li class="nav-item w-100" *ngFor='let d of openDocuments'>
<a class="nav-link text-truncate" routerLink="documents/{{d.id}}" routerLinkActive="active"> <a class="nav-link text-truncate" routerLink="documents/{{d.id}}" routerLinkActive="active" (click)="closeMenu()">
<svg class="sidebaricon" fill="currentColor"> <svg class="sidebaricon" fill="currentColor">
<use xlink:href="assets/bootstrap-icons.svg#file-text"/> <use xlink:href="assets/bootstrap-icons.svg#file-text"/>
</svg> </svg>
@ -75,7 +75,7 @@
</h6> </h6>
<ul class="nav flex-column mb-2"> <ul class="nav flex-column mb-2">
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" routerLink="correspondents" routerLinkActive="active"> <a class="nav-link" routerLink="correspondents" routerLinkActive="active" (click)="closeMenu()">
<svg class="sidebaricon" fill="currentColor"> <svg class="sidebaricon" fill="currentColor">
<use xlink:href="assets/bootstrap-icons.svg#person"/> <use xlink:href="assets/bootstrap-icons.svg#person"/>
</svg> </svg>
@ -83,7 +83,7 @@
</a> </a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" routerLink="tags" routerLinkActive="active"> <a class="nav-link" routerLink="tags" routerLinkActive="active" (click)="closeMenu()">
<svg class="sidebaricon" fill="currentColor"> <svg class="sidebaricon" fill="currentColor">
<use xlink:href="assets/bootstrap-icons.svg#tags"/> <use xlink:href="assets/bootstrap-icons.svg#tags"/>
</svg> </svg>
@ -91,7 +91,7 @@
</a> </a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" routerLink="documenttypes" routerLinkActive="active"> <a class="nav-link" routerLink="documenttypes" routerLinkActive="active" (click)="closeMenu()">
<svg class="sidebaricon" fill="currentColor"> <svg class="sidebaricon" fill="currentColor">
<use xlink:href="assets/bootstrap-icons.svg#hash"/> <use xlink:href="assets/bootstrap-icons.svg#hash"/>
</svg> </svg>
@ -99,7 +99,7 @@
</a> </a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" routerLink="logs" routerLinkActive="active"> <a class="nav-link" routerLink="logs" routerLinkActive="active" (click)="closeMenu()">
<svg class="sidebaricon" fill="currentColor"> <svg class="sidebaricon" fill="currentColor">
<use xlink:href="assets/bootstrap-icons.svg#text-left"/> <use xlink:href="assets/bootstrap-icons.svg#text-left"/>
</svg> </svg>
@ -107,7 +107,7 @@
</a> </a>
</li> </li>
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" routerLink="settings" routerLinkActive="active"> <a class="nav-link" routerLink="settings" routerLinkActive="active" (click)="closeMenu()">
<svg class="sidebaricon" fill="currentColor"> <svg class="sidebaricon" fill="currentColor">
<use xlink:href="assets/bootstrap-icons.svg#gear"/> <use xlink:href="assets/bootstrap-icons.svg#gear"/>
</svg> </svg>

6
src-ui/src/app/components/app-frame/app-frame.component.ts
View File

@ -27,6 +27,10 @@ export class AppFrameComponent implements OnInit, OnDestroy {
isMenuCollapsed: boolean = true isMenuCollapsed: boolean = true
closeMenu() {
this.isMenuCollapsed = true
}
searchField = new FormControl('') searchField = new FormControl('')
openDocuments: PaperlessDocument[] = [] openDocuments: PaperlessDocument[] = []
@ -63,10 +67,12 @@ export class AppFrameComponent implements OnInit, OnDestroy {
} }
search() { search() {
this.closeMenu()
this.router.navigate(['search'], {queryParams: {query: this.searchField.value}}) this.router.navigate(['search'], {queryParams: {query: this.searchField.value}})
} }
closeAll() { closeAll() {
this.closeMenu()
this.openDocumentsService.closeAll() this.openDocumentsService.closeAll()
// TODO: is there a better way to do this? // TODO: is there a better way to do this?