CBSNexora/cbsnexora
4
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Compare commits

merge into: CBSNexora/cbsnexora:feature/fd-interest-posting
Branches Tags
CBSNexora/cbsnexora:dev CBSNexora/cbsnexora:feature-demo CBSNexora/cbsnexora:feature/advanceLoanProduct CBSNexora/cbsnexora:feature/investment CBSNexora/cbsnexora:dev-latest CBSNexora/cbsnexora:feature/approval-live-badge-counts CBSNexora/cbsnexora:feature/voucher-correction-and-cash-transfer-approval CBSNexora/cbsnexora:feature/cashier-cash-ops-and-txn-undo-lock CBSNexora/cbsnexora:feature/merge-dds-advance-loan-into-dev-latest CBSNexora/cbsnexora:feature/fd-interest-posting CBSNexora/cbsnexora:main CBSNexora/cbsnexora:feature/fd-interest-posting-approval CBSNexora/cbsnexora:feature/locker CBSNexora/cbsnexora:feature/dds CBSNexora/cbsnexora:feature/bugfix CBSNexora/cbsnexora:maker-checker CBSNexora/cbsnexora:feature/loanProductCreation CBSNexora/cbsnexora:feature/dds-agent-settlement-reports CBSNexora/cbsnexora:demo-backup CBSNexora/cbsnexora:demo CBSNexora/cbsnexora:dev-backup CBSNexora/cbsnexora:uate
..
pull from: CBSNexora/cbsnexora:feature/fd-interest-posting-approval
Branches Tags
CBSNexora/cbsnexora:feature-demo CBSNexora/cbsnexora:feature/advanceLoanProduct CBSNexora/cbsnexora:feature/investment CBSNexora/cbsnexora:dev-latest CBSNexora/cbsnexora:feature/approval-live-badge-counts CBSNexora/cbsnexora:feature/voucher-correction-and-cash-transfer-approval CBSNexora/cbsnexora:feature/cashier-cash-ops-and-txn-undo-lock CBSNexora/cbsnexora:feature/merge-dds-advance-loan-into-dev-latest CBSNexora/cbsnexora:feature/fd-interest-posting CBSNexora/cbsnexora:main CBSNexora/cbsnexora:feature/fd-interest-posting-approval CBSNexora/cbsnexora:feature/locker CBSNexora/cbsnexora:feature/dds CBSNexora/cbsnexora:feature/bugfix CBSNexora/cbsnexora:dev CBSNexora/cbsnexora:maker-checker CBSNexora/cbsnexora:feature/loanProductCreation CBSNexora/cbsnexora:feature/dds-agent-settlement-reports CBSNexora/cbsnexora:demo-backup CBSNexora/cbsnexora:demo CBSNexora/cbsnexora:dev-backup CBSNexora/cbsnexora:uate
1 Commits
feature/fd-interest-posting .. feature/fd-interest-posting-approval
Author SHA1 Message Date
niteshandClaude Sonnet 5 244b70f926 fix(savings): show a clear message when an action is parked for checker approval 
Approve, close, reject, undo-approval, withdraw-by-client, and post-interest
on a savings account all silently behaved as if nothing happened when the
backend parks the command in the Checker Inbox instead of executing it
(HTTP 200 with rollbackTransaction: true) -- misleading the maker into
thinking the action either failed or quietly succeeded. Each now shows an
explicit alert naming what was sent for approval and that the account/
application is unchanged until a checker approves it.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
 2026-10-05 16:14:24 +05:30
57 changed files with 1071 additions and 11340 deletions
Expand all files Collapse all files
angular.json
-7
View File
@@ -31,8 +31,6 @@
"@angular/localize/init" "@angular/localize/init"
], ],
"assets": [ "assets": [
"src/favicon.ico",
"src/apple-touch-icon.png",
"src/assets/images/cbsnexora-favicon.svg", "src/assets/images/cbsnexora-favicon.svg",
"src/robots.txt", "src/robots.txt",
"src/manifest.json", "src/manifest.json",
@@ -41,11 +39,6 @@
"glob": "**/*", "glob": "**/*",
"input": "node_modules/tinymce", "input": "node_modules/tinymce",
"output": "assets/tinymce" "output": "assets/tinymce"
},
{
"glob": "lottie.min.js",
"input": "node_modules/lottie-web/build/player",
"output": "assets/js"
} }
], ],
"styles": [ "styles": [
package-lock.json
Generated
-7
View File
@@ -41,7 +41,6 @@
"jspdf-autotable": "^5.0.2", "jspdf-autotable": "^5.0.2",
"lightgallery": "^2.9.0", "lightgallery": "^2.9.0",
"lodash": "4.17.23", "lodash": "4.17.23",
"lottie-web": "^5.13.0",
"moment": "^2.29.4", "moment": "^2.29.4",
"ngx-image-cropper": "^9.1.6", "ngx-image-cropper": "^9.1.6",
"ngx-mat-select-search": "^8.0.2", "ngx-mat-select-search": "^8.0.2",
@@ -18381,12 +18380,6 @@
"url": "https://github.com/chalk/wrap-ansi?sponsor=1" "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
} }
}, },
"node_modules/lottie-web": {
"version": "5.13.0",
"resolved": "https://registry.npmjs.org/lottie-web/-/lottie-web-5.13.0.tgz",
"integrity": "sha512-+gfBXl6sxXMPe8tKQm7qzLnUy5DUPJPKIyRHwtpCpyUEYjHYRJC/5gjUvdkuO2c3JllrPtHXH5UJJK8LRYl5yQ==",
"license": "MIT"
},
"node_modules/lru-cache": { "node_modules/lru-cache": {
"version": "5.1.1", "version": "5.1.1",
"resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz", "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz",
package.json
-1
View File
@@ -71,7 +71,6 @@
"jspdf-autotable": "^5.0.2", "jspdf-autotable": "^5.0.2",
"lightgallery": "^2.9.0", "lightgallery": "^2.9.0",
"lodash": "4.17.23", "lodash": "4.17.23",
"lottie-web": "^5.13.0",
"moment": "^2.29.4", "moment": "^2.29.4",
"ngx-image-cropper": "^9.1.6", "ngx-image-cropper": "^9.1.6",
"ngx-mat-select-search": "^8.0.2", "ngx-mat-select-search": "^8.0.2",
src/app/accounting/search-journal-entry/search-journal-entry.component.html
+6 -1
View File
@@ -353,7 +353,12 @@
<div class="gl-fgroup"> <div class="gl-fgroup">
<label class="gl-flabel"><fa-icon icon="calendar-check"></fa-icon> Submitted From</label> <label class="gl-flabel"><fa-icon icon="calendar-check"></fa-icon> Submitted From</label>
<mat-form-field appearance="outline" class="gl-ffield"> <mat-form-field appearance="outline" class="gl-ffield">
<input matInput [matDatepicker]="dpSubFrom" [min]="minDate" [formControl]="submittedOnDateFrom" /> <input
matInput
[matDatepicker]="dpSubFrom"
[min]="minDate"
[formControl]="submittedOnDateFrom"
/>
<mat-datepicker-toggle matSuffix [for]="dpSubFrom"></mat-datepicker-toggle> <mat-datepicker-toggle matSuffix [for]="dpSubFrom"></mat-datepicker-toggle>
<mat-datepicker #dpSubFrom></mat-datepicker> <mat-datepicker #dpSubFrom></mat-datepicker>
</mat-form-field> </mat-form-field>
src/app/app.module.ts
-2
View File
@@ -96,7 +96,6 @@ import { TokenInterceptor as ZitadelTokenInterceptor } from './zitadel/token.int
import { AuthService } from './zitadel/auth.service'; import { AuthService } from './zitadel/auth.service';
import { environment } from '../environments/environment'; import { environment } from '../environments/environment';
import { CallbackComponent } from './zitadel/callback/callback.component'; import { CallbackComponent } from './zitadel/callback/callback.component';
import { LoadingScreenComponent } from './shared/loading-screen/loading-screen.component';
import { OAuthModule } from 'angular-oauth2-oidc'; import { OAuthModule } from 'angular-oauth2-oidc';
export class CustomMissingTranslationHandler implements MissingTranslationHandler { export class CustomMissingTranslationHandler implements MissingTranslationHandler {
@@ -196,7 +195,6 @@ export function HttpLoaderFactory(http: HttpClient) {
AppRoutingModule, AppRoutingModule,
NotFoundComponent, NotFoundComponent,
CallbackComponent, CallbackComponent,
LoadingScreenComponent,
OAuthModule.forRoot() OAuthModule.forRoot()
], ],
providers: [ providers: [
src/app/cashier/branch-day/branch-day.component.html
-45
View File
@@ -352,51 +352,6 @@
</div> </div>
} }
<!-- Interest waiting to be posted as this branch closes. Posting runs as part of the close, so
anything unapproved stops it: the branch sees here what it has to approve and where, rather
than finding out from a refusal after filling in the whole count. -->
@if (preview?.fdInterestDue?.length) {
<div class="bd-calc bd-calc--fd">
<div class="bd-calc__head">
<mat-icon>savings</mat-icon>
<strong>Fixed deposit interest due today</strong>
</div>
@for (d of preview.fdInterestDue; track d.productId) {
<div class="bd-calc__row">
<span>
{{ d.productName }} · {{ d.fdType }} · {{ d.accountCount }} deposit(s)
@if (d.reportStatus === 'APPROVED' || d.reportStatus === 'POSTED') {
<span class="bd-fd-ok">{{ d.reportStatus }}</span>
} @else {
<span class="bd-fd-pending">{{ d.reportStatus === 'NONE' ? 'NO REPORT' : d.reportStatus }}</span>
}
</span>
<span class="bd-calc__amt">₹{{ d.totalInterest | number: '1.2-2' }}</span>
</div>
}
</div>
}
@if (preview?.fdInterestPending?.length) {
<div class="bd-warn">
<mat-icon>warning</mat-icon>
<div>
<strong>The day cannot be closed yet.</strong> Fixed deposit interest is not approved for:
{{ preview.fdInterestPending.join(', ') }}. Approve it under Reports → FD Interest Posting Reports, then
close the day. The user who generated a report cannot approve it.
</div>
</div>
}
@if (preview?.savingsInterestPending?.length) {
<div class="bd-warn">
<mat-icon>warning</mat-icon>
<div>
<strong>The day cannot be closed yet.</strong> Savings interest is not approved for:
{{ preview.savingsInterestPending.join(', ') }}. Approve it under Reports → Interest Posting Reports, then
close the day.
</div>
</div>
}
<!-- What every cash point under this branch is actually holding right now, fetched <!-- What every cash point under this branch is actually holding right now, fetched
automatically — so closing the day doesn't mean separately checking Vault Position and automatically — so closing the day doesn't mean separately checking Vault Position and
every cashier's own Cashier Position screen by hand. --> every cashier's own Cashier Position screen by hand. -->
src/app/cashier/branch-day/branch-day.component.scss
-69
View File
@@ -195,75 +195,6 @@
font-size: 11px; font-size: 11px;
color: #94a3b8; color: #94a3b8;
} }
/* Names the block, for the interest panels that sit beside the cash arithmetic. */
&__head {
display: flex;
align-items: center;
gap: 6px;
margin-bottom: 6px;
padding-bottom: 6px;
border-bottom: 1px solid #e2e8f0;
font-size: 13px;
color: #0d1b2a;
mat-icon {
font-size: 18px;
width: 18px;
height: 18px;
color: #1d4ed8;
}
}
}
/* Interest is money leaving as the day closes, not cash counted in the drawer. */
.bd-calc--fd {
border-left: 3px solid #1d4ed8;
}
.bd-fd-ok,
.bd-fd-pending {
display: inline-block;
margin-left: 6px;
padding: 1px 7px;
border-radius: 999px;
font-size: 10px;
font-weight: 700;
letter-spacing: 0.02em;
}
.bd-fd-ok {
background: #dcfce7;
color: #15803d;
}
.bd-fd-pending {
background: #fef3c7;
color: #b45309;
}
/* Why the close will be refused, said before the count is filled in rather than after. */
.bd-warn {
display: flex;
align-items: flex-start;
gap: 8px;
max-width: 640px;
margin-bottom: 14px;
padding: 10px 14px;
background: #fffbeb;
border: 1px solid #fcd34d;
border-radius: 8px;
font-size: 12px;
line-height: 1.5;
color: #78350f;
mat-icon {
flex-shrink: 0;
font-size: 20px;
width: 20px;
height: 20px;
color: #b45309;
}
} }
.bd-hint { .bd-hint {
src/app/core/http/cache.interceptor.ts
+1 -9
View File
@@ -36,15 +36,7 @@ export class CacheInterceptor implements HttpInterceptor {
'/rbireserveconfig', '/rbireserveconfig',
'/tdsconfig', '/tdsconfig',
'/tds/deposit-interest', '/tds/deposit-interest',
'/savingsinterestpostingreports', '/savingsinterestpostingreports'
// Cash in vaults and drawers changes with every transaction; a cached teller list or position
// kept showing a branch's old tellers and figures at day close.
'/tellers',
'/cashreports',
'/cashreconciliation',
'/cashsettlement',
'/cashtransfer',
'/branchday'
]; ];
private isCacheable(url: string): boolean { private isCacheable(url: string): boolean {
src/app/core/shell/shell.component.html
+275 -369
View File
@@ -503,8 +503,7 @@
[matMenuTriggerFor]="loanOriginationMenu" [matMenuTriggerFor]="loanOriginationMenu"
*mifosxHasPermission="'MENU_LOAN_ORIGINATION'" *mifosxHasPermission="'MENU_LOAN_ORIGINATION'"
> >
<fa-icon icon="clipboard-check" class="ni-ico"></fa-icon><span class="ni-full">Loan Origination</span <fa-icon icon="clipboard-check" class="ni-ico"></fa-icon>Loan Origination
><span class="ni-short">Loans</span>
<fa-icon icon="caret-down" class="ni-caret"></fa-icon> <fa-icon icon="caret-down" class="ni-caret"></fa-icon>
</a> </a>
<a <a
@@ -513,8 +512,7 @@
(click)="glMenuOpen = !glMenuOpen; subLedgerOpen = false" (click)="glMenuOpen = !glMenuOpen; subLedgerOpen = false"
*mifosxHasPermission="'MENU_GENERAL_LEDGER'" *mifosxHasPermission="'MENU_GENERAL_LEDGER'"
> >
<fa-icon icon="book-open" class="ni-ico"></fa-icon><span class="ni-full">General Ledger</span <fa-icon icon="book-open" class="ni-ico"></fa-icon>General Ledger
><span class="ni-short">GL</span>
<fa-icon [icon]="glMenuOpen ? 'caret-up' : 'caret-down'" class="ni-caret"></fa-icon> <fa-icon [icon]="glMenuOpen ? 'caret-up' : 'caret-down'" class="ni-caret"></fa-icon>
</a> </a>
<a <a
@@ -523,8 +521,7 @@
(click)="subLedgerOpen = !subLedgerOpen; glMenuOpen = false" (click)="subLedgerOpen = !subLedgerOpen; glMenuOpen = false"
*mifosxHasPermission="'MENU_SUB_LEDGER'" *mifosxHasPermission="'MENU_SUB_LEDGER'"
> >
<fa-icon icon="book" class="ni-ico"></fa-icon><span class="ni-full">Sub Ledger</span <fa-icon icon="book" class="ni-ico"></fa-icon>Sub Ledger
><span class="ni-short">Sub GL</span>
<fa-icon [icon]="subLedgerOpen ? 'caret-up' : 'caret-down'" class="ni-caret"></fa-icon> <fa-icon [icon]="subLedgerOpen ? 'caret-up' : 'caret-down'" class="ni-caret"></fa-icon>
</a> </a>
</div> </div>
@@ -586,16 +583,14 @@
[matMenuTriggerFor]="reconciliationMenu" [matMenuTriggerFor]="reconciliationMenu"
*mifosxHasPermission="'MENU_CONFIG_WIZARD'" *mifosxHasPermission="'MENU_CONFIG_WIZARD'"
> >
<fa-icon icon="sync-alt" class="ni-ico"></fa-icon><span class="ni-full">Reconciliation</span <fa-icon icon="sync-alt" class="ni-ico"></fa-icon>Reconciliation
><span class="ni-short">Recon</span>
<fa-icon icon="caret-down" class="ni-caret"></fa-icon> <fa-icon icon="caret-down" class="ni-caret"></fa-icon>
</a> </a>
<a class="ni" tabindex="0" routerLink="/chequebook" *mifosxHasPermission="'MENU_CHEQUEBOOK'"> <a class="ni" tabindex="0" routerLink="/chequebook" *mifosxHasPermission="'MENU_CHEQUEBOOK'">
<fa-icon icon="book" class="ni-ico"></fa-icon>Cheque Book <fa-icon icon="book" class="ni-ico"></fa-icon>Cheque Book
</a> </a>
<a class="ni" tabindex="0" [matMenuTriggerFor]="letterMgmtMenu" *mifosxHasPermission="'MENU_LETTER_MGMT'"> <a class="ni" tabindex="0" [matMenuTriggerFor]="letterMgmtMenu" *mifosxHasPermission="'MENU_LETTER_MGMT'">
<fa-icon icon="envelope" class="ni-ico"></fa-icon><span class="ni-full">Documents Hub</span <fa-icon icon="envelope" class="ni-ico"></fa-icon>Documents Hub
><span class="ni-short">Docs Hub</span>
<fa-icon icon="caret-down" class="ni-caret"></fa-icon> <fa-icon icon="caret-down" class="ni-caret"></fa-icon>
</a> </a>
</div> </div>
@@ -622,89 +617,77 @@
</button> </button>
</mat-menu> </mat-menu>
<mat-menu #reportsMenu="matMenu" class="reports-mega-panel" [overlapTrigger]="false"> <mat-menu #reportsMenu="matMenu" [overlapTrigger]="false" class="nav-dropdown">
<div class="deposit-menu-grid reports-grid" (click)="$event.stopPropagation()"> <button mat-menu-item [routerLink]="['/branch-ops/account-register']" tabindex="0">
<!-- Core Reports --> <i class="fa fa-book menu-item-icon"></i> Account Register
<div class="deposit-menu-group"> </button>
<div class="deposit-group-title">Core Reports</div> <button mat-menu-item [routerLink]="['/reports']" tabindex="0">
<button mat-menu-item [routerLink]="['/branch-ops/account-register']" tabindex="0"> <i class="fa fa-th-list menu-item-icon"></i> All Reports
<i class="fa fa-book menu-item-icon"></i> Account Register </button>
</button> <button mat-menu-item [routerLink]="['/reports', 'Client']" tabindex="0">
<button mat-menu-item [routerLink]="['/reports']" tabindex="0"> <i class="fa fa-user menu-item-icon"></i> Clients
<i class="fa fa-th-list menu-item-icon"></i> All Reports </button>
</button> <button mat-menu-item [routerLink]="['/reports', 'Loan']" tabindex="0">
<button mat-menu-item [routerLink]="['/reports', 'Client']" tabindex="0"> <i class="fa fa-credit-card menu-item-icon"></i> Loans
<i class="fa fa-user menu-item-icon"></i> Clients </button>
</button> <button mat-menu-item [routerLink]="['/reports', 'Savings']" tabindex="0">
<button mat-menu-item [routerLink]="['/reports', 'Loan']" tabindex="0"> <i class="fa fa-piggy-bank menu-item-icon"></i> Savings
<i class="fa fa-credit-card menu-item-icon"></i> Loans </button>
</button> <button mat-menu-item [routerLink]="['/reports', 'Fund']" tabindex="0">
<button mat-menu-item [routerLink]="['/reports', 'Savings']" tabindex="0"> <i class="fa fa-hand-holding-usd menu-item-icon"></i> Funds
<i class="fa fa-piggy-bank menu-item-icon"></i> Savings </button>
</button> <button mat-menu-item [routerLink]="['/reports', 'Accounting']" tabindex="0">
<button mat-menu-item [routerLink]="['/reports', 'Fund']" tabindex="0"> <i class="fa fa-calculator menu-item-icon"></i> Accounting
<i class="fa fa-hand-holding-usd menu-item-icon"></i> Funds </button>
</button> <mat-divider></mat-divider>
<button mat-menu-item [routerLink]="['/reports', 'Accounting']" tabindex="0"> <!-- Listed here as well as under Branch Ops: an officer looking for the day's figures reaches
<i class="fa fa-calculator menu-item-icon"></i> Accounting for Reports, and the same screen answers both. -->
</button> <button mat-menu-item routerLink="/branch-ops/day-book" tabindex="0">
</div> <i class="fa fa-book menu-item-icon"></i> Day Book &amp; Officer Verification
</button>
<!-- Operations & Interest --> <button mat-menu-item routerLink="/branch-ops/end-of-day" tabindex="0">
<div class="deposit-menu-group"> <i class="fa fa-clipboard-check menu-item-icon"></i> End of the Day Report
<div class="deposit-group-title">Operations &amp; Interest</div> </button>
<button mat-menu-item routerLink="/branch-ops/day-book" tabindex="0"> <button mat-menu-item routerLink="/reports/form-97-98" tabindex="0">
<i class="fa fa-book menu-item-icon"></i> Day Book &amp; Officer Verification <i class="fa fa-file-invoice menu-item-icon"></i> Form 97/98 Transaction Report
</button> </button>
<button mat-menu-item routerLink="/branch-ops/end-of-day" tabindex="0"> <button mat-menu-item routerLink="/reports/risk-review" tabindex="0">
<i class="fa fa-clipboard-check menu-item-icon"></i> End of the Day Report <i class="fa fa-user-shield menu-item-icon"></i> Risk Review Report
</button> </button>
<button mat-menu-item routerLink="/reports/savings-interest" tabindex="0"> <button mat-menu-item routerLink="/reports/kyc-expiry" tabindex="0">
<i class="fa fa-percentage menu-item-icon"></i> Savings Interest Posted <i class="fa fa-id-card menu-item-icon"></i> Re-KYC Expiry &amp; Outreach
</button> </button>
<button mat-menu-item routerLink="/reports/interest-posting" tabindex="0"> <button mat-menu-item routerLink="/reports/dormancy" tabindex="0">
<i class="fa fa-clipboard-check menu-item-icon"></i> Interest Posting Reports <i class="fa fa-hourglass-half menu-item-icon"></i> Inactive, Dormant &amp; DEAF
</button> </button>
<button mat-menu-item routerLink="/reports/fd-interest-posting" tabindex="0"> <button mat-menu-item routerLink="/reports/savings-interest" tabindex="0">
<i class="fa fa-clipboard-check menu-item-icon"></i> FD Interest Posting Reports <i class="fa fa-percentage menu-item-icon"></i> Savings Interest Posted
</button> </button>
<button mat-menu-item routerLink="/reports/interest-posting-summary" tabindex="0"> <button mat-menu-item routerLink="/reports/interest-posting" tabindex="0">
<i class="fa fa-table menu-item-icon"></i> Interest Posting Summary (Branch-wise) <i class="fa fa-clipboard-check menu-item-icon"></i> Interest Posting Reports
</button> </button>
<button mat-menu-item routerLink="/reports/tds-interest" tabindex="0"> <button mat-menu-item routerLink="/reports/interest-posting-summary" tabindex="0">
<i class="fa fa-percent menu-item-icon"></i> Deposit Interest &amp; TDS <i class="fa fa-table menu-item-icon"></i> Interest Posting Summary (Branch-wise)
</button> </button>
</div> <!--
The Principal Officer clears flagged UNSC screenings here. It is not a runnable report,
<!-- Compliance & Registers --> so it never shows up under the report categories above and had no nav entry at all.
<div class="deposit-menu-group"> -->
<div class="deposit-group-title">Compliance &amp; Registers</div> <button mat-menu-item routerLink="/reports/sanctions-logs" tabindex="0">
<button mat-menu-item routerLink="/reports/form-97-98" tabindex="0"> <i class="fa fa-shield-alt menu-item-icon"></i> Sanctions Screening &amp; Alerts
<i class="fa fa-file-invoice menu-item-icon"></i> Form 97/98 Transaction Report </button>
</button> <button mat-menu-item routerLink="/reports/dip-lookups" tabindex="0">
<button mat-menu-item routerLink="/reports/risk-review" tabindex="0"> <i class="fa fa-satellite-dish menu-item-icon"></i> DIP / MNRL Mobile Lookups
<i class="fa fa-user-shield menu-item-icon"></i> Risk Review Report </button>
</button> <button mat-menu-item routerLink="/reports/tds-interest" tabindex="0">
<button mat-menu-item routerLink="/reports/kyc-expiry" tabindex="0"> <i class="fa fa-percent menu-item-icon"></i> Deposit Interest &amp; TDS
<i class="fa fa-id-card menu-item-icon"></i> Re-KYC Expiry &amp; Outreach </button>
</button> <button mat-menu-item routerLink="/reports/tds-remittance" tabindex="0">
<button mat-menu-item routerLink="/reports/dormancy" tabindex="0"> <i class="fa fa-landmark menu-item-icon"></i> TDS Remitted to Government
<i class="fa fa-hourglass-half menu-item-icon"></i> Inactive, Dormant &amp; DEAF </button>
</button> <button mat-menu-item routerLink="/reports/bor" tabindex="0">
<button mat-menu-item routerLink="/reports/sanctions-logs" tabindex="0"> <i class="fa fa-gavel menu-item-icon"></i> BOR Register &mdash; Share Capital
<i class="fa fa-shield-alt menu-item-icon"></i> Sanctions Screening &amp; Alerts </button>
</button>
<button mat-menu-item routerLink="/reports/dip-lookups" tabindex="0">
<i class="fa fa-satellite-dish menu-item-icon"></i> DIP / MNRL Mobile Lookups
</button>
<button mat-menu-item routerLink="/reports/tds-remittance" tabindex="0">
<i class="fa fa-landmark menu-item-icon"></i> TDS Remitted to Government
</button>
<button mat-menu-item routerLink="/reports/bor" tabindex="0">
<i class="fa fa-gavel menu-item-icon"></i> BOR Register &mdash; Share Capital
</button>
</div>
</div>
</mat-menu> </mat-menu>
<!-- Admin Mega Menu — 3-column rectangular panel grouping Setup, <!-- Admin Mega Menu — 3-column rectangular panel grouping Setup,
@@ -1077,146 +1060,121 @@
<!-- Sub Menu Dropdowns --> <!-- Sub Menu Dropdowns -->
<!-- Branch-level operations. Starts with the day register; other branch-wide controls belong <!-- Branch-level operations. Starts with the day register; other branch-wide controls belong
here rather than under Cashier, which is one role's workspace. --> here rather than under Cashier, which is one role's workspace. -->
<mat-menu #branchOpsMenu="matMenu" class="branch-ops-mega-panel" [overlapTrigger]="false"> <mat-menu #branchOpsMenu="matMenu" [overlapTrigger]="false" class="nav-dropdown">
<div class="deposit-menu-grid branch-ops-grid" (click)="$event.stopPropagation()"> <button mat-menu-item tabindex="0" [routerLink]="['/branch-ops/day-register']">
<div class="deposit-menu-group"> <fa-icon icon="calendar-check" class="menu-item-icon"></fa-icon> Day Open / Day Close
<div class="deposit-group-title">Day Operations</div> </button>
<button mat-menu-item tabindex="0" [routerLink]="['/branch-ops/day-register']"> <button mat-menu-item tabindex="0" [routerLink]="['/branch-ops/missed-close']">
<fa-icon icon="calendar-check" class="menu-item-icon"></fa-icon> Day Open / Day Close <fa-icon icon="exclamation-triangle" class="menu-item-icon"></fa-icon> Missed Close Register
</button> </button>
<button mat-menu-item tabindex="0" [routerLink]="['/branch-ops/missed-close']"> <button mat-menu-item tabindex="0" [routerLink]="['/branch-ops/vault-position']">
<fa-icon icon="exclamation-triangle" class="menu-item-icon"></fa-icon> Missed Close Register <fa-icon icon="lock" class="menu-item-icon"></fa-icon> Vault Position
</button> </button>
<button mat-menu-item tabindex="0" [routerLink]="['/branch-ops/vault-position']"> <!-- The day book carries the Officer Verification Sheet — each person's credit, debit and net
<fa-icon icon="lock" class="menu-item-icon"></fa-icon> Vault Position for the day. It was reachable only from the Clerk and Cashier menus, which is the one
</button> place a principal officer signing the day off does not look. -->
</div> <button mat-menu-item tabindex="0" [routerLink]="['/branch-ops/day-book']">
<div class="deposit-menu-group"> <fa-icon icon="book" class="menu-item-icon"></fa-icon> Day Book &amp; Verification
<div class="deposit-group-title">Verification &amp; Reports</div> </button>
<button mat-menu-item tabindex="0" [routerLink]="['/branch-ops/day-book']"> <!-- The signed sheet, as against the day book's working list: the day's modes, the drawer
<fa-icon icon="book" class="menu-item-icon"></fa-icon> Day Book &amp; Verification against the books, and what is still open. This is what goes in the file. -->
</button> <button mat-menu-item tabindex="0" [routerLink]="['/branch-ops/end-of-day']">
<button mat-menu-item tabindex="0" [routerLink]="['/branch-ops/end-of-day']"> <fa-icon icon="clipboard-check" class="menu-item-icon"></fa-icon> End of the Day Report
<fa-icon icon="clipboard-check" class="menu-item-icon"></fa-icon> End of the Day Report </button>
</button>
</div>
</div>
</mat-menu> </mat-menu>
<!-- Clerk Desk --> <!-- Clerk was a bare link straight into the fullscreen dashboard, which left the clerk's other
<mat-menu #clerkMenu="matMenu" class="clerk-mega-panel" [overlapTrigger]="false"> screens reachable only from inside that fullscreen nav. Anything a clerk needs from the
<div class="deposit-menu-grid clerk-grid" (click)="$event.stopPropagation()"> normal shell — an open voucher exception above all — belongs here. -->
<!-- Clerk Desk --> <mat-menu #clerkMenu="matMenu" [overlapTrigger]="false" class="nav-dropdown">
<div class="deposit-menu-group"> <button mat-menu-item tabindex="0" routerLink="/clerk/dashboard" (click)="hideShellLayout = true">
<div class="deposit-group-title">Clerk Desk</div> <fa-icon icon="id-card" class="menu-item-icon"></fa-icon> Clerk Dashboard
<button mat-menu-item tabindex="0" routerLink="/clerk/dashboard" (click)="hideShellLayout = true"> </button>
<fa-icon icon="id-card" class="menu-item-icon"></fa-icon> Clerk Dashboard <!-- The clerk reads the day as a sheet to sign off, not as a working list of vouchers: the
</button> day's summary, the counter counted against the books, and what is still open. The day
<button mat-menu-item tabindex="0" [routerLink]="['/clerk/withdrawal-requests']"> book's own row-by-row view stays reachable from Branch Ops and from the Cashier menu. -->
<fa-icon icon="money-bill-wave" class="menu-item-icon"></fa-icon> My Withdrawal Requests <button mat-menu-item tabindex="0" [routerLink]="['/clerk/end-of-day']">
</button> <fa-icon icon="clipboard-check" class="menu-item-icon"></fa-icon> End of the Day Report
<button mat-menu-item tabindex="0" [routerLink]="['/clerk/my-disbursement-requests']"> </button>
<fa-icon icon="exchange" class="menu-item-icon"></fa-icon> Disbursements &amp; Transfer <button mat-menu-item tabindex="0" [routerLink]="['/clerk/withdrawal-requests']">
</button> <fa-icon icon="money-bill-wave" class="menu-item-icon"></fa-icon> My Withdrawal Requests
<button mat-menu-item tabindex="0" [routerLink]="['/clerk/dividend-dashboard']"> </button>
<fa-icon icon="chart-pie" class="menu-item-icon"></fa-icon> Dividend Dashboard <button mat-menu-item tabindex="0" [routerLink]="['/clerk/my-disbursement-requests']">
</button> <fa-icon icon="exchange" class="menu-item-icon"></fa-icon> Disbursements &amp; Transfer
</div> </button>
<button mat-menu-item tabindex="0" [routerLink]="['/clerk/dividend-dashboard']">
<!-- Vouchers --> <fa-icon icon="chart-pie" class="menu-item-icon"></fa-icon> Dividend Dashboard
<div class="deposit-menu-group"> </button>
<div class="deposit-group-title">Vouchers</div> <button mat-menu-item tabindex="0" [routerLink]="['/clerk/my-work']">
<button mat-menu-item tabindex="0" [routerLink]="['/clerk/my-work']"> <fa-icon icon="user-check" class="menu-item-icon"></fa-icon> My Vouchers
<fa-icon icon="user-check" class="menu-item-icon"></fa-icon> My Vouchers </button>
</button> <!-- Sits under My Vouchers because it answers the same question for the one worker who has no
<button mat-menu-item tabindex="0" [routerLink]="['/clerk/system-vouchers']"> own list: the system. A nightly run belongs to nobody, so it appears on no person's page. -->
<fa-icon icon="robot" class="menu-item-icon"></fa-icon> System Vouchers <button mat-menu-item tabindex="0" [routerLink]="['/clerk/system-vouchers']">
</button> <fa-icon icon="robot" class="menu-item-icon"></fa-icon> System Vouchers
<button mat-menu-item tabindex="0" [routerLink]="['/clerk/received-report']"> </button>
<fa-icon icon="receipt" class="menu-item-icon"></fa-icon> Received Vouchers <!-- A clerk supervises the counter, so they need to see what each cashier is holding and what
</button> went through their drawer. Both screens already return every cashier for a non-cashier
<button mat-menu-item tabindex="0" [routerLink]="['/clerk/payment-report']"> caller (CashierRoleHelper scopes only a cashier to themselves) — they were simply not
<fa-icon icon="receipt" class="menu-item-icon"></fa-icon> Payment Vouchers reachable from this menu. -->
</button> <button mat-menu-item tabindex="0" [routerLink]="['/cashier/cashier-position']">
</div> <fa-icon icon="wallet" class="menu-item-icon"></fa-icon> Cashier Position
</button>
<!-- Counter & Reports --> <button mat-menu-item tabindex="0" [routerLink]="['/cashier/closing-report']">
<div class="deposit-menu-group"> <fa-icon icon="file-invoice" class="menu-item-icon"></fa-icon> Closing Cash Report
<div class="deposit-group-title">Counter &amp; Reports</div> </button>
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/cashier-position']"> <button mat-menu-item tabindex="0" [routerLink]="['/clerk/received-report']">
<fa-icon icon="wallet" class="menu-item-icon"></fa-icon> Cashier Position <fa-icon icon="receipt" class="menu-item-icon"></fa-icon> Received Vouchers
</button> </button>
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/closing-report']"> <button mat-menu-item tabindex="0" [routerLink]="['/clerk/payment-report']">
<fa-icon icon="file-invoice" class="menu-item-icon"></fa-icon> Closing Cash Report <fa-icon icon="receipt" class="menu-item-icon"></fa-icon> Payment Vouchers
</button> </button>
<button mat-menu-item tabindex="0" [routerLink]="['/clerk/end-of-day']">
<fa-icon icon="clipboard-check" class="menu-item-icon"></fa-icon> End of the Day Report
</button>
</div>
</div>
</mat-menu> </mat-menu>
<!-- Cashier Desk --> <mat-menu #cashierMenu="matMenu" [overlapTrigger]="false" class="nav-dropdown">
<mat-menu #cashierMenu="matMenu" class="cashier-mega-panel" [overlapTrigger]="false"> <button mat-menu-item tabindex="0" [routerLink]="['/cashier/cash-exchange']">
<div class="deposit-menu-grid cashier-grid" (click)="$event.stopPropagation()"> <fa-icon icon="exchange" class="menu-item-icon"></fa-icon> Cash Exchange Entry
<!-- Cash Entries & Exchange --> </button>
<div class="deposit-menu-group"> <button mat-menu-item tabindex="0" [routerLink]="['/system/denomination-master']">
<div class="deposit-group-title">Cash &amp; Counter</div> <fa-icon icon="coins" class="menu-item-icon"></fa-icon> Cash Denomination
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/cash-exchange']"> </button>
<fa-icon icon="exchange" class="menu-item-icon"></fa-icon> Cash Exchange Entry <button mat-menu-item tabindex="0" [routerLink]="['/cashier/closing-report']">
</button> <fa-icon icon="file-alt" class="menu-item-icon"></fa-icon> Closing Cash Report
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/exchange-detail']"> </button>
<fa-icon icon="globe" class="menu-item-icon"></fa-icon> Currency Exchange Detail <button mat-menu-item tabindex="0" [routerLink]="['/cashier/exchange-detail']">
</button> <fa-icon icon="globe" class="menu-item-icon"></fa-icon> Currency Exchange Detail
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/transaction-entry']"> </button>
<fa-icon icon="keyboard" class="menu-item-icon"></fa-icon> Transaction Entry <button mat-menu-item tabindex="0" [routerLink]="['/cashier/cash-transfer']">
</button> <fa-icon icon="random" class="menu-item-icon"></fa-icon> Cash Transfer
<button mat-menu-item tabindex="0" [routerLink]="['/system/denomination-master']"> </button>
<fa-icon icon="coins" class="menu-item-icon"></fa-icon> Cash Denomination <button mat-menu-item tabindex="0" [routerLink]="['/cashier/excess-report']">
</button> <fa-icon icon="exclamation-circle" class="menu-item-icon"></fa-icon> Excess Transaction Report
</div> </button>
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/cash-settlement']">
<!-- Transfers & Settlement --> <fa-icon icon="check-circle" class="menu-item-icon"></fa-icon> Cash Settlement
<div class="deposit-menu-group"> </button>
<div class="deposit-group-title">Transfers &amp; Settlement</div> <button mat-menu-item tabindex="0" [routerLink]="['/cashier/inter-cashier']">
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/cash-transfer']"> <fa-icon icon="exchange-alt" class="menu-item-icon"></fa-icon> Inter-Cashier Transfer
<fa-icon icon="random" class="menu-item-icon"></fa-icon> Cash Transfer </button>
</button> <button mat-menu-item tabindex="0" [routerLink]="['/cashier/cashier-position']">
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/inter-cashier']"> <fa-icon icon="wallet" class="menu-item-icon"></fa-icon> Cashier Position
<fa-icon icon="exchange-alt" class="menu-item-icon"></fa-icon> Inter-Cashier Transfer </button>
</button> <button mat-menu-item tabindex="0" [routerLink]="['/cashier/reconciliation']">
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/cash-settlement']"> <fa-icon icon="balance-scale" class="menu-item-icon"></fa-icon> Reconciliation
<fa-icon icon="check-circle" class="menu-item-icon"></fa-icon> Cash Settlement </button>
</button> <button mat-menu-item tabindex="0" [routerLink]="['/cashier/cash-history']">
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/cashier-position']"> <fa-icon icon="history" class="menu-item-icon"></fa-icon> Cash History
<fa-icon icon="wallet" class="menu-item-icon"></fa-icon> Cashier Position </button>
</button> <button mat-menu-item tabindex="0" [routerLink]="['/cashier/day-book']">
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/day-book']"> <fa-icon icon="book" class="menu-item-icon"></fa-icon> Day Book
<fa-icon icon="book" class="menu-item-icon"></fa-icon> Day Book </button>
</button> <button mat-menu-item tabindex="0" [routerLink]="['/cashier/transaction-entry']">
</div> <fa-icon icon="keyboard" class="menu-item-icon"></fa-icon> Transaction Entry
</button>
<!-- Reports & Audit -->
<div class="deposit-menu-group">
<div class="deposit-group-title">Reports &amp; Audit</div>
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/closing-report']">
<fa-icon icon="file-alt" class="menu-item-icon"></fa-icon> Closing Cash Report
</button>
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/excess-report']">
<fa-icon icon="exclamation-circle" class="menu-item-icon"></fa-icon> Excess Transaction Report
</button>
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/reconciliation']">
<fa-icon icon="balance-scale" class="menu-item-icon"></fa-icon> Reconciliation
</button>
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/cash-history']">
<fa-icon icon="history" class="menu-item-icon"></fa-icon> Cash History
</button>
</div>
</div>
</mat-menu> </mat-menu>
<mat-menu #depositsMenu="matMenu" class="deposits-mega-panel" [overlapTrigger]="false"> <mat-menu #depositsMenu="matMenu" class="deposits-mega-panel" [overlapTrigger]="false">
<div class="deposit-menu-grid deposits-grid" (click)="$event.stopPropagation()"> <div class="deposit-menu-grid" (click)="$event.stopPropagation()">
<div class="deposit-menu-group"> <div class="deposit-menu-group">
<div class="deposit-group-title">Accounts</div> <div class="deposit-group-title">Accounts</div>
<button mat-menu-item tabindex="0" [routerLink]="['/accounts/savings']"> <button mat-menu-item tabindex="0" [routerLink]="['/accounts/savings']">
@@ -1278,54 +1236,34 @@
</div> </div>
</mat-menu> </mat-menu>
<mat-menu #clearingMenu="matMenu" class="clearing-mega-panel" [overlapTrigger]="false"> <mat-menu #clearingMenu="matMenu" [overlapTrigger]="false" class="nav-dropdown">
<div class="deposit-menu-grid clearing-grid" (click)="$event.stopPropagation()"> <button mat-menu-item tabindex="0" [routerLink]="['/ctsclearing/inward']">
<!-- CTS Clearing --> <fa-icon icon="arrow-left" class="menu-item-icon"></fa-icon> Inward Clearing (CTS)
<div class="deposit-menu-group"> </button>
<div class="deposit-group-title">CTS Clearing</div> <button mat-menu-item tabindex="0" [routerLink]="['/ctsclearing/outward']">
<button mat-menu-item tabindex="0" [routerLink]="['/ctsclearing/inward']"> <fa-icon icon="arrow-right" class="menu-item-icon"></fa-icon> Outward Clearing (CTS)
<fa-icon icon="arrow-left" class="menu-item-icon"></fa-icon> Inward Clearing (CTS) </button>
</button> <button mat-menu-item tabindex="0" [routerLink]="['/ctsclearing/positive-pay']">
<button mat-menu-item tabindex="0" [routerLink]="['/ctsclearing/outward']"> <fa-icon icon="check-circle" class="menu-item-icon"></fa-icon> Positive Pay (PPS)
<fa-icon icon="arrow-right" class="menu-item-icon"></fa-icon> Outward Clearing (CTS) </button>
</button> <button mat-menu-item tabindex="0" [routerLink]="['/ctsclearing/settlement']">
<button mat-menu-item tabindex="0" [routerLink]="['/ctsclearing/positive-pay']"> <fa-icon icon="check-circle" class="menu-item-icon"></fa-icon> Settlement
<fa-icon icon="check-circle" class="menu-item-icon"></fa-icon> Positive Pay (PPS) </button>
</button> <button mat-menu-item tabindex="0" [routerLink]="['/ctsclearing/reconciliation']">
</div> <fa-icon icon="check-circle" class="menu-item-icon"></fa-icon> Reconciliation
</button>
<!-- Settlement & Recon --> <button mat-menu-item tabindex="0" [routerLink]="['/nachclearing']">
<div class="deposit-menu-group"> <fa-icon icon="money-check" class="menu-item-icon"></fa-icon> NACH Clearing
<div class="deposit-group-title">Settlement &amp; Recon</div> </button>
<button mat-menu-item tabindex="0" [routerLink]="['/ctsclearing/settlement']"> <button mat-menu-item tabindex="0"><fa-icon icon="arrow-right" class="menu-item-icon"></fa-icon> Outward</button>
<fa-icon icon="check-circle" class="menu-item-icon"></fa-icon> Settlement <button mat-menu-item tabindex="0"><fa-icon icon="arrow-left" class="menu-item-icon"></fa-icon> Inward</button>
</button> <button mat-menu-item [routerLink]="['/sponsor-dd/inventory']" tabindex="0">
<button mat-menu-item tabindex="0" [routerLink]="['/ctsclearing/reconciliation']"> <fa-icon icon="receipt" class="menu-item-icon"></fa-icon> Sponsor DD Inventory
<fa-icon icon="check-circle" class="menu-item-icon"></fa-icon> Reconciliation </button>
</button>
<button mat-menu-item [routerLink]="['/sponsor-dd/inventory']" tabindex="0">
<fa-icon icon="receipt" class="menu-item-icon"></fa-icon> Sponsor DD Inventory
</button>
</div>
<!-- NACH & Other -->
<div class="deposit-menu-group">
<div class="deposit-group-title">NACH &amp; Direct</div>
<button mat-menu-item tabindex="0" [routerLink]="['/nachclearing']">
<fa-icon icon="money-check" class="menu-item-icon"></fa-icon> NACH Clearing
</button>
<button mat-menu-item tabindex="0">
<fa-icon icon="arrow-right" class="menu-item-icon"></fa-icon> Outward
</button>
<button mat-menu-item tabindex="0">
<fa-icon icon="arrow-left" class="menu-item-icon"></fa-icon> Inward
</button>
</div>
</div>
</mat-menu> </mat-menu>
<mat-menu #hrmMenu="matMenu" class="hrm-mega-panel" [overlapTrigger]="false"> <mat-menu #hrmMenu="matMenu" class="hrm-mega-panel" [overlapTrigger]="false">
<div class="deposit-menu-grid hrm-grid" (click)="$event.stopPropagation()"> <div class="deposit-menu-grid" (click)="$event.stopPropagation()">
<!-- Payroll --> <!-- Payroll -->
<div class="deposit-menu-group"> <div class="deposit-menu-group">
<div class="deposit-group-title">Payroll</div> <div class="deposit-group-title">Payroll</div>
@@ -1632,33 +1570,23 @@
</div> </div>
</mat-menu> </mat-menu>
<mat-menu #ckycMenu="matMenu" class="ckyc-mega-panel" [overlapTrigger]="false"> <mat-menu #ckycMenu="matMenu" [overlapTrigger]="false" class="nav-dropdown">
<div class="deposit-menu-grid ckyc-grid" (click)="$event.stopPropagation()"> <button mat-menu-item routerLink="/ckyc" tabindex="0">
<!-- KYC Operations --> <fa-icon icon="id-card" class="menu-item-icon"></fa-icon> CKYC Management
<div class="deposit-menu-group"> </button>
<div class="deposit-group-title">KYC Operations</div> <button mat-menu-item tabindex="0" (click)="openCkycReportsDialog('REKYC')">
<button mat-menu-item routerLink="/ckyc" tabindex="0"> <fa-icon icon="sync-alt" class="menu-item-icon" style="color: #be185d"></fa-icon> Re-KYC Report
<fa-icon icon="id-card" class="menu-item-icon"></fa-icon> CKYC Management </button>
</button> <button mat-menu-item tabindex="0" (click)="openCkycReportsDialog('RISK-REVIEW')">
<button mat-menu-item tabindex="0"> <fa-icon icon="history" class="menu-item-icon" style="color: #be185d"></fa-icon> Risk Review
<fa-icon icon="database" class="menu-item-icon" style="color: #be185d"></fa-icon> Dump KYC &amp; Loan Data </button>
</button> <button mat-menu-item tabindex="0" (click)="openCkycReportsDialog('CERSAI')">
</div> <fa-icon icon="shield-alt" class="menu-item-icon" style="color: #be185d"></fa-icon> CERSAI Report
</button>
<!-- Reports & Screening --> <mat-divider></mat-divider>
<div class="deposit-menu-group"> <button mat-menu-item tabindex="0">
<div class="deposit-group-title">Reports &amp; Screening</div> <fa-icon icon="database" class="menu-item-icon" style="color: #be185d"></fa-icon> Dump KYC &amp; Loan Data
<button mat-menu-item tabindex="0" (click)="openCkycReportsDialog('REKYC')"> </button>
<fa-icon icon="sync-alt" class="menu-item-icon" style="color: #be185d"></fa-icon> Re-KYC Report
</button>
<button mat-menu-item tabindex="0" (click)="openCkycReportsDialog('RISK-REVIEW')">
<fa-icon icon="history" class="menu-item-icon" style="color: #be185d"></fa-icon> Risk Review
</button>
<button mat-menu-item tabindex="0" (click)="openCkycReportsDialog('CERSAI')">
<fa-icon icon="shield-alt" class="menu-item-icon" style="color: #be185d"></fa-icon> CERSAI Report
</button>
</div>
</div>
</mat-menu> </mat-menu>
<!-- CFCFRMS — single landing page (CfcfrmsShell) hosts the full <!-- CFCFRMS — single landing page (CfcfrmsShell) hosts the full
@@ -1676,11 +1604,11 @@
</button> </button>
<button mat-menu-item tabindex="0" routerLink="/reconciliation/sundry-dr-cr"> <button mat-menu-item tabindex="0" routerLink="/reconciliation/sundry-dr-cr">
<fa-icon icon="random" class="menu-item-icon" style="color: #0d9488"></fa-icon> <fa-icon icon="random" class="menu-item-icon" style="color: #0d9488"></fa-icon>
Sundry Dr / Cr Sundry Dr / Cr Reconciliation
</button> </button>
<button mat-menu-item tabindex="0" routerLink="/reconciliation/pnl-impact"> <button mat-menu-item tabindex="0" routerLink="/reconciliation/pnl-impact">
<fa-icon icon="chart-line" class="menu-item-icon" style="color: #0d9488"></fa-icon> <fa-icon icon="chart-line" class="menu-item-icon" style="color: #0d9488"></fa-icon>
P&amp;L Impact P&amp;L Impact Reconciliation
</button> </button>
<button mat-menu-item tabindex="0" routerLink="/reconciliation/gl-reconciliation"> <button mat-menu-item tabindex="0" routerLink="/reconciliation/gl-reconciliation">
<fa-icon icon="book-open" class="menu-item-icon" style="color: #0d9488"></fa-icon> <fa-icon icon="book-open" class="menu-item-icon" style="color: #0d9488"></fa-icon>
@@ -1688,11 +1616,11 @@
</button> </button>
<button mat-menu-item tabindex="0" routerLink="/reconciliation/fixed-assets"> <button mat-menu-item tabindex="0" routerLink="/reconciliation/fixed-assets">
<fa-icon icon="cube" class="menu-item-icon" style="color: #0d9488"></fa-icon> <fa-icon icon="cube" class="menu-item-icon" style="color: #0d9488"></fa-icon>
Fixed Assets Fixed Assets Reconciliation
</button> </button>
<button mat-menu-item tabindex="0" routerLink="/reconciliation/inter-company"> <button mat-menu-item tabindex="0" routerLink="/reconciliation/inter-company">
<fa-icon icon="sitemap" class="menu-item-icon" style="color: #0d9488"></fa-icon> <fa-icon icon="sitemap" class="menu-item-icon" style="color: #0d9488"></fa-icon>
Inter-Company Inter-Company Reconciliation
</button> </button>
</div> </div>
@@ -1705,15 +1633,15 @@
</button> </button>
<button mat-menu-item tabindex="0" routerLink="/reconciliation/api-bank-reco"> <button mat-menu-item tabindex="0" routerLink="/reconciliation/api-bank-reco">
<fa-icon icon="code-branch" class="menu-item-icon" style="color: #0d9488"></fa-icon> <fa-icon icon="code-branch" class="menu-item-icon" style="color: #0d9488"></fa-icon>
API Bank Reco API Based Bank Reconciliation
</button> </button>
<button mat-menu-item tabindex="0" routerLink="/reconciliation/neft-rtgs"> <button mat-menu-item tabindex="0" routerLink="/reconciliation/neft-rtgs">
<fa-icon icon="exchange" class="menu-item-icon" style="color: #0d9488"></fa-icon> <fa-icon icon="exchange" class="menu-item-icon" style="color: #0d9488"></fa-icon>
NEFT / RTGS Reco NEFT / RTGS Reconciliation
</button> </button>
<button mat-menu-item tabindex="0" routerLink="/reconciliation/clearing-reco"> <button mat-menu-item tabindex="0" routerLink="/reconciliation/clearing-reco">
<fa-icon icon="hand-holding-usd" class="menu-item-icon" style="color: #0d9488"></fa-icon> <fa-icon icon="hand-holding-usd" class="menu-item-icon" style="color: #0d9488"></fa-icon>
Clearing Reco Clearing Reconciliation
</button> </button>
</div> </div>
@@ -1726,11 +1654,11 @@
</button> </button>
<button mat-menu-item tabindex="0" routerLink="/reconciliation/three-way-digital"> <button mat-menu-item tabindex="0" routerLink="/reconciliation/three-way-digital">
<fa-icon icon="project-diagram" class="menu-item-icon" style="color: #0d9488"></fa-icon> <fa-icon icon="project-diagram" class="menu-item-icon" style="color: #0d9488"></fa-icon>
Three-way Digital Three-way Digital Reconciliation
</button> </button>
<button mat-menu-item tabindex="0" routerLink="/reconciliation/nach-reco"> <button mat-menu-item tabindex="0" routerLink="/reconciliation/nach-reco">
<fa-icon icon="sync-alt" class="menu-item-icon" style="color: #0d9488"></fa-icon> <fa-icon icon="sync-alt" class="menu-item-icon" style="color: #0d9488"></fa-icon>
NACH Reco NACH Reconciliation
</button> </button>
</div> </div>
@@ -1739,11 +1667,11 @@
<div class="deposit-group-title">Instruments &amp; Members</div> <div class="deposit-group-title">Instruments &amp; Members</div>
<button mat-menu-item [routerLink]="['/sponsor-dd-reconciliation']" tabindex="0"> <button mat-menu-item [routerLink]="['/sponsor-dd-reconciliation']" tabindex="0">
<fa-icon icon="money-check-alt" class="menu-item-icon" style="color: #0d9488"></fa-icon> <fa-icon icon="money-check-alt" class="menu-item-icon" style="color: #0d9488"></fa-icon>
DD / Pay Order DD / Pay Order Reconciliation
</button> </button>
<button mat-menu-item tabindex="0" routerLink="/reconciliation/share-member"> <button mat-menu-item tabindex="0" routerLink="/reconciliation/share-member">
<fa-icon icon="coins" class="menu-item-icon" style="color: #0d9488"></fa-icon> <fa-icon icon="coins" class="menu-item-icon" style="color: #0d9488"></fa-icon>
Share Member Share Member Reconciliation
</button> </button>
</div> </div>
@@ -1919,68 +1847,46 @@
</div> </div>
</mat-menu> </mat-menu>
<mat-menu #insuranceMenu="matMenu" class="insurance-mega-panel" [overlapTrigger]="false"> <mat-menu #insuranceMenu="matMenu" [overlapTrigger]="false" class="nav-dropdown">
<div class="deposit-menu-grid insurance-grid" (click)="$event.stopPropagation()"> <button mat-menu-item routerLink="/dicgc" tabindex="0">
<!-- Social & Policy Schemes --> <fa-icon icon="building" class="menu-item-icon" style="color: #c2410c"></fa-icon> DICGC
<div class="deposit-menu-group"> </button>
<div class="deposit-group-title">Schemes &amp; Social</div> <button mat-menu-item tabindex="0"><fa-icon icon="heart" class="menu-item-icon"></fa-icon> PMJBY</button>
<button mat-menu-item routerLink="/dicgc" tabindex="0"> <button mat-menu-item tabindex="0"><fa-icon icon="heart" class="menu-item-icon"></fa-icon> PMSBY</button>
<fa-icon icon="building" class="menu-item-icon" style="color: #c2410c"></fa-icon> DICGC <button mat-menu-item tabindex="0">
</button> <fa-icon icon="hand-holding-heart" class="menu-item-icon"></fa-icon> Indemnity
<button mat-menu-item tabindex="0"><fa-icon icon="heart" class="menu-item-icon"></fa-icon> PMJBY</button> </button>
<button mat-menu-item tabindex="0"><fa-icon icon="heart" class="menu-item-icon"></fa-icon> PMSBY</button> <button mat-menu-item tabindex="0">
<button mat-menu-item tabindex="0"> <fa-icon icon="home" class="menu-item-icon"></fa-icon> Assets Insurance
<fa-icon icon="hand-holding-heart" class="menu-item-icon"></fa-icon> Indemnity </button>
</button> <button mat-menu-item tabindex="0">
</div> <fa-icon icon="laptop" class="menu-item-icon"></fa-icon> Cyber Insurance
</button>
<!-- Institutional & Loans --> <button mat-menu-item tabindex="0">
<div class="deposit-menu-group"> <fa-icon icon="university" class="menu-item-icon"></fa-icon> Bank Insurance
<div class="deposit-group-title">Institutional &amp; Loans</div> </button>
<button mat-menu-item tabindex="0"> <button mat-menu-item tabindex="0">
<fa-icon icon="file-invoice" class="menu-item-icon"></fa-icon> Loan Insurance <fa-icon icon="file-invoice" class="menu-item-icon"></fa-icon> Loan Insurance
</button> </button>
<button mat-menu-item tabindex="0">
<fa-icon icon="home" class="menu-item-icon"></fa-icon> Assets Insurance
</button>
<button mat-menu-item tabindex="0">
<fa-icon icon="laptop" class="menu-item-icon"></fa-icon> Cyber Insurance
</button>
<button mat-menu-item tabindex="0">
<fa-icon icon="university" class="menu-item-icon"></fa-icon> Bank Insurance
</button>
</div>
</div>
</mat-menu> </mat-menu>
<mat-menu #digitalMenu="matMenu" class="digital-mega-panel" [overlapTrigger]="false"> <mat-menu #digitalMenu="matMenu" [overlapTrigger]="false" class="nav-dropdown">
<div class="deposit-menu-grid digital-grid" (click)="$event.stopPropagation()"> <button mat-menu-item routerLink="/digital/neft-rtgs-report" tabindex="0">
<!-- Payment Systems --> <fa-icon icon="exchange" class="menu-item-icon"></fa-icon> NEFT / RTGS
<div class="deposit-menu-group"> </button>
<div class="deposit-group-title">Payments</div> <button mat-menu-item routerLink="/digital/imps-report" tabindex="0">
<button mat-menu-item routerLink="/digital/neft-rtgs-report" tabindex="0"> <fa-icon icon="bolt" class="menu-item-icon"></fa-icon> IMPS
<fa-icon icon="exchange" class="menu-item-icon"></fa-icon> NEFT / RTGS </button>
</button> <button mat-menu-item routerLink="/digital/upi-report" tabindex="0">
<button mat-menu-item routerLink="/digital/imps-report" tabindex="0"> <fa-icon icon="mobile-alt" class="menu-item-icon"></fa-icon> UPI Reports
<fa-icon icon="bolt" class="menu-item-icon"></fa-icon> IMPS </button>
</button> <button mat-menu-item routerLink="/digital/atm-pos-ecom" tabindex="0">
<button mat-menu-item routerLink="/digital/upi-report" tabindex="0"> <fa-icon icon="credit-card" class="menu-item-icon"></fa-icon> ATM / POS / ECOM Reports
<fa-icon icon="mobile-alt" class="menu-item-icon"></fa-icon> UPI Reports </button>
</button> <button mat-menu-item tabindex="0"><fa-icon icon="sync" class="menu-item-icon"></fa-icon> NACH</button>
</div> <button mat-menu-item tabindex="0">
<fa-icon icon="file-signature" class="menu-item-icon"></fa-icon> Mandate
<!-- Cards & Mandates --> </button>
<div class="deposit-menu-group">
<div class="deposit-group-title">Cards &amp; Mandates</div>
<button mat-menu-item routerLink="/digital/atm-pos-ecom" tabindex="0">
<fa-icon icon="credit-card" class="menu-item-icon"></fa-icon> ATM / POS / ECOM Reports
</button>
<button mat-menu-item tabindex="0"><fa-icon icon="sync" class="menu-item-icon"></fa-icon> NACH</button>
<button mat-menu-item tabindex="0">
<fa-icon icon="file-signature" class="menu-item-icon"></fa-icon> Mandate
</button>
</div>
</div>
</mat-menu> </mat-menu>
<!-- RBI Mega Menu --> <!-- RBI Mega Menu -->
src/app/core/shell/shell.component.scss
+123 -196
View File
@@ -266,7 +266,7 @@ $color: #e2e4ec;
max-width: 100%; max-width: 100%;
overflow-x: hidden; overflow-x: hidden;
box-sizing: border-box; box-sizing: border-box;
padding: 10px 18px; padding: 16px 28px;
} }
} }
@@ -282,15 +282,21 @@ $gray-700: #334155;
/* ============================================================ /* ============================================================
Main header (top 2-row navigation) Main header (top 2-row navigation)
-------------------------------------------------------------- --------------------------------------------------------------
Compact, modern enterprise SaaS navigation: Redesigned 2026 — clean, modern enterprise SaaS feel:
• Height reduced to 32px per row (64px total) to save screen space. • Both rows live on the same white surface separated only by a
• Smooth horizontal scrolling prevents menu items from getting cut off. hairline; r2 has a barely-there blue-50 wash so frequent vs
• Compact typography, icons and paddings fit all banking modules cleanly. secondary menus read at a glance without dark/light contrast.
• Items are now equal-width "tabs" with NO vertical dividers
between them (the old cell borders made it look spreadsheet-y).
• Hover / active = a 3 px brand-coloured TOP bar + brand text +
coloured icon. Reads instantly without colour-flooding the row.
• Icons larger (12.5 px) and full-opacity always — easier to scan
during demos. Caret is subtle and rotates on open.
============================================================ */ ============================================================ */
.main-header { .main-header {
background: #fff; background: #fff;
border-bottom: 2px solid $brand; border-bottom: 2.5px solid $brand;
box-shadow: 0 1px 3px rgb(0 0 0 / 6%); box-shadow: 0 1px 4px rgb(0 0 0 / 7%);
position: sticky; position: sticky;
/* Sit directly under the sticky toolbar (32px tall) so both stay visible. */ /* Sit directly under the sticky toolbar (32px tall) so both stay visible. */
@@ -300,19 +306,19 @@ $gray-700: #334155;
} }
.nav-row { .nav-row {
height: 32px; height: 44px;
display: flex; display: flex;
align-items: stretch; align-items: stretch;
overflow: auto visible; overflow: visible;
position: relative; position: relative;
/* Outer frame; vertical dividers between cells are drawn as `border-right`
on each `.ni` below. Switched away from the equal-column grid so each
cell can size to its own label — long names (General Ledger, Documents
Hub) no longer overflow and short ones (Approvals, HRM) no longer waste
space. */
border: 1px solid $gray-200; border: 1px solid $gray-200;
background: #fff; background: #fff;
scrollbar-width: none;
-ms-overflow-style: none;
&::-webkit-scrollbar {
display: none;
}
} }
.r2.nav-row { .r2.nav-row {
@@ -328,17 +334,25 @@ $gray-700: #334155;
background: #f8fafc; background: #f8fafc;
} }
// ===== Nav Item — compact modern tab style ===== // ===== Nav Item — modern tab style =====
// Typography spec — same family / size / weight / color for BOTH rows.
.ni { .ni {
position: relative; position: relative;
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
gap: 2.5px; gap: 7px;
height: 100%; height: 100%;
/* Each cell sizes to its own label (min-width: max-content) and grows
to share any leftover row width. Short labels stay compact, long ones
get the room they need — no overlap, no wasted gap. */
flex: 1 0 auto; flex: 1 0 auto;
min-width: 0; min-width: max-content;
padding: 0 4px; padding: 0 14px;
/* Vertical divider between adjacent cells; outer frame is the row's
own border, and the last cell drops its right border below. */
border-right: 1px solid $gray-200; border-right: 1px solid $gray-200;
cursor: pointer; cursor: pointer;
white-space: nowrap; white-space: nowrap;
@@ -346,11 +360,11 @@ $gray-700: #334155;
'IBM Plex Sans', 'IBM Plex Sans',
-apple-system, -apple-system,
sans-serif; sans-serif;
font-size: 10px; font-size: 12px;
font-weight: 500; font-weight: 500;
color: #0a1a2e; color: #0a1a2e;
line-height: 1.2; line-height: 1.3;
letter-spacing: -0.015em; letter-spacing: 0.01em;
text-decoration: none; text-decoration: none;
user-select: none; user-select: none;
transition: transition:
@@ -359,15 +373,17 @@ $gray-700: #334155;
box-shadow 0.15s ease; box-shadow 0.15s ease;
border-radius: 0; border-radius: 0;
/* 3px accent strip that fills on hover / active (uses ::before so we
don't reflow the row when toggling). */
&::before { &::before {
content: ''; content: '';
position: absolute; position: absolute;
left: 2px; left: 4px;
right: 2px; right: 4px;
top: 0; top: 0;
height: 2px; height: 3px;
background: transparent; background: transparent;
border-radius: 0 0 2px 2px; border-radius: 0 0 3px 3px;
transition: background 0.15s ease; transition: background 0.15s ease;
} }
@@ -394,19 +410,17 @@ $gray-700: #334155;
outline-offset: -2px; outline-offset: -2px;
} }
/* Last cell in a row sits flush against the row's own right edge, so
drop its divider to avoid a double 2 px line. */
&:last-child { &:last-child {
border-right: none; border-right: none;
} }
.ni-short {
display: none;
}
} }
.ni-ico { .ni-ico {
width: 9.5px; width: 12px;
height: 9.5px; height: 12px;
font-size: 9.5px; font-size: 12px;
color: $gray-500; color: $gray-500;
flex-shrink: 0; flex-shrink: 0;
transition: color 0.15s ease; transition: color 0.15s ease;
@@ -418,12 +432,11 @@ $gray-700: #334155;
} }
.ni-caret { .ni-caret {
width: 5px; width: 7px;
height: 5px; height: 7px;
font-size: 5px; font-size: 7px;
color: $gray-400; color: $gray-400;
flex-shrink: 0; flex-shrink: 0;
margin-left: 0.5px;
transition: transition:
transform 0.18s ease, transform 0.18s ease,
color 0.18s ease; color 0.18s ease;
@@ -434,89 +447,17 @@ $gray-700: #334155;
} }
} }
@media (width >= 1400px) {
.ni {
padding: 0 6px;
gap: 3.5px;
font-size: 10.8px;
letter-spacing: 0;
}
.ni-ico {
width: 10px;
height: 10px;
font-size: 10px;
}
.ni-caret {
width: 5.5px;
height: 5.5px;
font-size: 5.5px;
margin-left: 1px;
}
}
@media (width <= 1200px) { @media (width <= 1200px) {
.ni { .ni {
padding: 0 3px; padding: 0 8px;
gap: 2px; gap: 5px;
font-size: 9.8px;
letter-spacing: -0.02em;
}
.ni-ico {
width: 9px;
height: 9px;
font-size: 9px;
}
.ni-caret {
width: 4.5px;
height: 4.5px;
font-size: 4.5px;
} }
} }
@media (width <= 1080px) { @media (width <= 980px) {
.ni { .ni {
padding: 0 2.5px;
gap: 1.5px;
font-size: 9.4px;
letter-spacing: -0.025em;
.ni-full {
display: none;
}
.ni-short {
display: inline;
}
}
.ni-ico {
width: 8.5px;
height: 8.5px;
font-size: 8.5px;
}
.ni-caret {
width: 4px;
height: 4px;
font-size: 4px;
}
}
@media (width <= 880px) {
.nav-row {
overflow-x: auto;
scrollbar-width: thin;
}
.ni {
flex: 0 0 auto;
padding: 0 6px; padding: 0 6px;
gap: 3px; gap: 4px;
font-size: 10px;
} }
} }
@@ -758,29 +699,21 @@ $gray-700: #334155;
// ===== Nav Dropdown Menus ===== // ===== Nav Dropdown Menus =====
::ng-deep .nav-dropdown { ::ng-deep .nav-dropdown {
border-radius: 6px !important; border-radius: 8px !important;
border: 1px solid $gray-200 !important; border: 1px solid $gray-200 !important;
box-shadow: 0 4px 16px rgb(0 0 0 / 12%) !important; box-shadow: 0 6px 24px rgb(0 0 0 / 10%) !important;
min-width: 170px !important; min-width: 180px !important;
padding: 3px 0 !important; padding: 4px 0 !important;
margin-top: 1px !important; margin-top: 2px !important;
.mat-mdc-menu-item { .mat-mdc-menu-item {
font-size: 10.5px !important; font-size: 12.5px !important;
font-weight: 500 !important; font-weight: 500 !important;
height: 25px !important; height: 34px !important;
min-height: 25px !important; min-height: 34px !important;
padding: 0 6px !important; padding: 0 14px !important;
line-height: 25px !important;
color: $gray-700 !important; color: $gray-700 !important;
font-family: 'IBM Plex Sans', Roboto, sans-serif !important; font-family: 'DM Sans', Roboto, sans-serif !important;
white-space: nowrap !important;
.menu-item-icon {
font-size: 10.5px !important;
margin-right: 5px !important;
opacity: 0.8;
}
&:hover { &:hover {
background: $brand-hover !important; background: $brand-hover !important;
@@ -795,44 +728,39 @@ $gray-700: #334155;
} }
/* Deposits Mega Panel (inside mat-menu overlay) */ /* Deposits Mega Panel (inside mat-menu overlay) */
::ng-deep .deposit-menu-grid { .deposit-menu-grid {
display: grid; display: grid;
gap: 4px 12px; grid-template-columns: repeat(3, 1fr);
padding: 6px 10px; gap: 8px 24px;
min-width: 0; padding: 8px 12px;
width: 100%; min-width: 600px;
box-sizing: border-box;
overflow-x: hidden;
} }
::ng-deep .deposit-menu-group { .deposit-menu-group {
.deposit-group-title { .deposit-group-title {
font-weight: 700; font-weight: 700;
font-size: 9.5px; font-size: 11px;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.5px; letter-spacing: 0.6px;
color: #1074b9; color: #1074b9;
padding: 2px 6px 3px; padding: 4px 16px 6px;
margin-bottom: 2px; margin-bottom: 2px;
border-bottom: 1.5px solid #1074b9; border-bottom: 2px solid #1074b9;
white-space: nowrap;
} }
} }
/* NPA Mega Panel — 3 columns */ /* NPA Mega Panel — 4 columns (Reports / Analysis / Classification / Recovery Management) */
::ng-deep .npa-grid { .npa-grid {
grid-template-columns: repeat(3, minmax(210px, 1fr)); grid-template-columns: repeat(4, minmax(200px, 1fr));
min-width: 0; min-width: 880px;
max-width: 100%; max-width: 96vw;
overflow-x: hidden;
} }
/* Reconciliation Mega Panel — 5 columns */ /* Reconciliation Mega Panel — 5 columns, teal accent to match the icon palette */
::ng-deep .reconciliation-grid { .reconciliation-grid {
grid-template-columns: repeat(5, minmax(170px, 1fr)); grid-template-columns: repeat(5, minmax(190px, 1fr));
min-width: 0; min-width: 1040px;
max-width: 100%; max-width: 96vw;
overflow-x: hidden;
.deposit-group-title { .deposit-group-title {
color: #0d9488; color: #0d9488;
@@ -852,49 +780,47 @@ $gray-700: #334155;
.gl-mega-menu { .gl-mega-menu {
position: absolute; position: absolute;
top: 96px; top: 100px;
left: 50%; left: 50%;
transform: translateX(-50%); transform: translateX(-50%);
background: #fff; background: #fff;
width: 760px; width: 860px;
max-width: 94vw; max-width: 95vw;
max-height: 72vh; padding: 20px 24px;
overflow-y: auto; box-shadow: 0 6px 24px rgb(0 0 0 / 22%);
padding: 12px 16px; border-radius: 0 0 10px 10px;
box-shadow: 0 6px 20px rgb(0 0 0 / 18%);
border-radius: 0 0 8px 8px;
z-index: 1000; z-index: 1000;
border-top: 2.5px solid #0d47a1; border-top: 3px solid #0d47a1;
} }
.gl-mega-menu-header { .gl-mega-menu-header {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 8px; gap: 10px;
margin-bottom: 8px; margin-bottom: 14px;
padding-bottom: 6px; padding-bottom: 12px;
border-bottom: 1px solid #e5e7eb; border-bottom: 1px solid #e5e7eb;
span { span {
font-size: 14px; font-size: 18px;
font-weight: 700; font-weight: 700;
color: #0d47a1; color: #0d47a1;
letter-spacing: 0.01em; letter-spacing: 0.02em;
} }
} }
.gl-mega-menu-header-icon { .gl-mega-menu-header-icon {
font-size: 14px; font-size: 18px;
color: #0d47a1; color: #0d47a1;
} }
.gl-search { .gl-search {
width: 100%; width: 100%;
padding: 6px 10px; padding: 10px 14px;
margin-bottom: 10px; margin-bottom: 16px;
border: 1px solid #d0d5dd; border: 1px solid #d0d5dd;
border-radius: 5px; border-radius: 6px;
font-size: 12px; font-size: 14px;
box-sizing: border-box; box-sizing: border-box;
background: #f9fafb; background: #f9fafb;
@@ -902,37 +828,36 @@ $gray-700: #334155;
outline: none; outline: none;
border-color: #0d47a1; border-color: #0d47a1;
background: #fff; background: #fff;
box-shadow: 0 0 0 2px rgb(13 71 161 / 10%); box-shadow: 0 0 0 3px rgb(13 71 161 / 10%);
} }
} }
.gl-columns { .gl-columns {
display: grid; display: grid;
grid-template-columns: repeat(4, 1fr); grid-template-columns: repeat(4, 1fr);
gap: 10px 16px; gap: 24px;
} }
.gl-group-title { .gl-group-title {
font-weight: 700; font-weight: 700;
font-size: 10px; font-size: 11px;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.6px; letter-spacing: 0.8px;
color: #0d47a1; color: #0d47a1;
margin-bottom: 5px; margin-bottom: 10px;
padding-bottom: 3px; padding-bottom: 6px;
border-bottom: 1.5px solid #0d47a1; border-bottom: 2px solid #0d47a1;
} }
.gl-link { .gl-link {
display: flex; display: flex;
align-items: center; align-items: center;
padding: 3.5px 5px; padding: 7px 6px;
text-decoration: none; text-decoration: none;
color: #344054; color: #344054;
font-size: 11.5px; font-size: 13px;
line-height: 1.3;
cursor: pointer; cursor: pointer;
border-radius: 4px; border-radius: 5px;
transition: transition:
background 0.15s, background 0.15s,
color 0.15s; color 0.15s;
@@ -948,21 +873,23 @@ $gray-700: #334155;
} }
.gl-icon { .gl-icon {
width: 14px; width: 18px;
margin-right: 5px; margin-right: 8px;
color: #667085; color: #667085;
font-size: 11px; font-size: 13px;
flex-shrink: 0;
.gl-link:hover & { .gl-link:hover & {
color: #0d47a1; color: #0d47a1;
} }
} }
// Marks a menu link as actually wired to a working screen/dialog (vs a still-unwired
// placeholder) — a small green dot at the end of the row, so a reviewer can tell at a glance
// which items in a mega-menu are functional without having to click every one of them.
.gl-link--live::after { .gl-link--live::after {
content: ''; content: '';
width: 5px; width: 6px;
height: 5px; height: 6px;
margin-left: auto; margin-left: auto;
flex-shrink: 0; flex-shrink: 0;
border-radius: 50%; border-radius: 50%;
@@ -972,9 +899,9 @@ $gray-700: #334155;
/* RBI Mega Menu */ /* RBI Mega Menu */
.rbi-mega-menu { .rbi-mega-menu {
width: 880px; width: 1100px;
max-width: 94vw; max-width: 97vw;
max-height: 72vh; max-height: 80vh;
overflow-y: auto; overflow-y: auto;
border-top-color: #b71c1c; border-top-color: #b71c1c;
} }
@@ -982,7 +909,7 @@ $gray-700: #334155;
.rbi-columns { .rbi-columns {
display: grid; display: grid;
grid-template-columns: repeat(4, 1fr); grid-template-columns: repeat(4, 1fr);
gap: 10px 16px; gap: 20px;
} }
@keyframes move { @keyframes move {
src/app/core/shell/toolbar/toolbar.component.html
+1 -1
View File
@@ -522,7 +522,7 @@
</mat-menu> </mat-menu>
<!-- Application User Help Menu --> <!-- Application User Help Menu -->
<mat-menu #applicationMenu="matMenu" [overlapTrigger]="false" class="t-user-menu" xPosition="before"> <mat-menu #applicationMenu="matMenu" [overlapTrigger]="false">
<button mat-menu-item (click)="help()" tabindex="0"> <button mat-menu-item (click)="help()" tabindex="0">
<mat-icon matListIcon> <mat-icon matListIcon>
<fa-icon icon="question-circle" size="sm"></fa-icon> <fa-icon icon="question-circle" size="sm"></fa-icon>
src/app/core/shell/toolbar/toolbar.component.scss
+58 -186
View File
@@ -390,103 +390,6 @@ $icon-hover-border: rgb(255 255 255 / 28%);
max-height: 80vh; max-height: 80vh;
overflow-y: auto; overflow-y: auto;
} }
// Compact card per AI module
.ai-card.mat-mdc-menu-item {
display: flex !important;
align-items: flex-start !important;
gap: 10px !important;
padding: 10px !important;
min-height: 52px !important;
height: auto !important;
border-radius: 9px !important;
font-family: inherit !important;
line-height: 1.3 !important;
white-space: normal !important;
overflow: visible !important;
transition: background 0.16s ease !important;
.mat-mdc-menu-item-text,
.mdc-list-item__primary-text,
.mdc-list-item__content {
display: flex !important;
align-items: flex-start !important;
gap: 10px !important;
width: 100% !important;
white-space: normal !important;
overflow: visible !important;
}
.ai-card-ic {
width: 32px !important;
height: 32px !important;
min-width: 32px !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
border-radius: 8px !important;
font-size: 13px !important;
flex-shrink: 0 !important;
background: var(--c-bg) !important;
color: var(--c-color) !important;
margin: 0 !important;
opacity: 1 !important;
transition:
background 0.16s ease,
color 0.16s ease,
transform 0.16s ease !important;
fa-icon {
font-size: 13px !important;
width: auto !important;
min-width: auto !important;
margin: 0 !important;
color: inherit !important;
opacity: 1 !important;
}
}
.ai-card-body {
display: flex !important;
flex-direction: column !important;
flex: 1 !important;
min-width: 0 !important;
text-align: left !important;
white-space: normal !important;
}
.ai-card-t {
font-size: 12.5px !important;
font-weight: 600 !important;
color: #0f172a !important;
line-height: 1.25 !important;
white-space: normal !important;
display: block !important;
}
.ai-card-d {
font-size: 10.5px !important;
color: #64748b !important;
margin-top: 3px !important;
line-height: 1.35 !important;
white-space: normal !important;
display: block !important;
}
&:hover {
background: var(--c-bg) !important;
.ai-card-ic {
background: var(--c-hover) !important;
color: #fff !important;
transform: scale(1.06) !important;
}
.ai-card-t {
color: var(--c-color) !important;
}
}
}
} }
.ai-menu-header { .ai-menu-header {
@@ -585,101 +488,70 @@ $icon-hover-border: rgb(255 255 255 / 28%);
font-size: 11px; font-size: 11px;
} }
// ===== User Account Dropdown Menu ===== // Compact card per AI module
::ng-deep .t-user-menu.mat-mdc-menu-panel { .ai-card.mat-mdc-menu-item {
min-width: 190px !important; display: flex !important;
border-radius: 10px !important; align-items: flex-start;
box-shadow: gap: 10px;
0 10px 25px rgb(15 23 42 / 12%), padding: 9px 10px;
0 2px 6px rgb(15 23 42 / 6%) !important; min-height: 0;
border: 1px solid #e2e8f0 !important; height: auto;
padding: 6px 0 !important; border-radius: 9px;
background: #fff !important; font-family: inherit;
line-height: 1.3;
white-space: normal;
transition: background 0.16s ease;
.mat-mdc-menu-content { .ai-card-ic {
padding: 4px 0 !important; width: 32px;
height: 32px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 8px;
font-size: 13px;
flex-shrink: 0;
background: var(--c-bg);
color: var(--c-color);
transition:
background 0.16s ease,
color 0.16s ease,
transform 0.16s ease;
} }
.mat-mdc-menu-item { .ai-card-body {
height: 38px !important; display: flex;
min-height: 38px !important; flex-direction: column;
line-height: 38px !important; flex: 1;
padding: 0 14px !important; min-width: 0;
display: flex !important; text-align: left;
align-items: center !important; }
font-size: 13px !important;
font-weight: 500 !important;
color: #334155 !important;
transition:
background-color 0.15s ease,
color 0.15s ease !important;
.mat-mdc-menu-item-text { .ai-card-t {
display: inline-flex !important; font-size: 12.5px;
align-items: center !important; font-weight: 600;
width: 100% !important; color: #0f172a;
font-size: 13px !important; line-height: 1.25;
color: inherit !important; }
font-weight: 500 !important;
.ai-card-d {
font-size: 10.5px;
color: #64748b;
margin-top: 2px;
line-height: 1.35;
}
&:hover {
background: var(--c-bg);
.ai-card-ic {
background: var(--c-hover);
color: #fff;
transform: scale(1.06);
} }
mat-icon { .ai-card-t {
margin-right: 10px !important; color: var(--c-color);
width: 18px !important;
height: 18px !important;
min-width: 18px !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
color: #64748b !important;
font-size: 14px !important;
flex-shrink: 0 !important;
fa-icon {
font-size: 14px !important;
width: 14px !important;
min-width: 14px !important;
text-align: center !important;
margin-right: 0 !important;
color: inherit !important;
opacity: 1 !important;
}
}
span {
font-size: 13px !important;
color: inherit !important;
font-weight: 500 !important;
white-space: nowrap !important;
}
&:hover {
background-color: #f1f5f9 !important;
color: #0d47a1 !important;
mat-icon {
color: #0d47a1 !important;
}
}
&#logout {
color: #dc2626 !important;
border-top: 1px solid #f1f5f9 !important;
margin-top: 4px !important;
padding-top: 2px !important;
mat-icon {
color: #dc2626 !important;
}
&:hover {
background-color: #fef2f2 !important;
color: #b91c1c !important;
mat-icon {
color: #b91c1c !important;
}
}
} }
} }
} }
src/app/fd-interest-posting-report/fd-interest-posting-report.component.html
-646
View File
@@ -1,646 +0,0 @@
<!--
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/.
-->
<div class="fd">
<div class="fd-head">
<div>
<h2 class="fd-head-t"><fa-icon icon="percentage"></fa-icon> FD Interest Posting Reports</h2>
<div class="fd-head-s">
Each branch gets its own report for each fixed deposit scheme, generated automatically at 12:00 noon on the
posting date. One user puts the figures up and a second approves them — whoever generated a report cannot
approve it. Approved interest posts when the branch closes its day, and it cannot close until then.
</div>
</div>
<div class="fd-head-a">
<label class="fd-date">
Posting date
<input type="date" [(ngModel)]="postingDate" (change)="load()" />
</label>
<button class="fd-btn" (click)="load()" [disabled]="loading"><fa-icon icon="undo"></fa-icon>Reload</button>
<button class="fd-btn fd-btn--primary" (click)="openPreview()" [disabled]="previewLoading">
<fa-icon icon="eye"></fa-icon>Preview interest (today)
</button>
<button class="fd-btn" (click)="openOutsideApproval()" [disabled]="outsideApprovalLoading">
<fa-icon icon="bolt"></fa-icon>Posted outside approval
</button>
@if (isHeadOffice) {
<button class="fd-btn" (click)="openProductSummary()" [disabled]="productSummaryLoading">
<fa-icon icon="table"></fa-icon>Product summary
</button>
}
</div>
</div>
@if (!approvalEnabled) {
<div class="fd-alert fd-alert--info">
<fa-icon icon="info-circle"></fa-icon>
<div>
Fixed deposit interest is currently posted directly by the nightly job, so there is nothing to approve here.
Turn on <strong>fd-interest-posting-approval</strong> under System &rarr; Configurations to put deposits behind
this report.
</div>
</div>
}
@if (isHeadOffice) {
<div class="fd-tabs">
<button class="fd-tab" [class.is-active]="tab === 'own'" (click)="switchTab('own')">
<fa-icon icon="building"></fa-icon>My branch{{ myBranch ? ' — ' + myBranch : '' }}
</button>
<button class="fd-tab" [class.is-active]="tab === 'others'" (click)="switchTab('others')">
<fa-icon icon="sitemap"></fa-icon>Other branches
</button>
</div>
@if (tab === 'others') {
<div class="fd-alert fd-alert--info">
<fa-icon icon="info-circle"></fa-icon>
<div>
Each branch generates and approves its own reports. The head office can act here only for a branch that has
not opened the day, and only once every other open branch has closed. Anything it approves is marked (HO).
</div>
</div>
}
}
@if (errorMessage) {
<div class="fd-alert fd-alert--error">
<fa-icon icon="exclamation-triangle"></fa-icon>
<div>{{ errorMessage }}</div>
</div>
}
@if (notice) {
<div class="fd-alert fd-alert--ok">
<fa-icon icon="check"></fa-icon>
<div>{{ notice }}</div>
</div>
}
@if (pendingCount > 0) {
<div class="fd-alert fd-alert--warn">
<fa-icon icon="clock"></fa-icon>
<div>
<strong>{{ pendingCount }} report(s) waiting for approval.</strong> The day cannot be closed until they are
approved, and the user who generated a report cannot be the one to approve it.
</div>
</div>
}
@if (due.length > 0) {
<div class="fd-alert fd-alert--warn">
<fa-icon icon="exclamation-triangle"></fa-icon>
<div class="fd-due-body">
<div>Fixed deposit interest is due but no report has been generated yet for:</div>
@for (d of due; track d.productId + '-' + d.officeId) {
<div class="fd-due-row">
<strong>{{ d.productName }}</strong>
<span class="fd-chip" [ngClass]="fdTypeClass(d.fdType)">{{ fdTypeShort(d.fdType) }}</span>
<span>
&middot; {{ d.officeName }} &middot; {{ d.postingDate }} &middot; {{ d.accountCount }} deposit(s) &middot;
&#8377;{{ d.totalInterest | number: '1.2-2' }}
</span>
@if (d.canAct) {
<button class="fd-btn fd-btn--primary fd-btn--slim" (click)="generate(d)" [disabled]="busy">
<fa-icon icon="sync"></fa-icon>{{ tab === 'others' ? 'Generate on behalf' : 'Generate report' }}
</button>
} @else if (d.blockedReason) {
<span class="fd-blocked">{{ d.blockedReason }}</span>
}
</div>
}
</div>
</div>
}
<!-- Summary strip -->
<div class="fd-summary">
<div class="fd-stat">
<div class="fd-stat__label">Interest due, no report</div>
<div class="fd-stat__value">&#8377;{{ dueTotal | number: '1.2-2' }}</div>
<div class="fd-stat__sub">{{ dueAccountTotal }} deposit(s) &middot; {{ due.length }} product(s)</div>
</div>
<div class="fd-stat fd-stat--warn">
<div class="fd-stat__label">Awaiting approval</div>
<div class="fd-stat__value">&#8377;{{ awaitingTotal | number: '1.2-2' }}</div>
<div class="fd-stat__sub">{{ awaitingReports.length }} report(s) &middot; blocking day close</div>
</div>
<div class="fd-stat fd-stat--ok">
<div class="fd-stat__label">Approved &mdash; posts at close</div>
<div class="fd-stat__value">&#8377;{{ approvedTotal | number: '1.2-2' }}</div>
<div class="fd-stat__sub">{{ approvedReports.length }} report(s)</div>
</div>
<div class="fd-stat fd-stat--posted">
<div class="fd-stat__label">Posted today</div>
<div class="fd-stat__value">&#8377;{{ postedTotal | number: '1.2-2' }}</div>
<div class="fd-stat__sub">{{ postedReports.length }} report(s)</div>
</div>
</div>
@if (showPreview) {
<div class="fd-card">
<div class="fd-detail-head">
<div>
<h3>FD interest preview &mdash; earned up to {{ previewAsOf }}</h3>
<div class="muted">
What each deposit would be paid if interest were posted today. View only &mdash; nothing is saved, approved
or posted.
</div>
</div>
<div class="fd-total">
<span>Total so far</span>
<strong>&#8377;{{ previewTotal | number: '1.2-2' }}</strong>
<span class="muted">{{ previewRows.length }} deposit(s)</span>
</div>
</div>
<div
style="
display: flex;
flex-wrap: wrap;
gap: 10px;
padding: 14px 20px;
border-bottom: 1px solid var(--fd-border-soft);
"
>
<button class="fd-btn fd-btn--slim" (click)="openPreview()" [disabled]="previewLoading">
<fa-icon icon="undo"></fa-icon>Refresh
</button>
<button
class="fd-btn fd-btn--slim"
(click)="exportPreview()"
[disabled]="previewLoading || previewRows.length === 0"
>
<fa-icon icon="file-excel"></fa-icon>Export Excel
</button>
<button class="fd-btn fd-btn--slim" (click)="closePreview()"><fa-icon icon="times"></fa-icon>Close</button>
</div>
@if (previewLoading) {
<div class="fd-empty">Working out what each deposit has earned up to today&hellip;</div>
} @else {
<div class="fd-table-wrap">
<table class="fd-table">
<thead>
<tr>
<th>Branch</th>
<th>Product</th>
<th>Scheme</th>
<th class="num">Deposits</th>
<th class="num">Interest so far</th>
</tr>
</thead>
<tbody>
@for (g of previewGroups; track g.officeName + g.productName) {
<tr>
<td>{{ g.officeName }}</td>
<td>
<strong>{{ g.productName }}</strong>
</td>
<td>
<span class="fd-chip" [ngClass]="fdTypeClass(g.fdType)">{{ fdTypeShort(g.fdType) }}</span>
</td>
<td class="num">{{ g.accounts }}</td>
<td class="num">&#8377;{{ g.interest | number: '1.2-2' }}</td>
</tr>
} @empty {
<tr>
<td colspan="5" class="fd-empty">No fixed deposit has interest waiting to be posted.</td>
</tr>
}
</tbody>
</table>
</div>
<div class="fd-table-wrap">
<table class="fd-table">
<thead>
<tr>
<th>Account no</th>
<th>Customer</th>
<th>Scheme</th>
<th>Interest for</th>
<th class="num">Deposit</th>
<th class="num">Rate %</th>
<th>Maturity</th>
<th>Pays into</th>
<th class="num">Interest so far</th>
</tr>
</thead>
<tbody>
@for (r of previewRows; track r.fdAccountId + '-' + r.interestPostingDate) {
<tr>
<td class="fd-mono">{{ r.accountNo }}</td>
<td>{{ r.clientName }}</td>
<td>
<span class="fd-chip" [ngClass]="fdTypeClass(r.fdType)">{{ fdTypeShort(r.fdType) }}</span>
</td>
<td class="fd-mono">{{ r.interestPeriodFrom || '—' }} &rarr; {{ r.interestPostingDate }}</td>
<td class="num">&#8377;{{ r.depositAmount | number: '1.2-2' }}</td>
<td class="num">{{ r.interestRate | number: '1.2-2' }}</td>
<td class="fd-mono">{{ r.maturityDate || '—' }}</td>
<td class="fd-sub">{{ r.payoutAccountNo || 'Stays in the deposit' }}</td>
<td class="num">&#8377;{{ r.interest | number: '1.2-2' }}</td>
</tr>
}
</tbody>
<tfoot>
<tr>
<td colspan="8"><strong>Total</strong></td>
<td class="num">
<strong>&#8377;{{ previewTotal | number: '1.2-2' }}</strong>
</td>
</tr>
</tfoot>
</table>
</div>
}
</div>
}
@if (showOutsideApproval) {
<div class="fd-card">
<div class="fd-detail-head">
<div>
<h3>Fixed deposit interest posted outside this report</h3>
<div class="muted">
A deposit that matured before its own posting cycle completed has its last period settled directly, the
moment it matures &mdash; before any report here could be generated or approved for it. Listed here so
nothing paid to a customer is invisible, approved or not.
</div>
</div>
<div class="fd-total">
<span>Total</span>
<strong>&#8377;{{ outsideApprovalTotal | number: '1.2-2' }}</strong>
<span class="muted">{{ outsideApprovalRows.length }} posting(s)</span>
</div>
</div>
<div
style="
display: flex;
flex-wrap: wrap;
align-items: flex-end;
gap: 10px;
padding: 14px 20px;
border-bottom: 1px solid var(--fd-border-soft);
"
>
<label class="fd-date">
From
<input type="date" [(ngModel)]="outsideApprovalFrom" (change)="loadOutsideApproval()" />
</label>
<label class="fd-date">
To
<input type="date" [(ngModel)]="outsideApprovalTo" (change)="loadOutsideApproval()" />
</label>
<button class="fd-btn fd-btn--slim" (click)="loadOutsideApproval()" [disabled]="outsideApprovalLoading">
<fa-icon icon="undo"></fa-icon>Refresh
</button>
<button class="fd-btn fd-btn--slim" (click)="closeOutsideApproval()">
<fa-icon icon="times"></fa-icon>Close
</button>
</div>
@if (outsideApprovalLoading) {
<div class="fd-empty">Looking for deposit interest posted outside this report&hellip;</div>
} @else {
<div class="fd-table-wrap">
<table class="fd-table">
<thead>
<tr>
<th>Product</th>
<th>Scheme</th>
<th class="num">Deposits</th>
<th class="num">Interest</th>
</tr>
</thead>
<tbody>
@for (g of outsideApprovalGroups; track g.productName) {
<tr>
<td>
<strong>{{ g.productName }}</strong>
</td>
<td>
<span class="fd-chip" [ngClass]="fdTypeClass(g.fdType)">{{ fdTypeShort(g.fdType) }}</span>
</td>
<td class="num">{{ g.accounts }}</td>
<td class="num">&#8377;{{ g.interest | number: '1.2-2' }}</td>
</tr>
} @empty {
<tr>
<td colspan="4" class="fd-empty">
No fixed deposit interest was posted outside this report in this period.
</td>
</tr>
}
</tbody>
</table>
</div>
@if (outsideApprovalRows.length > 0) {
<div class="fd-table-wrap">
<table class="fd-table">
<thead>
<tr>
<th>Account no</th>
<th>Customer</th>
<th>Product</th>
<th>Scheme</th>
<th>Interest for</th>
<th class="num">Interest</th>
<th>Posted at</th>
</tr>
</thead>
<tbody>
@for (r of outsideApprovalRows; track r.transactionId) {
<tr>
<td class="fd-mono">{{ r.accountNo }}</td>
<td>{{ r.clientName }}</td>
<td>{{ r.productName }}</td>
<td>
<span class="fd-chip" [ngClass]="fdTypeClass(r.fdType)">{{ fdTypeShort(r.fdType) }}</span>
</td>
<td class="fd-mono">{{ r.interestFor }}</td>
<td class="num">&#8377;{{ r.interestAmount | number: '1.2-2' }}</td>
<td class="fd-sub">{{ r.postedAt | date: 'dd MMM yyyy, HH:mm' }}</td>
</tr>
}
</tbody>
<tfoot>
<tr>
<td colspan="5"><strong>Total</strong></td>
<td class="num">
<strong>&#8377;{{ outsideApprovalTotal | number: '1.2-2' }}</strong>
</td>
<td></td>
</tr>
</tfoot>
</table>
</div>
}
}
</div>
}
@if (showProductSummary) {
<div class="fd-card">
<div class="fd-detail-head">
<div>
<h3>Interest by product</h3>
<div class="muted">
Posted through this report, still awaiting approval or posting, and posted directly at maturity instead —
added up to what the product has paid out in total over the period.
</div>
</div>
<div class="fd-total">
<span>Total, all products</span>
<strong>&#8377;{{ productSummaryGrandTotal.total | number: '1.2-2' }}</strong>
</div>
</div>
<div
style="
display: flex;
flex-wrap: wrap;
align-items: flex-end;
gap: 10px;
padding: 14px 20px;
border-bottom: 1px solid var(--fd-border-soft);
"
>
<label class="fd-date">
From
<input type="date" [(ngModel)]="productSummaryFrom" (change)="loadProductSummary()" />
</label>
<label class="fd-date">
To
<input type="date" [(ngModel)]="productSummaryTo" (change)="loadProductSummary()" />
</label>
<button class="fd-btn fd-btn--slim" (click)="loadProductSummary()" [disabled]="productSummaryLoading">
<fa-icon icon="undo"></fa-icon>Refresh
</button>
<button class="fd-btn fd-btn--slim" (click)="closeProductSummary()">
<fa-icon icon="times"></fa-icon>Close
</button>
</div>
@if (productSummaryLoading) {
<div class="fd-empty">Adding up interest by product&hellip;</div>
} @else {
<div class="fd-table-wrap">
<table class="fd-table">
<thead>
<tr>
<th>Product</th>
<th>Scheme</th>
<th>Posting period</th>
<th class="num">Posted (report)</th>
<th class="num">Pending approval</th>
<th class="num">Posted at maturity</th>
<th class="num">Total</th>
</tr>
</thead>
<tbody>
@for (row of productSummaryRows; track row.productId) {
<tr>
<td>
<strong>{{ row.productName }}</strong>
</td>
<td>
<span class="fd-chip" [ngClass]="fdTypeClass(row.fdType)">{{ fdTypeShort(row.fdType) }}</span>
</td>
<td class="fd-sub">{{ row.postingPeriodLabel || '—' }}</td>
<td class="num">&#8377;{{ row.posted | number: '1.2-2' }}</td>
<td class="num">&#8377;{{ row.pending | number: '1.2-2' }}</td>
<td class="num">&#8377;{{ row.maturityPosted | number: '1.2-2' }}</td>
<td class="num">
<strong>&#8377;{{ row.total | number: '1.2-2' }}</strong>
</td>
</tr>
} @empty {
<tr>
<td colspan="7" class="fd-empty">No fixed deposit interest in this period.</td>
</tr>
}
</tbody>
<tfoot>
<tr>
<td colspan="3"><strong>Total</strong></td>
<td class="num">
<strong>&#8377;{{ productSummaryGrandTotal.posted | number: '1.2-2' }}</strong>
</td>
<td class="num">
<strong>&#8377;{{ productSummaryGrandTotal.pending | number: '1.2-2' }}</strong>
</td>
<td class="num">
<strong>&#8377;{{ productSummaryGrandTotal.maturityPosted | number: '1.2-2' }}</strong>
</td>
<td class="num">
<strong>&#8377;{{ productSummaryGrandTotal.total | number: '1.2-2' }}</strong>
</td>
</tr>
</tfoot>
</table>
</div>
}
</div>
}
<div class="fd-card">
<div class="fd-card-h">
<h2>Reports{{ postingDate ? ' for ' + postingDate : '' }}</h2>
<span class="fd-card-sub">One report per scheme, per branch</span>
</div>
<div class="fd-table-wrap">
<table class="fd-table">
<thead>
<tr>
<th>Branch</th>
<th>Scheme</th>
<th>Type</th>
<th>Posting date</th>
<th class="num">Deposits</th>
<th class="num">Total interest</th>
<th>Status</th>
<th>Maker</th>
<th>Checker</th>
<th></th>
</tr>
</thead>
<tbody>
@for (r of reports; track r.id) {
<tr class="is-clickable" [class.is-selected]="selected?.id === r.id" (click)="open(r)">
<td>{{ r.officeName }}</td>
<td>
<strong>{{ r.productName }}</strong>
</td>
<td [title]="fdTypeLabel(r.fdType)">
<span class="fd-chip" [ngClass]="fdTypeClass(r.fdType)">{{ fdTypeShort(r.fdType) }}</span>
</td>
<td class="fd-mono">{{ r.postingDate }}</td>
<td class="num">{{ r.accountCount }}</td>
<td class="num">&#8377;{{ r.totalInterest | number: '1.2-2' }}</td>
<td>
<span class="fd-badge" [ngClass]="statusClass(r.status)">{{ r.status }}</span>
@if (r.failureReason) {
<div class="fd-fail" [title]="r.failureReason">Posting failed: {{ r.failureReason }}</div>
}
</td>
<td class="fd-sub">
{{ r.generatedBy || 'System' }} &middot; {{ r.generationMode }}<br />{{
r.generatedAt | date: 'dd MMM, HH:mm'
}}
</td>
<td class="fd-sub">
@if (r.approvedAt) {
{{ r.approvedBy }}
@if (r.approvedOnBehalf) {
<span class="fd-behalf">(HO)</span>
}
<br />{{ r.approvedAt | date: 'dd MMM, HH:mm' }}
} @else {
&mdash;
}
</td>
<td (click)="$event.stopPropagation()">
<div style="display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end">
@if (canRegenerate(r)) {
<button class="fd-btn fd-btn--slim" (click)="regenerate(r)" [disabled]="busy">
<fa-icon icon="sync"></fa-icon>Regenerate
</button>
}
@if (canApprove(r)) {
<button class="fd-btn fd-btn--primary fd-btn--slim" (click)="approve(r)" [disabled]="busy">
<fa-icon icon="check"></fa-icon>{{ tab === 'others' ? 'Approve on behalf' : 'Approve' }}
</button>
} @else if (r.status === 'GENERATED' && r.approveBlockedReason) {
<span class="fd-blocked">{{ r.approveBlockedReason }}</span>
}
</div>
</td>
</tr>
} @empty {
<tr>
<td colspan="10" class="fd-empty">
@if (loading) {
Loading&hellip;
} @else {
No fixed deposit interest posting report for {{ postingDate || 'this date' }}. Reports are generated
at 12:00 noon on a product's posting date.
}
</td>
</tr>
}
</tbody>
</table>
</div>
</div>
@if (selected) {
<div class="fd-card">
<div class="fd-detail-head">
<div>
<h3>
{{ selected.officeName }} &middot; {{ selected.productName }} &mdash; {{ selected.postingDate }}
<span class="fd-chip" [ngClass]="fdTypeClass(selected.fdType)">{{ fdTypeShort(selected.fdType) }}</span>
<span class="fd-badge fd-badge--muted">{{ selected.postingPeriodLabel }}</span>
<span class="fd-badge" [ngClass]="statusClass(selected.status)">{{ selected.status }}</span>
</h3>
<div class="muted">{{ fdTypeLabel(selected.fdType) }}</div>
<div class="muted">
Dr Interest Expense &rarr; Cr {{ selected.payableGlCode }} {{ selected.payableGlName }}; Dr
{{ selected.payableGlCode }} &rarr; Cr {{ selected.paidGlCode }} {{ selected.paidGlName }}; then Dr
{{ selected.paidGlCode }} &rarr; Cr each deposit below
</div>
</div>
<div class="fd-total">
<span>Total interest</span>
<strong>&#8377;{{ selected.totalInterest | number: '1.2-2' }}</strong>
<span class="muted">{{ selected.accountCount }} deposit(s)</span>
</div>
</div>
<div class="fd-table-wrap">
<table class="fd-table">
<thead>
<tr>
<th>Account no</th>
<th>Account holder</th>
<th>Interest for</th>
<th class="num">Deposit</th>
<th class="num">Rate %</th>
<th>Maturity</th>
<th class="num">Interest</th>
<th class="num">Balance before</th>
<th class="num">Balance after</th>
<th>Pays into</th>
<th>Posted txn</th>
</tr>
</thead>
<tbody>
@for (l of selected.lines; track l.fdAccountId + '-' + l.interestPostingDate) {
<tr>
<td class="fd-mono">{{ l.accountNo }}</td>
<td>{{ l.clientName }}</td>
<td class="fd-mono">{{ l.interestPeriodFrom || '—' }} &rarr; {{ l.interestPostingDate }}</td>
<td class="num">&#8377;{{ l.depositAmount | number: '1.2-2' }}</td>
<td class="num">{{ l.interestRate | number: '1.2-2' }}</td>
<td class="fd-mono">{{ l.maturityDate || '—' }}</td>
<td class="num">&#8377;{{ l.interestAmount | number: '1.2-2' }}</td>
<td class="num">&#8377;{{ l.balanceBefore | number: '1.2-2' }}</td>
<td class="num">&#8377;{{ l.balanceAfter | number: '1.2-2' }}</td>
<td class="fd-sub">{{ l.payoutAccountNo || 'Stays in the deposit' }}</td>
<td class="fd-sub">{{ l.fdTransactionId ? '#' + l.fdTransactionId : '—' }}</td>
</tr>
}
</tbody>
<tfoot>
<tr>
<td colspan="6"><strong>Total</strong></td>
<td class="num">
<strong>&#8377;{{ selected.totalInterest | number: '1.2-2' }}</strong>
</td>
<td colspan="4"></td>
</tr>
</tfoot>
</table>
</div>
</div>
}
</div>
src/app/fd-interest-posting-report/fd-interest-posting-report.component.scss
-559
View File
@@ -1,559 +0,0 @@
/**
* 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/.
*/
:host {
--fd-navy: #101723;
--fd-accent: #1b4d8f;
--fd-accent-dark: #123c70;
--fd-ground: #f7f8fa;
--fd-border: #dfe4eb;
--fd-border-soft: #edf0f4;
--fd-muted: #5b6676;
--fd-text: #3c4757;
--fd-amber: #6b4600;
--fd-amber-dark: #5a3b00;
--fd-amber-tint: #fdf3dc;
--fd-amber-border: #efd9a3;
--fd-amber-wash: #fffcf4;
--fd-green: #185e38;
--fd-green-dark: #1d6f42;
--fd-green-tint: #e2f3e8;
--fd-green-wash: #f3faf5;
--fd-blue-tint: #e6eef8;
--fd-slate-tint: #edf0f4;
display: block;
font-family: 'IBM Plex Sans', system-ui, sans-serif;
color: var(--fd-navy);
}
.fd {
max-width: 1320px;
margin: 0 auto;
padding: 20px 4px 56px;
}
// ── Header ──────────────────────────────────────────────────────────────
.fd-head {
display: flex;
flex-wrap: wrap;
gap: 24px;
align-items: flex-end;
justify-content: space-between;
margin-bottom: 22px;
}
.fd-head-t {
margin: 0;
font-family: 'IBM Plex Serif', serif;
font-weight: 600;
font-size: 26px;
letter-spacing: -0.01em;
display: flex;
align-items: center;
gap: 10px;
fa-icon {
color: var(--fd-accent);
font-size: 20px;
}
}
.fd-head-s {
max-width: 720px;
margin-top: 8px;
font-size: 13.5px;
line-height: 1.6;
color: var(--fd-muted);
}
.fd-head-a {
display: flex;
flex-wrap: wrap;
align-items: flex-end;
gap: 10px;
}
.fd-date {
display: flex;
flex-direction: column;
gap: 5px;
font-size: 11px;
font-weight: 600;
letter-spacing: 0.06em;
text-transform: uppercase;
color: var(--fd-muted);
input {
font-family: 'IBM Plex Mono', monospace;
font-size: 13px;
padding: 9px 11px;
min-height: 44px;
border: 1px solid #cdd5df;
border-radius: 7px;
background: #fff;
color: var(--fd-navy);
}
}
// ── Buttons ─────────────────────────────────────────────────────────────
.fd-btn {
font-family: inherit;
font-size: 12.5px;
font-weight: 500;
padding: 8px 14px;
min-height: 44px;
border-radius: 7px;
border: 1px solid #cdd5df;
background: #fff;
color: var(--fd-navy);
cursor: pointer;
white-space: nowrap;
fa-icon {
margin-right: 6px;
}
&:hover:not([disabled]) {
background: #f2f5f9;
}
&[disabled] {
opacity: 0.5;
cursor: not-allowed;
}
&--primary {
background: var(--fd-accent);
border-color: var(--fd-accent);
color: #fff;
&:hover:not([disabled]) {
background: var(--fd-accent-dark);
}
}
&--slim {
min-height: 34px;
padding: 6px 11px;
font-size: 12px;
}
}
// ── Tabs ────────────────────────────────────────────────────────────────
.fd-tabs {
display: flex;
gap: 4px;
margin-bottom: 20px;
border-bottom: 1px solid var(--fd-border);
}
.fd-tab {
font-family: inherit;
font-size: 13px;
font-weight: 500;
padding: 10px 6px;
min-height: 44px;
border: 0;
border-bottom: 2px solid transparent;
background: transparent;
color: var(--fd-muted);
cursor: pointer;
fa-icon {
margin-right: 7px;
}
&.is-active {
border-bottom-color: var(--fd-accent);
color: var(--fd-accent);
font-weight: 600;
}
& + .fd-tab {
margin-left: 18px;
}
}
// ── Alerts ──────────────────────────────────────────────────────────────
.fd-alert {
display: flex;
gap: 12px;
align-items: flex-start;
margin-bottom: 18px;
padding: 14px 18px;
border-radius: 10px;
font-size: 13px;
line-height: 1.6;
fa-icon {
margin-top: 2px;
flex-shrink: 0;
}
&--info {
background: #eef3fa;
border: 1px solid #c8d8ec;
color: #1f3a5c;
}
&--warn {
background: var(--fd-amber-tint);
border: 1px solid var(--fd-amber-border);
color: var(--fd-amber-dark);
strong {
color: var(--fd-amber-dark);
}
}
&--ok {
background: var(--fd-green-wash);
border: 1px solid #bfe3cc;
color: var(--fd-green);
}
&--error {
background: #fdecea;
border: 1px solid #f3b8b1;
color: #8a2b22;
}
}
.fd-due-body {
display: flex;
flex-direction: column;
gap: 10px;
width: 100%;
}
.fd-due-row {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 8px;
padding: 8px 0;
& + .fd-due-row {
border-top: 1px dashed var(--fd-amber-border);
}
}
.fd-blocked {
font-size: 11.5px;
color: var(--fd-muted);
}
// ── Summary strip ───────────────────────────────────────────────────────
.fd-summary {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 16px;
margin-bottom: 20px;
@media (width <= 860px) {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
.fd-stat {
background: #fff;
border: 1px solid var(--fd-border);
border-radius: 12px;
padding: 18px 20px;
&__label {
font-size: 11px;
font-weight: 600;
letter-spacing: 0.06em;
text-transform: uppercase;
color: var(--fd-muted);
}
&__value {
font-family: 'IBM Plex Mono', monospace;
font-variant-numeric: tabular-nums;
font-size: 25px;
font-weight: 500;
letter-spacing: -0.02em;
margin-top: 9px;
}
&__sub {
font-size: 11.5px;
color: var(--fd-muted);
margin-top: 4px;
}
&--warn {
border-color: var(--fd-amber-border);
.fd-stat__label,
.fd-stat__sub {
color: var(--fd-amber);
}
.fd-stat__value {
color: var(--fd-amber-dark);
}
}
&--ok {
.fd-stat__label {
color: var(--fd-green);
}
.fd-stat__value {
color: var(--fd-green);
}
}
&--posted {
.fd-stat__label {
color: var(--fd-accent);
}
.fd-stat__value {
color: var(--fd-accent);
}
}
}
// ── Cards ───────────────────────────────────────────────────────────────
.fd-card {
background: #fff;
border: 1px solid var(--fd-border);
border-radius: 12px;
margin-bottom: 20px;
overflow: hidden;
}
.fd-card-h {
display: flex;
flex-wrap: wrap;
gap: 10px;
align-items: baseline;
padding: 16px 20px;
border-bottom: 1px solid var(--fd-border);
h2,
h3 {
margin: 0;
font-size: 15px;
font-weight: 600;
}
}
.fd-card-sub {
font-size: 12px;
color: var(--fd-muted);
}
// ── Tables ──────────────────────────────────────────────────────────────
.fd-table-wrap {
overflow-x: auto;
}
.fd-table {
border-collapse: collapse;
width: 100%;
th {
font-size: 11px;
font-weight: 600;
letter-spacing: 0.06em;
text-transform: uppercase;
color: var(--fd-muted);
text-align: left;
padding: 10px 14px;
border-bottom: 1px solid var(--fd-border);
white-space: nowrap;
}
td {
font-size: 13px;
padding: 12px 14px;
border-bottom: 1px solid var(--fd-border-soft);
vertical-align: top;
}
tbody tr:last-child td {
border-bottom: 0;
}
tbody tr.is-clickable {
cursor: pointer;
&:hover td {
background: #fafbfd;
}
}
tbody tr.is-selected td {
background: var(--fd-blue-tint);
}
tfoot tr {
background: var(--fd-ground);
}
.num {
text-align: right;
font-family: 'IBM Plex Mono', monospace;
font-variant-numeric: tabular-nums;
white-space: nowrap;
}
}
.fd-mono {
font-family: 'IBM Plex Mono', monospace;
font-variant-numeric: tabular-nums;
}
.fd-sub {
font-size: 11.5px;
color: var(--fd-muted);
margin-top: 3px;
}
.fd-empty {
text-align: center;
padding: 30px 16px;
color: var(--fd-muted);
font-size: 13px;
}
// ── Chips & badges ──────────────────────────────────────────────────────
.fd-chip {
display: inline-block;
padding: 2px 9px;
border-radius: 999px;
font-size: 11px;
font-weight: 600;
letter-spacing: 0.02em;
white-space: nowrap;
&--single {
background: var(--fd-slate-tint);
color: var(--fd-text);
}
&--double {
background: var(--fd-blue-tint);
color: var(--fd-accent);
}
&--special {
background: var(--fd-amber-tint);
color: var(--fd-amber);
}
}
.fd-badge {
display: inline-block;
padding: 2px 10px;
border-radius: 999px;
font-size: 11px;
font-weight: 700;
letter-spacing: 0.02em;
white-space: nowrap;
&--pending {
background: var(--fd-amber-tint);
color: var(--fd-amber);
}
&--approved {
background: var(--fd-green-tint);
color: var(--fd-green);
}
&--posted {
background: var(--fd-blue-tint);
color: var(--fd-accent);
}
&--muted {
background: var(--fd-slate-tint);
color: var(--fd-muted);
}
}
.fd-behalf {
font-size: 10.5px;
font-weight: 700;
color: var(--fd-accent);
margin-left: 4px;
}
.fd-fail {
margin-top: 4px;
font-size: 11px;
color: #a32b22;
}
// ── Detail panel ────────────────────────────────────────────────────────
.fd-detail-head {
display: flex;
flex-wrap: wrap;
gap: 20px;
justify-content: space-between;
align-items: flex-start;
padding: 22px 20px;
border-bottom: 1px solid var(--fd-border-soft);
background: #fbfcfd;
h3 {
margin: 0;
font-family: 'IBM Plex Serif', serif;
font-weight: 600;
font-size: 19px;
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 9px;
}
}
.fd-total {
text-align: right;
span:first-child {
display: block;
font-size: 11px;
font-weight: 600;
letter-spacing: 0.06em;
text-transform: uppercase;
color: var(--fd-muted);
}
strong {
display: block;
font-family: 'IBM Plex Mono', monospace;
font-variant-numeric: tabular-nums;
font-size: 26px;
font-weight: 500;
margin-top: 6px;
letter-spacing: -0.02em;
}
}
.muted {
color: var(--fd-muted);
font-size: 12.5px;
margin-top: 4px;
}
src/app/fd-interest-posting-report/fd-interest-posting-report.component.ts
-686
View File
@@ -1,686 +0,0 @@
/**
* 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 { FormsModule } from '@angular/forms';
import { FaIconComponent } from '@fortawesome/angular-fontawesome';
import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
import { SettingsService } from 'app/settings/settings.service';
import { exportWorkbook } from '../cashier/cashier-export';
import {
FdInterestDue,
FdInterestPreviewRow,
FdInterestReport,
FdInterestReportDetail,
FdInterestPostingReportService,
FdInterestSummaryRow,
FdOutsideApprovalRow,
FdReportScope,
FdType
} from './fd-interest-posting-report.service';
/**
* Fixed deposit interest posting reports.
*
* On a product's posting date the system generates, at noon, the list of what each deposit will be
* paid. One user of the branch reviews it and a second approves it — the maker cannot be the checker,
* because posting interest moves money to customers and, for a special deposit, straight out to their
* savings account. The approved amounts are posted when the branch closes the day, and until then it
* cannot close. Regenerating replaces the report and needs approving again.
*/
@Component({
selector: 'mifosx-fd-interest-posting-report',
templateUrl: './fd-interest-posting-report.component.html',
styleUrls: ['./fd-interest-posting-report.component.scss'],
imports: [
...STANDALONE_SHARED_IMPORTS,
FormsModule,
FaIconComponent
]
})
export class FdInterestPostingReportComponent implements OnInit {
private reportService = inject(FdInterestPostingReportService);
private settingsService = inject(SettingsService);
postingDate = '';
loading = false;
busy = false;
errorMessage = '';
notice = '';
reports: FdInterestReport[] = [];
selected: FdInterestReportDetail | null = null;
/** Products with interest due and no report yet — the noon job ran before they had anything due, or failed. */
due: FdInterestDue[] = [];
/** 'own' — the user's own branch; 'others' — every other branch, a head-office-only tab. */
tab: FdReportScope = 'own';
isHeadOffice = false;
myBranch = '';
/** False where the bank has deposits on the old direct-posting path; every list here is then empty by design. */
approvalEnabled = true;
ngOnInit(): void {
this.postingDate = this.businessDateIso();
this.reportService.context().subscribe({
next: (ctx) => {
this.isHeadOffice = !!ctx?.headOffice;
this.myBranch = ctx?.officeName ?? '';
this.approvalEnabled = ctx?.approvalEnabled !== false;
},
error: () => (this.isHeadOffice = false)
});
this.load();
}
switchTab(tab: FdReportScope): void {
if (this.tab === tab) {
return;
}
this.tab = tab;
this.selected = null;
this.notice = '';
this.load();
}
/** Acting for another branch is the head office's exception, so it is spelt out before it happens. */
private confirmOnBehalf(officeName: string, action: string): boolean {
if (this.tab !== 'others') {
return true;
}
return confirm(
`${officeName} has not opened today. You are about to ${action} its fixed deposit interest posting report on its ` +
'behalf, from the head office. Continue?'
);
}
load(): void {
this.loading = true;
this.errorMessage = '';
this.reportService.list(this.postingDate || undefined, undefined, undefined, this.tab).subscribe({
next: (reports) => {
this.reports = reports ?? [];
this.loading = false;
const stillThere = this.selected && this.reports.find((r) => r.id === this.selected?.id);
if (stillThere) {
this.open(stillThere);
} else {
this.selected = null;
}
},
error: (err) => {
this.loading = false;
this.errorMessage = this.messageOf(err, 'Could not load the fixed deposit interest posting reports.');
}
});
this.reportService.dueWithoutReport(this.postingDate || undefined, this.tab).subscribe({
next: (due) => (this.due = due ?? []),
error: () => (this.due = [])
});
}
generate(item: FdInterestDue): void {
if (!this.confirmOnBehalf(item.officeName, 'generate')) {
return;
}
this.busy = true;
this.notice = '';
this.errorMessage = '';
this.reportService.regenerate(item.productId, item.officeId, item.postingDate).subscribe({
next: (res) => {
this.busy = false;
this.notice = `Report generated for ${item.productName} — ${item.officeName}. Another user of the branch has to approve it.`;
this.load();
this.reportService.detail(res.reportId).subscribe((detail) => (this.selected = detail));
},
error: (err) => {
this.busy = false;
this.errorMessage = this.messageOf(err, 'Could not generate the report.');
}
});
}
open(report: FdInterestReport): void {
this.errorMessage = '';
this.reportService.detail(report.id).subscribe({
next: (detail) => (this.selected = detail),
error: (err) => (this.errorMessage = this.messageOf(err, 'Could not load the report.'))
});
}
regenerate(report: FdInterestReport): void {
if (
!confirm(
`Regenerate the fixed deposit interest posting report for ${report.productName} — ${report.officeName}? ` +
'It will need approving again.'
) ||
!this.confirmOnBehalf(report.officeName, 'regenerate')
) {
return;
}
this.busy = true;
this.notice = '';
this.errorMessage = '';
this.reportService.regenerate(report.productId, report.officeId, report.postingDate).subscribe({
next: (res) => {
this.busy = false;
this.notice = `Report regenerated for ${report.productName}. Another user of the branch has to approve it.`;
this.selected = null;
this.load();
this.reportService.detail(res.reportId).subscribe((detail) => (this.selected = detail));
},
error: (err) => {
this.busy = false;
this.errorMessage = this.messageOf(err, 'Could not regenerate the report.');
}
});
}
approve(report: FdInterestReport): void {
const payout =
report.fdType === 'SPECIAL'
? ' This is a monthly-income product, so the interest is paid out to the customers’ linked savings accounts.'
: '';
if (
!confirm(
`Approve interest of ₹${report.totalInterest} across ${report.accountCount} deposit(s) for ${report.productName}?` +
`${payout} It will be posted when the branch closes the day.`
) ||
!this.confirmOnBehalf(report.officeName, 'approve')
) {
return;
}
this.busy = true;
this.notice = '';
this.errorMessage = '';
this.reportService.approve(report.id).subscribe({
next: () => {
this.busy = false;
this.notice = `Approved. Interest for ${report.productName} — ${report.officeName} will be posted when the branch closes the day.`;
this.load();
},
error: (err) => {
this.busy = false;
this.errorMessage = this.messageOf(err, 'Could not approve the report.');
}
});
}
canRegenerate(report: FdInterestReport): boolean {
return report.canAct && (report.status === 'GENERATED' || report.status === 'APPROVED');
}
/**
* The server decides this, not the screen: it alone knows who generated the report, and the maker
* cannot be the checker.
*/
canApprove(report: FdInterestReport): boolean {
return !!report.canApprove;
}
statusClass(status: string): string {
return (
{
GENERATED: 'fd-badge--pending',
APPROVED: 'fd-badge--approved',
POSTED: 'fd-badge--posted',
SUPERSEDED: 'fd-badge--muted'
}[status] ?? 'fd-badge--muted'
);
}
/** What the scheme means for the customer, spelt out rather than left as a code. */
fdTypeLabel(fdType: FdType | string): string {
return (
{
SINGLE: 'Single — interest paid at maturity',
DOUBLE: 'Double — interest compounded into the deposit',
SPECIAL: 'Special — interest paid monthly to linked savings'
}[fdType] ?? String(fdType ?? '')
);
}
fdTypeShort(fdType: FdType | string): string {
return (
{
SINGLE: 'Single',
DOUBLE: 'Double',
SPECIAL: 'Special'
}[fdType] ?? String(fdType ?? '')
);
}
fdTypeClass(fdType: FdType | string): string {
return (
{
SINGLE: 'fd-chip--single',
DOUBLE: 'fd-chip--double',
SPECIAL: 'fd-chip--special'
}[fdType] ?? 'fd-chip--single'
);
}
/** Pending reports that block this user's own day close; another branch's pending reports block only that branch. */
get pendingCount(): number {
return this.tab === 'own' ? this.reports.filter((r) => r.status === 'GENERATED').length : 0;
}
// ── Summary strip: the day's reports, at a glance ──
get dueTotal(): number {
return this.due.reduce((sum, d) => sum + Number(d.totalInterest || 0), 0);
}
get dueAccountTotal(): number {
return this.due.reduce((sum, d) => sum + Number(d.accountCount || 0), 0);
}
private reportsWithStatus(status: string): FdInterestReport[] {
return this.reports.filter((r) => r.status === status);
}
private totalOf(list: FdInterestReport[]): number {
return list.reduce((sum, r) => sum + Number(r.totalInterest || 0), 0);
}
get awaitingReports(): FdInterestReport[] {
return this.reportsWithStatus('GENERATED');
}
get approvedReports(): FdInterestReport[] {
return this.reportsWithStatus('APPROVED');
}
get postedReports(): FdInterestReport[] {
return this.reportsWithStatus('POSTED');
}
get awaitingTotal(): number {
return this.totalOf(this.awaitingReports);
}
get approvedTotal(): number {
return this.totalOf(this.approvedReports);
}
get postedTotal(): number {
return this.totalOf(this.postedReports);
}
// ── Preview: what each deposit has earned so far, as if posted today. View only. ──
showPreview = false;
previewLoading = false;
previewRows: FdInterestPreviewRow[] = [];
previewAsOf = '';
openPreview(): void {
this.showPreview = true;
this.previewLoading = true;
this.errorMessage = '';
this.previewAsOf = this.businessDateIso();
this.reportService.preview().subscribe({
next: (rows) => {
this.previewRows = rows ?? [];
this.previewLoading = false;
},
error: (err) => {
this.previewLoading = false;
this.previewRows = [];
this.errorMessage = this.messageOf(err, 'Could not load the fixed deposit interest preview.');
}
});
}
closePreview(): void {
this.showPreview = false;
}
get previewTotal(): number {
return this.previewRows.reduce((sum, r) => sum + Number(r.interest || 0), 0);
}
/** Totals by branch, product and scheme, for the summary above the deposit list and the export. */
get previewGroups(): {
officeName: string;
productName: string;
fdType: string;
accounts: number;
interest: number;
}[] {
const map = new Map<
string,
{ officeName: string; productName: string; fdType: string; accounts: number; interest: number }
>();
this.previewRows.forEach((r) => {
const key = `${r.officeName}|${r.productName}`;
const g = map.get(key) ?? {
officeName: r.officeName,
productName: r.productName,
fdType: r.fdType,
accounts: 0,
interest: 0
};
g.accounts += 1;
g.interest += Number(r.interest || 0);
map.set(key, g);
});
return [...map.values()];
}
exportPreview(): void {
const stamp = `Fixed deposit interest earned to ${this.previewAsOf} — preview, not posted`;
exportWorkbook(
[
{
sheetName: 'By deposit',
title: 'Fixed Deposit Interest Preview',
subtitle: stamp,
headers: [
'Branch',
'Product',
'Scheme',
'Account No',
'Customer',
'Interest For',
'Deposit',
'Rate %',
'Maturity',
'Balance',
'Pays Into',
'Interest So Far'
],
widths: [
18,
22,
10,
20,
26,
12,
16,
8,
12,
16,
18,
16
],
rows: [
...this.previewRows.map((r) => [
r.officeName,
r.productName,
this.fdTypeShort(r.fdType),
r.accountNo,
r.clientName,
r.interestPostingDate ?? '',
Number(r.depositAmount || 0),
Number(r.interestRate || 0),
r.maturityDate ?? '',
Number(r.balance || 0),
r.payoutAccountNo ?? '',
Number(r.interest || 0)
]),
[
'TOTAL',
'',
'',
'',
'',
'',
'',
'',
'',
'',
'',
this.previewTotal
]
]
},
{
sheetName: 'By branch & product',
title: 'Fixed Deposit Interest Preview — Totals',
subtitle: stamp,
headers: [
'Branch',
'Product',
'Scheme',
'Deposits',
'Interest So Far'
],
widths: [
18,
22,
10,
10,
16
],
rows: [
...this.previewGroups.map((g) => [
g.officeName,
g.productName,
this.fdTypeShort(g.fdType),
g.accounts,
g.interest
]),
[
'TOTAL',
'',
'',
this.previewRows.length,
this.previewTotal
]
]
}
],
`fd-interest-preview-${this.previewAsOf}`
);
}
// ── Outside approval: deposit interest posted without this report, chiefly at maturity ──
showOutsideApproval = false;
outsideApprovalLoading = false;
outsideApprovalRows: FdOutsideApprovalRow[] = [];
outsideApprovalFrom = '';
outsideApprovalTo = '';
openOutsideApproval(): void {
this.showOutsideApproval = true;
if (!this.outsideApprovalTo) {
this.outsideApprovalTo = this.businessDateIso();
this.outsideApprovalFrom = `${this.outsideApprovalTo.slice(0, 7)}-01`;
}
this.loadOutsideApproval();
}
loadOutsideApproval(): void {
this.outsideApprovalLoading = true;
this.errorMessage = '';
this.reportService
.outsideApproval(this.outsideApprovalFrom || undefined, this.outsideApprovalTo || undefined, undefined, this.tab)
.subscribe({
next: (rows) => {
this.outsideApprovalRows = rows ?? [];
this.outsideApprovalLoading = false;
},
error: (err) => {
this.outsideApprovalLoading = false;
this.outsideApprovalRows = [];
this.errorMessage = this.messageOf(err, 'Could not load deposit interest posted outside this report.');
}
});
}
closeOutsideApproval(): void {
this.showOutsideApproval = false;
}
get outsideApprovalTotal(): number {
return this.outsideApprovalRows.reduce((sum, r) => sum + Number(r.interestAmount || 0), 0);
}
/** Totals by product and scheme, so a branch can see at a glance where its unapproved interest sits. */
get outsideApprovalGroups(): { productName: string; fdType: string; accounts: number; interest: number }[] {
const map = new Map<string, { productName: string; fdType: string; accounts: number; interest: number }>();
this.outsideApprovalRows.forEach((r) => {
const g = map.get(r.productName) ?? { productName: r.productName, fdType: r.fdType, accounts: 0, interest: 0 };
g.accounts += 1;
g.interest += Number(r.interestAmount || 0);
map.set(r.productName, g);
});
return [...map.values()];
}
// ── Product summary: due for the product vs posted through this report vs posted at maturity ──
// Head office only, same as the branch-wise summary it reuses — a branch reads its own due and
// posted totals off the strip and tables above, which already cover it.
showProductSummary = false;
productSummaryLoading = false;
productSummaryFrom = '';
productSummaryTo = '';
private summaryRows: FdInterestSummaryRow[] = [];
private productOutsideRows: FdOutsideApprovalRow[] = [];
openProductSummary(): void {
this.showProductSummary = true;
if (!this.productSummaryTo) {
this.productSummaryTo = this.businessDateIso();
this.productSummaryFrom = `${this.productSummaryTo.slice(0, 7)}-01`;
}
this.loadProductSummary();
}
loadProductSummary(): void {
this.productSummaryLoading = true;
this.errorMessage = '';
let pending = 2;
const done = () => {
pending -= 1;
if (pending === 0) this.productSummaryLoading = false;
};
this.reportService.summary(this.productSummaryFrom || undefined, this.productSummaryTo || undefined).subscribe({
next: (rows) => {
this.summaryRows = rows ?? [];
done();
},
error: (err) => {
this.summaryRows = [];
this.errorMessage = this.messageOf(err, 'Could not load the product summary.');
done();
}
});
this.reportService
.outsideApproval(this.productSummaryFrom || undefined, this.productSummaryTo || undefined)
.subscribe({
next: (rows) => {
this.productOutsideRows = rows ?? [];
done();
},
error: () => {
this.productOutsideRows = [];
done();
}
});
}
closeProductSummary(): void {
this.showProductSummary = false;
}
/**
* One row per product and scheme: what posted through this report (and what is still pending
* approval or posting), plus what posted outside it — chiefly a deposit's last interest, paid the
* moment it matured rather than through a periodic report.
*/
get productSummaryRows(): {
productId: number;
productName: string;
fdType: string;
postingPeriodLabel: string;
posted: number;
pending: number;
maturityPosted: number;
total: number;
}[] {
const map = new Map<
number,
{
productId: number;
productName: string;
fdType: string;
postingPeriodLabel: string;
posted: number;
pending: number;
maturityPosted: number;
total: number;
}
>();
const get = (productId: number, productName: string, fdType: string, label: string) => {
const existing = map.get(productId);
if (existing) return existing;
const created = {
productId,
productName,
fdType,
postingPeriodLabel: label,
posted: 0,
pending: 0,
maturityPosted: 0,
total: 0
};
map.set(productId, created);
return created;
};
this.summaryRows.forEach((r) => {
const row = get(r.productId, r.productName, r.fdType, r.postingPeriodLabel);
const amount = Number(r.totalInterest || 0);
if (r.status === 'POSTED') {
row.posted += amount;
} else if (r.status === 'GENERATED' || r.status === 'APPROVED') {
row.pending += amount;
}
});
this.productOutsideRows.forEach((r) => {
const row = get(r.productId, r.productName, r.fdType, '');
row.maturityPosted += Number(r.interestAmount || 0);
});
map.forEach((row) => {
row.total = row.posted + row.pending + row.maturityPosted;
});
return [...map.values()].sort((a, b) => a.productName.localeCompare(b.productName));
}
get productSummaryGrandTotal(): { posted: number; pending: number; maturityPosted: number; total: number } {
return this.productSummaryRows.reduce(
(sum, r) => ({
posted: sum.posted + r.posted,
pending: sum.pending + r.pending,
maturityPosted: sum.maturityPosted + r.maturityPosted,
total: sum.total + r.total
}),
{ posted: 0, pending: 0, maturityPosted: 0, total: 0 }
);
}
private businessDateIso(): string {
const businessDate = this.settingsService.businessDate as any;
const parsed = businessDate ? new Date(businessDate) : new Date();
if (isNaN(parsed.getTime())) {
return new Date().toISOString().slice(0, 10);
}
const month = String(parsed.getMonth() + 1).padStart(2, '0');
const day = String(parsed.getDate()).padStart(2, '0');
return `${parsed.getFullYear()}-${month}-${day}`;
}
private messageOf(err: any, fallback: string): string {
return (
err?.error?.errors?.[0]?.defaultUserMessage ?? err?.error?.defaultUserMessage ?? err?.error?.message ?? fallback
);
}
}
src/app/fd-interest-posting-report/fd-interest-posting-report.service.ts
-280
View File
@@ -1,280 +0,0 @@
/**
* 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 { Injectable, inject } from '@angular/core';
import { HttpClient, HttpParams } from '@angular/common/http';
import { Observable } from 'rxjs';
export type FdInterestReportStatus = 'GENERATED' | 'APPROVED' | 'POSTED' | 'SUPERSEDED';
/** Which branches a list covers: the user's own, or (head office only) every other branch. */
export type FdReportScope = 'own' | 'others';
/** The deposit scheme, which decides where a posting of interest ends up. */
export type FdType = 'SINGLE' | 'DOUBLE' | 'SPECIAL';
export interface FdInterestReport {
id: number;
productId: number;
productName: string;
fdType: FdType;
officeId: number;
officeName: string;
postingDate: string;
status: FdInterestReportStatus;
totalInterest: number;
accountCount: number;
generationMode: 'AUTO' | 'MANUAL';
generatedAt: string;
generatedBy: string | null;
approvedAt: string | null;
approvedBy: string | null;
approvedOnBehalf: boolean;
postedAt: string | null;
failureReason: string | null;
/** The product's posting cycle in words — Monthly, Quarterly, Half-yearly, Yearly. */
postingPeriodLabel: string;
/** Whether this user may regenerate it: their own branch, or the head office for a branch that did not open. */
canAct: boolean;
blockedReason: string | null;
/** Whether this user may approve it — false for the user who generated it, who cannot be its checker. */
canApprove: boolean;
approveBlockedReason: string | null;
}
export interface FdInterestReportLine {
fdAccountId: number;
accountNo: string;
clientName: string;
/**
* The day after the deposit's last paid period ended, or its activation date for a first-ever
* posting — null for a line posted before this was tracked. Paired with interestPostingDate, it is
* the span the interest was earned over.
*/
interestPeriodFrom: string | null;
/**
* The period this interest is for, as the interest engine dated it — not the day the branch closes.
* A deposit owed two unpaid periods appears on two lines, one per date.
*/
interestPostingDate: string;
interestAmount: number;
balanceBefore: number;
balanceAfter: number;
depositAmount: number | null;
interestRate: number | null;
maturityDate: string | null;
/** SPECIAL only: the linked savings account this interest is swept to after posting. */
payoutSavingsAccountId: number | null;
payoutAccountNo: string | null;
payoutTransactionId: number | null;
fdTransactionId: number | null;
}
export interface FdInterestReportDetail extends FdInterestReport {
payableGlCode: string | null;
payableGlName: string | null;
paidGlCode: string | null;
paidGlName: string | null;
lines: FdInterestReportLine[];
}
export interface FdInterestDue {
productId: number;
productName: string;
fdType: FdType;
officeId: number;
officeName: string;
postingDate: string;
accountCount: number;
totalInterest: number;
canAct: boolean;
blockedReason: string | null;
}
export interface FdInterestSummaryRow {
id: number;
postingDate: string;
officeId: number;
officeName: string;
productId: number;
productName: string;
fdType: FdType;
accountCount: number;
totalInterest: number;
status: FdInterestReportStatus;
approvedBy: string | null;
approvedOnBehalf: boolean;
approvedAt: string | null;
postedAt: string | null;
postingPeriodLabel: string;
}
/**
* One fixed deposit interest transaction that reached the customer's account without this report's
* approval — chiefly a deposit that matured before its own posting cycle completed, whose last period
* is settled directly by the maturity job. View only, for visibility.
*/
export interface FdOutsideApprovalRow {
transactionId: number;
fdAccountId: number;
accountNo: string;
clientName: string;
officeId: number;
officeName: string;
productId: number;
productName: string;
fdType: FdType;
interestFor: string;
interestAmount: number;
/** When the posting actually reached the account — not the period it is for. */
postedAt: string;
}
export interface FdInterestPreviewRow {
fdAccountId: number;
accountNo: string;
clientName: string;
officeId: number;
officeName: string;
productId: number;
productName: string;
fdType: FdType;
/** The day after the deposit's last paid period ended, or its activation date for the first one. */
interestPeriodFrom: string | null;
/** The period this interest belongs to, as the engine dated it. */
interestPostingDate: string;
depositAmount: number | null;
interestRate: number | null;
maturityDate: string | null;
balance: number;
interest: number;
payoutAccountNo: string | null;
}
/** One product's deposits due on the day being closed, as the day-close screen shows them. */
export interface FdDayCloseDueRow {
productId: number;
productName: string;
fdType: FdType;
accountCount: number;
totalInterest: number;
reportStatus: FdInterestReportStatus | 'NONE';
}
export interface FdDayCloseCheck {
businessDate: string;
canClose: boolean;
pendingProducts: string[];
due: FdDayCloseDueRow[];
}
/**
* The fixed deposit interest posting reports, one per branch and product: generated at noon on a
* posting date, approved by a second user of the branch, posted when the branch closes the day.
*/
@Injectable({ providedIn: 'root' })
export class FdInterestPostingReportService {
private http = inject(HttpClient);
private readonly base = '/fixeddepositinterestpostingreports';
/** scope 'own' is the user's own branch; 'others' (head office only) every other branch. */
list(
postingDate?: string,
status?: string,
officeId?: number,
scope?: FdReportScope
): Observable<FdInterestReport[]> {
let params = new HttpParams();
if (scope) params = params.set('scope', scope);
if (postingDate) params = params.set('postingDate', postingDate);
if (status) params = params.set('status', status);
if (officeId) params = params.set('officeId', String(officeId));
return this.http.get<FdInterestReport[]>(this.base, { params });
}
/** Branch and product pairs with deposit interest due by the date and no report yet. */
dueWithoutReport(postingDate?: string, scope?: FdReportScope): Observable<FdInterestDue[]> {
let params = new HttpParams();
if (scope) params = params.set('scope', scope);
if (postingDate) params = params.set('postingDate', postingDate);
return this.http.get<FdInterestDue[]>(`${this.base}/due-without-report`, { params });
}
/**
* The signed-in user's branch, whether it is the head office, and whether deposits are on the
* approval path at all — with that switched off these screens are empty by design.
*/
context(): Observable<{ officeId: number; officeName: string; headOffice: boolean; approvalEnabled: boolean }> {
return this.http.get<{ officeId: number; officeName: string; headOffice: boolean; approvalEnabled: boolean }>(
`${this.base}/context`
);
}
detail(reportId: number): Observable<FdInterestReportDetail> {
return this.http.get<FdInterestReportDetail>(`${this.base}/${reportId}`);
}
regenerate(
productId: number,
officeId: number,
postingDate: string
): Observable<{ reportId: number; status: string }> {
return this.http.post<{ reportId: number; status: string }>(
this.base,
{ productId, officeId, postingDate },
{ params: new HttpParams().set('command', 'regenerate') }
);
}
approve(reportId: number): Observable<{ reportId: number; status: string }> {
return this.http.post<{ reportId: number; status: string }>(
`${this.base}/${reportId}`,
{},
{ params: new HttpParams().set('command', 'approve') }
);
}
/** What each deposit has earned and not been paid, as if posted today. View only. */
preview(officeId?: number): Observable<FdInterestPreviewRow[]> {
let params = new HttpParams();
if (officeId) params = params.set('officeId', String(officeId));
return this.http.get<FdInterestPreviewRow[]>(`${this.base}/preview`, { params });
}
/** What stops a branch closing its day, and the deposits behind it. */
dayCloseCheck(date?: string, officeId?: number): Observable<FdDayCloseCheck> {
let params = new HttpParams();
if (date) params = params.set('date', date);
if (officeId) params = params.set('officeId', String(officeId));
return this.http.get<FdDayCloseCheck>(`${this.base}/day-close-check`, { params });
}
/** The head office's branch-wise view over a date range. */
summary(fromDate?: string, toDate?: string, productId?: number): Observable<FdInterestSummaryRow[]> {
let params = new HttpParams();
if (fromDate) params = params.set('fromDate', fromDate);
if (toDate) params = params.set('toDate', toDate);
if (productId) params = params.set('productId', String(productId));
return this.http.get<FdInterestSummaryRow[]>(`${this.base}/summary`, { params });
}
/** Deposit interest posted without this report's approval — a deposit maturing mid-cycle, chiefly. */
outsideApproval(
fromDate?: string,
toDate?: string,
officeId?: number,
scope?: FdReportScope
): Observable<FdOutsideApprovalRow[]> {
let params = new HttpParams();
if (scope) params = params.set('scope', scope);
if (fromDate) params = params.set('fromDate', fromDate);
if (toDate) params = params.set('toDate', toDate);
if (officeId) params = params.set('officeId', String(officeId));
return this.http.get<FdOutsideApprovalRow[]>(`${this.base}/outside-approval`, { params });
}
}
src/app/interest-posting-report/interest-posting-report.component.html
+4 -136
View File
@@ -22,134 +22,9 @@
<input type="date" [(ngModel)]="postingDate" (change)="load()" /> <input type="date" [(ngModel)]="postingDate" (change)="load()" />
</label> </label>
<button class="ipr-btn" (click)="load()" [disabled]="loading"><fa-icon icon="undo"></fa-icon> Reload</button> <button class="ipr-btn" (click)="load()" [disabled]="loading"><fa-icon icon="undo"></fa-icon> Reload</button>
<button class="ipr-btn ipr-btn--primary" (click)="openPreview()" [disabled]="previewLoading">
<fa-icon icon="eye"></fa-icon> Preview interest (today)
</button>
</div> </div>
</div> </div>
@if (isHeadOffice) {
<div class="ipr-tabs">
<button class="ipr-tab" [class.is-active]="tab === 'own'" (click)="switchTab('own')">
<fa-icon icon="building"></fa-icon> My branch{{ myBranch ? ' — ' + myBranch : '' }}
</button>
<button class="ipr-tab" [class.is-active]="tab === 'others'" (click)="switchTab('others')">
<fa-icon icon="sitemap"></fa-icon> Other branches
</button>
</div>
@if (tab === 'others') {
<div class="ipr-alert ipr-alert--info">
<fa-icon icon="info-circle"></fa-icon>
<div>
Each branch generates and approves its own reports. The head office can act here only for a branch that has
not opened the day, and only once every other open branch has closed. Anything it approves is marked (HO).
</div>
</div>
}
}
@if (showPreview) {
<div class="ipr-card">
<div class="ipr-detail-head">
<div>
<h3>Interest preview — earned up to {{ previewAsOf }}</h3>
<div class="muted">
What each account would be paid if interest were posted today. View only — nothing is saved, approved or
posted.
</div>
</div>
<div class="ipr-total">
<span>Total so far</span>
<strong>₹{{ previewTotal | number: '1.2-2' }}</strong>
<span class="muted">{{ previewRows.length }} account(s)</span>
</div>
</div>
<div class="ipr-preview-actions">
<button class="ipr-btn ipr-btn--slim" (click)="openPreview()" [disabled]="previewLoading">
<fa-icon icon="undo"></fa-icon> Refresh
</button>
<button
class="ipr-btn ipr-btn--slim"
(click)="exportPreview()"
[disabled]="previewLoading || previewRows.length === 0"
>
<fa-icon icon="file-excel"></fa-icon> Export Excel
</button>
<button class="ipr-btn ipr-btn--slim" (click)="closePreview()"><fa-icon icon="times"></fa-icon> Close</button>
</div>
@if (previewLoading) {
<div class="ipr-empty">Calculating interest up to today…</div>
} @else {
<table class="ipr-table">
<thead>
<tr>
<th>Branch</th>
<th>Product</th>
<th>Posting date</th>
<th class="num">Accounts</th>
<th class="num">Interest so far</th>
</tr>
</thead>
<tbody>
@for (g of previewGroups; track g.officeName + g.productName) {
<tr>
<td>{{ g.officeName }}</td>
<td>
<strong>{{ g.productName }}</strong>
</td>
<td>{{ g.postingDate }}</td>
<td class="num">{{ g.accounts }}</td>
<td class="num">₹{{ g.interest | number: '1.2-2' }}</td>
</tr>
} @empty {
<tr>
<td colspan="5" class="ipr-empty">No savings account has interest accrued in its current cycle.</td>
</tr>
}
</tbody>
</table>
@if (previewRows.length > 0) {
<table class="ipr-table">
<thead>
<tr>
<th>Branch</th>
<th>Product</th>
<th>Account no</th>
<th>Account holder</th>
<th class="num">Balance</th>
<th class="num">Rate %</th>
<th>Cycle</th>
<th class="num">Interest so far</th>
</tr>
</thead>
<tbody>
@for (r of previewRows; track r.savingsAccountId) {
<tr>
<td>{{ r.officeName }}</td>
<td>{{ r.productName }}</td>
<td>{{ r.accountNo }}</td>
<td>{{ r.clientName }}</td>
<td class="num">₹{{ r.balance | number: '1.2-2' }}</td>
<td class="num">{{ r.rate | number: '1.2-2' }}</td>
<td class="muted">{{ r.cycleStart }} → {{ r.postingDate }}</td>
<td class="num">₹{{ r.interest | number: '1.2-2' }}</td>
</tr>
}
</tbody>
<tfoot>
<tr>
<td colspan="7"><strong>Total</strong></td>
<td class="num">
<strong>₹{{ previewTotal | number: '1.2-2' }}</strong>
</td>
</tr>
</tfoot>
</table>
}
}
</div>
}
@if (errorMessage) { @if (errorMessage) {
<div class="ipr-alert ipr-alert--error"> <div class="ipr-alert ipr-alert--error">
<fa-icon icon="exclamation-triangle"></fa-icon> <fa-icon icon="exclamation-triangle"></fa-icon>
@@ -177,13 +52,9 @@
@for (d of due; track d.productId + '-' + d.officeId) { @for (d of due; track d.productId + '-' + d.officeId) {
<div class="ipr-due-row"> <div class="ipr-due-row">
<strong>{{ d.productName }}</strong> <span>· {{ d.officeName }} · {{ d.postingDate }}</span> <strong>{{ d.productName }}</strong> <span>· {{ d.officeName }} · {{ d.postingDate }}</span>
@if (d.canAct) { <button class="ipr-btn ipr-btn--primary ipr-btn--slim" (click)="generate(d)" [disabled]="busy">
<button class="ipr-btn ipr-btn--primary ipr-btn--slim" (click)="generate(d)" [disabled]="busy"> <fa-icon icon="sync"></fa-icon> Generate report
<fa-icon icon="sync"></fa-icon> {{ tab === 'others' ? 'Generate on behalf' : 'Generate report' }} </button>
</button>
} @else if (d.blockedReason) {
<span class="ipr-blocked">{{ d.blockedReason }}</span>
}
</div> </div>
} }
</div> </div>
@@ -243,12 +114,9 @@
} }
@if (canApprove(r)) { @if (canApprove(r)) {
<button class="ipr-btn ipr-btn--primary ipr-btn--slim" (click)="approve(r)" [disabled]="busy"> <button class="ipr-btn ipr-btn--primary ipr-btn--slim" (click)="approve(r)" [disabled]="busy">
<fa-icon icon="check"></fa-icon> {{ tab === 'others' ? 'Approve on behalf' : 'Approve' }} <fa-icon icon="check"></fa-icon> Approve
</button> </button>
} }
@if (!r.canAct && r.blockedReason && (r.status === 'GENERATED' || r.status === 'APPROVED')) {
<span class="ipr-blocked">{{ r.blockedReason }}</span>
}
</td> </td>
</tr> </tr>
} @empty { } @empty {
src/app/interest-posting-report/interest-posting-report.component.scss
-51
View File
@@ -274,54 +274,3 @@
font-weight: 600; font-weight: 600;
color: var(--i-amber); color: var(--i-amber);
} }
// Preview: refresh / export / close, above the totals.
.ipr-preview-actions {
display: flex;
gap: 6px;
justify-content: flex-end;
padding: 0 16px 10px;
}
.ipr-tabs {
display: flex;
gap: 4px;
margin-bottom: 12px;
border-bottom: 1px solid var(--i-g200);
}
.ipr-tab {
display: inline-flex;
align-items: center;
gap: 6px;
padding: 8px 14px;
margin-bottom: -1px;
font-size: 13px;
font-weight: 600;
color: var(--i-g500);
cursor: pointer;
background: transparent;
border: 1px solid transparent;
border-radius: 6px 6px 0 0;
&.is-active {
color: var(--i-navy);
background: #fff;
border-color: var(--i-g200);
border-bottom-color: #fff;
}
}
.ipr-alert--info {
background: var(--i-blue-l);
color: var(--i-blue);
}
.ipr-blocked {
display: inline-block;
max-width: 320px;
font-size: 11px;
line-height: 1.35;
color: var(--i-g500);
white-space: normal;
}
src/app/interest-posting-report/interest-posting-report.component.ts
+6 -204
View File
@@ -11,14 +11,11 @@ import { FormsModule } from '@angular/forms';
import { FaIconComponent } from '@fortawesome/angular-fontawesome'; import { FaIconComponent } from '@fortawesome/angular-fontawesome';
import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module'; import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
import { SettingsService } from 'app/settings/settings.service'; import { SettingsService } from 'app/settings/settings.service';
import { exportWorkbook } from '../cashier/cashier-export';
import { import {
InterestPostingDue, InterestPostingDue,
InterestPostingReport, InterestPostingReport,
InterestPostingReportDetail, InterestPostingReportDetail,
InterestPostingReportService, InterestPostingReportService
InterestPreviewRow,
ReportScope
} from './interest-posting-report.service'; } from './interest-posting-report.service';
/** /**
@@ -54,48 +51,15 @@ export class InterestPostingReportComponent implements OnInit {
/** Products with interest due and no report yet — the noon job ran before they had anything due, or failed. */ /** Products with interest due and no report yet — the noon job ran before they had anything due, or failed. */
due: InterestPostingDue[] = []; due: InterestPostingDue[] = [];
/** 'own' — the user's own branch; 'others' — every other branch, a head-office-only tab. */
tab: ReportScope = 'own';
isHeadOffice = false;
myBranch = '';
ngOnInit(): void { ngOnInit(): void {
this.postingDate = this.businessDateIso(); this.postingDate = this.businessDateIso();
this.reportService.context().subscribe({
next: (ctx) => {
this.isHeadOffice = !!ctx?.headOffice;
this.myBranch = ctx?.officeName ?? '';
},
error: () => (this.isHeadOffice = false)
});
this.load(); this.load();
} }
switchTab(tab: ReportScope): void {
if (this.tab === tab) {
return;
}
this.tab = tab;
this.selected = null;
this.notice = '';
this.load();
}
/** Acting for another branch is the head office's exception, so it is spelt out before it happens. */
private confirmOnBehalf(officeName: string, action: string): boolean {
if (this.tab !== 'others') {
return true;
}
return confirm(
`${officeName} has not opened today. You are about to ${action} its interest posting report on its behalf, ` +
'from the head office. Continue?'
);
}
load(): void { load(): void {
this.loading = true; this.loading = true;
this.errorMessage = ''; this.errorMessage = '';
this.reportService.list(this.postingDate || undefined, undefined, undefined, this.tab).subscribe({ this.reportService.list(this.postingDate || undefined).subscribe({
next: (reports) => { next: (reports) => {
this.reports = reports ?? []; this.reports = reports ?? [];
this.loading = false; this.loading = false;
@@ -111,16 +75,13 @@ export class InterestPostingReportComponent implements OnInit {
this.errorMessage = this.messageOf(err, 'Could not load the interest posting reports.'); this.errorMessage = this.messageOf(err, 'Could not load the interest posting reports.');
} }
}); });
this.reportService.dueWithoutReport(this.postingDate || undefined, this.tab).subscribe({ this.reportService.dueWithoutReport(this.postingDate || undefined).subscribe({
next: (due) => (this.due = due ?? []), next: (due) => (this.due = due ?? []),
error: () => (this.due = []) error: () => (this.due = [])
}); });
} }
generate(item: InterestPostingDue): void { generate(item: InterestPostingDue): void {
if (!this.confirmOnBehalf(item.officeName, 'generate')) {
return;
}
this.busy = true; this.busy = true;
this.notice = ''; this.notice = '';
this.errorMessage = ''; this.errorMessage = '';
@@ -150,8 +111,7 @@ export class InterestPostingReportComponent implements OnInit {
if ( if (
!confirm( !confirm(
`Regenerate the interest posting report for ${report.productName} — ${report.officeName}? It will need approving again.` `Regenerate the interest posting report for ${report.productName} — ${report.officeName}? It will need approving again.`
) || )
!this.confirmOnBehalf(report.officeName, 'regenerate')
) { ) {
return; return;
} }
@@ -178,8 +138,7 @@ export class InterestPostingReportComponent implements OnInit {
!confirm( !confirm(
`Approve interest of ₹${report.totalInterest} across ${report.accountCount} account(s) for ${report.productName}? ` + `Approve interest of ₹${report.totalInterest} across ${report.accountCount} account(s) for ${report.productName}? ` +
'It will be posted when the branch closes the day.' 'It will be posted when the branch closes the day.'
) || )
!this.confirmOnBehalf(report.officeName, 'approve')
) { ) {
return; return;
} }
@@ -218,165 +177,8 @@ export class InterestPostingReportComponent implements OnInit {
); );
} }
/** Pending reports that block this user's own day close; another branch's pending reports block only that branch. */
get pendingCount(): number { get pendingCount(): number {
return this.tab === 'own' ? this.reports.filter((r) => r.status === 'GENERATED').length : 0; return this.reports.filter((r) => r.status === 'GENERATED').length;
}
// ── Preview: what each account has earned so far, as if posted today. View only. ──
showPreview = false;
previewLoading = false;
previewRows: InterestPreviewRow[] = [];
previewAsOf = '';
openPreview(): void {
this.showPreview = true;
this.previewLoading = true;
this.errorMessage = '';
this.reportService.preview().subscribe({
next: (rows) => {
this.previewRows = rows ?? [];
this.previewAsOf = this.previewRows[0]?.asOf ?? this.businessDateIso();
this.previewLoading = false;
},
error: (err) => {
this.previewLoading = false;
this.previewRows = [];
this.errorMessage = this.messageOf(err, 'Could not load the interest preview.');
}
});
}
closePreview(): void {
this.showPreview = false;
}
get previewTotal(): number {
return this.previewRows.reduce((sum, r) => sum + Number(r.interest || 0), 0);
}
/** Totals by branch and product, for the summary above the account list and the export. */
get previewGroups(): {
officeName: string;
productName: string;
postingDate: string;
accounts: number;
interest: number;
}[] {
const map = new Map<
string,
{ officeName: string; productName: string; postingDate: string; accounts: number; interest: number }
>();
this.previewRows.forEach((r) => {
const key = `${r.officeName}|${r.productName}`;
const g = map.get(key) ?? {
officeName: r.officeName,
productName: r.productName,
postingDate: r.postingDate,
accounts: 0,
interest: 0
};
g.accounts += 1;
g.interest += Number(r.interest || 0);
map.set(key, g);
});
return [...map.values()];
}
exportPreview(): void {
const stamp = `Interest earned to ${this.previewAsOf} — preview, not posted`;
exportWorkbook(
[
{
sheetName: 'By account',
title: 'Savings Interest Preview',
subtitle: stamp,
headers: [
'Branch',
'Product',
'Account No',
'Customer',
'Balance',
'Rate %',
'Cycle Start',
'Posting Date',
'Interest So Far'
],
widths: [
18,
22,
20,
26,
16,
8,
12,
12,
16
],
rows: [
...this.previewRows.map((r) => [
r.officeName,
r.productName,
r.accountNo,
r.clientName,
Number(r.balance || 0),
Number(r.rate || 0),
r.cycleStart,
r.postingDate,
Number(r.interest || 0)
]),
[
'TOTAL',
'',
'',
'',
'',
'',
'',
'',
this.previewTotal
]
]
},
{
sheetName: 'By branch & product',
title: 'Savings Interest Preview — Totals',
subtitle: stamp,
headers: [
'Branch',
'Product',
'Posting Date',
'Accounts',
'Interest So Far'
],
widths: [
18,
22,
12,
10,
16
],
rows: [
...this.previewGroups.map((g) => [
g.officeName,
g.productName,
g.postingDate,
g.accounts,
g.interest
]),
[
'TOTAL',
'',
'',
this.previewRows.length,
this.previewTotal
]
]
}
],
`savings-interest-preview-${this.previewAsOf}`
);
} }
private businessDateIso(): string { private businessDateIso(): string {
src/app/interest-posting-report/interest-posting-report.service.ts
+2 -45
View File
@@ -12,9 +12,6 @@ import { Observable } from 'rxjs';
export type InterestPostingReportStatus = 'GENERATED' | 'APPROVED' | 'POSTED' | 'SUPERSEDED'; export type InterestPostingReportStatus = 'GENERATED' | 'APPROVED' | 'POSTED' | 'SUPERSEDED';
/** Which branches a list covers: the user's own, or (head office only) every other branch. */
export type ReportScope = 'own' | 'others';
export interface InterestPostingReport { export interface InterestPostingReport {
id: number; id: number;
productId: number; productId: number;
@@ -35,8 +32,6 @@ export interface InterestPostingReport {
failureReason: string | null; failureReason: string | null;
/** Whether the signed-in user may regenerate or approve it: their own branch, or the head office for a branch that did not open. */ /** Whether the signed-in user may regenerate or approve it: their own branch, or the head office for a branch that did not open. */
canAct: boolean; canAct: boolean;
/** Why not, where canAct is false. */
blockedReason: string | null;
} }
export interface InterestPostingReportLine { export interface InterestPostingReportLine {
@@ -65,8 +60,6 @@ export interface InterestPostingDue {
officeId: number; officeId: number;
officeName: string; officeName: string;
postingDate: string; postingDate: string;
canAct: boolean;
blockedReason: string | null;
} }
export interface InterestPostingSummaryRow { export interface InterestPostingSummaryRow {
@@ -85,22 +78,6 @@ export interface InterestPostingSummaryRow {
postedAt: string | null; postedAt: string | null;
} }
export interface InterestPreviewRow {
officeId: number;
officeName: string;
productId: number;
productName: string;
savingsAccountId: number;
accountNo: string;
clientName: string;
balance: number;
rate: number;
cycleStart: string;
postingDate: string;
asOf: string;
interest: number;
}
/** /**
* The savings interest posting reports, one per branch and product: generated at noon on a posting * The savings interest posting reports, one per branch and product: generated at noon on a posting
* date, approved by the branch, posted when the branch closes the day. * date, approved by the branch, posted when the branch closes the day.
@@ -110,15 +87,8 @@ export class InterestPostingReportService {
private http = inject(HttpClient); private http = inject(HttpClient);
private readonly base = '/savingsinterestpostingreports'; private readonly base = '/savingsinterestpostingreports';
/** scope 'own' is the user's own branch; 'others' (head office only) every other branch. */ list(postingDate?: string, status?: string, officeId?: number): Observable<InterestPostingReport[]> {
list(
postingDate?: string,
status?: string,
officeId?: number,
scope?: ReportScope
): Observable<InterestPostingReport[]> {
let params = new HttpParams(); let params = new HttpParams();
if (scope) params = params.set('scope', scope);
if (postingDate) params = params.set('postingDate', postingDate); if (postingDate) params = params.set('postingDate', postingDate);
if (status) params = params.set('status', status); if (status) params = params.set('status', status);
if (officeId) params = params.set('officeId', String(officeId)); if (officeId) params = params.set('officeId', String(officeId));
@@ -126,18 +96,12 @@ export class InterestPostingReportService {
} }
/** Branch and product pairs with interest due by the date and no report yet, that this user may generate. */ /** Branch and product pairs with interest due by the date and no report yet, that this user may generate. */
dueWithoutReport(postingDate?: string, scope?: ReportScope): Observable<InterestPostingDue[]> { dueWithoutReport(postingDate?: string): Observable<InterestPostingDue[]> {
let params = new HttpParams(); let params = new HttpParams();
if (scope) params = params.set('scope', scope);
if (postingDate) params = params.set('postingDate', postingDate); if (postingDate) params = params.set('postingDate', postingDate);
return this.http.get<InterestPostingDue[]>(`${this.base}/due-without-report`, { params }); return this.http.get<InterestPostingDue[]>(`${this.base}/due-without-report`, { params });
} }
/** The signed-in user's branch, and whether it is the head office. */
context(): Observable<{ officeId: number; officeName: string; headOffice: boolean }> {
return this.http.get<{ officeId: number; officeName: string; headOffice: boolean }>(`${this.base}/context`);
}
detail(reportId: number): Observable<InterestPostingReportDetail> { detail(reportId: number): Observable<InterestPostingReportDetail> {
return this.http.get<InterestPostingReportDetail>(`${this.base}/${reportId}`); return this.http.get<InterestPostingReportDetail>(`${this.base}/${reportId}`);
} }
@@ -162,13 +126,6 @@ export class InterestPostingReportService {
); );
} }
/** Interest each account has earned so far this cycle, as if posted today. View only. */
preview(officeId?: number): Observable<InterestPreviewRow[]> {
let params = new HttpParams();
if (officeId) params = params.set('officeId', String(officeId));
return this.http.get<InterestPreviewRow[]>(`${this.base}/preview`, { params });
}
/** The head office's branch-wise view over a date range. */ /** The head office's branch-wise view over a date range. */
summary(fromDate?: string, toDate?: string, productId?: number): Observable<InterestPostingSummaryRow[]> { summary(fromDate?: string, toDate?: string, productId?: number): Observable<InterestPostingSummaryRow[]> {
let params = new HttpParams(); let params = new HttpParams();
src/app/products/products.component.scss
+27 -27
View File
@@ -15,43 +15,43 @@ $gray-900: #0f172a;
// ── Container ── // ── Container ──
.pd-container { .pd-container {
max-width: 1280px; max-width: 1100px;
margin: 0 auto; margin: 0 auto;
padding: 12px 16px; padding: 24px 20px;
} }
// ── Page Header ── // ── Page Header ──
.pd-header { .pd-header {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 10px; gap: 16px;
margin-bottom: 14px; margin-bottom: 28px;
&__icon { &__icon {
width: 34px; width: 44px;
height: 34px; height: 44px;
border-radius: 7px; border-radius: 10px;
background: linear-gradient(135deg, #0d3d78, #1a5276); background: linear-gradient(135deg, #0d3d78, #1a5276);
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
color: #fff; color: #fff;
font-size: 14px; font-size: 18px;
flex-shrink: 0; flex-shrink: 0;
} }
&__title { &__title {
font-size: 16px; font-size: 20px;
font-weight: 700; font-weight: 700;
color: $gray-900; color: $gray-900;
margin: 0; margin: 0;
letter-spacing: -0.2px; letter-spacing: -0.3px;
} }
&__sub { &__sub {
font-size: 11.5px; font-size: 13px;
color: $gray-500; color: $gray-500;
margin: 1px 0 0; margin: 2px 0 0;
} }
} }
@@ -59,7 +59,7 @@ $gray-900: #0f172a;
.pd-grid { .pd-grid {
display: grid; display: grid;
grid-template-columns: repeat(2, 1fr); grid-template-columns: repeat(2, 1fr);
gap: 8px; gap: 12px;
@media (width <= 768px) { @media (width <= 768px) {
grid-template-columns: 1fr; grid-template-columns: 1fr;
@@ -70,11 +70,11 @@ $gray-900: #0f172a;
.pd-card { .pd-card {
display: flex; display: flex;
align-items: center; align-items: center;
gap: 10px; gap: 14px;
padding: 8px 12px; padding: 14px 16px;
background: #fff; background: #fff;
border: 1px solid $border; border: 1px solid $border;
border-radius: 7px; border-radius: 10px;
text-decoration: none; text-decoration: none;
cursor: pointer; cursor: pointer;
transition: all 0.15s ease; transition: all 0.15s ease;
@@ -82,7 +82,7 @@ $gray-900: #0f172a;
&:hover { &:hover {
border-color: #cbd5e1; border-color: #cbd5e1;
background: $gray-50; background: $gray-50;
box-shadow: 0 1px 6px rgb(0 0 0 / 4%); box-shadow: 0 2px 8px rgb(0 0 0 / 4%);
.pd-card__arrow { .pd-card__arrow {
color: $gray-700; color: $gray-700;
@@ -91,13 +91,13 @@ $gray-900: #0f172a;
} }
&__icon { &__icon {
width: 30px; width: 40px;
height: 30px; height: 40px;
border-radius: 6px; border-radius: 9px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-size: 12.5px; font-size: 15px;
flex-shrink: 0; flex-shrink: 0;
&--blue { &--blue {
@@ -167,25 +167,25 @@ $gray-900: #0f172a;
} }
&__title { &__title {
font-size: 12px; font-size: 13.5px;
font-weight: 600; font-weight: 600;
color: $gray-900; color: $gray-900;
margin: 0; margin: 0;
line-height: 1.25; line-height: 1.3;
} }
&__desc { &__desc {
font-size: 10.5px; font-size: 11.5px;
color: $gray-400; color: $gray-400;
margin: 1px 0 0; margin: 3px 0 0;
line-height: 1.3; line-height: 1.35;
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
} }
&__arrow { &__arrow {
font-size: 10px; font-size: 11px;
color: #cbd5e1; color: #cbd5e1;
flex-shrink: 0; flex-shrink: 0;
transition: all 0.15s ease; transition: all 0.15s ease;
src/app/products/saving-products/create-saving-product/create-saving-product.component.html
+1 -1
View File
@@ -144,7 +144,7 @@
</button> </button>
} }
@if (savingProductFormValid && selectedTabIndex === totalTabs - 1) { @if (savingProductFormValid && selectedTabIndex === totalTabs - 1) {
<button mat-raised-button color="primary" [disabled]="submitting" (click)="submit()"> <button mat-raised-button color="primary" (click)="submit()">
<i class="fas fa-check" style="margin-right: 8px"></i> <i class="fas fa-check" style="margin-right: 8px"></i>
{{ 'labels.buttons.Submit' | translate }} {{ 'labels.buttons.Submit' | translate }}
</button> </button>
src/app/products/saving-products/create-saving-product/create-saving-product.component.ts
+1 -13
View File
@@ -70,10 +70,6 @@ export class CreateSavingProductComponent {
savingProductsTemplate: any; savingProductsTemplate: any;
accountingRuleData: string[] = []; accountingRuleData: string[] = [];
selectedTabIndex = 0; selectedTabIndex = 0;
/** Guards against repeat clicks on Submit: the product name is unique in the database, so a
* second request for the same form fails with a duplicate key error even though the first one
* created the product. */
submitting = false;
/** /**
* @param {ActivatedRoute} route Activated Route. * @param {ActivatedRoute} route Activated Route.
@@ -166,11 +162,8 @@ export class CreateSavingProductComponent {
} }
submit() { submit() {
if (this.submitting) {
return;
}
this.submitting = true;
const savingProduct = this.prepareSavingProductPayload(); const savingProduct = this.prepareSavingProductPayload();
console.log('Saving product submit payload:', savingProduct);
this.productsService.createSavingProduct(savingProduct).subscribe({ this.productsService.createSavingProduct(savingProduct).subscribe({
next: (response: any) => { next: (response: any) => {
if (response?.rollbackTransaction) { if (response?.rollbackTransaction) {
@@ -188,11 +181,6 @@ export class CreateSavingProductComponent {
{ relativeTo: this.route } { relativeTo: this.route }
); );
} }
},
error: () => {
// the error itself is reported by the global error handler; just let the user correct the
// form and try again
this.submitting = false;
} }
}); });
} }
src/app/reports/reports-routing.module.ts
-8
View File
@@ -92,14 +92,6 @@ const routes: Routes = [
(m) => m.InterestPostingReportComponent (m) => m.InterestPostingReportComponent
) )
}, },
{
path: 'fd-interest-posting',
data: { title: 'FD Interest Posting Reports', breadcrumb: 'FD Interest Posting Reports' },
loadComponent: () =>
import('../fd-interest-posting-report/fd-interest-posting-report.component').then(
(m) => m.FdInterestPostingReportComponent
)
},
{ {
path: 'dormancy', path: 'dormancy',
data: { title: 'Inactive, Dormant & DEAF', breadcrumb: 'Inactive, Dormant & DEAF' }, data: { title: 'Inactive, Dormant & DEAF', breadcrumb: 'Inactive, Dormant & DEAF' },
src/app/savings/saving-account-actions/approve-savings-account/approve-savings-account.component.ts
+15 -1
View File
@@ -11,6 +11,7 @@ import { Component, OnInit, inject } from '@angular/core';
import { UntypedFormGroup, UntypedFormBuilder, Validators, ReactiveFormsModule } from '@angular/forms'; import { UntypedFormGroup, UntypedFormBuilder, Validators, ReactiveFormsModule } from '@angular/forms';
import { ActivatedRoute, Router, RouterLink } from '@angular/router'; import { ActivatedRoute, Router, RouterLink } from '@angular/router';
import { Dates } from 'app/core/utils/dates'; import { Dates } from 'app/core/utils/dates';
import { AlertService } from 'app/core/alert/alert.service';
/** Custom Services */ /** Custom Services */
import { SavingsService } from 'app/savings/savings.service'; import { SavingsService } from 'app/savings/savings.service';
@@ -37,6 +38,7 @@ export class ApproveSavingsAccountComponent implements OnInit {
private route = inject(ActivatedRoute); private route = inject(ActivatedRoute);
private router = inject(Router); private router = inject(Router);
private settingsService = inject(SettingsService); private settingsService = inject(SettingsService);
private alertService = inject(AlertService);
/** Minimum date allowed. */ /** Minimum date allowed. */
minDate = new Date(2000, 0, 1); minDate = new Date(2000, 0, 1);
@@ -98,7 +100,19 @@ export class ApproveSavingsAccountComponent implements OnInit {
dateFormat, dateFormat,
locale locale
}; };
this.savingsService.executeSavingsAccountCommand(this.accountId, 'approve', data).subscribe(() => { this.savingsService.executeSavingsAccountCommand(this.accountId, 'approve', data).subscribe((response: any) => {
// Parked in the Checker Inbox rather than executed (HTTP 200 with rollbackTransaction: true).
// The account is therefore still pending, so chaining activation onto it would be applied to an
// unapproved account -- stop here and say what is actually waiting.
if (response?.rollbackTransaction) {
this.alertService.alert({
type: 'Success',
message:
'This approval has been sent for checker approval. The account stays pending until a checker approves it.'
});
this.router.navigate(['../../transactions'], { relativeTo: this.route });
return;
}
const activationData = { const activationData = {
activatedOnDate: approveSavingsAccountFormData.approvedOnDate, activatedOnDate: approveSavingsAccountFormData.approvedOnDate,
dateFormat, dateFormat,
src/app/savings/saving-account-actions/close-savings-account/close-savings-account.component.ts
+11 -1
View File
@@ -20,6 +20,7 @@ import { Dates } from 'app/core/utils/dates';
/** Custom Services */ /** Custom Services */
import { SavingsService } from 'app/savings/savings.service'; import { SavingsService } from 'app/savings/savings.service';
import { AlertService } from 'app/core/alert/alert.service';
import { SettingsService } from 'app/settings/settings.service'; import { SettingsService } from 'app/settings/settings.service';
import { MatCheckbox } from '@angular/material/checkbox'; import { MatCheckbox } from '@angular/material/checkbox';
import { MatSlideToggle } from '@angular/material/slide-toggle'; import { MatSlideToggle } from '@angular/material/slide-toggle';
@@ -47,6 +48,7 @@ export class CloseSavingsAccountComponent implements OnInit {
private route = inject(ActivatedRoute); private route = inject(ActivatedRoute);
private router = inject(Router); private router = inject(Router);
private settingsService = inject(SettingsService); private settingsService = inject(SettingsService);
private alertService = inject(AlertService);
/** Minimum date allowed. */ /** Minimum date allowed. */
minDate = new Date(2000, 0, 1); minDate = new Date(2000, 0, 1);
@@ -158,7 +160,15 @@ export class CloseSavingsAccountComponent implements OnInit {
dateFormat, dateFormat,
locale locale
}; };
this.savingsService.executeSavingsAccountCommand(this.accountId, 'close', data).subscribe(() => { this.savingsService.executeSavingsAccountCommand(this.accountId, 'close', data).subscribe((response: any) => {
// Parked in the Checker Inbox rather than executed (HTTP 200 with rollbackTransaction: true),
// so the account is still open -- say so instead of letting that read as "nothing happened".
if (response?.rollbackTransaction) {
this.alertService.alert({
type: 'Success',
message: 'Closure has been sent for checker approval. The account is unchanged until a checker approves it.'
});
}
this.router.navigate(['../../transactions'], { relativeTo: this.route }); this.router.navigate(['../../transactions'], { relativeTo: this.route });
}); });
} }
src/app/savings/saving-account-actions/reject-savings-account/reject-savings-account.component.ts
+12 -1
View File
@@ -14,6 +14,7 @@ import { Dates } from 'app/core/utils/dates';
/** Custom Services */ /** Custom Services */
import { SavingsService } from 'app/savings/savings.service'; import { SavingsService } from 'app/savings/savings.service';
import { AlertService } from 'app/core/alert/alert.service';
import { SettingsService } from 'app/settings/settings.service'; import { SettingsService } from 'app/settings/settings.service';
import { CdkTextareaAutosize } from '@angular/cdk/text-field'; import { CdkTextareaAutosize } from '@angular/cdk/text-field';
import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module'; import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
@@ -37,6 +38,7 @@ export class RejectSavingsAccountComponent implements OnInit {
private route = inject(ActivatedRoute); private route = inject(ActivatedRoute);
private router = inject(Router); private router = inject(Router);
private settingsService = inject(SettingsService); private settingsService = inject(SettingsService);
private alertService = inject(AlertService);
/** Minimum date allowed. */ /** Minimum date allowed. */
minDate = new Date(2000, 0, 1); minDate = new Date(2000, 0, 1);
@@ -97,7 +99,16 @@ export class RejectSavingsAccountComponent implements OnInit {
dateFormat, dateFormat,
locale locale
}; };
this.savingsService.executeSavingsAccountCommand(this.accountId, 'reject', data).subscribe(() => { this.savingsService.executeSavingsAccountCommand(this.accountId, 'reject', data).subscribe((response: any) => {
// Parked in the Checker Inbox rather than executed (HTTP 200 with rollbackTransaction: true),
// so the application is still open -- say so instead of letting that read as "nothing happened".
if (response?.rollbackTransaction) {
this.alertService.alert({
type: 'Success',
message:
'Rejection has been sent for checker approval. The application is unchanged until a checker approves it.'
});
}
this.router.navigate(['../../'], { relativeTo: this.route }); this.router.navigate(['../../'], { relativeTo: this.route });
}); });
} }
src/app/savings/saving-account-actions/undo-approval-savings-account/undo-approval-savings-account.component.ts
+16 -3
View File
@@ -13,6 +13,7 @@ import { ActivatedRoute, Router, RouterLink } from '@angular/router';
/** Custom Services */ /** Custom Services */
import { SavingsService } from 'app/savings/savings.service'; import { SavingsService } from 'app/savings/savings.service';
import { AlertService } from 'app/core/alert/alert.service';
import { CdkTextareaAutosize } from '@angular/cdk/text-field'; import { CdkTextareaAutosize } from '@angular/cdk/text-field';
import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module'; import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
@@ -33,6 +34,7 @@ export class UndoApprovalSavingsAccountComponent implements OnInit {
private savingsService = inject(SavingsService); private savingsService = inject(SavingsService);
private route = inject(ActivatedRoute); private route = inject(ActivatedRoute);
private router = inject(Router); private router = inject(Router);
private alertService = inject(AlertService);
/** Undo Approval Savings Account form. */ /** Undo Approval Savings Account form. */
undoApprovalSavingsAccountForm: UntypedFormGroup; undoApprovalSavingsAccountForm: UntypedFormGroup;
@@ -73,8 +75,19 @@ export class UndoApprovalSavingsAccountComponent implements OnInit {
const data = { const data = {
...this.undoApprovalSavingsAccountForm.value ...this.undoApprovalSavingsAccountForm.value
}; };
this.savingsService.executeSavingsAccountCommand(this.accountId, 'undoapproval', data).subscribe(() => { this.savingsService
this.router.navigate(['../../transactions'], { relativeTo: this.route }); .executeSavingsAccountCommand(this.accountId, 'undoapproval', data)
}); .subscribe((response: any) => {
// Parked in the Checker Inbox rather than executed (HTTP 200 with rollbackTransaction: true),
// so the account reloads unchanged -- say so instead of letting that read as "it worked".
if (response?.rollbackTransaction) {
this.alertService.alert({
type: 'Success',
message:
'Undo approval has been sent for checker approval. The account is unchanged until a checker approves it.'
});
}
this.router.navigate(['../../transactions'], { relativeTo: this.route });
});
} }
} }
src/app/savings/saving-account-actions/withdraw-by-client-savings-account/withdraw-by-client-savings-account.component.ts
+16 -3
View File
@@ -14,6 +14,7 @@ import { Dates } from 'app/core/utils/dates';
/** Custom Services */ /** Custom Services */
import { SavingsService } from 'app/savings/savings.service'; import { SavingsService } from 'app/savings/savings.service';
import { AlertService } from 'app/core/alert/alert.service';
import { SettingsService } from 'app/settings/settings.service'; import { SettingsService } from 'app/settings/settings.service';
import { CdkTextareaAutosize } from '@angular/cdk/text-field'; import { CdkTextareaAutosize } from '@angular/cdk/text-field';
import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module'; import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
@@ -37,6 +38,7 @@ export class WithdrawByClientSavingsAccountComponent implements OnInit {
private route = inject(ActivatedRoute); private route = inject(ActivatedRoute);
private router = inject(Router); private router = inject(Router);
private settingsService = inject(SettingsService); private settingsService = inject(SettingsService);
private alertService = inject(AlertService);
/** Minimum date allowed. */ /** Minimum date allowed. */
minDate = new Date(2000, 0, 1); minDate = new Date(2000, 0, 1);
@@ -97,8 +99,19 @@ export class WithdrawByClientSavingsAccountComponent implements OnInit {
dateFormat, dateFormat,
locale locale
}; };
this.savingsService.executeSavingsAccountCommand(this.accountId, 'withdrawnByApplicant', data).subscribe(() => { this.savingsService
this.router.navigate(['../../'], { relativeTo: this.route }); .executeSavingsAccountCommand(this.accountId, 'withdrawnByApplicant', data)
}); .subscribe((response: any) => {
// Parked in the Checker Inbox rather than executed (HTTP 200 with rollbackTransaction: true),
// so the application is still open -- say so instead of letting that read as "nothing happened".
if (response?.rollbackTransaction) {
this.alertService.alert({
type: 'Success',
message:
'Withdrawal has been sent for checker approval. The application is unchanged until a checker approves it.'
});
}
this.router.navigate(['../../'], { relativeTo: this.route });
});
} }
} }
src/app/savings/savings-account-view/savings-account-view.component.ts
+10 -1
View File
@@ -446,7 +446,16 @@ export class SavingsAccountViewComponent implements OnInit {
if (response.confirm) { if (response.confirm) {
this.savingsService this.savingsService
.executeSavingsAccountCommand(this.savingsAccountData.id, 'postInterest', {}) .executeSavingsAccountCommand(this.savingsAccountData.id, 'postInterest', {})
.subscribe(() => { .subscribe((commandResponse: any) => {
// Parked in the Checker Inbox rather than executed (HTTP 200 with
// rollbackTransaction: true), so the reload below shows no new interest posting.
if (commandResponse?.rollbackTransaction) {
this.alertService.alert({
type: 'Success',
message:
'Interest posting has been sent for checker approval. No interest is posted until a checker approves it.'
});
}
this.reload(); this.reload();
}); });
} }
src/app/shared/loading-screen/loading-screen.component.html
-80
View File
@@ -1,80 +0,0 @@
<!--
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/.
-->
@if (active) {
@if (currentMode === 'overlay') {
<!-- Mifos Mobile Transaction / Action Progress Overlay -->
<div class="cbs-loading-backdrop" (click)="preventDismiss($event)">
<div class="cbs-loading-dialog" role="dialog" aria-modal="true" [attr.aria-label]="title || 'Loading'">
<div class="cbs-lottie-container" #lottieContainer>
<!-- Vector Fallback if Lottie is loading -->
@if (!lottieLoaded) {
<div class="cbs-vector-spinner">
<div class="spinner-ring ring-outer"></div>
<div class="spinner-ring ring-mid"></div>
<div class="spinner-ring ring-inner"></div>
</div>
}
</div>
<div class="cbs-loading-dialog__content">
<h3 class="cbs-loading-dialog__title">{{ title || 'CBS Nexora' }}</h3>
<p class="cbs-loading-dialog__message">{{ message || 'Please wait...' }}</p>
</div>
<div class="cbs-loading-pulse-bar">
<div class="cbs-pulse-bar__indicator"></div>
</div>
</div>
</div>
}
@if (currentMode === 'fullscreen') {
<!-- Full-Screen App Boot / Splash Screen -->
<div class="cbs-fullscreen-loader">
<div class="cbs-fullscreen-loader__brand">
<img src="assets/images/cbsnexora-logo.png" alt="CBS Nexora" class="cbs-fullscreen-loader__logo-img" />
<span class="cbs-brand-sub">Core Banking System</span>
</div>
<div class="cbs-lottie-container cbs-lottie-container--large" #lottieContainer>
@if (!lottieLoaded) {
<div class="cbs-vector-spinner cbs-vector-spinner--large">
<div class="spinner-ring ring-outer"></div>
<div class="spinner-ring ring-mid"></div>
<div class="spinner-ring ring-inner"></div>
</div>
}
</div>
<div class="cbs-progress-track">
<div class="cbs-progress-fill"></div>
</div>
<p class="cbs-fullscreen-loader__status">{{ message || 'Connecting to Core Banking Engine...' }}</p>
</div>
}
@if (currentMode === 'inline') {
<!-- Inline Component Loader -->
<div class="cbs-inline-loader">
<div class="cbs-lottie-container cbs-lottie-container--compact" #lottieContainer>
@if (!lottieLoaded) {
<div class="cbs-vector-spinner cbs-vector-spinner--compact">
<div class="spinner-ring ring-outer"></div>
<div class="spinner-ring ring-mid"></div>
<div class="spinner-ring ring-inner"></div>
</div>
}
</div>
@if (message) {
<p class="cbs-inline-loader__message">{{ message }}</p>
}
</div>
}
}
src/app/shared/loading-screen/loading-screen.component.scss
-349
View File
@@ -1,349 +0,0 @@
/**
* 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/.
*/
:host {
display: block;
}
/* ==========================================================================
Overlay Mode (MifosProgressIndicatorOverlay / MifosLoadingDialog)
========================================================================== */
.cbs-loading-backdrop {
position: fixed;
inset: 0;
z-index: 99999;
display: flex;
align-items: center;
justify-content: center;
background: rgb(9 13 22 / 72%);
backdrop-filter: blur(8px);
animation: backdrop-fade-in 0.25s ease-out forwards;
}
.cbs-loading-dialog {
position: relative;
width: 90%;
max-width: 340px;
padding: 28px 24px;
background: #111827;
color: #f8fafc;
border-radius: 20px;
border: 1px solid rgb(255 255 255 / 12%);
box-shadow:
0 25px 60px -15px rgb(0 0 0 / 65%),
0 0 35px rgb(37 99 235 / 18%);
text-align: center;
overflow: hidden;
animation: dialog-scale-in 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
:host-context([data-theme='light']) .cbs-loading-dialog,
:host-context(.light-theme) .cbs-loading-dialog {
background: #fff;
color: #0f172a;
border-color: rgb(0 0 0 / 8%);
box-shadow:
0 25px 50px -12px rgb(0 0 0 / 25%),
0 0 25px rgb(37 99 235 / 12%);
}
.cbs-loading-dialog__content {
margin-top: 10px;
margin-bottom: 16px;
}
.cbs-loading-dialog__title {
font-size: 1.05rem;
font-weight: 700;
letter-spacing: -0.01em;
margin: 0 0 6px;
}
.cbs-loading-dialog__message {
font-size: 0.82rem;
color: #94a3b8;
line-height: 1.45;
margin: 0;
}
:host-context([data-theme='light']) .cbs-loading-dialog__message,
:host-context(.light-theme) .cbs-loading-dialog__message {
color: #64748b;
}
/* Pulse bar at dialog bottom */
.cbs-loading-pulse-bar {
width: 100%;
height: 3px;
background: rgb(255 255 255 / 8%);
border-radius: 99px;
overflow: hidden;
position: relative;
margin-top: 6px;
}
.cbs-pulse-bar__indicator {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 40%;
background: linear-gradient(90deg, #2563eb, #38bdf8);
border-radius: 99px;
animation: pulse-bar-slide 1.4s infinite ease-in-out;
}
/* ==========================================================================
Full-Screen Mode (App Boot / Splash)
========================================================================== */
.cbs-fullscreen-loader {
position: fixed;
inset: 0;
z-index: 99999;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background: radial-gradient(circle at center, #0f172a 0%, #090d16 100%);
color: #f8fafc;
padding: 24px;
text-align: center;
}
:host-context([data-theme='light']) .cbs-fullscreen-loader,
:host-context(.light-theme) .cbs-fullscreen-loader {
background: radial-gradient(circle at center, #fff 0%, #f1f5f9 100%);
color: #0f172a;
}
.cbs-fullscreen-loader__brand {
display: flex;
flex-direction: column;
align-items: center;
gap: 8px;
margin-bottom: 16px;
}
.cbs-fullscreen-loader__logo-img {
height: 52px;
width: auto;
max-width: 260px;
object-fit: contain;
filter: drop-shadow(0 6px 18px rgb(0 0 0 / 45%));
}
.cbs-brand-icon {
width: 64px;
height: 64px;
border-radius: 16px;
background: linear-gradient(135deg, #1e3a8a 0%, #0284c7 100%);
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 10px 24px rgb(14 165 233 / 35%);
margin-bottom: 6px;
}
.cbs-brand-name {
font-size: 1.5rem;
font-weight: 800;
letter-spacing: -0.02em;
margin: 0;
}
.cbs-brand-sub {
font-size: 0.8rem;
color: #94a3b8;
font-weight: 500;
letter-spacing: 0.04em;
text-transform: uppercase;
}
.cbs-progress-track {
width: 240px;
height: 5px;
background: rgb(255 255 255 / 10%);
border-radius: 99px;
overflow: hidden;
margin: 18px 0 12px;
position: relative;
}
.cbs-progress-fill {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 45%;
background: linear-gradient(90deg, #2563eb, #38bdf8);
border-radius: 99px;
box-shadow: 0 0 12px rgb(56 189 248 / 50%);
animation: pulse-bar-slide 1.5s infinite ease-in-out;
}
.cbs-fullscreen-loader__status {
font-size: 0.82rem;
color: #94a3b8;
font-family: inherit;
margin: 0;
}
/* ==========================================================================
Inline Mode
========================================================================== */
.cbs-inline-loader {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 32px 16px;
text-align: center;
}
.cbs-inline-loader__message {
font-size: 0.82rem;
color: #94a3b8;
margin-top: 10px;
}
/* ==========================================================================
Lottie & Vector Spinner Dimensions
========================================================================== */
.cbs-lottie-container {
width: 110px;
height: 110px;
margin: 0 auto;
display: flex;
align-items: center;
justify-content: center;
}
.cbs-lottie-container--large {
width: 140px;
height: 140px;
}
.cbs-lottie-container--compact {
width: 64px;
height: 64px;
}
/* Vector Spinner Fallback (CSS Multi-Ring Loader) */
.cbs-vector-spinner {
width: 72px;
height: 72px;
position: relative;
}
.cbs-vector-spinner--large {
width: 96px;
height: 96px;
}
.cbs-vector-spinner--compact {
width: 44px;
height: 44px;
}
.spinner-ring {
position: absolute;
inset: 0;
border-radius: 50%;
border: 3px solid transparent;
}
.ring-outer {
border-top-color: #2563eb;
border-right-color: #2563eb;
animation: spin-outer 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
}
.ring-mid {
inset: 6px;
border-bottom-color: #0ea5e9;
border-left-color: #0ea5e9;
animation: spin-mid 1.6s cubic-bezier(0.5, 0, 0.5, 1) infinite reverse;
}
.ring-inner {
inset: 13px;
border-top-color: #10b981;
animation: spin-inner 0.9s cubic-bezier(0.5, 0, 0.5, 1) infinite;
}
/* ==========================================================================
Keyframe Animations
========================================================================== */
@keyframes backdrop-fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes dialog-scale-in {
from {
opacity: 0;
transform: scale(0.92);
}
to {
opacity: 1;
transform: scale(1);
}
}
@keyframes pulse-bar-slide {
0% {
left: -40%;
width: 30%;
}
50% {
left: 35%;
width: 50%;
}
100% {
left: 100%;
width: 30%;
}
}
@keyframes spin-outer {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
@keyframes spin-mid {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
@keyframes spin-inner {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
src/app/shared/loading-screen/loading-screen.component.ts
-168
View File
@@ -1,168 +0,0 @@
/**
* 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,
OnDestroy,
Input,
ElementRef,
ViewChild,
AfterViewInit,
inject,
ChangeDetectorRef
} from '@angular/core';
import { CommonModule } from '@angular/common';
import { Subscription } from 'rxjs';
import { LoadingScreenService, LoadingConfig } from './loading-screen.service';
declare const lottie: any;
@Component({
selector: 'mifosx-loading-screen',
standalone: true,
imports: [CommonModule],
templateUrl: './loading-screen.component.html',
styleUrls: ['./loading-screen.component.scss']
})
export class LoadingScreenComponent implements OnInit, AfterViewInit, OnDestroy {
private readonly loadingService = inject(LoadingScreenService);
private readonly cdr = inject(ChangeDetectorRef);
@Input() mode: 'overlay' | 'inline' | 'fullscreen' = 'overlay';
@Input() title: string = 'CBS Nexora';
@Input() message: string = 'Processing transaction...';
@Input() active: boolean = false;
@Input() isGlobalOverlay: boolean = true;
@ViewChild('lottieContainer') lottieContainerRef?: ElementRef<HTMLDivElement>;
currentMode: 'overlay' | 'inline' | 'fullscreen' = 'overlay';
lottieLoaded: boolean = false;
private animInstance: any = null;
private subscription?: Subscription;
ngOnInit(): void {
this.currentMode = this.mode;
if (this.isGlobalOverlay) {
this.subscription = new Subscription();
this.subscription.add(
this.loadingService.isVisible$.subscribe((visible) => {
this.active = visible;
this.cdr.markForCheck();
if (visible) {
setTimeout(() => this.initLottie(), 50);
} else {
this.destroyLottie();
}
})
);
this.subscription.add(
this.loadingService.config$.subscribe((cfg: LoadingConfig) => {
if (cfg.title !== undefined) this.title = cfg.title;
if (cfg.message !== undefined) this.message = cfg.message;
if (cfg.mode !== undefined) this.currentMode = cfg.mode;
this.cdr.markForCheck();
})
);
}
}
ngAfterViewInit(): void {
if (this.active) {
this.initLottie();
}
}
ngOnDestroy(): void {
this.subscription?.unsubscribe();
this.destroyLottie();
}
preventDismiss(event: MouseEvent): void {
event.stopPropagation();
}
private initLottie(): void {
if (!this.lottieContainerRef?.nativeElement) return;
this.destroyLottie();
const container = this.lottieContainerRef.nativeElement;
// Check if lottie-web global is available
if (typeof lottie !== 'undefined') {
try {
this.animInstance = lottie.loadAnimation({
container,
renderer: 'svg',
loop: true,
autoplay: true,
path: 'assets/animations/loading_animation.json'
});
this.lottieLoaded = true;
this.cdr.markForCheck();
return;
} catch (err) {
console.warn('Could not load Lottie animation, using vector fallback', err);
}
}
// Try dynamic script load of local asset if not loaded yet
this.loadLottieScript()
.then(() => {
if (typeof lottie !== 'undefined' && this.lottieContainerRef?.nativeElement) {
this.animInstance = lottie.loadAnimation({
container: this.lottieContainerRef.nativeElement,
renderer: 'svg',
loop: true,
autoplay: true,
path: 'assets/animations/loading_animation.json'
});
this.lottieLoaded = true;
this.cdr.markForCheck();
}
})
.catch(() => {
this.lottieLoaded = false;
this.cdr.markForCheck();
});
}
private loadLottieScript(): Promise<void> {
return new Promise((resolve, reject) => {
if (typeof lottie !== 'undefined') {
resolve();
return;
}
const existingScript = document.getElementById('cbs-lottie-script');
if (existingScript) {
existingScript.addEventListener('load', () => resolve());
return;
}
const script = document.createElement('script');
script.id = 'cbs-lottie-script';
script.src = 'assets/js/lottie.min.js';
script.onload = () => resolve();
script.onerror = () => reject();
document.head.appendChild(script);
});
}
private destroyLottie(): void {
if (this.animInstance) {
try {
this.animInstance.destroy();
} catch (_) {}
this.animInstance = null;
}
}
}
src/app/shared/loading-screen/loading-screen.service.ts
-61
View File
@@ -1,61 +0,0 @@
/**
* 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 { Injectable } from '@angular/core';
import { BehaviorSubject, Observable } from 'rxjs';
export interface LoadingConfig {
title?: string;
message?: string;
mode?: 'overlay' | 'inline' | 'fullscreen';
}
@Injectable({
providedIn: 'root'
})
export class LoadingScreenService {
private readonly visibleSubject = new BehaviorSubject<boolean>(false);
private readonly configSubject = new BehaviorSubject<LoadingConfig>({
title: 'CBS Nexora',
message: 'Processing transaction...',
mode: 'overlay'
});
readonly isVisible$: Observable<boolean> = this.visibleSubject.asObservable();
readonly config$: Observable<LoadingConfig> = this.configSubject.asObservable();
/**
* Show the loading screen/overlay
* @param message Optional message to display (e.g. "Processing Transfer...")
* @param title Optional title to display (defaults to "CBS Nexora")
* @param mode Optional display mode ('overlay' | 'fullscreen')
*/
show(message?: string, title?: string, mode: 'overlay' | 'fullscreen' = 'overlay'): void {
this.configSubject.next({
title: title || 'CBS Nexora',
message: message || 'Please wait...',
mode
});
this.visibleSubject.next(true);
}
/**
* Hide the loading screen/overlay
*/
hide(): void {
this.visibleSubject.next(false);
}
/**
* Update message while loading screen is active
*/
setMessage(message: string): void {
const current = this.configSubject.getValue();
this.configSubject.next({ ...current, message });
}
}
src/app/shared/shared.module.ts
-3
View File
@@ -30,7 +30,6 @@ import { SearchToolComponent } from './search-tool/search-tool.component';
import { KeyboardShortcutsDialogComponent } from './keyboard-shortcuts-dialog/keyboard-shortcuts-dialog.component'; import { KeyboardShortcutsDialogComponent } from './keyboard-shortcuts-dialog/keyboard-shortcuts-dialog.component';
import { ServerSelectorComponent } from './server-selector/server-selector.component'; import { ServerSelectorComponent } from './server-selector/server-selector.component';
import { TenantSelectorComponent } from './tenant-selector/tenant-selector.component'; import { TenantSelectorComponent } from './tenant-selector/tenant-selector.component';
import { LoadingScreenComponent } from './loading-screen/loading-screen.component';
/** Custom Modules */ /** Custom Modules */
import { IconsModule } from './icons.module'; import { IconsModule } from './icons.module';
@@ -117,11 +116,9 @@ import { DatetimePickerStubComponent } from './datetime-picker-stub/datetime-pic
DropdownComponent, DropdownComponent,
InputAmountComponent, InputAmountComponent,
InputPasswordComponent, InputPasswordComponent,
LoadingScreenComponent,
DatetimePickerStubComponent // temporarily added stub for datetime picker DatetimePickerStubComponent // temporarily added stub for datetime picker
], ],
exports: [ exports: [
LoadingScreenComponent,
FileUploadComponent, FileUploadComponent,
FooterComponent, FooterComponent,
LanguageSelectorComponent, LanguageSelectorComponent,
src/app/tasks/checker-inbox-and-tasks-tabs/pending-account/pending-account.component.html
+99
View File
@@ -130,4 +130,103 @@
<p class="empty-text">There are no accounts awaiting approval at this time.</p> <p class="empty-text">There are no accounts awaiting approval at this time.</p>
</div> </div>
} }
<!-- Share accounts awaiting approval render here too, rather than on their own tab. Own table,
own per-row approve/reject/view actions - unchanged from their previous standalone screen. -->
<h3 class="pa-section-heading">Pending Share Accounts</h3>
@if (showShareData) {
<div class="psa-action-bar">
<mat-form-field appearance="outline" class="psa-search-field">
<mat-icon matPrefix>search</mat-icon>
<input
#shareFilterInput
matInput
placeholder="Search by account number, member or product"
(keyup)="applyShareFilter(shareFilterInput.value)"
/>
</mat-form-field>
</div>
<div class="table-container">
<table mat-table [dataSource]="shareDataSource" class="modern-table">
<ng-container matColumnDef="accountNo">
<th mat-header-cell *matHeaderCellDef>Account No.</th>
<td mat-cell *matCellDef="let account" class="psa-mono">{{ account.accountNo }}</td>
</ng-container>
<ng-container matColumnDef="clientName">
<th mat-header-cell *matHeaderCellDef>Member</th>
<td mat-cell *matCellDef="let account">
{{ account.clientName }}
@if (account.officeName) {
<div class="psa-sub">{{ account.officeName }}</div>
}
</td>
</ng-container>
<ng-container matColumnDef="productName">
<th mat-header-cell *matHeaderCellDef>Product</th>
<td mat-cell *matCellDef="let account">{{ account.productName }}</td>
</ng-container>
<ng-container matColumnDef="requestedShares">
<th mat-header-cell *matHeaderCellDef class="ta-right">Shares</th>
<td mat-cell *matCellDef="let account" class="ta-right psa-num">{{ account.requestedShares }}</td>
</ng-container>
<ng-container matColumnDef="requestedAmount">
<th mat-header-cell *matHeaderCellDef class="ta-right">Amount</th>
<td mat-cell *matCellDef="let account" class="ta-right psa-num">
{{ account.requestedAmount | number: '1.2-2' }}
</td>
</ng-container>
<ng-container matColumnDef="resolution">
<th mat-header-cell *matHeaderCellDef>Resolution</th>
<td mat-cell *matCellDef="let account">
{{ account.resolutionNumber || '—' }}
@if (account.resolutionDate) {
<div class="psa-sub">{{ formatShareDate(account.resolutionDate) }}</div>
}
</td>
</ng-container>
<ng-container matColumnDef="submittedDate">
<th mat-header-cell *matHeaderCellDef>Submitted</th>
<td mat-cell *matCellDef="let account">
{{ formatShareDate(account.submittedDate) }}
@if (account.submittedByUsername) {
<div class="psa-sub">by {{ account.submittedByUsername }}</div>
}
</td>
</ng-container>
<ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef>Actions</th>
<td mat-cell *matCellDef="let account">
<button mat-stroked-button class="psa-btn psa-btn-view" (click)="viewShareAccount(account)">
<fa-icon icon="eye" class="m-r-10"></fa-icon>View
</button>
<button mat-stroked-button class="psa-btn psa-btn-approve" (click)="approveShareAccount(account)">
<fa-icon icon="check" class="m-r-10"></fa-icon>Approve
</button>
<button mat-stroked-button class="psa-btn psa-btn-reject" (click)="rejectShareAccount(account)">
<fa-icon icon="ban" class="m-r-10"></fa-icon>Reject
</button>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="shareDisplayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: shareDisplayedColumns" class="table-row"></tr>
</table>
</div>
}
@if (!showShareData) {
<div class="empty-state">
<fa-icon icon="hourglass-half" class="empty-icon"></fa-icon>
<p class="empty-title">No pending share accounts</p>
<p class="empty-text">There are no share accounts awaiting approval at this time.</p>
</div>
}
</div> </div>
src/app/tasks/checker-inbox-and-tasks-tabs/pending-account/pending-account.component.scss
+10
View File
@@ -14,6 +14,16 @@ $text-muted: #64748b;
padding: 16px 0; padding: 16px 0;
} }
/* Marks where the Share Account section begins below the normal-account table on this same screen. */
.pa-section-heading {
margin: 28px 0 12px;
font-size: 15px;
font-weight: 700;
color: #0d1b2a;
padding-top: 16px;
border-top: 1px solid $border;
}
.cv-action-bar { .cv-action-bar {
display: flex; display: flex;
align-items: center; align-items: center;
src/app/tasks/checker-inbox-and-tasks-tabs/pending-account/pending-account.component.ts
+120 -3
View File
@@ -29,17 +29,24 @@ import { MatCheckbox } from '@angular/material/checkbox';
import { FaIconComponent } from '@fortawesome/angular-fontawesome'; import { FaIconComponent } from '@fortawesome/angular-fontawesome';
import { TasksService } from '../../tasks.service'; import { TasksService } from '../../tasks.service';
import { SharesService } from 'app/shares/shares.service';
import { SettingsService } from 'app/settings/settings.service'; import { SettingsService } from 'app/settings/settings.service';
import { Dates } from 'app/core/utils/dates'; import { Dates } from 'app/core/utils/dates';
import { DecimalPipe } from '@angular/common';
import { ConfirmationDialogComponent } from 'app/shared/confirmation-dialog/confirmation-dialog.component';
import { FormDialogComponent } from 'app/shared/form-dialog/form-dialog.component'; import { FormDialogComponent } from 'app/shared/form-dialog/form-dialog.component';
import { FormfieldBase } from 'app/shared/form-dialog/formfield/model/formfield-base'; import { FormfieldBase } from 'app/shared/form-dialog/formfield/model/formfield-base';
import { DatepickerBase } from 'app/shared/form-dialog/formfield/model/datepicker-base'; import { DatepickerBase } from 'app/shared/form-dialog/formfield/model/datepicker-base';
import { InputBase } from 'app/shared/form-dialog/formfield/model/input-base';
import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module'; import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
@Component({ @Component({
selector: 'mifosx-pending-account', selector: 'mifosx-pending-account',
templateUrl: './pending-account.component.html', templateUrl: './pending-account.component.html',
styleUrls: ['./pending-account.component.scss'], styleUrls: [
'./pending-account.component.scss',
'../pending-share-accounts/pending-share-accounts.component.scss'
],
imports: [ imports: [
...STANDALONE_SHARED_IMPORTS, ...STANDALONE_SHARED_IMPORTS,
FaIconComponent, FaIconComponent,
@@ -54,7 +61,8 @@ import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
MatHeaderRow, MatHeaderRow,
MatRowDef, MatRowDef,
MatRow, MatRow,
MatIcon MatIcon,
DecimalPipe
] ]
}) })
export class PendingAccountComponent { export class PendingAccountComponent {
@@ -64,6 +72,7 @@ export class PendingAccountComponent {
private dateUtils = inject(Dates); private dateUtils = inject(Dates);
private settingsService = inject(SettingsService); private settingsService = inject(SettingsService);
private tasksService = inject(TasksService); private tasksService = inject(TasksService);
private sharesService = inject(SharesService);
dataSource: MatTableDataSource<any>; dataSource: MatTableDataSource<any>;
selection: SelectionModel<any>; selection: SelectionModel<any>;
@@ -81,8 +90,26 @@ export class PendingAccountComponent {
'status' 'status'
]; ];
/** Share accounts awaiting approval - rendered as their own section on this same screen rather
* than a separate tab. Kept out of `dataSource`/`selection` (bulk-select + date-picker approve)
* since a share subscription is approved/rejected one at a time against today's business date,
* exactly as it always was on its own page - only where it's shown has changed. */
shareDataSource: MatTableDataSource<any>;
showShareData = false;
shareDisplayedColumns: string[] = [
'accountNo',
'clientName',
'productName',
'requestedShares',
'requestedAmount',
'resolution',
'submittedDate',
'actions'
];
constructor() { constructor() {
this.route.data.subscribe((data: { pendingAccountsData: any }) => { this.route.data.subscribe((data: { pendingAccountsData: any; pendingShareAccountsData: any }) => {
// status 100 = submitted and pending approval only; exclude terminated accounts // status 100 = submitted and pending approval only; exclude terminated accounts
const items = (data.pendingAccountsData?.pageItems || []).filter( const items = (data.pendingAccountsData?.pageItems || []).filter(
(a: any) => a.status?.id === 100 && !a.terminateTrue (a: any) => a.status?.id === 100 && !a.terminateTrue
@@ -90,6 +117,10 @@ export class PendingAccountComponent {
this.showData = items.length > 0; this.showData = items.length > 0;
this.dataSource = new MatTableDataSource(items); this.dataSource = new MatTableDataSource(items);
this.selection = new SelectionModel(true, []); this.selection = new SelectionModel(true, []);
const shareItems = data.pendingShareAccountsData || [];
this.showShareData = shareItems.length > 0;
this.shareDataSource = new MatTableDataSource(shareItems);
}); });
} }
@@ -283,6 +314,92 @@ export class PendingAccountComponent {
return date; return date;
} }
applyShareFilter(filterValue: string = '') {
this.shareDataSource.filter = filterValue.trim().toLowerCase();
}
/** A date from the share account API rendered readably, whether it arrives as a string or as
* Fineract's {@code [yyyy, m, d]} array. Kept separate from `formatDate()` above, which the
* normal-account table already relies on with its own date-array handling. */
formatShareDate(date: any): string {
if (!date) {
return '';
}
const d = Array.isArray(date) ? new Date(date[0], date[1] - 1, date[2]) : new Date(date);
return isNaN(d.getTime()) ? String(date) : d.toLocaleDateString('en-IN');
}
/** Opens the share account itself, for a checker who wants more than the row shows. */
viewShareAccount(account: any): void {
this.router.navigate([
'/clients',
account.clientId,
'shares-accounts',
account.shareAccountId
]);
}
approveShareAccount(account: any): void {
const dialogRef = this.dialog.open(ConfirmationDialogComponent, {
data: {
heading: 'Approve Share Account',
dialogContext:
`Approve share account "${account.accountNo}" for ${account.clientName} — ` +
`${account.requestedShares} shares at ${account.requestedAmount}?`,
type: 'basic'
}
});
dialogRef.afterClosed().subscribe((response: any) => {
if (response?.confirm) {
// The approval date is the business date rather than the checker's choice, same as this
// queue's original standalone screen: clearing a submission is a decision, not a backdated
// transaction, so a date field per row would be extra clicks for no benefit.
const data = {
approvedDate: this.dateUtils.formatDate(this.settingsService.businessDate, this.settingsService.dateFormat),
dateFormat: this.settingsService.dateFormat,
locale: this.settingsService.language.code
};
this.sharesService
.executeSharesAccountCommand(account.shareAccountId, 'approve', data)
.subscribe(() => this.reload());
}
});
}
rejectShareAccount(account: any): void {
const formfields: FormfieldBase[] = [
new InputBase({
controlName: 'rejectReason',
label: 'Reason for rejection',
value: '',
type: 'text',
required: false
})
];
const dialogRef = this.dialog.open(FormDialogComponent, {
data: {
title: `Reject Share Account ${account.accountNo}`,
formfields
}
});
dialogRef.afterClosed().subscribe((response: any) => {
if (response?.data) {
const data: any = {
rejectedDate: this.dateUtils.formatDate(this.settingsService.businessDate, this.settingsService.dateFormat),
dateFormat: this.settingsService.dateFormat,
locale: this.settingsService.language.code
};
const reason = response.data.value?.rejectReason?.trim();
if (reason) {
data.note = reason;
}
this.sharesService
.executeSharesAccountCommand(account.shareAccountId, 'reject', data)
.subscribe(() => this.reload());
}
});
}
reload() { reload() {
const url = this.router.url; const url = this.router.url;
this.router this.router
src/app/tasks/checker-inbox-and-tasks/checker-inbox-and-tasks.component.html
-9
View File
@@ -72,15 +72,6 @@
<fa-icon icon="hourglass-half" class="ac-tab__ic"></fa-icon> <fa-icon icon="hourglass-half" class="ac-tab__ic"></fa-icon>
<span>Pending Account</span> <span>Pending Account</span>
</a> </a>
<a
class="ac-tab"
routerLink="./pending-share-accounts"
routerLinkActive="ac-tab--active"
*mifosxHasPermission="'ALL_FUNCTIONS_READ'"
>
<fa-icon icon="hourglass-half" class="ac-tab__ic"></fa-icon>
<span>Pending Share Accounts</span>
</a>
<a <a
class="ac-tab" class="ac-tab"
routerLink="./product-approval" routerLink="./product-approval"
src/app/tasks/tasks-routing.module.ts
+4 -1
View File
@@ -108,7 +108,10 @@ const routes: Routes = [
component: PendingAccountComponent, component: PendingAccountComponent,
data: { title: 'Pending Account' }, data: { title: 'Pending Account' },
resolve: { resolve: {
pendingAccountsData: GetPendingAccounts pendingAccountsData: GetPendingAccounts,
// Share accounts awaiting approval now render inside this same screen instead of their
// own tab - reuses the same resolver the standalone route below still uses.
pendingShareAccountsData: GetPendingShareAccounts
} }
}, },
{ {
src/app/tds-reports/tds-interest-report.component.html
+158 -231
View File
@@ -13,21 +13,15 @@
<div> <div>
<h2 class="tdsr__title">Deposit Interest &amp; TDS</h2> <h2 class="tdsr__title">Deposit Interest &amp; TDS</h2>
<div class="tdsr__sub"> <div class="tdsr__sub">
Interest each customer earned this year, and whether TDS has to be deducted on it · Quarter-wise and yearly interest on time deposits, with tax deductible under {{ statute.section }} ·
<strong>Showing: {{ scopeLabel }}</strong> {{ scopeLabel }}
</div> </div>
</div> </div>
</div> </div>
<div class="tdsr__head-r"> <button type="button" class="tdsr__btn" (click)="exportWorkbook()" [disabled]="exporting">
<button type="button" class="tdsr__btn" (click)="showHelp = !showHelp"> <fa-icon icon="download"></fa-icon>
<fa-icon icon="question-circle"></fa-icon> {{ exporting ? 'Preparing…' : 'Export' }}
{{ showHelp ? 'Hide help' : 'How to read this page' }} </button>
</button>
<button type="button" class="tdsr__btn" (click)="exportWorkbook()" [disabled]="exporting">
<fa-icon icon="download"></fa-icon>
{{ exporting ? 'Preparing…' : 'Export' }}
</button>
</div>
</div> </div>
@if (loadError) { @if (loadError) {
@@ -37,87 +31,57 @@
</div> </div>
} }
<!-- Help -->
@if (showHelp) {
<div class="tdsr__help">
<div class="tdsr__help-title"><fa-icon icon="info-circle"></fa-icon> How to read this page</div>
<ol class="tdsr__help-list">
<li>
Every customer with an account is listed. Each account is either
<span class="tdsr__pill tdsr__pill--ok">Tracked</span> — its interest counts toward the TDS limit — or
<span class="tdsr__pill">Not tracked</span>. Open a row (<fa-icon icon="chevron-down"></fa-icon>) to see which
account is which, and why.
</li>
<li>
Only <strong>fixed and recurring deposits</strong> are tracked. Savings interest is shown for information but
never attracts TDS.
</li>
@if (rules) {
<li>
A customer's tracked interest for the whole year, across every branch, is checked against the limit:
<strong>₹{{ rules.general | number: '1.0-0' }}</strong
>, or <strong>₹{{ rules.senior | number: '1.0-0' }}</strong> for a senior citizen (60+).
</li>
<li>
Once over the limit, TDS is <strong>{{ rules.rate | number: '1.0-2' }}%</strong> of the
<em>whole</em> year's interest — <strong>{{ rules.rateNoPan | number: '1.0-2' }}%</strong> if no PAN is on
record.
</li>
}
<li>A customer who has submitted Form 15G/15H is not deducted, even over the limit.</li>
<li>
The TDS figures here are <strong>worked out by this report</strong> from the interest actually posted. They
are not debited from the customer's account automatically.
</li>
</ol>
</div>
}
<!-- Summary --> <!-- Summary -->
<div class="tdsr__kpis"> <div class="tdsr__kpis">
<div class="tdsr__kpi"> <div class="tdsr__kpi">
<div class="tdsr__kpi-n">{{ summary.deductees | number }}</div> <div class="tdsr__kpi-n">{{ summary.deductees | number }}</div>
<div class="tdsr__kpi-l">Customers · {{ summary.trackedCustomers | number }} with an FD/RD being tracked</div> <div class="tdsr__kpi-l">Deductees</div>
</div> </div>
<div class="tdsr__kpi"> <div class="tdsr__kpi">
<div class="tdsr__kpi-n">₹{{ summary.applicableInterest | number: '1.0-0' }}</div> <div class="tdsr__kpi-n">₹{{ summary.applicableInterest | number: '1.0-0' }}</div>
<div class="tdsr__kpi-l">FD / RD interest — counts toward the limit</div> <div class="tdsr__kpi-l">Interest on FD / RD</div>
</div> </div>
<div class="tdsr__kpi tdsr__kpi--muted"> <div class="tdsr__kpi tdsr__kpi--muted">
<div class="tdsr__kpi-n">₹{{ summary.exemptInterest | number: '1.0-0' }}</div> <div class="tdsr__kpi-n">₹{{ summary.exemptInterest | number: '1.0-0' }}</div>
<div class="tdsr__kpi-l">Savings interest — shown only, no TDS</div> <div class="tdsr__kpi-l">Savings interest — outside the charge</div>
</div>
<div class="tdsr__kpi tdsr__kpi--warn">
<div class="tdsr__kpi-n">{{ summary.crossed | number }}</div>
<div class="tdsr__kpi-l">Customers over the limit</div>
</div> </div>
<div class="tdsr__kpi tdsr__kpi--warn"> <div class="tdsr__kpi tdsr__kpi--warn">
<div class="tdsr__kpi-n">₹{{ summary.totalTds | number: '1.0-0' }}</div> <div class="tdsr__kpi-n">₹{{ summary.totalTds | number: '1.0-0' }}</div>
<div class="tdsr__kpi-l">TDS to be deducted</div> <div class="tdsr__kpi-l">TDS payable</div>
</div> </div>
<div class="tdsr__kpi tdsr__kpi--warn">
<div class="tdsr__kpi-n">{{ summary.crossed | number }}</div>
<div class="tdsr__kpi-l">Crossed the threshold</div>
</div>
<button type="button" class="tdsr__kpi tdsr__kpi--action" (click)="showNearThreshold()">
<div class="tdsr__kpi-n">{{ summary.nearThreshold | number }}</div>
<div class="tdsr__kpi-l">Within ₹{{ nearBand | number: '1.0-0' }} of it — chase a declaration</div>
</button>
<div class="tdsr__kpi tdsr__kpi--ok">
<div class="tdsr__kpi-n">₹{{ summary.tdsSaved | number: '1.0-0' }}</div>
<div class="tdsr__kpi-l">Saved by {{ summary.declarations | number }} declarations</div>
</div>
@if (summary.noPan > 0) {
<div class="tdsr__kpi tdsr__kpi--warn">
<div class="tdsr__kpi-n">{{ summary.noPan | number }}</div>
<div class="tdsr__kpi-l">No PAN — deducted at 20%</div>
</div>
}
</div> </div>
<!-- Things worth acting on, only when there are any --> <!-- Quarter strip -->
@if (summary.nearThreshold || summary.declarations || summary.noPan) { <div class="tdsr__card">
<div class="tdsr__chips"> <div class="tdsr__card-head"><fa-icon icon="calendar"></fa-icon> Quarter by quarter</div>
@if (summary.nearThreshold) { <div class="tdsr__qstrip">
<button type="button" class="tdsr__chip tdsr__chip--near" (click)="showNearThreshold()"> @for (q of summary.byQuarter; track q.quarter) {
{{ summary.nearThreshold | number }} near the limit (within ₹{{ nearBand | number: '1.0-0' }}) — ask for <div class="tdsr__qcell">
15G/15H <div class="tdsr__qcell-l">{{ quarterLabel[q.quarter] }}</div>
</button> <div class="tdsr__qcell-n">₹{{ q.interest | number: '1.0-0' }}</div>
} <div class="tdsr__qcell-s">TDS ₹{{ q.tds | number: '1.0-0' }}</div>
@if (summary.declarations) { </div>
<span class="tdsr__chip tdsr__chip--ok">
{{ summary.declarations | number }} with 15G/15H — ₹{{ summary.tdsSaved | number: '1.0-0' }} not deducted
</span>
}
@if (summary.noPan) {
<span class="tdsr__chip tdsr__chip--warn">
{{ summary.noPan | number }} FD/RD customers without PAN — higher rate applies
</span>
} }
</div> </div>
} </div>
<!-- Filters --> <!-- Filters -->
<div class="tdsr__filters"> <div class="tdsr__filters">
@@ -135,8 +99,8 @@
<span>Branch</span> <span>Branch</span>
<select [(ngModel)]="filter.branchCode" (ngModelChange)="onFilterChanged()"> <select [(ngModel)]="filter.branchCode" (ngModelChange)="onFilterChanged()">
<option value="">All branches</option> <option value="">All branches</option>
@for (b of branches; track b) { @for (b of branches; track b.code) {
<option [value]="b">{{ b }}</option> <option [value]="b.code">{{ b.name }}</option>
} }
</select> </select>
</label> </label>
@@ -153,32 +117,32 @@
</label> </label>
<label class="tdsr__filter"> <label class="tdsr__filter">
<span>Age group</span> <span>Threshold band</span>
<select [(ngModel)]="filter.band" (ngModelChange)="onFilterChanged()"> <select [(ngModel)]="filter.band" (ngModelChange)="onFilterChanged()">
<option value="">Everyone</option> <option value="">Both bands</option>
<option value="GENERAL">Below 60</option> <option value="GENERAL">General (below 60)</option>
<option value="SENIOR">Senior citizen (60+)</option> <option value="SENIOR">Senior citizen (60+)</option>
</select> </select>
</label> </label>
<label class="tdsr__filter tdsr__filter--wide"> <label class="tdsr__filter tdsr__filter--wide">
<span>Search customer</span> <span>Customer / CIF / PAN</span>
<input <input
type="text" type="text"
[(ngModel)]="filter.search" [(ngModel)]="filter.search"
(ngModelChange)="onFilterChanged()" (ngModelChange)="onFilterChanged()"
placeholder="Name, customer ID or PAN" placeholder="name, CIF or PAN"
/> />
</label> </label>
<label class="tdsr__check"> <label class="tdsr__check">
<input type="checkbox" [(ngModel)]="filter.crossedOnly" (ngModelChange)="onFilterChanged()" /> <input type="checkbox" [(ngModel)]="filter.crossedOnly" (ngModelChange)="onFilterChanged()" />
<span>Over the limit only</span> <span>Threshold crossed only</span>
</label> </label>
<label class="tdsr__check"> <label class="tdsr__check">
<input type="checkbox" [(ngModel)]="filter.nearThresholdOnly" (ngModelChange)="onFilterChanged()" /> <input type="checkbox" [(ngModel)]="filter.nearThresholdOnly" (ngModelChange)="onFilterChanged()" />
<span>Near the limit only</span> <span>Near threshold only</span>
</label> </label>
@if (hasFilters) { @if (hasFilters) {
@@ -186,7 +150,7 @@
} }
</div> </div>
<!-- Tabs --> <!-- Tabs Selector -->
<div class="tdsr__tabs"> <div class="tdsr__tabs">
<button <button
type="button" type="button"
@@ -194,7 +158,7 @@
[class.tdsr__tab--active]="selectedTab === 'paying'" [class.tdsr__tab--active]="selectedTab === 'paying'"
(click)="selectTab('paying')" (click)="selectTab('paying')"
> >
TDS to deduct ({{ payingRows.length }}) Paying TDS ({{ payingRows.length }})
</button> </button>
<button <button
type="button" type="button"
@@ -202,7 +166,7 @@
[class.tdsr__tab--active]="selectedTab === 'not-paying'" [class.tdsr__tab--active]="selectedTab === 'not-paying'"
(click)="selectTab('not-paying')" (click)="selectTab('not-paying')"
> >
No TDS ({{ notPayingRows.length }}) Not Paying TDS ({{ notPayingRows.length }})
</button> </button>
</div> </div>
@@ -212,76 +176,87 @@
<table class="tdsr__table"> <table class="tdsr__table">
<thead> <thead>
<tr> <tr>
<th>Customer</th> <th>Customer · PAN</th>
<th>Branch</th> <th>Branch</th>
<th>Accounts</th> <th>Form · Band</th>
<th class="num">FD / RD interest this year</th> <th class="num">Q1</th>
<th class="num">Limit</th> <th class="num">Q2</th>
<th>Status</th> <th class="num">Q3</th>
<th class="num">Q4</th>
<th class="num">Year total</th>
<th class="num">Threshold</th>
<th>Crossed</th>
<th class="num">TDS</th> <th class="num">TDS</th>
<th class="num">Saved</th>
<th class="col-actions"></th> <th class="col-actions"></th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
@for (row of pagedRows; track trackRow($index, row)) { @for (row of pagedRows; track trackRow($index, row)) {
<tr class="tdsr__row--click" [class.tdsr__row--near]="row.nearThreshold" (click)="toggleExpanded(row)"> <tr [class.tdsr__row--warn]="!row.panOnRecord" [class.tdsr__row--near]="row.nearThreshold">
<td> <td>
<div class="tdsr__name">{{ row.deductee.name }}</div> <div class="tdsr__name">{{ row.deductee.name }}</div>
<div class="mono small muted"> <div class="mono small muted">
ID {{ row.deductee.customerId }} · {{ row.deductee.customerId }} ·
@if (row.panOnRecord) { @if (row.panOnRecord) {
PAN {{ row.deductee.pan }} {{ row.deductee.pan }}
} @else { } @else {
<span class="tdsr__pill tdsr__pill--warn">no PAN</span> <span class="tdsr__pill tdsr__pill--warn">no PAN</span>
} }
@if (row.band === 'SENIOR') {
<span class="tdsr__pill">Senior 60+</span>
}
</div> </div>
</td> </td>
<td class="small">{{ row.branchCode || '—' }}</td> <td class="small">{{ branchName(row.branchCode) }}</td>
<td class="small"> <td>
@if (row.trackedAccounts) { <span class="tdsr__pill" [class.tdsr__pill--ok]="row.hasDeclaration">
<span class="tdsr__pill tdsr__pill--ok">{{ row.trackedAccounts }} tracked</span> {{ row.form === '121' ? '121' : row.form }}
} </span>
@if (untrackedOf(row).length) { <div class="small muted">{{ row.band === 'SENIOR' ? 'Senior' : 'General' }}</div>
<span class="tdsr__pill">{{ untrackedOf(row).length }} not tracked</span> @if (row.hasDeclaration) {
<div class="mono small muted">{{ row.declarationUin }}</div>
} }
</td> </td>
@for (q of quarters; track q) {
<td class="num small">
@if (row.quarters[q]) {
₹{{ row.quarters[q] | number: '1.0-0' }}
} @else {
<span class="muted">—</span>
}
</td>
}
<td class="num"> <td class="num">
<strong>₹{{ row.tdsApplicableInterest | number: '1.0-0' }}</strong> <strong>₹{{ row.tdsApplicableInterest | number: '1.0-0' }}</strong>
@if (row.exemptInterest) { @if (row.exemptInterest) {
<div class="small muted">+ ₹{{ row.exemptInterest | number: '1.0-0' }} savings (no TDS)</div> <div class="small muted">+₹{{ row.exemptInterest | number: '1.0-0' }} SB (exempt)</div>
} }
</td> </td>
<td class="num small muted">₹{{ row.threshold | number: '1.0-0' }}</td> <td class="num small muted">₹{{ row.threshold | number: '1.0-0' }}</td>
<td class="small"> <td class="small">
<span @if (row.crossedInQuarter) {
class="tdsr__pill" <span class="tdsr__pill tdsr__pill--warn">Q{{ row.crossedInQuarter }}</span>
[class.tdsr__pill--warn]="statusOf(row).tone === 'warn'" } @else if (row.nearThreshold) {
[class.tdsr__pill--near]="statusOf(row).tone === 'near'" <span class="tdsr__pill tdsr__pill--near"> ₹{{ row.headroom | number: '1.0-0' }} left </span>
[class.tdsr__pill--ok]="statusOf(row).tone === 'ok'" } @else {
> <span class="muted">—</span>
{{ statusOf(row).label }} }
</span>
</td> </td>
<td class="num"> <td class="num">
@if (row.schedule.totalTds) { @if (row.schedule.totalTds) {
<strong>₹{{ row.schedule.totalTds | number: '1.0-0' }}</strong> <strong>₹{{ row.schedule.totalTds | number: '1.0-0' }}</strong>
<div class="small muted">@ {{ row.rateApplied * 100 | number: '1.0-0' }}%</div> <div class="small muted">@ {{ row.rateApplied * 100 | number: '1.0-0' }}%</div>
} @else if (row.tdsSaved) { } @else {
<span class="small tdsr__ok">₹{{ row.tdsSaved | number: '1.0-0' }} saved</span> <span class="muted">—</span>
}
</td>
<td class="num">
@if (row.tdsSaved) {
<strong class="tdsr__ok">₹{{ row.tdsSaved | number: '1.0-0' }}</strong>
} @else { } @else {
<span class="muted">—</span> <span class="muted">—</span>
} }
</td> </td>
<td class="col-actions"> <td class="col-actions">
<button <button type="button" class="tdsr__icon-btn" (click)="toggleExpanded(row)">
type="button"
class="tdsr__icon-btn"
[attr.aria-label]="isExpanded(row) ? 'Hide details' : 'Show details'"
(click)="$event.stopPropagation(); toggleExpanded(row)"
>
<fa-icon [icon]="isExpanded(row) ? 'chevron-up' : 'chevron-down'"></fa-icon> <fa-icon [icon]="isExpanded(row) ? 'chevron-up' : 'chevron-down'"></fa-icon>
</button> </button>
</td> </td>
@@ -289,138 +264,89 @@
@if (isExpanded(row)) { @if (isExpanded(row)) {
<tr class="tdsr__row--detail"> <tr class="tdsr__row--detail">
<td colspan="8"> <td colspan="13">
<!-- 1. Which accounts are tracked --> @for (note of row.schedule.notes; track note) {
<div class="tdsr__detail-h">Accounts of {{ row.deductee.name }}</div> <div class="tdsr__note">
<fa-icon icon="info-circle"></fa-icon>
<div>{{ note }}</div>
</div>
}
@if (row.jointHeldInterest) {
<div class="tdsr__note">
<fa-icon icon="info-circle"></fa-icon>
<div>
₹{{ row.jointHeldInterest | number: '1.0-0' }} of interest sits on deposits where this customer
is a joint holder but not the first-named one. Tax there is deducted against the first-named
holder, so it is excluded from the figures above.
</div>
</div>
}
<table class="tdsr__table tdsr__table--inner"> <table class="tdsr__table tdsr__table--inner">
<thead> <thead>
<tr> <tr>
<th>Account no.</th> <th>Quarter</th>
<th>Type</th> <th class="num">Interest</th>
<th>Tracked for TDS?</th> <th class="num">Cumulative</th>
<th class="num">Interest this year</th> <th class="num">Liability to date</th>
<th class="num">Postings</th> <th class="num">TDS this quarter</th>
<th>Last posted</th> <th>Return due</th>
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
@for (a of row.accounts; track a.accountNo) { @for (line of row.schedule.lines; track line.quarter) {
<tr> <tr [class.tdsr__row--warn]="line.thresholdCrossedHere">
<td class="mono small">{{ a.accountNo }}</td>
<td class="small">{{ accountTypeLabel[a.type] }}</td>
<td class="small"> <td class="small">
@if (a.tracked) { {{ line.label }}
<span class="tdsr__pill tdsr__pill--ok"><fa-icon icon="check"></fa-icon> Yes</span> @if (line.thresholdCrossedHere) {
} @else { <span class="tdsr__pill tdsr__pill--warn">crossed here</span>
<span class="tdsr__pill">No</span> }
@if (line.declarationActive) {
<span class="tdsr__pill tdsr__pill--ok">Form 121 active</span>
} }
<span class="muted"> {{ a.reason }}</span>
</td> </td>
<td class="num">₹{{ a.interest | number: '1.2-2' }}</td> <td class="num">₹{{ line.interest | number: '1.0-0' }}</td>
<td class="num small">{{ a.postings }}</td> <td class="num">₹{{ line.cumInterest | number: '1.0-0' }}</td>
<td class="small muted"> <td class="num">₹{{ line.cumLiability | number: '1.0-0' }}</td>
{{ a.lastPostedOn ? (a.lastPostedOn | date: 'd MMM y') : 'No interest posted yet' }} <td class="num">
@if (line.tds !== 0) {
<strong>₹{{ line.tds | number: '1.0-0' }}</strong>
} @else {
<span class="muted">—</span>
}
</td> </td>
<td class="small muted">{{ line.dueDate }}</td>
</tr> </tr>
} }
</tbody> </tbody>
</table> </table>
<!-- 2. How the TDS was worked out --> <div class="tdsr__meta">
@if (row.trackedAccounts) { <span
<div class="tdsr__detail-h">How the TDS is worked out, quarter by quarter</div> >Settlement: <strong>{{ row.mode === 'QUARTERLY' ? 'Quarterly' : 'Year end' }}</strong> (set by
@for (note of row.schedule.notes; track note) { the deposit product)</span
<div class="tdsr__note"> >
<fa-icon icon="info-circle"></fa-icon> @if (row.declarationAcceptedOn) {
<div>{{ note }}</div> <span
</div> >Declaration accepted: <strong>{{ row.declarationAcceptedOn | date: 'd MMM y' }}</strong></span
} >
@if (row.schedule.lines.length) {
<table class="tdsr__table tdsr__table--inner">
<thead>
<tr>
<th>Quarter</th>
<th class="num">Interest in quarter</th>
<th class="num">Total so far</th>
<th class="num">TDS this quarter</th>
<th>Return due</th>
</tr>
</thead>
<tbody>
@for (line of row.schedule.lines; track line.quarter) {
<tr [class.tdsr__row--warn]="line.thresholdCrossedHere">
<td class="small">
{{ line.label }}
@if (line.thresholdCrossedHere) {
<span class="tdsr__pill tdsr__pill--warn">limit crossed here</span>
}
@if (line.declarationActive) {
<span class="tdsr__pill tdsr__pill--ok">15G/15H active</span>
}
</td>
<td class="num">₹{{ line.interest | number: '1.0-0' }}</td>
<td class="num">
₹{{ line.cumInterest | number: '1.0-0' }}
<span class="small muted">of ₹{{ row.threshold | number: '1.0-0' }}</span>
</td>
<td class="num">
@if (line.tds !== 0) {
<strong>₹{{ line.tds | number: '1.0-0' }}</strong>
} @else {
<span class="muted">—</span>
}
</td>
<td class="small muted">{{ line.dueDate }}</td>
</tr>
}
</tbody>
</table>
} @else {
<div class="small muted">No interest has been posted on the tracked deposits this year yet.</div>
} }
@if (row.paidWithoutDeduction) { @if (row.paidWithoutDeduction) {
<div class="tdsr__meta"> <span>
<span> Paid without deduction:
Paid without deduction because of 15G/15H: <strong>₹{{ row.paidWithoutDeduction | number: '1.0-0' }}</strong> — reportable in
<strong>₹{{ row.paidWithoutDeduction | number: '1.0-0' }}</strong> — still reported in {{ statute.statement }}
{{ statute.statement }} </span>
</span>
</div>
} }
} @else { </div>
<div class="tdsr__note">
<fa-icon icon="info-circle"></fa-icon>
<div>
This customer has no fixed or recurring deposit, so nothing here counts toward TDS. Savings
interest is shown for information only.
</div>
</div>
}
@if (row.jointHeldInterest) {
<div class="tdsr__note">
<fa-icon icon="info-circle"></fa-icon>
<div>
₹{{ row.jointHeldInterest | number: '1.0-0' }} of interest is on joint deposits where this
customer is not the first-named holder, so it is counted under that holder instead.
</div>
</div>
}
</td> </td>
</tr> </tr>
} }
} }
@if (visibleRows.length === 0) { @if (visibleRows.length === 0) {
<tr> <tr>
<td colspan="8" class="tdsr__empty"> <td colspan="13" class="tdsr__empty">
<fa-icon icon="info-circle"></fa-icon> <fa-icon icon="info-circle"></fa-icon> No customers in this section match the filters.
@if (loading) {
Loading…
} @else if (selectedTab === 'paying') {
No customer needs TDS deducted for these filters. Check the "No TDS" tab.
} @else {
No customers match these filters.
}
</td> </td>
</tr> </tr>
} }
@@ -433,7 +359,8 @@
<div class="tdsr__pager-l"> <div class="tdsr__pager-l">
<span> <span>
Showing <strong>{{ rangeStart | number }}–{{ rangeEnd | number }}</strong> of Showing <strong>{{ rangeStart | number }}–{{ rangeEnd | number }}</strong> of
<strong>{{ visibleRows.length | number }}</strong> customers <strong>{{ visibleRows.length | number }}</strong>
{{ selectedTab === 'paying' ? 'deductees paying TDS' : 'deductees not paying TDS' }}
</span> </span>
<label class="tdsr__pager-sizel"> <label class="tdsr__pager-sizel">
Rows Rows
src/app/tds-reports/tds-interest-report.component.ts
+13 -85
View File
@@ -13,12 +13,12 @@ import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
import * as ExcelJS from 'exceljs'; import * as ExcelJS from 'exceljs';
import { BranchScopeService } from '../core/branch-scope.service'; import { BranchScopeService } from '../core/branch-scope.service';
import { GL_BRANCHES, glBranchName } from '../gl-reports/gl-reports-data';
import { FY_TAX_CONFIG, Quarter, QUARTER_LABEL } from '../letter-mgmt/certificates/form-15gh/tds-15gh.compute'; import { FY_TAX_CONFIG, Quarter, QUARTER_LABEL } from '../letter-mgmt/certificates/form-15gh/tds-15gh.compute';
import { TdsDeductee, setTdsDeductees, tdsFys } from './tds-reports-data'; import { setTdsDeductees, tdsFys } from './tds-reports-data';
import { TdsReportsService } from './tds-reports.service'; import { TdsReportsService } from './tds-reports.service';
import { import {
NEAR_THRESHOLD_BAND, NEAR_THRESHOLD_BAND,
TdsAccountLine,
TdsInterestRow, TdsInterestRow,
TdsInterestSummary, TdsInterestSummary,
TdsReportFilter, TdsReportFilter,
@@ -40,12 +40,7 @@ export class TdsInterestReportComponent implements OnInit {
private scope = inject(BranchScopeService); private scope = inject(BranchScopeService);
private tdsService = inject(TdsReportsService); private tdsService = inject(TdsReportsService);
/** readonly branches = GL_BRANCHES.filter((b) => b.code !== 'HO');
* Office names the loaded customers belong to, for Head Office's branch selector. Read off the
* data rather than a fixed list, which named branches this bank does not have and left out the
* ones it does.
*/
branches: string[] = [];
/** Filled by the route resolver from Organization › TDS Configuration. */ /** Filled by the route resolver from Organization › TDS Configuration. */
readonly financialYears = tdsFys(); readonly financialYears = tdsFys();
readonly quarterLabel = QUARTER_LABEL; readonly quarterLabel = QUARTER_LABEL;
@@ -97,26 +92,16 @@ export class TdsInterestReportComponent implements OnInit {
loading = false; loading = false;
loadError = ''; loadError = '';
/** The "how to read this page" panel. */
showHelp = true;
readonly accountTypeLabel: Record<TdsAccountLine['type'], string> = {
FD: 'Fixed deposit',
RD: 'Recurring deposit',
SB: 'Savings',
OTHER: 'Other'
};
ngOnInit(): void { ngOnInit(): void {
if (!this.financialYears.length) { if (!this.financialYears.length) {
this.loadError = 'No financial year is configured for TDS. Set one up under Organization › TDS Configuration.'; this.loadError = 'No financial year is configured for TDS. Set one up under Organization › TDS Configuration.';
return; return;
} }
// A branch login sees only its own book and cannot widen the scope. The platform labels each // A branch login sees only its own book and cannot widen the scope.
// customer with their office's name, so the login's office name is the filter — the GL branch const own = this.scope.ownBranchCode;
// code list does not know every office and turned a branch login into an empty report. if (own) {
if (!this.scope.isHeadOffice) { this.filter.branchCode = own;
this.filter.branchCode = this.scope.officeName;
} }
this.loadDeductees(); this.loadDeductees();
} }
@@ -136,7 +121,6 @@ export class TdsInterestReportComponent implements OnInit {
next: (deductees) => { next: (deductees) => {
this.loading = false; this.loading = false;
setTdsDeductees(deductees); setTdsDeductees(deductees);
this.branches = this.branchesOf(deductees);
this.invalidateCaches(); this.invalidateCaches();
}, },
error: (err: any) => { error: (err: any) => {
@@ -154,11 +138,6 @@ export class TdsInterestReportComponent implements OnInit {
* only the summary left the KPIs counting the new data while the tables kept the empty list * only the summary left the KPIs counting the new data while the tables kept the empty list
* cached on the first render, before the load returned. * cached on the first render, before the load returned.
*/ */
private branchesOf(deductees: TdsDeductee[]): string[] {
const names = new Set(deductees.map((d) => d.branchCode).filter((n) => !!n));
return [...names].sort((a, b) => a.localeCompare(b));
}
private invalidateCaches(): void { private invalidateCaches(): void {
this.rowsCacheKey = ''; this.rowsCacheKey = '';
this.summaryCacheKey = ''; this.summaryCacheKey = '';
@@ -189,54 +168,12 @@ export class TdsInterestReportComponent implements OnInit {
}; };
} }
/** The limits and rates for the selected year, for the help panel. */
get rules(): { general: number; senior: number; rate: number; rateNoPan: number } | null {
const cfg = FY_TAX_CONFIG[this.filter.fy];
if (!cfg) {
return null;
}
return {
general: cfg.thresholdGeneral,
senior: cfg.thresholdSenior,
rate: cfg.rate * 100,
rateNoPan: cfg.rateNoPan * 100
};
}
get canSelectBranch(): boolean { get canSelectBranch(): boolean {
return this.scope.canSelectBranch; return this.scope.canSelectBranch;
} }
get scopeLabel(): string { get scopeLabel(): string {
return this.filter.branchCode ? `${this.filter.branchCode} branch` : 'All branches'; return this.filter.branchCode ? glBranchName(this.filter.branchCode) : 'All branches';
}
/**
* One plain-language status per customer, so a reader does not have to work it out from the
* threshold, crossed and saved columns together.
*/
statusOf(row: TdsInterestRow): { label: string; tone: 'muted' | 'warn' | 'near' | 'ok' } {
if (!row.trackedAccounts) {
return { label: 'Not tracked — no FD/RD', tone: 'muted' };
}
if (row.schedule.totalTds > 0) {
return { label: 'Over the limit — TDS due', tone: 'warn' };
}
if (row.hasDeclaration && row.crossed) {
return { label: 'Over the limit — 15G/15H, no TDS', tone: 'ok' };
}
if (row.nearThreshold) {
return { label: `Near the limit — ₹${Math.round(row.headroom).toLocaleString('en-IN')} left`, tone: 'near' };
}
return { label: 'Below the limit', tone: 'ok' };
}
trackedOf(row: TdsInterestRow): TdsAccountLine[] {
return row.accounts.filter((a) => a.tracked);
}
untrackedOf(row: TdsInterestRow): TdsAccountLine[] {
return row.accounts.filter((a) => !a.tracked);
} }
/** Recomputes the book only when the filter actually changed. Side-effect free. */ /** Recomputes the book only when the filter actually changed. Side-effect free. */
@@ -378,6 +315,10 @@ export class TdsInterestReportComponent implements OnInit {
return this.expandedId === row.deductee.customerId; return this.expandedId === row.deductee.customerId;
} }
branchName(code: string): string {
return glBranchName(code);
}
trackRow(_: number, row: TdsInterestRow): string { trackRow(_: number, row: TdsInterestRow): string {
return row.deductee.customerId; return row.deductee.customerId;
} }
@@ -396,9 +337,6 @@ export class TdsInterestReportComponent implements OnInit {
'CIF', 'CIF',
'PAN', 'PAN',
'Branch', 'Branch',
'Accounts tracked for TDS',
'Accounts not tracked',
'Status',
'Form', 'Form',
'Band', 'Band',
'Age', 'Age',
@@ -423,14 +361,7 @@ export class TdsInterestReportComponent implements OnInit {
r.deductee.name, r.deductee.name,
r.deductee.customerId, r.deductee.customerId,
r.deductee.pan || 'NOT ON RECORD', r.deductee.pan || 'NOT ON RECORD',
r.branchCode, this.branchName(r.branchCode),
this.trackedOf(r)
.map((a) => `${a.accountNo} (${a.type})`)
.join(', '),
this.untrackedOf(r)
.map((a) => `${a.accountNo} (${a.type})`)
.join(', '),
this.statusOf(r).label,
r.form === '121' ? 'Form 121' : `Form ${r.form}`, r.form === '121' ? 'Form 121' : `Form ${r.form}`,
r.band === 'SENIOR' ? 'Senior citizen' : 'General', r.band === 'SENIOR' ? 'Senior citizen' : 'General',
r.age, r.age,
@@ -458,9 +389,6 @@ export class TdsInterestReportComponent implements OnInit {
`${s.deductees} deductees`, `${s.deductees} deductees`,
'', '',
'', '',
`${s.trackedCustomers} tracked`,
'',
'',
'', '',
'', '',
'', '',
src/app/tds-reports/tds-reports.compute.ts
+4 -74
View File
@@ -56,25 +56,6 @@ export interface TdsReportFilter {
nearThresholdOnly: boolean; nearThresholdOnly: boolean;
} }
/**
* One of the customer's accounts as the report sees it: whether its interest is being counted
* toward the deduction, and if not, why not. A customer can hold savings, fixed and recurring
* accounts together, and the branch has to see which of them the deduction is actually watching.
*/
export interface TdsAccountLine {
accountNo: string;
type: 'FD' | 'RD' | 'SB' | 'OTHER';
/** True when the account's interest counts toward this customer's threshold. */
tracked: boolean;
/** Plain-language reason, shown beside the account. */
reason: string;
/** Interest credited in the year. */
interest: number;
/** How many interest postings made up that figure. */
postings: number;
lastPostedOn: string | null;
}
/** How close to the trigger counts as "worth chasing a declaration for". */ /** How close to the trigger counts as "worth chasing a declaration for". */
export const NEAR_THRESHOLD_BAND = 6_000; export const NEAR_THRESHOLD_BAND = 6_000;
@@ -120,10 +101,6 @@ export interface TdsInterestRow {
paidWithoutDeduction: number; paidWithoutDeduction: number;
panOnRecord: boolean; panOnRecord: boolean;
rateApplied: number; rateApplied: number;
/** Every account the customer holds, tracked or not. */
accounts: TdsAccountLine[];
/** How many of them count toward the deduction. */
trackedAccounts: number;
} }
function emptyQuarters(): Record<Quarter, number> { function emptyQuarters(): Record<Quarter, number> {
@@ -177,35 +154,14 @@ export function tdsInterestRowsForFy(fy: string): TdsInterestRow[] {
let exemptInterest = 0; let exemptInterest = 0;
let jointHeldInterest = 0; let jointHeldInterest = 0;
const accountLines: TdsAccountLine[] = [];
for (const account of deductee.accounts) { for (const account of deductee.accounts) {
const yearCredits = account.credits.filter((c) => fyOf(c.date) === fy); const inYear = account.credits.filter((c) => fyOf(c.date) === fy).reduce((s, c) => s + c.amount, 0);
const inYear = yearCredits.reduce((s, c) => s + c.amount, 0);
const type = accountTypeOf(account.depositTypeCode);
let tracked = false;
let reason: string;
if (!isTdsApplicable(account)) { if (!isTdsApplicable(account)) {
exemptInterest += inYear; exemptInterest += inYear;
reason = type === 'SB' ? 'Savings account — no TDS on savings interest' : 'Not a time deposit — no TDS';
} else if (tdsDeducteeOf(account) !== deductee.clientId) { } else if (tdsDeducteeOf(account) !== deductee.clientId) {
jointHeldInterest += inYear; jointHeldInterest += inYear;
reason = 'Joint deposit — counted under the first-named holder';
} else {
tracked = true;
reason = 'Counted toward the TDS limit';
} }
accountLines.push({
accountNo: account.accountNo || '',
type,
tracked,
reason,
interest: inYear,
postings: yearCredits.length,
lastPostedOn: yearCredits.reduce<string | null>((last, c) => (!last || c.date > last ? c.date : last), null)
});
} }
// Tracked accounts first, so the deposits that drive the figure lead the list.
accountLines.sort((a, b) => Number(b.tracked) - Number(a.tracked));
const crossedLine = schedule.lines.find((l) => l.thresholdCrossedHere); const crossedLine = schedule.lines.find((l) => l.thresholdCrossedHere);
const headroom = Math.max(0, schedule.threshold - schedule.totalInterest); const headroom = Math.max(0, schedule.threshold - schedule.totalInterest);
@@ -234,9 +190,7 @@ export function tdsInterestRowsForFy(fy: string): TdsInterestRow[] {
tdsSaved: declaration ? Math.max(0, withoutDeclaration.totalTds - schedule.totalTds) : 0, tdsSaved: declaration ? Math.max(0, withoutDeclaration.totalTds - schedule.totalTds) : 0,
paidWithoutDeduction: schedule.shieldedInterest, paidWithoutDeduction: schedule.shieldedInterest,
panOnRecord: isWellFormedPan(deductee.pan), panOnRecord: isWellFormedPan(deductee.pan),
rateApplied: schedule.rateApplied, rateApplied: schedule.rateApplied
accounts: accountLines,
trackedAccounts: accountLines.filter((a) => a.tracked).length
}); });
} }
@@ -256,29 +210,10 @@ function overallModeFor(deductee: TdsDeductee): TdsMode {
return applicable.some((a) => tdsModeFor(a) === 'QUARTERLY') ? 'QUARTERLY' : 'ANNUAL'; return applicable.some((a) => tdsModeFor(a) === 'QUARTERLY') ? 'QUARTERLY' : 'ANNUAL';
} }
function accountTypeOf(code: string | undefined): TdsAccountLine['type'] {
const c = (code || '').toLowerCase();
if (c.includes('fixeddeposit')) {
return 'FD';
}
if (c.includes('recurringdeposit')) {
return 'RD';
}
if (c.includes('savings')) {
return 'SB';
}
return 'OTHER';
}
/** Branches are compared by office name, case and spacing aside — the platform and the session both carry the name. */
function sameBranch(a: string, b: string): boolean {
return (a || '').trim().toLowerCase() === (b || '').trim().toLowerCase();
}
export function tdsInterestRows(filter: TdsReportFilter): TdsInterestRow[] { export function tdsInterestRows(filter: TdsReportFilter): TdsInterestRow[] {
const needle = filter.search.trim().toLowerCase(); const needle = filter.search.trim().toLowerCase();
return tdsInterestRowsForFy(filter.fy).filter((row) => { return tdsInterestRowsForFy(filter.fy).filter((row) => {
if (filter.branchCode && !sameBranch(row.branchCode, filter.branchCode)) { if (filter.branchCode && row.branchCode !== filter.branchCode) {
return false; return false;
} }
if (filter.band && row.band !== filter.band) { if (filter.band && row.band !== filter.band) {
@@ -319,8 +254,6 @@ export interface TdsInterestSummary {
tdsSaved: number; tdsSaved: number;
paidWithoutDeduction: number; paidWithoutDeduction: number;
noPan: number; noPan: number;
/** Customers holding at least one account whose interest counts toward the deduction. */
trackedCustomers: number;
byQuarter: { quarter: Quarter; interest: number; tds: number }[]; byQuarter: { quarter: Quarter; interest: number; tds: number }[];
} }
@@ -347,10 +280,7 @@ export function tdsInterestSummary(filter: TdsReportFilter): TdsInterestSummary
declarations: rows.filter((r) => r.hasDeclaration).length, declarations: rows.filter((r) => r.hasDeclaration).length,
tdsSaved: rows.reduce((s, r) => s + r.tdsSaved, 0), tdsSaved: rows.reduce((s, r) => s + r.tdsSaved, 0),
paidWithoutDeduction: rows.reduce((s, r) => s + r.paidWithoutDeduction, 0), paidWithoutDeduction: rows.reduce((s, r) => s + r.paidWithoutDeduction, 0),
// Only customers with a deposit the deduction watches: a savings-only customer without a PAN noPan: rows.filter((r) => !r.panOnRecord).length,
// is never deducted at the higher rate, so counting them overstated the problem.
noPan: rows.filter((r) => !r.panOnRecord && r.trackedAccounts > 0).length,
trackedCustomers: rows.filter((r) => r.trackedAccounts > 0).length,
byQuarter byQuarter
}; };
} }
src/app/tds-reports/tds-reports.shared.scss
-79
View File
@@ -647,82 +647,3 @@
color: var(--tdsr-ink); color: var(--tdsr-ink);
white-space: nowrap; white-space: nowrap;
} }
/* ── Help panel (interest report) ── */
.tdsr__help {
margin-bottom: 16px;
padding: 14px 18px;
border: 1px solid color-mix(in srgb, var(--tdsr-blue) 25%, transparent);
border-radius: 10px;
background: color-mix(in srgb, var(--tdsr-blue) 5%, transparent);
line-height: 1.6;
}
.tdsr__help-title {
display: flex;
gap: 8px;
align-items: center;
margin-bottom: 6px;
font-weight: 700;
color: var(--tdsr-blue);
}
.tdsr__help-list {
margin: 0;
padding-left: 20px;
li + li {
margin-top: 2px;
}
}
/* ── Action chips under the summary ── */
.tdsr__chips {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin: -6px 0 16px;
}
.tdsr__chip {
padding: 5px 12px;
border: 1px solid var(--tdsr-line);
border-radius: 999px;
background: var(--tdsr-bg);
font: inherit;
font-size: 12px;
font-weight: 600;
&--near {
border-color: color-mix(in srgb, var(--tdsr-blue) 30%, transparent);
color: var(--tdsr-blue);
cursor: pointer;
}
&--ok {
border-color: color-mix(in srgb, var(--tdsr-green) 35%, transparent);
color: var(--tdsr-green);
}
&--warn {
border-color: color-mix(in srgb, var(--tdsr-amber) 35%, transparent);
color: var(--tdsr-amber);
}
}
.tdsr__row--click {
cursor: pointer;
&:hover > td {
background: var(--tdsr-bg);
}
}
.tdsr__detail-h {
margin: 4px 0 8px;
font-weight: 700;
.tdsr__table--inner + & {
margin-top: 16px;
}
}
src/app/web-app.component.html
-1
View File
@@ -7,4 +7,3 @@
--> -->
<router-outlet></router-outlet> <router-outlet></router-outlet>
<mifosx-loading-screen></mifosx-loading-screen>
src/app/web-app.component.ts
-5
View File
@@ -296,11 +296,6 @@ export class WebAppComponent implements OnInit, OnDestroy {
}); });
}); });
} }
// Dismiss initial application boot splash screen smoothly
if (typeof (window as any).hideAppSplash === 'function') {
(window as any).hideAppSplash();
}
} }
ngOnDestroy() { ngOnDestroy() {
src/assets/animations/error_animation.json
-2755
View File
File diff suppressed because it is too large Load Diff
src/assets/animations/loading_animation.json
-3168
View File
File diff suppressed because it is too large Load Diff
src/assets/env.js
+1 -1
View File
@@ -21,7 +21,7 @@
// in the tenants table of the tenant-store database, or the platform rejects the request as an // in the tenants table of the tenant-store database, or the platform rejects the request as an
// unknown tenant. // unknown tenant.
window["env"]["fineractPlatformTenantId"] = 'utkarshbank'; window["env"]["fineractPlatformTenantId"] = 'utkarshbank';
window["env"]["fineractPlatformTenantIds"] = 'utkarshbank,lincpay,utkarshnagari,testbank,humarwork,default,mybank'; window["env"]["fineractPlatformTenantIds"] = 'utkarshbank,lincpay';
window['env']['tenantLogoUrl'] = ''; window['env']['tenantLogoUrl'] = '';
window['env']['tenantLogoUrlDark'] = ''; window['env']['tenantLogoUrlDark'] = '';
src/assets/images/mifos_splash_screen_logo.png
BIN
View File
Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 33 KiB

src/assets/styles/_loader.scss
+30 -72
View File
@@ -6,95 +6,53 @@
* file, You can obtain one at http://mozilla.org/MPL/2.0/. * file, You can obtain one at http://mozilla.org/MPL/2.0/.
*/ */
/* ==========================================================================
Modernized Loader Wrapper (Inspired by openMF/mifos-mobile)
Supports full-screen and embedded containers with smooth vector physics.
========================================================================== */
.loader-wrapper { .loader-wrapper {
position: relative; height: 100vh;
display: flex; width: 100vw;
align-items: center;
justify-content: center;
width: 100%;
min-height: 280px;
height: 100%;
background: transparent;
/* Modern orbital rings that replace legacy rigid triangles smoothly */
.triangle { .triangle {
position: absolute; width: 0;
border-radius: 50%; height: 0;
border-style: solid; border-style: solid;
box-sizing: border-box; position: absolute;
transition: all 0.3s ease; animation: rotate 0.8s infinite 0.2s;
} }
.bottom { .bottom {
width: 72px; border-width: 0 90px 90px;
height: 72px; border-color: transparent transparent #1fb050;
border-width: 3px; bottom: calc(50% - 100px);
border-color: #2563eb transparent transparent; left: calc(50% - 90px);
animation: cbs-spin-ring 1.1s cubic-bezier(0.5, 0, 0.5, 1) infinite;
box-shadow: 0 0 16px rgb(37 99 235 / 35%);
} }
.top { .top {
width: 54px; border-width: 90px 90px 0;
height: 54px; border-color: #b4d575 transparent transparent;
border-width: 3px; top: calc(50% - 100px);
border-color: transparent transparent #0ea5e9; left: calc(50% - 90px);
animation: cbs-spin-ring 1.4s cubic-bezier(0.5, 0, 0.5, 1) infinite reverse;
box-shadow: 0 0 14px rgb(14 165 233 / 35%);
} }
.left { .left {
width: 36px; border-width: 90px 0 90px 90px;
height: 36px; border-color: transparent transparent transparent #1074b9;
border-width: 2.5px; top: calc(50% - 90px);
border-color: #10b981 transparent transparent; left: calc(50% - 100px);
animation: cbs-spin-ring 0.9s cubic-bezier(0.5, 0, 0.5, 1) infinite;
box-shadow: 0 0 10px rgb(16 185 129 / 35%);
} }
.right { .right {
width: 18px; border-width: 90px 90px 90px 0;
height: 18px; border-color: transparent #1daeec transparent transparent;
border-width: 2px; top: calc(50% - 90px);
border-color: transparent #38bdf8 transparent transparent; right: calc(50% - 100px);
animation: cbs-spin-ring 0.7s cubic-bezier(0.5, 0, 0.5, 1) infinite reverse;
} }
/* Optional central glowing core */ @keyframes rotate {
&::after { from {
content: ''; transform: rotate(0deg);
width: 8px; }
height: 8px;
border-radius: 50%; to {
background: #38bdf8; transform: rotate(360deg);
box-shadow: 0 0 12px #38bdf8; }
animation: cbs-pulse-core 1.5s ease-in-out infinite;
}
}
@keyframes cbs-spin-ring {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
@keyframes cbs-pulse-core {
0%,
100% {
transform: scale(0.85);
opacity: 0.6;
}
50% {
transform: scale(1.3);
opacity: 1;
} }
} }
src/environments/.env.ts
+2 -2
View File
@@ -9,8 +9,8 @@
/* tslint:disable */ /* tslint:disable */
export default { export default {
'mifos_x': { 'mifos_x': {
'version': '261008', 'version': '261001',
'hash': '4acee3e63' 'hash': '1ffac4b1'
}, },
'allow_switching_backend_instance': true 'allow_switching_backend_instance': true
}; };
src/environments/environment.prod.ts
+1 -2
View File
@@ -20,8 +20,7 @@ export const environment = {
hash: env.mifos_x.hash, hash: env.mifos_x.hash,
// For connecting to server running elsewhere update the tenant identifier // For connecting to server running elsewhere update the tenant identifier
fineractPlatformTenantId: loadedEnv['fineractPlatformTenantId'] || 'utkarshbank', fineractPlatformTenantId: loadedEnv['fineractPlatformTenantId'] || 'utkarshbank',
fineractPlatformTenantIds: fineractPlatformTenantIds: loadedEnv['fineractPlatformTenantIds'] || 'utkarshbank,lincpay',
loadedEnv['fineractPlatformTenantIds'] || 'utkarshbank,lincpay,utkarshnagari,testbank,humarwork,default,mybank',
// For connecting to others servers running elsewhere update the base API URL // For connecting to others servers running elsewhere update the base API URL
baseApiUrls: baseApiUrls:
loadedEnv['fineractApiUrls'] || 'https://demo.mifos.community,https://localhost:8443,' + window.location.origin, loadedEnv['fineractApiUrls'] || 'https://demo.mifos.community,https://localhost:8443,' + window.location.origin,
src/environments/environment.ts
+1 -2
View File
@@ -23,8 +23,7 @@ export const environment = {
hash: env.mifos_x.hash, hash: env.mifos_x.hash,
// For connecting to server running elsewhere update the tenant identifier // For connecting to server running elsewhere update the tenant identifier
fineractPlatformTenantId: loadedEnv.fineractPlatformTenantId || 'utkarshbank', fineractPlatformTenantId: loadedEnv.fineractPlatformTenantId || 'utkarshbank',
fineractPlatformTenantIds: fineractPlatformTenantIds: loadedEnv.fineractPlatformTenantIds || 'utkarshbank,lincpay',
loadedEnv.fineractPlatformTenantIds || 'utkarshbank,lincpay,utkarshnagari,testbank,humarwork,default,mybank',
// For connecting to others servers running elsewhere update the base API URL // For connecting to others servers running elsewhere update the base API URL
baseApiUrls: baseApiUrls:
loadedEnv.fineractApiUrls || 'https://demo.mifos.community,https://localhost:8443,' + window.location.origin, loadedEnv.fineractApiUrls || 'https://demo.mifos.community,https://localhost:8443,' + window.location.origin,
src/index.html
+9 -290
View File
@@ -11,7 +11,7 @@
<html lang="en" class="h-full bg-gray-100"> <html lang="en" class="h-full bg-gray-100">
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<title>CBS Nexora</title> <title>{{'APP_NAME' | translate}}</title>
<base href="/" /> <base href="/" />
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" /> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
<meta name="apple-mobile-web-app-capable" content="yes" /> <meta name="apple-mobile-web-app-capable" content="yes" />
@@ -27,10 +27,7 @@
rel="stylesheet" rel="stylesheet"
/> />
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Mono:300" rel="stylesheet" /> <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Mono:300" rel="stylesheet" />
<link <link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@500&display=swap" rel="stylesheet" />
href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500&family=IBM+Plex+Sans:wght@400;500;600&family=IBM+Plex+Serif:wght@600&display=swap"
rel="stylesheet"
/>
<link <link
href="https://fonts.googleapis.com/css2?family=Hanken+Grotesk:wght@400;500;600;700;800&family=Newsreader:ital,wght@0,400;0,500;1,400;1,500&display=swap" href="https://fonts.googleapis.com/css2?family=Hanken+Grotesk:wght@400;500;600;700;800&family=Newsreader:ital,wght@0,400;0,500;1,400;1,500&display=swap"
rel="stylesheet" rel="stylesheet"
@@ -111,291 +108,13 @@
}); });
</script> </script>
<div id="cbs-app-splash-screen" class="cbs-init-screen"> <mifosx-web-app>
<style> <div class="loader-wrapper">
.cbs-init-screen { <div class="bottom triangle"></div>
position: fixed; <div class="top triangle"></div>
inset: 0; <div class="left triangle"></div>
display: flex; <div class="right triangle"></div>
flex-direction: column;
align-items: center;
justify-content: center;
background: radial-gradient(circle at center, #0f172a 0%, #090d16 100%);
color: #f8fafc;
font-family:
'Plus Jakarta Sans',
-apple-system,
BlinkMacSystemFont,
'Segoe UI',
Roboto,
sans-serif;
z-index: 999999;
overflow: hidden;
transition:
opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1),
transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}
.cbs-init-screen.cbs-splash-fade-out {
opacity: 0;
transform: scale(1.02);
pointer-events: none;
}
.cbs-init-brand {
display: flex;
flex-direction: column;
align-items: center;
gap: 10px;
margin-bottom: 20px;
text-align: center;
}
.cbs-init-logo-wrap {
display: flex;
align-items: center;
justify-content: center;
}
.cbs-init-logo-img {
height: 52px;
width: auto;
max-width: 260px;
object-fit: contain;
filter: drop-shadow(0 6px 18px rgba(0, 0, 0, 0.5));
transition: transform 0.3s ease;
}
.cbs-init-icon {
width: 56px;
height: 56px;
border-radius: 14px;
background: linear-gradient(135deg, #1e3a8a 0%, #0284c7 100%);
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 10px 24px rgba(14, 165, 233, 0.35);
border: 1px solid rgba(255, 255, 255, 0.2);
}
.cbs-init-title {
font-size: 1.5rem;
font-weight: 800;
letter-spacing: -0.02em;
margin: 0;
}
.cbs-init-sub {
font-size: 0.78rem;
color: #94a3b8;
font-weight: 500;
letter-spacing: 0.06em;
text-transform: uppercase;
}
.cbs-init-lottie-box {
width: 130px;
height: 130px;
margin: 8px auto;
display: flex;
align-items: center;
justify-content: center;
filter: drop-shadow(0 8px 24px rgba(37, 99, 235, 0.25));
}
.cbs-init-spinner {
width: 64px;
height: 64px;
position: relative;
}
.cbs-init-ring {
position: absolute;
inset: 0;
border-radius: 50%;
border: 3px solid transparent;
}
.cbs-init-ring-1 {
border-top-color: #2563eb;
border-right-color: #2563eb;
animation: cbsInitSpin 1.1s cubic-bezier(0.5, 0, 0.5, 1) infinite;
}
.cbs-init-ring-2 {
inset: 6px;
border-bottom-color: #0ea5e9;
border-left-color: #0ea5e9;
animation: cbsInitSpin 1.5s cubic-bezier(0.5, 0, 0.5, 1) infinite reverse;
}
.cbs-init-ring-3 {
inset: 12px;
border-top-color: #10b981;
animation: cbsInitSpin 0.9s cubic-bezier(0.5, 0, 0.5, 1) infinite;
}
.cbs-init-track {
width: 260px;
height: 5px;
background: rgba(255, 255, 255, 0.1);
border-radius: 99px;
overflow: hidden;
margin: 18px 0 12px;
position: relative;
}
.cbs-init-fill {
height: 100%;
width: 0%;
background: linear-gradient(90deg, #2563eb, #38bdf8);
border-radius: 99px;
box-shadow: 0 0 12px rgba(56, 189, 248, 0.6);
transition: width 0.3s ease;
}
.cbs-init-status {
font-size: 0.82rem;
color: #94a3b8;
font-family: inherit;
margin: 0;
height: 20px;
}
@keyframes cbsInitSpin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
</style>
<div class="cbs-init-brand">
<div class="cbs-init-logo-wrap">
<img
src="assets/images/cbsnexora-logo.png"
alt="CBS Nexora"
class="cbs-init-logo-img"
onerror="
this.style.display = 'none';
document.getElementById('cbs-init-fallback-brand').style.display = 'flex';
"
/>
<div id="cbs-init-fallback-brand" style="display: none; align-items: center; gap: 8px">
<div class="cbs-init-icon">
<svg width="32" height="32" viewBox="0 0 32 32">
<rect x="2" y="2" width="13" height="13" rx="2.5" fill="#ffffff" />
<rect x="17" y="2" width="13" height="13" rx="2.5" fill="#29abe2" />
<rect x="2" y="17" width="13" height="13" rx="2.5" fill="#00b388" />
<rect x="17" y="17" width="13" height="13" rx="2.5" fill="#6b7fa3" />
</svg>
</div>
<h2 class="cbs-init-title" style="margin: 0; font-size: 1.4rem">CBS Nexora</h2>
</div>
</div>
<span class="cbs-init-sub">Next-Generation Core Banking</span>
</div> </div>
</mifosx-web-app>
<div id="cbs-init-lottie-target" class="cbs-init-lottie-box">
<div class="cbs-init-spinner">
<div class="cbs-init-ring cbs-init-ring-1"></div>
<div class="cbs-init-ring cbs-init-ring-2"></div>
<div class="cbs-init-ring cbs-init-ring-3"></div>
</div>
</div>
<div class="cbs-init-track">
<div class="cbs-init-fill" id="cbs-init-progress-bar"></div>
</div>
<p class="cbs-init-status" id="cbs-init-status-text">Connecting to Secure Banking Gateway...</p>
</div>
<script>
(function () {
var splash = document.getElementById('cbs-app-splash-screen');
var bar = document.getElementById('cbs-init-progress-bar');
var status = document.getElementById('cbs-init-status-text');
var progress = 0;
var minTimePassed = false;
var angularReady = false;
var dismissed = false;
// Load Lottie Vector Animation
var script = document.createElement('script');
script.src = 'assets/js/lottie.min.js';
script.onload = function () {
if (typeof lottie !== 'undefined') {
var target = document.getElementById('cbs-init-lottie-target');
if (target) {
target.innerHTML = '';
lottie.loadAnimation({
container: target,
renderer: 'svg',
loop: true,
autoplay: true,
path: 'assets/animations/loading_animation.json'
});
}
}
};
document.head.appendChild(script);
// Progress simulation stages (Guaranteed ~2 seconds duration on refresh)
var interval = setInterval(function () {
if (progress < 90) {
progress += 5;
} else if (angularReady && progress < 100) {
progress += 5;
}
if (bar) bar.style.width = Math.min(progress, 100) + '%';
if (status) {
if (progress >= 85) {
status.innerText = 'Launching CBS Nexora Dashboard...';
} else if (progress >= 60) {
status.innerText = 'Synchronizing core banking ledger schema...';
} else if (progress >= 30) {
status.innerText = 'Authenticating token & cryptographic keys...';
}
}
if (progress >= 100 && angularReady && minTimePassed) {
clearInterval(interval);
dismissSplash();
}
}, 90);
// Enforce minimum hold time (2000ms = 2 seconds) so refresh always shows the animation
setTimeout(function () {
minTimePassed = true;
if (angularReady) {
progress = 100;
if (bar) bar.style.width = '100%';
dismissSplash();
}
}, 2000);
function dismissSplash() {
if (dismissed) return;
dismissed = true;
clearInterval(interval);
if (bar) bar.style.width = '100%';
if (status) status.innerText = 'Ready! System loaded successfully.';
setTimeout(function () {
if (splash) {
splash.classList.add('cbs-splash-fade-out');
setTimeout(function () {
if (splash && splash.parentNode) {
splash.parentNode.removeChild(splash);
}
}, 600);
}
}, 250);
}
// Global hook for Angular to notify when ready
window.hideAppSplash = function () {
angularReady = true;
if (minTimePassed) {
dismissSplash();
}
};
// Safety fallback (Max 7s in case of backend network failure)
setTimeout(function () {
angularReady = true;
minTimePassed = true;
dismissSplash();
}, 7000);
})();
</script>
<mifosx-web-app></mifosx-web-app>
</body> </body>
</html> </html>
src/main.scss
+33 -339
View File
@@ -81,332 +81,66 @@
// ===== Sub-menu Mega Panels (rendered in CDK overlay) ===== // ===== Sub-menu Mega Panels (rendered in CDK overlay) =====
.deposits-mega-panel, .deposits-mega-panel,
.hrm-mega-panel, .hrm-mega-panel {
.cashier-mega-panel, max-width: 700px !important;
.clerk-mega-panel,
.clearing-mega-panel,
.npa-mega-panel,
.advances-mega-panel,
.admin-mega-panel {
min-width: 680px !important;
max-width: 740px !important;
}
.branch-ops-mega-panel,
.insurance-mega-panel,
.digital-mega-panel,
.ckyc-mega-panel {
min-width: 440px !important;
max-width: 480px !important;
overflow-x: hidden !important;
} }
.share-mega-panel, .share-mega-panel,
.others-mega-panel { .others-mega-panel {
min-width: 780px !important; max-width: 850px !important;
max-width: 840px !important;
} }
.reports-mega-panel { .share-grid,
min-width: 740px !important; .others-grid {
max-width: 800px !important; grid-template-columns: repeat(4, 1fr) !important;
border-top: 2.5px solid #0369a1 !important;
} }
.letter-mega-panel, .others-grid,
.reconciliation-mega-panel { .npa-grid {
min-width: 900px !important; grid-template-columns: repeat(3, 1fr) !important;
max-width: 960px !important;
} }
/* ========================================================================== .npa-mega-panel,
Mega Menu Panel CDK Overlay Rules (Anchor naturally under triggers)
========================================================================== */
.cdk-overlay-pane:has(.mat-mdc-menu-panel) {
max-width: 96vw !important;
}
/* Individual Top Accent Border for Mega Panels */
.deposits-mega-panel,
.advances-mega-panel { .advances-mega-panel {
border-top: 2.5px solid #1074b9 !important; max-width: 800px !important;
} }
.cashier-mega-panel { .advances-grid {
border-top: 2.5px solid #0284c7 !important; grid-template-columns: repeat(3, 1fr) !important;
}
.clerk-mega-panel {
border-top: 2.5px solid #2563eb !important;
}
.branch-ops-mega-panel {
border-top: 2.5px solid #4f46e5 !important;
}
.clearing-mega-panel,
.reconciliation-mega-panel {
border-top: 2.5px solid #0d9488 !important;
}
.hrm-mega-panel {
border-top: 2.5px solid #0284c7 !important;
}
.admin-mega-panel,
.digital-mega-panel {
border-top: 2.5px solid #7c3aed !important;
}
.share-mega-panel {
border-top: 2.5px solid #d97706 !important;
}
.others-mega-panel {
border-top: 2.5px solid #0284c7 !important;
}
.npa-mega-panel {
border-top: 2.5px solid #dc2626 !important;
} }
.letter-mega-panel { .letter-mega-panel {
border-top: 2.5px solid #15803d !important; max-width: 1100px !important;
} }
.insurance-mega-panel { .letter-grid {
border-top: 2.5px solid #c2410c !important; grid-template-columns: repeat(5, minmax(190px, 1fr)) !important;
min-width: 1040px;
} }
.ckyc-mega-panel { .reconciliation-mega-panel {
border-top: 2.5px solid #be185d !important; max-width: 1100px !important;
} }
/* Universal Mega Panel Grid styling inside Material Menu Overlays */
.deposit-menu-grid {
display: grid !important;
gap: 4px 12px !important;
padding: 6px 10px !important;
box-sizing: border-box !important;
min-width: 0 !important;
width: 100% !important;
max-width: 100% !important;
overflow-x: hidden !important;
}
/* Mega Panel Grids with exact column definitions */
.deposit-menu-grid.cashier-grid,
.deposit-menu-grid.clerk-grid,
.deposit-menu-grid.clearing-grid,
.deposit-menu-grid.advances-grid,
.deposit-menu-grid.deposits-grid,
.deposit-menu-grid.hrm-grid,
.deposit-menu-grid.admin-grid,
.deposit-menu-grid.npa-grid,
.cashier-grid,
.clerk-grid,
.clearing-grid,
.advances-grid,
.deposits-grid,
.hrm-grid,
.admin-grid,
.npa-grid {
grid-template-columns: repeat(3, minmax(210px, 1fr)) !important;
}
.deposit-menu-grid.reports-grid,
.reports-grid {
grid-template-columns: repeat(3, minmax(230px, 1fr)) !important;
}
.deposit-menu-grid.branch-ops-grid,
.deposit-menu-grid.insurance-grid,
.deposit-menu-grid.digital-grid,
.deposit-menu-grid.ckyc-grid,
.branch-ops-grid,
.insurance-grid,
.digital-grid,
.ckyc-grid {
grid-template-columns: repeat(2, minmax(200px, 1fr)) !important;
}
.deposit-menu-grid.share-grid,
.deposit-menu-grid.others-grid,
.share-grid,
.others-grid {
grid-template-columns: repeat(4, minmax(185px, 1fr)) !important;
}
.deposit-menu-grid.letter-grid,
.deposit-menu-grid.reconciliation-grid,
.letter-grid,
.reconciliation-grid { .reconciliation-grid {
grid-template-columns: repeat(5, minmax(170px, 1fr)) !important; grid-template-columns: repeat(5, minmax(190px, 1fr)) !important;
min-width: 1040px;
} }
.deposit-menu-group { /* Admin Mega Menu — 3-column rectangular panel (Setup · Catalog ·
display: flex !important; Audit & Compliance). Reuses the deposit-mega-menu grid + group chrome
flex-direction: column !important; and retints the group-title accent to Admin purple. */
gap: 1px !important; .admin-mega-panel {
min-width: 0 !important; max-width: 760px !important;
}
.admin-grid {
grid-template-columns: repeat(3, minmax(220px, 1fr)) !important;
min-width: 680px;
.deposit-group-title { .deposit-group-title {
font-weight: 700 !important; color: #7c3aed !important;
font-size: 9.5px !important; border-bottom-color: #7c3aed !important;
text-transform: uppercase !important;
letter-spacing: 0.6px !important;
color: #1074b9 !important;
padding: 3px 6px !important;
margin-bottom: 2px !important;
border-bottom: 1.5px solid #1074b9 !important;
display: flex !important;
align-items: center !important;
line-height: 1.2 !important;
white-space: nowrap !important;
}
}
/* Specific Accent Colors for Mega Panel Group Titles */
.cashier-grid .deposit-group-title {
color: #0284c7 !important;
border-bottom-color: #0284c7 !important;
}
.clerk-grid .deposit-group-title {
color: #2563eb !important;
border-bottom-color: #2563eb !important;
}
.clearing-grid .deposit-group-title {
color: #0d9488 !important;
border-bottom-color: #0d9488 !important;
}
.branch-ops-grid .deposit-group-title {
color: #4f46e5 !important;
border-bottom-color: #4f46e5 !important;
}
.reports-grid .deposit-group-title {
color: #0369a1 !important;
border-bottom-color: #0369a1 !important;
}
.insurance-grid .deposit-group-title {
color: #c2410c !important;
border-bottom-color: #c2410c !important;
}
.digital-grid .deposit-group-title {
color: #7c3aed !important;
border-bottom-color: #7c3aed !important;
}
.ckyc-grid .deposit-group-title {
color: #be185d !important;
border-bottom-color: #be185d !important;
}
.admin-grid .deposit-group-title {
color: #7c3aed !important;
border-bottom-color: #7c3aed !important;
}
.reconciliation-grid .deposit-group-title {
color: #0d9488 !important;
border-bottom-color: #0d9488 !important;
}
/* Compact, RBI-Style Menu Item Overrides in CDK Overlays */
/* Compact, RBI-Style Menu Item Overrides for Navbar Mega Panels ONLY */
.mat-mdc-menu-panel:has(.deposit-menu-grid) {
--mat-menu-item-label-text-size: 10.5px !important;
--mat-menu-item-label-text-line-height: 14px !important;
border-radius: 8px !important;
box-shadow:
0 10px 28px rgb(15 23 42 / 14%),
0 2px 6px rgb(15 23 42 / 8%) !important;
border: 1px solid #d1d5db !important;
background: #fff !important;
max-height: 75vh !important;
overflow: hidden auto !important;
.mat-mdc-menu-content {
padding: 4px 6px !important;
overflow-x: hidden !important;
}
.deposit-menu-grid .mat-mdc-menu-item {
font-size: 10.5px !important;
font-weight: 500 !important;
height: 25px !important;
min-height: 25px !important;
line-height: 25px !important;
padding: 0 6px !important;
border-radius: 4px !important;
color: #334155 !important;
font-family:
'IBM Plex Sans',
-apple-system,
BlinkMacSystemFont,
'Segoe UI',
Roboto,
sans-serif !important;
transition:
background-color 0.12s ease,
color 0.12s ease !important;
white-space: nowrap !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
min-width: 0 !important;
width: 100% !important;
box-sizing: border-box !important;
.mat-mdc-menu-item-text,
.mdc-list-item__primary-text,
.mdc-list-item__content {
font-size: 10.5px !important;
font-weight: 500 !important;
line-height: 1.25 !important;
color: #334155 !important;
white-space: nowrap !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
display: inline-flex !important;
align-items: center !important;
width: 100% !important;
}
.menu-item-icon,
fa-icon,
i {
font-size: 10.5px !important;
width: 13px !important;
min-width: 13px !important;
text-align: center !important;
margin-right: 5px !important;
opacity: 0.8 !important;
flex-shrink: 0 !important;
}
&:hover {
background-color: #f0f7ff !important;
color: #0d47a1 !important;
.mat-mdc-menu-item-text,
.mdc-list-item__primary-text {
color: #0d47a1 !important;
}
.menu-item-icon,
fa-icon,
i {
opacity: 1 !important;
color: #0d47a1 !important;
}
}
} }
} }
@@ -2278,43 +2012,3 @@ mifosx-client-datatable-step * {
} }
} }
} }
// ===== CBS Compact Enterprise Density Polish =====
// Reduces excessive whitespace and oversized elements across the banking UI
.mat-mdc-table {
th.mat-mdc-header-cell {
padding: 8px 12px !important;
font-size: 11px !important;
font-weight: 700 !important;
letter-spacing: 0.04em !important;
}
td.mat-mdc-cell {
padding: 6px 12px !important;
font-size: 12px !important;
line-height: 1.35 !important;
}
tr.mat-mdc-row,
tr.mat-mdc-header-row {
height: 36px !important;
min-height: 36px !important;
}
}
// Compact Material Cards
.mat-mdc-card {
padding: 12px 16px !important;
}
// Breadcrumb & Page Titles Compact Spacing
.breadcrumb-container {
margin-bottom: 8px !important;
padding: 4px 0 !important;
}
.mifosx-page-title,
.page-title {
font-size: 17px !important;
margin-bottom: 8px !important;
}
src/theme/mifosx-theme.scss
+1 -1
View File
@@ -53,7 +53,7 @@ $mifosx-typography: mat.m2-define-typography-config(
$button: $mifosx-typography-level $button: $mifosx-typography-level
); );
$mifosx-density: -1; $mifosx-density: 0;
$mifosx-app-theme: mat.m2-define-light-theme( $mifosx-app-theme: mat.m2-define-light-theme(
( (