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

Fixup backup site config dialog to handle S3

Browse Source
This commit is contained in:
Johannes Zellner
2025-10-09 11:58:16 +02:00
parent b0026eafb5
commit dfe5b6b1f2
4 changed files with 104 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
dashboard/src/components/BackupProviderForm.vue
View File

@@ -129,15 +129,15 @@ onMounted(async () => {
<TextInput id="mountOptionHostInput" v-model="providerConfig.mountOptionHost" placeholder="Server IP or hostname" required />
</FormGroup>
<!-- CIFS -->
<Checkbox v-if="provider === 'cifs'" v-model="providerConfig.mountOptionSeal" :label="$t('backups.configureBackupStorage.cifsSealSupport')" />
<!-- CIFS/NFS/SSHFS -->
<FormGroup v-if="provider === 'cifs' || provider === 'nfs' || provider === 'sshfs'">
<label for="mountOptionRemoteDirInput">{{ $t('backups.configureBackupStorage.remoteDirectory') }} ({{ provider }})</label>
<TextInput id="mountOptionRemoteDirInput" v-model="providerConfig.mountOptionRemoteDir" placeholder="/share" required />
</FormGroup>
<!-- CIFS -->
<Checkbox v-if="provider === 'cifs'" v-model="providerConfig.mountOptionSeal" :label="$t('backups.configureBackupStorage.cifsSealSupport')" />
<!-- CIFS -->
<FormGroup v-if="provider === 'cifs'">
<label for="mountOptionUsernameInput">{{ $t('backups.configureBackupStorage.username') }} ({{ provider }})</label>

142
dashboard/src/components/BackupSiteConfigDialog.vue
View File

@@ -1,9 +1,9 @@
<script setup>
import { ref, useTemplateRef } from 'vue';
import { MaskedInput, Dialog, FormGroup, TextInput } from '@cloudron/pankow';
import { MaskedInput, Dialog, FormGroup, TextInput, Checkbox } from '@cloudron/pankow';
import { prettyBinarySize } from '@cloudron/pankow/utils';
import { s3like } from '../utils.js';
import { s3like, regionName } from '../utils.js';
import BackupSitesModel from '../models/BackupSitesModel.js';
import SystemModel from '../models/SystemModel.js';
@@ -30,39 +30,21 @@ const copyConcurrency = ref(0);
const accessKeyId = ref('');
const secretAccessKey = ref('');
const mountOptionUsername = ref('');
const mountOptionPassword = ref('');
const mountOptionUser = ref('');
const mountOptionPrivateKey = ref('');
const bucket = ref('');
const region = ref('');
const prefix = ref('');
const mountOptionsHost = ref('');
const mountOptionsPort = ref(0);
const mountOptionsRemoteDir = ref('');
const mountOptionsSeal = ref(false);
const mountOptionsUsername = ref('');
const mountOptionsPassword = ref('');
const mountOptionsUser = ref('');
const mountOptionsPrivateKey = ref('');
async function onSubmit() {
busy.value = true;
// TODO maybe deal with gcs??
if (s3like(provider.value) && (accessKeyId.value !== site.value.config.accessKeyId || secretAccessKey.value)) {
const [error] = await backupSitesModel.setConfig(site.value.id, {
accessKeyId: accessKeyId.value,
secretAccessKey: secretAccessKey.value,
});
if (error) return console.error(error);
} else if (provider.value === 'cifs' && (mountOptionUsername.value !== site.value.config.mountOptions.username || mountOptionPassword.value)) {
const [error] = await backupSitesModel.setConfig(site.value.id, {
mountOptions: {
username: mountOptionUsername.value,
password: mountOptionPassword.value,
}
});
if (error) return console.error(error);
} else if (provider.value === 'sshfs' && (mountOptionUser.value !== site.value.config.mountOptions.user || mountOptionPrivateKey.value)) {
const [error] = await backupSitesModel.setConfig(site.value.id, {
mountOptions: {
user: mountOptionUser.value,
privateKey: mountOptionPrivateKey.value,
}
});
if (error) return console.error(error);
}
let [error] = await backupSitesModel.setName(site.value.id, name.value);
if (error) {
formError.value.generic = error.body ? error.body.message : 'Internal error';
@@ -70,6 +52,52 @@ async function onSubmit() {
return console.error(error);
}
const data = {};
// TODO maybe deal with gcs??
if (s3like(provider.value) && (accessKeyId.value !== site.value.config.accessKeyId || secretAccessKey.value)) {
data.bucket = bucket.value;
data.region = region.value;
data.prefix = prefix.value;
data.accessKeyId = accessKeyId.value;
data.secretAccessKey = secretAccessKey.value || 'unset';
}
if (provider.value === 'cifs') {
data.mountOptions = {};
data.mountOptions.host = mountOptionsHost.value;
data.mountOptions.remoteDir = mountOptionsRemoteDir.value;
data.mountOptions.seal = mountOptionsSeal.value;
data.mountOptions.username = mountOptionsUsername.value;
if (mountOptionsPassword.value) data.mountOptions.password = mountOptionsPassword.value;
}
if (provider.value === 'sshfs') {
data.mountOptions = {};
data.mountOptions.host = mountOptionsHost.value;
data.mountOptions.port = mountOptionsPort.value;
data.mountOptions.remoteDir = mountOptionsRemoteDir.value;
data.mountOptions.user = mountOptionsUser.value;
if (mountOptionsPrivateKey.value) data.mountOptions.privateKey = mountOptionsPrivateKey.value;
}
// only call if anything has changed
if (Object.keys(data).length) {
const [error] = await backupSitesModel.setConfig(site.value.id, data);
if (error) {
if (error.status === 400) {
// if (error.body.message.indexOf('password') === 0) formError.value.generic = 'Username or password is wrong';
formError.value.generic = error.body ? error.body.message : 'Internal error';
} else {
formError.value.generic = error.body ? error.body.message : 'Internal error';
console.error(error);
}
busy.value = false;
return;
}
}
const limits = {
memoryLimit: parseInt(memoryLimit.value),
uploadPartSize: parseInt(uploadPartSize.value),
@@ -116,12 +144,21 @@ defineExpose({
if (s3like(provider.value)) {
accessKeyId.value = t.config.accessKeyId;
secretAccessKey.value = null;
bucket.value = t.config.bucket;
region.value = t.config.region;
prefix.value = t.config.prefix;
} else if (provider.value === 'cifs') {
mountOptionUsername.value = t.config.mountOptions.username;
mountOptionPassword.value = null;
mountOptionsUsername.value = t.config.mountOptions.username;
mountOptionsHost.value = t.config.mountOptions.host;
mountOptionsRemoteDir.value = t.config.mountOptions.remoteDir;
mountOptionsSeal.value = t.config.mountOptions.seal;
mountOptionsPassword.value = null;
} else if (provider.value === 'sshfs') {
mountOptionUser.value = t.config.mountOptions.user;
mountOptionPrivateKey.value = null;
mountOptionsUser.value = t.config.mountOptions.user;
mountOptionsHost.value = t.config.mountOptions.host;
mountOptionsPort.value = t.config.mountOptions.port;
mountOptionsRemoteDir.value = t.config.mountOptions.remoteDir;
mountOptionsPrivateKey.value = null;
}
await getMemory();
@@ -149,31 +186,48 @@ defineExpose({
<fieldset :disabled="busy">
<input style="display: none;" type="submit"/>
<div class="error-label" v-if="formError.generic">{{ formError.generic }}</div>
<FormGroup>
<label for="backupSiteNameInput">{{ $t('backups.configureBackupStorage.name') }}</label>
<TextInput id="backupSiteNameInput" v-model="name" required/>
</FormGroup>
<FormGroup v-if="provider === 'sshfs'">
<label for="mountOptionUserInput">{{ $t('backups.configureBackupStorage.user') }}</label>
<TextInput id="mountOptionUserInput" v-model="mountOptionUser" required />
<FormGroup v-if="site.provider && site.config">
<label><i v-if="site.encrypted" class="fa-solid fa-lock"></i> Storage: <b>{{ site.provider }} ({{ site.format }}) </b></label>
<div>
<span v-if="site.provider === 'filesystem'">{{ site.config.backupDir }}{{ (site.config.prefix ? `/${site.config.prefix}` : '') }}</span>
<span v-else-if="site.provider === 'disk' || site.provider === 'ext4' || site.provider === 'xfs' || site.provider === 'mountpoint'">{{ site.config.mountOptions.diskPath || site.config.mountPoint }}{{ (site.config.prefix ? `/${site.config.prefix}` : '') }}</span>
<span v-else-if="site.provider === 'cifs' || site.provider === 'nfs' || site.provider === 'sshfs'">{{ site.config.mountOptions.host }}:{{ site.config.mountOptions.remoteDir }}{{ (site.config.prefix ? `/${site.config.prefix}` : '') }}</span>
<span v-else-if="site.provider === 's3'">{{ site.config.region + ' ' + site.config.bucket + (site.config.prefix ? `/${site.config.prefix}` : '') }}</span>
<span v-else-if="site.provider === 'minio'">{{ site.config.endpoint + ' ' + site.config.bucket + (site.config.prefix ? `/${site.config.prefix}` : '') }}</span>
<span v-else-if="site.provider === 'gcs'">{{ site.config.endpoint + ' ' + site.config.bucket + (site.config.prefix ? `/${site.config.prefix}` : '') }}</span>
<span v-else>{{ regionName(site.provider, site.config.endpoint) + ' ' + site.config.bucket + (site.config.prefix ? `/${site.config.prefix}` : '') }}</span>
</div>
</FormGroup>
<FormGroup v-if="provider === 'sshfs'">
<label for="mountOptionPrivateKeyInput">{{ $t('backups.configureBackupStorage.privateKey') }}</label>
<MaskedInput id="mountOptionPrivateKeyInput" :multiline="true" v-model="mountOptionPrivateKey" required/>
<label for="mountOptionsUserInput">{{ $t('backups.configureBackupStorage.user') }}</label>
<TextInput id="mountOptionsUserInput" v-model="mountOptionsUser" required />
</FormGroup>
<FormGroup v-if="provider === 'sshfs'">
<label for="mountOptionsPrivateKeyInput">{{ $t('backups.configureBackupStorage.privateKey') }}</label>
<MaskedInput id="mountOptionsPrivateKeyInput" :multiline="true" v-model="mountOptionsPrivateKey" required/>
</FormGroup>
<FormGroup v-if="provider === 'cifs'">
<label for="mountOptionUsernameInput">{{ $t('backups.configureBackupStorage.username') }} ({{ provider }})</label>
<TextInput id="mountOptionUsernameInput" v-model="mountOptionUsername" required />
<label for="mountOptionsUsernameInput">{{ $t('backups.configureBackupStorage.username') }} ({{ provider }})</label>
<TextInput id="mountOptionsUsernameInput" v-model="mountOptionsUsername" required />
</FormGroup>
<FormGroup v-if="provider === 'cifs'">
<label for="mountOptionPasswordInput">{{ $t('backups.configureBackupStorage.password') }} ({{ provider }})</label>
<MaskedInput id="mountOptionPasswordInput" v-model="mountOptionPassword" required />
<label for="mountOptionsPasswordInput">{{ $t('backups.configureBackupStorage.password') }} ({{ provider }})</label>
<MaskedInput id="mountOptionsPasswordInput" v-model="mountOptionsPassword" required />
</FormGroup>
<Checkbox v-if="provider === 'cifs'" v-model="mountOptionsSeal" :label="$t('backups.configureBackupStorage.cifsSealSupport')" />
<FormGroup v-if="s3like(provider)">
<label for="accessKeyIdInput">{{ $t('backups.configureBackupStorage.s3AccessKeyId') }}</label>
<TextInput id="accessKeyIdInput" v-model="accessKeyId" required />

2
dashboard/src/components/BackupSiteContentDialog.vue
View File

@@ -113,6 +113,8 @@ defineExpose({
<fieldset :disabled="busy">
<input style="display: none;" type="submit"/>
<div class="error-label" v-if="formError.generic">{{ formError.generic }}</div>
<FormGroup>
<label>{{ $t('backups.configureBackupStorage.backupContents.title') }}</label>
<div>{{ $t('backups.configureBackupStorage.backupContents.description') }}</div>

2
dashboard/src/views/BackupSitesView.vue
View File

@@ -162,7 +162,7 @@ function onActionMenu(site, event) {
label: t('backups.schedule.title'),
action: onEditSchedule.bind(null, site),
}, {
icon: 'fa-solid fa-pencil-alt',
icon: 'fa-solid fa-screwdriver-wrench',
label: t('backups.configAction'),
action: onEditConfig.bind(null, site),
}, {