nicd/weekbudget
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Allow setting name when creating budget

Browse source
This commit is contained in:
Mikko Ahlroth 2019-06-12 10:21:40 +03:00
parent 0b62701a0a
commit 24e469213d
2 changed files with 14 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
frontend/src/components/budget-add.ts
View file

@ -4,7 +4,11 @@ import { QRReadEvent } from './budget-qr-reader';
export class JoinBudgetEvent extends CustomEvent<{ uuid: string }> { }
export class CreateBudgetEvent extends CustomEvent<{ amount: number, currency: string }> { }
export class CreateBudgetEvent extends CustomEvent<{
amount: number,
currency: string,
name: string
}> { }
class BudgetAddComponent extends LitElement {
hasCreateError: boolean
@ -32,7 +36,9 @@ class BudgetAddComponent extends LitElement {
const root = this.shadowRoot
const amountInputEl = <HTMLInputElement>root.getElementById('create-budget-amount')
const currencyInputEl = <HTMLInputElement>root.getElementById('create-budget-currency')
const nameInputEl = <HTMLInputElement>root.getElementById('create-budget-name')
const name = nameInputEl.value.trim()
const amount = parseInt(amountInputEl.value)
if (isNaN(amount)) {
this.hasCreateError = true
@ -41,7 +47,7 @@ class BudgetAddComponent extends LitElement {
this.dispatchEvent(new CreateBudgetEvent(
'createBudget',
{ detail: { amount, currency: currencyInputEl.value } }
{ detail: { amount, currency: currencyInputEl.value, name } }
))
amountInputEl.value = ''
@ -77,8 +83,9 @@ class BudgetAddComponent extends LitElement {
return html`
<h2>Create a budget…</h2>
<form @submit=${this.onCreate}>
<input id="create-budget-amount" type="number" required />
<input id="create-budget-currency" type="text" placeholder="Currency (3 chars)" pattern="[A-Z]{3}" required />
<input id="create-budget-name" type="text" placeholder="Name (optional)" />
<input id="create-budget-amount" type="number" placeholder="Amount" required />
<input id="create-budget-currency" type="text" placeholder="Currency (3 chars)" pattern="[A-Z]{3}" maxlength="3" required />
<button type="submit">Create budget</button>
${this.hasCreateError ? html`<p>Could not create budget, check the amount and currency.</p>` : null}
</form>

4
frontend/src/components/week-budget.ts
View file

@ -41,7 +41,9 @@ class WeekBudgetComponent extends LitElement {
try {
const budget = await createBudget(e.detail.amount, e.detail.currency)
const budgetObj = readBudget(budget)
const budgetObj = readBudget(budget).copy()
budgetObj.name = e.detail.name
budgetObj.makeImmutable()
this.budgets = [...this.budgets, budgetObj]
storeToLocal(this.budgets)
}