joe/common-cents-web
1
0
Fork 0
Code Issues 6 Pull requests Projects Releases Packages Wiki Activity Actions

logic for adding expense sucess

Browse source
This commit is contained in:
Joe Arndt 2026-02-22 21:03:32 -06:00
parent 21e3741b21
commit ea4abe4fd6
3 changed files with 60 additions and 23 deletions
Download patch file Download diff file Expand all files Collapse all files

50
src/app/components/expense/expense.component.ts
View file

@ -1,10 +1,11 @@
import { Component, input, model, signal, viewChild } from '@angular/core';
import { MatCardModule } from '@angular/material/card';
import { MatButtonModule } from '@angular/material/button';
import { Expense, ExpenseService } from '../../services/expense.service';
import { CreateExpense, Expense, ExpenseService, UpdateExpense } from '../../services/expense.service';
import { MatIcon } from '@angular/material/icon';
import { ExpenseFormComponent } from './expense-form/expense-form.component';
import { ExpenseForm, ExpenseFormComponent } from './expense-form/expense-form.component';
import { CurrencyPipe, DatePipe } from '@angular/common';
import { Temporal } from '@js-temporal/polyfill';
@Component({
selector: 'app-expense',
@ -18,8 +19,11 @@ export class ExpenseComponent {
public expense = input<Expense>();
public editingExpense = signal(false);
public savingExpense = signal(false);
public formValid = model(false);
public formDirty = model(false);
public formData = model<ExpenseForm>();
public constructor(private readonly expenseService: ExpenseService) { }
@ -28,25 +32,47 @@ export class ExpenseComponent {
}
public async addClick(): Promise<void> {
console.log('Adding new expense');
const form = this.formData()!;
const postExpense: CreateExpense = {
date: new Temporal.PlainDate(form.date.getFullYear(), form.date.getMonth(), form.date.getDate()),
cents: form.cents,
categoryId: form.category.id,
note: !!form.note ? form.note : undefined,
merchantId: !!form.merchant ? form.merchant.id : undefined,
tagIds: form.tags.map(tag => tag.id)
};
await this.expenseService.postExpense(postExpense);
this.resetForm();
}
public resetAddClick(): void {
this.resetForm();
this.resetForm(true);
}
public async updateClick(): Promise<void> {
console.log('Updating expense')
this.editingExpense.set(false);
}
public cancelUpdateClick(): void {
this.editingExpense.set(false);
const form = this.formData()!;
const updateExpense: UpdateExpense = {
id: this.expense()!.id,
date: Temporal.PlainDate.from(form.date.toString()),
cents: form.cents,
categoryId: form.category.id,
note: !!form.note ? form.note : undefined,
merchantId: !!form.merchant ? form.merchant.id : undefined,
tagIds: form.tags.map(tag => tag.id)
};
console.log('update:', updateExpense);
// post update dto
// set expense
this.resetForm();
}
private resetForm(): void {
this.form()?.reset();
public cancelUpdateClick(): void {
this.resetForm();
}
private resetForm(clearDate = false): void {
this.form()?.reset(clearDate);
this.editingExpense.set(false);
}
// const saveExpenseModel = this.expenseModel();