feat: letter-mgmt module + digital UPI/IMPS/ATM-POS reports + header redesign
letter-mgmt (new module): - Notice page: overdue loan list with filters, KPI strip, bulk actions, call disposition logging (Promise-to-Pay, Not Reachable, etc.), Speed Post dispatch dialog with consignment + post-office tracking, PDF preview + download, call-contact dialog with primary / alt / family / nominee numbers and per-contact disposition history. - Certificates: Loan Interest, Share, Balance, Form 60 (no-PAN flow), Form 15G/H (auto age-based), Hypothecation, NOC - each with shared preview dialog (six tone variants) and jsPDF generator using a common letterhead / summary-grid / signature-seal helper. digital: - IMPS module: report (P2A/P2P/Aadhaar tabs) + entry form with MMID/mobile lookup, NPCI switch resolve-to-A/C+IFSC BANL flow, sender autocomplete, hide sender field for P2P/Aadhaar, charges + 18% GST + waive checkbox, per-sender today-only history dialog. - UPI report with app-mix tab and full transaction filtering. - ATM/POS/ECOM hub with three ticket cards routing to today/status/cycle. - NEFT/RTGS entry: sender-account autocomplete, charges + GST + waive, field reorder (sender before amount), NEFT cap / RTGS floor validation, History button opening per-sender today's transactions. - NEFT/RTGS report: horizontal-bar trend leaderboard replacing tall bars. shell + theme: - Header redesigned with IBM Plex Sans 12/500 typography, 11-column grid per row, top-accent hover indicator, bordered cells via grid-gap. - Live KPI ticker below menu (CASH, TXN TODAY, CLEARING IN/OUT, NPA, CASA, CD RATIO, RBI CIRC, REPO) with marquee scroll, pause-on-hover, brand-blue gradient, amber bottom strip, pulsing red LIVE chip. - Sidebar 'KYC Management' -> 'KYC & ReKYC Management'. - Letter Mgmt / certificate menu items wired with green icon hints for items that have a working page. access-control: - MFA card layout compacted; method header inlines back button + title. icons: - Register faTruck/TruckFast, faEllipsisV/H, faCommentDots. - Add IBM Plex Sans Google Fonts import to index.html. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Aditya
co-authored by
Claude Opus 4.7
Claude Opus 4.7
parent
4322f37c6d
commit
325228c514
@@ -0,0 +1,155 @@
|
||||
<!--
|
||||
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="cert-root">
|
||||
<!-- HEADER -->
|
||||
<div class="cert-head">
|
||||
<div class="cert-head-l">
|
||||
<fa-icon icon="file-invoice" class="cert-head-ic"></fa-icon>
|
||||
<div>
|
||||
<h2 class="cert-head-t">Loan Interest Certificate</h2>
|
||||
<div class="cert-head-s">
|
||||
Generate and download interest-paid certificates per loan account, per financial year.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- KPI STRIP -->
|
||||
<div class="cert-kpis">
|
||||
<div class="cert-kpi cert-kpi--blue">
|
||||
<fa-icon icon="file-invoice" class="cert-kpi-ic"></fa-icon>
|
||||
<div>
|
||||
<div class="cert-kpi-n">{{ filteredLoans.length | number }}</div>
|
||||
<div class="cert-kpi-l">Loan Accounts</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="cert-kpi cert-kpi--green">
|
||||
<fa-icon icon="coins" class="cert-kpi-ic"></fa-icon>
|
||||
<div>
|
||||
<div class="cert-kpi-n">₹{{ totalInterestForFy() | number: '1.0-0' }}</div>
|
||||
<div class="cert-kpi-l">Interest Paid ({{ fyFilter }})</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="cert-kpi cert-kpi--teal">
|
||||
<fa-icon icon="check-circle" class="cert-kpi-ic"></fa-icon>
|
||||
<div>
|
||||
<div class="cert-kpi-n">₹{{ totalPrincipalForFy() | number: '1.0-0' }}</div>
|
||||
<div class="cert-kpi-l">Principal Paid ({{ fyFilter }})</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- FILTERS -->
|
||||
<div class="cert-filters">
|
||||
<div class="cert-filter">
|
||||
<label>Account number / Customer / PAN</label>
|
||||
<div class="cert-input-ic">
|
||||
<fa-icon icon="search"></fa-icon>
|
||||
<input type="text" [(ngModel)]="search" placeholder="e.g. LN10029384, ABCPM1234E or customer name" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="cert-filter">
|
||||
<label>Financial year</label>
|
||||
<select [(ngModel)]="fyFilter">
|
||||
@for (f of fyOptions; track f) {
|
||||
<option [value]="f">{{ f }}</option>
|
||||
}
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="cert-filter">
|
||||
<label>Loan type</label>
|
||||
<select [(ngModel)]="loanTypeFilter">
|
||||
<option value="">All types</option>
|
||||
@for (o of loanTypeOptions; track o.value) {
|
||||
<option [value]="o.value">{{ o.label }}</option>
|
||||
}
|
||||
</select>
|
||||
</div>
|
||||
|
||||
@if (search || loanTypeFilter) {
|
||||
<button type="button" class="cert-clear" (click)="clearFilters()"><fa-icon icon="times"></fa-icon> Clear</button>
|
||||
}
|
||||
</div>
|
||||
|
||||
<!-- TABLE -->
|
||||
<div class="cert-card">
|
||||
<div class="cert-table-wrap">
|
||||
<table class="cert-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Customer · Loan A/C</th>
|
||||
<th>Type</th>
|
||||
<th>Branch</th>
|
||||
<th class="num">Sanctioned</th>
|
||||
<th class="num">Outstanding</th>
|
||||
<th class="num">Interest ({{ fyFilter }})</th>
|
||||
<th class="num">Principal ({{ fyFilter }})</th>
|
||||
<th>Rate</th>
|
||||
<th class="col-actions">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@for (l of filteredLoans; track l.accountNo) {
|
||||
<tr>
|
||||
<td>
|
||||
<div class="cert-cust-name">{{ l.customerName }}</div>
|
||||
<div class="mono small muted">{{ l.accountNo }} · {{ l.customerId }} · PAN {{ l.customerPan }}</div>
|
||||
</td>
|
||||
<td>
|
||||
<span class="cert-pill cert-pill--type">{{ loanTypeLabel(l.loanType) }}</span>
|
||||
</td>
|
||||
<td class="small">{{ l.branch }}</td>
|
||||
<td class="num">₹{{ l.sanctionedAmount | number: '1.0-0' }}</td>
|
||||
<td class="num">
|
||||
<strong>₹{{ outstandingPrincipal(l) | number: '1.0-0' }}</strong>
|
||||
</td>
|
||||
<td class="num">
|
||||
<strong class="cert-interest">₹{{ selectedFyData(l)?.interestPaid | number: '1.0-0' }}</strong>
|
||||
</td>
|
||||
<td class="num">₹{{ selectedFyData(l)?.principalPaid | number: '1.0-0' }}</td>
|
||||
<td>
|
||||
<span class="cert-rate-pill">{{ l.interestRate }}% p.a.</span>
|
||||
</td>
|
||||
<td class="col-actions">
|
||||
<div class="cert-row-actions">
|
||||
<button
|
||||
type="button"
|
||||
class="cert-icon-btn primary"
|
||||
(click)="viewCertificate(l)"
|
||||
matTooltip="View / Print certificate"
|
||||
>
|
||||
<fa-icon icon="eye"></fa-icon>
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="cert-icon-btn"
|
||||
(click)="downloadCertificate(l)"
|
||||
matTooltip="Download PDF"
|
||||
>
|
||||
<fa-icon icon="download"></fa-icon>
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
@if (filteredLoans.length === 0) {
|
||||
<tr>
|
||||
<td colspan="9" class="cert-empty">
|
||||
<fa-icon icon="info-circle"></fa-icon>
|
||||
No loan accounts match the current filters.
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,336 @@
|
||||
/**
|
||||
* 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, inject, OnInit } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
import { FaIconComponent } from '@fortawesome/angular-fontawesome';
|
||||
import { MatDialog } from '@angular/material/dialog';
|
||||
import { MatSnackBar } from '@angular/material/snack-bar';
|
||||
import { MatTooltip } from '@angular/material/tooltip';
|
||||
import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
|
||||
|
||||
import {
|
||||
CertificatePreviewDialogComponent,
|
||||
CertificatePreviewDialogData
|
||||
} from '../certificate-preview-dialog/certificate-preview-dialog.component';
|
||||
import { downloadLoanInterestPdf } from '../certificate-pdf';
|
||||
|
||||
export type LoanProductType = 'HOUSING' | 'PERSONAL' | 'AUTO' | 'EDUCATION' | 'GOLD' | 'BUSINESS';
|
||||
|
||||
export interface FyInterestBreakup {
|
||||
/** Financial year label e.g. "FY 2024-25". */
|
||||
fy: string;
|
||||
openingBalance: number;
|
||||
closingBalance: number;
|
||||
principalPaid: number;
|
||||
interestPaid: number;
|
||||
}
|
||||
|
||||
export interface LoanInterestRecord {
|
||||
accountNo: string;
|
||||
customerId: string;
|
||||
customerName: string;
|
||||
customerPan: string;
|
||||
customerAddress: string;
|
||||
branch: string;
|
||||
loanType: LoanProductType;
|
||||
sanctionedAmount: number;
|
||||
disbursementDate: string;
|
||||
/** Interest rate p.a. (e.g. 8.65) */
|
||||
interestRate: number;
|
||||
fy: FyInterestBreakup[];
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'mifosx-loan-interest-certificate',
|
||||
templateUrl: './loan-interest.component.html',
|
||||
styleUrls: ['../certificates.shared.scss'],
|
||||
imports: [
|
||||
...STANDALONE_SHARED_IMPORTS,
|
||||
CommonModule,
|
||||
FormsModule,
|
||||
FaIconComponent,
|
||||
MatTooltip
|
||||
]
|
||||
})
|
||||
export class LoanInterestCertificateComponent implements OnInit {
|
||||
private dialog = inject(MatDialog);
|
||||
private snack = inject(MatSnackBar);
|
||||
|
||||
// ── Filters ──
|
||||
search = '';
|
||||
fyFilter = '';
|
||||
loanTypeFilter: '' | LoanProductType = '';
|
||||
|
||||
loans: LoanInterestRecord[] = [];
|
||||
|
||||
/** All financial years present across the dataset (newest first). */
|
||||
fyOptions: string[] = [];
|
||||
|
||||
readonly loanTypeOptions: { value: LoanProductType; label: string }[] = [
|
||||
{ value: 'HOUSING', label: 'Housing Loan' },
|
||||
{ value: 'PERSONAL', label: 'Personal Loan' },
|
||||
{ value: 'AUTO', label: 'Auto Loan' },
|
||||
{ value: 'EDUCATION', label: 'Education Loan' },
|
||||
{ value: 'GOLD', label: 'Gold Loan' },
|
||||
{ value: 'BUSINESS', label: 'Business Loan' }
|
||||
];
|
||||
|
||||
ngOnInit(): void {
|
||||
this.loans = seedLoanInterestRecords();
|
||||
this.fyOptions = Array.from(new Set(this.loans.flatMap((l) => l.fy.map((f) => f.fy))))
|
||||
.sort()
|
||||
.reverse();
|
||||
// Default to most-recent FY
|
||||
if (this.fyOptions.length) {
|
||||
this.fyFilter = this.fyOptions[0];
|
||||
}
|
||||
}
|
||||
|
||||
// ── Derived list ──
|
||||
get filteredLoans(): LoanInterestRecord[] {
|
||||
const q = this.search.trim().toLowerCase();
|
||||
return this.loans.filter((l) => {
|
||||
if (this.loanTypeFilter && l.loanType !== this.loanTypeFilter) return false;
|
||||
if (!q) return true;
|
||||
return (
|
||||
l.accountNo.toLowerCase().includes(q) ||
|
||||
l.customerName.toLowerCase().includes(q) ||
|
||||
l.customerId.toLowerCase().includes(q) ||
|
||||
l.customerPan.toLowerCase().includes(q)
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
loanTypeLabel(t: LoanProductType): string {
|
||||
return this.loanTypeOptions.find((o) => o.value === t)?.label || t;
|
||||
}
|
||||
|
||||
selectedFyData(l: LoanInterestRecord): FyInterestBreakup | undefined {
|
||||
return l.fy.find((f) => f.fy === this.fyFilter) || l.fy[0];
|
||||
}
|
||||
|
||||
totalInterestForFy(): number {
|
||||
return this.filteredLoans.reduce((s, l) => s + (this.selectedFyData(l)?.interestPaid || 0), 0);
|
||||
}
|
||||
|
||||
totalPrincipalForFy(): number {
|
||||
return this.filteredLoans.reduce((s, l) => s + (this.selectedFyData(l)?.principalPaid || 0), 0);
|
||||
}
|
||||
|
||||
outstandingPrincipal(l: LoanInterestRecord): number {
|
||||
return this.selectedFyData(l)?.closingBalance ?? 0;
|
||||
}
|
||||
|
||||
// ── Actions ──
|
||||
clearFilters(): void {
|
||||
this.search = '';
|
||||
this.loanTypeFilter = '';
|
||||
if (this.fyOptions.length) this.fyFilter = this.fyOptions[0];
|
||||
}
|
||||
|
||||
viewCertificate(l: LoanInterestRecord): void {
|
||||
const fy = this.selectedFyData(l);
|
||||
if (!fy) {
|
||||
this.snack.open('No interest data on file for the selected financial year.', 'OK', { duration: 2500 });
|
||||
return;
|
||||
}
|
||||
const data: CertificatePreviewDialogData = {
|
||||
kind: 'interest',
|
||||
loanInterest: { record: l, fy }
|
||||
};
|
||||
this.dialog.open(CertificatePreviewDialogComponent, {
|
||||
width: '880px',
|
||||
maxWidth: '96vw',
|
||||
maxHeight: '92vh',
|
||||
autoFocus: false,
|
||||
panelClass: 'cert-preview-dialog',
|
||||
data
|
||||
});
|
||||
}
|
||||
|
||||
downloadCertificate(l: LoanInterestRecord): void {
|
||||
const fy = this.selectedFyData(l);
|
||||
if (!fy) {
|
||||
this.snack.open('No interest data on file for the selected financial year.', 'OK', { duration: 2500 });
|
||||
return;
|
||||
}
|
||||
downloadLoanInterestPdf(l, fy);
|
||||
this.snack.open(`Interest Certificate (${fy.fy}) downloaded.`, 'OK', { duration: 2400 });
|
||||
}
|
||||
}
|
||||
|
||||
// ───────────────────── Mock seed (top-level export) ─────────────────────
|
||||
export function seedLoanInterestRecords(): LoanInterestRecord[] {
|
||||
return [
|
||||
{
|
||||
accountNo: 'LN10029384',
|
||||
customerId: 'CUST112233',
|
||||
customerName: 'Rohan S. Mehta',
|
||||
customerPan: 'ABCPM1234E',
|
||||
customerAddress: 'Flat 902, Skyline Apt, Andheri (E), Mumbai 400069',
|
||||
branch: 'Mumbai — Andheri (E)',
|
||||
loanType: 'HOUSING',
|
||||
sanctionedAmount: 4500000,
|
||||
disbursementDate: '2021-06-15',
|
||||
interestRate: 8.65,
|
||||
fy: [
|
||||
{
|
||||
fy: 'FY 2024-25',
|
||||
openingBalance: 3620000,
|
||||
closingBalance: 3380000,
|
||||
principalPaid: 240000,
|
||||
interestPaid: 312500
|
||||
},
|
||||
{
|
||||
fy: 'FY 2023-24',
|
||||
openingBalance: 3840000,
|
||||
closingBalance: 3620000,
|
||||
principalPaid: 220000,
|
||||
interestPaid: 328200
|
||||
},
|
||||
{
|
||||
fy: 'FY 2022-23',
|
||||
openingBalance: 4050000,
|
||||
closingBalance: 3840000,
|
||||
principalPaid: 210000,
|
||||
interestPaid: 342800
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
accountNo: 'LN20034112',
|
||||
customerId: 'CUST334455',
|
||||
customerName: 'Anita Verma',
|
||||
customerPan: 'EFGHV5678A',
|
||||
customerAddress: 'B-12, Connaught Pl, New Delhi 110001',
|
||||
branch: 'New Delhi — Connaught Place',
|
||||
loanType: 'PERSONAL',
|
||||
sanctionedAmount: 600000,
|
||||
disbursementDate: '2022-09-10',
|
||||
interestRate: 12.5,
|
||||
fy: [
|
||||
{
|
||||
fy: 'FY 2024-25',
|
||||
openingBalance: 380000,
|
||||
closingBalance: 220000,
|
||||
principalPaid: 160000,
|
||||
interestPaid: 41200
|
||||
},
|
||||
{ fy: 'FY 2023-24', openingBalance: 520000, closingBalance: 380000, principalPaid: 140000, interestPaid: 56800 }
|
||||
]
|
||||
},
|
||||
{
|
||||
accountNo: 'LN50200077',
|
||||
customerId: 'CUST556677',
|
||||
customerName: 'Karthik Rao',
|
||||
customerPan: 'PQRSR2233Z',
|
||||
customerAddress: '24, MG Road, Bengaluru 560001',
|
||||
branch: 'Bengaluru — MG Road',
|
||||
loanType: 'AUTO',
|
||||
sanctionedAmount: 850000,
|
||||
disbursementDate: '2023-01-20',
|
||||
interestRate: 9.4,
|
||||
fy: [
|
||||
{
|
||||
fy: 'FY 2024-25',
|
||||
openingBalance: 620000,
|
||||
closingBalance: 480000,
|
||||
principalPaid: 140000,
|
||||
interestPaid: 58800
|
||||
},
|
||||
{ fy: 'FY 2023-24', openingBalance: 780000, closingBalance: 620000, principalPaid: 160000, interestPaid: 71200 }
|
||||
]
|
||||
},
|
||||
{
|
||||
accountNo: 'LN70010023',
|
||||
customerId: 'CUST889900',
|
||||
customerName: 'Vikram Joshi',
|
||||
customerPan: 'LMNOJ9988X',
|
||||
customerAddress: 'Office 3B, Koregaon Park Road, Pune 411001',
|
||||
branch: 'Pune — Koregaon Park',
|
||||
loanType: 'BUSINESS',
|
||||
sanctionedAmount: 5500000,
|
||||
disbursementDate: '2020-11-05',
|
||||
interestRate: 11.0,
|
||||
fy: [
|
||||
{
|
||||
fy: 'FY 2024-25',
|
||||
openingBalance: 4200000,
|
||||
closingBalance: 3950000,
|
||||
principalPaid: 250000,
|
||||
interestPaid: 464800
|
||||
},
|
||||
{
|
||||
fy: 'FY 2023-24',
|
||||
openingBalance: 4480000,
|
||||
closingBalance: 4200000,
|
||||
principalPaid: 280000,
|
||||
interestPaid: 488600
|
||||
},
|
||||
{
|
||||
fy: 'FY 2022-23',
|
||||
openingBalance: 4760000,
|
||||
closingBalance: 4480000,
|
||||
principalPaid: 280000,
|
||||
interestPaid: 522300
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
accountNo: 'LN88990022',
|
||||
customerId: 'CUST990011',
|
||||
customerName: 'Arjun Banerjee',
|
||||
customerPan: 'TUVWB4455F',
|
||||
customerAddress: '42, Park Street, Kolkata 700016',
|
||||
branch: 'Kolkata — Park Street',
|
||||
loanType: 'EDUCATION',
|
||||
sanctionedAmount: 1200000,
|
||||
disbursementDate: '2022-04-22',
|
||||
interestRate: 9.85,
|
||||
fy: [
|
||||
{
|
||||
fy: 'FY 2024-25',
|
||||
openingBalance: 920000,
|
||||
closingBalance: 790000,
|
||||
principalPaid: 130000,
|
||||
interestPaid: 93500
|
||||
},
|
||||
{
|
||||
fy: 'FY 2023-24',
|
||||
openingBalance: 1080000,
|
||||
closingBalance: 920000,
|
||||
principalPaid: 160000,
|
||||
interestPaid: 102200
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
accountNo: 'LN50200099',
|
||||
customerId: 'CUST667788',
|
||||
customerName: 'Lakshmi Naidu',
|
||||
customerPan: 'XYZAN7788Q',
|
||||
customerAddress: 'Plot 14, Road No. 3, Banjara Hills, Hyderabad 500034',
|
||||
branch: 'Hyderabad — Banjara Hills',
|
||||
loanType: 'GOLD',
|
||||
sanctionedAmount: 450000,
|
||||
disbursementDate: '2023-08-18',
|
||||
interestRate: 10.25,
|
||||
fy: [
|
||||
{
|
||||
fy: 'FY 2024-25',
|
||||
openingBalance: 320000,
|
||||
closingBalance: 180000,
|
||||
principalPaid: 140000,
|
||||
interestPaid: 28400
|
||||
}
|
||||
]
|
||||
}
|
||||
];
|
||||
}
|
||||
Reference in New Issue
Block a user