feat(tasks,savings,cashier): facility charge mapping screen, chained approve+activate, popup diff dialog, cash/transfer-only teller flow

Adds a Products > Facility Charge Mappings screen so each of the 16 facility
toggles can be pointed at a real charge, backing the mapped-charge validation
added on the backend. Bulk-approve on the pending accounts screen now chains
straight into activation (matching the single-account approve flow) instead
of leaving accounts sitting in Approved; the same screen's Confirm button no
longer stays disabled on pre-filled but untouched dialogs. Add Charge is
hidden on not-yet-active savings accounts, and Transfer Funds is disabled
entirely pending a proper transfer flow. The pending savings-account edit
"Proposed Changes" panel is now a MatDialog showing only the fields that
actually changed, replacing the old always-open inline diff table. The teller
transaction-entry Payment Type dropdown is filtered to Cash/Transfer only,
mirroring the backend's retirement of the other system-defined payment types
so share withdrawal and GL transfers now settle the same way real transfers
do.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

src/app/products/facility-charge-mappings/edit-facility-charge-mapping-dialog/edit-facility-charge-mapping-dialog.component.html

@@ -0,0 +1,53 @@
+<!--
+  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/.
+-->
+
+<h2 mat-dialog-title>{{ 'labels.heading.Edit Facility Charge Mapping' | translate }}</h2>
+
+<mat-dialog-content>
+  <form [formGroup]="editMappingForm" class="efcm-form">
+    <mat-form-field appearance="outline" class="efcm-field">
+      <mat-label>{{ 'labels.inputs.Charge' | translate }}</mat-label>
+      <mat-select required formControlName="chargeId">
+        @for (charge of data.chargeOptions; track charge.id) {
+          <mat-option [value]="charge.id">{{ charge.name }} ({{ charge.amount }})</mat-option>
+        }
+      </mat-select>
+      @if (editMappingForm.controls.chargeId.hasError('required')) {
+        <mat-error>
+          {{ 'labels.inputs.Charge' | translate }} {{ 'labels.commons.is' | translate }}
+          <strong>{{ 'labels.commons.required' | translate }}</strong>
+        </mat-error>
+      }
+    </mat-form-field>
+
+    <div class="efcm-amount-readonly">
+      <span class="efcm-amount-readonly__label">{{ 'labels.inputs.Amount' | translate }}</span>
+      <span class="efcm-amount-readonly__value">
+        {{ selectedChargeAmount !== null ? selectedChargeAmount : '-' }}
+      </span>
+    </div>
+
+    <div class="efcm-checkbox-row">
+      <mat-checkbox formControlName="isActive" labelPosition="after">
+        {{ 'labels.inputs.Active' | translate }}
+      </mat-checkbox>
+    </div>
+  </form>
+</mat-dialog-content>
+
+<mat-dialog-actions align="end">
+  <button mat-stroked-button mat-dialog-close>{{ 'labels.buttons.Cancel' | translate }}</button>
+  <button
+    mat-flat-button
+    color="primary"
+    [disabled]="!editMappingForm.valid || editMappingForm.pristine"
+    (click)="submit()"
+  >
+    {{ 'labels.buttons.Submit' | translate }}
+  </button>
+</mat-dialog-actions>

src/app/products/facility-charge-mappings/edit-facility-charge-mapping-dialog/edit-facility-charge-mapping-dialog.component.scss

@@ -0,0 +1,40 @@
+/**
+ * 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/.
+ */
+.efcm-form {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  min-width: 340px;
+}
+
+.efcm-field {
+  width: 100%;
+}
+
+.efcm-checkbox-row {
+  margin: 4px 0 12px;
+}
+
+.efcm-amount-readonly {
+  display: flex;
+  align-items: baseline;
+  gap: 8px;
+  padding: 4px 0 12px;
+  color: rgb(0 0 0 / 60%);
+  font-size: 13px;
+
+  &__label {
+    font-weight: 500;
+  }
+
+  &__value {
+    font-size: 15px;
+    font-weight: 600;
+    color: rgb(0 0 0 / 87%);
+  }
+}

src/app/products/facility-charge-mappings/edit-facility-charge-mapping-dialog/edit-facility-charge-mapping-dialog.component.ts

@@ -0,0 +1,71 @@
+/**
+ * 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, OnInit, inject } from '@angular/core';
+import {
+  MAT_DIALOG_DATA,
+  MatDialogRef,
+  MatDialogTitle,
+  MatDialogContent,
+  MatDialogActions,
+  MatDialogClose
+} from '@angular/material/dialog';
+import { UntypedFormGroup, UntypedFormBuilder, Validators } from '@angular/forms';
+import { CdkScrollable } from '@angular/cdk/scrolling';
+import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
+
+/**
+ * Lets an admin change which charge a single facility (e.g. ATM_FACILITY) maps to. The amount charged is
+ * always the selected charge's own, live amount (see FacilityChargeAutoApplyService, which reads
+ * charge.getAmount() when applying it) -- shown here read-only for reference, not independently editable.
+ * To change the amount, edit the Charge itself under Products > Charges.
+ */
+@Component({
+  selector: 'mifosx-edit-facility-charge-mapping-dialog',
+  templateUrl: './edit-facility-charge-mapping-dialog.component.html',
+  styleUrls: ['./edit-facility-charge-mapping-dialog.component.scss'],
+  imports: [
+    ...STANDALONE_SHARED_IMPORTS,
+    MatDialogTitle,
+    CdkScrollable,
+    MatDialogContent,
+    MatDialogActions,
+    MatDialogClose
+  ]
+})
+export class EditFacilityChargeMappingDialogComponent implements OnInit {
+  dialogRef = inject<MatDialogRef<EditFacilityChargeMappingDialogComponent>>(MatDialogRef);
+  private formBuilder = inject(UntypedFormBuilder);
+  data = inject(MAT_DIALOG_DATA);
+
+  editMappingForm: UntypedFormGroup;
+
+  ngOnInit(): void {
+    this.editMappingForm = this.formBuilder.group({
+      chargeId: [
+        this.data.mapping.chargeId,
+        Validators.required
+      ],
+      // A facility with no charge mapped yet is being configured for the first time here -- default
+      // Active to checked so picking a charge and submitting is enough to make it usable immediately.
+      isActive: [this.data.mapping.chargeId ? this.data.mapping.isActive : true]
+    });
+  }
+
+  /** Amount of whichever charge is currently selected in the form -- updates live as the selection changes. */
+  get selectedChargeAmount(): number | null {
+    const selectedId = this.editMappingForm?.get('chargeId')?.value;
+    const selected = (this.data.chargeOptions || []).find((charge: any) => charge.id === selectedId);
+    return selected ? selected.amount : null;
+  }
+
+  submit(): void {
+    this.dialogRef.close(this.editMappingForm.value);
+  }
+}

src/app/products/facility-charge-mappings/facility-charge-mappings.component.html

@@ -0,0 +1,76 @@
+<!--
+  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="fcm-header">
+  <h1>{{ 'labels.heading.Facility Charge Mappings' | translate }}</h1>
+  <p class="fcm-header__sub">
+    {{
+      'labels.text.Which charge is applied when a facility (ATM, UPI, Cheque Book, ...) is enabled on an account'
+        | translate
+    }}
+  </p>
+</div>
+
+<div class="mat-elevation-z8 container">
+  <table mat-table [dataSource]="dataSource" matSort>
+    <ng-container matColumnDef="facilityType">
+      <th mat-header-cell *matHeaderCellDef mat-sort-header>{{ 'labels.inputs.Facility' | translate }}</th>
+      <td mat-cell *matCellDef="let mapping">{{ facilityLabel(mapping.facilityType) }}</td>
+    </ng-container>
+
+    <ng-container matColumnDef="chargeName">
+      <th mat-header-cell *matHeaderCellDef mat-sort-header>{{ 'labels.inputs.Mapped Charge' | translate }}</th>
+      <td mat-cell *matCellDef="let mapping">
+        {{ mapping.chargeName || '—' }}
+        @if (mapping.chargeId && !mapping.chargeAvailable) {
+          <span
+            class="fcm-broken-badge"
+            [matTooltip]="
+              'labels.text.This charge has been deleted or deactivated. Update the mapping to avoid errors when this facility is enabled.'
+                | translate
+            "
+          >
+            <i class="fas fa-exclamation-triangle"></i>
+            {{ 'labels.text.Deleted' | translate }}
+          </span>
+        }
+      </td>
+    </ng-container>
+
+    <ng-container matColumnDef="defaultAmount">
+      <th mat-header-cell *matHeaderCellDef mat-sort-header>{{ 'labels.inputs.Amount' | translate }}</th>
+      <td mat-cell *matCellDef="let mapping">{{ mapping.defaultAmount !== null ? mapping.defaultAmount : '—' }}</td>
+    </ng-container>
+
+    <ng-container matColumnDef="isActive">
+      <th mat-header-cell *matHeaderCellDef mat-sort-header>{{ 'labels.inputs.Active' | translate }}</th>
+      <td mat-cell *matCellDef="let mapping">
+        {{ (mapping.isActive ? 'labels.commons.Yes' : 'labels.commons.No') | translate }}
+      </td>
+    </ng-container>
+
+    <ng-container matColumnDef="actions">
+      <th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Actions' | translate }}</th>
+      <td mat-cell *matCellDef="let mapping">
+        <button
+          mat-stroked-button
+          color="primary"
+          *mifosxHasPermission="'UPDATE_FACILITYCHARGEMAPPING'"
+          (click)="editMapping(mapping)"
+        >
+          {{ 'labels.buttons.Edit' | translate }}
+        </button>
+      </td>
+    </ng-container>
+
+    <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
+    <tr mat-row *matRowDef="let row; columns: displayedColumns"></tr>
+  </table>
+
+  <mat-paginator [pageSizeOptions]="[10, 25]" showFirstLastButtons></mat-paginator>
+</div>

src/app/products/facility-charge-mappings/facility-charge-mappings.component.scss

@@ -0,0 +1,35 @@
+/**
+ * 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/.
+ */
+.fcm-header {
+  margin-bottom: 20px;
+
+  h1 {
+    margin: 0 0 4px;
+    font-size: 20px;
+    font-weight: 600;
+  }
+
+  &__sub {
+    margin: 0;
+    color: rgb(0 0 0 / 60%);
+    font-size: 13px;
+  }
+}
+
+.fcm-broken-badge {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  margin-left: 8px;
+  padding: 2px 8px;
+  border-radius: 10px;
+  background: rgb(211 47 47 / 10%);
+  color: #d32f2f;
+  font-size: 11px;
+  font-weight: 600;
+}

src/app/products/facility-charge-mappings/facility-charge-mappings.component.ts

@@ -0,0 +1,144 @@
+/**
+ * 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, OnInit, ViewChild, inject } from '@angular/core';
+import { MatPaginator } from '@angular/material/paginator';
+import { MatSort, MatSortHeader } from '@angular/material/sort';
+import {
+  MatTableDataSource,
+  MatTable,
+  MatColumnDef,
+  MatHeaderCellDef,
+  MatHeaderCell,
+  MatCellDef,
+  MatCell,
+  MatHeaderRowDef,
+  MatHeaderRow,
+  MatRowDef,
+  MatRow
+} from '@angular/material/table';
+import { ActivatedRoute } from '@angular/router';
+import { MatDialog } from '@angular/material/dialog';
+import { MatTooltip } from '@angular/material/tooltip';
+
+/** rxjs Imports */
+import { EMPTY, Observable } from 'rxjs';
+import { switchMap } from 'rxjs/operators';
+
+/** Custom Services */
+import { ProductsService } from '../products.service';
+import { AlertService } from 'app/core/alert/alert.service';
+import { EditFacilityChargeMappingDialogComponent } from './edit-facility-charge-mapping-dialog/edit-facility-charge-mapping-dialog.component';
+import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
+
+/**
+ * Lists which charge is applied when each of the 16 named account facilities (ATM Facility, UPI
+ * Facility, Cheque Book, ...) is enabled on a savings/current account, and lets an admin change it.
+ */
+@Component({
+  selector: 'mifosx-facility-charge-mappings',
+  templateUrl: './facility-charge-mappings.component.html',
+  styleUrls: ['./facility-charge-mappings.component.scss'],
+  imports: [
+    ...STANDALONE_SHARED_IMPORTS,
+    MatTable,
+    MatSort,
+    MatColumnDef,
+    MatHeaderCellDef,
+    MatHeaderCell,
+    MatSortHeader,
+    MatCellDef,
+    MatCell,
+    MatHeaderRowDef,
+    MatHeaderRow,
+    MatRowDef,
+    MatRow,
+    MatPaginator,
+    MatTooltip
+  ]
+})
+export class FacilityChargeMappingsComponent implements OnInit {
+  private route = inject(ActivatedRoute);
+  private productsService = inject(ProductsService);
+  private dialog = inject(MatDialog);
+  private alertService = inject(AlertService);
+
+  facilityChargeMappingsData: any[] = [];
+  displayedColumns: string[] = [
+    'facilityType',
+    'chargeName',
+    'defaultAmount',
+    'isActive',
+    'actions'
+  ];
+  dataSource: MatTableDataSource<any>;
+
+  @ViewChild(MatPaginator, { static: true }) paginator: MatPaginator;
+  @ViewChild(MatSort, { static: true }) sort: MatSort;
+
+  constructor() {
+    this.route.data.subscribe((data: { facilityChargeMappings: any }) => {
+      this.facilityChargeMappingsData = data.facilityChargeMappings;
+    });
+  }
+
+  ngOnInit() {
+    this.setFacilityChargeMappings();
+  }
+
+  setFacilityChargeMappings() {
+    this.dataSource = new MatTableDataSource(this.facilityChargeMappingsData);
+    this.dataSource.paginator = this.paginator;
+    this.dataSource.sort = this.sort;
+  }
+
+  /** Human-readable label for a facility_type code, e.g. ATM_FACILITY -> ATM Facility. */
+  facilityLabel(facilityType: string): string {
+    if (!facilityType) {
+      return '';
+    }
+    return facilityType
+      .toLowerCase()
+      .split('_')
+      .map((word) => word.charAt(0).toUpperCase() + word.slice(1))
+      .join(' ');
+  }
+
+  editMapping(mapping: any): void {
+    this.productsService
+      .getFacilityChargeMappingsTemplate()
+      .pipe(
+        switchMap((template: any) =>
+          this.dialog
+            .open(EditFacilityChargeMappingDialogComponent, {
+              data: { mapping, chargeOptions: template.chargeOptions || [] }
+            })
+            .afterClosed()
+        ),
+        switchMap((formValue: any): Observable<any> => {
+          if (!formValue) {
+            return EMPTY;
+          }
+          return this.productsService.updateFacilityChargeMapping(mapping.id, formValue);
+        })
+      )
+      .subscribe((result: any) => {
+        if (result) {
+          this.alertService.alert({
+            type: 'Facility Charge Mapping',
+            message: `${this.facilityLabel(mapping.facilityType)} mapping updated successfully.`
+          });
+          this.productsService.getFacilityChargeMappings().subscribe((mappings: any) => {
+            this.facilityChargeMappingsData = mappings;
+            this.setFacilityChargeMappings();
+          });
+        }
+      });
+  }
+}

src/app/products/facility-charge-mappings/facility-charge-mappings.resolver.ts

@@ -0,0 +1,32 @@
+/**
+ * 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 { Injectable, inject } from '@angular/core';
+
+/** rxjs Imports */
+import { Observable } from 'rxjs';
+
+/** Custom Services */
+import { ProductsService } from '../products.service';
+
+/**
+ * Facility charge mappings data resolver.
+ */
+@Injectable()
+export class FacilityChargeMappingsResolver {
+  private productsService = inject(ProductsService);
+
+  /**
+   * Returns all 16 facility -> charge mappings.
+   * @returns {Observable<any>}
+   */
+  resolve(): Observable<any> {
+    return this.productsService.getFacilityChargeMappings();
+  }
+}

src/app/products/products-routing.module.ts

@@ -33,6 +33,7 @@ import { ViewRecurringDepositProductComponent } from './recurring-deposit-produc
 import { ChargesComponent } from './charges/charges.component';
 import { ViewChargeComponent } from './charges/view-charge/view-charge.component';
 import { CreateChargeComponent } from './charges/create-charge/create-charge.component';
+import { FacilityChargeMappingsComponent } from './facility-charge-mappings/facility-charge-mappings.component';
 import { FixedDepositProductsComponent } from './fixed-deposit-products/fixed-deposit-products.component';
 import { CreateFixedDepositProductComponent } from './fixed-deposit-products/create-fixed-deposit-product/create-fixed-deposit-product.component';
 import { ProductsMixComponent } from './products-mix/products-mix.component';
@@ -76,6 +77,7 @@ import { ShareProductAndTemplateResolver } from './share-products/edit-share-pro
 import { RecurringDepositProductsResolver } from './recurring-deposit-products/recurring-deposit-products.resolver';
 import { RecurringDepositProductResolver } from './recurring-deposit-products/recurring-deposit-product.resolver';
 import { ChargesResolver } from './charges/charges.resolver';
+import { FacilityChargeMappingsResolver } from './facility-charge-mappings/facility-charge-mappings.resolver';
 import { ChargeResolver } from './charges/charge.resolver';
 import { ChargesTemplateResolver } from './charges/charges-template.resolver';
 import { FixedDepositProductsResolver } from './fixed-deposit-products/fixed-deposit-products.resolver';
@@ -937,6 +939,14 @@ const routes: Routes = [
             }
           ]
         },
+        {
+          path: 'facility-charge-mappings',
+          data: { title: 'Facility Charge Mappings', breadcrumb: 'Facility Charge Mappings' },
+          component: FacilityChargeMappingsComponent,
+          resolve: {
+            facilityChargeMappings: FacilityChargeMappingsResolver
+          }
+        },
         {
           path: 'collaterals',
           data: { title: 'Collaterals', breadcrumb: 'Collaterals' },
@@ -1015,6 +1025,7 @@ const routes: Routes = [
     ChargeResolver,
     ChargesTemplateAndResolver,
     ChargesTemplateResolver,
+    FacilityChargeMappingsResolver,
     FixedDepositProductsResolver,
     FixedDepositProductsTemplateResolver,
     ProductsMixResolver,

src/app/products/products.component.html

@@ -151,6 +151,22 @@
       </a>
     </div>
 
+    <a class="pd-card" [routerLink]="['facility-charge-mappings']" *mifosxHasPermission="'READ_FACILITYCHARGEMAPPING'">
+      <div class="pd-card__icon pd-card__icon--orange">
+        <i class="fas fa-sliders-h"></i>
+      </div>
+      <div class="pd-card__body">
+        <h3 class="pd-card__title">{{ 'labels.heading.Facility Charge Mappings' | translate }}</h3>
+        <p class="pd-card__desc">
+          {{
+            'labels.text.Choose which charge applies when an account facility (ATM, UPI, Cheque Book, ...) is enabled'
+              | translate
+          }}
+        </p>
+      </div>
+      <i class="fas fa-chevron-right pd-card__arrow"></i>
+    </a>
+
     <a class="pd-card" [routerLink]="['collaterals']">
       <div class="pd-card__icon pd-card__icon--slate">
         <i class="fas fa-shield-alt"></i>

src/app/products/products.module.ts

@@ -30,6 +30,8 @@ import { CreateLoanProductComponent } from './loan-products/create-loan-product/
 import { ManageTaxConfigurationsComponent } from './manage-tax-configurations/manage-tax-configurations.component';
 import { RecurringDepositProductsComponent } from './recurring-deposit-products/recurring-deposit-products.component';
 import { ChargesComponent } from './charges/charges.component';
+import { FacilityChargeMappingsComponent } from './facility-charge-mappings/facility-charge-mappings.component';
+import { EditFacilityChargeMappingDialogComponent } from './facility-charge-mappings/edit-facility-charge-mapping-dialog/edit-facility-charge-mapping-dialog.component';
 import { ViewChargeComponent } from './charges/view-charge/view-charge.component';
 import { FixedDepositProductsComponent } from './fixed-deposit-products/fixed-deposit-products.component';
 import { ProductsMixComponent } from './products-mix/products-mix.component';
@@ -159,6 +161,8 @@ import { AdvancedAccountingMappingRuleComponent } from './loan-products/loan-pro
     RecurringDepositProductsComponent,
     ChargesComponent,
     ViewChargeComponent,
+    FacilityChargeMappingsComponent,
+    EditFacilityChargeMappingDialogComponent,
     FixedDepositProductsComponent,
     ManageTaxComponentsComponent,
     ProductsMixComponent,

src/app/products/products.service.ts

@@ -347,6 +347,29 @@ export class ProductsService {
     return this.http.get('/charges/template');
   }
 
+  /**
+   * @returns {Observable<any>} All 16 facility -> charge mappings.
+   */
+  getFacilityChargeMappings(): Observable<any> {
+    return this.http.get('/facilitychargemappings');
+  }
+
+  /**
+   * @returns {Observable<any>} Charge options available to map a facility to.
+   */
+  getFacilityChargeMappingsTemplate(): Observable<any> {
+    return this.http.get('/facilitychargemappings/template');
+  }
+
+  /**
+   * @param {string} mappingId Facility charge mapping ID to update.
+   * @param {any} mapping New chargeId (and optionally defaultAmount/isActive).
+   * @returns {Observable<any>}
+   */
+  updateFacilityChargeMapping(mappingId: string, mapping: any): Observable<any> {
+    return this.http.put(`/facilitychargemappings/${mappingId}`, mapping);
+  }
+
   /**
    * @param {string} chargeId Charge ID of charge.
    * @returns {Observable<any>} Charge.