jacob1123/budgeteer
1
1
Fork 0
Code Issues 12 Pull Requests 1 Packages Releases 1 Wiki Activity

Redesign Budget Settings and introduce Button component
All checks were successful
continuous-integration/drone/pr Build is passing
Details
continuous-integration/drone/push Build is passing
Details

Browse Source
This commit is contained in:
Jan Bader 2022-02-23 23:12:39 +00:00
parent 635f4de402
commit 966c0ce0eb
2 changed files with 36 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
web/src/components/Button.vue Normal file
View File

@ -0,0 +1,8 @@
<script lang="ts" setup>
</script>
<template>
<button class="px-4 py-2 text-base font-medium rounded-md shadow-sm focus:outline-none focus:ring-2">
<slot></slot>
</button>
</template>

49
web/src/pages/Settings.vue
View File

@ -5,6 +5,7 @@ import { DELETE, POST } from "../api";
import { useBudgetsStore } from "../stores/budget";
import { useSessionStore } from "../stores/session";
import Card from "../components/Card.vue";
import Button from "../components/Button.vue";
const transactionsFile = ref<File | undefined>(undefined);
const assignmentsFile = ref<File | undefined>(undefined);
@ -57,37 +58,41 @@ function ynabImport() {
<template>
<div>
<h1>Danger Zone</h1>
<div class="grid md:grid-cols-2 gap-6">
<Card>
<h2>Clear Budget</h2>
<div class="grid md:grid-cols-2 gap-6">
<Card class="flex-col p-3">
<h2 class="text-lg font-bold">Clear Budget</h2>
<p>This removes transactions and assignments to start from scratch. Accounts and categories are kept. Not undoable!</p>
<button @click="clearBudget">Clear budget</button>
<Button class="bg-red-500" @click="clearBudget">Clear budget</Button>
</Card>
<Card>
<h2>Delete Budget</h2>
<Card class="flex-col p-3">
<h2 class="text-lg font-bold">Delete Budget</h2>
<p>This deletes the whole bugdet including all transactions, assignments, accounts and categories. Not undoable!</p>
<button @click="deleteBudget">Delete budget</button>
<Button class="bg-red-500" @click="deleteBudget">Delete budget</button>
</Card>
<Card>
<h2>Fix all historic negative category-balances</h2>
<Card class="flex-col p-3">
<h2 class="text-lg font-bold">Fix all historic negative category-balances</h2>
<p>This restores YNABs functionality, that would substract any overspent categories' balances from next months inflows.</p>
<button @click="cleanNegative">Fix negative</button>
<Button class="bg-orange-500" @click="cleanNegative">Fix negative</button>
</Card>
<Card>
<h2>Import YNAB Budget</h2>
<Card class="flex-col p-3">
<h2 class="text-lg font-bold">Import YNAB Budget</h2>
<label for="transactions_file">
Transaktionen:
<input type="file" @change="gotTransactions" accept="text/*" />
</label>
<br />
<label for="assignments_file">
Budget:
<input type="file" @change="gotAssignments" accept="text/*" />
</label>
<div class="flex flex-row">
<div>
<label for="transactions_file">
Transaktionen:
<input type="file" @change="gotTransactions" accept="text/*" />
</label>
<br />
<label for="assignments_file">
Budget:
<input type="file" @change="gotAssignments" accept="text/*" />
</label>
</div>
<button :disabled="filesIncomplete" @click="ynabImport">Importieren</button>
<Button class="bg-blue-500" :disabled="filesIncomplete" @click="ynabImport">Importieren</Button>
</div>
</Card>
</div>
</div>