From dec1ab53a54d0cf2f5b62566f036e123dd5cfcb2 Mon Sep 17 00:00:00 2001
From: rix1337 <>
Date: Sat, 5 Aug 2023 11:32:57 +0200
Subject: [PATCH] Mark Budgets as booked on monthly basis

---
 .github/Changelog.md                          |  2 +-
 .../vuejs_frontend/src/components/Budgets.vue | 27 ++++++++++---------
 .../vuejs_frontend/src/components/Head.vue    |  7 +++--
 .../web_interface/vuejs_frontend/src/main.js  |  4 +++
 budgeteer/web_interface/web_server.py         |  7 -----
 5 files changed, 23 insertions(+), 24 deletions(-)

diff --git a/.github/Changelog.md b/.github/Changelog.md
index 9b408b3..30e57a3 100644
--- a/.github/Changelog.md
+++ b/.github/Changelog.md
@@ -9,8 +9,8 @@
 #### v.0.1.2
 - Fehlerbehebung bei Aktivierung von Basic Auth
 - Die Gültigkeit von künftigen Budgets wird bei deren Berechnung beachtet
+- Budgets können monatlich als gebucht markiert werden
 - ToDo
-  - Mark budgets booked per month (NOT GLOBALLY)
   - Add Yearly budget type (select month only for validity)
   - Add Weekly budget type
     - calculate weeks of month automatically
diff --git a/budgeteer/web_interface/vuejs_frontend/src/components/Budgets.vue b/budgeteer/web_interface/vuejs_frontend/src/components/Budgets.vue
index 2454cee..58cc4d6 100644
--- a/budgeteer/web_interface/vuejs_frontend/src/components/Budgets.vue
+++ b/budgeteer/web_interface/vuejs_frontend/src/components/Budgets.vue
@@ -27,23 +27,22 @@ function calculateCategoryTotal(i) {
 }
 
 function displayMonthIsCurrentMonth() {
-  let check_display_month = new Date(display_month.value)
+  let check_display_month = new Date(store.state.display_month)
   let check_current_month = new Date()
   return check_display_month.getMonth() === check_current_month.getMonth() && check_display_month.getFullYear() === check_current_month.getFullYear()
 }
 
-const display_month = ref(new Date().toISOString().slice(0, 7))
 const display_month_index = ref(0)
 
 function updateDisplayMonth(index) {
   display_month_index.value += index
   let indexed_date = new Date().setMonth(new Date().getMonth() + display_month_index.value)
-  display_month.value = new Date(indexed_date).toISOString().slice(0, 7)
+  store.commit('setDisplayMonth', new Date(indexed_date).toISOString().slice(0, 7))
 }
 
 function calculateEntry(entry) {
   if (displayMonthIsCurrentMonth()) {
-    return !entry.booked && checkEntryInDisplayMonth(entry)
+    return !checkEntryBookedThisMonth(entry) && checkEntryInDisplayMonth(entry)
   } else {
     return checkEntryInDisplayMonth(entry)
   }
@@ -51,14 +50,14 @@ function calculateEntry(entry) {
 
 function showEntry(entry) {
   if (store.state.locked && displayMonthIsCurrentMonth()) {
-    return !entry.booked && checkEntryInDisplayMonth(entry)
+    return !checkEntryBookedThisMonth(entry) && checkEntryInDisplayMonth(entry)
   } else {
     return entry
   }
 }
 
 function checkEntryInDisplayMonth(entry) {
-  let current_month = new Date(display_month.value)
+  let current_month = new Date(store.state.display_month)
   let valid_from = new Date("1970-01-01")
   let valid_to = new Date("2100-01-01")
 
@@ -71,6 +70,10 @@ function checkEntryInDisplayMonth(entry) {
 
   return current_month >= valid_from && current_month <= valid_to
 }
+
+function checkEntryBookedThisMonth(entry) {
+  return entry.booked === store.state.display_month
+}
 </script>
 
 <template>
@@ -80,7 +83,7 @@ function checkEntryInDisplayMonth(entry) {
         <div class="card text-center shadow my-3">
           <div class="card-header">
             <h1>
-              <i class="bi bi-receipt-cutoff"/> Budgets {{ display_month }}
+              <i class="bi bi-receipt-cutoff"/> Budgets {{ store.state.display_month }}
               <button :disabled="display_month_index <= 0"
                       class="btn btn-outline-primary m-1"
                       type="button"
@@ -149,10 +152,10 @@ function checkEntryInDisplayMonth(entry) {
                           </div>
                           <div v-if="!store.state.locked" class="input-group-append">
                             <button
-                                v-if="displayMonthIsCurrentMonth() && store.state.data.budgets[category_index].entries[entry_index].booked"
+                                v-if="displayMonthIsCurrentMonth() && checkEntryBookedThisMonth(store.state.data.budgets[category_index].entries[entry_index])"
                                 class="btn btn-outline-danger"
                                 type="button"
-                                @click="store.state.data.budgets[category_index].entries[entry_index].booked = false">
+                                @click="store.state.data.budgets[category_index].entries[entry_index].booked = ''">
                               <i class="bi bi-x"/>
                             </button>
                             <button
@@ -185,10 +188,10 @@ function checkEntryInDisplayMonth(entry) {
                           </div>
                           <div class="input-group-append">
                             <button
-                                v-if="displayMonthIsCurrentMonth() && store.state.locked && !store.state.data.budgets[category_index].entries[entry_index].booked"
+                                v-if="displayMonthIsCurrentMonth() && store.state.locked && !checkEntryBookedThisMonth(store.state.data.budgets[category_index].entries[entry_index])"
                                 class="btn btn-outline-success"
                                 type="button"
-                                @click="store.commit('setModifiedWhileLocked', true); store.state.data.budgets[category_index].entries[entry_index].booked = true">
+                                @click="store.commit('setModifiedWhileLocked', true); store.state.data.budgets[category_index].entries[entry_index].booked = store.state.display_month">
                               <i class="bi bi-check"/>
                             </button>
                           </div>
@@ -197,7 +200,7 @@ function checkEntryInDisplayMonth(entry) {
                       <button v-if="!store.state.locked"
                               class="btn btn-outline-primary"
                               type="button"
-                              @click="store.state.data.budgets[category_index].entries.push({label:'',amount:'', valid_from_to: [null, null], booked: false})"
+                              @click="store.state.data.budgets[category_index].entries.push({label:'',amount:'', valid_from_to: [null, null], booked: ''})"
                       > Eintrag hinzufügen
                       </button>
                     </div>
diff --git a/budgeteer/web_interface/vuejs_frontend/src/components/Head.vue b/budgeteer/web_interface/vuejs_frontend/src/components/Head.vue
index c9ecefd..c60f894 100644
--- a/budgeteer/web_interface/vuejs_frontend/src/components/Head.vue
+++ b/budgeteer/web_interface/vuejs_frontend/src/components/Head.vue
@@ -7,7 +7,6 @@ const store = useStore()
 store.commit('getBalances')
 
 const current_budget = computed({
-  // getter
   get() {
     let transactions_total_amount = 0
     for (let i = 0; i < store.state.data.open_transactions.length; i++) {
@@ -40,8 +39,8 @@ const current_budget = computed({
 })
 
 function checkEntryInDisplayMonthAndNotBooked(entry) {
-  if (!entry.booked) {
-    let current_month = new Date()
+  if (entry.booked !== store.state.display_month) {
+    let today = new Date()
     let valid_from = new Date("1970-01-01")
     let valid_to = new Date("2100-01-01")
 
@@ -52,7 +51,7 @@ function checkEntryInDisplayMonthAndNotBooked(entry) {
       valid_to = new Date(entry.valid_from_to[1])
     }
 
-    return current_month >= valid_from && current_month <= valid_to
+    return today >= valid_from && today <= valid_to
   }
   return false
 }
diff --git a/budgeteer/web_interface/vuejs_frontend/src/main.js b/budgeteer/web_interface/vuejs_frontend/src/main.js
index 8bfb68e..9150611 100644
--- a/budgeteer/web_interface/vuejs_frontend/src/main.js
+++ b/budgeteer/web_interface/vuejs_frontend/src/main.js
@@ -22,6 +22,7 @@ const store = createStore({
                 open_transactions: [],
                 budgets: []
             },
+            display_month: new Date().toISOString().slice(0, 7),
             locked: true,
             modified_while_locked: false,
             settings: {},
@@ -31,6 +32,9 @@ const store = createStore({
             }
         }
     }, mutations: {
+        setDisplayMonth(state, month) {
+            state.display_month = month
+        },
         getSettings(state) {
             axios.get('api/settings/')
                 .then(function (res) {
diff --git a/budgeteer/web_interface/web_server.py b/budgeteer/web_interface/web_server.py
index 39aa2f9..1667795 100644
--- a/budgeteer/web_interface/web_server.py
+++ b/budgeteer/web_interface/web_server.py
@@ -167,16 +167,9 @@ def to_int(i):
         i = str(i).strip().replace("None", "")
         return int(i) if i else ""
 
-    def to_float(i):
-        i = str(i).strip().replace("None", "")
-        return float(i) if i else ""
-
     def to_str(i):
         return '' if i is None else str(i)
 
-    def to_bool(i):
-        return True if i == "True" else False
-
     @app.get(prefix + "/api/settings/")
     @auth_basic(is_authenticated_user)
     def get_settings():