1
0
mirror of https://github.com/bitwarden/browser.git synced 2024-09-15 02:18:42 +02:00

display nested folders

This commit is contained in:
Kyle Spearrin 2018-10-25 09:38:52 -04:00
parent 8da1bb13ff
commit 1390d7eb1d
4 changed files with 28 additions and 12 deletions

2
jslib

@ -1 +1 @@
Subproject commit 4165a78277048d7b37319e63bd7e6473cbba5156
Subproject commit 6aba4550a4b1e643528392d6305df00977046232

View File

@ -3,8 +3,8 @@
{{'filters' | i18n}}
</div>
<div class="card-body">
<input type="search" placeholder="{{searchPlaceholder || ('searchVault' | i18n)}}" id="search" class="form-control" [(ngModel)]="searchText"
(input)="searchTextChanged()" appAutofocus>
<input type="search" placeholder="{{searchPlaceholder || ('searchVault' | i18n)}}" id="search" class="form-control"
[(ngModel)]="searchText" (input)="searchTextChanged()" appAutofocus>
<ul class="fa-ul card-ul">
<li [ngClass]="{active: selectedAll}">
<a href="#" appStopClick (click)="selectAll()">
@ -52,13 +52,22 @@
</a>
</h3>
<ul class="fa-ul card-ul carets">
<li *ngFor="let f of folders" class="d-flex" [ngClass]="{active: selectedFolder && f.id === selectedFolderId}">
<a href="#" appStopClick (click)="selectFolder(f)">
<i class="fa-li fa fa-caret-right"></i> {{f.name}}</a>
<a href="#" class="text-muted ml-auto show-active" appStopClick (click)="editFolder(f)" title="{{'editFolder' | i18n}}" *ngIf="f.id">
<i class="fa fa-pencil fa-fw"></i>
</a>
</li>
<ng-template #recursiveList let-folders>
<li *ngFor="let f of folders" [ngClass]="{active: selectedFolder && f.node.id === selectedFolderId}">
<div class="d-flex">
<a href="#" appStopClick (click)="selectFolder(f.node)">
<i class="fa-li fa fa-caret-right"></i> {{f.node.name}}</a>
<a href="#" class="text-muted ml-auto show-active" appStopClick (click)="editFolder(f.node)"
title="{{'editFolder' | i18n}}" *ngIf="f.node.id">
<i class="fa fa-pencil fa-fw"></i>
</a>
</div>
<ul class="fa-ul card-ul carets" *ngIf="f.children.length">
<ng-container *ngTemplateOutlet="recursiveList; context:{ $implicit: f.children }"></ng-container>
</ul>
</li>
</ng-template>
<ng-container *ngTemplateOutlet="recursiveList; context:{ $implicit: nestedFolders }"></ng-container>
</ul>
</ng-container>
<ng-container *ngIf="showCollections && collections && collections.length">

View File

@ -21,6 +21,7 @@ export class GroupingsComponent extends BaseGroupingsComponent {
constructor(collectionService: CollectionService, folderService: FolderService) {
super(collectionService, folderService);
this.loadNestedFolder = true;
}
searchTextChanged() {

View File

@ -207,6 +207,12 @@ input, select, textarea {
left: -24px;
}
}
ul {
&.carets {
margin-left: 0.85em;
}
}
}
.modal-dialog {
@ -419,13 +425,13 @@ app-vault-groupings, app-org-vault-groupings {
}
li.active {
.show-active {
> .show-active, > div .show-active {
display: inline;
}
}
li.active {
a:first-child {
> a:first-child, > div a:first-child {
font-weight: bold;
color: theme-color("primary");
}