tanshu/brewman
1
0
Fork 0
Code Issues Pull Requests Releases Activity

Consolidated commit message to v22 signals

Browse Source
This commit is contained in:
tanshu
2026-08-25 14:45:09 +00:00
parent 6403d25d3e
commit df289b20b8
443 changed files with 16058 additions and 17332 deletions
Download Patch File Download Diff File Expand all files Collapse all files
overlord/src/app/mozimo-daily-register/mozimo-daily-register.component.ts
+86 -86
View File
@@ -1,6 +1,6 @@
import { DecimalPipe } from '@angular/common';
import { Component, ElementRef, inject, OnInit, ViewChild } from '@angular/core';
import { FormArray, FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
import { Component, inject, input, computed, afterNextRender, linkedSignal, signal } from '@angular/core';
import { form as createForm, FormField, FormRoot } from '@angular/forms/signals';
import { MatAutocompleteModule } from '@angular/material/autocomplete';
import { MatBadgeModule } from '@angular/material/badge';
import { MatButtonModule } from '@angular/material/button';
@@ -8,22 +8,33 @@ import { MatDatepickerModule } from '@angular/material/datepicker';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatPaginator, MatPaginatorModule } from '@angular/material/paginator';
import { MatPaginatorModule, PageEvent } from '@angular/material/paginator';
import { MatSnackBar } from '@angular/material/snack-bar';
import { MatTableModule } from '@angular/material/table';
import { MatTooltipModule } from '@angular/material/tooltip';
import { ActivatedRoute, Router } from '@angular/router';
import { Router } from '@angular/router';
import moment from 'moment';
import { BehaviorSubject } from 'rxjs';
import { AuthService } from '../auth/auth.service';
import { ErrorStateComponent } from '../shared/error-state/error-state.component';
import { LocalTimePipe } from '../shared/local-time.pipe';
import { SkeletonLoaderComponent } from '../shared/skeleton-loader/skeleton-loader.component';
import { ToCsvService } from '../shared/to-csv.service';
import { MozimoDailyRegister } from './mozimo-daily-register';
import { MozimoDailyRegisterDataSource } from './mozimo-daily-register-datasource';
import { MozimoDailyRegisterItem } from './mozimo-daily-register-item';
import { MozimoDailyRegisterService } from './mozimo-daily-register.service';
export interface MozimoDailyRegisterFormData {
date: moment.Moment;
items: {
received: number;
sale: number;
nc: number;
display: number | null;
ageing: number | null;
}[];
}
@Component({
selector: 'app-mozimo-daily-register',
templateUrl: './mozimo-daily-register.component.html',
@@ -34,7 +45,6 @@ import { MozimoDailyRegisterService } from './mozimo-daily-register.service';
MatAutocompleteModule,
MatBadgeModule,
MatButtonModule,
MatDatepickerModule,
MatFormFieldModule,
MatIconModule,
@@ -42,84 +52,66 @@ import { MozimoDailyRegisterService } from './mozimo-daily-register.service';
MatPaginatorModule,
MatTableModule,
MatTooltipModule,
ReactiveFormsModule,
FormField,
FormRoot,
SkeletonLoaderComponent,
ErrorStateComponent,
],
providers: [LocalTimePipe],
})
export class MozimoDailyRegisterComponent implements OnInit {
private route = inject(ActivatedRoute);
export class MozimoDailyRegisterComponent {
private router = inject(Router);
private toCsv = inject(ToCsvService);
private localTimePipe = inject(LocalTimePipe);
private snackBar = inject(MatSnackBar);
auth = inject(AuthService);
private ser = inject(MozimoDailyRegisterService);
date = input(null, { transform: (v: string | null | undefined) => v ?? null });
@ViewChild('dateElement', { static: false }) dateElement!: ElementRef<HTMLInputElement>;
@ViewChild(MatPaginator, { static: true }) paginator!: MatPaginator;
info: MozimoDailyRegister = new MozimoDailyRegister();
body = new BehaviorSubject<MozimoDailyRegisterItem[]>([]);
dataSource: MozimoDailyRegisterDataSource = new MozimoDailyRegisterDataSource(this.body);
pageSize = signal(50);
pageIndex = signal(0);
infoResource = this.ser.list(this.date);
info = computed(() => this.infoResource.value() ?? new MozimoDailyRegister());
model = linkedSignal({
source: this.info,
computation: (v): MozimoDailyRegisterFormData => ({
date: moment(v.date, 'DD-MMM-YYYY'),
items: v.body.map((x) => ({
received: x.received,
sale: x.sale,
nc: x.nc,
display: x.display,
ageing: x.ageing,
})),
}),
});
body = linkedSignal(() => this.info().body);
dataSource = computed(() => {
const data = this.info().body ?? [];
const pageIndex = this.pageIndex();
const pageSize = this.pageSize();
return data.slice(pageIndex * pageSize, (pageIndex + 1) * pageSize);
});
form = createForm(this.model);
form: FormGroup<{
date: FormControl<moment.Moment>;
items: FormArray<
FormGroup<{
received: FormControl<number>;
sale: FormControl<number>;
nc: FormControl<number>;
display: FormControl<number | null>;
ageing: FormControl<number | null>;
}>
>;
}>;
/** Columns displayed in the table. Columns IDs can be added, removed, or reordered. */
displayedColumns = ['product', 'opening', 'received', 'sale', 'nc', 'display', 'ageing', 'variance', 'closing'];
constructor() {
this.form = new FormGroup({
date: new FormControl(moment(new Date()), { nonNullable: true }),
items: new FormArray<
FormGroup<{
received: FormControl<number>;
sale: FormControl<number>;
nc: FormControl<number>;
display: FormControl<number | null>;
ageing: FormControl<number | null>;
}>
>([]),
});
}
ngOnInit() {
this.route.data.subscribe((value) => {
const data = value as { info: MozimoDailyRegister };
this.info = data.info;
this.form.patchValue({
date: moment(this.info.date, 'DD-MMM-YYYY'),
});
this.form.controls.items.clear();
this.info.body.forEach((x) =>
this.form.controls.items.push(
new FormGroup({
received: new FormControl(x.received, { nonNullable: true, validators: [Validators.min(0)] }),
sale: new FormControl(x.sale, { nonNullable: true, validators: [Validators.min(0)] }),
nc: new FormControl(x.nc, { nonNullable: true, validators: [Validators.min(0)] }),
display: new FormControl(x.display, { nonNullable: false, validators: [Validators.min(0)] }),
ageing: new FormControl(x.ageing, { nonNullable: false, validators: [Validators.min(0)] }),
}),
),
);
if (!this.dataSource.paginator) {
this.dataSource.paginator = this.paginator;
}
this.body.next(this.info.body);
afterNextRender(() => {
this.form().focusBoundControl();
});
}
show() {
const date = moment(this.form.value.date).format('DD-MMM-YYYY');
const date = moment(this.model().date).format('DD-MMM-YYYY');
this.router.navigate(['/mozimo-daily-register', date]);
}
@@ -129,26 +121,29 @@ export class MozimoDailyRegisterComponent implements OnInit {
this.snackBar.open('', 'Success');
},
error: (error) => {
this.snackBar.open(error, 'Danger');
this.snackBar.open(error as string, 'Danger');
},
});
}
getMozimoDailyRegister(): MozimoDailyRegister {
const formModel = this.form.value;
this.info.date = moment(formModel.date).format('DD-MMM-YYYY');
const formModel = this.model();
const info = this.info();
info.date = formModel.date.format('DD-MMM-YYYY');
const array = this.form.controls.items;
this.info.body.forEach((item, index) => {
item.received = +(array.controls[index].value.received ?? 0);
item.sale = +(array.controls[index].value.sale ?? 0);
item.nc = +(array.controls[index].value.nc ?? 0);
const display = array.controls[index].value.display ?? null;
const ageing = array.controls[index].value.ageing ?? null;
item.display = display == null ? null : +display;
item.ageing = ageing == null ? null : +ageing;
});
return this.info;
const array = formModel.items;
if (array) {
info.body.forEach((item, index) => {
if (array[index]) {
item.received = array[index].received ?? 0;
item.sale = array[index].sale ?? 0;
item.nc = array[index].nc ?? 0;
item.display = array[index].display ?? null;
item.ageing = array[index].ageing ?? null;
}
});
}
return info;
}
exportCsv() {
@@ -164,7 +159,7 @@ export class MozimoDailyRegisterComponent implements OnInit {
Closing: 'closing',
'Last Edit Date': 'lastEditDate',
};
const d = JSON.parse(JSON.stringify(this.dataSource.data)).map((x: MozimoDailyRegisterItem) => ({
const d = JSON.parse(JSON.stringify(this.info().body ?? [])).map((x: MozimoDailyRegisterItem) => ({
id: x.id,
product: x.product.name,
opening: x.opening,
@@ -191,28 +186,33 @@ export class MozimoDailyRegisterComponent implements OnInit {
updateReceived($event: Event, row: MozimoDailyRegisterItem) {
row.received = +($event.target as HTMLInputElement).value;
this.body.next(this.info.body);
this.body.set([...this.info().body]);
}
updateSale($event: Event, row: MozimoDailyRegisterItem) {
row.sale = +($event.target as HTMLInputElement).value;
this.body.next(this.info.body);
this.body.set([...this.info().body]);
}
updateNc($event: Event, row: MozimoDailyRegisterItem) {
row.nc = +($event.target as HTMLInputElement).value;
this.body.next(this.info.body);
this.body.set([...this.info().body]);
}
updateDisplay($event: Event, row: MozimoDailyRegisterItem) {
const val = ($event.target as HTMLInputElement).value;
row.display = val === '' ? null : +val;
this.body.next(this.info.body);
this.body.set([...this.info().body]);
}
updateAgeing($event: Event, row: MozimoDailyRegisterItem) {
const val = ($event.target as HTMLInputElement).value;
row.ageing = val === '' ? null : +val;
this.body.next(this.info.body);
this.body.set([...this.info().body]);
}
handlePageEvent(e: PageEvent) {
this.pageSize.set(e.pageSize);
this.pageIndex.set(e.pageIndex);
}
}