done

src/app/cashier/voucher-report/voucher-report.component.ts

@@ -0,0 +1,159 @@
+/**
+ * Copyright since 2025 Mifos Initiative
+ *
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+
+import { Component, OnInit, inject } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+import { RouterLink } from '@angular/router';
+import { MatIconModule } from '@angular/material/icon';
+import { catchError, of } from 'rxjs';
+import { CashierService } from '../cashier.service';
+
+/** One voucher as the register shows it: the number, the two sides, and who raised it. */
+interface VoucherRow {
+  voucherNo: string;
+  voucherType: string | null;
+  amount: number | null;
+  createdAt: string | null;
+  userId: number | null;
+  username: string | null;
+  branchName: string | null;
+  verificationStatus: string | null;
+  debitParty: string | null;
+  debitAccount: string | null;
+  creditParty: string | null;
+  creditAccount: string | null;
+  /** Sides beyond the one debit and one credit shown — a DD's charges, a compound journal. */
+  extraLines: number;
+}
+
+interface VoucherReport {
+  from: string;
+  to: string;
+  username: string | null;
+  /** Set by the server from the caller's roles; a cashier is never offered the user filter. */
+  canSeeAllUsers: boolean;
+  vouchers: VoucherRow[];
+  count: number;
+  totalAmount: number;
+}
+
+/**
+ * The vouchers raised over a day or a month, one row each.
+ *
+ * A cashier sees their own work; a clerk, head cashier or manager sees everyone's and can narrow to
+ * one user. That is decided by the server, not here — this screen only shows or hides the filter.
+ */
+@Component({
+  selector: 'mifosx-voucher-report',
+  templateUrl: './voucher-report.component.html',
+  styleUrls: [
+    '../cashier-shared.scss',
+    './voucher-report.component.scss'
+  ],
+  standalone: true,
+  imports: [
+    CommonModule,
+    FormsModule,
+    RouterLink,
+    MatIconModule
+  ]
+})
+export class VoucherReportComponent implements OnInit {
+  private service = inject(CashierService);
+
+  /** Day is the working default; a month is what you ask for at a close. */
+  period: 'DAY' | 'MONTH' = 'DAY';
+  /** Anchor date — the day itself, or any day inside the month wanted. */
+  anchor = this.todayIso();
+  usernameFilter = '';
+  typeFilter = '';
+
+  report: VoucherReport | null = null;
+  loading = false;
+  error: string | null = null;
+
+  ngOnInit(): void {
+    this.load();
+  }
+
+  load(): void {
+    this.loading = true;
+    this.error = null;
+
+    const { from, to } = this.range();
+    this.service
+      .voucherReport(from, to, this.usernameFilter.trim() || undefined, this.typeFilter.trim() || undefined)
+      .pipe(
+        catchError((err: any) => {
+          this.error =
+            err?.error?.errors?.[0]?.defaultUserMessage ??
+            err?.error?.developerMessage ??
+            'The voucher report could not be loaded.';
+          return of(null);
+        })
+      )
+      .subscribe((res: VoucherReport | null) => {
+        this.loading = false;
+        this.report = res;
+      });
+  }
+
+  /** The period the anchor date names: that day, or the whole calendar month around it. */
+  private range(): { from: string; to: string } {
+    if (this.period === 'DAY') {
+      return { from: this.anchor, to: this.anchor };
+    }
+    const [
+      year,
+      month
+    ] = this.anchor.split('-').map(Number);
+    // Day 0 of the next month is the last day of this one, which is how a 28/30/31-day month is
+    // ended correctly without a table of month lengths.
+    const lastDay = new Date(year, month, 0).getDate();
+    const mm = String(month).padStart(2, '0');
+    return { from: `${year}-${mm}-01`, to: `${year}-${mm}-${String(lastDay).padStart(2, '0')}` };
+  }
+
+  private todayIso(): string {
+    const now = new Date();
+    return `${now.getFullYear()}-${String(now.getMonth() + 1).padStart(2, '0')}-${String(now.getDate()).padStart(2, '0')}`;
+  }
+
+  /** Totals per user, for the summary a manager reads before the rows. */
+  get byUser(): { username: string; count: number; total: number }[] {
+    const rows = this.report?.vouchers ?? [];
+    const tally = new Map<string, { username: string; count: number; total: number }>();
+    for (const row of rows) {
+      const key = row.username ?? '—';
+      const entry = tally.get(key) ?? { username: key, count: 0, total: 0 };
+      entry.count += 1;
+      entry.total += row.amount ?? 0;
+      tally.set(key, entry);
+    }
+    return [...tally.values()].sort((a, b) => b.total - a.total);
+  }
+
+  /** Totals per voucher type — deposits against withdrawals against journals. */
+  get byType(): { type: string; count: number; total: number }[] {
+    const rows = this.report?.vouchers ?? [];
+    const tally = new Map<string, { type: string; count: number; total: number }>();
+    for (const row of rows) {
+      const key = row.voucherType ?? '—';
+      const entry = tally.get(key) ?? { type: key, count: 0, total: 0 };
+      entry.count += 1;
+      entry.total += row.amount ?? 0;
+      tally.set(key, entry);
+    }
+    return [...tally.values()].sort((a, b) => b.total - a.total);
+  }
+
+  print(): void {
+    window.print();
+  }
+}