Convert frontend to Vue #3
| @@ -1,74 +0,0 @@ | ||||
| import { TITLE } from "../mutation-types"; | ||||
|  | ||||
| const budget = { | ||||
|     state () { | ||||
|         return { | ||||
|                 Accounts: [], | ||||
|                 CurrentAccount: null, | ||||
|                 Categories: [], | ||||
|                 Transactions: [], | ||||
|                 Assignments: [] | ||||
|         } | ||||
|     }, | ||||
|     mutations: { | ||||
|         setAccounts (state, accounts) { | ||||
|             state.Accounts = accounts; | ||||
|         }, | ||||
|         setCurrentAccount(state, account) { | ||||
|             state.CurrentAccount = account; | ||||
|         }, | ||||
|         setTransactions(state, transactions){ | ||||
|             state.Transactions = transactions; | ||||
|         } | ||||
|     }, | ||||
|     getters: { | ||||
|         Accounts(state) { | ||||
|             return state.Accounts || []; | ||||
|         }, | ||||
|         CurrentAccount(state) { | ||||
|             return state.CurrentAccount || {}; | ||||
|         }, | ||||
|         OnBudgetAccounts(state) { | ||||
|             return (state.Accounts || []).filter(x => x.OnBudget); | ||||
|         }, | ||||
|         OffBudgetAccounts(state) { | ||||
|             return (state.Accounts || []).filter(x => !x.OnBudget); | ||||
|         }, | ||||
|         Transactions(state) { | ||||
|             return (state.Transactions || []); | ||||
|         } | ||||
|     }, | ||||
|     actions: { | ||||
|         async fetchBudget ({state, commit, rootState}, budgetid) { | ||||
|             const result = await fetch("/api/v1/budget/" + budgetid, { | ||||
|                 headers: { | ||||
|                     'Authorization': 'Bearer ' + rootState.Session.Token | ||||
|                 } | ||||
|             }); | ||||
|             const response = await result.json(); | ||||
|             return commit("setAccounts", response.Accounts); | ||||
|         }, | ||||
|         async fetchAccount ({state, commit, rootState}, accountid) { | ||||
|             const result = await fetch("/api/v1/account/" + accountid + "/transactions", { | ||||
|                 headers: { | ||||
|                     'Authorization': 'Bearer ' + rootState.Session.Token | ||||
|                 } | ||||
|             }); | ||||
|             const response = await result.json(); | ||||
|             return commit("setTransactions", response.Transactions); | ||||
|         }, | ||||
|         async setCurrentAccount({state, commit, dispatch}, {budgetid, accountid}) { | ||||
|             await dispatch("fetchBudget", budgetid); | ||||
|             for (const element of state.Accounts) { | ||||
|                 if(element.ID != accountid)  | ||||
|                     continue | ||||
|                  | ||||
|                 commit("setCurrentAccount", element); | ||||
|                 commit(TITLE, element.Name); | ||||
|                 break | ||||
|             } | ||||
|         } | ||||
|     } | ||||
| } | ||||
|  | ||||
| export default budget | ||||
| @@ -3,6 +3,11 @@ const dashboard = { | ||||
|         return { | ||||
|             Budgets: [], | ||||
|             CurrentBudget: null, | ||||
|             Accounts: [], | ||||
|             CurrentAccount: null, | ||||
|             Categories: [], | ||||
|             Transactions: [], | ||||
|             Assignments: [] | ||||
|         } | ||||
|     }, | ||||
|     mutations: { | ||||
| @@ -14,6 +19,15 @@ const dashboard = { | ||||
|         }, | ||||
|         setCurrentBudget(state, budget) { | ||||
|             state.CurrentBudget = budget; | ||||
|         }, | ||||
|         setAccounts (state, accounts) { | ||||
|             state.Accounts = accounts; | ||||
|         }, | ||||
|         setCurrentAccount(state, account) { | ||||
|             state.CurrentAccount = account; | ||||
|         }, | ||||
|         setTransactions(state, transactions){ | ||||
|             state.Transactions = transactions; | ||||
|         } | ||||
|     }, | ||||
|     getters: { | ||||
| @@ -22,6 +36,21 @@ const dashboard = { | ||||
|         }, | ||||
|         CurrentBudget(state) { | ||||
|             return state.CurrentBudget || {}; | ||||
|         }, | ||||
|         Accounts(state) { | ||||
|             return state.Accounts || []; | ||||
|         }, | ||||
|         CurrentAccount(state) { | ||||
|             return state.CurrentAccount || {}; | ||||
|         }, | ||||
|         OnBudgetAccounts(state) { | ||||
|             return (state.Accounts || []).filter(x => x.OnBudget); | ||||
|         }, | ||||
|         OffBudgetAccounts(state) { | ||||
|             return (state.Accounts || []).filter(x => !x.OnBudget); | ||||
|         }, | ||||
|         Transactions(state) { | ||||
|             return (state.Transactions || []); | ||||
|         } | ||||
|     }, | ||||
|     actions: { | ||||
| @@ -54,6 +83,35 @@ const dashboard = { | ||||
|                 commit("setCurrentBudget", element); | ||||
|                 break | ||||
|             } | ||||
|         }, | ||||
|         async fetchBudget ({state, commit, rootState}, budgetid) { | ||||
|             const result = await fetch("/api/v1/budget/" + budgetid, { | ||||
|                 headers: { | ||||
|                     'Authorization': 'Bearer ' + rootState.Session.Token | ||||
|                 } | ||||
|             }); | ||||
|             const response = await result.json(); | ||||
|             return commit("setAccounts", response.Accounts); | ||||
|         }, | ||||
|         async fetchAccount ({state, commit, rootState}, accountid) { | ||||
|             const result = await fetch("/api/v1/account/" + accountid + "/transactions", { | ||||
|                 headers: { | ||||
|                     'Authorization': 'Bearer ' + rootState.Session.Token | ||||
|                 } | ||||
|             }); | ||||
|             const response = await result.json(); | ||||
|             return commit("setTransactions", response.Transactions); | ||||
|         }, | ||||
|         async setCurrentAccount({state, commit, dispatch}, {budgetid, accountid}) { | ||||
|             await dispatch("fetchBudget", budgetid); | ||||
|             for (const element of state.Accounts) { | ||||
|                 if(element.ID != accountid)  | ||||
|                     continue | ||||
|                  | ||||
|                 commit("setCurrentAccount", element); | ||||
|                 commit(TITLE, element.Name); | ||||
|                 break | ||||
|             } | ||||
|         } | ||||
|     } | ||||
| } | ||||
|   | ||||
| @@ -1,6 +1,5 @@ | ||||
| import { createStore } from 'vuex' | ||||
| import dashboard from './dashboard/index' | ||||
| import budget from './budget/index' | ||||
| import { LOGIN_SUCCESS, LOGOUT, TITLE } from './mutation-types' | ||||
|  | ||||
| const store = createStore({ | ||||
| @@ -14,7 +13,7 @@ const store = createStore({ | ||||
|     }, | ||||
|     mutations: { | ||||
|         initializeStore(state) { | ||||
|             let store = localStorage.getItem("store"); | ||||
|             const store = localStorage.getItem("store"); | ||||
|             if(store){ | ||||
|                 this.replaceState( | ||||
|                     Object.assign(state, JSON.parse(store)) | ||||
| @@ -32,8 +31,7 @@ const store = createStore({ | ||||
|         } | ||||
|     }, | ||||
|     modules: { | ||||
|         dashboard, | ||||
|         budget | ||||
|         dashboard | ||||
|     } | ||||
| }) | ||||
|  | ||||
|   | ||||
		Reference in New Issue
	
	Block a user