dashboard: rename backupTargets to backupSites
This commit is contained in:
Girish Ramakrishnan
@@ -11,14 +11,14 @@ import { TASK_TYPES } from '../constants.js';
|
||||
import Section from '../components/Section.vue';
|
||||
import SettingsItem from '../components/SettingsItem.vue';
|
||||
import BackupsModel from '../models/BackupsModel.js';
|
||||
import BackupTargetsModel from '../models/BackupTargetsModel.js';
|
||||
import BackupSitesModel from '../models/BackupSitesModel.js';
|
||||
import AppsModel from '../models/AppsModel.js';
|
||||
import TasksModel from '../models/TasksModel.js';
|
||||
import DashboardModel from '../models/DashboardModel.js';
|
||||
import { download } from '../utils.js';
|
||||
|
||||
const backupsModel = BackupsModel.create();
|
||||
const backupTargetsModel = BackupTargetsModel.create();
|
||||
const backupSitesModel = BackupSitesModel.create();
|
||||
const appsModel = AppsModel.create();
|
||||
const tasksModel = TasksModel.create();
|
||||
const dashboardModel = DashboardModel.create();
|
||||
@@ -44,7 +44,7 @@ const columns = {
|
||||
sort: false,
|
||||
hideMobile: true,
|
||||
},
|
||||
target: {
|
||||
site: {
|
||||
label: t('backup.target.label'),
|
||||
sort(a, b) {
|
||||
return b.name <= a.name ? 1 : -1;
|
||||
@@ -78,13 +78,13 @@ const backups = ref([]);
|
||||
const taskLogsMenu = ref([]);
|
||||
const trackingBackupTask = ref({});
|
||||
const trackingCleanupTask = ref({});
|
||||
const targets = ref([]);
|
||||
const sites = ref([]);
|
||||
const startBackupError = ref('');
|
||||
const startBackupBusy = ref(false);
|
||||
const startCleanupError = ref('');
|
||||
const startCleanupBusy = ref(false);
|
||||
|
||||
let primaryTargetId = null;
|
||||
let primarySiteId = null;
|
||||
|
||||
async function waitForBackupTask(id) {
|
||||
if (!id || (trackingBackupTask.value.id && trackingBackupTask.value.id !== id)) return;
|
||||
@@ -127,8 +127,8 @@ async function waitForCleanupTask(id) {
|
||||
async function refreshTasks() {
|
||||
let tasks = [];
|
||||
|
||||
for (const target of targets.value) {
|
||||
const [error, result] = await tasksModel.getByType(TASK_TYPES.TASK_FULL_BACKUP_PREFIX + target.id);
|
||||
for (const site of sites.value) {
|
||||
const [error, result] = await tasksModel.getByType(TASK_TYPES.TASK_FULL_BACKUP_PREFIX + site.id);
|
||||
if (error) return console.error(error);
|
||||
|
||||
tasks = tasks.concat(result);
|
||||
@@ -137,8 +137,8 @@ async function refreshTasks() {
|
||||
if (result[0] && result[0].active) waitForBackupTask(result[0].id);
|
||||
}
|
||||
|
||||
for (const target of targets.value) {
|
||||
const [error, result] = await tasksModel.getByType(TASK_TYPES.TASK_CLEAN_BACKUPS_PREFIX + target.id);
|
||||
for (const site of sites.value) {
|
||||
const [error, result] = await tasksModel.getByType(TASK_TYPES.TASK_CLEAN_BACKUPS_PREFIX + site.id);
|
||||
if (error) return console.error(error);
|
||||
|
||||
tasks = tasks.concat(result);
|
||||
@@ -176,7 +176,7 @@ async function refreshBackups() {
|
||||
});
|
||||
|
||||
result.forEach(function (backup) {
|
||||
backup.target = targets.value.find(t => t.id === backup.targetId);
|
||||
backup.site = sites.value.find(t => t.id === backup.siteId);
|
||||
backup.contents = []; // { id, label, fqdn }
|
||||
backup.dependsOn.forEach(function (appBackupId) {
|
||||
const match = appBackupId.match(/app_(.*?)_.*/); // *? means non-greedy
|
||||
@@ -205,7 +205,7 @@ async function onStartBackup() {
|
||||
startBackupBusy.value = true;
|
||||
startBackupError.value = '';
|
||||
|
||||
const [error] = await backupTargetsModel.createBackup(primaryTargetId);
|
||||
const [error] = await backupSitesModel.createBackup(primarySiteId);
|
||||
if (error) {
|
||||
if (error.status === 409) {
|
||||
if (error.body.message.indexOf('full_backup') !== -1) startBackupError.value = 'Backup already in progress. Please retry later.';
|
||||
@@ -238,7 +238,7 @@ async function onStartCleanup() {
|
||||
startCleanupBusy.value = true;
|
||||
startCleanupError.value = '';
|
||||
|
||||
const [error] = await backupTargetsModel.cleanup(primaryTargetId);
|
||||
const [error] = await backupSitesModel.cleanup(primarySiteId);
|
||||
if (error) {
|
||||
if (error.status === 409) {
|
||||
if (error.body.message.indexOf('full_backup') !== -1) startCleanupError.value = 'Cleanup already in progress. Please retry later.';
|
||||
@@ -271,14 +271,14 @@ async function onDownloadConfig(backup) {
|
||||
const [error, dashboardConfig] = await dashboardModel.config();
|
||||
if (error) return console.error(error);
|
||||
|
||||
const [backupTargetError, backupTarget] = await backupTargetsModel.get(backup.targetId);
|
||||
if (backupTargetError) return console.error(backupTargetError);
|
||||
const [backupSiteError, backupSite] = await backupSitesModel.get(backup.siteId);
|
||||
if (backupSiteError) return console.error(backupSiteError);
|
||||
|
||||
const tmp = {
|
||||
remotePath: backup.remotePath
|
||||
};
|
||||
for (const k of ['provider', 'config', 'limits', 'format', 'encrypted', 'encryptedFilenames', 'encryptionPasswordHint']) {
|
||||
tmp[k] = backupTarget[k];
|
||||
tmp[k] = backupSite[k];
|
||||
}
|
||||
|
||||
const filename = `${dashboardConfig.adminFqdn}-backup-config-${(new Date(backup.creationTime)).toISOString().split('T')[0]}.json`;
|
||||
@@ -329,15 +329,15 @@ function onCopyToClipboard(value) {
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
const [error, result] = await backupTargetsModel.list();
|
||||
const [error, result] = await backupSitesModel.list();
|
||||
if (error) return console.error(error);
|
||||
|
||||
targets.value = result;
|
||||
sites.value = result;
|
||||
|
||||
const primaryTarget = result.find(t => t.primary);
|
||||
if (!primaryTarget) return;
|
||||
const primarySite = result.find(t => t.primary);
|
||||
if (!primarySite) return;
|
||||
|
||||
primaryTargetId = primaryTarget.id;
|
||||
primarySiteId = primarySite.id;
|
||||
|
||||
await refreshBackups();
|
||||
await refreshTasks();
|
||||
@@ -456,7 +456,7 @@ onMounted(async () => {
|
||||
<span v-if="backup.stats"> ({{ backup.stats.fileCount }} files<span v-if="backup.stats.size"> - {{ prettyFileSize(backup.stats.size) }}</span>)</span>
|
||||
</template>
|
||||
|
||||
<template #target="backup">{{ backup.target.name }}</template>
|
||||
<template #site="backup">{{ backup.site.name }}</template>
|
||||
|
||||
<template #actions="backup">
|
||||
<div style="text-align: right;">
|
||||
|
||||
+76
-76
@@ -11,39 +11,39 @@ import Section from '../components/Section.vue';
|
||||
import SettingsItem from '../components/SettingsItem.vue';
|
||||
import StateLED from '../components/StateLED.vue';
|
||||
import BackupScheduleDialog from '../components/BackupScheduleDialog.vue';
|
||||
import BackupTargetAddDialog from '../components/BackupTargetAddDialog.vue';
|
||||
import BackupTargetEditDialog from '../components/BackupTargetEditDialog.vue';
|
||||
import BackupSiteAddDialog from '../components/BackupSiteAddDialog.vue';
|
||||
import BackupSiteEditDialog from '../components/BackupSiteEditDialog.vue';
|
||||
import { TASK_TYPES } from '../constants.js';
|
||||
import BackupTargetsModel from '../models/BackupTargetsModel.js';
|
||||
import BackupSitesModel from '../models/BackupSitesModel.js';
|
||||
import ProfileModel from '../models/ProfileModel.js';
|
||||
import TasksModel from '../models/TasksModel.js';
|
||||
|
||||
const profileModel = ProfileModel.create();
|
||||
const tasksModel = TasksModel.create();
|
||||
const backupTargetsModel = BackupTargetsModel.create();
|
||||
const backupSitesModels = BackupSitesModel.create();
|
||||
|
||||
const inputDialog = useTemplateRef('inputDialog');
|
||||
|
||||
const profile = ref({});
|
||||
const targets = ref([]);
|
||||
const sites = ref([]);
|
||||
const busy = ref(false);
|
||||
|
||||
const backupTargetAddDialog = useTemplateRef('backupTargetAddDialog');
|
||||
const backupSiteAddDialog = useTemplateRef('backupSiteAddDialog');
|
||||
function onAdd() {
|
||||
backupTargetAddDialog.value.open();
|
||||
backupSiteAddDialog.value.open();
|
||||
}
|
||||
|
||||
const backupTargetEditDialog = useTemplateRef('backupTargetEditDialog');
|
||||
function onEdit(target) {
|
||||
backupTargetEditDialog.value.open(target);
|
||||
const backupSiteEditDialog = useTemplateRef('backupSiteEditDialog');
|
||||
function onEdit(site) {
|
||||
backupSiteEditDialog.value.open(site);
|
||||
}
|
||||
|
||||
const backupScheduleDialog = useTemplateRef('backupScheduleDialog');
|
||||
function onEditSchedule(target) {
|
||||
backupScheduleDialog.value.open(target);
|
||||
function onEditSchedule(site) {
|
||||
backupScheduleDialog.value.open(site);
|
||||
}
|
||||
|
||||
async function onRemoveTarget(target) {
|
||||
async function onRemoveSite(site) {
|
||||
const yes = await inputDialog.value.confirm({
|
||||
title: t('backup.target.removeDialog.title'),
|
||||
message: t('backup.target.removeDialog.description'),
|
||||
@@ -55,27 +55,27 @@ async function onRemoveTarget(target) {
|
||||
|
||||
if (!yes) return;
|
||||
|
||||
const [error] = await backupTargetsModel.del(target.id);
|
||||
const [error] = await backupSitesModels.del(site.id);
|
||||
if (error) console.error(error);
|
||||
|
||||
await refresh();
|
||||
}
|
||||
|
||||
async function onRemount(target) {
|
||||
target.status.busy = true;
|
||||
async function onRemount(site) {
|
||||
site.status.busy = true;
|
||||
|
||||
const [error] = await backupTargetsModel.remount(target.id);
|
||||
const [error] = await backupSitesModels.remount(site.id);
|
||||
if (error) return console.error(error);
|
||||
|
||||
const [statusError, status] = await backupTargetsModel.status(target.id);
|
||||
const [statusError, status] = await backupSitesModels.status(site.id);
|
||||
if (statusError) console.error(statusError);
|
||||
|
||||
target.status.state = status.state === 'active' ? 'success' : 'danger';
|
||||
target.status.busy = false;
|
||||
site.status.state = status.state === 'active' ? 'success' : 'danger';
|
||||
site.status.busy = false;
|
||||
}
|
||||
|
||||
async function onStartBackup(target) {
|
||||
const [error, result] = await backupTargetsModel.createBackup(target.id);
|
||||
async function onStartBackup(site) {
|
||||
const [error, result] = await backupSitesModels.createBackup(site.id);
|
||||
if (error) {
|
||||
if (error.status === 409) {
|
||||
// TODO
|
||||
@@ -89,109 +89,109 @@ async function onStartBackup(target) {
|
||||
const [taskError, task] = await tasksModel.get(result);
|
||||
if (taskError) return console.error(taskError);
|
||||
|
||||
target.task = task;
|
||||
site.task = task;
|
||||
|
||||
setTimeout(waitForTargetTask.bind(null,target), 2000);
|
||||
setTimeout(waitForSiteTask.bind(null,site), 2000);
|
||||
}
|
||||
|
||||
const actionMenuModel = ref([]);
|
||||
|
||||
const actionMenuElement = useTemplateRef('actionMenuElement');
|
||||
function onActionMenu(target, event) {
|
||||
function onActionMenu(site, event) {
|
||||
actionMenuModel.value = [{
|
||||
icon: 'fa-solid fa-plus',
|
||||
label: t('backups.listing.backupNow'),
|
||||
action: onStartBackup.bind(null, target),
|
||||
action: onStartBackup.bind(null, site),
|
||||
}, {
|
||||
icon: 'fa-solid fa-sync-alt',
|
||||
label: t('backups.location.remount'),
|
||||
visible: target.provider === 'sshfs' || target.provider === 'cifs' || target.provider === 'nfs' || target.provider === 'ext4' || target.provider === 'xfs',
|
||||
action: onRemount.bind(null, target),
|
||||
visible: site.provider === 'sshfs' || site.provider === 'cifs' || site.provider === 'nfs' || site.provider === 'ext4' || site.provider === 'xfs',
|
||||
action: onRemount.bind(null, site),
|
||||
}, {
|
||||
separator: true,
|
||||
}, {
|
||||
icon: 'fa-solid fa-clock',
|
||||
label: t('backups.schedule.title'),
|
||||
action: onEditSchedule.bind(null, target),
|
||||
action: onEditSchedule.bind(null, site),
|
||||
}, {
|
||||
icon: 'fa-solid fa-pencil-alt',
|
||||
label: t('main.dialog.edit'),
|
||||
action: onEdit.bind(null, target),
|
||||
action: onEdit.bind(null, site),
|
||||
}, {
|
||||
separator: true
|
||||
}, {
|
||||
icon: 'fa-solid fa-trash',
|
||||
label: t('volumes.removeVolumeDialog.removeAction'),
|
||||
disabled: target.primary,
|
||||
action: onRemoveTarget.bind(null, target),
|
||||
disabled: site.primary,
|
||||
action: onRemoveSite.bind(null, site),
|
||||
}];
|
||||
|
||||
actionMenuElement.value.open(event, event.currentTarget);
|
||||
}
|
||||
|
||||
const primaryTargetId = ref('');
|
||||
const primaryTargetChangeBusy = ref(false);
|
||||
const primarySiteId = ref('');
|
||||
const primarySiteChangeBusy = ref(false);
|
||||
|
||||
async function onPrimaryTargetChanged(value) {
|
||||
primaryTargetChangeBusy.value = true;
|
||||
async function onPrimarySiteChanged(value) {
|
||||
primarySiteChangeBusy.value = true;
|
||||
|
||||
const [error] = await backupTargetsModel.setPrimary(value);
|
||||
const [error] = await backupSitesModels.setPrimary(value);
|
||||
if (error) return console.error(error);
|
||||
|
||||
// update the list to be in sync without flickering
|
||||
targets.value.forEach(t => t.primary = t.id === value);
|
||||
sites.value.forEach(t => t.primary = t.id === value);
|
||||
|
||||
primaryTargetId.value = value;
|
||||
primaryTargetChangeBusy.value = false;
|
||||
primarySiteId.value = value;
|
||||
primarySiteChangeBusy.value = false;
|
||||
}
|
||||
|
||||
async function waitForTargetTask(target) {
|
||||
const [error, result] = await tasksModel.get(target.task.id);
|
||||
async function waitForSiteTask(site) {
|
||||
const [error, result] = await tasksModel.get(site.task.id);
|
||||
if (error) {
|
||||
console.error(error);
|
||||
setTimeout(waitForTargetTask.bind(null, target), 2000);
|
||||
setTimeout(waitForSiteTask.bind(null, site), 2000);
|
||||
} else if (result.active) {
|
||||
target.task = result;
|
||||
setTimeout(waitForTargetTask.bind(null, target), 2000);
|
||||
site.task = result;
|
||||
setTimeout(waitForSiteTask.bind(null, site), 2000);
|
||||
} else {
|
||||
target.task = result;
|
||||
site.task = result;
|
||||
}
|
||||
}
|
||||
|
||||
async function refresh() {
|
||||
busy.value = true;
|
||||
|
||||
const [error, result] = await backupTargetsModel.list();
|
||||
const [error, result] = await backupSitesModels.list();
|
||||
if (error) return console.error(error);
|
||||
|
||||
for (const target of result) {
|
||||
target.status = { busy: true, state: '', message: '' };
|
||||
for (const site of result) {
|
||||
site.status = { busy: true, state: '', message: '' };
|
||||
}
|
||||
|
||||
for (const target of result) {
|
||||
const [error, status] = await backupTargetsModel.status(target.id);
|
||||
for (const site of result) {
|
||||
const [error, status] = await backupSitesModels.status(site.id);
|
||||
if (error) {
|
||||
console.error(error);
|
||||
continue;
|
||||
}
|
||||
|
||||
target.status.state = status.state === 'active' ? 'success' : 'danger';
|
||||
target.status.busy = false;
|
||||
site.status.state = status.state === 'active' ? 'success' : 'danger';
|
||||
site.status.busy = false;
|
||||
|
||||
const [taskError, tasks] = await tasksModel.getByType(TASK_TYPES.TASK_FULL_BACKUP_PREFIX + target.id);
|
||||
const [taskError, tasks] = await tasksModel.getByType(TASK_TYPES.TASK_FULL_BACKUP_PREFIX + site.id);
|
||||
if (taskError) {
|
||||
console.error(error);
|
||||
continue;
|
||||
}
|
||||
|
||||
target.task = tasks[0] || null;
|
||||
site.task = tasks[0] || null;
|
||||
|
||||
if (target.task && target.task.active) waitForTargetTask(target);
|
||||
if (site.task && site.task.active) waitForSiteTask(site);
|
||||
}
|
||||
|
||||
primaryTargetId.value = result.find(t => t.primary)?.id;
|
||||
primarySiteId.value = result.find(t => t.primary)?.id;
|
||||
|
||||
targets.value = result;
|
||||
sites.value = result;
|
||||
busy.value = false;
|
||||
}
|
||||
|
||||
@@ -210,8 +210,8 @@ onMounted(async () => {
|
||||
<div class="content">
|
||||
<Menu ref="actionMenuElement" :model="actionMenuModel" />
|
||||
<InputDialog ref="inputDialog" />
|
||||
<BackupTargetAddDialog ref="backupTargetAddDialog" @success="refresh()"/>
|
||||
<BackupTargetEditDialog ref="backupTargetEditDialog" @success="refresh()"/>
|
||||
<BackupSiteAddDialog ref="backupSiteAddDialog" @success="refresh()"/>
|
||||
<BackupSiteEditDialog ref="backupSiteEditDialog" @success="refresh()"/>
|
||||
<BackupScheduleDialog ref="backupScheduleDialog" @success="refresh()"/>
|
||||
|
||||
<Section :title="$t('backup.target.title')">
|
||||
@@ -221,24 +221,24 @@ onMounted(async () => {
|
||||
|
||||
<div>
|
||||
<ProgressBar mode="indeterminate" v-if="busy" slim :show-label="false" />
|
||||
<div class="backup-target" v-for="target in targets" :key="target.id">
|
||||
<div class="backup-site" v-for="site in sites" :key="site.id">
|
||||
<div style="display: flex; align-items: center; gap: 10px">
|
||||
<StateLED :busy="target.status.busy" :state="target.status.state"/>
|
||||
<div class="backup-target-details">
|
||||
<div><b style="font-size: 16px">{{ target.name }}</b> <span v-if="target.primary" class="text-muted">- used for updates</span></div>
|
||||
<StateLED :busy="site.status.busy" :state="site.status.state"/>
|
||||
<div class="backup-site-details">
|
||||
<div><b style="font-size: 16px">{{ site.name }}</b> <span v-if="site.primary" class="text-muted">- used for updates</span></div>
|
||||
<div>
|
||||
{{ $t('backups.configureBackupStorage.provider') }}: <b>{{ target.provider }}</b> - {{ $t('backups.configureBackupStorage.format') }}: <b>{{ target.format }}</b> <i v-if="target.encrypted" class="fa-solid fa-lock"></i></div>
|
||||
<div class="backup-target-task">
|
||||
<div v-if="target.task && target.task.success">Last backup: <b>{{ prettyLongDate(target.task.ts) }}</b></div>
|
||||
<div v-if="target.task && target.task.error">Error: <b>{{ target.task.error }}</b></div>
|
||||
<div v-else-if="target.task && target.task.running">
|
||||
<ProgressBar :value="target.task.percent" /> {{ target.task.message }}
|
||||
{{ $t('backups.configureBackupStorage.provider') }}: <b>{{ site.provider }}</b> - {{ $t('backups.configureBackupStorage.format') }}: <b>{{ site.format }}</b> <i v-if="site.encrypted" class="fa-solid fa-lock"></i></div>
|
||||
<div class="backup-site-task">
|
||||
<div v-if="site.task && site.task.success">Last backup: <b>{{ prettyLongDate(site.task.ts) }}</b></div>
|
||||
<div v-if="site.task && site.task.error">Error: <b>{{ site.task.error }}</b></div>
|
||||
<div v-else-if="site.task && site.task.running">
|
||||
<ProgressBar :value="site.task.percent" /> {{ site.task.message }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<Button tool plain secondary @click.capture="onActionMenu(target, $event)" icon="fa-solid fa-ellipsis" />
|
||||
<Button tool plain secondary @click.capture="onActionMenu(site, $event)" icon="fa-solid fa-ellipsis" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -251,7 +251,7 @@ onMounted(async () => {
|
||||
<div>{{ $t('backup.updateTarget.description') }}</div>
|
||||
</div>
|
||||
<div style="display: flex; align-items: center">
|
||||
<SingleSelect style="min-width: 160px" :disabled="primaryTargetChangeBusy" v-model="primaryTargetId" :searchThreshold="10" :options="targets" option-key="id" option-label="name" @select="onPrimaryTargetChanged" />
|
||||
<SingleSelect style="min-width: 160px" :disabled="primarySiteChangeBusy" v-model="primarySiteId" :searchThreshold="10" :options="sites" option-key="id" option-label="name" @select="onPrimarySiteChanged" />
|
||||
</div>
|
||||
</SettingsItem>
|
||||
</Section>
|
||||
@@ -260,7 +260,7 @@ onMounted(async () => {
|
||||
|
||||
<style scoped>
|
||||
|
||||
.backup-target {
|
||||
.backup-site {
|
||||
display: flex;
|
||||
border-radius: var(--pankow-border-radius);
|
||||
padding: 10px;
|
||||
@@ -268,17 +268,17 @@ onMounted(async () => {
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.backup-target:hover {
|
||||
.backup-site:hover {
|
||||
background-color: var(--pankow-color-background-hover);
|
||||
}
|
||||
|
||||
.backup-target-details {
|
||||
.backup-site-details {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
.backup-target-action {
|
||||
.backup-site-action {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
Reference in New Issue
Block a user