Save on deletion of budgets/open transactions

rix1337 · Jul 30, 2023 · 4beb8bc · 4beb8bc
1 parent 6f92fc7
commit 4beb8bc
Show file tree

Hide file tree

Showing 6 changed files with 23 additions and 20 deletions.
diff --git a/.github/Changelog.md b/.github/Changelog.md
@@ -11,6 +11,7 @@
 - Simplified Settings
 - Moved settings to floating action button
 - Implemented Datepicker (for Budget validity by month)
+- Show save button on deletion of budgets and open transactions
 - ToDo:
     - Check budget validity calculating remaining budget for the current month in the header
-    - Show save button on modification/check/deletion of balances, budgets and open transactions
+
diff --git a/budgeteer/web_interface/vuejs_frontend/src/App.vue b/budgeteer/web_interface/vuejs_frontend/src/App.vue
@@ -26,6 +26,7 @@ function saveOnLock() {
   saveJSON('budgets')
   saveJSON('open_transactions')
   store.commit('setLocked', true)
+  store.commit('setModifiedWhileLocked', false)
 }
 </script>
 
@@ -34,7 +35,12 @@ function saveOnLock() {
 
   <div class="sticky-bottom float-end">
     <div class="col-md-auto p-1">
-      <button v-if="store.state.locked"
+      <button v-if="store.state.modified_while_locked"
+              class="btn btn-outline-warning bg-dark m-1"
+              type="button"
+              @click="saveOnLock()"><i class="bi bi-save"/>
+      </button>
+      <button v-else-if="store.state.locked"
               class="btn btn-outline-success bg-dark m-1"
               type="button"
               @click="store.commit('setLocked', false)"><i class="bi bi-unlock"/>
@@ -52,7 +58,7 @@ function saveOnLock() {
       </button>
 
       <button aria-controls="offcanvasBottomSettings"
-              class="btn btn-outline-primary bg-dark m-2"
+              class="btn btn-outline-primary bg-dark m-1"
               data-bs-target="#offcanvasBottomSettings"
               data-bs-toggle="offcanvas"
               type="button"

diff --git a/budgeteer/web_interface/vuejs_frontend/src/components/Budgets.vue b/budgeteer/web_interface/vuejs_frontend/src/components/Budgets.vue
@@ -72,11 +72,9 @@ function checkEntryInDisplayMonth(entry) {
         <div class="card text-center shadow my-3">
           <div class="card-header">
             <h1>
-              <i class="bi bi-currency-euro"/> Budgets {{ display_month }}
-            </h1>
-            <div class="col-md-auto p-1">
+              <i class="bi bi-receipt-cutoff"/> Budgets {{ display_month }}
               <button :disabled="display_month_index <= 0"
-                      class="btn btn-outline-primary"
+                      class="btn btn-outline-primary m-1"
                       type="button"
                       @click="updateDisplayMonth(-1)">
                 <i class="bi bi-arrow-left"/>
@@ -87,6 +85,9 @@ function checkEntryInDisplayMonth(entry) {
                       @click="updateDisplayMonth(1)">
                 <i class="bi bi-arrow-right"/>
               </button>
+            </h1>
+            <div class="col-md-auto p-1">
+
             </div>
           </div>
           <div class="card-body">
@@ -164,7 +165,7 @@ function checkEntryInDisplayMonth(entry) {
                                 v-if="displayMonthIsCurrentMonth() && store.state.locked && !store.state.data.budgets[category_index].entries[entry_index].booked"
                                 class="btn btn-outline-success"
                                 type="button"
-                                @click="store.state.data.budgets[category_index].entries[entry_index].booked = true">
+                                @click="store.state.data.budgets[category_index].entries[entry_index].booked = true; store.commit('setModifiedWhileLocked', true)">
                               <i class="bi bi-check"/>
                             </button>
                           </div>
@@ -178,7 +179,6 @@ function checkEntryInDisplayMonth(entry) {
                       </button>
                     </div>
                   </div>
-
                 </div>
               </div>
               <div class="row justify-content-center mt-2">

diff --git a/budgeteer/web_interface/vuejs_frontend/src/components/Head.vue b/budgeteer/web_interface/vuejs_frontend/src/components/Head.vue
@@ -96,17 +96,10 @@ const current_month = ref(
       <div class="col-md-10 offset-md-1">
         <div class="card text-center shadow my-3">
           <div class="card-header">
-            <h1>
-              <i class="bi bi-cash-coin"/> BudgeTeer
-            </h1>
-            <p>Projekt von
-              <a href="https://github.com/rix1337/BudgeTeer/releases/latest" target="_blank">RiX</a> {{ version }}
-              <span v-if="update"> (Update verfügbar!)</span>
-            </p>
+              <h1><i class="bi-cash-coin"/> Restbudget {{ current_month }}: {{ current_budget }} €</h1>
           </div>
           <div class="card-body">
             <div class="row justify-content-center mt-2">
-              <h2>Restbudget {{ current_month }}: {{ current_budget }} €</h2>
               <div class="row justify-content-center mt-2">
                 <div v-for="(item, index) in store.state.data.balances" :key="item" class="balance">
                   <div class="input-group">

diff --git a/budgeteer/web_interface/vuejs_frontend/src/components/Transactions.vue b/budgeteer/web_interface/vuejs_frontend/src/components/Transactions.vue
@@ -52,11 +52,11 @@ store.commit('getOpenTransactions')
                   </div>
                   <div class="input-group-append">
                     <button
-                        class="btn btn-outline-success"
+                        class="btn btn-outline-danger"
                         type="button"
-                        @click="store.state.data.open_transactions.splice(index, 1)"
+                        @click="store.state.data.open_transactions.splice(index, 1) && store.commit('setModifiedWhileLocked', true)"
                     >
-                      <i class="bi bi-check"/>
+                      <i class="bi bi-trash3"/>
                     </button>
                   </div>
                 </div>

diff --git a/budgeteer/web_interface/vuejs_frontend/src/main.js b/budgeteer/web_interface/vuejs_frontend/src/main.js
@@ -23,6 +23,7 @@ const store = createStore({
                 budgets: []
             },
             locked: true,
+            modified_while_locked: false,
             settings: {},
             misc: {
                 loaded_settings: false,
@@ -68,6 +69,8 @@ const store = createStore({
             state.misc.docker = docker
         }, setLocked(state, locked) {
             state.locked = locked
+        }, setModifiedWhileLocked(state, locked) {
+            state.modified_while_locked = locked
         }
     }
 })