Implement budgeting

web/src/components/BudgetingCategory.vue

@@ -1,24 +1,20 @@
 <script lang="ts" setup>
-import { computed, ref } from 'vue';
-import { POST } from '../api';
-import { useBudgetsStore } from '../stores/budget';
+import { computed, ref, watch } from 'vue';
 import { useAccountStore } from '../stores/budget-account';
-import { Category } from '../stores/category';
+import { Category, useCategoryStore } from '../stores/category';
 import Currency from './Currency.vue'
 import Input from './Input.vue';
 
 const props = defineProps<{category:Category, year: number, month: number}>()
 
 const assigned = ref(props.category.Assigned);
+watch(() => props.category.Assigned, () =>{ assigned.value = props.category.Assigned});
 
 const accountStore = useAccountStore();
-
-const budgetsStore = useBudgetsStore();
-const CurrentBudgetID = computed(() => budgetsStore.CurrentBudgetID);
+const categoryStore = useCategoryStore();
 
 function assignedChanged(_e : Event, category : Category){
-  POST("/budget/"+CurrentBudgetID.value+"/category/" + category.ID + "/" + props.year + "/" + (props.month+1),
-    JSON.stringify({Assigned: assigned.value}));
+  categoryStore.SetAssigned(category, props.year, props.month, assigned.value);
 }
 </script>
 

web/src/components/BudgetingCategoryGroup.vue

@@ -9,16 +9,16 @@ import CreateCategory from '../dialogs/CreateCategory.vue';
 const props = defineProps<{group: CategoryGroup, year: number, month: number}>();
 
 const categoryStore = useCategoryStore();
-const categoriesForGroup = categoryStore.GetCategoriesForGroup(props.group);
+const categoriesForGroup = computed(() => categoryStore.GetCategoriesForGroup(props.group));
 
 const expanded = ref(true)
 function toggleGroup() {
     expanded.value = !expanded.value;
 }
 
-const availableLastMonth = computed(() => categoriesForGroup.reduce((prev, current) => prev + current.AvailableLastMonth, 0))
-const assigned = computed(() => categoriesForGroup.reduce((prev, current) => prev + current.Assigned, 0))
-const activity = computed(() => categoriesForGroup.reduce((prev, current) => prev + current.Activity, 0))
+const availableLastMonth = computed(() => categoriesForGroup.value.reduce((prev, current) => prev + current.AvailableLastMonth, 0))
+const assigned = computed(() => categoriesForGroup.value.reduce((prev, current) => prev + current.Assigned, 0))
+const activity = computed(() => categoriesForGroup.value.reduce((prev, current) => prev + current.Activity, 0))
 const available = computed(() => activity.value+assigned.value+availableLastMonth.value);
 </script>
 

web/src/stores/budget.ts

@@ -41,9 +41,13 @@ export const useBudgetsStore = defineStore("budget", {
             sessionStore.Budgets.set(response.ID, response);
         },
         async SetCurrentBudget(budgetid: string): Promise<void> {
+            if(this.CurrentBudgetID == budgetid)
+              return;
+
             this.CurrentBudgetID = budgetid;
 
-            if (budgetid == null) return;
+            if (budgetid == null)
+              return;
 
             await this.FetchBudget(budgetid);
         },

web/src/stores/category.ts

@@ -49,5 +49,11 @@ export const useCategoryStore = defineStore("category", {
         this.Categories.set(category.ID, category);
       }
     },
+    async SetAssigned(category : Category, year : number, month : number, assigned : number){
+      this.Categories.get(category.ID)!.Assigned = assigned;
+      const currentBudgetID = useBudgetsStore().CurrentBudgetID;
+      await POST("/budget/"+currentBudgetID+"/category/" + category.ID + "/" + year + "/" + (month+1),
+        JSON.stringify({Assigned: assigned}));
+    }
   },
 });

web/src/stores/transactions.ts

@@ -130,18 +130,15 @@ export const useTransactionsStore = defineStore("budget/transactions", {
             const recTrans = response.ReconciliationTransaction;
             if (recTrans) {
                 this.AddTransactions([recTrans]);
-                account.Transactions.unshift(recTrans.ID);
             }
         },
         logout() {
             this.$reset();
         },
         async saveTransaction(payload: string) {
-            const accountsStore = useAccountStore();
             const result = await POST("/transaction/new", payload);
             const response = (await result.json()) as Transaction;
             this.AddTransactions([response]);
-            accountsStore.CurrentAccount?.Transactions.unshift(response.ID);
         },
         async editTransaction(transactionid: string, payload: string) {
             const result = await POST("/transaction/" + transactionid, payload);