rough migration to material design inputs
This commit is contained in:
parent
17531f7c29
commit
f711ab6f74
3 changed files with 63 additions and 123 deletions
|
|
@ -1,9 +1,16 @@
|
|||
import {Component, computed, signal} from '@angular/core';
|
||||
import {Category, CategoryService} from '../../services/category.service';
|
||||
import {Merchant, MerchantService} from '../../services/merchant.service';
|
||||
import { Tag } from '../../services/tag.service';
|
||||
import {form, FormField} from '@angular/forms/signals';
|
||||
import {MatCard, MatCardContent, MatCardHeader, MatCardTitle} from '@angular/material/card';
|
||||
import { Component, computed, signal } from '@angular/core';
|
||||
import { CategoryService } from '../../services/category.service';
|
||||
import { MerchantService } from '../../services/merchant.service';
|
||||
import { Tag, TagService } from '../../services/tag.service';
|
||||
import { form, FormField } from '@angular/forms/signals';
|
||||
import { MatCardModule } from '@angular/material/card';
|
||||
import { MatInputModule } from '@angular/material/input';
|
||||
import { MatDatepickerModule } from '@angular/material/datepicker';
|
||||
import { MatFormFieldModule } from '@angular/material/form-field';
|
||||
import { MatAutocompleteModule } from '@angular/material/autocomplete';
|
||||
import { MatSelectModule } from '@angular/material/select';
|
||||
import { MatButtonModule } from '@angular/material/button';
|
||||
import { provideNativeDateAdapter } from '@angular/material/core';
|
||||
|
||||
interface AddExpenseForm {
|
||||
date: Date,
|
||||
|
|
@ -16,19 +23,15 @@ interface AddExpenseForm {
|
|||
|
||||
@Component({
|
||||
selector: 'app-add-expense',
|
||||
imports: [
|
||||
FormField,
|
||||
MatCard,
|
||||
MatCardHeader,
|
||||
MatCardTitle,
|
||||
MatCardContent
|
||||
],
|
||||
imports: [MatDatepickerModule, MatFormFieldModule, MatInputModule, MatCardModule, MatAutocompleteModule, MatSelectModule, MatButtonModule, FormField],
|
||||
providers: [provideNativeDateAdapter()],
|
||||
templateUrl: './add-expense.component.html',
|
||||
styleUrl: './add-expense.component.scss',
|
||||
})
|
||||
export class AddExpenseComponent {
|
||||
protected categories = computed(() => this.categoryService.categories());
|
||||
protected merchants = computed(() => this.merchantService.merchants());
|
||||
protected tags = computed(() => this.tagService.tags());
|
||||
private addExpenseModel = signal<AddExpenseForm>({
|
||||
date: new Date(),
|
||||
amount: '',
|
||||
|
|
@ -40,5 +43,6 @@ export class AddExpenseComponent {
|
|||
public expenseForm = form(this.addExpenseModel);
|
||||
|
||||
public constructor(private readonly categoryService: CategoryService,
|
||||
private readonly merchantService: MerchantService) { }
|
||||
private readonly merchantService: MerchantService,
|
||||
private readonly tagService: TagService) { }
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue