OVERVIEW
--------
Added real-time cashier cash position display inside the denomination breakdown
panel of all 4 transaction entry screens: Savings, Current Account, Recurring
Deposit, and Fixed Deposit. Shows opening balance at the top and projected
closing balance at the bottom after factoring in the current transaction.
BACKEND INTEGRATION
-------------------
- New CashierService (src/app/cashier/cashier.service.ts)
getCashierPositionForMe(asOfDate?) calls GET /cashreports/cashier-position/me
Returns denomination-wise opening cash position for the logged-in cashier user.
Non-cashier users receive empty denominations array; UI hides panels silently.
OPENING BALANCE CARD (top of denomination panel)
-------------------------------------------------
- Loaded on ngOnInit() via loadOpeningPosition() in all 4 component .ts files
- Notes and Coins displayed in separate labeled pill sections
- Each pill shows: Rs{value} x{count} format
- Card is hidden entirely if the logged-in user is not a cashier
CLOSING BALANCE CARD (below tally / Apply button)
--------------------------------------------------
- Computed getter closingDenoms() merges opening position with entered denominations
deposit: closingCount = openCount + enteredCount
withdrawal: closingCount = openCount - enteredCount
- Notes and Coins in separate labeled pill sections (identical format to opening)
- Entered/changed denominations (delta != 0): full opacity + bold font weight
- Untouched denominations (delta = 0): 38% opacity, clearly dimmed, no borders
- closingTotal = openingTotal +/- denominationTotal shown in card header
- Card turns green for positive closing balance, red for negative
COMPONENTS UPDATED
------------------
- savings-account-transactions (.ts / .html / .scss)
- current-account-transactions (.ts / .html / .scss)
- deposit-recurring-deposits-account (.ts / .html / .scss)
- fixed-deposits-cash-transaction (.ts / .html / .scss)
CASHIER MODULE (new - src/app/cashier/)
-----------------------------------------
Full cashier workspace module added to the app:
- cashier.service.ts API calls (position, transfers, settlement, etc.)
- cashier.module.ts Angular module declaration
- cashier-routing.module.ts Lazy-loaded routes
- cashier-position/ Cashier cash position dashboard
- cash-exchange-entry/ Cash exchange denomination entry
- cash-history/ Transaction history per cashier
- cash-settlement/ End-of-day cash settlement
- cash-transfer/ Vault-to-cashier cash transfer
- inter-cashier-transfer/ Transfer between cashier drawers
- reconciliation/ Cash reconciliation with GL
- closing-cash-report/ Closing balance report
- currency-exchange-detail/ Currency exchange breakdown
- excess-transaction-report/ Excess/short transaction report
Module wired into app.module.ts and shell nav (shell.component.html).
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
147 lines
4.3 KiB
TypeScript
147 lines
4.3 KiB
TypeScript
/**
|
|
* 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 { MatIconModule } from '@angular/material/icon';
|
|
import { MatSnackBar, MatSnackBarModule } from '@angular/material/snack-bar';
|
|
import { MatTabsModule } from '@angular/material/tabs';
|
|
import { forkJoin, of } from 'rxjs';
|
|
import { catchError } from 'rxjs/operators';
|
|
import { CashierService } from '../cashier.service';
|
|
|
|
interface TxnRow {
|
|
id: number;
|
|
date: string;
|
|
fromParty: string;
|
|
toParty: string;
|
|
amount: number;
|
|
note: string;
|
|
isReversed: boolean;
|
|
performedByUsername: string;
|
|
createdAt: string;
|
|
type: 'transfer' | 'settlement' | 'inter';
|
|
}
|
|
|
|
/** Unified history of all cash movements with reversal support. */
|
|
@Component({
|
|
selector: 'mifosx-cash-history',
|
|
templateUrl: './cash-history.component.html',
|
|
styleUrls: [
|
|
'../cashier-shared.scss',
|
|
'./cash-history.component.scss'
|
|
],
|
|
standalone: true,
|
|
imports: [
|
|
CommonModule,
|
|
FormsModule,
|
|
MatIconModule,
|
|
MatSnackBarModule,
|
|
MatTabsModule
|
|
]
|
|
})
|
|
export class CashHistoryComponent implements OnInit {
|
|
private service = inject(CashierService);
|
|
private snackBar = inject(MatSnackBar);
|
|
|
|
transfers: TxnRow[] = [];
|
|
settlements: TxnRow[] = [];
|
|
interCashier: TxnRow[] = [];
|
|
loading = false;
|
|
|
|
reversingId: number | null = null;
|
|
reversingType: string | null = null;
|
|
reverseReason = '';
|
|
|
|
ngOnInit(): void {
|
|
this.load();
|
|
}
|
|
|
|
load(): void {
|
|
this.loading = true;
|
|
forkJoin({
|
|
transfers: this.service.getCashTransfers().pipe(catchError(() => of([]))),
|
|
settlements: this.service.getCashSettlements().pipe(catchError(() => of([]))),
|
|
inter: this.service.getInterCashierTransfers().pipe(catchError(() => of([])))
|
|
}).subscribe(({ transfers, settlements, inter }) => {
|
|
this.transfers = (transfers as any[]).map((t) => ({
|
|
id: t.id,
|
|
date: t.transferDate,
|
|
fromParty: t.fromParty,
|
|
toParty: t.toParty,
|
|
amount: t.transferAmount,
|
|
note: t.note,
|
|
isReversed: t.isReversed,
|
|
performedByUsername: t.performedByUsername,
|
|
createdAt: t.createdAt,
|
|
type: 'transfer'
|
|
}));
|
|
this.settlements = (settlements as any[]).map((s) => ({
|
|
id: s.id,
|
|
date: s.settlementDate,
|
|
fromParty: s.fromParty,
|
|
toParty: s.toParty,
|
|
amount: s.settlementAmount,
|
|
note: s.note,
|
|
isReversed: s.isReversed,
|
|
performedByUsername: s.performedByUsername,
|
|
createdAt: s.createdAt,
|
|
type: 'settlement'
|
|
}));
|
|
this.interCashier = (inter as any[]).map((i) => ({
|
|
id: i.id,
|
|
date: i.transferDate,
|
|
fromParty: i.fromParty,
|
|
toParty: i.toParty,
|
|
amount: i.transferAmount,
|
|
note: i.note,
|
|
isReversed: i.isReversed,
|
|
performedByUsername: i.performedByUsername,
|
|
createdAt: i.createdAt,
|
|
type: 'inter'
|
|
}));
|
|
this.loading = false;
|
|
});
|
|
}
|
|
|
|
startReverse(row: TxnRow): void {
|
|
this.reversingId = row.id;
|
|
this.reversingType = row.type;
|
|
this.reverseReason = '';
|
|
}
|
|
|
|
cancelReverse(): void {
|
|
this.reversingId = null;
|
|
this.reversingType = null;
|
|
this.reverseReason = '';
|
|
}
|
|
|
|
confirmReverse(): void {
|
|
if (!this.reversingId || !this.reversingType) return;
|
|
const id = this.reversingId;
|
|
const type = this.reversingType;
|
|
const reason = this.reverseReason;
|
|
this.cancelReverse();
|
|
|
|
let obs$;
|
|
if (type === 'transfer') obs$ = this.service.reverseCashTransfer(id, reason);
|
|
else if (type === 'settlement') obs$ = this.service.reverseCashSettlement(id, reason);
|
|
else obs$ = this.service.reverseInterCashierTransfer(id, reason);
|
|
|
|
obs$.pipe(catchError(() => of(null))).subscribe((res: any) => {
|
|
if (res?.reversed) {
|
|
this.snackBar.open('Transaction reversed successfully', 'Close', { duration: 3000 });
|
|
this.load();
|
|
} else {
|
|
this.snackBar.open('Reversal failed', 'Close', { duration: 3000 });
|
|
}
|
|
});
|
|
}
|
|
}
|