Compare commits
3 Commits
8ca16936a8
...
d8f82bb2d1
| Author | SHA1 | Date | |
|---|---|---|---|
| d8f82bb2d1 | |||
| 390241aa53 | |||
| b323f7a29f |
@@ -22,8 +22,8 @@ export class CarClient {
|
||||
return this.http.post<Car>(`${this.apiBasePath}/v1/cars`, request);
|
||||
}
|
||||
|
||||
update(request: UpdateCarRequest): Observable<Car> {
|
||||
return this.http.put<Car>(`${this.apiBasePath}/v1/cars`, request);
|
||||
update(id: string, request: UpdateCarRequest): Observable<Car> {
|
||||
return this.http.put<Car>(`${this.apiBasePath}/v1/cars/${id}`, request);
|
||||
}
|
||||
|
||||
delete(id: string): Observable<void> {
|
||||
|
||||
@@ -18,12 +18,12 @@ export class ConsumptionClient {
|
||||
return this.http.get<ConsumptionEntry>(`${this.apiBasePath}/v1/consumptions/${id}`);
|
||||
}
|
||||
|
||||
create(request: CreateCarRequest): Observable<ConsumptionEntry> {
|
||||
create(request: CreateConsumptionEntry): Observable<ConsumptionEntry> {
|
||||
return this.http.post<ConsumptionEntry>(`${this.apiBasePath}/v1/consumptions`, request);
|
||||
}
|
||||
|
||||
update(request: UpdateCarRequest): Observable<ConsumptionEntry> {
|
||||
return this.http.put<ConsumptionEntry>(`${this.apiBasePath}/v1/consumptions`, request);
|
||||
update(id: string, request: UpdateConsumptionEntry): Observable<ConsumptionEntry> {
|
||||
return this.http.put<ConsumptionEntry>(`${this.apiBasePath}/v1/consumptions/${id}`, request);
|
||||
}
|
||||
|
||||
delete(id: string): Observable<void> {
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { Component, computed, inject, Signal } from '@angular/core';
|
||||
import { Component, computed, DestroyRef, inject, input, Signal } from '@angular/core';
|
||||
import { takeUntilDestroyed, toSignal } from '@angular/core/rxjs-interop';
|
||||
import { FormBuilder, ReactiveFormsModule, Validators } from '@angular/forms';
|
||||
import { Router } from '@angular/router';
|
||||
@@ -14,8 +14,11 @@ import { InputTextModule } from 'primeng/inputtext';
|
||||
import { MultiSelectModule } from 'primeng/multiselect';
|
||||
import { SelectModule } from 'primeng/select';
|
||||
import { SkeletonModule } from 'primeng/skeleton';
|
||||
import { map } from 'rxjs';
|
||||
import { catchError, EMPTY, map, Observable, switchMap, tap, throwError } from 'rxjs';
|
||||
import { RequiredMarkerComponent } from './components/required-marker.component';
|
||||
import { ConsumptionClient } from '@vegasco-web/api/consumptions/consumption-client';
|
||||
import { HttpErrorResponse } from '@angular/common/http';
|
||||
import { MessageService } from 'primeng/api';
|
||||
|
||||
@Component({
|
||||
selector: 'app-edit-entry',
|
||||
@@ -40,14 +43,19 @@ import { RequiredMarkerComponent } from './components/required-marker.component'
|
||||
export class EditEntryComponent {
|
||||
private readonly formBuilder = inject(FormBuilder);
|
||||
private readonly carClient = inject(CarClient);
|
||||
private readonly consumptionClient = inject(ConsumptionClient);
|
||||
private readonly router = inject(Router);
|
||||
private readonly destroyRef = inject(DestroyRef);
|
||||
private readonly messageService = inject(MessageService);
|
||||
|
||||
protected readonly entryId = input<string | undefined>(undefined);
|
||||
|
||||
protected readonly formFieldNames = {
|
||||
car: 'car',
|
||||
date: 'date',
|
||||
mileage: 'mileage',
|
||||
amount: 'amount',
|
||||
}
|
||||
} as const;
|
||||
|
||||
protected readonly formGroup = this.formBuilder.group({
|
||||
[this.formFieldNames.car]: [<Car | null>null, Validators.required],
|
||||
@@ -84,88 +92,82 @@ export class EditEntryComponent {
|
||||
}
|
||||
|
||||
onSubmit(): void {
|
||||
// if (!this.entryId) {
|
||||
// this.createEntry();
|
||||
// return;
|
||||
// }
|
||||
var entryId = this.entryId();
|
||||
if (entryId === undefined || entryId === null) {
|
||||
this.createEntry();
|
||||
return;
|
||||
}
|
||||
|
||||
// this.updateEntry();
|
||||
this.updateEntry(entryId);
|
||||
}
|
||||
|
||||
private getFormData() {
|
||||
var dateTime = new Date((this.formGroup.controls[this.formFieldNames.date].value ?? new Date).setHours(0, 0, 0, 0));
|
||||
|
||||
return {
|
||||
carId: this.formGroup.controls[this.formFieldNames.car].value!.id,
|
||||
dateTime: dateTime.toISOString(),
|
||||
distance: this.formGroup.controls[this.formFieldNames.mileage].value!,
|
||||
amount: this.formGroup.controls[this.formFieldNames.amount].value!,
|
||||
ignoreInCalculation: false,
|
||||
};
|
||||
}
|
||||
|
||||
createEntry() {
|
||||
// this.api
|
||||
// .createWeightEntry(
|
||||
// this.getWeighedAt(),
|
||||
// this.formGroup.controls['weight'].value,
|
||||
// this.formGroup.controls['comment'].value,
|
||||
// this.formGroup.controls['rabbit'].value!.id,
|
||||
// this.formGroup.controls['medicines'].value?.map((x) => x.id) ?? [],
|
||||
// )
|
||||
// .subscribe({
|
||||
// next: (_) => {
|
||||
// this.router.navigateByUrl('/weight-entries');
|
||||
// },
|
||||
// error: (error: HttpErrorResponse) => {
|
||||
// switch (true) {
|
||||
// case error.status >= 500 && error.status <= 599:
|
||||
// this.messageService.add({
|
||||
// severity: 'error',
|
||||
// summary: 'Serverfehler',
|
||||
// detail:
|
||||
// 'Beim Erstellen des Eintrags ist ein Fehler aufgetreten. Bitte versuche es erneut.',
|
||||
// });
|
||||
// break;
|
||||
// case error.status == 400:
|
||||
// this.messageService.add({
|
||||
// severity: 'error',
|
||||
// summary: 'Clientfehler',
|
||||
// detail:
|
||||
// 'Die Anwendung scheint falsche Daten an den Server zu senden.',
|
||||
// });
|
||||
// break;
|
||||
// default:
|
||||
// break;
|
||||
// }
|
||||
// },
|
||||
// });
|
||||
var request: CreateConsumptionEntry = this.getFormData();
|
||||
this.consumptionClient.create(request)
|
||||
.pipe(
|
||||
takeUntilDestroyed(this.destroyRef),
|
||||
catchError((error) => this.handleError(error)),
|
||||
switchMap(() => this.router.navigateByUrl('/entries'))
|
||||
)
|
||||
.subscribe();
|
||||
}
|
||||
|
||||
updateEntry() {
|
||||
// this.api
|
||||
// .updateWeightEntry(
|
||||
// this.entryId!,
|
||||
// this.getWeighedAt(),
|
||||
// this.formGroup.controls['weight'].value,
|
||||
// this.formGroup.controls['comment'].value,
|
||||
// this.formGroup.controls['rabbit'].value!.id,
|
||||
// this.formGroup.controls['medicines'].value?.map((x) => x.id) ?? [],
|
||||
// )
|
||||
// .subscribe({
|
||||
// next: (_) => {
|
||||
// this.router.navigateByUrl('/weight-entries');
|
||||
// },
|
||||
// error: (error: HttpErrorResponse) => {
|
||||
// switch (true) {
|
||||
// case error.status >= 500 && error.status <= 599:
|
||||
// this.messageService.add({
|
||||
// severity: 'error',
|
||||
// summary: 'Serverfehler',
|
||||
// detail:
|
||||
// 'Beim Aktualisieren des Eintrags ist ein Fehler aufgetreten. Bitte versuche es erneut.',
|
||||
// });
|
||||
// break;
|
||||
// case error.status == 400:
|
||||
// this.messageService.add({
|
||||
// severity: 'error',
|
||||
// summary: 'Clientfehler',
|
||||
// detail:
|
||||
// 'Die Anwendung scheint falsche Daten an den Server zu senden.',
|
||||
// });
|
||||
// break;
|
||||
// default:
|
||||
// break;
|
||||
// }
|
||||
// },
|
||||
// });
|
||||
updateEntry(id: string) {
|
||||
var request: UpdateConsumptionEntry = this.getFormData();
|
||||
this.consumptionClient.update(id, request)
|
||||
.pipe(
|
||||
takeUntilDestroyed(this.destroyRef),
|
||||
catchError((error) => this.handleError(error)),
|
||||
switchMap(() => this.router.navigateByUrl('/entries'))
|
||||
)
|
||||
.subscribe();
|
||||
}
|
||||
|
||||
private handleError(error: unknown): Observable<never> {
|
||||
if (!(error instanceof HttpErrorResponse)) {
|
||||
return throwError(() => error);
|
||||
}
|
||||
|
||||
switch (true) {
|
||||
case error.status >= 500 && error.status <= 599:
|
||||
this.messageService.add({
|
||||
severity: 'error',
|
||||
summary: 'Serverfehler',
|
||||
detail:
|
||||
'Beim Erstellen des Eintrags ist ein Fehler aufgetreten. Bitte versuche es erneut.',
|
||||
});
|
||||
break;
|
||||
case error.status == 400:
|
||||
this.messageService.add({
|
||||
severity: 'error',
|
||||
summary: 'Clientfehler',
|
||||
detail:
|
||||
'Die Anwendung scheint falsche Daten an den Server zu senden.',
|
||||
});
|
||||
break;
|
||||
default:
|
||||
console.error(error);
|
||||
this.messageService.add({
|
||||
severity: 'error',
|
||||
summary: 'Unerwarteter Fehler',
|
||||
detail:
|
||||
'Beim Erstellen des Eintrags hat der Server eine unerwartete Antwort zurückgegeben.',
|
||||
});
|
||||
break;
|
||||
}
|
||||
|
||||
return EMPTY;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -2,8 +2,8 @@
|
||||
<p-scrollTop />
|
||||
<div class="mb-4 flex gap-2 md:justify-between">
|
||||
<div class="basis-full lg:basis-1/4 md:basis-1/2 p-0">
|
||||
<!-- <p-select styleClass="w-full" [formControl]="selectedRabbit" placeholder="Kaninchen" [showClear]="true"
|
||||
[options]="(rabbits$ | async)!" optionLabel="name" /> -->
|
||||
<p-select styleClass="w-full" [formControl]="selectedCar" placeholder="Auto" [showClear]="true"
|
||||
[options]="(cars$ | async)!" optionLabel="name" />
|
||||
</div>
|
||||
<div>
|
||||
<p-button label="Erstellen" routerLink="/entries/create">
|
||||
|
||||
@@ -1,18 +1,22 @@
|
||||
import { AsyncPipe, CommonModule } from '@angular/common';
|
||||
import { Component, inject } from '@angular/core';
|
||||
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
|
||||
import { ReactiveFormsModule } from '@angular/forms';
|
||||
import { FormControl, ReactiveFormsModule } from '@angular/forms';
|
||||
import { RouterLink } from '@angular/router';
|
||||
import { CarClient } from '@vegasco-web/api/cars/car-client';
|
||||
import { ConsumptionClient } from '@vegasco-web/api/consumptions/consumption-client';
|
||||
import { MessageService } from 'primeng/api';
|
||||
import { ButtonModule } from 'primeng/button';
|
||||
import { DataViewModule } from 'primeng/dataview';
|
||||
import { ScrollTopModule } from 'primeng/scrolltop';
|
||||
import { SelectModule } from 'primeng/select';
|
||||
import { SkeletonModule } from 'primeng/skeleton';
|
||||
import {
|
||||
BehaviorSubject,
|
||||
combineLatest,
|
||||
map,
|
||||
Observable,
|
||||
startWith,
|
||||
tap
|
||||
} from 'rxjs';
|
||||
|
||||
@@ -35,29 +39,57 @@ import {
|
||||
export class EntriesComponent {
|
||||
private readonly consumptionClient = inject(ConsumptionClient);
|
||||
private readonly carClient = inject(CarClient);
|
||||
private readonly messageService = inject(MessageService);
|
||||
|
||||
protected readonly consumptionEntries$: Observable<ConsumptionEntry[]>;
|
||||
protected readonly cars$: Observable<Car[]>;
|
||||
|
||||
protected readonly skeletonsIterationSource = Array(10).fill(0);
|
||||
|
||||
protected readonly selectedCar = new FormControl<Car | null | undefined>(null);
|
||||
|
||||
private readonly deletedEntries$ = new BehaviorSubject(<string[]>[]);
|
||||
|
||||
constructor() {
|
||||
this.consumptionEntries$ = this.consumptionClient.getAll()
|
||||
const consumptionEntries = this.consumptionClient.getAll()
|
||||
.pipe(
|
||||
map(response => response.consumptions)
|
||||
);
|
||||
|
||||
this.consumptionEntries$ = combineLatest([
|
||||
consumptionEntries,
|
||||
this.selectedCar.valueChanges.pipe(startWith(null)),
|
||||
this.deletedEntries$,
|
||||
])
|
||||
.pipe(
|
||||
takeUntilDestroyed(),
|
||||
tap((response) => {
|
||||
console.log('Entries response:', response);
|
||||
}),
|
||||
map(response => response.consumptions)
|
||||
map(([entries, selectedCar, deletedEntries]) => {
|
||||
const nonDeletedEntries =
|
||||
deletedEntries.length === 0
|
||||
? entries
|
||||
: entries.filter(entry => !deletedEntries.includes(entry.id));
|
||||
|
||||
if (!selectedCar) {
|
||||
return nonDeletedEntries;
|
||||
}
|
||||
|
||||
return nonDeletedEntries.filter(entry => entry.carId === selectedCar.id);
|
||||
})
|
||||
);
|
||||
|
||||
this.cars$ = this.carClient.getAll()
|
||||
.pipe(
|
||||
takeUntilDestroyed(),
|
||||
tap((response) => {
|
||||
console.log('Cars response:', response);
|
||||
}),
|
||||
map(response => response.cars)
|
||||
);
|
||||
}
|
||||
|
||||
onEntryDeleted(entry: ConsumptionEntry): void {
|
||||
this.deletedEntries$.next([...this.deletedEntries$.value, entry.id]);
|
||||
this.messageService.add({
|
||||
severity: 'success',
|
||||
summary: 'Eintrag gelöscht',
|
||||
detail: 'Der Eintrag wurde erfolgreich gelöscht.',
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user