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

Convert frontend to Vue #3

Merged
jacob1123 merged 158 commits from vue into master 2022-02-08 22:20:11 +01:00
Conversation 0 Commits 158 Files Changed 104 +39 -29
4 changed files with 39 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 1d0fe60ea4 - Show all commits

6
web/src/App.vue
View File

@@ -37,14 +37,16 @@ export default defineComponent({
</div>
</div>
<div :class="$store.state.ShowMenu ? 'visible' : 'hidden'">
<div class="flex flex-col md:flex-row flex-1">
<div :class="$store.state.ShowMenu ? 'visible' : 'hidden'" class="md:w-72 flex-shrink-0 w-full">
<router-view name="sidebar"></router-view>
</div>
<div>
<div class="flex-1 p-6">
<router-view></router-view>
</div>
</div>
</div>
</template>
<style>

8
web/src/index.css
View File

@@ -1,3 +1,11 @@
@tailwind base;
@tailwind components;
@tailwind utilities;
h1 {
font-size: 200%;
}
a {
text-decoration: underline;
}

40
web/src/pages/BudgetSidebar.vue
View File

@@ -7,40 +7,40 @@ export default defineComponent({
</script>
<template>
<h1>
<span class="text-xl">
<router-link to="/dashboard">⌂</router-link>
{{$store.getters.CurrentBudget.Name}}
</h1>
<ul>
<li><router-link :to="'/budget/'+budgetid">Budget</router-link></li>
<li>Reports (Coming Soon)</li>
</span>
<div class="flex flex-col">
<span class="bg-orange-200 rounded-lg m-1 p-1 px-3"><router-link :to="'/budget/'+budgetid">Budget</router-link></span>
<li class="bg-orange-200 rounded-lg m-1 p-1 px-3">Reports (Coming Soon)</li>
<!--<li><router-link :to="'/budget/'+$store.getters.CurrentBudget.ID+'/all-accounts'">All Accounts</router-link></li>-->
<li>
<li class="bg-orange-200 rounded-lg m-1 p-1 px-3">
On-Budget Accounts
<ul v-for="account in $store.getters.OnBudgetAccounts" class="two-valued">
<li>
<div v-for="account in $store.getters.OnBudgetAccounts" class="flex flex-row justify-between px-3">
<router-link :to="'/budget/'+budgetid+'/account/'+account.ID">{{account.Name}}</router-link>
<span :class="account.Balance.Int < 0 ? 'negative' : ''">{{account.Balance.Int / 100}}</span>
<span :class="account.Balance.Int < 0 ? 'negative' : ''">{{(account.Balance.Int / 100).toLocaleString(undefined, {minimumFractionDigits: 2,})}} €</span>
</div>
</li>
</ul>
</li>
<li>
<li class="bg-red-200 rounded-lg m-1 p-1 px-3">
Off-Budget Accounts
<ul v-for="account in $store.getters.OffBudgetAccounts" class="two-valued">
<li>
<div v-for="account in $store.getters.OffBudgetAccounts" class="flex flex-row justify-between px-3">
<router-link :to="'/budget/'+budgetid+'/account/'+account.ID">{{account.Name}}</router-link>
<span :class="account.Balance.Int < 0 ? 'negative' : ''">{{account.Balance.Int / 100}}</span>
</div>
</li>
</ul>
</li>
<li>
<li class="bg-red-200 rounded-lg m-1 p-1 px-3">
Closed Accounts
</li>
<!--<li>
<router-link :to="'/budget/'+$store.getters.CurrentBudget.ID+'/accounts'">Edit accounts</router-link>
</li>-->
<li>+ Add Account</li>
<li><router-link :to="'/budget/'+$store.getters.CurrentBudget.ID+'/settings'">Budget-Settings</router-link></li>
<li class="bg-red-200 rounded-lg m-1 p-1 px-3">
+ Add Account
</li>
<li class="bg-red-200 rounded-lg m-1 p-1 px-3">
<router-link :to="'/budget/'+$store.getters.CurrentBudget.ID+'/settings'">Budget-Settings</router-link>
</li>
<!--<li><router-link to="/admin">Admin</router-link></li>-->
</ul>
</div>
</template>

2
web/src/pages/Dashboard.vue
View File

@@ -11,7 +11,7 @@ export default defineComponent({
<template>
<h1>Budgets</h1>
<div class="flex">
<div class="grid md:grid-cols-2 gap-6">
<Card v-for="budget in $store.getters.Budgets">
<router-link v-bind:to="'/budget/'+budget.ID" class="contents">
<!--<svg class="w-24"></svg>-->