jacob1123/budgeteer
1
1
Fork 0
Code Issues 12 Pull Requests 1 Packages Releases 1 Wiki Activity

Replace modelValue by models for id and name

Browse Source
This commit is contained in:
Jan Bader
2022-02-25 21:09:31 +00:00
parent a452482381
commit be3829baf8
4 changed files with 32 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
web/src/components/TransactionEditRow.vue
View File

@@ -1,54 +1,49 @@
<script lang="ts" setup>
import { computed, ref } from "vue";
import Autocomplete, { Suggestion } from './Autocomplete.vue'
import { Transaction, useAccountStore } from '../stores/budget-account'
import { computed } from "vue";
import Autocomplete from './Autocomplete.vue'
import { useAccountStore } from '../stores/budget-account'
const props = defineProps<{
transaction: Transaction
transactionid: string
}>()
const TransactionDate = ref(props.transaction.Date.substring(0, 10));
const Payee = ref<Suggestion | undefined>({ID: "", Name: props.transaction.Payee});
const Category = ref<Suggestion | undefined>({ID: "", Name: props.transaction.Category});
const Memo = ref(props.transaction.Memo);
const Amount = ref(props.transaction.Amount);
const accountStore = useAccountStore();
const Transaction = accountStore.Transactions.get(props.transactionid)!;
const payload = computed(() => JSON.stringify({
date: TransactionDate.value,
payee: Payee.value,
category: Category.value,
memo: Memo.value,
amount: Amount.value,
date: Transaction.Date,
payee: Transaction.Payee,
category: Transaction.Category,
memo: Transaction.Memo,
amount: Transaction.Amount,
state: "Uncleared"
}));
const accountStore = useAccountStore();
function saveTransaction(e: MouseEvent) {
e.preventDefault();
console.log(props.transaction);
//accountStore.saveTransaction(payload.value);
accountStore.saveTransaction(payload.value);
}
</script>
<template>
<tr>
<td style="width: 90px;" class="text-sm">
<input class="border-b-2 border-black" type="date" v-model="TransactionDate" />
<input class="border-b-2 border-black" type="date" v-model="Transaction.Date" />
</td>
<td style="max-width: 150px;">
<Autocomplete v-model="Payee" type="payees" />
<Autocomplete v-model:text="Transaction.Payee" v-model:id="Transaction.PayeeID" type="payees" />
</td>
<td style="max-width: 200px;">
<Autocomplete v-model="Category" type="categories" />
<Autocomplete v-model:text="Transaction.Category" v-model:id="Transaction.CategoryID" type="categories" />
</td>
<td>
<input class="block w-full border-b-2 border-black" type="text" v-model="Memo" />
<input class="block w-full border-b-2 border-black" type="text" v-model="Transaction.Memo" />
</td>
<td style="width: 80px;" class="text-right">
<input
class="text-right block w-full border-b-2 border-black"
type="currency"
v-model="Amount"
v-model="Transaction.Amount"
/>
</td>
<td style="width: 20px;">