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

Move status indicator code into a shared component

Browse Source
This commit is contained in:
Johannes Zellner
2025-03-24 16:58:29 +01:00
parent b9d9797734
commit 3a323551eb
7 changed files with 67 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
dashboard/src/views/ServicesView.vue
View File

@@ -9,6 +9,7 @@ import { Button, TableView, ProgressBar, ButtonGroup, FormGroup, Checkbox, Dialo
import { prettyBinarySize } from 'pankow/utils';
import { each } from 'async';
import Section from '../components/Section.vue';
import StateLED from '../components/StateLED.vue';
import ServicesModel from '../models/ServicesModel.js';
import SystemModel from '../models/SystemModel.js';
import AppsModel from '../models/AppsModel.js';
@@ -122,7 +123,7 @@ function onResetToDefaults() {
editMemoryLimit.value = editService.value.defaultMemoryLimit;
}
async function onEditConfirm() {
async function onEditSubmit() {
editBusy.value = true;
const [error] = await servicesModel.update(editService.value.id, parseInt(editMemoryLimit.value), editRecoveryMode.value);
@@ -133,11 +134,27 @@ async function onEditConfirm() {
return;
}
setTimeout(() => refresh(editService.value.id), 2000);
await refresh(editService.value.id);
editBusy.value = false;
dialog.value.close();
}
function state(service) {
if (service.status === 'active') return 'success';
else if (service.status === 'starting' && service.config.recoveryMode) return '';
else if (service.status === 'starting') return 'warning';
else return 'danger';
}
function stateTooltip(service) {
if (!service.status) return '';
if (service.status === 'active') return 'Active';
else if (service.status === 'starting' && service.config.recoveryMode) return 'Recovery mode';
else if (service.status === 'starting') return 'Starting';
else return service.status;
}
onMounted(async () => {
await refreshAll();
@@ -156,7 +173,7 @@ onMounted(async () => {
:confirm-label="$t('main.dialog.save')"
:reject-label="$t('main.dialog.cancel')"
reject-style="secondary"
@confirm="onEditConfirm()"
@confirm="onEditSubmit()"
>
<p class="has-error text-center" v-show="editError">{{ editError }}</p>
@@ -183,19 +200,7 @@ onMounted(async () => {
<TableView :columns="columns" :model="servicesArray">
<template #status="service">
<span v-show="service.status">
<span v-if="service.status === 'active'">
<i class="fa fa-circle status-active" v-tooltip="'active'"></i>
</span>
<span v-else-if="service.status === 'starting'">
<i class="fa fa-circle status-starting" v-tooltip="'starting'" v-show="!service.config.recoveryMode"></i>
<i class="fa fa-circle status-inactive" v-tooltip="'recovery mode'" v-show="service.config.recoveryMode"></i>
</span>
<span v-else>
<i class="fa fa-circle status-error" uib-tooltip="{{ service.status }}"></i>
</span>
</span>
<i class="fa fa-circle-notch fa-spin" v-show="!service.status"></i>
<StateLED :busy="!service.status" :state="state(service)" :title="stateTooltip(service)"/>
</template>
<template #memoryPercent="service">
<ProgressBar :value="service.memoryPercent" v-show="service.memoryPercent" />