426 lines
19 KiB
HTML
426 lines
19 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="preview-wrapper">
|
|
<!-- ══ 1. Account Details ════════════════════════════════════════ -->
|
|
<div class="preview-section">
|
|
<div class="preview-section__header">
|
|
<i class="fas fa-info-circle preview-section__icon"></i>
|
|
<span class="preview-section__title">Account Details</span>
|
|
</div>
|
|
<div class="preview-body">
|
|
<div class="preview-grid preview-grid--three">
|
|
<div class="preview-field">
|
|
<span class="preview-label">{{ 'labels.inputs.Product' | translate }}</span>
|
|
<span class="preview-value">{{
|
|
savingsAccount?.productId | find: savingsAccountTemplate?.productOptions : 'id' : 'name'
|
|
}}</span>
|
|
</div>
|
|
<div class="preview-field">
|
|
<span class="preview-label">{{ 'labels.inputs.Submitted On' | translate }}</span>
|
|
<span class="preview-value">{{ savingsAccount?.submittedOnDate | dateFormat }}</span>
|
|
</div>
|
|
<div class="preview-field">
|
|
<span class="preview-label">{{ 'labels.inputs.Field Officer' | translate }}</span>
|
|
<span class="preview-value">{{
|
|
savingsAccount?.fieldOfficerId
|
|
| find: savingsAccountProductTemplate?.fieldOfficerOptions : 'id' : 'displayName'
|
|
}}</span>
|
|
</div>
|
|
<div class="preview-field">
|
|
<span class="preview-label">{{ 'labels.inputs.External Id' | translate }}</span>
|
|
@if (savingsAccount?.externalId) {
|
|
<span class="preview-value">
|
|
<mifosx-external-identifier externalId="{{ savingsAccount.externalId }}"></mifosx-external-identifier>
|
|
</span>
|
|
} @else {
|
|
<span class="preview-value preview-muted">Unassigned</span>
|
|
}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- ══ 2. Product Classification ════════════════════════════════ -->
|
|
@if (
|
|
savingsAccountProductTemplate?.accountType ||
|
|
savingsAccountProductTemplate?.customerSegment ||
|
|
savingsAccountProductTemplate?.productCode ||
|
|
savingsAccountProductTemplate?.previewAccountNo ||
|
|
savingsAccountProductTemplate?.effectiveDate ||
|
|
savingsAccountProductTemplate?.endDate
|
|
) {
|
|
<div class="preview-section">
|
|
<div class="preview-section__header">
|
|
<i class="fas fa-tags preview-section__icon"></i>
|
|
<span class="preview-section__title">Product Classification</span>
|
|
<span class="preview-section__badge">From Product</span>
|
|
</div>
|
|
<div class="preview-body">
|
|
<div class="preview-grid preview-grid--three">
|
|
@if (savingsAccountProductTemplate?.accountType) {
|
|
<div class="preview-field">
|
|
<span class="preview-label">Account Type</span>
|
|
<span class="preview-value">{{ savingsAccountProductTemplate?.accountType }}</span>
|
|
</div>
|
|
}
|
|
@if (savingsAccountProductTemplate?.customerSegment) {
|
|
<div class="preview-field">
|
|
<span class="preview-label">Customer Segment</span>
|
|
<span class="preview-value">{{ savingsAccountProductTemplate?.customerSegment }}</span>
|
|
</div>
|
|
}
|
|
@if (savingsAccountProductTemplate?.productCode) {
|
|
<div class="preview-field">
|
|
<span class="preview-label">Product Code</span>
|
|
<span class="preview-value preview-mono">{{ savingsAccountProductTemplate?.productCode }}</span>
|
|
</div>
|
|
}
|
|
<div class="preview-field">
|
|
<span class="preview-label">Account No</span>
|
|
<span class="preview-value preview-mono">{{
|
|
savingsAccountProductTemplate?.previewAccountNo || savingsAccountTemplate?.accountNo || 'Auto-generated'
|
|
}}</span>
|
|
</div>
|
|
@if (savingsAccountProductTemplate?.effectiveDate) {
|
|
<div class="preview-field">
|
|
<span class="preview-label">Effective Date</span>
|
|
<span class="preview-value">{{ savingsAccountProductTemplate?.effectiveDate | dateFormat }}</span>
|
|
</div>
|
|
}
|
|
@if (savingsAccountProductTemplate?.endDate) {
|
|
<div class="preview-field">
|
|
<span class="preview-label">End Date</span>
|
|
<span class="preview-value">{{ savingsAccountProductTemplate?.endDate | dateFormat }}</span>
|
|
</div>
|
|
}
|
|
<div class="preview-field">
|
|
<span class="preview-label">Introducer Required</span>
|
|
<span
|
|
class="preview-value preview-badge"
|
|
[class.preview-badge--yes]="savingsAccountProductTemplate?.introducerRequired"
|
|
>
|
|
{{ savingsAccountProductTemplate?.introducerRequired | yesNo }}
|
|
</span>
|
|
</div>
|
|
<div class="preview-field">
|
|
<span class="preview-label">Share Linking Enabled</span>
|
|
<span
|
|
class="preview-value preview-badge"
|
|
[class.preview-badge--yes]="savingsAccountProductTemplate?.shareLinkingEnabled"
|
|
>
|
|
{{ savingsAccountProductTemplate?.shareLinkingEnabled | yesNo }}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
}
|
|
|
|
<!-- ══ 3. Introducer Details (if selected) ══════════════════════ -->
|
|
@if (savingsAccount?.introducerId) {
|
|
<div class="preview-section">
|
|
<div class="preview-section__header">
|
|
<i class="fas fa-user-tie preview-section__icon"></i>
|
|
<span class="preview-section__title">Introducer Details</span>
|
|
</div>
|
|
<div class="preview-body">
|
|
<div class="preview-grid preview-grid--three">
|
|
<div class="preview-field">
|
|
<span class="preview-label">Name</span>
|
|
<span class="preview-value">{{ savingsAccount?.introducerName || '—' }}</span>
|
|
</div>
|
|
@if (savingsAccount?.introducerCif) {
|
|
<div class="preview-field">
|
|
<span class="preview-label">CIF No</span>
|
|
<span class="preview-value preview-mono">{{ savingsAccount.introducerCif }}</span>
|
|
</div>
|
|
}
|
|
<div class="preview-field">
|
|
<span class="preview-label">Client ID</span>
|
|
<span class="preview-value preview-mono">{{ savingsAccount.introducerId }}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
}
|
|
|
|
<!-- ══ 4. Currency & Account Flags ══════════════════════════════ -->
|
|
<div class="preview-section">
|
|
<div class="preview-section__header">
|
|
<i class="fas fa-coins preview-section__icon"></i>
|
|
<span class="preview-section__title">Currency & Account Flags</span>
|
|
</div>
|
|
<div class="preview-body">
|
|
<div class="preview-grid preview-grid--three">
|
|
<div class="preview-field">
|
|
<span class="preview-label">Currency</span>
|
|
<span class="preview-value">{{ currencyName }}</span>
|
|
</div>
|
|
<div class="preview-field">
|
|
<span class="preview-label">Decimal Places</span>
|
|
<span class="preview-value">{{ decimalPlaces }}</span>
|
|
</div>
|
|
<div class="preview-field">
|
|
<span class="preview-label">Currency In Multiples Of</span>
|
|
<span class="preview-value">{{ inMultiplesOf }}</span>
|
|
</div>
|
|
<div class="preview-field">
|
|
<span class="preview-label">Dormancy Alert</span>
|
|
<span
|
|
class="preview-value preview-badge"
|
|
[class.preview-badge--yes]="savingsAccountProductTemplate?.dormancyAlert"
|
|
>
|
|
{{ savingsAccountProductTemplate?.dormancyAlert | yesNo }}
|
|
</span>
|
|
</div>
|
|
<div class="preview-field">
|
|
<span class="preview-label">Nomination Facility</span>
|
|
<span
|
|
class="preview-value preview-badge"
|
|
[class.preview-badge--yes]="savingsAccountProductTemplate?.nominationFacility"
|
|
>
|
|
{{ savingsAccountProductTemplate?.nominationFacility | yesNo }}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- ══ 5. Dormancy Monitoring ════════════════════════════════════ -->
|
|
@if (
|
|
savingsAccountProductTemplate?.dormancyAlert || savingsAccountProductTemplate?.isDormancyTrackingActiveFromProduct
|
|
) {
|
|
<div class="preview-section">
|
|
<div class="preview-section__header">
|
|
<i class="fas fa-moon preview-section__icon"></i>
|
|
<span class="preview-section__title">Dormancy Monitoring</span>
|
|
<span
|
|
class="preview-section__badge"
|
|
[class.preview-section__badge--active]="savingsAccountProductTemplate?.isDormancyTrackingActiveFromProduct"
|
|
>
|
|
{{ savingsAccountProductTemplate?.isDormancyTrackingActiveFromProduct ? 'Active' : 'Inactive' }}
|
|
</span>
|
|
</div>
|
|
<div class="preview-body">
|
|
<div class="preview-dormancy-timeline">
|
|
<div class="preview-dorm-step">
|
|
<div class="preview-dorm-step__dot preview-dorm-step__dot--inactive"></div>
|
|
<div class="preview-dorm-step__body">
|
|
<span class="preview-dorm-step__label">Inactive</span>
|
|
<span class="preview-dorm-step__days">
|
|
@if (savingsAccountProductTemplate?.daysToInactiveFromProduct != null) {
|
|
After {{ savingsAccountProductTemplate.daysToInactiveFromProduct }} days of no transaction
|
|
} @else {
|
|
Not configured
|
|
}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div class="preview-dorm-connector"></div>
|
|
<div class="preview-dorm-step">
|
|
<div class="preview-dorm-step__dot preview-dorm-step__dot--dormant"></div>
|
|
<div class="preview-dorm-step__body">
|
|
<span class="preview-dorm-step__label">Dormant</span>
|
|
<span class="preview-dorm-step__days">
|
|
@if (savingsAccountProductTemplate?.daysToDormancyFromProduct != null) {
|
|
{{ savingsAccountProductTemplate.daysToDormancyFromProduct }} days after inactive
|
|
} @else {
|
|
Not configured
|
|
}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div class="preview-dorm-connector"></div>
|
|
<div class="preview-dorm-step">
|
|
<div class="preview-dorm-step__dot preview-dorm-step__dot--escheat"></div>
|
|
<div class="preview-dorm-step__body">
|
|
<span class="preview-dorm-step__label">Escheat</span>
|
|
<span class="preview-dorm-step__days">
|
|
@if (savingsAccountProductTemplate?.daysToEscheatFromProduct != null) {
|
|
{{ savingsAccountProductTemplate.daysToEscheatFromProduct }} days after dormant
|
|
} @else {
|
|
Not configured
|
|
}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="preview-dorm-flags">
|
|
<span class="preview-dorm-flag" [class.preview-dorm-flag--on]="savingsAccountProductTemplate?.dormancyAlert">
|
|
<i class="fas fa-bell"></i> Alert
|
|
{{ savingsAccountProductTemplate?.dormancyAlert ? 'Enabled' : 'Disabled' }}
|
|
</span>
|
|
<span
|
|
class="preview-dorm-flag"
|
|
[class.preview-dorm-flag--on]="savingsAccountProductTemplate?.isDormancyTrackingActiveFromProduct"
|
|
>
|
|
<i class="fas fa-eye"></i> Tracking
|
|
{{ savingsAccountProductTemplate?.isDormancyTrackingActiveFromProduct ? 'Active' : 'Inactive' }}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
}
|
|
|
|
<!-- ══ 7. Nominee Details (if filled) ═══════════════════════════ -->
|
|
@if (savingsAccountNominee) {
|
|
<div class="preview-section">
|
|
<div class="preview-section__header">
|
|
<i class="fas fa-user-shield preview-section__icon"></i>
|
|
<span class="preview-section__title">Nominee Details</span>
|
|
<span class="preview-section__badge">
|
|
{{ savingsAccountNominee?.mode === 'linked' ? 'Linked Client' : 'Manual Entry' }}
|
|
</span>
|
|
</div>
|
|
<div class="preview-body">
|
|
<div class="preview-grid preview-grid--three">
|
|
<!-- Name: fullName for manual, displayName for linked -->
|
|
<div class="preview-field">
|
|
<span class="preview-label">Name</span>
|
|
<span class="preview-value">{{
|
|
savingsAccountNominee?.fullName || savingsAccountNominee?.displayName || '—'
|
|
}}</span>
|
|
</div>
|
|
@if (savingsAccountNominee?.cifNumber) {
|
|
<div class="preview-field">
|
|
<span class="preview-label">CIF No</span>
|
|
<span class="preview-value preview-mono">{{ savingsAccountNominee.cifNumber }}</span>
|
|
</div>
|
|
}
|
|
<div class="preview-field">
|
|
<span class="preview-label">Relationship</span>
|
|
<span class="preview-value">{{ savingsAccountNominee?.relationship || '—' }}</span>
|
|
</div>
|
|
<div class="preview-field">
|
|
<span class="preview-label">Share %</span>
|
|
<span class="preview-value">{{ savingsAccountNominee?.nomineeShare ?? '—' }}%</span>
|
|
</div>
|
|
@if (savingsAccountNominee?.dateOfBirth) {
|
|
<div class="preview-field">
|
|
<span class="preview-label">Date of Birth</span>
|
|
<span class="preview-value">{{ savingsAccountNominee?.dateOfBirth | dateFormat }}</span>
|
|
</div>
|
|
}
|
|
@if (savingsAccountNominee?.nationality) {
|
|
<div class="preview-field">
|
|
<span class="preview-label">Nationality</span>
|
|
<span class="preview-value">{{ savingsAccountNominee?.nationality }}</span>
|
|
</div>
|
|
}
|
|
@if (savingsAccountNominee?.mobileNo) {
|
|
<div class="preview-field">
|
|
<span class="preview-label">Mobile No</span>
|
|
<span class="preview-value preview-mono">{{ savingsAccountNominee?.mobileNo }}</span>
|
|
</div>
|
|
}
|
|
@if (savingsAccountNominee?.aadhaarNumber) {
|
|
<div class="preview-field">
|
|
<span class="preview-label">Aadhaar No</span>
|
|
<span class="preview-value preview-mono">{{ savingsAccountNominee?.aadhaarNumber }}</span>
|
|
</div>
|
|
}
|
|
@if (savingsAccountNominee?.panNumber) {
|
|
<div class="preview-field">
|
|
<span class="preview-label">PAN No</span>
|
|
<span class="preview-value preview-mono">{{ savingsAccountNominee?.panNumber }}</span>
|
|
</div>
|
|
}
|
|
@if (savingsAccountNominee?.isDependent) {
|
|
<div class="preview-field">
|
|
<span class="preview-label">Dependent</span>
|
|
<span class="preview-value preview-badge preview-badge--warn">Yes</span>
|
|
</div>
|
|
}
|
|
@if (savingsAccountNominee?.guardianName) {
|
|
<div class="preview-field">
|
|
<span class="preview-label">Guardian Name</span>
|
|
<span class="preview-value">{{ savingsAccountNominee?.guardianName }}</span>
|
|
</div>
|
|
}
|
|
@if (savingsAccountNominee?.guardianRelationship) {
|
|
<div class="preview-field">
|
|
<span class="preview-label">Guardian Relationship</span>
|
|
<span class="preview-value">{{ savingsAccountNominee?.guardianRelationship }}</span>
|
|
</div>
|
|
}
|
|
@if (savingsAccountNominee?.remarks) {
|
|
<div class="preview-field">
|
|
<span class="preview-label">Remarks</span>
|
|
<span class="preview-value">{{ savingsAccountNominee?.remarks }}</span>
|
|
</div>
|
|
}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
}
|
|
|
|
<!-- ══ 5. Digital Facilities ════════════════════════════════════ -->
|
|
@if (hasDigitalSection) {
|
|
<div class="preview-section">
|
|
<div class="preview-section__header">
|
|
<i class="fas fa-mobile-alt preview-section__icon"></i>
|
|
<span class="preview-section__title">Digital Facilities</span>
|
|
<span class="preview-section__badge preview-section__badge--digital">User Configured</span>
|
|
</div>
|
|
<div class="preview-body">
|
|
<div class="preview-digital-grid">
|
|
@for (facility of digitalFacilityLabels; track facility.key) {
|
|
<div class="preview-digital-card" [class.preview-digital-card--on]="digitalFacilityConfig?.[facility.key]">
|
|
<span class="preview-digital-label">{{ facility.label }}</span>
|
|
<span
|
|
class="preview-digital-status"
|
|
[class.preview-digital-status--on]="digitalFacilityConfig?.[facility.key]"
|
|
>
|
|
{{ digitalFacilityConfig?.[facility.key] ? 'Enabled' : 'Disabled' }}
|
|
</span>
|
|
</div>
|
|
}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
}
|
|
|
|
<!-- ══ 6. Client Members (GSIM) ═════════════════════════════════ -->
|
|
@if (activeClientMembers) {
|
|
<div class="preview-section">
|
|
<div class="preview-section__header">
|
|
<i class="fas fa-users preview-section__icon"></i>
|
|
<span class="preview-section__title">{{ 'labels.heading.Client Members' | translate }}</span>
|
|
</div>
|
|
<div class="preview-body">
|
|
<table class="mat-elevation-z1 preview-table" mat-table #membersTable [dataSource]="dataSource">
|
|
<ng-container matColumnDef="id">
|
|
<th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Client ID' | translate }}</th>
|
|
<td mat-cell *matCellDef="let element">{{ element.id }}</td>
|
|
</ng-container>
|
|
<ng-container matColumnDef="name">
|
|
<th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Client Name' | translate }}</th>
|
|
<td mat-cell *matCellDef="let element">{{ element.displayName }}</td>
|
|
</ng-container>
|
|
<tr mat-header-row *matHeaderRowDef="membersDisplayedColumns"></tr>
|
|
<tr mat-row *matRowDef="let row; columns: membersDisplayedColumns"></tr>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
}
|
|
</div>
|
|
|
|
<div class="layout-row responsive-column align-center gap-2px margin-t">
|
|
<button mat-raised-button matStepperPrevious>
|
|
<fa-icon icon="arrow-left" class="m-r-10"></fa-icon>
|
|
{{ 'labels.buttons.Previous' | translate }}
|
|
</button>
|
|
<button mat-raised-button [routerLink]="['../..']">
|
|
{{ 'labels.buttons.Cancel' | translate }}
|
|
</button>
|
|
<button mat-raised-button color="primary" (click)="submitEvent.emit()">
|
|
{{ 'labels.buttons.Submit' | translate }}
|
|
</button>
|
|
</div>
|