- KYC tab: fix Verify (PAN) and Send OTP (Aadhaar) being disabled in edit mode; unmask Aadhaar input and show on-file masked value as hint; resolve kycId from id/kycId/resourceId fallbacks. - Client stepper/view: add familyAllowed / nomineeAllowed predicates + CanActivate route guards. Family tab hidden for non-individuals, Nominee tab hidden for non-proprietor entities. Family-members step accepts a nomineeOnly input for proprietorship clients. Add/Edit/Delete buttons inside family-members and nominee tabs gated by canAdd. - cfcfrms: add cfcfrms-shell wrapper, restyle complaint/fraud/mule/escalate pages and dashboard. - Savings: identity-verify and transaction-confirm dialogs, manage / activate / add-charge flows, account preview styling. - Tasks, core shell, account-nominees, icons: minor style and behaviour updates. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
108 lines
3.8 KiB
HTML
108 lines
3.8 KiB
HTML
<!--
|
|
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="nom-container mat-typography">
|
|
<!-- ═══ FAMILY MEMBERS SECTION ═══ -->
|
|
<div class="nom-header">
|
|
<div class="nom-header__left">
|
|
<mat-icon class="nom-header__mat-icon">people</mat-icon>
|
|
<h3 class="nom-header__title">Family Members</h3>
|
|
<span class="nom-header__badge">{{ familyMembers.length }}</span>
|
|
</div>
|
|
@if (canAdd) {
|
|
<button mat-flat-button color="primary" class="nom-header__btn" (click)="addFamilyMember()">
|
|
<mat-icon>add</mat-icon> Add Member
|
|
</button>
|
|
}
|
|
</div>
|
|
|
|
@if (familyMembers.length === 0) {
|
|
<div class="nom-empty">
|
|
<mat-icon class="nom-empty__mat-icon">people_outline</mat-icon>
|
|
<p class="nom-empty__text">No family members added yet.</p>
|
|
</div>
|
|
}
|
|
|
|
<mat-accordion multi>
|
|
@for (member of familyMembers; track member.id; let i = $index) {
|
|
<mat-expansion-panel class="nom-panel">
|
|
<mat-expansion-panel-header class="nom-panel__header">
|
|
<mat-panel-title class="nom-panel__title">
|
|
<mat-icon class="nom-panel__mat-icon">person</mat-icon>
|
|
<span class="nom-panel__name">{{ displayName(member) }}</span>
|
|
@if (getRelationship(member)) {
|
|
<span class="nom-panel__badge nom-panel__badge--relation">{{ getRelationship(member) }}</span>
|
|
}
|
|
</mat-panel-title>
|
|
<mat-panel-description class="nom-panel__desc">
|
|
@if (member.dateOfBirth) {
|
|
{{ member.dateOfBirth | dateFormat }}
|
|
}
|
|
</mat-panel-description>
|
|
</mat-expansion-panel-header>
|
|
|
|
@if (canAdd) {
|
|
<div class="nom-actions">
|
|
<div class="nom-actions__buttons">
|
|
<button
|
|
mat-stroked-button
|
|
color="primary"
|
|
class="nom-actions__edit"
|
|
(click)="editFamilyMember(member, i)"
|
|
>
|
|
<fa-icon icon="edit" class="m-r-10"></fa-icon> Edit
|
|
</button>
|
|
<button
|
|
mat-stroked-button
|
|
color="warn"
|
|
class="nom-actions__delete"
|
|
(click)="deleteMember(member, 'Family Member')"
|
|
>
|
|
<fa-icon icon="trash" class="m-r-10"></fa-icon> Delete
|
|
</button>
|
|
</div>
|
|
</div>
|
|
}
|
|
|
|
<div class="nom-grid">
|
|
@if (member.firstName) {
|
|
<div class="nom-field">
|
|
<div class="nom-field__label">Name</div>
|
|
<div class="nom-field__value">{{ member.firstName }}</div>
|
|
</div>
|
|
}
|
|
@if (getRelationship(member)) {
|
|
<div class="nom-field">
|
|
<div class="nom-field__label">Relationship</div>
|
|
<div class="nom-field__value">{{ getRelationship(member) }}</div>
|
|
</div>
|
|
}
|
|
@if (member.dateOfBirth) {
|
|
<div class="nom-field">
|
|
<div class="nom-field__label">Date of Birth</div>
|
|
<div class="nom-field__value">{{ member.dateOfBirth | dateFormat }}</div>
|
|
</div>
|
|
}
|
|
@if (member.isDependent !== null) {
|
|
<div class="nom-field">
|
|
<div class="nom-field__label">Dependent</div>
|
|
<div class="nom-field__value">{{ member.isDependent | yesNo }}</div>
|
|
</div>
|
|
}
|
|
@if (member.remarks) {
|
|
<div class="nom-field">
|
|
<div class="nom-field__label">Remarks</div>
|
|
<div class="nom-field__value">{{ member.remarks }}</div>
|
|
</div>
|
|
}
|
|
</div>
|
|
</mat-expansion-panel>
|
|
}
|
|
</mat-accordion>
|
|
</div>
|