1
0
mirror of https://github.com/bitwarden/web synced 2026-01-21 11:53:22 +00:00
Files
web/app/vault/views/vault.html
2017-10-26 22:21:59 -04:00

317 lines
18 KiB
HTML

<section class="content-header">
<div class="btn-group pull-right">
<button type="button" class="btn btn-link dropdown-toggle" data-toggle="dropdown"
ng-disabled="bulkActionLoading">
<i class="fa fa-refresh fa-spin" ng-show="bulkActionLoading"></i>
Bulk Actions <span class="caret"></span>
</button>
<ul class="dropdown-menu">
<li>
<a href="#" stop-click ng-click="bulkMove()">
<i class="fa fa-fw fa-share"></i> Move Selected
</a>
</li>
<li>
<a href="#" stop-click ng-click="bulkDelete()">
<i class="fa fa-fw fa-trash"></i> Delete Selected
</a>
</li>
<li role="separator" class="divider"></li>
<li>
<a href="#" stop-click ng-click="unselectAll()">
<i class="fa fa-fw fa-minus-square-o"></i> Unselect All
</a>
</li>
</ul>
</div>
<h1>
My Vault
<small>
<span ng-pluralize
count="vaultFolders.length > 0 ? vaultFolders.length - 1 : 0"
when="{'1': '{} folder', 'other': '{} folders'}"></span>,
<span ng-pluralize count="ciphers.length" when="{'1': '{} item', 'other': '{} items'}"></span>
</small>
</h1>
</section>
<section class="content">
<div ng-show="loading && !vaultFolders.length">
<p>Loading...</p>
</div>
<div class="box box-primary" ng-class="{'collapsed-box': favoriteCollapsed}" style="margin-bottom: 40px;"
ng-show="vaultFolders.length && folderIdFilter === undefined && (!main.searchVaultText || favoriteCiphers.length)">
<div class="box-header with-border">
<h3 class="box-title">
<i class="fa fa-star"></i>
Favorites
<small ng-pluralize count="favoriteCiphers.length" when="{'1': '{} item', 'other': '{} items'}"></small>
</h3>
<div class="box-tools">
<div class="btn-group">
<button type="button" class="btn btn-box-tool dropdown-toggle" data-toggle="dropdown">
<i class="fa fa-cog"></i> <span class="caret"></span>
</button>
<ul class="dropdown-menu dropdown-menu-right">
<li>
<a href="#" stop-click ng-click="addCipher(null, true)">
<i class="fa fa-fw fa-plus-circle"></i> New Item
</a>
</li>
</ul>
</div>
<button type="button" class="btn btn-box-tool" data-widget="collapse" title="Collapse/Expand"
ng-click="collapseExpand(null, true)">
<i class="fa" ng-class="{'fa-minus': !favoriteCollapsed, 'fa-plus': favoriteCollapsed}"></i>
</button>
</div>
</div>
<div class="box-body" ng-class="{'no-padding': favoriteCiphers.length}">
<div ng-show="!favoriteCiphers.length">
<p>No favorite items.</p>
<button type="button" ng-click="addCipher(null, true)" class="btn btn-default btn-flat">Add an Item</button>
</div>
<div class="table-responsive" ng-show="favoriteCiphers.length">
<table class="table table-striped table-hover table-vmiddle">
<tbody>
<tr ng-repeat="cipher in favoriteCiphers = (ciphers | filter: { favorite: true } |
filter: cipherFilter | filter: (main.searchVaultText || '')) track by cipher.id">
<td style="width: 70px;">
<div class="btn-group" data-append-to="body">
<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
<i class="fa fa-cog"></i> <span class="caret"></span>
</button>
<ul class="dropdown-menu">
<li>
<a href="#" stop-click ng-click="editCipher(cipher)">
<i class="fa fa-fw fa-pencil"></i> Edit
</a>
</li>
<li>
<a href="#" stop-click ng-click="attachments(cipher)">
<i class="fa fa-fw fa-paperclip"></i> Attachments
</a>
</li>
<li ng-show="!cipher.organizationId">
<a href="#" stop-click ng-click="share(cipher)">
<i class="fa fa-fw fa-share-alt"></i> Share
</a>
</li>
<li ng-show="cipher.organizationId && cipher.edit">
<a href="#" stop-click ng-click="collections(cipher)">
<i class="fa fa-fw fa-cubes"></i> Collections
</a>
</li>
<li ng-show="cipher.meta.password">
<a href="#" stop-click ngclipboard ngclipboard-error="clipboardError(e)"
data-clipboard-text="{{cipher.meta.password}}">
<i class="fa fa-fw fa-clipboard"></i> Copy Password
</a>
</li>
<li ng-show="cipher.edit">
<a href="#" stop-click ng-click="deleteCipher(cipher)" class="text-red">
<i class="fa fa-fw fa-trash"></i> Delete
</a>
</li>
</ul>
</div>
</td>
<td class="action-select" ng-click="select($event)">
<input type="checkbox" value="{{::cipher.id}}" name="cipherSelection" stop-prop />
</td>
<td class="vault-icon" ng-click="select($event)">
<i class="fa fa-fw fa-lg {{::cipher.icon}}" ng-if="!cipher.meta.image"></i>
<img alt="" ng-if="cipher.meta.image" ng-src="{{cipher.meta.image}}"
fallback-src="images/fa-globe.png" />
</td>
<td ng-click="select($event)">
<a href="#" stop-click ng-click="editCipher(cipher)" stop-prop>{{cipher.name}}</a>
<i class="fa fa-share-alt text-muted" title="Shared" ng-if="cipher.organizationId"
stop-prop></i>
<i class="fa fa-paperclip text-muted" title="Attachments" ng-if="cipher.hasAttachments"
stop-prop></i><br />
<span class="text-sm text-muted" stop-prop>{{cipher.subTitle}}</span>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div class="box" ng-class="{'collapsed-box': folder.collapsed}"
ng-repeat="folder in filteredVaultFolders = (vaultFolders | filter: folderFilter) track by folder.id"
ng-show="vaultFolders.length && (!main.searchVaultText || folderCiphers.length)">
<div class="box-header with-border">
<h3 class="box-title">
<i class="fa" ng-class="{'fa-folder-open': folder.id !== null, 'fa-folder-open-o': folder.id === null}"></i>
{{folder.name}}
<small ng-pluralize count="folderCiphers.length" when="{'1': '{} item', 'other': '{} items'}"></small>
</h3>
<div class="box-tools">
<div class="btn-group">
<button type="button" class="btn btn-box-tool dropdown-toggle" data-toggle="dropdown">
<i class="fa fa-cog"></i> <span class="caret"></span>
</button>
<ul class="dropdown-menu dropdown-menu-right">
<li>
<a href="#" stop-click ng-click="addCipher(folder)">
<i class="fa fa-fw fa-plus-circle"></i> New Item
</a>
</li>
<li ng-show="folder.id">
<a href="#" stop-click ng-click="editFolder(folder)">
<i class="fa fa-fw fa-pencil"></i> Edit Folder
</a>
</li>
<li>
<a href="#" stop-click ng-click="selectFolder(folder, $event)">
<i class="fa fa-fw fa-check-square-o"></i> Select All
</a>
</li>
<li ng-show="canDeleteFolder(folder)">
<a href="#" stop-click ng-click="deleteFolder(folder)" class="text-red">
<i class="fa fa-fw fa-trash"></i> Delete Folder
</a>
</li>
</ul>
</div>
<button type="button" class="btn btn-box-tool" data-widget="collapse" title="Collapse/Expand"
ng-click="collapseExpand(folder)">
<i class="fa" ng-class="{'fa-minus': !folder.collapsed, 'fa-plus': folder.collapsed}"></i>
</button>
</div>
</div>
<div class="box-body" ng-class="{'no-padding': folderCiphers.length}">
<div ng-show="!folderCiphers.length">
<p>No items in this folder.</p>
<button type="button" ng-click="addCipher(folder)" class="btn btn-default btn-flat">Add an Item</button>
</div>
<div class="table-responsive" ng-show="folderCiphers.length">
<table class="table table-striped table-hover table-vmiddle">
<tbody>
<tr ng-repeat="cipher in folderCiphers = (ciphers | filter: { folderId: folder.id } |
filter: cipherFilter | filter: (main.searchVaultText || '')) track by cipher.id">
<td style="width: 70px;">
<div class="btn-group" data-append-to="body">
<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
<i class="fa fa-cog"></i> <span class="caret"></span>
</button>
<ul class="dropdown-menu">
<li>
<a href="#" stop-click ng-click="editCipher(cipher)">
<i class="fa fa-fw fa-pencil"></i> Edit
</a>
</li>
<li>
<a href="#" stop-click ng-click="attachments(cipher)">
<i class="fa fa-fw fa-paperclip"></i> Attachments
</a>
</li>
<li ng-show="!cipher.organizationId">
<a href="#" stop-click ng-click="share(cipher)">
<i class="fa fa-fw fa-share-alt"></i> Share
</a>
</li>
<li ng-show="cipher.organizationId && cipher.edit">
<a href="#" stop-click ng-click="collections(cipher)">
<i class="fa fa-fw fa-cubes"></i> Collections
</a>
</li>
<li ng-show="cipher.meta.password">
<a href="#" stop-click ngclipboard ngclipboard-error="clipboardError(e)"
data-clipboard-text="{{cipher.meta.password}}">
<i class="fa fa-fw fa-clipboard"></i> Copy Password
</a>
</li>
<li ng-show="cipher.edit">
<a href="#" stop-click ng-click="deleteCipher(cipher)" class="text-red">
<i class="fa fa-fw fa-trash"></i> Delete
</a>
</li>
</ul>
</div>
</td>
<td class="action-select" ng-click="select($event)">
<input type="checkbox" value="{{::cipher.id}}" name="cipherSelection" stop-prop />
</td>
<td class="vault-icon" ng-click="select($event)">
<i class="fa fa-fw fa-lg {{::cipher.icon}}" ng-if="!cipher.meta.image"></i>
<img alt="" ng-if="cipher.meta.image" ng-src="{{cipher.meta.image}}"
fallback-src="images/fa-globe.png" />
</td>
<td ng-click="select($event)">
<a href="#" stop-click ng-click="editCipher(cipher)" stop-prop>{{cipher.name}}</a>
<i class="fa fa-star text-muted" title="Favorite" ng-show="cipher.favorite" stop-prop></i>
<i class="fa fa-share-alt text-muted" title="Shared" ng-show="cipher.organizationId"
stop-prop></i>
<i class="fa fa-paperclip text-muted" title="Attachments" ng-if="cipher.hasAttachments"
stop-prop></i>
<br />
<span class="text-sm text-muted" stop-prop>{{cipher.subTitle}}</span>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</section>
<aside class="control-sidebar control-sidebar-light">
<div class="tab-content">
<ul class="control-sidebar-menu">
<li>
<a href="#" stop-click ng-click="clearFilters()">
Clear All Filters
</a>
</li>
</ul>
<h3 class="control-sidebar-heading">
<i class="fa fa-tag fa-fw"></i> Types
</h3>
<div class="control-sidebar-section">
<ul class="control-sidebar-menu">
<li>
<a href="#" stop-click ng-click="filterType(constants.cipherType.login)">
<i class="fa fa-check fa-fw" ng-if="constants.cipherType.login === typeFilter"></i>
<i class="fa fa-globe fa-fw" ng-if="constants.cipherType.login !== typeFilter"></i> Login
</a>
</li>
<li>
<a href="#" stop-click ng-click="filterType(constants.cipherType.card)">
<i class="fa fa-check fa-fw" ng-if="constants.cipherType.card === typeFilter"></i>
<i class="fa fa-credit-card fa-fw" ng-if="constants.cipherType.card !== typeFilter"></i> Card
</a>
</li>
<li>
<a href="#" stop-click ng-click="filterType(constants.cipherType.identity)">
<i class="fa fa-check fa-fw" ng-if="constants.cipherType.identity === typeFilter"></i>
<i class="fa fa-id-card-o fa-fw" ng-if="constants.cipherType.identity !== typeFilter"></i> Identity
</a>
</li>
<li>
<a href="#" stop-click ng-click="filterType(constants.cipherType.secureNote)">
<i class="fa fa-check fa-fw" ng-if="constants.cipherType.secureNote === typeFilter"></i>
<i class="fa fa-sticky-note-o fa-fw" ng-if="constants.cipherType.secureNote !== typeFilter"></i> Secure Note
</a>
</li>
</ul>
</div>
<h3 class="control-sidebar-heading">
<i class="fa fa-folder fa-fw"></i> Folders
</h3>
<div ng-show="loading && !vaultFolders.length">
<p>Loading...</p>
</div>
<div class="control-sidebar-section">
<ul class="control-sidebar-menu" ng-show="!loading && vaultFolders.length">
<li ng-repeat="folder in vaultFolders track by folder.id">
<a href="#" stop-click ng-click="filterFolder(folder)">
<i class="fa fa-check fa-fw" ng-if="folder.id === folderIdFilter"></i>
<i class="fa fa-caret-right fa-fw" ng-if="folder.id !== folderIdFilter"></i>
{{folder.name}}
</a>
</li>
</ul>
</div>
</div>
</aside>