Merge branch 'feature/fd-interest-posting' into dev-latest
Brings the FD interest posting approval UI and the latest UI work into dev-latest: - FD interest posting approval screens, posting period and GL-reconciled maturity interest - FD maturity approval UI added and then reverted (maturity now runs directly through the scheduler, no approval step) - "mybank" tenant registered in the UI tenant list - Animated boot splash and reusable loading screen - Compact navigation with grouped mega menus and branded loaders Conflict resolved: - src/environments/.env.ts: kept dev-latest's generated version/hash; the file is regenerated by `npm start` anyway. Also: prettier formatting of toolbar.component.html (already unformatted on dev-latest; formatting only, required by the pre-commit hook). Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
Claude Opus 5.5
@@ -31,6 +31,8 @@
|
||||
"@angular/localize/init"
|
||||
],
|
||||
"assets": [
|
||||
"src/favicon.ico",
|
||||
"src/apple-touch-icon.png",
|
||||
"src/assets/images/cbsnexora-favicon.svg",
|
||||
"src/robots.txt",
|
||||
"src/manifest.json",
|
||||
@@ -39,6 +41,11 @@
|
||||
"glob": "**/*",
|
||||
"input": "node_modules/tinymce",
|
||||
"output": "assets/tinymce"
|
||||
},
|
||||
{
|
||||
"glob": "lottie.min.js",
|
||||
"input": "node_modules/lottie-web/build/player",
|
||||
"output": "assets/js"
|
||||
}
|
||||
],
|
||||
"styles": [
|
||||
|
||||
Generated
+7
@@ -41,6 +41,7 @@
|
||||
"jspdf-autotable": "^5.0.2",
|
||||
"lightgallery": "^2.9.0",
|
||||
"lodash": "4.17.23",
|
||||
"lottie-web": "^5.13.0",
|
||||
"moment": "^2.29.4",
|
||||
"ngx-image-cropper": "^9.1.6",
|
||||
"ngx-mat-select-search": "^8.0.2",
|
||||
@@ -18380,6 +18381,12 @@
|
||||
"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": {
|
||||
"version": "5.1.1",
|
||||
"resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz",
|
||||
|
||||
@@ -71,6 +71,7 @@
|
||||
"jspdf-autotable": "^5.0.2",
|
||||
"lightgallery": "^2.9.0",
|
||||
"lodash": "4.17.23",
|
||||
"lottie-web": "^5.13.0",
|
||||
"moment": "^2.29.4",
|
||||
"ngx-image-cropper": "^9.1.6",
|
||||
"ngx-mat-select-search": "^8.0.2",
|
||||
|
||||
@@ -97,6 +97,7 @@ import { TokenInterceptor as ZitadelTokenInterceptor } from './zitadel/token.int
|
||||
import { AuthService } from './zitadel/auth.service';
|
||||
import { environment } from '../environments/environment';
|
||||
import { CallbackComponent } from './zitadel/callback/callback.component';
|
||||
import { LoadingScreenComponent } from './shared/loading-screen/loading-screen.component';
|
||||
import { OAuthModule } from 'angular-oauth2-oidc';
|
||||
|
||||
export class CustomMissingTranslationHandler implements MissingTranslationHandler {
|
||||
@@ -197,6 +198,7 @@ export function HttpLoaderFactory(http: HttpClient) {
|
||||
AppRoutingModule,
|
||||
NotFoundComponent,
|
||||
CallbackComponent,
|
||||
LoadingScreenComponent,
|
||||
OAuthModule.forRoot()
|
||||
],
|
||||
providers: [
|
||||
|
||||
@@ -352,6 +352,51 @@
|
||||
</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
|
||||
automatically — so closing the day doesn't mean separately checking Vault Position and
|
||||
every cashier's own Cashier Position screen by hand. -->
|
||||
|
||||
@@ -195,6 +195,75 @@
|
||||
font-size: 11px;
|
||||
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 {
|
||||
|
||||
@@ -503,7 +503,8 @@
|
||||
[matMenuTriggerFor]="loanOriginationMenu"
|
||||
*mifosxHasPermission="'MENU_LOAN_ORIGINATION'"
|
||||
>
|
||||
<fa-icon icon="clipboard-check" class="ni-ico"></fa-icon>Loan Origination
|
||||
<fa-icon icon="clipboard-check" class="ni-ico"></fa-icon><span class="ni-full">Loan Origination</span
|
||||
><span class="ni-short">Loans</span>
|
||||
<fa-icon icon="caret-down" class="ni-caret"></fa-icon>
|
||||
</a>
|
||||
<a
|
||||
@@ -512,7 +513,8 @@
|
||||
(click)="glMenuOpen = !glMenuOpen; subLedgerOpen = false"
|
||||
*mifosxHasPermission="'MENU_GENERAL_LEDGER'"
|
||||
>
|
||||
<fa-icon icon="book-open" class="ni-ico"></fa-icon>General Ledger
|
||||
<fa-icon icon="book-open" class="ni-ico"></fa-icon><span class="ni-full">General Ledger</span
|
||||
><span class="ni-short">GL</span>
|
||||
<fa-icon [icon]="glMenuOpen ? 'caret-up' : 'caret-down'" class="ni-caret"></fa-icon>
|
||||
</a>
|
||||
<a
|
||||
@@ -521,7 +523,8 @@
|
||||
(click)="subLedgerOpen = !subLedgerOpen; glMenuOpen = false"
|
||||
*mifosxHasPermission="'MENU_SUB_LEDGER'"
|
||||
>
|
||||
<fa-icon icon="book" class="ni-ico"></fa-icon>Sub Ledger
|
||||
<fa-icon icon="book" class="ni-ico"></fa-icon><span class="ni-full">Sub Ledger</span
|
||||
><span class="ni-short">Sub GL</span>
|
||||
<fa-icon [icon]="subLedgerOpen ? 'caret-up' : 'caret-down'" class="ni-caret"></fa-icon>
|
||||
</a>
|
||||
</div>
|
||||
@@ -583,14 +586,16 @@
|
||||
[matMenuTriggerFor]="reconciliationMenu"
|
||||
*mifosxHasPermission="'MENU_CONFIG_WIZARD'"
|
||||
>
|
||||
<fa-icon icon="sync-alt" class="ni-ico"></fa-icon>Reconciliation
|
||||
<fa-icon icon="sync-alt" class="ni-ico"></fa-icon><span class="ni-full">Reconciliation</span
|
||||
><span class="ni-short">Recon</span>
|
||||
<fa-icon icon="caret-down" class="ni-caret"></fa-icon>
|
||||
</a>
|
||||
<a class="ni" tabindex="0" routerLink="/chequebook" *mifosxHasPermission="'MENU_CHEQUEBOOK'">
|
||||
<fa-icon icon="book" class="ni-ico"></fa-icon>Cheque Book
|
||||
</a>
|
||||
<a class="ni" tabindex="0" [matMenuTriggerFor]="letterMgmtMenu" *mifosxHasPermission="'MENU_LETTER_MGMT'">
|
||||
<fa-icon icon="envelope" class="ni-ico"></fa-icon>Documents Hub
|
||||
<fa-icon icon="envelope" class="ni-ico"></fa-icon><span class="ni-full">Documents Hub</span
|
||||
><span class="ni-short">Docs Hub</span>
|
||||
<fa-icon icon="caret-down" class="ni-caret"></fa-icon>
|
||||
</a>
|
||||
</div>
|
||||
@@ -617,77 +622,89 @@
|
||||
</button>
|
||||
</mat-menu>
|
||||
|
||||
<mat-menu #reportsMenu="matMenu" [overlapTrigger]="false" class="nav-dropdown">
|
||||
<button mat-menu-item [routerLink]="['/branch-ops/account-register']" tabindex="0">
|
||||
<i class="fa fa-book menu-item-icon"></i> Account Register
|
||||
</button>
|
||||
<button mat-menu-item [routerLink]="['/reports']" tabindex="0">
|
||||
<i class="fa fa-th-list menu-item-icon"></i> All Reports
|
||||
</button>
|
||||
<button mat-menu-item [routerLink]="['/reports', 'Client']" tabindex="0">
|
||||
<i class="fa fa-user menu-item-icon"></i> Clients
|
||||
</button>
|
||||
<button mat-menu-item [routerLink]="['/reports', 'Loan']" tabindex="0">
|
||||
<i class="fa fa-credit-card menu-item-icon"></i> Loans
|
||||
</button>
|
||||
<button mat-menu-item [routerLink]="['/reports', 'Savings']" tabindex="0">
|
||||
<i class="fa fa-piggy-bank menu-item-icon"></i> Savings
|
||||
</button>
|
||||
<button mat-menu-item [routerLink]="['/reports', 'Fund']" tabindex="0">
|
||||
<i class="fa fa-hand-holding-usd menu-item-icon"></i> Funds
|
||||
</button>
|
||||
<button mat-menu-item [routerLink]="['/reports', 'Accounting']" tabindex="0">
|
||||
<i class="fa fa-calculator menu-item-icon"></i> Accounting
|
||||
</button>
|
||||
<mat-divider></mat-divider>
|
||||
<!-- Listed here as well as under Branch Ops: an officer looking for the day's figures reaches
|
||||
for Reports, and the same screen answers both. -->
|
||||
<button mat-menu-item routerLink="/branch-ops/day-book" tabindex="0">
|
||||
<i class="fa fa-book menu-item-icon"></i> Day Book & Officer Verification
|
||||
</button>
|
||||
<button mat-menu-item routerLink="/branch-ops/end-of-day" tabindex="0">
|
||||
<i class="fa fa-clipboard-check menu-item-icon"></i> End of the Day Report
|
||||
</button>
|
||||
<button mat-menu-item routerLink="/reports/form-97-98" tabindex="0">
|
||||
<i class="fa fa-file-invoice menu-item-icon"></i> Form 97/98 Transaction Report
|
||||
</button>
|
||||
<button mat-menu-item routerLink="/reports/risk-review" tabindex="0">
|
||||
<i class="fa fa-user-shield menu-item-icon"></i> Risk Review Report
|
||||
</button>
|
||||
<button mat-menu-item routerLink="/reports/kyc-expiry" tabindex="0">
|
||||
<i class="fa fa-id-card menu-item-icon"></i> Re-KYC Expiry & Outreach
|
||||
</button>
|
||||
<button mat-menu-item routerLink="/reports/dormancy" tabindex="0">
|
||||
<i class="fa fa-hourglass-half menu-item-icon"></i> Inactive, Dormant & DEAF
|
||||
</button>
|
||||
<button mat-menu-item routerLink="/reports/savings-interest" tabindex="0">
|
||||
<i class="fa fa-percentage menu-item-icon"></i> Savings Interest Posted
|
||||
</button>
|
||||
<button mat-menu-item routerLink="/reports/interest-posting" tabindex="0">
|
||||
<i class="fa fa-clipboard-check menu-item-icon"></i> Interest Posting Reports
|
||||
</button>
|
||||
<button mat-menu-item routerLink="/reports/interest-posting-summary" tabindex="0">
|
||||
<i class="fa fa-table menu-item-icon"></i> Interest Posting Summary (Branch-wise)
|
||||
</button>
|
||||
<!--
|
||||
The Principal Officer clears flagged UNSC screenings here. It is not a runnable report,
|
||||
so it never shows up under the report categories above and had no nav entry at all.
|
||||
-->
|
||||
<button mat-menu-item routerLink="/reports/sanctions-logs" tabindex="0">
|
||||
<i class="fa fa-shield-alt menu-item-icon"></i> Sanctions Screening & Alerts
|
||||
</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-interest" tabindex="0">
|
||||
<i class="fa fa-percent menu-item-icon"></i> Deposit Interest & TDS
|
||||
</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 — Share Capital
|
||||
</button>
|
||||
<mat-menu #reportsMenu="matMenu" class="reports-mega-panel" [overlapTrigger]="false">
|
||||
<div class="deposit-menu-grid reports-grid" (click)="$event.stopPropagation()">
|
||||
<!-- Core Reports -->
|
||||
<div class="deposit-menu-group">
|
||||
<div class="deposit-group-title">Core Reports</div>
|
||||
<button mat-menu-item [routerLink]="['/branch-ops/account-register']" tabindex="0">
|
||||
<i class="fa fa-book menu-item-icon"></i> Account Register
|
||||
</button>
|
||||
<button mat-menu-item [routerLink]="['/reports']" tabindex="0">
|
||||
<i class="fa fa-th-list menu-item-icon"></i> All Reports
|
||||
</button>
|
||||
<button mat-menu-item [routerLink]="['/reports', 'Client']" tabindex="0">
|
||||
<i class="fa fa-user menu-item-icon"></i> Clients
|
||||
</button>
|
||||
<button mat-menu-item [routerLink]="['/reports', 'Loan']" tabindex="0">
|
||||
<i class="fa fa-credit-card menu-item-icon"></i> Loans
|
||||
</button>
|
||||
<button mat-menu-item [routerLink]="['/reports', 'Savings']" tabindex="0">
|
||||
<i class="fa fa-piggy-bank menu-item-icon"></i> Savings
|
||||
</button>
|
||||
<button mat-menu-item [routerLink]="['/reports', 'Fund']" tabindex="0">
|
||||
<i class="fa fa-hand-holding-usd menu-item-icon"></i> Funds
|
||||
</button>
|
||||
<button mat-menu-item [routerLink]="['/reports', 'Accounting']" tabindex="0">
|
||||
<i class="fa fa-calculator menu-item-icon"></i> Accounting
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Operations & Interest -->
|
||||
<div class="deposit-menu-group">
|
||||
<div class="deposit-group-title">Operations & Interest</div>
|
||||
<button mat-menu-item routerLink="/branch-ops/day-book" tabindex="0">
|
||||
<i class="fa fa-book menu-item-icon"></i> Day Book & Officer Verification
|
||||
</button>
|
||||
<button mat-menu-item routerLink="/branch-ops/end-of-day" tabindex="0">
|
||||
<i class="fa fa-clipboard-check menu-item-icon"></i> End of the Day Report
|
||||
</button>
|
||||
<button mat-menu-item routerLink="/reports/savings-interest" tabindex="0">
|
||||
<i class="fa fa-percentage menu-item-icon"></i> Savings Interest Posted
|
||||
</button>
|
||||
<button mat-menu-item routerLink="/reports/interest-posting" tabindex="0">
|
||||
<i class="fa fa-clipboard-check menu-item-icon"></i> Interest Posting Reports
|
||||
</button>
|
||||
<button mat-menu-item routerLink="/reports/fd-interest-posting" tabindex="0">
|
||||
<i class="fa fa-clipboard-check menu-item-icon"></i> FD Interest Posting Reports
|
||||
</button>
|
||||
<button mat-menu-item routerLink="/reports/interest-posting-summary" tabindex="0">
|
||||
<i class="fa fa-table menu-item-icon"></i> Interest Posting Summary (Branch-wise)
|
||||
</button>
|
||||
<button mat-menu-item routerLink="/reports/tds-interest" tabindex="0">
|
||||
<i class="fa fa-percent menu-item-icon"></i> Deposit Interest & TDS
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Compliance & Registers -->
|
||||
<div class="deposit-menu-group">
|
||||
<div class="deposit-group-title">Compliance & Registers</div>
|
||||
<button mat-menu-item routerLink="/reports/form-97-98" tabindex="0">
|
||||
<i class="fa fa-file-invoice menu-item-icon"></i> Form 97/98 Transaction Report
|
||||
</button>
|
||||
<button mat-menu-item routerLink="/reports/risk-review" tabindex="0">
|
||||
<i class="fa fa-user-shield menu-item-icon"></i> Risk Review Report
|
||||
</button>
|
||||
<button mat-menu-item routerLink="/reports/kyc-expiry" tabindex="0">
|
||||
<i class="fa fa-id-card menu-item-icon"></i> Re-KYC Expiry & Outreach
|
||||
</button>
|
||||
<button mat-menu-item routerLink="/reports/dormancy" tabindex="0">
|
||||
<i class="fa fa-hourglass-half menu-item-icon"></i> Inactive, Dormant & DEAF
|
||||
</button>
|
||||
<button mat-menu-item routerLink="/reports/sanctions-logs" tabindex="0">
|
||||
<i class="fa fa-shield-alt menu-item-icon"></i> Sanctions Screening & Alerts
|
||||
</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 — Share Capital
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</mat-menu>
|
||||
|
||||
<!-- Admin Mega Menu — 3-column rectangular panel grouping Setup,
|
||||
@@ -1060,121 +1077,146 @@
|
||||
<!-- Sub Menu Dropdowns -->
|
||||
<!-- Branch-level operations. Starts with the day register; other branch-wide controls belong
|
||||
here rather than under Cashier, which is one role's workspace. -->
|
||||
<mat-menu #branchOpsMenu="matMenu" [overlapTrigger]="false" class="nav-dropdown">
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/branch-ops/day-register']">
|
||||
<fa-icon icon="calendar-check" class="menu-item-icon"></fa-icon> Day Open / Day Close
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/branch-ops/missed-close']">
|
||||
<fa-icon icon="exclamation-triangle" class="menu-item-icon"></fa-icon> Missed Close Register
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/branch-ops/vault-position']">
|
||||
<fa-icon icon="lock" class="menu-item-icon"></fa-icon> Vault Position
|
||||
</button>
|
||||
<!-- The day book carries the Officer Verification Sheet — each person's credit, debit and net
|
||||
for the day. It was reachable only from the Clerk and Cashier menus, which is the one
|
||||
place a principal officer signing the day off does not look. -->
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/branch-ops/day-book']">
|
||||
<fa-icon icon="book" class="menu-item-icon"></fa-icon> Day Book & Verification
|
||||
</button>
|
||||
<!-- The signed sheet, as against the day book's working list: the day's modes, the drawer
|
||||
against the books, and what is still open. This is what goes in the file. -->
|
||||
<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
|
||||
</button>
|
||||
<mat-menu #branchOpsMenu="matMenu" class="branch-ops-mega-panel" [overlapTrigger]="false">
|
||||
<div class="deposit-menu-grid branch-ops-grid" (click)="$event.stopPropagation()">
|
||||
<div class="deposit-menu-group">
|
||||
<div class="deposit-group-title">Day Operations</div>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/branch-ops/day-register']">
|
||||
<fa-icon icon="calendar-check" class="menu-item-icon"></fa-icon> Day Open / Day Close
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/branch-ops/missed-close']">
|
||||
<fa-icon icon="exclamation-triangle" class="menu-item-icon"></fa-icon> Missed Close Register
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/branch-ops/vault-position']">
|
||||
<fa-icon icon="lock" class="menu-item-icon"></fa-icon> Vault Position
|
||||
</button>
|
||||
</div>
|
||||
<div class="deposit-menu-group">
|
||||
<div class="deposit-group-title">Verification & Reports</div>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/branch-ops/day-book']">
|
||||
<fa-icon icon="book" class="menu-item-icon"></fa-icon> Day Book & Verification
|
||||
</button>
|
||||
<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
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</mat-menu>
|
||||
|
||||
<!-- Clerk was a bare link straight into the fullscreen dashboard, which left the clerk's other
|
||||
screens reachable only from inside that fullscreen nav. Anything a clerk needs from the
|
||||
normal shell — an open voucher exception above all — belongs here. -->
|
||||
<mat-menu #clerkMenu="matMenu" [overlapTrigger]="false" class="nav-dropdown">
|
||||
<button mat-menu-item tabindex="0" routerLink="/clerk/dashboard" (click)="hideShellLayout = true">
|
||||
<fa-icon icon="id-card" class="menu-item-icon"></fa-icon> Clerk Dashboard
|
||||
</button>
|
||||
<!-- The clerk reads the day as a sheet to sign off, not as a working list of vouchers: the
|
||||
day's summary, the counter counted against the books, and what is still open. The day
|
||||
book's own row-by-row view stays reachable from Branch Ops and from the Cashier menu. -->
|
||||
<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>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/clerk/withdrawal-requests']">
|
||||
<fa-icon icon="money-bill-wave" class="menu-item-icon"></fa-icon> My Withdrawal Requests
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/clerk/my-disbursement-requests']">
|
||||
<fa-icon icon="exchange" class="menu-item-icon"></fa-icon> Disbursements & Transfer
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/clerk/dividend-dashboard']">
|
||||
<fa-icon icon="chart-pie" class="menu-item-icon"></fa-icon> Dividend Dashboard
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/clerk/my-work']">
|
||||
<fa-icon icon="user-check" class="menu-item-icon"></fa-icon> My Vouchers
|
||||
</button>
|
||||
<!-- Sits under My Vouchers because it answers the same question for the one worker who has no
|
||||
own list: the system. A nightly run belongs to nobody, so it appears on no person's page. -->
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/clerk/system-vouchers']">
|
||||
<fa-icon icon="robot" class="menu-item-icon"></fa-icon> System Vouchers
|
||||
</button>
|
||||
<!-- A clerk supervises the counter, so they need to see what each cashier is holding and what
|
||||
went through their drawer. Both screens already return every cashier for a non-cashier
|
||||
caller (CashierRoleHelper scopes only a cashier to themselves) — they were simply not
|
||||
reachable from this menu. -->
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/cashier-position']">
|
||||
<fa-icon icon="wallet" class="menu-item-icon"></fa-icon> Cashier Position
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/closing-report']">
|
||||
<fa-icon icon="file-invoice" class="menu-item-icon"></fa-icon> Closing Cash Report
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/clerk/received-report']">
|
||||
<fa-icon icon="receipt" class="menu-item-icon"></fa-icon> Received Vouchers
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/clerk/payment-report']">
|
||||
<fa-icon icon="receipt" class="menu-item-icon"></fa-icon> Payment Vouchers
|
||||
</button>
|
||||
<!-- Clerk Desk -->
|
||||
<mat-menu #clerkMenu="matMenu" class="clerk-mega-panel" [overlapTrigger]="false">
|
||||
<div class="deposit-menu-grid clerk-grid" (click)="$event.stopPropagation()">
|
||||
<!-- Clerk Desk -->
|
||||
<div class="deposit-menu-group">
|
||||
<div class="deposit-group-title">Clerk Desk</div>
|
||||
<button mat-menu-item tabindex="0" routerLink="/clerk/dashboard" (click)="hideShellLayout = true">
|
||||
<fa-icon icon="id-card" class="menu-item-icon"></fa-icon> Clerk Dashboard
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/clerk/withdrawal-requests']">
|
||||
<fa-icon icon="money-bill-wave" class="menu-item-icon"></fa-icon> My Withdrawal Requests
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/clerk/my-disbursement-requests']">
|
||||
<fa-icon icon="exchange" class="menu-item-icon"></fa-icon> Disbursements & Transfer
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/clerk/dividend-dashboard']">
|
||||
<fa-icon icon="chart-pie" class="menu-item-icon"></fa-icon> Dividend Dashboard
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Vouchers -->
|
||||
<div class="deposit-menu-group">
|
||||
<div class="deposit-group-title">Vouchers</div>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/clerk/my-work']">
|
||||
<fa-icon icon="user-check" class="menu-item-icon"></fa-icon> My Vouchers
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/clerk/system-vouchers']">
|
||||
<fa-icon icon="robot" class="menu-item-icon"></fa-icon> System Vouchers
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/clerk/received-report']">
|
||||
<fa-icon icon="receipt" class="menu-item-icon"></fa-icon> Received Vouchers
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/clerk/payment-report']">
|
||||
<fa-icon icon="receipt" class="menu-item-icon"></fa-icon> Payment Vouchers
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Counter & Reports -->
|
||||
<div class="deposit-menu-group">
|
||||
<div class="deposit-group-title">Counter & Reports</div>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/cashier-position']">
|
||||
<fa-icon icon="wallet" class="menu-item-icon"></fa-icon> Cashier Position
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/closing-report']">
|
||||
<fa-icon icon="file-invoice" class="menu-item-icon"></fa-icon> Closing Cash Report
|
||||
</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 #cashierMenu="matMenu" [overlapTrigger]="false" class="nav-dropdown">
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/cash-exchange']">
|
||||
<fa-icon icon="exchange" class="menu-item-icon"></fa-icon> Cash Exchange Entry
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/system/denomination-master']">
|
||||
<fa-icon icon="coins" class="menu-item-icon"></fa-icon> Cash Denomination
|
||||
</button>
|
||||
<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/exchange-detail']">
|
||||
<fa-icon icon="globe" class="menu-item-icon"></fa-icon> Currency Exchange Detail
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/cash-transfer']">
|
||||
<fa-icon icon="random" class="menu-item-icon"></fa-icon> Cash Transfer
|
||||
</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/cash-settlement']">
|
||||
<fa-icon icon="check-circle" class="menu-item-icon"></fa-icon> Cash Settlement
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/inter-cashier']">
|
||||
<fa-icon icon="exchange-alt" class="menu-item-icon"></fa-icon> Inter-Cashier Transfer
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/cashier-position']">
|
||||
<fa-icon icon="wallet" class="menu-item-icon"></fa-icon> Cashier Position
|
||||
</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>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/day-book']">
|
||||
<fa-icon icon="book" class="menu-item-icon"></fa-icon> Day Book
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/transaction-entry']">
|
||||
<fa-icon icon="keyboard" class="menu-item-icon"></fa-icon> Transaction Entry
|
||||
</button>
|
||||
<!-- Cashier Desk -->
|
||||
<mat-menu #cashierMenu="matMenu" class="cashier-mega-panel" [overlapTrigger]="false">
|
||||
<div class="deposit-menu-grid cashier-grid" (click)="$event.stopPropagation()">
|
||||
<!-- Cash Entries & Exchange -->
|
||||
<div class="deposit-menu-group">
|
||||
<div class="deposit-group-title">Cash & Counter</div>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/cash-exchange']">
|
||||
<fa-icon icon="exchange" class="menu-item-icon"></fa-icon> Cash Exchange Entry
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/exchange-detail']">
|
||||
<fa-icon icon="globe" class="menu-item-icon"></fa-icon> Currency Exchange Detail
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/transaction-entry']">
|
||||
<fa-icon icon="keyboard" class="menu-item-icon"></fa-icon> Transaction Entry
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/system/denomination-master']">
|
||||
<fa-icon icon="coins" class="menu-item-icon"></fa-icon> Cash Denomination
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Transfers & Settlement -->
|
||||
<div class="deposit-menu-group">
|
||||
<div class="deposit-group-title">Transfers & Settlement</div>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/cash-transfer']">
|
||||
<fa-icon icon="random" class="menu-item-icon"></fa-icon> Cash Transfer
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/inter-cashier']">
|
||||
<fa-icon icon="exchange-alt" class="menu-item-icon"></fa-icon> Inter-Cashier Transfer
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/cash-settlement']">
|
||||
<fa-icon icon="check-circle" class="menu-item-icon"></fa-icon> Cash Settlement
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/cashier-position']">
|
||||
<fa-icon icon="wallet" class="menu-item-icon"></fa-icon> Cashier Position
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/cashier/day-book']">
|
||||
<fa-icon icon="book" class="menu-item-icon"></fa-icon> Day Book
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Reports & Audit -->
|
||||
<div class="deposit-menu-group">
|
||||
<div class="deposit-group-title">Reports & 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 #depositsMenu="matMenu" class="deposits-mega-panel" [overlapTrigger]="false">
|
||||
<div class="deposit-menu-grid" (click)="$event.stopPropagation()">
|
||||
<div class="deposit-menu-grid deposits-grid" (click)="$event.stopPropagation()">
|
||||
<div class="deposit-menu-group">
|
||||
<div class="deposit-group-title">Accounts</div>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/accounts/savings']">
|
||||
@@ -1239,34 +1281,54 @@
|
||||
</div>
|
||||
</mat-menu>
|
||||
|
||||
<mat-menu #clearingMenu="matMenu" [overlapTrigger]="false" class="nav-dropdown">
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/ctsclearing/inward']">
|
||||
<fa-icon icon="arrow-left" class="menu-item-icon"></fa-icon> Inward Clearing (CTS)
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/ctsclearing/outward']">
|
||||
<fa-icon icon="arrow-right" class="menu-item-icon"></fa-icon> Outward Clearing (CTS)
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/ctsclearing/positive-pay']">
|
||||
<fa-icon icon="check-circle" class="menu-item-icon"></fa-icon> Positive Pay (PPS)
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/ctsclearing/settlement']">
|
||||
<fa-icon icon="check-circle" class="menu-item-icon"></fa-icon> Settlement
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/ctsclearing/reconciliation']">
|
||||
<fa-icon icon="check-circle" class="menu-item-icon"></fa-icon> Reconciliation
|
||||
</button>
|
||||
<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>
|
||||
<button mat-menu-item [routerLink]="['/sponsor-dd/inventory']" tabindex="0">
|
||||
<fa-icon icon="receipt" class="menu-item-icon"></fa-icon> Sponsor DD Inventory
|
||||
</button>
|
||||
<mat-menu #clearingMenu="matMenu" class="clearing-mega-panel" [overlapTrigger]="false">
|
||||
<div class="deposit-menu-grid clearing-grid" (click)="$event.stopPropagation()">
|
||||
<!-- CTS Clearing -->
|
||||
<div class="deposit-menu-group">
|
||||
<div class="deposit-group-title">CTS Clearing</div>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/ctsclearing/inward']">
|
||||
<fa-icon icon="arrow-left" class="menu-item-icon"></fa-icon> Inward Clearing (CTS)
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/ctsclearing/outward']">
|
||||
<fa-icon icon="arrow-right" class="menu-item-icon"></fa-icon> Outward Clearing (CTS)
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/ctsclearing/positive-pay']">
|
||||
<fa-icon icon="check-circle" class="menu-item-icon"></fa-icon> Positive Pay (PPS)
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Settlement & Recon -->
|
||||
<div class="deposit-menu-group">
|
||||
<div class="deposit-group-title">Settlement & Recon</div>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/ctsclearing/settlement']">
|
||||
<fa-icon icon="check-circle" class="menu-item-icon"></fa-icon> Settlement
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" [routerLink]="['/ctsclearing/reconciliation']">
|
||||
<fa-icon icon="check-circle" class="menu-item-icon"></fa-icon> Reconciliation
|
||||
</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 & 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 #hrmMenu="matMenu" class="hrm-mega-panel" [overlapTrigger]="false">
|
||||
<div class="deposit-menu-grid" (click)="$event.stopPropagation()">
|
||||
<div class="deposit-menu-grid hrm-grid" (click)="$event.stopPropagation()">
|
||||
<!-- Payroll -->
|
||||
<div class="deposit-menu-group">
|
||||
<div class="deposit-group-title">Payroll</div>
|
||||
@@ -1573,23 +1635,33 @@
|
||||
</div>
|
||||
</mat-menu>
|
||||
|
||||
<mat-menu #ckycMenu="matMenu" [overlapTrigger]="false" class="nav-dropdown">
|
||||
<button mat-menu-item routerLink="/ckyc" tabindex="0">
|
||||
<fa-icon icon="id-card" class="menu-item-icon"></fa-icon> CKYC Management
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" (click)="openCkycReportsDialog('REKYC')">
|
||||
<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>
|
||||
<mat-divider></mat-divider>
|
||||
<button mat-menu-item tabindex="0">
|
||||
<fa-icon icon="database" class="menu-item-icon" style="color: #be185d"></fa-icon> Dump KYC & Loan Data
|
||||
</button>
|
||||
<mat-menu #ckycMenu="matMenu" class="ckyc-mega-panel" [overlapTrigger]="false">
|
||||
<div class="deposit-menu-grid ckyc-grid" (click)="$event.stopPropagation()">
|
||||
<!-- KYC Operations -->
|
||||
<div class="deposit-menu-group">
|
||||
<div class="deposit-group-title">KYC Operations</div>
|
||||
<button mat-menu-item routerLink="/ckyc" tabindex="0">
|
||||
<fa-icon icon="id-card" class="menu-item-icon"></fa-icon> CKYC Management
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0">
|
||||
<fa-icon icon="database" class="menu-item-icon" style="color: #be185d"></fa-icon> Dump KYC & Loan Data
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Reports & Screening -->
|
||||
<div class="deposit-menu-group">
|
||||
<div class="deposit-group-title">Reports & Screening</div>
|
||||
<button mat-menu-item tabindex="0" (click)="openCkycReportsDialog('REKYC')">
|
||||
<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>
|
||||
|
||||
<!-- CFCFRMS — single landing page (CfcfrmsShell) hosts the full
|
||||
@@ -1607,11 +1679,11 @@
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" routerLink="/reconciliation/sundry-dr-cr">
|
||||
<fa-icon icon="random" class="menu-item-icon" style="color: #0d9488"></fa-icon>
|
||||
Sundry Dr / Cr Reconciliation
|
||||
Sundry Dr / Cr
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" routerLink="/reconciliation/pnl-impact">
|
||||
<fa-icon icon="chart-line" class="menu-item-icon" style="color: #0d9488"></fa-icon>
|
||||
P&L Impact Reconciliation
|
||||
P&L Impact
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" routerLink="/reconciliation/gl-reconciliation">
|
||||
<fa-icon icon="book-open" class="menu-item-icon" style="color: #0d9488"></fa-icon>
|
||||
@@ -1619,11 +1691,11 @@
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" routerLink="/reconciliation/fixed-assets">
|
||||
<fa-icon icon="cube" class="menu-item-icon" style="color: #0d9488"></fa-icon>
|
||||
Fixed Assets Reconciliation
|
||||
Fixed Assets
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" routerLink="/reconciliation/inter-company">
|
||||
<fa-icon icon="sitemap" class="menu-item-icon" style="color: #0d9488"></fa-icon>
|
||||
Inter-Company Reconciliation
|
||||
Inter-Company
|
||||
</button>
|
||||
</div>
|
||||
|
||||
@@ -1636,15 +1708,15 @@
|
||||
</button>
|
||||
<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>
|
||||
API Based Bank Reconciliation
|
||||
API Bank Reco
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" routerLink="/reconciliation/neft-rtgs">
|
||||
<fa-icon icon="exchange" class="menu-item-icon" style="color: #0d9488"></fa-icon>
|
||||
NEFT / RTGS Reconciliation
|
||||
NEFT / RTGS Reco
|
||||
</button>
|
||||
<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>
|
||||
Clearing Reconciliation
|
||||
Clearing Reco
|
||||
</button>
|
||||
</div>
|
||||
|
||||
@@ -1657,11 +1729,11 @@
|
||||
</button>
|
||||
<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>
|
||||
Three-way Digital Reconciliation
|
||||
Three-way Digital
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" routerLink="/reconciliation/nach-reco">
|
||||
<fa-icon icon="sync-alt" class="menu-item-icon" style="color: #0d9488"></fa-icon>
|
||||
NACH Reconciliation
|
||||
NACH Reco
|
||||
</button>
|
||||
</div>
|
||||
|
||||
@@ -1670,11 +1742,11 @@
|
||||
<div class="deposit-group-title">Instruments & Members</div>
|
||||
<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>
|
||||
DD / Pay Order Reconciliation
|
||||
DD / Pay Order
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0" routerLink="/reconciliation/share-member">
|
||||
<fa-icon icon="coins" class="menu-item-icon" style="color: #0d9488"></fa-icon>
|
||||
Share Member Reconciliation
|
||||
Share Member
|
||||
</button>
|
||||
</div>
|
||||
|
||||
@@ -1850,46 +1922,68 @@
|
||||
</div>
|
||||
</mat-menu>
|
||||
|
||||
<mat-menu #insuranceMenu="matMenu" [overlapTrigger]="false" class="nav-dropdown">
|
||||
<button mat-menu-item routerLink="/dicgc" tabindex="0">
|
||||
<fa-icon icon="building" class="menu-item-icon" style="color: #c2410c"></fa-icon> DICGC
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0"><fa-icon icon="heart" class="menu-item-icon"></fa-icon> PMJBY</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">
|
||||
<fa-icon icon="hand-holding-heart" class="menu-item-icon"></fa-icon> Indemnity
|
||||
</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>
|
||||
<button mat-menu-item tabindex="0">
|
||||
<fa-icon icon="file-invoice" class="menu-item-icon"></fa-icon> Loan Insurance
|
||||
</button>
|
||||
<mat-menu #insuranceMenu="matMenu" class="insurance-mega-panel" [overlapTrigger]="false">
|
||||
<div class="deposit-menu-grid insurance-grid" (click)="$event.stopPropagation()">
|
||||
<!-- Social & Policy Schemes -->
|
||||
<div class="deposit-menu-group">
|
||||
<div class="deposit-group-title">Schemes & Social</div>
|
||||
<button mat-menu-item routerLink="/dicgc" tabindex="0">
|
||||
<fa-icon icon="building" class="menu-item-icon" style="color: #c2410c"></fa-icon> DICGC
|
||||
</button>
|
||||
<button mat-menu-item tabindex="0"><fa-icon icon="heart" class="menu-item-icon"></fa-icon> PMJBY</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">
|
||||
<fa-icon icon="hand-holding-heart" class="menu-item-icon"></fa-icon> Indemnity
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Institutional & Loans -->
|
||||
<div class="deposit-menu-group">
|
||||
<div class="deposit-group-title">Institutional & Loans</div>
|
||||
<button mat-menu-item tabindex="0">
|
||||
<fa-icon icon="file-invoice" class="menu-item-icon"></fa-icon> Loan Insurance
|
||||
</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 #digitalMenu="matMenu" [overlapTrigger]="false" class="nav-dropdown">
|
||||
<button mat-menu-item routerLink="/digital/neft-rtgs-report" tabindex="0">
|
||||
<fa-icon icon="exchange" class="menu-item-icon"></fa-icon> NEFT / RTGS
|
||||
</button>
|
||||
<button mat-menu-item routerLink="/digital/imps-report" tabindex="0">
|
||||
<fa-icon icon="bolt" class="menu-item-icon"></fa-icon> IMPS
|
||||
</button>
|
||||
<button mat-menu-item routerLink="/digital/upi-report" tabindex="0">
|
||||
<fa-icon icon="mobile-alt" class="menu-item-icon"></fa-icon> UPI Reports
|
||||
</button>
|
||||
<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>
|
||||
<mat-menu #digitalMenu="matMenu" class="digital-mega-panel" [overlapTrigger]="false">
|
||||
<div class="deposit-menu-grid digital-grid" (click)="$event.stopPropagation()">
|
||||
<!-- Payment Systems -->
|
||||
<div class="deposit-menu-group">
|
||||
<div class="deposit-group-title">Payments</div>
|
||||
<button mat-menu-item routerLink="/digital/neft-rtgs-report" tabindex="0">
|
||||
<fa-icon icon="exchange" class="menu-item-icon"></fa-icon> NEFT / RTGS
|
||||
</button>
|
||||
<button mat-menu-item routerLink="/digital/imps-report" tabindex="0">
|
||||
<fa-icon icon="bolt" class="menu-item-icon"></fa-icon> IMPS
|
||||
</button>
|
||||
<button mat-menu-item routerLink="/digital/upi-report" tabindex="0">
|
||||
<fa-icon icon="mobile-alt" class="menu-item-icon"></fa-icon> UPI Reports
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Cards & Mandates -->
|
||||
<div class="deposit-menu-group">
|
||||
<div class="deposit-group-title">Cards & 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>
|
||||
|
||||
<!-- RBI Mega Menu -->
|
||||
|
||||
@@ -266,7 +266,7 @@ $color: #e2e4ec;
|
||||
max-width: 100%;
|
||||
overflow-x: hidden;
|
||||
box-sizing: border-box;
|
||||
padding: 16px 28px;
|
||||
padding: 10px 18px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -282,21 +282,15 @@ $gray-700: #334155;
|
||||
/* ============================================================
|
||||
Main header (top 2-row navigation)
|
||||
--------------------------------------------------------------
|
||||
Redesigned 2026 — clean, modern enterprise SaaS feel:
|
||||
• Both rows live on the same white surface separated only by a
|
||||
hairline; r2 has a barely-there blue-50 wash so frequent vs
|
||||
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.
|
||||
Compact, modern enterprise SaaS navigation:
|
||||
• Height reduced to 32px per row (64px total) to save screen space.
|
||||
• Smooth horizontal scrolling prevents menu items from getting cut off.
|
||||
• Compact typography, icons and paddings fit all banking modules cleanly.
|
||||
============================================================ */
|
||||
.main-header {
|
||||
background: #fff;
|
||||
border-bottom: 2.5px solid $brand;
|
||||
box-shadow: 0 1px 4px rgb(0 0 0 / 7%);
|
||||
border-bottom: 2px solid $brand;
|
||||
box-shadow: 0 1px 3px rgb(0 0 0 / 6%);
|
||||
position: sticky;
|
||||
|
||||
/* Sit directly under the sticky toolbar (32px tall) so both stay visible. */
|
||||
@@ -306,19 +300,19 @@ $gray-700: #334155;
|
||||
}
|
||||
|
||||
.nav-row {
|
||||
height: 44px;
|
||||
height: 32px;
|
||||
display: flex;
|
||||
align-items: stretch;
|
||||
overflow: visible;
|
||||
overflow: auto visible;
|
||||
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;
|
||||
background: #fff;
|
||||
scrollbar-width: none;
|
||||
-ms-overflow-style: none;
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.r2.nav-row {
|
||||
@@ -334,25 +328,17 @@ $gray-700: #334155;
|
||||
background: #f8fafc;
|
||||
}
|
||||
|
||||
// ===== Nav Item — modern tab style =====
|
||||
// Typography spec — same family / size / weight / color for BOTH rows.
|
||||
// ===== Nav Item — compact modern tab style =====
|
||||
.ni {
|
||||
position: relative;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 7px;
|
||||
gap: 2.5px;
|
||||
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;
|
||||
min-width: max-content;
|
||||
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. */
|
||||
min-width: 0;
|
||||
padding: 0 4px;
|
||||
border-right: 1px solid $gray-200;
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
@@ -360,11 +346,11 @@ $gray-700: #334155;
|
||||
'IBM Plex Sans',
|
||||
-apple-system,
|
||||
sans-serif;
|
||||
font-size: 12px;
|
||||
font-size: 10px;
|
||||
font-weight: 500;
|
||||
color: #0a1a2e;
|
||||
line-height: 1.3;
|
||||
letter-spacing: 0.01em;
|
||||
line-height: 1.2;
|
||||
letter-spacing: -0.015em;
|
||||
text-decoration: none;
|
||||
user-select: none;
|
||||
transition:
|
||||
@@ -373,17 +359,15 @@ $gray-700: #334155;
|
||||
box-shadow 0.15s ease;
|
||||
border-radius: 0;
|
||||
|
||||
/* 3px accent strip that fills on hover / active (uses ::before so we
|
||||
don't reflow the row when toggling). */
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 4px;
|
||||
right: 4px;
|
||||
left: 2px;
|
||||
right: 2px;
|
||||
top: 0;
|
||||
height: 3px;
|
||||
height: 2px;
|
||||
background: transparent;
|
||||
border-radius: 0 0 3px 3px;
|
||||
border-radius: 0 0 2px 2px;
|
||||
transition: background 0.15s ease;
|
||||
}
|
||||
|
||||
@@ -410,17 +394,19 @@ $gray-700: #334155;
|
||||
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 {
|
||||
border-right: none;
|
||||
}
|
||||
|
||||
.ni-short {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.ni-ico {
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
font-size: 12px;
|
||||
width: 9.5px;
|
||||
height: 9.5px;
|
||||
font-size: 9.5px;
|
||||
color: $gray-500;
|
||||
flex-shrink: 0;
|
||||
transition: color 0.15s ease;
|
||||
@@ -432,11 +418,12 @@ $gray-700: #334155;
|
||||
}
|
||||
|
||||
.ni-caret {
|
||||
width: 7px;
|
||||
height: 7px;
|
||||
font-size: 7px;
|
||||
width: 5px;
|
||||
height: 5px;
|
||||
font-size: 5px;
|
||||
color: $gray-400;
|
||||
flex-shrink: 0;
|
||||
margin-left: 0.5px;
|
||||
transition:
|
||||
transform 0.18s ease,
|
||||
color 0.18s ease;
|
||||
@@ -447,17 +434,89 @@ $gray-700: #334155;
|
||||
}
|
||||
}
|
||||
|
||||
@media (width <= 1200px) {
|
||||
@media (width >= 1400px) {
|
||||
.ni {
|
||||
padding: 0 8px;
|
||||
gap: 5px;
|
||||
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 <= 980px) {
|
||||
@media (width <= 1200px) {
|
||||
.ni {
|
||||
padding: 0 3px;
|
||||
gap: 2px;
|
||||
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) {
|
||||
.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;
|
||||
gap: 4px;
|
||||
gap: 3px;
|
||||
font-size: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -699,21 +758,29 @@ $gray-700: #334155;
|
||||
|
||||
// ===== Nav Dropdown Menus =====
|
||||
::ng-deep .nav-dropdown {
|
||||
border-radius: 8px !important;
|
||||
border-radius: 6px !important;
|
||||
border: 1px solid $gray-200 !important;
|
||||
box-shadow: 0 6px 24px rgb(0 0 0 / 10%) !important;
|
||||
min-width: 180px !important;
|
||||
padding: 4px 0 !important;
|
||||
margin-top: 2px !important;
|
||||
box-shadow: 0 4px 16px rgb(0 0 0 / 12%) !important;
|
||||
min-width: 170px !important;
|
||||
padding: 3px 0 !important;
|
||||
margin-top: 1px !important;
|
||||
|
||||
.mat-mdc-menu-item {
|
||||
font-size: 12.5px !important;
|
||||
font-size: 10.5px !important;
|
||||
font-weight: 500 !important;
|
||||
height: 34px !important;
|
||||
min-height: 34px !important;
|
||||
padding: 0 14px !important;
|
||||
height: 25px !important;
|
||||
min-height: 25px !important;
|
||||
padding: 0 6px !important;
|
||||
line-height: 25px !important;
|
||||
color: $gray-700 !important;
|
||||
font-family: 'DM Sans', Roboto, sans-serif !important;
|
||||
font-family: 'IBM Plex 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 {
|
||||
background: $brand-hover !important;
|
||||
@@ -728,39 +795,44 @@ $gray-700: #334155;
|
||||
}
|
||||
|
||||
/* Deposits Mega Panel (inside mat-menu overlay) */
|
||||
.deposit-menu-grid {
|
||||
::ng-deep .deposit-menu-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: 8px 24px;
|
||||
padding: 8px 12px;
|
||||
min-width: 600px;
|
||||
gap: 4px 12px;
|
||||
padding: 6px 10px;
|
||||
min-width: 0;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.deposit-menu-group {
|
||||
::ng-deep .deposit-menu-group {
|
||||
.deposit-group-title {
|
||||
font-weight: 700;
|
||||
font-size: 11px;
|
||||
font-size: 9.5px;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.6px;
|
||||
letter-spacing: 0.5px;
|
||||
color: #1074b9;
|
||||
padding: 4px 16px 6px;
|
||||
padding: 2px 6px 3px;
|
||||
margin-bottom: 2px;
|
||||
border-bottom: 2px solid #1074b9;
|
||||
border-bottom: 1.5px solid #1074b9;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
/* NPA Mega Panel — 4 columns (Reports / Analysis / Classification / Recovery Management) */
|
||||
.npa-grid {
|
||||
grid-template-columns: repeat(4, minmax(200px, 1fr));
|
||||
min-width: 880px;
|
||||
max-width: 96vw;
|
||||
/* NPA Mega Panel — 3 columns */
|
||||
::ng-deep .npa-grid {
|
||||
grid-template-columns: repeat(3, minmax(210px, 1fr));
|
||||
min-width: 0;
|
||||
max-width: 100%;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
/* Reconciliation Mega Panel — 5 columns, teal accent to match the icon palette */
|
||||
.reconciliation-grid {
|
||||
grid-template-columns: repeat(5, minmax(190px, 1fr));
|
||||
min-width: 1040px;
|
||||
max-width: 96vw;
|
||||
/* Reconciliation Mega Panel — 5 columns */
|
||||
::ng-deep .reconciliation-grid {
|
||||
grid-template-columns: repeat(5, minmax(170px, 1fr));
|
||||
min-width: 0;
|
||||
max-width: 100%;
|
||||
overflow-x: hidden;
|
||||
|
||||
.deposit-group-title {
|
||||
color: #0d9488;
|
||||
@@ -780,47 +852,49 @@ $gray-700: #334155;
|
||||
|
||||
.gl-mega-menu {
|
||||
position: absolute;
|
||||
top: 100px;
|
||||
top: 96px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
background: #fff;
|
||||
width: 860px;
|
||||
max-width: 95vw;
|
||||
padding: 20px 24px;
|
||||
box-shadow: 0 6px 24px rgb(0 0 0 / 22%);
|
||||
border-radius: 0 0 10px 10px;
|
||||
width: 760px;
|
||||
max-width: 94vw;
|
||||
max-height: 72vh;
|
||||
overflow-y: auto;
|
||||
padding: 12px 16px;
|
||||
box-shadow: 0 6px 20px rgb(0 0 0 / 18%);
|
||||
border-radius: 0 0 8px 8px;
|
||||
z-index: 1000;
|
||||
border-top: 3px solid #0d47a1;
|
||||
border-top: 2.5px solid #0d47a1;
|
||||
}
|
||||
|
||||
.gl-mega-menu-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
margin-bottom: 14px;
|
||||
padding-bottom: 12px;
|
||||
gap: 8px;
|
||||
margin-bottom: 8px;
|
||||
padding-bottom: 6px;
|
||||
border-bottom: 1px solid #e5e7eb;
|
||||
|
||||
span {
|
||||
font-size: 18px;
|
||||
font-size: 14px;
|
||||
font-weight: 700;
|
||||
color: #0d47a1;
|
||||
letter-spacing: 0.02em;
|
||||
letter-spacing: 0.01em;
|
||||
}
|
||||
}
|
||||
|
||||
.gl-mega-menu-header-icon {
|
||||
font-size: 18px;
|
||||
font-size: 14px;
|
||||
color: #0d47a1;
|
||||
}
|
||||
|
||||
.gl-search {
|
||||
width: 100%;
|
||||
padding: 10px 14px;
|
||||
margin-bottom: 16px;
|
||||
padding: 6px 10px;
|
||||
margin-bottom: 10px;
|
||||
border: 1px solid #d0d5dd;
|
||||
border-radius: 6px;
|
||||
font-size: 14px;
|
||||
border-radius: 5px;
|
||||
font-size: 12px;
|
||||
box-sizing: border-box;
|
||||
background: #f9fafb;
|
||||
|
||||
@@ -828,36 +902,37 @@ $gray-700: #334155;
|
||||
outline: none;
|
||||
border-color: #0d47a1;
|
||||
background: #fff;
|
||||
box-shadow: 0 0 0 3px rgb(13 71 161 / 10%);
|
||||
box-shadow: 0 0 0 2px rgb(13 71 161 / 10%);
|
||||
}
|
||||
}
|
||||
|
||||
.gl-columns {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
gap: 24px;
|
||||
gap: 10px 16px;
|
||||
}
|
||||
|
||||
.gl-group-title {
|
||||
font-weight: 700;
|
||||
font-size: 11px;
|
||||
font-size: 10px;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.8px;
|
||||
letter-spacing: 0.6px;
|
||||
color: #0d47a1;
|
||||
margin-bottom: 10px;
|
||||
padding-bottom: 6px;
|
||||
border-bottom: 2px solid #0d47a1;
|
||||
margin-bottom: 5px;
|
||||
padding-bottom: 3px;
|
||||
border-bottom: 1.5px solid #0d47a1;
|
||||
}
|
||||
|
||||
.gl-link {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 7px 6px;
|
||||
padding: 3.5px 5px;
|
||||
text-decoration: none;
|
||||
color: #344054;
|
||||
font-size: 13px;
|
||||
font-size: 11.5px;
|
||||
line-height: 1.3;
|
||||
cursor: pointer;
|
||||
border-radius: 5px;
|
||||
border-radius: 4px;
|
||||
transition:
|
||||
background 0.15s,
|
||||
color 0.15s;
|
||||
@@ -873,23 +948,21 @@ $gray-700: #334155;
|
||||
}
|
||||
|
||||
.gl-icon {
|
||||
width: 18px;
|
||||
margin-right: 8px;
|
||||
width: 14px;
|
||||
margin-right: 5px;
|
||||
color: #667085;
|
||||
font-size: 13px;
|
||||
font-size: 11px;
|
||||
flex-shrink: 0;
|
||||
|
||||
.gl-link:hover & {
|
||||
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 {
|
||||
content: '';
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
width: 5px;
|
||||
height: 5px;
|
||||
margin-left: auto;
|
||||
flex-shrink: 0;
|
||||
border-radius: 50%;
|
||||
@@ -899,9 +972,9 @@ $gray-700: #334155;
|
||||
|
||||
/* RBI Mega Menu */
|
||||
.rbi-mega-menu {
|
||||
width: 1100px;
|
||||
max-width: 97vw;
|
||||
max-height: 80vh;
|
||||
width: 880px;
|
||||
max-width: 94vw;
|
||||
max-height: 72vh;
|
||||
overflow-y: auto;
|
||||
border-top-color: #b71c1c;
|
||||
}
|
||||
@@ -909,7 +982,7 @@ $gray-700: #334155;
|
||||
.rbi-columns {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
gap: 20px;
|
||||
gap: 10px 16px;
|
||||
}
|
||||
|
||||
@keyframes move {
|
||||
|
||||
@@ -20,7 +20,9 @@
|
||||
<div class="t-live"></div>
|
||||
LIVE
|
||||
</div>
|
||||
<div class="t-chip">Branch: <strong>{{ officeLabel }}</strong></div>
|
||||
<div class="t-chip">
|
||||
Branch: <strong>{{ officeLabel }}</strong>
|
||||
</div>
|
||||
<div class="t-chip">
|
||||
Date: <strong>{{ today | date: 'dd MMM yyyy' }}</strong>
|
||||
</div>
|
||||
@@ -522,7 +524,7 @@
|
||||
</mat-menu>
|
||||
|
||||
<!-- Application User Help Menu -->
|
||||
<mat-menu #applicationMenu="matMenu" [overlapTrigger]="false">
|
||||
<mat-menu #applicationMenu="matMenu" [overlapTrigger]="false" class="t-user-menu" xPosition="before">
|
||||
<button mat-menu-item (click)="help()" tabindex="0">
|
||||
<mat-icon matListIcon>
|
||||
<fa-icon icon="question-circle" size="sm"></fa-icon>
|
||||
|
||||
@@ -390,6 +390,103 @@ $icon-hover-border: rgb(255 255 255 / 28%);
|
||||
max-height: 80vh;
|
||||
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 {
|
||||
@@ -488,70 +585,101 @@ $icon-hover-border: rgb(255 255 255 / 28%);
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
// Compact card per AI module
|
||||
.ai-card.mat-mdc-menu-item {
|
||||
display: flex !important;
|
||||
align-items: flex-start;
|
||||
gap: 10px;
|
||||
padding: 9px 10px;
|
||||
min-height: 0;
|
||||
height: auto;
|
||||
border-radius: 9px;
|
||||
font-family: inherit;
|
||||
line-height: 1.3;
|
||||
white-space: normal;
|
||||
transition: background 0.16s ease;
|
||||
// ===== User Account Dropdown Menu =====
|
||||
::ng-deep .t-user-menu.mat-mdc-menu-panel {
|
||||
min-width: 190px !important;
|
||||
border-radius: 10px !important;
|
||||
box-shadow:
|
||||
0 10px 25px rgb(15 23 42 / 12%),
|
||||
0 2px 6px rgb(15 23 42 / 6%) !important;
|
||||
border: 1px solid #e2e8f0 !important;
|
||||
padding: 6px 0 !important;
|
||||
background: #fff !important;
|
||||
|
||||
.ai-card-ic {
|
||||
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);
|
||||
.mat-mdc-menu-content {
|
||||
padding: 4px 0 !important;
|
||||
}
|
||||
|
||||
.mat-mdc-menu-item {
|
||||
height: 38px !important;
|
||||
min-height: 38px !important;
|
||||
line-height: 38px !important;
|
||||
padding: 0 14px !important;
|
||||
display: flex !important;
|
||||
align-items: center !important;
|
||||
font-size: 13px !important;
|
||||
font-weight: 500 !important;
|
||||
color: #334155 !important;
|
||||
transition:
|
||||
background 0.16s ease,
|
||||
color 0.16s ease,
|
||||
transform 0.16s ease;
|
||||
}
|
||||
background-color 0.15s ease,
|
||||
color 0.15s ease !important;
|
||||
|
||||
.ai-card-body {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.ai-card-t {
|
||||
font-size: 12.5px;
|
||||
font-weight: 600;
|
||||
color: #0f172a;
|
||||
line-height: 1.25;
|
||||
}
|
||||
|
||||
.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-mdc-menu-item-text {
|
||||
display: inline-flex !important;
|
||||
align-items: center !important;
|
||||
width: 100% !important;
|
||||
font-size: 13px !important;
|
||||
color: inherit !important;
|
||||
font-weight: 500 !important;
|
||||
}
|
||||
|
||||
.ai-card-t {
|
||||
color: var(--c-color);
|
||||
mat-icon {
|
||||
margin-right: 10px !important;
|
||||
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;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,646 @@
|
||||
<!--
|
||||
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 → 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>
|
||||
· {{ d.officeName }} · {{ d.postingDate }} · {{ d.accountCount }} deposit(s) ·
|
||||
₹{{ 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">₹{{ dueTotal | number: '1.2-2' }}</div>
|
||||
<div class="fd-stat__sub">{{ dueAccountTotal }} deposit(s) · {{ 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">₹{{ awaitingTotal | number: '1.2-2' }}</div>
|
||||
<div class="fd-stat__sub">{{ awaitingReports.length }} report(s) · blocking day close</div>
|
||||
</div>
|
||||
<div class="fd-stat fd-stat--ok">
|
||||
<div class="fd-stat__label">Approved — posts at close</div>
|
||||
<div class="fd-stat__value">₹{{ 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">₹{{ 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 — earned up to {{ previewAsOf }}</h3>
|
||||
<div class="muted">
|
||||
What each deposit would be paid if interest were posted today. View only — nothing is saved, approved
|
||||
or posted.
|
||||
</div>
|
||||
</div>
|
||||
<div class="fd-total">
|
||||
<span>Total so far</span>
|
||||
<strong>₹{{ 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…</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">₹{{ 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 || '—' }} → {{ r.interestPostingDate }}</td>
|
||||
<td class="num">₹{{ 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">₹{{ r.interest | number: '1.2-2' }}</td>
|
||||
</tr>
|
||||
}
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<td colspan="8"><strong>Total</strong></td>
|
||||
<td class="num">
|
||||
<strong>₹{{ 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 — 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>₹{{ 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…</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">₹{{ 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">₹{{ 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>₹{{ 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>₹{{ 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…</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">₹{{ row.posted | number: '1.2-2' }}</td>
|
||||
<td class="num">₹{{ row.pending | number: '1.2-2' }}</td>
|
||||
<td class="num">₹{{ row.maturityPosted | number: '1.2-2' }}</td>
|
||||
<td class="num">
|
||||
<strong>₹{{ 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>₹{{ productSummaryGrandTotal.posted | number: '1.2-2' }}</strong>
|
||||
</td>
|
||||
<td class="num">
|
||||
<strong>₹{{ productSummaryGrandTotal.pending | number: '1.2-2' }}</strong>
|
||||
</td>
|
||||
<td class="num">
|
||||
<strong>₹{{ productSummaryGrandTotal.maturityPosted | number: '1.2-2' }}</strong>
|
||||
</td>
|
||||
<td class="num">
|
||||
<strong>₹{{ 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">₹{{ 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' }} · {{ 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 {
|
||||
—
|
||||
}
|
||||
</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…
|
||||
} @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 }} · {{ selected.productName }} — {{ 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 → Cr {{ selected.payableGlCode }} {{ selected.payableGlName }}; Dr
|
||||
{{ selected.payableGlCode }} → Cr {{ selected.paidGlCode }} {{ selected.paidGlName }}; then Dr
|
||||
{{ selected.paidGlCode }} → Cr each deposit below
|
||||
</div>
|
||||
</div>
|
||||
<div class="fd-total">
|
||||
<span>Total interest</span>
|
||||
<strong>₹{{ 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 || '—' }} → {{ l.interestPostingDate }}</td>
|
||||
<td class="num">₹{{ 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">₹{{ l.interestAmount | number: '1.2-2' }}</td>
|
||||
<td class="num">₹{{ l.balanceBefore | number: '1.2-2' }}</td>
|
||||
<td class="num">₹{{ 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>₹{{ selected.totalInterest | number: '1.2-2' }}</strong>
|
||||
</td>
|
||||
<td colspan="4"></td>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
@@ -0,0 +1,559 @@
|
||||
/**
|
||||
* 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;
|
||||
}
|
||||
@@ -0,0 +1,686 @@
|
||||
/**
|
||||
* 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
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,280 @@
|
||||
/**
|
||||
* 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 });
|
||||
}
|
||||
}
|
||||
@@ -15,43 +15,43 @@ $gray-900: #0f172a;
|
||||
|
||||
// ── Container ──
|
||||
.pd-container {
|
||||
max-width: 1100px;
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
padding: 24px 20px;
|
||||
padding: 12px 16px;
|
||||
}
|
||||
|
||||
// ── Page Header ──
|
||||
.pd-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
margin-bottom: 28px;
|
||||
gap: 10px;
|
||||
margin-bottom: 14px;
|
||||
|
||||
&__icon {
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
border-radius: 10px;
|
||||
width: 34px;
|
||||
height: 34px;
|
||||
border-radius: 7px;
|
||||
background: linear-gradient(135deg, #0d3d78, #1a5276);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #fff;
|
||||
font-size: 18px;
|
||||
font-size: 14px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
&__title {
|
||||
font-size: 20px;
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
color: $gray-900;
|
||||
margin: 0;
|
||||
letter-spacing: -0.3px;
|
||||
letter-spacing: -0.2px;
|
||||
}
|
||||
|
||||
&__sub {
|
||||
font-size: 13px;
|
||||
font-size: 11.5px;
|
||||
color: $gray-500;
|
||||
margin: 2px 0 0;
|
||||
margin: 1px 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -59,7 +59,7 @@ $gray-900: #0f172a;
|
||||
.pd-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
gap: 12px;
|
||||
gap: 8px;
|
||||
|
||||
@media (width <= 768px) {
|
||||
grid-template-columns: 1fr;
|
||||
@@ -70,11 +70,11 @@ $gray-900: #0f172a;
|
||||
.pd-card {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 14px;
|
||||
padding: 14px 16px;
|
||||
gap: 10px;
|
||||
padding: 8px 12px;
|
||||
background: #fff;
|
||||
border: 1px solid $border;
|
||||
border-radius: 10px;
|
||||
border-radius: 7px;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
transition: all 0.15s ease;
|
||||
@@ -82,7 +82,7 @@ $gray-900: #0f172a;
|
||||
&:hover {
|
||||
border-color: #cbd5e1;
|
||||
background: $gray-50;
|
||||
box-shadow: 0 2px 8px rgb(0 0 0 / 4%);
|
||||
box-shadow: 0 1px 6px rgb(0 0 0 / 4%);
|
||||
|
||||
.pd-card__arrow {
|
||||
color: $gray-700;
|
||||
@@ -91,13 +91,13 @@ $gray-900: #0f172a;
|
||||
}
|
||||
|
||||
&__icon {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 9px;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
border-radius: 6px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 15px;
|
||||
font-size: 12.5px;
|
||||
flex-shrink: 0;
|
||||
|
||||
&--blue {
|
||||
@@ -167,25 +167,25 @@ $gray-900: #0f172a;
|
||||
}
|
||||
|
||||
&__title {
|
||||
font-size: 13.5px;
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
color: $gray-900;
|
||||
margin: 0;
|
||||
line-height: 1.3;
|
||||
line-height: 1.25;
|
||||
}
|
||||
|
||||
&__desc {
|
||||
font-size: 11.5px;
|
||||
font-size: 10.5px;
|
||||
color: $gray-400;
|
||||
margin: 3px 0 0;
|
||||
line-height: 1.35;
|
||||
margin: 1px 0 0;
|
||||
line-height: 1.3;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
&__arrow {
|
||||
font-size: 11px;
|
||||
font-size: 10px;
|
||||
color: #cbd5e1;
|
||||
flex-shrink: 0;
|
||||
transition: all 0.15s ease;
|
||||
|
||||
@@ -92,6 +92,14 @@ const routes: Routes = [
|
||||
(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',
|
||||
data: { title: 'Inactive, Dormant & DEAF', breadcrumb: 'Inactive, Dormant & DEAF' },
|
||||
|
||||
@@ -0,0 +1,80 @@
|
||||
<!--
|
||||
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>
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,349 @@
|
||||
/**
|
||||
* 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);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,168 @@
|
||||
/**
|
||||
* 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;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,61 @@
|
||||
/**
|
||||
* 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 });
|
||||
}
|
||||
}
|
||||
@@ -30,6 +30,7 @@ import { SearchToolComponent } from './search-tool/search-tool.component';
|
||||
import { KeyboardShortcutsDialogComponent } from './keyboard-shortcuts-dialog/keyboard-shortcuts-dialog.component';
|
||||
import { ServerSelectorComponent } from './server-selector/server-selector.component';
|
||||
import { TenantSelectorComponent } from './tenant-selector/tenant-selector.component';
|
||||
import { LoadingScreenComponent } from './loading-screen/loading-screen.component';
|
||||
|
||||
/** Custom Modules */
|
||||
import { IconsModule } from './icons.module';
|
||||
@@ -116,9 +117,11 @@ import { DatetimePickerStubComponent } from './datetime-picker-stub/datetime-pic
|
||||
DropdownComponent,
|
||||
InputAmountComponent,
|
||||
InputPasswordComponent,
|
||||
LoadingScreenComponent,
|
||||
DatetimePickerStubComponent // temporarily added stub for datetime picker
|
||||
],
|
||||
exports: [
|
||||
LoadingScreenComponent,
|
||||
FileUploadComponent,
|
||||
FooterComponent,
|
||||
LanguageSelectorComponent,
|
||||
|
||||
@@ -7,3 +7,4 @@
|
||||
-->
|
||||
|
||||
<router-outlet></router-outlet>
|
||||
<mifosx-loading-screen></mifosx-loading-screen>
|
||||
|
||||
@@ -319,6 +319,11 @@ export class WebAppComponent implements OnInit, OnDestroy {
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
// Dismiss initial application boot splash screen smoothly
|
||||
if (typeof (window as any).hideAppSplash === 'function') {
|
||||
(window as any).hideAppSplash();
|
||||
}
|
||||
}
|
||||
|
||||
/** Stores the server's "today" where every date default reads it (see core/utils/business-today). */
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
+1
-1
@@ -21,7 +21,7 @@
|
||||
// in the tenants table of the tenant-store database, or the platform rejects the request as an
|
||||
// unknown tenant.
|
||||
window["env"]["fineractPlatformTenantId"] = 'utkarshbank';
|
||||
window["env"]["fineractPlatformTenantIds"] = 'utkarshbank,lincpay';
|
||||
window["env"]["fineractPlatformTenantIds"] = 'utkarshbank,lincpay,utkarshnagari,testbank,humarwork,default,mybank';
|
||||
|
||||
window['env']['tenantLogoUrl'] = '';
|
||||
window['env']['tenantLogoUrlDark'] = '';
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 33 KiB |
@@ -6,53 +6,95 @@
|
||||
* 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 {
|
||||
height: 100vh;
|
||||
width: 100vw;
|
||||
position: relative;
|
||||
display: flex;
|
||||
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 {
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-style: solid;
|
||||
position: absolute;
|
||||
animation: rotate 0.8s infinite 0.2s;
|
||||
border-radius: 50%;
|
||||
border-style: solid;
|
||||
box-sizing: border-box;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.bottom {
|
||||
border-width: 0 90px 90px;
|
||||
border-color: transparent transparent #1fb050;
|
||||
bottom: calc(50% - 100px);
|
||||
left: calc(50% - 90px);
|
||||
width: 72px;
|
||||
height: 72px;
|
||||
border-width: 3px;
|
||||
border-color: #2563eb transparent transparent;
|
||||
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 {
|
||||
border-width: 90px 90px 0;
|
||||
border-color: #b4d575 transparent transparent;
|
||||
top: calc(50% - 100px);
|
||||
left: calc(50% - 90px);
|
||||
width: 54px;
|
||||
height: 54px;
|
||||
border-width: 3px;
|
||||
border-color: transparent transparent #0ea5e9;
|
||||
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 {
|
||||
border-width: 90px 0 90px 90px;
|
||||
border-color: transparent transparent transparent #1074b9;
|
||||
top: calc(50% - 90px);
|
||||
left: calc(50% - 100px);
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
border-width: 2.5px;
|
||||
border-color: #10b981 transparent transparent;
|
||||
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 {
|
||||
border-width: 90px 90px 90px 0;
|
||||
border-color: transparent #1daeec transparent transparent;
|
||||
top: calc(50% - 90px);
|
||||
right: calc(50% - 100px);
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
border-width: 2px;
|
||||
border-color: transparent #38bdf8 transparent transparent;
|
||||
animation: cbs-spin-ring 0.7s cubic-bezier(0.5, 0, 0.5, 1) infinite reverse;
|
||||
}
|
||||
|
||||
@keyframes rotate {
|
||||
from {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
to {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
/* Optional central glowing core */
|
||||
&::after {
|
||||
content: '';
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-radius: 50%;
|
||||
background: #38bdf8;
|
||||
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;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -20,7 +20,8 @@ export const environment = {
|
||||
hash: env.mifos_x.hash,
|
||||
// For connecting to server running elsewhere update the tenant identifier
|
||||
fineractPlatformTenantId: loadedEnv['fineractPlatformTenantId'] || 'utkarshbank',
|
||||
fineractPlatformTenantIds: loadedEnv['fineractPlatformTenantIds'] || 'utkarshbank,lincpay',
|
||||
fineractPlatformTenantIds:
|
||||
loadedEnv['fineractPlatformTenantIds'] || 'utkarshbank,lincpay,utkarshnagari,testbank,humarwork,default,mybank',
|
||||
// For connecting to others servers running elsewhere update the base API URL
|
||||
baseApiUrls:
|
||||
loadedEnv['fineractApiUrls'] || 'https://demo.mifos.community,https://localhost:8443,' + window.location.origin,
|
||||
|
||||
@@ -23,7 +23,8 @@ export const environment = {
|
||||
hash: env.mifos_x.hash,
|
||||
// For connecting to server running elsewhere update the tenant identifier
|
||||
fineractPlatformTenantId: loadedEnv.fineractPlatformTenantId || 'utkarshbank',
|
||||
fineractPlatformTenantIds: loadedEnv.fineractPlatformTenantIds || 'utkarshbank,lincpay',
|
||||
fineractPlatformTenantIds:
|
||||
loadedEnv.fineractPlatformTenantIds || 'utkarshbank,lincpay,utkarshnagari,testbank,humarwork,default,mybank',
|
||||
// For connecting to others servers running elsewhere update the base API URL
|
||||
baseApiUrls:
|
||||
loadedEnv.fineractApiUrls || 'https://demo.mifos.community,https://localhost:8443,' + window.location.origin,
|
||||
|
||||
+290
-9
@@ -11,7 +11,7 @@
|
||||
<html lang="en" class="h-full bg-gray-100">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>{{'APP_NAME' | translate}}</title>
|
||||
<title>CBS Nexora</title>
|
||||
<base href="/" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
|
||||
<meta name="apple-mobile-web-app-capable" content="yes" />
|
||||
@@ -27,7 +27,10 @@
|
||||
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/css2?family=IBM+Plex+Sans:wght@500&display=swap" rel="stylesheet" />
|
||||
<link
|
||||
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
|
||||
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"
|
||||
@@ -108,13 +111,291 @@
|
||||
});
|
||||
</script>
|
||||
|
||||
<mifosx-web-app>
|
||||
<div class="loader-wrapper">
|
||||
<div class="bottom triangle"></div>
|
||||
<div class="top triangle"></div>
|
||||
<div class="left triangle"></div>
|
||||
<div class="right triangle"></div>
|
||||
<div id="cbs-app-splash-screen" class="cbs-init-screen">
|
||||
<style>
|
||||
.cbs-init-screen {
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
display: flex;
|
||||
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>
|
||||
</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>
|
||||
</html>
|
||||
|
||||
+343
-37
@@ -81,66 +81,332 @@
|
||||
|
||||
// ===== Sub-menu Mega Panels (rendered in CDK overlay) =====
|
||||
.deposits-mega-panel,
|
||||
.hrm-mega-panel {
|
||||
max-width: 700px !important;
|
||||
.hrm-mega-panel,
|
||||
.cashier-mega-panel,
|
||||
.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,
|
||||
.others-mega-panel {
|
||||
max-width: 850px !important;
|
||||
min-width: 780px !important;
|
||||
max-width: 840px !important;
|
||||
}
|
||||
|
||||
.share-grid,
|
||||
.others-grid {
|
||||
grid-template-columns: repeat(4, 1fr) !important;
|
||||
}
|
||||
|
||||
.others-grid,
|
||||
.npa-grid {
|
||||
grid-template-columns: repeat(3, 1fr) !important;
|
||||
}
|
||||
|
||||
.npa-mega-panel,
|
||||
.advances-mega-panel {
|
||||
.reports-mega-panel {
|
||||
min-width: 740px !important;
|
||||
max-width: 800px !important;
|
||||
border-top: 2.5px solid #0369a1 !important;
|
||||
}
|
||||
|
||||
.advances-grid {
|
||||
grid-template-columns: repeat(3, 1fr) !important;
|
||||
.letter-mega-panel,
|
||||
.reconciliation-mega-panel {
|
||||
min-width: 900px !important;
|
||||
max-width: 960px !important;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
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 {
|
||||
border-top: 2.5px solid #1074b9 !important;
|
||||
}
|
||||
|
||||
.cashier-mega-panel {
|
||||
border-top: 2.5px solid #0284c7 !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 {
|
||||
max-width: 1100px !important;
|
||||
border-top: 2.5px solid #15803d !important;
|
||||
}
|
||||
|
||||
.letter-grid {
|
||||
grid-template-columns: repeat(5, minmax(190px, 1fr)) !important;
|
||||
min-width: 1040px;
|
||||
.insurance-mega-panel {
|
||||
border-top: 2.5px solid #c2410c !important;
|
||||
}
|
||||
|
||||
.reconciliation-mega-panel {
|
||||
max-width: 1100px !important;
|
||||
.ckyc-mega-panel {
|
||||
border-top: 2.5px solid #be185d !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 {
|
||||
grid-template-columns: repeat(5, minmax(190px, 1fr)) !important;
|
||||
min-width: 1040px;
|
||||
grid-template-columns: repeat(5, minmax(170px, 1fr)) !important;
|
||||
}
|
||||
|
||||
/* Admin Mega Menu — 3-column rectangular panel (Setup · Catalog ·
|
||||
Audit & Compliance). Reuses the deposit-mega-menu grid + group chrome
|
||||
and retints the group-title accent to Admin purple. */
|
||||
.admin-mega-panel {
|
||||
max-width: 760px !important;
|
||||
}
|
||||
|
||||
.admin-grid {
|
||||
grid-template-columns: repeat(3, minmax(220px, 1fr)) !important;
|
||||
min-width: 680px;
|
||||
.deposit-menu-group {
|
||||
display: flex !important;
|
||||
flex-direction: column !important;
|
||||
gap: 1px !important;
|
||||
min-width: 0 !important;
|
||||
|
||||
.deposit-group-title {
|
||||
color: #7c3aed !important;
|
||||
border-bottom-color: #7c3aed !important;
|
||||
font-weight: 700 !important;
|
||||
font-size: 9.5px !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;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -2012,3 +2278,43 @@ 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;
|
||||
}
|
||||
|
||||
@@ -53,7 +53,7 @@ $mifosx-typography: mat.m2-define-typography-config(
|
||||
$button: $mifosx-typography-level
|
||||
);
|
||||
|
||||
$mifosx-density: 0;
|
||||
$mifosx-density: -1;
|
||||
|
||||
$mifosx-app-theme: mat.m2-define-light-theme(
|
||||
(
|
||||
|
||||
Reference in New Issue
Block a user