Allow limiting transactions in list

Signed-off-by: William Brawner <me@wbrawner.com>
This commit is contained in:
William Brawner 2020-03-15 20:44:27 -06:00
parent 56fd56dc7a
commit 604fe5da33
2 changed files with 16 additions and 13 deletions

View file

@ -27,7 +27,7 @@
</div>
<div class="card transactions">
<h3>Recent Transactions</h3>
<TransactionList :budget-id="budget.id"></TransactionList>
<TransactionList :budget-id="budget.id" :limit="5"></TransactionList>
</div>
</div>
</div>

View file

@ -19,26 +19,29 @@ import { mapGetters, mapState } from "vuex";
export default {
name: "transaction-list",
components: {
},
components: {},
props: {
budgetId: Number,
categoryId: Number,
limit: Number
},
computed: {
...mapState(["transactions", "currentTransaction"]),
filteredTransactions: function(state) {
return state.transactions.filter(function(transaction) {
console.log(transaction.date)
if (state.budgetId) {
return transaction.budgetId === state.budgetId
}
if (state.categoryId) {
return transaction.categoryId === state.categoryId
}
return false
const transactions = state.transactions.filter(function(transaction) {
if (state.budgetId) {
return transaction.budgetId === state.budgetId;
}
);
if (state.categoryId) {
return transaction.categoryId === state.categoryId;
}
return false;
});
if (this.limit) {
return transactions.slice(0, this.limit);
} else {
return transactions;
}
}
},
methods: {