Files
docker-wireguard/src/app/pages/setup/migrate.vue
Bernd Storath 86bdbe4c3d Feat: Initial Setup through env vars (#1736)
* initial support for initial setup

* improve setup

* improve mobile view

* move base admin route

* admin panel mobile view

* set initial host and port

* add docs

* properly setup everything, use for dev env

* change userconfig and interface port on setup, note users afterwards
2025-03-13 11:28:05 +01:00

73 lines
1.5 KiB
Vue

<template>
<div class="flex flex-col items-center">
<p class="text-center text-lg">
{{ $t('setup.setupMigrationDesc') }}
</p>
<div class="mt-8 flex gap-3">
<Label for="migration">{{ $t('setup.migration') }}</Label>
<input id="migration" type="file" @change="onChangeFile" />
</div>
<div class="mt-4">
<BaseButton @click="submit">{{ $t('setup.upload') }}</BaseButton>
</div>
</div>
</template>
<script lang="ts" setup>
definePageMeta({
layout: 'setup',
});
const setupStore = useSetupStore();
setupStore.setStep(5);
const backupFile = ref<null | File>(null);
function onChangeFile(evt: Event) {
const target = evt.target as HTMLInputElement;
const file = target.files?.[0];
if (file) {
backupFile.value = file;
console.log('selected file', backupFile.value);
}
}
const _submit = useSubmit(
'/api/setup/migrate',
{
method: 'post',
},
{
revert: async (success) => {
if (success) {
await navigateTo('/setup/success');
}
},
noSuccessToast: true,
}
);
async function submit() {
if (!backupFile.value) {
return;
}
const content = await readFileContent(backupFile.value);
return _submit({ file: content });
}
async function readFileContent(file: File): Promise<string> {
return new Promise((resolve, reject) => {
const reader = new FileReader();
reader.onload = (event) => {
resolve(event.target?.result as string);
};
reader.onerror = (error) => {
reject(error);
};
reader.readAsText(file);
});
}
</script>