jjkiers/cloudron-box
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

dashboard: add initial version of app list view

Browse Source
This commit is contained in:
Johannes Zellner
2024-04-06 12:30:44 +02:00
parent 9e05a4eab7
commit d6f162a8ca
3 changed files with 69 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
dashboard/src/views/apps.html
View File

@@ -140,6 +140,7 @@
<button class="btn btn-default" type="button" ng-class="{ 'active': showFilter, 'btn-warning': showFilter || selectedTags.length || selectedState.state || !selectedGroup._unset || !selectedDomain._alldomains }" ng-click="showFilter = !showFilter"><i class="fas fa-filter"></i></button>
</span>
</div>
<button class="btn btn-default" type="button" ng-click="view = view === 'grid' ? 'list' : 'grid'"><i class="fas" ng-class="{ 'fa-list': view === 'grid', 'fa-grip': view === 'list' }"></i></button>
</form>
</div>
<div ng-show="showFilter" class="view-header-filter-bar">
@@ -154,7 +155,7 @@
</h1>
<div class="animateMeOpacity ng-hide" ng-show="installedApps.length > 0">
<div class="app-grid">
<div class="app-grid" ng-show="view === 'grid'">
<div class="grid-item" ng-class="{ 'stopped': app.runState === 'stopped' }" ng-repeat="app in installedApps | selectedGroupAccessFilter:selectedGroup | selectedStateFilter:selectedState | selectedTagFilter:selectedTags | selectedDomainFilter:selectedDomain | appSearchFilter:appSearch | orderBy:labelOrFQDN">
<div class="grid-item-content" uib-tooltip="{{ app.fqdn }}">
<a ng-show="app.type !== APP_TYPES.LINK && isOperator(app)" ng-href="#/app/{{ app.id}}/display" class="btn btn-lg btn-default grid-item-action"><i class="fas fa-cog"></i></a>
@@ -198,5 +199,51 @@
</div>
</div>
</div>
<div class="app-list card card-large" ng-show="view === 'list'">
<table class="table table-hover" style="margin: 0;">
<thead>
<tr>
<th style="width: 32px">&nbsp;</th>
<th style="width: 95%">Location</th>
<th style="width: 95%">App</th>
<th style="width: 32px">&nbsp;</th>
<th style="width: 95%">Status</th>
<th style="width: 5%" class="text-right">{{ 'main.actions' | tr }}</th>
</tr>
</thead>
<tbody>
<tr class="app-list-item" ng-repeat="app in installedApps | selectedGroupAccessFilter:selectedGroup | selectedStateFilter:selectedState | selectedTagFilter:selectedTags | selectedDomainFilter:selectedDomain | appSearchFilter:appSearch | orderBy:labelOrFQDN">
<td class="elide-table-cell" style="text-overflow: ellipsis; white-space: nowrap;">
<a ng-href="{{ app | applicationLink }}" ng-click="onAppClick(app, $event)" target="_blank" style="display: block;">
<img ng-src="{{ app.iconUrl || 'img/appicon_fallback.png' }}" fallback-icon="img/appicon_fallback.png" onerror="imageErrorHandler(this)" class="app-list-item-icon"/>
</a>
</td>
<td class="elide-table-cell" style="text-overflow: ellipsis; white-space: nowrap; vertical-align: middle;">
<a ng-href="{{ app | applicationLink }}" ng-click="onAppClick(app, $event)" target="_blank" class="app-list-app-link">
{{ app.label || app.subdomain || app.fqdn }}
</a>
</td>
<td class="elide-table-cell" style="text-overflow: ellipsis; white-space: nowrap; vertical-align: middle;">{{ app.manifest.title }}</td>
<td style="vertical-align: middle;">
<div ng-show="app.type !== APP_TYPES.LINK">
<i class="fa-brands fa-openid" ng-show="app.ssoAuth && app.manifest.addons.oidc" uib-tooltip="{{ 'apps.auth.openid' | tr }}"></i>
<i class="fas fa-user" ng-show="app.ssoAuth && (!app.manifest.addons.oidc && !app.manifest.addons.email)" uib-tooltip="{{ 'apps.auth.sso' | tr }}"></i>
<i class="far fa-user" ng-show="!app.ssoAuth && !app.manifest.addons.email" uib-tooltip="{{ 'apps.auth.nosso' | tr }}"></i>
<i class="fas fa-envelope" ng-show="app.manifest.addons.email" uib-tooltip="{{ 'apps.auth.email' | tr }}"></i>
</div>
</td>
<td style="vertical-align: middle;">{{ app | installationStateLabel }}</td>
<td class="text-right no-wrap" style="vertical-align: middle;">
<button class="btn btn-xs btn-default" ng-show="app.type === APP_TYPES.LINK && isOperator(app)" ng-click="applinksEdit.show(app)" uib-tooltip="Configure Applink"><i class="fa fa-cog"></i></button>
<button class="btn btn-xs btn-danger" ng-show="app.type === APP_TYPES.LINK && isOperator(app)" ng-click="applinksEdit.show(app)" uib-tooltip="Remove Applink"><i class="far fa-trash-alt"></i></button>
<a class="btn btn-xs btn-default" ng-show="app.type !== APP_TYPES.LINK && isOperator(app)" ng-href="#/app/{{ app.id}}/display" uib-tooltip="Configure App"><i class="fa fa-cog"></i></a>
<a class="btn btn-xs btn-danger" ng-show="app.type !== APP_TYPES.LINK && isOperator(app)" ng-href="#/app/{{ app.id}}/uninstall" uib-tooltip="Uninstall App"><i class="far fa-trash-alt"></i></a>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>