Move app backup listing below the backup create button

This commit is contained in:
Johannes Zellner
2025-10-09 14:22:00 +02:00
parent 40cc12e568
commit a038028c3b
+16 -14
View File
@@ -397,6 +397,22 @@ onMounted(async () => {
<div class="error-label" v-if="errorMessage">{{ errorMessage }}</div>
<div v-if="lastTask.active">
<div style="margin-top: 10px; display: flex; align-items: center; gap: 10px; overflow: hidden;">
<div style="flex-grow: 1; overflow: hidden;">
<ProgressBar :value="lastTask.percent" :show-label="false" :busy="true" :mode="lastTask.percent <= 0 ? 'indeterminate' : ''"/>
<a :href="`/logs.html?taskId=${lastTask.id}`" target="_blank" style="display: block; margin-top: 3px; max-width: 100%; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;">{{ lastTask.percent }}% {{ lastTask.message }}</a>
</div>
<Button danger plain tool icon="fa-solid fa-xmark" @click="onStopBackup()" :loading="stopBackupBusy" :disabled="stopBackupBusy"></Button>
</div>
</div>
<div v-else>
<Button v-if="backupSites.length <= 1" @click="onStartBackup(backupSites[0].id)" :loading="startBackupBusy" :disabled="!backupSites.length || app.runState === RSTATES.STOPPED || startBackupBusy || !!app.error">{{ $t('app.backups.backups.createBackupAction') }}</Button>
<Button v-else :menu="backupSitesMenu" :loading="startBackupBusy" :disabled="app.runState === RSTATES.STOPPED || startBackupBusy || !!app.error">{{ $t('app.backups.backups.createBackupAction') }}</Button>
</div>
<br/>
<TableView :model="backups" :columns="columns" :busy="busy" :placeholder="$t('backups.listing.noBackups')" style="max-height: 400px;" >
<template #preserveSecs="backup">
<Icon icon="fa-solid fa-archive" v-show="backup.preserveSecs === -1" />
@@ -416,19 +432,5 @@ onMounted(async () => {
</div>
</template>
</TableView>
<div v-if="lastTask.active">
<div style="margin-top: 10px; display: flex; align-items: center; gap: 10px; overflow: hidden;">
<div style="flex-grow: 1; overflow: hidden;">
<ProgressBar :value="lastTask.percent" :show-label="false" :busy="true" :mode="lastTask.percent <= 0 ? 'indeterminate' : ''"/>
<a :href="`/logs.html?taskId=${lastTask.id}`" target="_blank" style="display: block; margin-top: 3px; max-width: 100%; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;">{{ lastTask.percent }}% {{ lastTask.message }}</a>
</div>
<Button danger plain tool icon="fa-solid fa-xmark" @click="onStopBackup()" :loading="stopBackupBusy" :disabled="stopBackupBusy"></Button>
</div>
</div>
<div v-else class="button-bar">
<Button v-if="backupSites.length <= 1" @click="onStartBackup(backupSites[0].id)" :loading="startBackupBusy" :disabled="!backupSites.length || app.runState === RSTATES.STOPPED || startBackupBusy || !!app.error">{{ $t('app.backups.backups.createBackupAction') }}</Button>
<Button v-else :menu="backupSitesMenu" :loading="startBackupBusy" :disabled="app.runState === RSTATES.STOPPED || startBackupBusy || !!app.error">{{ $t('app.backups.backups.createBackupAction') }}</Button>
</div>
</div>
</template>