existing account saving and current add or remove nominee and digital & account features and also FE & RD nominee add or remove
This commit is contained in:
keshav898966
+176
@@ -0,0 +1,176 @@
|
||||
<!--
|
||||
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="csa-container mat-typography">
|
||||
<!-- Hero -->
|
||||
<div class="csa-header">
|
||||
<fa-icon icon="university" class="csa-header__icon"></fa-icon>
|
||||
<div>
|
||||
<h2 class="csa-header__title">Modify Current Account Features</h2>
|
||||
<div class="csa-header__sub">Review account, manage nominees and digital features before submit.</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@if (pendingEditLoading) {
|
||||
<div class="esf-loading">
|
||||
<mat-progress-spinner diameter="20" mode="indeterminate"></mat-progress-spinner>
|
||||
<span>Checking for pending edits...</span>
|
||||
</div>
|
||||
}
|
||||
|
||||
@if (!pendingEditLoading && hasPendingEdit) {
|
||||
<div class="esf-pending-banner">
|
||||
<mat-icon>hourglass_top</mat-icon>
|
||||
<div class="esf-pending-banner__text">
|
||||
<strong>An edit is already pending approval for this account.</strong>
|
||||
<span>
|
||||
Submitted by {{ pendingEdit.makerUsername || 'a maker' }} on {{ pendingEdit.createdOn | dateFormat }}. Status:
|
||||
<span class="esf-pending-banner__status">{{ pendingEdit.status }}</span>
|
||||
@if (pendingEdit.holdAmount) {
|
||||
· Hold placed: {{ pendingEdit.holdAmount }}
|
||||
}
|
||||
</span>
|
||||
<span>You cannot submit another edit until this one is approved or rejected.</span>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
@if (!pendingEditLoading) {
|
||||
<!-- Wizard tabs -->
|
||||
<mat-tab-group
|
||||
class="csa-tabs"
|
||||
animationDuration="200ms"
|
||||
[preserveContent]="true"
|
||||
[(selectedIndex)]="selectedTabIndex"
|
||||
>
|
||||
<!-- Tab 1: Product Classification + Details -->
|
||||
<mat-tab>
|
||||
<ng-template mat-tab-label>
|
||||
<fa-icon icon="check-square" class="csa-tab__icon"></fa-icon>
|
||||
Product
|
||||
</ng-template>
|
||||
<div class="csa-tab-body">
|
||||
<mifosx-current-account-details-step
|
||||
[currentAccountTemplate]="currentAccountAndTemplate"
|
||||
(currentAccountProductTemplate)="setTemplate($event)"
|
||||
[readOnly]="true"
|
||||
>
|
||||
</mifosx-current-account-details-step>
|
||||
|
||||
<div class="csa-actions">
|
||||
<span class="csa-actions__spacer"></span>
|
||||
<button mat-raised-button color="primary" [disabled]="!currentAccountProductTemplate" (click)="next()">
|
||||
{{ 'labels.buttons.Next' | translate }}
|
||||
<fa-icon icon="arrow-right" class="m-l-10"></fa-icon>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</mat-tab>
|
||||
|
||||
<!-- Tab 2: Currency -->
|
||||
<mat-tab [disabled]="!currentAccountProductTemplate">
|
||||
<ng-template mat-tab-label>
|
||||
<fa-icon icon="dollar-sign" class="csa-tab__icon"></fa-icon>
|
||||
Currency
|
||||
</ng-template>
|
||||
<div class="csa-tab-body">
|
||||
@if (currentAccountProductTemplate) {
|
||||
<mifosx-current-account-currency-step
|
||||
[currentAccountProductTemplate]="currentAccountProductTemplate"
|
||||
[primaryClientId]="currentAccountAndTemplate?.clientId ?? null"
|
||||
[isNonIndividualClient]="currentAccountDetailsStep?.isNonIndividualClient ?? false"
|
||||
[existingAccount]="currentAccountAndTemplate"
|
||||
[nominationOnly]="true"
|
||||
></mifosx-current-account-currency-step>
|
||||
}
|
||||
|
||||
<div class="csa-actions">
|
||||
<button mat-stroked-button (click)="prev()">
|
||||
<fa-icon icon="arrow-left" class="m-r-10"></fa-icon>
|
||||
{{ 'labels.buttons.Previous' | translate }}
|
||||
</button>
|
||||
<span class="csa-actions__spacer"></span>
|
||||
<button mat-raised-button color="primary" (click)="next()">
|
||||
{{ 'labels.buttons.Next' | translate }}
|
||||
<fa-icon icon="arrow-right" class="m-l-10"></fa-icon>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</mat-tab>
|
||||
|
||||
<!-- Tab 3: Digital -->
|
||||
<mat-tab [disabled]="!currentAccountProductTemplate">
|
||||
<ng-template mat-tab-label>
|
||||
<fa-icon icon="mobile-alt" class="csa-tab__icon"></fa-icon>
|
||||
Digital
|
||||
</ng-template>
|
||||
<div class="csa-tab-body">
|
||||
@if (currentAccountProductTemplate) {
|
||||
<mifosx-current-account-digital-step
|
||||
[currentAccountProductTemplate]="currentAccountProductTemplate"
|
||||
[existingAccount]="currentAccountAndTemplate"
|
||||
></mifosx-current-account-digital-step>
|
||||
}
|
||||
|
||||
<div class="csa-actions">
|
||||
<button mat-stroked-button (click)="prev()">
|
||||
<fa-icon icon="arrow-left" class="m-r-10"></fa-icon>
|
||||
{{ 'labels.buttons.Previous' | translate }}
|
||||
</button>
|
||||
<span class="csa-actions__spacer"></span>
|
||||
<button mat-raised-button color="primary" (click)="next()">
|
||||
{{ 'labels.buttons.Next' | translate }}
|
||||
<fa-icon icon="arrow-right" class="m-l-10"></fa-icon>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</mat-tab>
|
||||
|
||||
<!-- Tab 4: Preview / Submit -->
|
||||
<mat-tab [disabled]="!currentAccountProductTemplate">
|
||||
<ng-template mat-tab-label>
|
||||
<fa-icon icon="eye" class="csa-tab__icon"></fa-icon>
|
||||
{{ 'labels.inputs.PREVIEW' | translate }}
|
||||
</ng-template>
|
||||
<div class="csa-tab-body">
|
||||
@if (currentAccountProductTemplate) {
|
||||
<mifosx-current-account-preview-step
|
||||
[currentAccountProductTemplate]="currentAccountProductTemplate"
|
||||
[currentAccountTemplate]="currentAccountAndTemplate"
|
||||
[currentAccountTermForm]="currentAccountTermForm"
|
||||
[currentAccountSettingsForm]="currentAccountSettingsForm"
|
||||
[currentAccountTermsForm]="currentAccountTermsForm"
|
||||
[currentAccount]="currentAccount"
|
||||
[currentAccountDigital]="currentAccountDigital"
|
||||
[currentAccountNominees]="currentAccountCurrencyStep?.nominees ?? []"
|
||||
[currentAccountCurrencyFlags]="currentAccountCurrencyFlags"
|
||||
[hideButtons]="true"
|
||||
(submitEvent)="submit()"
|
||||
>
|
||||
</mifosx-current-account-preview-step>
|
||||
}
|
||||
|
||||
<div class="csa-actions">
|
||||
<button mat-stroked-button (click)="prev()">
|
||||
<fa-icon icon="arrow-left" class="m-r-10"></fa-icon>
|
||||
{{ 'labels.buttons.Previous' | translate }}
|
||||
</button>
|
||||
<span class="csa-actions__spacer"></span>
|
||||
<button mat-stroked-button type="button" (click)="cancel()">Cancel</button>
|
||||
<button mat-raised-button color="primary" type="button" [disabled]="!canSubmit" (click)="submit()">
|
||||
@if (submitting) {
|
||||
<mat-progress-spinner diameter="18" mode="indeterminate"></mat-progress-spinner>
|
||||
} @else {
|
||||
<mat-icon>send</mat-icon> Submit for Approval
|
||||
}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</mat-tab>
|
||||
</mat-tab-group>
|
||||
}
|
||||
</div>
|
||||
+206
@@ -0,0 +1,206 @@
|
||||
/**
|
||||
* 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/.
|
||||
*/
|
||||
|
||||
$border: #e2e8f0;
|
||||
$muted: #64748b;
|
||||
$amber: #92400e;
|
||||
$amber-bg: #fffbeb;
|
||||
$amber-border: #fde68a;
|
||||
|
||||
.esf-loading {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding: 20px 0;
|
||||
justify-content: center;
|
||||
font-size: 13px;
|
||||
color: $muted;
|
||||
|
||||
&--sm {
|
||||
padding: 10px 0;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
}
|
||||
|
||||
.esf-pending-banner {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 10px;
|
||||
padding: 12px 16px;
|
||||
background: $amber-bg;
|
||||
border: 1px solid $amber-border;
|
||||
border-radius: 8px;
|
||||
margin-bottom: 16px;
|
||||
color: $amber;
|
||||
|
||||
mat-icon {
|
||||
flex: 0 0 auto;
|
||||
}
|
||||
|
||||
&__text {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 2px;
|
||||
font-size: 12.5px;
|
||||
|
||||
strong {
|
||||
font-size: 13px;
|
||||
}
|
||||
}
|
||||
|
||||
&__status {
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
}
|
||||
|
||||
/* ─── CSA Stepper Styles ─── */
|
||||
$navy: #0d1b2a;
|
||||
$blue: #1e88e5;
|
||||
$blue-d: #1e40af;
|
||||
$indigo: #4f46e5;
|
||||
|
||||
.csa-container {
|
||||
max-width: 1180px;
|
||||
margin: 0 auto;
|
||||
padding: 20px 24px;
|
||||
}
|
||||
|
||||
.csa-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
margin-bottom: 16px;
|
||||
|
||||
&__icon {
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 12px;
|
||||
background: linear-gradient(135deg, $blue 0%, $indigo 100%);
|
||||
color: #fff;
|
||||
font-size: 18px;
|
||||
box-shadow: 0 2px 8px rgb(29 78 216 / 25%);
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
&__title {
|
||||
margin: 0;
|
||||
font-size: 20px;
|
||||
font-weight: 800;
|
||||
color: $navy;
|
||||
line-height: 1.1;
|
||||
letter-spacing: 0.02em;
|
||||
}
|
||||
|
||||
&__sub {
|
||||
margin-top: 2px;
|
||||
font-size: 12.5px;
|
||||
color: #64748b;
|
||||
}
|
||||
}
|
||||
|
||||
.csa-tabs {
|
||||
background: #fff;
|
||||
border: 1px solid $border;
|
||||
border-radius: 14px;
|
||||
box-shadow: 0 1px 3px rgb(15 23 42 / 4%);
|
||||
overflow: hidden;
|
||||
|
||||
::ng-deep {
|
||||
.mat-mdc-tab-header {
|
||||
background: #f8fafc;
|
||||
border-bottom: 1px solid $border;
|
||||
}
|
||||
|
||||
.mat-mdc-tab {
|
||||
min-width: 140px;
|
||||
height: 50px;
|
||||
padding: 0 22px;
|
||||
font-size: 13px !important;
|
||||
font-weight: 600 !important;
|
||||
letter-spacing: 0.01em;
|
||||
color: #475569 !important;
|
||||
opacity: 1 !important;
|
||||
}
|
||||
|
||||
.mat-mdc-tab:hover:not(.mdc-tab--active, .mat-mdc-tab-disabled) {
|
||||
background: rgb(30 64 175 / 5%);
|
||||
color: $navy !important;
|
||||
}
|
||||
|
||||
.mat-mdc-tab.mat-mdc-tab-active {
|
||||
.mdc-tab__text-label {
|
||||
color: $blue-d !important;
|
||||
font-weight: 700 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.mdc-tab-indicator__content--underline {
|
||||
border-color: $blue-d !important;
|
||||
border-top-width: 3px !important;
|
||||
}
|
||||
|
||||
.mat-mdc-tab.mat-mdc-tab-disabled {
|
||||
opacity: 0.45 !important;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.mat-mdc-tab-body-wrapper {
|
||||
min-height: 320px;
|
||||
}
|
||||
|
||||
.mat-mdc-tab-body,
|
||||
.mat-mdc-tab-body-content {
|
||||
overflow: visible !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.csa-tab__icon {
|
||||
margin-right: 8px;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.csa-tab-body {
|
||||
padding: 24px;
|
||||
|
||||
@media (width <= 768px) {
|
||||
padding: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.csa-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
margin-top: 24px;
|
||||
padding-top: 16px;
|
||||
border-top: 1px solid #f1f5f9;
|
||||
|
||||
&__spacer {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
button {
|
||||
height: 40px !important;
|
||||
border-radius: 10px !important;
|
||||
font-weight: 600 !important;
|
||||
padding: 0 18px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.m-l-10 {
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.m-r-10 {
|
||||
margin-right: 8px;
|
||||
}
|
||||
+417
@@ -0,0 +1,417 @@
|
||||
/**
|
||||
* 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/.
|
||||
*/
|
||||
|
||||
/** Angular Imports */
|
||||
import { Component, inject, ViewChild } from '@angular/core';
|
||||
import { ActivatedRoute, Router } from '@angular/router';
|
||||
import { FormsModule, FormGroup } from '@angular/forms';
|
||||
import { MatDialog } from '@angular/material/dialog';
|
||||
import { MatIcon } from '@angular/material/icon';
|
||||
import { MatProgressSpinner } from '@angular/material/progress-spinner';
|
||||
import { FaIconComponent } from '@fortawesome/angular-fontawesome';
|
||||
import { MatTabsModule } from '@angular/material/tabs';
|
||||
import { CurrentAccountDetailsStepComponent } from '../current-account-stepper/current-account-details-step/current-account-details-step.component';
|
||||
import { CurrentAccountCurrencyStepComponent } from '../current-account-stepper/current-account-currency-step/current-account-currency-step.component';
|
||||
import { CurrentAccountDigitalStepComponent } from '../current-account-stepper/current-account-digital-step/current-account-digital-step.component';
|
||||
import { CurrentAccountPreviewStepComponent } from '../current-account-stepper/current-account-preview-step/current-account-preview-step.component';
|
||||
|
||||
/** Custom Services */
|
||||
import { CurrentAccountsService } from '../current-accounts.service';
|
||||
import { ClientsService } from 'app/clients/clients.service';
|
||||
import { SettingsService } from 'app/settings/settings.service';
|
||||
import { SuccessDialogComponent } from 'app/shared/success-dialog/success-dialog.component';
|
||||
import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
|
||||
|
||||
/** Default state for every Digital & Account Feature toggle, mirrors
|
||||
* current-account-digital-step's DEFAULT_FACILITY_CONFIG. */
|
||||
const DEFAULT_FACILITY_CONFIG: Record<string, boolean> = {
|
||||
atmFacility: false,
|
||||
atmWithdrawalFacility: false,
|
||||
upiFacility: false,
|
||||
posTransactionsFacility: false,
|
||||
chequeBook: false,
|
||||
impsFacility: false,
|
||||
smsAlerts: false,
|
||||
bbpsFacility: false,
|
||||
insuranceCover: false,
|
||||
bepgFacility: false,
|
||||
neftFacility: false,
|
||||
rtgsFacility: false,
|
||||
interBankTotalCapFacility: false,
|
||||
withdrawalFacility: false,
|
||||
depositFacilityKyc: false,
|
||||
virtualDebitCard: false,
|
||||
internetBanking: false,
|
||||
mobileBanking: false
|
||||
};
|
||||
|
||||
/** Toggle metadata used to render the feature grid — key must match a
|
||||
* property of DEFAULT_FACILITY_CONFIG / the backend's accountFacilityConfig map. */
|
||||
const FACILITY_TOGGLES: { key: string; label: string; icon: string }[] = [
|
||||
{ key: 'atmFacility', label: 'ATM Facility', icon: 'fa-credit-card' },
|
||||
{ key: 'atmWithdrawalFacility', label: 'ATM Withdrawal', icon: 'fa-wallet' },
|
||||
{ key: 'upiFacility', label: 'UPI Facility', icon: 'fa-mobile-alt' },
|
||||
{ key: 'posTransactionsFacility', label: 'POS Transactions', icon: 'fa-exchange-alt' },
|
||||
{ key: 'chequeBook', label: 'Cheque Book', icon: 'fa-book' },
|
||||
{ key: 'impsFacility', label: 'IMPS Facility', icon: 'fa-bolt' },
|
||||
{ key: 'smsAlerts', label: 'SMS Alerts', icon: 'fa-sms' },
|
||||
{ key: 'bbpsFacility', label: 'BBPS Facility', icon: 'fa-bell' },
|
||||
{ key: 'insuranceCover', label: 'Insurance Cover', icon: 'fa-shield-alt' },
|
||||
{ key: 'bepgFacility', label: 'BEPG Facility', icon: 'fa-plug' },
|
||||
{ key: 'neftFacility', label: 'NEFT Facility', icon: 'fa-money-check-alt' },
|
||||
{ key: 'rtgsFacility', label: 'RTGS Facility', icon: 'fa-money-check' },
|
||||
{ key: 'interBankTotalCapFacility', label: 'Inter-Bank Total Cap', icon: 'fa-balance-scale' },
|
||||
{ key: 'withdrawalFacility', label: 'Withdrawal Facility', icon: 'fa-arrow-right-arrow-left' },
|
||||
{ key: 'depositFacilityKyc', label: 'Deposit Facility (KYC)', icon: 'fa-id-card' },
|
||||
{ key: 'virtualDebitCard', label: 'Virtual Debit Card', icon: 'fa-credit-card' },
|
||||
{ key: 'internetBanking', label: 'Internet Banking', icon: 'fa-globe' },
|
||||
{ key: 'mobileBanking', label: 'Mobile Banking', icon: 'fa-mobile-screen-button' }
|
||||
];
|
||||
|
||||
/**
|
||||
* Edit Nominee & Features — maker-checker submission screen.
|
||||
*
|
||||
* A maker proposes changes to a current account's Digital & Account Features toggles and/or its
|
||||
* nominee here; nothing is applied immediately. The request is staged and a different user (checker)
|
||||
* must approve it from the "Pending Current Account Edits" screen before it takes effect.
|
||||
*/
|
||||
@Component({
|
||||
selector: 'mifosx-edit-current-account-features',
|
||||
templateUrl: './edit-current-account-features.component.html',
|
||||
styleUrls: ['./edit-current-account-features.component.scss'],
|
||||
imports: [
|
||||
...STANDALONE_SHARED_IMPORTS,
|
||||
FormsModule,
|
||||
FaIconComponent,
|
||||
MatIcon,
|
||||
MatProgressSpinner,
|
||||
MatTabsModule,
|
||||
CurrentAccountDetailsStepComponent,
|
||||
CurrentAccountCurrencyStepComponent,
|
||||
CurrentAccountDigitalStepComponent,
|
||||
CurrentAccountPreviewStepComponent
|
||||
]
|
||||
})
|
||||
export class EditCurrentAccountFeaturesComponent {
|
||||
private route = inject(ActivatedRoute);
|
||||
private router = inject(Router);
|
||||
private currentAccountsService = inject(CurrentAccountsService);
|
||||
private clientsService = inject(ClientsService);
|
||||
private settingsService = inject(SettingsService);
|
||||
private dialog = inject(MatDialog);
|
||||
|
||||
@ViewChild(CurrentAccountDetailsStepComponent) currentAccountDetailsStep: CurrentAccountDetailsStepComponent;
|
||||
@ViewChild(CurrentAccountCurrencyStepComponent) currentAccountCurrencyStep: CurrentAccountCurrencyStepComponent;
|
||||
@ViewChild(CurrentAccountDigitalStepComponent) currentAccountDigitalStep: CurrentAccountDigitalStepComponent;
|
||||
|
||||
originalNominees: any[] = [];
|
||||
|
||||
get currentAccountTermForm(): FormGroup {
|
||||
return new FormGroup({});
|
||||
}
|
||||
|
||||
get currentAccountSettingsForm(): FormGroup {
|
||||
return new FormGroup({});
|
||||
}
|
||||
|
||||
get currentAccountTermsForm(): FormGroup {
|
||||
return new FormGroup({});
|
||||
}
|
||||
|
||||
get currentAccount() {
|
||||
return this.currentAccountDetailsStep ? { ...this.currentAccountDetailsStep.currentAccountDetails } : null;
|
||||
}
|
||||
|
||||
get currentAccountDigital() {
|
||||
return this.currentAccountDigitalStep?.currentAccountDigital ?? null;
|
||||
}
|
||||
|
||||
get currentAccountCurrencyFlags() {
|
||||
return {
|
||||
balanceSwapOption: this.currentAccountCurrencyStep?.balanceSwapOption ?? false,
|
||||
msme: this.currentAccountCurrencyStep?.msme ?? false,
|
||||
autoDebitFacility: this.currentAccountCurrencyStep?.autoDebitFacility ?? false
|
||||
};
|
||||
}
|
||||
|
||||
readonly toggles = FACILITY_TOGGLES;
|
||||
|
||||
accountId: string;
|
||||
currentAccountAndTemplate: any;
|
||||
clientId = '';
|
||||
accountNo = '';
|
||||
|
||||
currentAccountProductTemplate: any = null;
|
||||
selectedTabIndex = 0;
|
||||
readonly totalTabs = 4;
|
||||
|
||||
originalFacilityConfig: Record<string, boolean> = { ...DEFAULT_FACILITY_CONFIG };
|
||||
|
||||
/** Current nominees on the account, fetched read-only for reference. */
|
||||
nominees: any[] = [];
|
||||
nomineesLoading = false;
|
||||
relationshipOptions: any[] = [];
|
||||
|
||||
/** Pending edit already submitted for this account, if any. */
|
||||
pendingEdit: any = null;
|
||||
pendingEditLoading = true;
|
||||
|
||||
submitting = false;
|
||||
|
||||
constructor() {
|
||||
this.accountId = this.route.snapshot.params['currentAccountId'];
|
||||
this.loadPendingEdit();
|
||||
this.route.data.subscribe((data: { currentAccountAndTemplate: any }) => {
|
||||
const account = data.currentAccountAndTemplate;
|
||||
this.currentAccountAndTemplate = account;
|
||||
this.clientId = account?.clientId != null ? String(account.clientId) : '';
|
||||
this.accountNo = account?.accountNo || '';
|
||||
this.originalFacilityConfig = { ...DEFAULT_FACILITY_CONFIG, ...(account?.accountFacilityConfig || {}) };
|
||||
if (this.clientId) {
|
||||
this.loadNominees();
|
||||
this.loadRelationshipTemplate();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
private todayIso(): string {
|
||||
const d = new Date();
|
||||
const pad = (n: number) => String(n).padStart(2, '0');
|
||||
return `${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())}`;
|
||||
}
|
||||
|
||||
private loadPendingEdit(): void {
|
||||
this.pendingEditLoading = true;
|
||||
this.currentAccountsService.getPendingCurrentAccountEdit(this.accountId).subscribe({
|
||||
next: (edit: any) => {
|
||||
this.pendingEdit = edit && edit.id ? edit : null;
|
||||
this.pendingEditLoading = false;
|
||||
},
|
||||
error: () => {
|
||||
this.pendingEdit = null;
|
||||
this.pendingEditLoading = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
private loadNominees(): void {
|
||||
this.nomineesLoading = true;
|
||||
this.clientsService.getClientNominees(this.clientId, this.accountNo, 'CB').subscribe({
|
||||
next: (data: any) => {
|
||||
this.nominees = Array.isArray(data) ? data : [];
|
||||
this.originalNominees = JSON.parse(JSON.stringify(this.nominees));
|
||||
this.nomineesLoading = false;
|
||||
},
|
||||
error: () => {
|
||||
this.nominees = [];
|
||||
this.originalNominees = [];
|
||||
this.nomineesLoading = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
private loadRelationshipTemplate(): void {
|
||||
this.clientsService.getClientNomineeTemplate(this.clientId).subscribe({
|
||||
next: (template: any) => {
|
||||
this.relationshipOptions = template?.relationshipOptions || [];
|
||||
},
|
||||
error: () => {
|
||||
this.relationshipOptions = [];
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
get hasPendingEdit(): boolean {
|
||||
return !!this.pendingEdit && this.pendingEdit.status === 'PENDING';
|
||||
}
|
||||
|
||||
get facilityConfig(): Record<string, boolean> {
|
||||
return this.currentAccountDigitalStep?.facilityConfig ?? this.originalFacilityConfig;
|
||||
}
|
||||
|
||||
get facilityChanged(): boolean {
|
||||
const config = this.facilityConfig;
|
||||
return this.toggles.some((t) => config[t.key] !== this.originalFacilityConfig[t.key]);
|
||||
}
|
||||
|
||||
get changedToggles(): any[] {
|
||||
const list: any[] = [];
|
||||
const config = this.facilityConfig;
|
||||
this.toggles.forEach((t) => {
|
||||
if (config[t.key] !== this.originalFacilityConfig[t.key]) {
|
||||
list.push({
|
||||
label: t.label,
|
||||
from: this.originalFacilityConfig[t.key],
|
||||
to: config[t.key]
|
||||
});
|
||||
}
|
||||
});
|
||||
return list;
|
||||
}
|
||||
|
||||
get nomineeChanged(): boolean {
|
||||
return this.buildNomineePayload() !== null;
|
||||
}
|
||||
|
||||
get canSubmit(): boolean {
|
||||
return (
|
||||
!this.hasPendingEdit &&
|
||||
!this.pendingEditLoading &&
|
||||
!this.submitting &&
|
||||
(this.facilityChanged || this.nomineeChanged)
|
||||
);
|
||||
}
|
||||
|
||||
setTemplate($event: any): void {
|
||||
this.currentAccountProductTemplate = $event;
|
||||
}
|
||||
|
||||
next(): void {
|
||||
if (this.selectedTabIndex < this.totalTabs - 1) {
|
||||
this.selectedTabIndex += 1;
|
||||
}
|
||||
}
|
||||
|
||||
prev(): void {
|
||||
if (this.selectedTabIndex > 0) {
|
||||
this.selectedTabIndex -= 1;
|
||||
}
|
||||
}
|
||||
|
||||
getRelationshipName(relationshipId: any): string {
|
||||
const opt = this.relationshipOptions.find((r: any) => r.id === relationshipId);
|
||||
return opt?.name || '';
|
||||
}
|
||||
|
||||
private buildFacilityDiff(): Record<string, boolean> | null {
|
||||
const diff: Record<string, boolean> = {};
|
||||
let changed = false;
|
||||
const config = this.facilityConfig;
|
||||
this.toggles.forEach((t) => {
|
||||
if (config[t.key] !== this.originalFacilityConfig[t.key]) {
|
||||
diff[t.key] = config[t.key];
|
||||
changed = true;
|
||||
}
|
||||
});
|
||||
return changed ? diff : null;
|
||||
}
|
||||
|
||||
private buildNomineePayload(): any | null {
|
||||
const original = this.originalNominees || [];
|
||||
const current = this.currentAccountCurrencyStep?.nominees ?? [];
|
||||
|
||||
// Find if a nominee has been added
|
||||
const added = current.find(
|
||||
(curr: any) => !original.some((orig: any) => orig.id === curr.id || orig.nomineeClientId === curr.nomineeClientId)
|
||||
);
|
||||
if (added) {
|
||||
return {
|
||||
operation: 'ADD',
|
||||
nomineeId: null,
|
||||
nomineeClientId: added.nomineeClientId,
|
||||
relationshipId: added.relationshipId,
|
||||
percentageShare: added.percentageShare,
|
||||
isActive: added.isActive !== undefined ? !!added.isActive : true,
|
||||
nomineeIsMinor: !!added.nomineeIsMinor,
|
||||
guardianClientId: added.nomineeIsMinor ? added.guardianClientId : null,
|
||||
guardianRelationshipId: added.nomineeIsMinor ? added.guardianRelationshipId : null,
|
||||
effectiveDate: this.todayIso(),
|
||||
remarks: added.remarks || null
|
||||
};
|
||||
}
|
||||
|
||||
// Find if a nominee has been deleted
|
||||
const deleted = original.find(
|
||||
(orig: any) => !current.some((curr: any) => curr.id === orig.id || curr.nomineeClientId === orig.nomineeClientId)
|
||||
);
|
||||
if (deleted) {
|
||||
return {
|
||||
operation: 'DELETE',
|
||||
nomineeId: deleted.id
|
||||
};
|
||||
}
|
||||
|
||||
// Find if any nominee has been updated
|
||||
for (const curr of current) {
|
||||
const orig = original.find((o: any) => o.id === curr.id || o.nomineeClientId === curr.nomineeClientId);
|
||||
if (orig) {
|
||||
const relChanged = orig.relationshipId !== curr.relationshipId;
|
||||
const shareChanged = +orig.percentageShare !== +curr.percentageShare;
|
||||
const minorChanged = !!orig.nomineeIsMinor !== !!curr.nomineeIsMinor;
|
||||
const guardianChanged =
|
||||
orig.guardianClientId !== curr.guardianClientId ||
|
||||
orig.guardianRelationshipId !== curr.guardianRelationshipId;
|
||||
const activeChanged = !!orig.isActive !== (curr.isActive !== undefined ? !!curr.isActive : true);
|
||||
const remarksChanged = (orig.remarks || '') !== (curr.remarks || '');
|
||||
|
||||
if (relChanged || shareChanged || minorChanged || guardianChanged || activeChanged || remarksChanged) {
|
||||
return {
|
||||
operation: 'UPDATE',
|
||||
nomineeId: orig.id,
|
||||
relationshipId: curr.relationshipId,
|
||||
percentageShare: curr.percentageShare,
|
||||
isActive: curr.isActive !== undefined ? !!curr.isActive : true,
|
||||
nomineeIsMinor: !!curr.nomineeIsMinor,
|
||||
guardianClientId: curr.nomineeIsMinor ? curr.guardianClientId : null,
|
||||
guardianRelationshipId: curr.nomineeIsMinor ? curr.guardianRelationshipId : null,
|
||||
effectiveDate: this.todayIso(),
|
||||
remarks: curr.remarks || null
|
||||
};
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
submit(): void {
|
||||
if (!this.canSubmit) return;
|
||||
|
||||
const locale = this.settingsService.language.code;
|
||||
const payload: any = { locale, dateFormat: 'yyyy-MM-dd' };
|
||||
|
||||
const facilityDiff = this.buildFacilityDiff();
|
||||
if (facilityDiff) {
|
||||
payload.accountFacilityConfig = facilityDiff;
|
||||
}
|
||||
|
||||
const nomineePayload = this.buildNomineePayload();
|
||||
if (nomineePayload) {
|
||||
payload.nominee = nomineePayload;
|
||||
}
|
||||
|
||||
this.submitting = true;
|
||||
this.currentAccountsService.submitCurrentAccountEdit(this.accountId, payload).subscribe({
|
||||
next: () => {
|
||||
this.submitting = false;
|
||||
this.showSuccess();
|
||||
},
|
||||
error: () => {
|
||||
this.submitting = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
private showSuccess(): void {
|
||||
const ref = this.dialog.open(SuccessDialogComponent, {
|
||||
width: '420px',
|
||||
maxWidth: '92vw',
|
||||
autoFocus: false,
|
||||
data: {
|
||||
title: 'Submitted for Approval',
|
||||
message: 'Your changes have been submitted and are awaiting checker approval.',
|
||||
buttonLabel: 'Done'
|
||||
}
|
||||
});
|
||||
ref.afterClosed().subscribe(() => this.cancel());
|
||||
}
|
||||
|
||||
cancel(): void {
|
||||
this.router.navigate(['../'], { relativeTo: this.route });
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user