Import started

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

View file

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

View file

@ -8,19 +8,24 @@
<template #main>
<Spinner v-if="status == 'working'" class="mx-auto" />
<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>
<label for="encKey">Encryption Key</label>
<div class="flex flex-row justify-start items-center gap-2">
<label for="file" class="w-1/4">Zum Importieren Datei auswählen</label>
<input type="file" class="grow" id="file" @change="addFile"/>
</div>
<div class="flex flex-row justify-start items-center gap-2">
<label for="encKey" class="w-1/4 text-nowrap">Encryption Key</label>
<input type="password" id="encKey" required v-model="secret" />
</div>
<div class="flex flex-row justify-end gap-2">
<button :disabled="disabled" primary class="!w-fit" @click="exportDatabase">Datenbank exportieren</button>
<!-- <button :disabled="status == 'working' || encryptionKey == ''" class="!w-fit" @click="importDatabase">Datenbank importieren</button>-->
<button primary :disabled="uploadDisabled" class="!w-fit" @click="importDatabase">Import</button>
<button :disabled="disabled" primary class="!w-fit" @click="exportDatabase">Exportieren</button>
</div>
<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>
</form>
</template>
</MainTemplate>
</template>
@ -40,6 +45,10 @@ import SuccessCheckmark from "@/components/SuccessCheckmark.vue";
export default defineComponent({
data() {
return {
dataUrl: '' as string,
dataImport: '' as string,
file: null,
downloadFilename: '' as string,
secret: '' as string,
};
},
@ -47,23 +56,43 @@ export default defineComponent({
...mapState(useDatabaseStore, ["data", "status", "failureReason"]),
disabled() : boolean {
return this.status === 'working' || this.secret === '';
},
uploadDisabled() : boolean {
return this.status === 'working' || this.secret === '' || this.file === null;
}
},
mounted() {
this.secret = '' as string;
},
methods: {
...mapActions(useDatabaseStore, ["export"]),
...mapActions(useDatabaseStore, ["export", "import"]),
addFile(e) {
this.file = e.target.files[0];
console.log(this.file);
},
async exportDatabase() {
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) {
console.log(ex);
}
},
importDatabase() {
onChangeFileUpload() {
},
async importDatabase() {
try {
await this.import(this.secret, this.dataImport);
}
catch(ex) {
console.log(ex);
}
}
},
});