user can now duplicate one budget object onto another

Author: matthiaswh

src/app/budgets/components/CreateUpdateBudget.vue

@@ -76,7 +76,20 @@
         </tbody>
         <tfoot>
           <tr>
-            <td></td>
+            <td>
+              Copy entire budget from:
+              <select
+                class="select"
+                @change="processDuplicateBudget($event.target.value)"
+              >
+                <option
+                  v-for="value, key in budgets"
+                  :value="key"
+                >
+                  {{ value.month | moment }}
+                </option>
+              </select>
+            </td>
             <td>${{ selectedBudget.budgeted }}</td>
             <td>${{ selectedBudget.spent }}</td>
             <td>${{ selectedBudget.budgeted - selectedBudget.spent }}</td>
@@ -92,11 +105,12 @@
 </template>
 
 <script>
-import { mapActions, mapGetters } from 'vuex';
+import { mapActions, mapGetters, mapState } from 'vuex';
 import Datepicker from 'vuejs-datepicker';
 
 import CreateUpdateBudgetCategory from './CreateUpdateBudgetCategory';
 import BudgetCategory from './BudgetCategory';
+import { moment } from '../../../filters';
 
 export default {
   name: 'budget-create-edit-view',
@@ -111,10 +125,15 @@ export default {
     return {
       selectedBudget: {},
       editing: false,
-      activeBudgetCategory: null
+      activeBudgetCategory: null,
+      lastBudget: null
     };
   },
 
+  filters: {
+    moment
+  },
+
   mounted () {
     if ('budgetId' in this.$route.params) {
       this.loadBudgets().then(() => {
@@ -125,6 +144,7 @@ export default {
         }
       });
     }
+    this.lastBudget = this.getBudgetById('d0862d23-e433-bb30-6088-09f0e2f9f221');
   },
 
   methods: {
@@ -133,7 +153,8 @@ export default {
       'updateBudget',
       'loadBudgets',
       'createBudgetCategory',
-      'updateBudgetCategory'
+      'updateBudgetCategory',
+      'duplicateBudget'
     ]),
 
     resetAndGo () {
@@ -189,14 +210,29 @@ export default {
 
     budgetCategoryComponent (budgetCategory) {
       return this.activeBudgetCategory && this.activeBudgetCategory === budgetCategory ? 'create-update-budget-category' : 'budget-category';
+    },
+
+    processDuplicateBudget (budgetId) {
+      if (confirm('Are you sure you want to duplicate this budget? Doing this will overwrite all existing data for this month (transaction data will NOT be erased).')) {
+        this.duplicateBudget({
+          budget: this.selectedBudget,
+          baseBudget: this.getBudgetById(budgetId)
+        }).then((budget) => {
+          this.selectedBudget = budget;
+        });
+      }
     }
   },
 
   computed: {
     ...mapGetters([
       'getBudgetById',
       'getCategoryById'
-    ])
+    ]),
+
+    ...mapState({
+      'budgets': state => state.budgets.budgets
+    })
   }
 };
 </script>

src/app/budgets/vuex/actions.js

@@ -40,6 +40,44 @@ export const updateBudget = ({ commit, state }, data) => {
   saveBudget(data);
 };
 
+export const duplicateBudget = ({ commit, dispatch, getters, state }, data) => {
+  /*
+  * Expects an existing budget object, budget, and an budget to be copied, baseBudget
+  * Duplicates all budget categories and budgeted amounts to the new budget
+   */
+  if (!(data.budget && data.baseBudget)) return Promise.reject(new Error('Incorrect data sent to duplicateBudget'));
+
+  // clone our object in case we received something from the store
+  let budget = Object.assign({}, data.budget);
+
+  // let's reset some information first
+  budget.budgeted = 0;
+  budget.budgetCategories = null;
+  // note that we don't reset the spent or income because we aren't
+  // changing any transactions, which are what determine those values
+
+  commit('UPDATE_BUDGET', { budget: budget });
+
+  budget = getters.getBudgetById(budget.id);
+
+  if ('budgetCategories' in data.baseBudget) {
+    Object.keys(data.baseBudget.budgetCategories).forEach((key) => {
+      dispatch('createBudgetCategory', {
+        budget: budget,
+        budgetCategory: {
+          category: data.baseBudget.budgetCategories[key].category,
+          budgeted: data.baseBudget.budgetCategories[key].budgeted,
+          spent: 0 // TODO: grab this value when we have transactions!
+        }
+      });
+    });
+  }
+
+  saveBudget(budget);
+
+  return budget;
+};
+
 export const loadBudgets = ({ state, commit }) => {
   if (!state.budgets || Object.keys(state.budgets).length === 0) {
     return fetchBudgets().then((res) => {