feat(cashier): morning opening balance panel across settlement, reconciliation, position & history
- Cash Settlement form: morning panel (denomination pills) + Morning column in denomination table - Reconciliation form: morning panel (denomination pills) + Morning column in denomination table - Cashier Position Report: Morning vs Current comparison bar + Morning column (single-cashier mode) - Cash History – Settlement detail panel: Morning Received vs Settled comparison bar + Morning column - Cash History – denomination Notes/Coins separation in detail panel for all transaction types - CashierService: added getCashierMorningBalance() calling GET /cashreports/cashier-morning - All morning data loaded via forkJoin alongside existing API calls (no extra loading states) Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Sonnet 4.6
parent
6433ae068d
commit
51495f8eb8
@@ -182,6 +182,45 @@
|
||||
</div>
|
||||
}
|
||||
|
||||
<!-- Morning Opening Balance summary panel -->
|
||||
@if (morningTotal > 0) {
|
||||
<div class="morning-panel">
|
||||
<div class="morning-panel__head">
|
||||
<mat-icon>wb_sunny</mat-icon>
|
||||
<span>Morning Opening Balance <em>(Cash received from vault today)</em></span>
|
||||
<strong class="morning-panel__total">₹{{ morningTotal | number: '1.2-2' }}</strong>
|
||||
</div>
|
||||
<div class="morning-panel__body">
|
||||
@if (noteRows.length > 0) {
|
||||
<div class="morning-panel__section-label">Notes — ₹{{ morningNoteTotal | number: '1.0-0' }}</div>
|
||||
<div class="morning-panel__pills">
|
||||
@for (row of noteRows; track row.denominationId) {
|
||||
@if (row.morningCount > 0) {
|
||||
<span class="morning-pill"
|
||||
>₹{{ row.denominationValue }}<span class="morning-pill__x">×{{ row.morningCount }}</span></span
|
||||
>
|
||||
}
|
||||
}
|
||||
</div>
|
||||
}
|
||||
@if (coinRows.length > 0) {
|
||||
<div class="morning-panel__section-label morning-panel__section-label--coin">
|
||||
Coins — ₹{{ morningCoinTotal | number: '1.0-0' }}
|
||||
</div>
|
||||
<div class="morning-panel__pills">
|
||||
@for (row of coinRows; track row.denominationId) {
|
||||
@if (row.morningCount > 0) {
|
||||
<span class="morning-pill morning-pill--coin"
|
||||
>₹{{ row.denominationValue }}<span class="morning-pill__x">×{{ row.morningCount }}</span></span
|
||||
>
|
||||
}
|
||||
}
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
<!-- Denomination table -->
|
||||
@if (rows.length > 0) {
|
||||
<div class="pg-card">
|
||||
@@ -192,6 +231,7 @@
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Denomination</th>
|
||||
<th class="num settle-col-morning" title="What cashier received from vault this morning">Morning</th>
|
||||
<th class="num">System Expected</th>
|
||||
<th style="text-align: center">Physical Count</th>
|
||||
<th class="num">Variance</th>
|
||||
@@ -203,6 +243,7 @@
|
||||
<td>
|
||||
<span class="pg-chip">₹{{ row.denominationValue }}</span>
|
||||
</td>
|
||||
<td class="num settle-morning">{{ row.morningCount || '—' }}</td>
|
||||
<td class="num settle-expected">{{ row.expectedCount }}</td>
|
||||
<td style="text-align: center">
|
||||
<div class="pg-step" style="margin: 0 auto">
|
||||
@@ -224,9 +265,9 @@
|
||||
>
|
||||
{{ varianceFor(row) > 0 ? '+' : '' }}{{ varianceFor(row) }}
|
||||
@if (varianceFor(row) !== 0) {
|
||||
<span class="settle-var-amt">
|
||||
(₹{{ varianceFor(row) * row.denominationValue | number: '1.0-0' }})
|
||||
</span>
|
||||
<span class="settle-var-amt"
|
||||
>(₹{{ varianceFor(row) * row.denominationValue | number: '1.0-0' }})</span
|
||||
>
|
||||
}
|
||||
</td>
|
||||
</tr>
|
||||
@@ -242,6 +283,7 @@
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Denomination</th>
|
||||
<th class="num settle-col-morning" title="What cashier received from vault this morning">Morning</th>
|
||||
<th class="num">System Expected</th>
|
||||
<th style="text-align: center">Physical Count</th>
|
||||
<th class="num">Variance</th>
|
||||
@@ -253,6 +295,7 @@
|
||||
<td>
|
||||
<span class="pg-chip pg-chip--coin">₹{{ row.denominationValue }}</span>
|
||||
</td>
|
||||
<td class="num settle-morning">{{ row.morningCount || '—' }}</td>
|
||||
<td class="num settle-expected">{{ row.expectedCount }}</td>
|
||||
<td style="text-align: center">
|
||||
<div class="pg-step" style="margin: 0 auto">
|
||||
@@ -274,9 +317,9 @@
|
||||
>
|
||||
{{ varianceFor(row) > 0 ? '+' : '' }}{{ varianceFor(row) }}
|
||||
@if (varianceFor(row) !== 0) {
|
||||
<span class="settle-var-amt">
|
||||
(₹{{ varianceFor(row) * row.denominationValue | number: '1.0-0' }})
|
||||
</span>
|
||||
<span class="settle-var-amt"
|
||||
>(₹{{ varianceFor(row) * row.denominationValue | number: '1.0-0' }})</span
|
||||
>
|
||||
}
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
@@ -293,3 +293,111 @@
|
||||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
|
||||
/* ── Morning Opening Balance panel ── */
|
||||
.morning-panel {
|
||||
background: linear-gradient(135deg, #fffbeb 0%, #fef9ec 100%);
|
||||
border: 1px solid #fcd34d;
|
||||
border-radius: 10px;
|
||||
margin-bottom: 16px;
|
||||
overflow: hidden;
|
||||
|
||||
&__head {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
padding: 12px 16px;
|
||||
border-bottom: 1px solid #fde68a;
|
||||
|
||||
mat-icon {
|
||||
color: #d97706;
|
||||
font-size: 20px;
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
span {
|
||||
flex: 1;
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
color: #78350f;
|
||||
|
||||
em {
|
||||
font-weight: 400;
|
||||
opacity: 0.75;
|
||||
font-style: normal;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__total {
|
||||
font-size: 15px;
|
||||
font-weight: 800;
|
||||
color: #92400e;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
&__body {
|
||||
padding: 10px 16px 12px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
&__section-label {
|
||||
font-size: 10px;
|
||||
font-weight: 800;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.06em;
|
||||
color: #92400e;
|
||||
margin-bottom: 2px;
|
||||
|
||||
&--coin {
|
||||
color: #78350f;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.morning-panel__pills {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 6px;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.morning-pill {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 2px;
|
||||
padding: 3px 9px;
|
||||
background: #fef3c7;
|
||||
border: 1px solid #fcd34d;
|
||||
border-radius: 999px;
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
color: #92400e;
|
||||
|
||||
&--coin {
|
||||
background: #fff7ed;
|
||||
border-color: #fdba74;
|
||||
color: #7c2d12;
|
||||
}
|
||||
}
|
||||
|
||||
.morning-pill__x {
|
||||
font-weight: 400;
|
||||
opacity: 0.75;
|
||||
margin-left: 1px;
|
||||
}
|
||||
|
||||
/* ── Morning column in settle table ── */
|
||||
.settle-col-morning {
|
||||
color: #d97706;
|
||||
}
|
||||
|
||||
.settle-morning {
|
||||
color: #b45309;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
@@ -25,6 +25,7 @@ interface SettleDenomRow {
|
||||
denominationId: number;
|
||||
denominationValue: number;
|
||||
kind: 'note' | 'coin';
|
||||
morningCount: number;
|
||||
expectedCount: number;
|
||||
physicalCount: number;
|
||||
}
|
||||
@@ -77,6 +78,7 @@ export class CashSettlementComponent implements OnInit {
|
||||
supervisorChecking = false;
|
||||
|
||||
rows: SettleDenomRow[] = [];
|
||||
morningTotal = 0;
|
||||
|
||||
settlementDate = '';
|
||||
// Vault teller to deposit TO
|
||||
@@ -128,8 +130,9 @@ export class CashSettlementComponent implements OnInit {
|
||||
.pipe(catchError(() => of({ alreadySettled: false }))),
|
||||
recon: this.service
|
||||
.checkReconciliation(cashierId, this.settlementDate)
|
||||
.pipe(catchError(() => of({ reconciled: false })))
|
||||
}).subscribe(({ expected, check, recon }) => {
|
||||
.pipe(catchError(() => of({ reconciled: false }))),
|
||||
morning: this.service.getCashierMorningBalance(cashierId, this.settlementDate).pipe(catchError(() => of(null)))
|
||||
}).subscribe(({ expected, check, recon, morning }) => {
|
||||
this.supervisorChecking = false;
|
||||
if (check?.alreadySettled) {
|
||||
this.pageState = 'already-settled';
|
||||
@@ -139,6 +142,13 @@ export class CashSettlementComponent implements OnInit {
|
||||
this.pageState = 'needs-reconciliation';
|
||||
return;
|
||||
}
|
||||
// Build denomination → morningCount map
|
||||
const morningMap = new Map<number, number>();
|
||||
((morning?.denominations || []) as any[]).forEach((d: any) =>
|
||||
morningMap.set(d.denominationId, d.morningCount ?? 0)
|
||||
);
|
||||
this.morningTotal = Number(morning?.totalMorning ?? 0);
|
||||
|
||||
this.rows = ((expected?.denominations as any[]) || [])
|
||||
.filter((d: any) => (d.expectedCount ?? 0) > 0)
|
||||
.sort((a: any, b: any) => b.denominationValue - a.denominationValue)
|
||||
@@ -146,6 +156,7 @@ export class CashSettlementComponent implements OnInit {
|
||||
denominationId: d.denominationId,
|
||||
denominationValue: d.denominationValue,
|
||||
kind: (d.kind ?? 'note') as 'note' | 'coin',
|
||||
morningCount: morningMap.get(d.denominationId) ?? 0,
|
||||
expectedCount: d.expectedCount,
|
||||
physicalCount: d.expectedCount
|
||||
}));
|
||||
@@ -187,6 +198,12 @@ export class CashSettlementComponent implements OnInit {
|
||||
get coinRows(): SettleDenomRow[] {
|
||||
return this.rows.filter((r) => r.kind === 'coin');
|
||||
}
|
||||
get morningNoteTotal(): number {
|
||||
return this.noteRows.reduce((s, r) => s + r.morningCount * r.denominationValue, 0);
|
||||
}
|
||||
get morningCoinTotal(): number {
|
||||
return this.coinRows.reduce((s, r) => s + r.morningCount * r.denominationValue, 0);
|
||||
}
|
||||
|
||||
varianceFor(row: SettleDenomRow): number {
|
||||
return row.physicalCount - row.expectedCount;
|
||||
|
||||
Reference in New Issue
Block a user