Ehrenamt/ff-admin
2
0
Fork 0
Code Issues 10 Pull requests Projects Releases 7 Packages Wiki Activity Actions

Import started

Browse source
This commit is contained in:
Anton Schegg 2024-10-18 09:37:31 +02:00
parent 115b2937e5
commit c657b36292
2 changed files with 47 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/stores/admin/database.ts
View file

@ -20,7 +20,7 @@ export const useDatabaseStore = defineStore("database", {
this.data = result.data; this.data = result.data;
this.status = "success"; this.status = "success";
}) })
.catch((err) => { .catch(() => {
this.status = "failed"; this.status = "failed";
}); });
}, },
@ -29,7 +29,7 @@ export const useDatabaseStore = defineStore("database", {
this.status = "working"; this.status = "working";
const postData = {secret: secret}; const postData = {secret: secret};
const response: AxiosResponse = await http.post("/admin/database", postData); const response: AxiosResponse = await http.post("/admin/database", postData);
this.data = response.data; this.data = response.data.data;
this.status = "success"; this.status = "success";
} catch (ex) { } catch (ex) {
this.status = "failed"; this.status = "failed";

61
src/views/admin/settings/Database.vue
View file

@ -8,19 +8,24 @@
<template #main> <template #main>
<Spinner v-if="status == 'working'" class="mx-auto" /> <Spinner v-if="status == 'working'" class="mx-auto" />
<p v-else-if="status == 'failed'">Fehler</p> <p v-else-if="status == 'failed'">Fehler</p>
<form class="flex flex-col gap-4 py-2 w-full max-w-xl mx-auto"> <div class="flex flex-row justify-start items-center gap-2">
<div> <label for="file" class="w-1/4">Zum Importieren Datei auswählen</label>
<label for="encKey">Encryption Key</label> <input type="file" class="grow" id="file" @change="addFile"/>
<input type="password" id="encKey" required v-model="secret" /> </div>
</div> <div class="flex flex-row justify-start items-center gap-2">
<div class="flex flex-row justify-end gap-2"> <label for="encKey" class="w-1/4 text-nowrap">Encryption Key</label>
<button :disabled="disabled" primary class="!w-fit" @click="exportDatabase">Datenbank exportieren</button> <input type="password" id="encKey" required v-model="secret" />
<!-- <button :disabled="status == 'working' || encryptionKey == ''" class="!w-fit" @click="importDatabase">Datenbank importieren</button>--> </div>
<Spinner v-if="status == 'working'" class="my-auto" /> <div class="flex flex-row justify-end gap-2">
<SuccessCheckmark v-else-if="status == 'success'" /> <button primary :disabled="uploadDisabled" class="!w-fit" @click="importDatabase">Import</button>
<FailureXMark v-else-if="status == 'failed'" /> <button :disabled="disabled" primary class="!w-fit" @click="exportDatabase">Exportieren</button>
</div> </div>
</form> <div class="flex flex-row justify-start gap-2">
<a class="download-link" v-if="dataUrl !== ''" :href="dataUrl" :download="downloadFilename">Download {{data.length}} Bytes</a>
<Spinner v-if="status == 'working'" class="my-auto" />
<SuccessCheckmark v-else-if="status == 'success'" />
<FailureXMark v-else-if="status == 'failed'" />
</div>
</template> </template>
</MainTemplate> </MainTemplate>
</template> </template>
@ -40,6 +45,10 @@ import SuccessCheckmark from "@/components/SuccessCheckmark.vue";
export default defineComponent({ export default defineComponent({
data() { data() {
return { return {
dataUrl: '' as string,
dataImport: '' as string,
file: null,
downloadFilename: '' as string,
secret: '' as string, secret: '' as string,
}; };
}, },
@ -47,23 +56,43 @@ export default defineComponent({
...mapState(useDatabaseStore, ["data", "status", "failureReason"]), ...mapState(useDatabaseStore, ["data", "status", "failureReason"]),
disabled() : boolean { disabled() : boolean {
return this.status === 'working' || this.secret === ''; return this.status === 'working' || this.secret === '';
},
uploadDisabled() : boolean {
return this.status === 'working' || this.secret === '' || this.file === null;
} }
}, },
mounted() { mounted() {
this.secret = '' as string; this.secret = '' as string;
}, },
methods: { methods: {
...mapActions(useDatabaseStore, ["export"]), ...mapActions(useDatabaseStore, ["export", "import"]),
addFile(e) {
this.file = e.target.files[0];
console.log(this.file);
},
async exportDatabase() { async exportDatabase() {
try { try {
const data = await this.export(this.secret); if (this.dataUrl) {
this.dataUrl = '';
}
await this.export(this.secret);
this.dataUrl = 'data:application/octet-stream,' + this.data;
this.downloadFilename = `${new Date().toISOString().replace(/:/g, '-')}_database_export.enc`;
} }
catch(ex) { catch(ex) {
console.log(ex); console.log(ex);
} }
}, },
importDatabase() { onChangeFileUpload() {
},
async importDatabase() {
try {
await this.import(this.secret, this.dataImport);
}
catch(ex) {
console.log(ex);
}
} }
}, },
}); });