Convert other pages to composition API

This commit is contained in:
2022-02-14 22:24:42 +00:00
parent d11c0036b5
commit 0a030eaee1
9 changed files with 196 additions and 231 deletions

View File

@ -1,65 +1,56 @@
<script lang="ts">
import { defineComponent } from "vue"
<script lang="ts" setup>
import { computed, defineComponent, onMounted, ref } from "vue"
import { useRouter } from "vue-router";
import { DELETE, POST } from "../api";
import { useBudgetsStore } from "../stores/budget";
import { useSessionStore } from "../stores/session";
export default defineComponent({
data() {
return {
transactionsFile: undefined as File | undefined,
assignmentsFile: undefined as File | undefined
}
},
computed: {
filesIncomplete() : boolean {
return this.$data.transactionsFile == undefined || this.$data.assignmentsFile == undefined;
}
},
mounted() {
document.title = "Budgeteer - Settings";
},
methods: {
gotAssignments(e : Event) {
const input = (<HTMLInputElement>e.target);
if(input.files != null)
this.$data.assignmentsFile = input.files[0];
},
gotTransactions(e : Event) {
const input = (<HTMLInputElement>e.target);
if(input.files != null)
this.$data.transactionsFile = input.files[0];
},
deleteBudget() {
const currentBudgetID = useBudgetsStore().CurrentBudgetID;
if (currentBudgetID == null)
return;
const transactionsFile = ref<File | undefined>(undefined);
const assignmentsFile = ref<File | undefined>(undefined);
DELETE("/budget/" + currentBudgetID);
const filesIncomplete = computed(() => transactionsFile.value == undefined || assignmentsFile.value == undefined);
onMounted(() => {
document.title = "Budgeteer - Settings";
});
const budgetStore = useSessionStore();
budgetStore.Budgets.delete(currentBudgetID);
this.$router.push("/")
},
clearBudget() {
const currentBudgetID = useBudgetsStore().CurrentBudgetID;
POST("/budget/" + currentBudgetID + "/settings/clear", null)
},
cleanNegative() {
// <a href="/budget/{{.Budget.ID}}/settings/clean-negative">Fix all historic negative category-balances</a>
},
ynabImport() {
if (this.$data.transactionsFile == undefined || this.$data.assignmentsFile == undefined)
return
function gotAssignments(e: Event) {
const input = (<HTMLInputElement>e.target);
if (input.files != null)
assignmentsFile.value = input.files[0];
}
function gotTransactions(e: Event) {
const input = (<HTMLInputElement>e.target);
if (input.files != null)
transactionsFile.value = input.files[0];
};
function deleteBudget() {
const currentBudgetID = useBudgetsStore().CurrentBudgetID;
if (currentBudgetID == null)
return;
let formData = new FormData();
formData.append("transactions", this.$data.transactionsFile);
formData.append("assignments", this.$data.assignmentsFile);
const budgetStore = useBudgetsStore();
budgetStore.ImportYNAB(formData);
}
}
})
DELETE("/budget/" + currentBudgetID);
const budgetStore = useSessionStore();
budgetStore.Budgets.delete(currentBudgetID);
useRouter().push("/")
};
function clearBudget() {
const currentBudgetID = useBudgetsStore().CurrentBudgetID;
POST("/budget/" + currentBudgetID + "/settings/clear", null)
};
function cleanNegative() {
// <a href="/budget/{{.Budget.ID}}/settings/clean-negative">Fix all historic negative category-balances</a>
};
function ynabImport() {
if (transactionsFile.value == undefined || assignmentsFile.value == undefined)
return
let formData = new FormData();
formData.append("transactions", transactionsFile.value);
formData.append("assignments", assignmentsFile.value);
const budgetStore = useBudgetsStore();
budgetStore.ImportYNAB(formData);
};
</script>
<template>
@ -124,10 +115,7 @@ export default defineComponent({
</label>
<v-card-actions class="justify-center">
<v-btn
:disabled="filesIncomplete"
@click="ynabImport"
>Importieren</v-btn>
<v-btn :disabled="filesIncomplete" @click="ynabImport">Importieren</v-btn>
</v-card-actions>
</v-card>
</v-col>