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

Add app link in app configure header

Browse Source
This commit is contained in:
Johannes Zellner
2025-02-22 16:29:28 +01:00
parent d9bf09bb9b
commit 3e2177b402
3 changed files with 22 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
dashboard/src/views/AppConfigureView.vue
View File

@@ -6,7 +6,7 @@ import { useI18n } from 'vue-i18n';
const i18n = useI18n();
const t = i18n.t;
import { ref, onMounted, onBeforeUnmount, useTemplateRef, computed } from 'vue';
import { ref, onMounted, onBeforeUnmount, computed } from 'vue';
import { Button, ButtonGroup } from 'pankow';
import Info from '../components/app/Info.vue';
import Security from '../components/app/Security.vue';
@@ -15,7 +15,7 @@ import Eventlog from '../components/app/Eventlog.vue';
import Updates from '../components/app/Updates.vue';
import Uninstall from '../components/app/Uninstall.vue';
import AppsModel from '../models/AppsModel.js';
import { APP_TYPES } from '../constants.js';
import { APP_TYPES, ISTATES, RSTATES, HSTATES } from '../constants.js';
const appsModel = AppsModel.create();
@@ -52,8 +52,7 @@ async function refresh() {
app.value = result;
// app links have http already in the fqdn
link.value = result.fqdn.indexOf('http') !== 0 ? 'https://' + result.fqdn : result.fqdn;
link.value = (result.installationState !== ISTATES.INSTALLED || result.health !== HSTATES.HEALTHY || result.runState === RSTATES.STOPPED) ? '' : result.fqdn;
hasLocalStorage.value = result.manifest && result.manifest.addons && result.manifest.addons.localstorage;
// TODO info menu will likely not change during polling
@@ -129,13 +128,13 @@ onBeforeUnmount(() => {
<div class="configure-outer">
<div class="configure-inner">
<div class="titlebar">
<div style="display: flex;">
<a class="applink" :href="link || null" target="_blank">
<img :src="API_ORIGIN + app.iconUrl" v-fallback-image="API_ORIGIN + '/img/appicon_fallback.png'" style="width: 64px; margin-right: 10px;"/>
<h2>{{ app.label || app.fqdn }}</h2>
</div>
</a>
<div style="display: flex; gap: 10px; align-items: center;">
<Button outline tool
<Button secondary tool
@click="onToggleRunState()"
:disabled="app.taskId || app.error || app.installationState === 'pending_start' || app.installationState === 'pending_stop'"
v-tooltip="$t(isAppStopped ? 'app.uninstall.startStop.startAction' : 'app.uninstall.startStop.stopAction')"
@@ -143,12 +142,12 @@ onBeforeUnmount(() => {
:icon="isAppStopped ? 'fa-solid fa-play' : 'fa-solid fa-power-off'"
/>
<ButtonGroup>
<Button outline tool :href="`/logs.html?appId=${app.id}`" target="_blank" v-tooltip="$t('app.logsActionTooltip')" icon="fa-solid fa-align-left" />
<Button outline tool v-if="app.type !== APP_TYPES.PROXIED" :href="`/terminal.html?id=${app.id}`" target="_blank" v-tooltip="$t('app.terminalActionTooltip')" icon="fa fa-terminal" />
<Button outline tool v-if="hasLocalStorage" :href="`/filemanager.html#/home/app/${app.id}`" target="_blank" v-tooltip="$t('app.filemanagerActionTooltip')" icon="fas fa-folder" />
<Button secondary tool :href="`/logs.html?appId=${app.id}`" target="_blank" v-tooltip="$t('app.logsActionTooltip')" icon="fa-solid fa-align-left" />
<Button secondary tool v-if="app.type !== APP_TYPES.PROXIED" :href="`/terminal.html?id=${app.id}`" target="_blank" v-tooltip="$t('app.terminalActionTooltip')" icon="fa fa-terminal" />
<Button secondary tool v-if="hasLocalStorage" :href="`/filemanager.html#/home/app/${app.id}`" target="_blank" v-tooltip="$t('app.filemanagerActionTooltip')" icon="fas fa-folder" />
</ButtonGroup>
<Button outline tool icon="fa-solid fa-book" v-tooltip="$t('app.docsActionTooltip')" :menu="infoMenu" />
<Button secondary tool icon="fa-solid fa-book" v-tooltip="$t('app.docsActionTooltip')" :menu="infoMenu" />
</div>
</div>
@@ -198,6 +197,15 @@ onBeforeUnmount(() => {
<style scoped>
.applink {
display: flex;
color: var(--pankow-text-color);
}
.applink:not([href]) {
cursor: not-allowed;
}
.configure-outer {
width: 100%;
margin: auto;
@@ -207,6 +215,7 @@ onBeforeUnmount(() => {
width: 100%;
max-width: 1200px;
margin: auto;
padding-right: 15px;
}
.titlebar {
@@ -223,7 +232,7 @@ onBeforeUnmount(() => {
.configure-menu-item {
white-space: nowrap;
cursor: pointer;
padding: 4px 60px 4px 0;
padding: 4px 60px 4px 4px;
}
.configure-menu-item[active] {