diff options
| -rw-r--r-- | src/index.html | 47 | ||||
| -rw-r--r-- | src/index.js | 18 | ||||
| -rw-r--r-- | src/main.js | 32 | ||||
| -rw-r--r-- | src/server.js | 23 |
4 files changed, 97 insertions, 23 deletions
diff --git a/src/index.html b/src/index.html index 08c5007..cba242d 100644 --- a/src/index.html +++ b/src/index.html @@ -16,20 +16,21 @@ <div id="data"> <h1 v-if="summary.username">{{summary.username}}'s budget</h1> <div> - <button v-bind:class="{ bold: activeTab == 0 }" v-on:click="setTab(0)">Ledger</button> - <button v-bind:class="{ bold: activeTab == 1 }" v-on:click="setTab(1)">Summary</button> - <button v-bind:class="{ bold: activeTab == 2 }" v-on:click="setTab(2)">Goals</button> + <button v-bind:class="{ bold: activeTab == 'ledger' }" v-on:click="setTab('ledger')">Ledger</button> + <button v-bind:class="{ bold: activeTab == 'summary' }" v-on:click="setTab('summary')">Summary</button> + <button v-bind:class="{ bold: activeTab == 'goals' }" v-on:click="setTab('goals')">Goals</button> + <button v-bind:class="{ bold: activeTab == 'expected' }" v-on:click="setTab('expected')">Expected</button> </div> <!-- Ledger --> - <div v-if="activeTab == 0"> + <div v-if="activeTab == 'ledger'"> <div class="newItem"> <input v-model="m.when" placeholder="Date" type="date"> <input v-model="m.where" placeholder="Where"> <input v-model="m.amount" placeholder="Amount" type="number" step="0.01"> <input v-model="m.category" placeholder="Category"> <input v-model="m.subcategory" placeholder="Subcategory"> - <button v-on:click="post(m, '/transaction')">Add</button> + <button v-on:click="post(m, '/transaction', 'transactions')">Add</button> </div> <table class="table"> <tr class="table-header"> @@ -50,14 +51,14 @@ <td>{{transaction.subcategory}}</td> <td> <button v-on:click="prepareEntryEdit(transaction)">⚙</button> - <button v-on:click="remove(transaction)">X</button> + <button v-on:click="remove(transaction, 'transactions')">X</button> </td> </tr> </table> </div> - <table v-if="activeTab == 10"> + <table v-if="activeTab == 'ledger-edit'"> <tr> <th></th> <th>Date</th> @@ -83,12 +84,12 @@ <td> <input v-model="em.subcategory" placeholder="Subcategory"> </td> - <td><button v-on:click="updateMany(em);activeTab=0;">Update</button></td> + <td><button v-on:click="updateMany(em, 'transactions');activeTab=0;">Update</button></td> </tr> </table> <!-- Summary --> - <div v-if="activeTab == 1"> + <div v-if="activeTab == 'summary'"> <div class="summary-panel"> <h2>Weekly</h2> <table class="table"> @@ -150,13 +151,13 @@ </div> <!-- Goals --> - <div v-if="activeTab == 2"> + <div v-if="activeTab == 'goals'"> <div> <div class="newItem"> <span>New Goal</span> <input v-model="ng.name" placeholder="Name"> <input v-model="ng.total" placeholder="Total" type="number" step="0.01"> - <button v-on:click="post(ng, '/goals')">Add</button> + <button v-on:click="post(ng, '/goals', 'goals')">Add</button> </div> <div class="newAllocation"> <span>Allocate funds</span> @@ -167,7 +168,7 @@ <input v-model="na.amount" type="number"> <span>out of {{total_to_allocate}}</span> </select> - <button v-on:click="post(na, '/allocate')">Add</button> + <button v-on:click="post(na, '/allocate', 'goals')">Add</button> </div> <table> <tr><th></th><th>Name</th><th>Amount</th><th>Total</th><th>Remaining</th></tr> @@ -181,6 +182,28 @@ </table> </div> </div> + + <!-- Expected --> + <div v-if="activeTab == 'expected'"> + <div> + <div class="newItem"> + <span>New Expected</span> + <input v-model="e.name" placeholder="Name"> + <input v-model="e.total" placeholder="Total" type="number" step="0.01"> + <input v-model="e.days" placeholder="Period (days)" type="number" step="1"> + <button v-on:click="post(e, '/expected', 'expected')">Add</button> + </div> + <table> + <tr><th></th><th>Name</th><th>Total</th><th>Period</th></tr> + <tr v-for="(e, i) in expected"> + <td class="table-index">{{i+1}}</td> + <td>{{e.name}}</td> + <td>{{e.total}}</td> + <td>{{e.days}}</td> + </tr> + </table> + </div> + </div> </div> </body> diff --git a/src/index.js b/src/index.js index bf64586..0cbba31 100644 --- a/src/index.js +++ b/src/index.js @@ -90,6 +90,24 @@ function setUpModels() { allowNull: false, } }), + "expected": database.define('expected', { + username: { + type: Sequelize.STRING, + allowNull: false, + }, + name: { + type: Sequelize.STRING, + allowNull: false, + }, + total: { + type: Sequelize.DECIMAL, + allowNull: false, + }, + days: { + type: Sequelize.INTEGER, + allowNull: false, + } + }), "users": database.define('user', { username: { type: Sequelize.STRING, diff --git a/src/main.js b/src/main.js index 78b918e..0a381b0 100644 --- a/src/main.js +++ b/src/main.js @@ -2,12 +2,13 @@ window.onload = function () { var transactionData = new Vue({ el: '#data', data: { - activeTab: 0, + activeTab: "ledger", transactions: [], summary: {username : ""}, selTodoType: "all", total_to_allocate: 0, - goals: [] + goals: [], + expected: [] }, methods: { setTab: function (value) { @@ -33,17 +34,24 @@ window.onload = function () { total: "", amount: 0 } + this.e = { + name: "", + total: "", + days: 7 + } this.na = { selected: "", amount: "" } }, - requestThenUpdate: function (request) { + requestThenUpdate: function (request, app, field) { fetch(request) .then(response => response.json()) - .then(response => this.transactions = response); + .then(response => { + app[field] = response + }); }, - post: function (obj, path) { + post: function (obj, path, save_to) { console.log(obj); console.log(path); this.requestThenUpdate(new Request(path, { @@ -53,10 +61,10 @@ window.onload = function () { 'Content-Type': 'application/json' }, body: JSON.stringify(obj) - })); + }), this, save_to); this.clearData(); }, - remove: function (obj) { + remove: function (obj, save_to) { if (confirm(`Delete transaction?`)) { this.requestThenUpdate(new Request("/transaction", { method: 'delete', @@ -65,7 +73,7 @@ window.onload = function () { 'Content-Type': 'application/json' }, body: JSON.stringify(obj) - })) + }), this, save_to) } }, prepareEntryEdit: function(transaction){ @@ -75,9 +83,9 @@ window.onload = function () { this.em.amount=transaction.amount; this.em.category=transaction.category; this.em.subcategory=transaction.subcategory; - this.activeTab=10; + this.activeTab='ledger-edit'; }, - updateMany: function (obj) { + updateMany: function (obj, save_to) { update = {} update = obj; this.requestThenUpdate(new Request("/transaction", { @@ -87,11 +95,13 @@ window.onload = function () { 'Content-Type': 'application/json' }, body: JSON.stringify({ id: obj.id, update: update }) - })) + }), this, save_to) }, }, created() { this.clearData(); + fetch(new Request(`/expected`)).then(response => response.json()) + .then(response => this.expected = response); fetch(new Request(`/goals`)).then(response => response.json()) .then(response => this.goals = response); fetch(new Request(`/transaction`)).then(response => response.json()) diff --git a/src/server.js b/src/server.js index 69d3968..f72f21b 100644 --- a/src/server.js +++ b/src/server.js @@ -163,6 +163,29 @@ function setUpRoutes(models, jwtFunctions, database) { res.status(400).send(e.message); } }) + server.get(`/expected`, async (req, res, next) => { + try { + var result = await database.query("SELECT * FROM expecteds WHERE username = '" + res.locals.user.username + "' ORDER BY `name` DESC", { type: database.QueryTypes.SELECT }) + res.status(200).send(result); + next(); + } catch (e) { + console.log(e) + res.status(400).send(e.message); + } + }) + server.post(`/expected`, async (req, res, next) => { + try { + let item = req.body; + console.log(item); + item.username = res.locals.user.username + await models.expected.create(item); + var result = await database.query("SELECT * FROM expecteds WHERE username = '" + res.locals.user.username + "' ORDER BY `name` DESC", { type: database.QueryTypes.SELECT }) + res.status(200).send(result); + } catch (e) { + console.log(e); + res.status(400).send(e.message); + } + }) server.get(`/summary`, async (req, res, next) => { try { res.status(200).send({ |