Compare commits
90
Commits
dev
...
7f3c97a205
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
7f3c97a205 | ||
|
|
4e3b49a96a | ||
|
|
915deddb74 | ||
|
|
211027b9d8 | ||
|
|
d88f2a6eb1 | ||
|
|
606d14b995 | ||
|
|
afcd3af918 | ||
|
|
0eb087e3c3 | ||
|
|
7c23bdd6af | ||
|
|
767461faae | ||
|
|
a87cf42c5c | ||
|
|
c91dcf4d99 | ||
|
|
2d2eac8d03 | ||
|
|
3928936b93 | ||
|
|
799a6930b8 | ||
|
|
1cebb84906 | ||
|
|
c90528e109 | ||
|
|
79bffaca69 | ||
|
|
d61584f291 | ||
|
|
4acee3e63b | ||
|
|
cec5223378 | ||
|
|
a5a64d4efe | ||
|
|
0ea57b3f82 | ||
|
|
0976bc230c | ||
|
|
6b0f218b70 | ||
|
|
6226682b36 | ||
|
|
38884610d2 | ||
|
|
d6d7d912c0 | ||
|
|
454988d803 | ||
|
|
17bfe4c7e6 | ||
|
|
7c868ae073 | ||
|
|
5ab4e9eaf0 | ||
|
|
4fc6784695 | ||
|
|
174a2e7b6b | ||
|
|
9f7d9d28fd | ||
|
|
1ffac4b1e5 | ||
|
|
4dee1db360 | ||
|
|
0c6ebfdc1a | ||
|
|
b6994c0b76 | ||
|
|
885b39d970 | ||
|
|
4f02f24aae | ||
|
|
73871a0993 | ||
|
|
7b0cb5bb63 | ||
|
|
74a51a0626 | ||
|
|
283ab2f733 | ||
|
|
646e73d08a | ||
|
|
a7ed3883df | ||
|
|
18c3bb6356 | ||
|
|
6afa79bd37 | ||
|
|
ec23d57734 | ||
|
|
192bc7725e | ||
|
|
eb278978bd | ||
|
|
3f6485f652 | ||
|
|
8d0d8822f0 | ||
|
|
59e1eeacc3 | ||
|
|
4ca08f6ee9 | ||
|
|
f451672ce7 | ||
|
|
6cbb31b5c6 | ||
|
|
90f26d32b7 | ||
|
|
a5ed3fde21 | ||
|
|
5ee0a3fc53 | ||
|
|
6f259ad06e | ||
|
|
be35f3cbc3 | ||
|
|
7b9a6394c8 | ||
|
|
1eaa8cc8cf | ||
|
|
a652ce1093 | ||
|
|
50b3542dfe | ||
|
|
89c091671f | ||
|
|
865ad8ba88 | ||
|
|
08a427467a | ||
|
|
3f59cc6b91 | ||
|
|
b0777e9845 | ||
|
|
d47e0860f6 | ||
|
|
e2eff9914f | ||
|
|
a6e6220100 | ||
|
|
3c363d0372 | ||
|
|
dc7f668056 | ||
|
|
124f05d21d | ||
|
|
c7428d0cb2 | ||
|
|
17d97da380 | ||
|
|
f9b73a4930 | ||
|
|
e53dfb5a66 | ||
|
|
41540ad24e | ||
|
|
b71619c402 | ||
|
|
d18bd9cf37 | ||
|
|
cda7c52d11 | ||
|
|
d132bbe716 | ||
|
|
0cef1b5a50 | ||
|
|
0fbf6ec58c | ||
|
|
57a61b3057 |
-302
@@ -1,302 +0,0 @@
|
||||
kind: pipeline
|
||||
type: docker
|
||||
name: auto-deploy
|
||||
|
||||
trigger:
|
||||
branch:
|
||||
- dev
|
||||
event:
|
||||
- push
|
||||
|
||||
steps:
|
||||
|
||||
# ============================================================
|
||||
# DOCKER BUILD & PUSH
|
||||
#
|
||||
# Angular build (npm ci + ng build) Dockerfile ke andar
|
||||
# multi-stage me hota hai, isliye alag build step nahi chahiye.
|
||||
# ============================================================
|
||||
- name: docker-build-push
|
||||
image: docker
|
||||
|
||||
volumes:
|
||||
- name: dockersock
|
||||
path: /var/run/docker.sock
|
||||
|
||||
commands:
|
||||
- |
|
||||
set -e
|
||||
|
||||
# --------------------------------------------------------
|
||||
# Repository name comes from Drone
|
||||
# --------------------------------------------------------
|
||||
REPO="$${DRONE_REPO_NAME}"
|
||||
REPO="$$(echo "$$REPO" | tr '[:upper:]' '[:lower:]')"
|
||||
|
||||
IMAGE="harbor.lincpay:8082/lincpay/$$REPO:$${DRONE_BUILD_NUMBER}"
|
||||
|
||||
echo "=========================================="
|
||||
echo "DOCKER BUILD & PUSH"
|
||||
echo "=========================================="
|
||||
echo "Repository : $$REPO"
|
||||
echo "Build : $${DRONE_BUILD_NUMBER}"
|
||||
echo "Image : $$IMAGE"
|
||||
echo "=========================================="
|
||||
|
||||
# --------------------------------------------------------
|
||||
# Harbor login
|
||||
# --------------------------------------------------------
|
||||
echo 'QVgW5QbqlKKtBU2dYApTY28Dd6J36GK3' | \
|
||||
docker login harbor.lincpay:8082 \
|
||||
-u 'robot$lincpay+drone' \
|
||||
--password-stdin
|
||||
|
||||
# --------------------------------------------------------
|
||||
# Build
|
||||
# --------------------------------------------------------
|
||||
echo "Building Docker image..."
|
||||
|
||||
docker build \
|
||||
-t "$$IMAGE" \
|
||||
.
|
||||
|
||||
# --------------------------------------------------------
|
||||
# Push
|
||||
# --------------------------------------------------------
|
||||
echo "Pushing Docker image..."
|
||||
|
||||
docker push "$$IMAGE"
|
||||
|
||||
echo "Docker image pushed successfully."
|
||||
|
||||
|
||||
# ============================================================
|
||||
# DEPLOY
|
||||
# ============================================================
|
||||
- name: deploy
|
||||
image: docker
|
||||
|
||||
volumes:
|
||||
- name: dockersock
|
||||
path: /var/run/docker.sock
|
||||
|
||||
- name: envfiles
|
||||
path: /platform-env
|
||||
|
||||
commands:
|
||||
- |
|
||||
set -e
|
||||
|
||||
# ========================================================
|
||||
# REPOSITORY / SERVICE / IMAGE
|
||||
# ========================================================
|
||||
|
||||
REPO="$${DRONE_REPO_NAME}"
|
||||
REPO="$$(echo "$$REPO" | tr '[:upper:]' '[:lower:]')"
|
||||
|
||||
SERVICE_NAME="$${REPO}_app"
|
||||
|
||||
IMAGE="harbor.lincpay:8082/lincpay/$$REPO:$${DRONE_BUILD_NUMBER}"
|
||||
|
||||
echo "=========================================="
|
||||
echo "DEPLOYMENT"
|
||||
echo "=========================================="
|
||||
echo "Repository : $$REPO"
|
||||
echo "Service : $$SERVICE_NAME"
|
||||
echo "Image : $$IMAGE"
|
||||
echo "Placement : node.labels.environment == dev2"
|
||||
echo "=========================================="
|
||||
|
||||
|
||||
# ========================================================
|
||||
# VALIDATION
|
||||
# ========================================================
|
||||
|
||||
if [ -z "$$REPO" ]; then
|
||||
echo "ERROR: DRONE_REPO_NAME is empty."
|
||||
exit 1
|
||||
fi
|
||||
|
||||
if [ -z "$$SERVICE_NAME" ]; then
|
||||
echo "ERROR: Service name is empty."
|
||||
exit 1
|
||||
fi
|
||||
|
||||
if [ -z "$$IMAGE" ]; then
|
||||
echo "ERROR: Docker image is empty."
|
||||
exit 1
|
||||
fi
|
||||
|
||||
echo "Repository verified : $$REPO"
|
||||
echo "Service verified : $$SERVICE_NAME"
|
||||
echo "Image verified : $$IMAGE"
|
||||
|
||||
|
||||
# ========================================================
|
||||
# HARBOR LOGIN
|
||||
#
|
||||
# Zaroori hai taaki --with-registry-auth worker node (dev2) ko
|
||||
# valid Harbor credentials propagate kare — warna cross-node pull
|
||||
# "No such image" / "no basic auth credentials" se fail hota hai.
|
||||
# ========================================================
|
||||
|
||||
echo 'QVgW5QbqlKKtBU2dYApTY28Dd6J36GK3' | \
|
||||
docker login harbor.lincpay:8082 \
|
||||
-u 'robot$lincpay+drone' \
|
||||
--password-stdin
|
||||
|
||||
|
||||
# ========================================================
|
||||
# EXISTING SERVICE
|
||||
# ========================================================
|
||||
|
||||
if docker service ls --format '{{.Name}}' | grep -Fxq "$$SERVICE_NAME"; then
|
||||
|
||||
echo ""
|
||||
echo "=========================================="
|
||||
echo "EXISTING SERVICE"
|
||||
echo "=========================================="
|
||||
echo "Service: $$SERVICE_NAME"
|
||||
|
||||
|
||||
# ------------------------------------------------------
|
||||
# Check whether dev constraint already exists
|
||||
# ------------------------------------------------------
|
||||
|
||||
CONSTRAINT_EXISTS=$$(docker service inspect "$$SERVICE_NAME" \
|
||||
--format '{{range .Spec.TaskTemplate.Placement.Constraints}}{{println .}}{{end}}' \
|
||||
| grep -Fx 'node.labels.environment == dev2' || true)
|
||||
|
||||
|
||||
# ------------------------------------------------------
|
||||
# Add constraint if missing
|
||||
# ------------------------------------------------------
|
||||
|
||||
if [ -z "$$CONSTRAINT_EXISTS" ]; then
|
||||
|
||||
echo "Constraint missing."
|
||||
echo "Adding: node.labels.environment == dev2"
|
||||
|
||||
docker service update \
|
||||
--constraint-add 'node.labels.environment == dev2' \
|
||||
"$$SERVICE_NAME"
|
||||
|
||||
else
|
||||
|
||||
echo "Constraint already exists."
|
||||
|
||||
fi
|
||||
|
||||
|
||||
# ------------------------------------------------------
|
||||
# Update image
|
||||
# ------------------------------------------------------
|
||||
|
||||
echo "Updating service image..."
|
||||
|
||||
docker service update \
|
||||
--image "$$IMAGE" \
|
||||
--replicas 1 \
|
||||
--with-registry-auth \
|
||||
"$$SERVICE_NAME"
|
||||
|
||||
|
||||
# ========================================================
|
||||
# NEW SERVICE
|
||||
# ========================================================
|
||||
|
||||
else
|
||||
|
||||
echo ""
|
||||
echo "=========================================="
|
||||
echo "NEW SERVICE"
|
||||
echo "=========================================="
|
||||
echo "Creating: $$SERVICE_NAME"
|
||||
|
||||
|
||||
# ------------------------------------------------------
|
||||
# Traefik rule
|
||||
#
|
||||
# Construct it without allowing Drone to consume
|
||||
# the shell backticks.
|
||||
# ------------------------------------------------------
|
||||
|
||||
TRAEFIK_RULE='Host(`'$$REPO'.lincpay`)'
|
||||
|
||||
echo "Traefik rule: $$TRAEFIK_RULE"
|
||||
|
||||
|
||||
# ------------------------------------------------------
|
||||
# Create service
|
||||
# ------------------------------------------------------
|
||||
|
||||
docker service create \
|
||||
--name "$$SERVICE_NAME" \
|
||||
--network edge-network \
|
||||
--replicas 1 \
|
||||
--constraint 'node.labels.environment == dev2' \
|
||||
--with-registry-auth \
|
||||
--env-file /platform-env/global.env \
|
||||
--env-file /platform-env/dev.env \
|
||||
--label traefik.enable=true \
|
||||
--label "traefik.docker.network=edge-network" \
|
||||
--label "traefik.http.routers.$$REPO.rule=$$TRAEFIK_RULE" \
|
||||
--label "traefik.http.services.$$REPO.loadbalancer.server.port=80" \
|
||||
"$$IMAGE"
|
||||
|
||||
fi
|
||||
|
||||
|
||||
# ========================================================
|
||||
# FINAL STATUS
|
||||
# ========================================================
|
||||
|
||||
echo ""
|
||||
echo "=========================================="
|
||||
echo "FINAL SERVICE STATUS"
|
||||
echo "=========================================="
|
||||
|
||||
docker service ls \
|
||||
--filter "name=$$SERVICE_NAME"
|
||||
|
||||
|
||||
echo ""
|
||||
echo "=========================================="
|
||||
echo "PLACEMENT CONSTRAINT"
|
||||
echo "=========================================="
|
||||
|
||||
docker service inspect "$$SERVICE_NAME" \
|
||||
--format '{{json .Spec.TaskTemplate.Placement}}'
|
||||
|
||||
|
||||
echo ""
|
||||
echo "=========================================="
|
||||
echo "SERVICE TASKS"
|
||||
echo "=========================================="
|
||||
|
||||
docker service ps "$$SERVICE_NAME" --no-trunc
|
||||
|
||||
|
||||
echo ""
|
||||
echo "=========================================="
|
||||
echo "DEPLOYMENT COMPLETE"
|
||||
echo "=========================================="
|
||||
|
||||
|
||||
volumes:
|
||||
|
||||
# ============================================================
|
||||
# DOCKER SOCKET
|
||||
# ============================================================
|
||||
- name: dockersock
|
||||
host:
|
||||
path: /var/run/docker.sock
|
||||
|
||||
|
||||
# ============================================================
|
||||
# ENVIRONMENT FILES
|
||||
# ============================================================
|
||||
- name: envfiles
|
||||
host:
|
||||
path: /opt/platform/env
|
||||
|
||||
+9
-2
@@ -31,6 +31,8 @@
|
||||
"@angular/localize/init"
|
||||
],
|
||||
"assets": [
|
||||
"src/favicon.ico",
|
||||
"src/apple-touch-icon.png",
|
||||
"src/assets/images/cbsnexora-favicon.svg",
|
||||
"src/robots.txt",
|
||||
"src/manifest.json",
|
||||
@@ -39,6 +41,11 @@
|
||||
"glob": "**/*",
|
||||
"input": "node_modules/tinymce",
|
||||
"output": "assets/tinymce"
|
||||
},
|
||||
{
|
||||
"glob": "lottie.min.js",
|
||||
"input": "node_modules/lottie-web/build/player",
|
||||
"output": "assets/js"
|
||||
}
|
||||
],
|
||||
"styles": [
|
||||
@@ -69,8 +76,8 @@
|
||||
"budgets": [
|
||||
{
|
||||
"type": "initial",
|
||||
"maximumWarning": "15mb",
|
||||
"maximumError": "17mb"
|
||||
"maximumWarning": "18mb",
|
||||
"maximumError": "20mb"
|
||||
},
|
||||
{
|
||||
"type": "anyComponentStyle",
|
||||
|
||||
Generated
+7
@@ -41,6 +41,7 @@
|
||||
"jspdf-autotable": "^5.0.2",
|
||||
"lightgallery": "^2.9.0",
|
||||
"lodash": "4.17.23",
|
||||
"lottie-web": "^5.13.0",
|
||||
"moment": "^2.29.4",
|
||||
"ngx-image-cropper": "^9.1.6",
|
||||
"ngx-mat-select-search": "^8.0.2",
|
||||
@@ -18380,6 +18381,12 @@
|
||||
"url": "https://github.com/chalk/wrap-ansi?sponsor=1"
|
||||
}
|
||||
},
|
||||
"node_modules/lottie-web": {
|
||||
"version": "5.13.0",
|
||||
"resolved": "https://registry.npmjs.org/lottie-web/-/lottie-web-5.13.0.tgz",
|
||||
"integrity": "sha512-+gfBXl6sxXMPe8tKQm7qzLnUy5DUPJPKIyRHwtpCpyUEYjHYRJC/5gjUvdkuO2c3JllrPtHXH5UJJK8LRYl5yQ==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/lru-cache": {
|
||||
"version": "5.1.1",
|
||||
"resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz",
|
||||
|
||||
+2
-1
@@ -15,7 +15,7 @@
|
||||
"ng": "ng",
|
||||
"build": "node version.js && npm run env -s && ng build --configuration production --output-hashing=none",
|
||||
"build:prod": "node version.js && node --max-old-space-size=16384 ./node_modules/@angular/cli/bin/ng build --configuration production --output-hashing=none --base-href=/web-app/",
|
||||
"start": "npm run env -s && cross-env NODE_OPTIONS=\"--max_old_space_size=16384\" ng serve --proxy-config proxy.localhost.conf.js",
|
||||
"start": "npm run env -s && cross-env NODE_OPTIONS=\"--max_old_space_size=4096\" ng serve --proxy-config proxy.localhost.conf.js",
|
||||
"start:share": "npm run env -s && cross-env NODE_OPTIONS=\"--max_old_space_size=16384\" ng serve --host 0.0.0.0 --proxy-config proxy.localhost.conf.js",
|
||||
"start:demo": "npm run env -s && cross-env NODE_OPTIONS=\"--max_old_space_size=16384\" ng serve --proxy-config proxy.conf.js",
|
||||
"serve:dev": "npm run env -s && cross-env NODE_OPTIONS=\"--max_old_space_size=16384\" ng serve --source-map --proxy-config proxy.localhost.conf.js",
|
||||
@@ -71,6 +71,7 @@
|
||||
"jspdf-autotable": "^5.0.2",
|
||||
"lightgallery": "^2.9.0",
|
||||
"lodash": "4.17.23",
|
||||
"lottie-web": "^5.13.0",
|
||||
"moment": "^2.29.4",
|
||||
"ngx-image-cropper": "^9.1.6",
|
||||
"ngx-mat-select-search": "^8.0.2",
|
||||
|
||||
@@ -7,16 +7,6 @@
|
||||
-->
|
||||
|
||||
<div class="container">
|
||||
<div class="container m-b-20 align-end gap-2px">
|
||||
@if (!viewAccountTransferData.reversed) {
|
||||
<span>
|
||||
<button mat-raised-button color="warn" *mifosxHasPermission="'ADJUST_ACCOUNTTRANSFER'">
|
||||
<fa-icon icon="undo" class="m-r-10"></fa-icon>{{ 'labels.buttons.Undo' | translate }}
|
||||
</button>
|
||||
</span>
|
||||
}
|
||||
</div>
|
||||
|
||||
<mat-card>
|
||||
<mat-card-content>
|
||||
<div class="transfer-container">
|
||||
|
||||
+6
-15
@@ -16,6 +16,7 @@ import { AccountingService } from '../../accounting.service';
|
||||
import { GLAccount } from 'app/shared/models/general.model';
|
||||
import { GlAccountSelectorComponent } from '../../../shared/accounting/gl-account-selector/gl-account-selector.component';
|
||||
import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
|
||||
import { accountOptionsForActivity } from '../financial-activity-account-options';
|
||||
|
||||
/**
|
||||
* Create financial activity mapping component.
|
||||
@@ -87,21 +88,11 @@ export class CreateFinancialActivityMappingComponent implements OnInit {
|
||||
*/
|
||||
setGlAccountData() {
|
||||
this.financialActivityMappingForm.get('financialActivityId').valueChanges.subscribe((financialActivityId) => {
|
||||
switch (financialActivityId) {
|
||||
case 100:
|
||||
case 101:
|
||||
case 102:
|
||||
case 103:
|
||||
this.glAccountData = this.glAccountOptions.assetAccountOptions;
|
||||
break;
|
||||
case 200:
|
||||
case 201:
|
||||
this.glAccountData = this.glAccountOptions.liabilityAccountOptions;
|
||||
break;
|
||||
case 300:
|
||||
this.glAccountData = this.glAccountOptions.equityAccountOptions;
|
||||
break;
|
||||
}
|
||||
this.glAccountData = accountOptionsForActivity(
|
||||
this.financialActivityData,
|
||||
financialActivityId,
|
||||
this.glAccountOptions
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
+6
-15
@@ -16,6 +16,7 @@ import { AccountingService } from '../../accounting.service';
|
||||
import { GLAccount } from 'app/shared/models/general.model';
|
||||
import { GlAccountSelectorComponent } from '../../../shared/accounting/gl-account-selector/gl-account-selector.component';
|
||||
import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
|
||||
import { accountOptionsForActivity } from '../financial-activity-account-options';
|
||||
|
||||
/**
|
||||
* Edit financial activity mapping component.
|
||||
@@ -98,21 +99,11 @@ export class EditFinancialActivityMappingComponent implements OnInit {
|
||||
*/
|
||||
setGLAccountData() {
|
||||
this.financialActivityMappingForm.get('financialActivityId').valueChanges.subscribe((financialActivityId) => {
|
||||
switch (financialActivityId) {
|
||||
case 100:
|
||||
case 101:
|
||||
case 102:
|
||||
case 103:
|
||||
this.glAccountData = this.glAccountOptions.assetAccountOptions;
|
||||
break;
|
||||
case 200:
|
||||
case 201:
|
||||
this.glAccountData = this.glAccountOptions.liabilityAccountOptions;
|
||||
break;
|
||||
case 300:
|
||||
this.glAccountData = this.glAccountOptions.equityAccountOptions;
|
||||
break;
|
||||
}
|
||||
this.glAccountData = accountOptionsForActivity(
|
||||
this.financialActivityData,
|
||||
financialActivityId,
|
||||
this.glAccountOptions
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
@@ -0,0 +1,38 @@
|
||||
/**
|
||||
* 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/.
|
||||
*/
|
||||
|
||||
/**
|
||||
* The GL accounts a financial activity may be mapped to.
|
||||
*
|
||||
* The activity itself says which kind of account it needs — the template returns `mappedGLAccountType` on every
|
||||
* option — so the answer is read from the activity rather than worked out from its id. The screens used to switch on
|
||||
* the id instead, listing the ones they knew:
|
||||
*
|
||||
* case 100, 101, 102, 103 → asset
|
||||
* case 200, 201 → liability
|
||||
* case 300 → equity
|
||||
*
|
||||
* Every activity added since fell through that switch and left the account dropdown empty, which is how dividendPaid
|
||||
* (202), reserveForDividend (301), distributableProfit (302), retainedProfit (303) and dividendRoundOff (304) became
|
||||
* unmappable — the screen offered no accounts and gave no reason. A list keyed on ids has to be extended by hand for
|
||||
* each new activity, and is silently wrong until someone notices; asking the activity what it needs cannot fall out
|
||||
* of step with the backend.
|
||||
*
|
||||
* @param activities the template's financialActivityOptions
|
||||
* @param activityId the activity the user picked
|
||||
* @param glAccountOptions the template's glAccountOptions, keyed assetAccountOptions / liabilityAccountOptions / …
|
||||
*/
|
||||
export function accountOptionsForActivity(activities: any[], activityId: number, glAccountOptions: any): any[] {
|
||||
const activity = (activities || []).find((a) => a?.id === activityId);
|
||||
const accountType = activity?.mappedGLAccountType;
|
||||
if (!accountType || !glAccountOptions) {
|
||||
return [];
|
||||
}
|
||||
// ASSET → assetAccountOptions, and so on for LIABILITY, EQUITY, INCOME and EXPENSE.
|
||||
return glAccountOptions[`${accountType.toLowerCase()}AccountOptions`] ?? [];
|
||||
}
|
||||
@@ -279,7 +279,7 @@
|
||||
<div class="gl-fgroup">
|
||||
<label class="gl-flabel"><fa-icon icon="calendar-alt"></fa-icon> From Date</label>
|
||||
<mat-form-field appearance="outline" class="gl-ffield">
|
||||
<input matInput [matDatepicker]="dpFrom" [min]="minDate" [max]="maxDate" [formControl]="transactionDateFrom" />
|
||||
<input matInput [matDatepicker]="dpFrom" [min]="minDate" [formControl]="transactionDateFrom" />
|
||||
<mat-datepicker-toggle matSuffix [for]="dpFrom"></mat-datepicker-toggle>
|
||||
<mat-datepicker #dpFrom></mat-datepicker>
|
||||
</mat-form-field>
|
||||
@@ -288,7 +288,7 @@
|
||||
<div class="gl-fgroup">
|
||||
<label class="gl-flabel"><fa-icon icon="calendar-alt"></fa-icon> To Date</label>
|
||||
<mat-form-field appearance="outline" class="gl-ffield">
|
||||
<input matInput [matDatepicker]="dpTo" [min]="minDate" [max]="maxDate" [formControl]="transactionDateTo" />
|
||||
<input matInput [matDatepicker]="dpTo" [min]="minDate" [formControl]="transactionDateTo" />
|
||||
<mat-datepicker-toggle matSuffix [for]="dpTo"></mat-datepicker-toggle>
|
||||
<mat-datepicker #dpTo></mat-datepicker>
|
||||
</mat-form-field>
|
||||
@@ -353,13 +353,7 @@
|
||||
<div class="gl-fgroup">
|
||||
<label class="gl-flabel"><fa-icon icon="calendar-check"></fa-icon> Submitted From</label>
|
||||
<mat-form-field appearance="outline" class="gl-ffield">
|
||||
<input
|
||||
matInput
|
||||
[matDatepicker]="dpSubFrom"
|
||||
[min]="minDate"
|
||||
[max]="maxDate"
|
||||
[formControl]="submittedOnDateFrom"
|
||||
/>
|
||||
<input matInput [matDatepicker]="dpSubFrom" [min]="minDate" [formControl]="submittedOnDateFrom" />
|
||||
<mat-datepicker-toggle matSuffix [for]="dpSubFrom"></mat-datepicker-toggle>
|
||||
<mat-datepicker #dpSubFrom></mat-datepicker>
|
||||
</mat-form-field>
|
||||
@@ -368,7 +362,7 @@
|
||||
<div class="gl-fgroup">
|
||||
<label class="gl-flabel"><fa-icon icon="calendar-check"></fa-icon> Submitted To</label>
|
||||
<mat-form-field appearance="outline" class="gl-ffield">
|
||||
<input matInput [matDatepicker]="dpSubTo" [min]="minDate" [max]="maxDate" [formControl]="submittedOnDateTo" />
|
||||
<input matInput [matDatepicker]="dpSubTo" [min]="minDate" [formControl]="submittedOnDateTo" />
|
||||
<mat-datepicker-toggle matSuffix [for]="dpSubTo"></mat-datepicker-toggle>
|
||||
<mat-datepicker #dpSubTo></mat-datepicker>
|
||||
</mat-form-field>
|
||||
@@ -539,7 +533,7 @@
|
||||
</div>
|
||||
|
||||
<div class="gl-table-shell">
|
||||
<mat-table [dataSource]="dataSource" matSort class="gl-mat-table">
|
||||
<mat-table [dataSource]="dataSource" matSort matSortActive="id" matSortDirection="desc" class="gl-mat-table">
|
||||
<!-- #ID -->
|
||||
<ng-container matColumnDef="id">
|
||||
<mat-header-cell *matHeaderCellDef mat-sort-header class="gl-th">#</mat-header-cell>
|
||||
|
||||
@@ -90,7 +90,7 @@ export class SearchJournalEntryComponent implements OnInit, OnDestroy, AfterView
|
||||
|
||||
// ── Misc ──────────────────────────────────────────────────────────────────
|
||||
minDate = new Date(2000, 0, 1);
|
||||
maxDate = new Date();
|
||||
maxDate: Date = null;
|
||||
/** Accounting features switched off for this installation — see disabled-features.ts. */
|
||||
disabledFeatures = DISABLED_ACCOUNTING_FEATURES;
|
||||
|
||||
@@ -208,7 +208,7 @@ export class SearchJournalEntryComponent implements OnInit, OnDestroy, AfterView
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.maxDate = this.settingsService.businessDate;
|
||||
this.maxDate = null;
|
||||
this.paginator.pageSize = 10;
|
||||
this.restoreState();
|
||||
this.setFilteredOffices();
|
||||
|
||||
@@ -11,6 +11,14 @@ import { Routes, RouterModule } from '@angular/router';
|
||||
|
||||
import { Route } from '../core/route/route.service';
|
||||
import { AccountsListComponent } from './accounts-list/accounts-list.component';
|
||||
import { PartyMasterComponent } from '../deposits/party-master/party-master.component';
|
||||
import { CreatePartyComponent } from '../deposits/party-master/create-party/create-party.component';
|
||||
import { DueForClosureComponent } from '../deposits/party-master/due-for-closure/due-for-closure.component';
|
||||
import { DailyTransactionEntryComponent } from '../deposits/daily-transaction-entry/daily-transaction-entry.component';
|
||||
import { DdsReportsComponent } from '../deposits/dds-reports/dds-reports.component';
|
||||
import { ReportViewerComponent } from '../deposits/dds-reports/report-viewer/report-viewer.component';
|
||||
import { DdsAccountsComponent } from '../deposits/dds-accounts/dds-accounts.component';
|
||||
import { DdsAccountViewComponent } from '../deposits/dds-accounts/dds-account-view/dds-account-view.component';
|
||||
|
||||
const routes: Routes = [
|
||||
Route.withShell([
|
||||
@@ -41,6 +49,59 @@ const routes: Routes = [
|
||||
title: 'Recurring Deposit Accounts',
|
||||
breadcrumb: 'Recurring Deposit Accounts'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'dds',
|
||||
data: { title: 'Daily Deposit Scheme — Party Master', breadcrumb: 'Party Master' },
|
||||
children: [
|
||||
{ path: '', component: PartyMasterComponent },
|
||||
{
|
||||
path: 'create',
|
||||
component: CreatePartyComponent,
|
||||
data: { title: 'Create Party', breadcrumb: 'Create' }
|
||||
},
|
||||
{
|
||||
// Ahead of the :partyId routes, so "dueforclosure" is not read as a party id.
|
||||
path: 'dueforclosure',
|
||||
component: DueForClosureComponent,
|
||||
data: { title: 'Accounts Due for Closure', breadcrumb: 'Due for Closure' }
|
||||
},
|
||||
{
|
||||
path: ':partyId/edit',
|
||||
component: CreatePartyComponent,
|
||||
data: { title: 'Edit Party', breadcrumb: 'Edit' }
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
// The DDS accounts listed like Savings Accounts, each opening onto its transactions.
|
||||
path: 'dds-accounts',
|
||||
data: { title: 'DDS Accounts', breadcrumb: 'DDS Accounts' },
|
||||
children: [
|
||||
{ path: '', component: DdsAccountsComponent },
|
||||
{
|
||||
path: ':partyId',
|
||||
component: DdsAccountViewComponent,
|
||||
data: { title: 'DDS Account', breadcrumb: 'Account', routeParamBreadcrumb: false }
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: 'dds-collection',
|
||||
component: DailyTransactionEntryComponent,
|
||||
data: { title: 'Daily Transaction Entry', breadcrumb: 'Daily Transaction Entry' }
|
||||
},
|
||||
{
|
||||
path: 'dds-reports',
|
||||
data: { title: 'DDS Reports', breadcrumb: 'DDS Reports' },
|
||||
children: [
|
||||
{ path: '', component: DdsReportsComponent },
|
||||
{
|
||||
path: 'view/:reportName',
|
||||
component: ReportViewerComponent,
|
||||
data: { title: 'DDS Report', breadcrumb: 'reportName', routeParamBreadcrumb: 'reportName' }
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
@@ -74,6 +74,22 @@ export class AccountsService {
|
||||
return this.http.get('/fixeddepositaccounts', { params: httpParams });
|
||||
}
|
||||
|
||||
/**
|
||||
* FD Dashboard's data source: every ACTIVE FD, id/account/client/product identity, maturity date
|
||||
* and deposit/maturity amounts only. Deliberately a separate, narrow endpoint rather than
|
||||
* getFixedDepositAccounts() above -- that one's backend query joins in six more tables (audit
|
||||
* who-did-what-when, currency, tax group) an unbounded dashboard fetch does not need, over columns
|
||||
* that had no index until this feature added one (see backend migration 0571).
|
||||
*/
|
||||
getFixedDepositMaturityDashboard(): Observable<any> {
|
||||
return this.http.get('/fixeddepositaccounts/maturity-dashboard');
|
||||
}
|
||||
|
||||
/** RD Dashboard: running RDs with their installment position, closures and penalty income for the month. */
|
||||
getRecurringDepositDashboard(): Observable<any> {
|
||||
return this.http.get('/recurringdepositaccounts/dashboard');
|
||||
}
|
||||
|
||||
getRecurringDepositAccounts(params: AccountListParams = {}): Observable<any> {
|
||||
let httpParams = new HttpParams()
|
||||
.set('paged', 'true')
|
||||
|
||||
@@ -34,6 +34,17 @@ export class AmlService {
|
||||
return this.http.post(`/aml/alerts/${alertId}/review`, { disposition, notes });
|
||||
}
|
||||
|
||||
/**
|
||||
* Decides named rules within one alert, leaving its other rules open.
|
||||
*
|
||||
* <p>
|
||||
* The alert's own status follows from what is left undecided, so it is not sent: whitelisting five of six rules
|
||||
* leaves the alert open on the sixth.
|
||||
*/
|
||||
reviewAlertRules(alertId: number, ruleCodes: string[], disposition: string, notes: string): Observable<any> {
|
||||
return this.http.post(`/aml/alerts/${alertId}/review`, { disposition, notes, ruleCodes });
|
||||
}
|
||||
|
||||
// ═══ Recurring-alert review queue ═══
|
||||
|
||||
/**
|
||||
@@ -141,4 +152,38 @@ export class AmlService {
|
||||
getRiskCategoryHistory(clientId: number): Observable<any[]> {
|
||||
return this.http.get<any[]>(`/clients/${clientId}/risk-category-history`);
|
||||
}
|
||||
|
||||
// ═══ Risk-category changes (maker-checker) ═══
|
||||
//
|
||||
// The rating decides how often a customer is re-KYC'd and what AML thresholds apply to them, so
|
||||
// it moves only once a checker agrees rather than on one officer's say-so.
|
||||
|
||||
/** @param requestedCategory 1 Low, 2 Medium, 3 High */
|
||||
requestRiskChange(clientId: number, requestedCategory: number, reason: string): Observable<any> {
|
||||
return this.http.post('/aml/risk-change-requests', { clientId, requestedCategory, reason });
|
||||
}
|
||||
|
||||
getRiskChangeRequests(status?: string): Observable<any[]> {
|
||||
const params = status ? new HttpParams().set('status', status) : undefined;
|
||||
return this.http.get<any[]>('/aml/risk-change-requests', { params });
|
||||
}
|
||||
|
||||
approveRiskChange(requestId: number): Observable<any> {
|
||||
return this.http.post(`/aml/risk-change-requests/${requestId}/approve`, {});
|
||||
}
|
||||
|
||||
rejectRiskChange(requestId: number, rejectionReason: string): Observable<any> {
|
||||
return this.http.post(`/aml/risk-change-requests/${requestId}/reject`, { rejectionReason });
|
||||
}
|
||||
|
||||
/**
|
||||
* The latest behaviour window for each customer, as the nightly job computed it.
|
||||
*
|
||||
* One row per customer carrying the review period's figures and the rating they suggest. The Risk Review report
|
||||
* prefers these over its own per-alert reckoning, because a rating describes a period rather than the handful of
|
||||
* transactions that happened to trip a rule.
|
||||
*/
|
||||
getBehaviourWindows(): Observable<any[]> {
|
||||
return this.http.get<any[]>('/risk-review/behaviour-windows');
|
||||
}
|
||||
}
|
||||
|
||||
@@ -63,6 +63,8 @@ import { CfcfrmsModule } from './cfcfrms/cfcfrms.module';
|
||||
import { BankCalendarModule } from './bank-calendar/bank-calendar.module';
|
||||
import { DeafModule } from './deaf/deaf.module';
|
||||
import { SavingsDailyInterestModule } from './savings-daily-interest/savings-daily-interest.module';
|
||||
import { FdDashboardModule } from './fd-dashboard/fd-dashboard.module';
|
||||
import { RdDashboardModule } from './rd-dashboard/rd-dashboard.module';
|
||||
import { DicgcModule } from './dicgc/dicgc.module';
|
||||
import { FiuModule } from './fiu/fiu.module';
|
||||
import { GlReportsModule } from './gl-reports/gl-reports.module';
|
||||
@@ -95,6 +97,7 @@ import { TokenInterceptor as ZitadelTokenInterceptor } from './zitadel/token.int
|
||||
import { AuthService } from './zitadel/auth.service';
|
||||
import { environment } from '../environments/environment';
|
||||
import { CallbackComponent } from './zitadel/callback/callback.component';
|
||||
import { LoadingScreenComponent } from './shared/loading-screen/loading-screen.component';
|
||||
import { OAuthModule } from 'angular-oauth2-oidc';
|
||||
|
||||
export class CustomMissingTranslationHandler implements MissingTranslationHandler {
|
||||
@@ -176,6 +179,8 @@ export function HttpLoaderFactory(http: HttpClient) {
|
||||
BankCalendarModule,
|
||||
DeafModule,
|
||||
SavingsDailyInterestModule,
|
||||
FdDashboardModule,
|
||||
RdDashboardModule,
|
||||
DicgcModule,
|
||||
FiuModule,
|
||||
GlReportsModule,
|
||||
@@ -193,6 +198,7 @@ export function HttpLoaderFactory(http: HttpClient) {
|
||||
AppRoutingModule,
|
||||
NotFoundComponent,
|
||||
CallbackComponent,
|
||||
LoadingScreenComponent,
|
||||
OAuthModule.forRoot()
|
||||
],
|
||||
providers: [
|
||||
|
||||
@@ -44,8 +44,11 @@
|
||||
<div class="cal-stat sat2nd4th">
|
||||
<fa-icon icon="calendar-times" class="cal-stat__icon"></fa-icon>
|
||||
<div class="cal-stat__info">
|
||||
<div class="cal-stat__value">{{ overallStats.sat2nd4th }}</div>
|
||||
<div class="cal-stat__label">2nd & 4th Sat</div>
|
||||
<div class="cal-stat__value">{{ overallStats.sat2nd4th + overallStats.weeklyOff }}</div>
|
||||
<div class="cal-stat__label">
|
||||
{{ saturdayIsWorkingDay ? '2nd & 4th Sat' : 'Saturdays'
|
||||
}}{{ overallStats.weeklyOff > 0 ? ' / Weekly Off' : '' }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="cal-stat holidays">
|
||||
@@ -69,7 +72,11 @@
|
||||
<div class="cal-legend__items">
|
||||
<div class="cal-legend__item"><span class="cal-legend__dot working"></span> Working Day</div>
|
||||
<div class="cal-legend__item"><span class="cal-legend__dot sunday"></span> Sunday</div>
|
||||
<div class="cal-legend__item"><span class="cal-legend__dot sat2nd4th"></span> 2nd / 4th Saturday</div>
|
||||
<div class="cal-legend__item">
|
||||
<span class="cal-legend__dot sat2nd4th"></span>
|
||||
{{ saturdayIsWorkingDay ? '2nd / 4th Saturday' : 'Saturday'
|
||||
}}{{ overallStats.weeklyOff > 0 ? ' / Weekly Off' : '' }}
|
||||
</div>
|
||||
<div class="cal-legend__item"><span class="cal-legend__dot holiday"></span> Holiday</div>
|
||||
<div class="cal-legend__item"><span class="cal-legend__dot today"></span> Today</div>
|
||||
</div>
|
||||
@@ -319,7 +326,9 @@
|
||||
[class.cal-grid__day--other]="!day.isCurrentMonth"
|
||||
[class.cal-grid__day--today]="day.isToday"
|
||||
[class.cal-grid__day--sunday]="day.isSunday && day.isCurrentMonth"
|
||||
[class.cal-grid__day--sat2nd4th]="(day.is2ndSaturday || day.is4thSaturday) && day.isCurrentMonth"
|
||||
[class.cal-grid__day--sat2nd4th]="
|
||||
(day.is2ndSaturday || day.is4thSaturday || day.isWeeklyOff) && day.isCurrentMonth
|
||||
"
|
||||
[class.cal-grid__day--holiday]="day.isHoliday && day.isCurrentMonth"
|
||||
[class.cal-grid__day--working]="day.isWorking && day.isCurrentMonth"
|
||||
[matTooltip]="
|
||||
@@ -328,9 +337,11 @@
|
||||
? '2nd Saturday Off'
|
||||
: day.is4thSaturday
|
||||
? '4th Saturday Off'
|
||||
: day.isSunday && day.isCurrentMonth
|
||||
? 'Sunday'
|
||||
: '')
|
||||
: day.isWeeklyOff && day.isCurrentMonth
|
||||
? weekDays[day.dayOfWeek] + ' Off (Working Days)'
|
||||
: day.isSunday && day.isCurrentMonth
|
||||
? 'Sunday'
|
||||
: '')
|
||||
"
|
||||
>
|
||||
{{ day.isCurrentMonth ? day.date : '' }}
|
||||
@@ -343,10 +354,15 @@
|
||||
@if (month.holidays > 0) {
|
||||
<span class="summary-tag holiday">{{ month.holidays }} Holiday{{ month.holidays > 1 ? 's' : '' }}</span>
|
||||
}
|
||||
<span class="summary-tag sun">{{ month.sundays }} Sun</span>
|
||||
@if (month.sundays > 0) {
|
||||
<span class="summary-tag sun">{{ month.sundays }} Sun</span>
|
||||
}
|
||||
@if (month.secondFourthSat > 0) {
|
||||
<span class="summary-tag sat">{{ month.secondFourthSat }} Sat Off</span>
|
||||
}
|
||||
@if (month.weeklyOff > 0) {
|
||||
<span class="summary-tag sat">{{ month.weeklyOff }} Weekly Off</span>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
@@ -63,6 +63,8 @@ interface CalendarDay {
|
||||
isSunday: boolean;
|
||||
is2ndSaturday: boolean;
|
||||
is4thSaturday: boolean;
|
||||
/** Off every week because Admin > Working Days leaves this weekday out (Sunday aside). */
|
||||
isWeeklyOff: boolean;
|
||||
holidayName?: string;
|
||||
dayOfWeek: number; // 0=Sun, 6=Sat
|
||||
}
|
||||
@@ -76,9 +78,23 @@ interface MonthData {
|
||||
nonWorkingDays: number;
|
||||
holidays: number;
|
||||
sundays: number;
|
||||
/** Saturdays off: the 2nd and 4th when Saturday is a working day, every one when it is not. */
|
||||
secondFourthSat: number;
|
||||
/** Other weekdays off every week because Working Days leaves them out. */
|
||||
weeklyOff: number;
|
||||
}
|
||||
|
||||
/** Weekday codes in Date#getDay() order, as used by the /workingdays recurrence (BYDAY=MO,TU,...). */
|
||||
const DAY_CODES = [
|
||||
'SU',
|
||||
'MO',
|
||||
'TU',
|
||||
'WE',
|
||||
'TH',
|
||||
'FR',
|
||||
'SA'
|
||||
];
|
||||
|
||||
@Component({
|
||||
selector: 'mifosx-bank-calendar',
|
||||
templateUrl: './bank-calendar.component.html',
|
||||
@@ -118,7 +134,7 @@ export class BankCalendarComponent implements OnInit {
|
||||
];
|
||||
workingDaysConfig: string[] = [];
|
||||
holidays: any[] = [];
|
||||
overallStats = { working: 0, nonWorking: 0, holidays: 0, sundays: 0, sat2nd4th: 0, totalDays: 0 };
|
||||
overallStats = { working: 0, nonWorking: 0, holidays: 0, sundays: 0, sat2nd4th: 0, weeklyOff: 0, totalDays: 0 };
|
||||
|
||||
// ───── Holiday list (office-wise) ─────
|
||||
offices: OfficeLite[] = [];
|
||||
@@ -202,7 +218,8 @@ export class BankCalendarComponent implements OnInit {
|
||||
}
|
||||
|
||||
private loadWorkingDays() {
|
||||
// Default Indian banking working days: Mon-Sat (Sun off, 2nd & 4th Sat off)
|
||||
// Default Indian banking working days: Mon-Sat (Sun off, 2nd & 4th Sat off), used until
|
||||
// Admin > Working Days answers, or if it cannot be read.
|
||||
this.workingDaysConfig = [
|
||||
'MO',
|
||||
'TU',
|
||||
@@ -215,6 +232,19 @@ export class BankCalendarComponent implements OnInit {
|
||||
this.buildCalendar();
|
||||
this.rebuildHolidayRows();
|
||||
|
||||
// The calendar has to agree with Admin > Working Days: a weekday unticked there is off every
|
||||
// week here too.
|
||||
this.organizationService.getWorkingDays().subscribe({
|
||||
next: (data: any) => {
|
||||
const configured = this.parseWorkingDays(data?.recurrence);
|
||||
if (configured.length > 0) {
|
||||
this.workingDaysConfig = configured;
|
||||
this.buildCalendar();
|
||||
}
|
||||
},
|
||||
error: () => {}
|
||||
});
|
||||
|
||||
// Pull offices then fan-out a per-office holiday fetch so each office's
|
||||
// calendar entries are surfaced in the list panel (calendar grid still
|
||||
// unions everything for the year-at-a-glance view).
|
||||
@@ -273,6 +303,23 @@ export class BankCalendarComponent implements OnInit {
|
||||
});
|
||||
}
|
||||
|
||||
/** Weekday codes out of a recurrence such as "FREQ=WEEKLY;INTERVAL=1;BYDAY=MO,TU,WE,TH,FR". */
|
||||
private parseWorkingDays(recurrence: string | undefined): string[] {
|
||||
const byDay = /BYDAY=([^;]*)/.exec(recurrence || '');
|
||||
if (!byDay) {
|
||||
return [];
|
||||
}
|
||||
return byDay[1]
|
||||
.split(',')
|
||||
.map((d) => d.trim().toUpperCase())
|
||||
.filter((d) => DAY_CODES.includes(d));
|
||||
}
|
||||
|
||||
/** True when Admin > Working Days counts Saturday as a working day (so only the 2nd and 4th are off). */
|
||||
get saturdayIsWorkingDay(): boolean {
|
||||
return this.workingDaysConfig.includes('SA');
|
||||
}
|
||||
|
||||
/** Flatten the holidays array into a presentable list with office labels. */
|
||||
private rebuildHolidayRows(): void {
|
||||
this.holidayRows = this.holidays.map((h: any) => {
|
||||
@@ -511,7 +558,15 @@ export class BankCalendarComponent implements OnInit {
|
||||
|
||||
buildCalendar() {
|
||||
this.months = [];
|
||||
this.overallStats = { working: 0, nonWorking: 0, holidays: 0, sundays: 0, sat2nd4th: 0, totalDays: 0 };
|
||||
this.overallStats = {
|
||||
working: 0,
|
||||
nonWorking: 0,
|
||||
holidays: 0,
|
||||
sundays: 0,
|
||||
sat2nd4th: 0,
|
||||
weeklyOff: 0,
|
||||
totalDays: 0
|
||||
};
|
||||
|
||||
for (let m = 0; m < 12; m++) {
|
||||
const monthData = this.buildMonth(m, this.currentYear);
|
||||
@@ -521,6 +576,7 @@ export class BankCalendarComponent implements OnInit {
|
||||
this.overallStats.holidays += monthData.holidays;
|
||||
this.overallStats.sundays += monthData.sundays;
|
||||
this.overallStats.sat2nd4th += monthData.secondFourthSat;
|
||||
this.overallStats.weeklyOff += monthData.weeklyOff;
|
||||
}
|
||||
this.overallStats.totalDays = this.overallStats.working + this.overallStats.nonWorking;
|
||||
}
|
||||
@@ -552,6 +608,7 @@ export class BankCalendarComponent implements OnInit {
|
||||
let holidayCount = 0;
|
||||
let sundayCount = 0;
|
||||
let sat2nd4thCount = 0;
|
||||
let weeklyOffCount = 0;
|
||||
|
||||
// Previous month padding
|
||||
const prevMonthDays = new Date(year, month, 0).getDate();
|
||||
@@ -567,6 +624,7 @@ export class BankCalendarComponent implements OnInit {
|
||||
isSunday: false,
|
||||
is2ndSaturday: false,
|
||||
is4thSaturday: false,
|
||||
isWeeklyOff: false,
|
||||
dayOfWeek: (startDayOfWeek - i - 1 + 7) % 7
|
||||
});
|
||||
}
|
||||
@@ -576,24 +634,29 @@ export class BankCalendarComponent implements OnInit {
|
||||
for (let d = 1; d <= daysInMonth; d++) {
|
||||
const date = new Date(year, month, d);
|
||||
const dow = date.getDay();
|
||||
const isSunday = dow === 0;
|
||||
const isSaturday = dow === 6;
|
||||
const isWorkingWeekday = this.workingDaysConfig.includes(DAY_CODES[dow]);
|
||||
const isSunday = dow === 0 && !isWorkingWeekday;
|
||||
|
||||
if (isSaturday) saturdayCount++;
|
||||
|
||||
const is2ndSat = isSaturday && saturdayCount === 2;
|
||||
const is4thSat = isSaturday && saturdayCount === 4;
|
||||
// RBI: when Saturday is a working day the 2nd and 4th are still off. When Working Days leaves
|
||||
// Saturday out, every Saturday is a weekly off instead.
|
||||
const is2ndSat = isSaturday && isWorkingWeekday && saturdayCount === 2;
|
||||
const is4thSat = isSaturday && isWorkingWeekday && saturdayCount === 4;
|
||||
const isWeeklyOff = dow !== 0 && !isWorkingWeekday;
|
||||
const isToday = date.toDateString() === today.toDateString();
|
||||
|
||||
// Check if holiday
|
||||
const holiday = this.getHolidayForDate(year, month, d);
|
||||
const isHoliday = !!holiday;
|
||||
|
||||
// Non-working: Sunday, 2nd Sat, 4th Sat, or holiday
|
||||
const isNonWorking = isSunday || is2ndSat || is4thSat || isHoliday;
|
||||
// Non-working: Sunday, 2nd Sat, 4th Sat, a weekly off from Working Days, or holiday
|
||||
const isNonWorking = isSunday || is2ndSat || is4thSat || isWeeklyOff || isHoliday;
|
||||
|
||||
if (isSunday) sundayCount++;
|
||||
if (is2ndSat || is4thSat) sat2nd4thCount++;
|
||||
if (is2ndSat || is4thSat || (isSaturday && isWeeklyOff)) sat2nd4thCount++;
|
||||
if (isWeeklyOff && !isSaturday) weeklyOffCount++;
|
||||
if (isHoliday) holidayCount++;
|
||||
|
||||
if (isNonWorking) {
|
||||
@@ -613,6 +676,7 @@ export class BankCalendarComponent implements OnInit {
|
||||
isSunday,
|
||||
is2ndSaturday: is2ndSat,
|
||||
is4thSaturday: is4thSat,
|
||||
isWeeklyOff,
|
||||
holidayName: holiday?.name,
|
||||
dayOfWeek: dow
|
||||
});
|
||||
@@ -632,6 +696,7 @@ export class BankCalendarComponent implements OnInit {
|
||||
isSunday: false,
|
||||
is2ndSaturday: false,
|
||||
is4thSaturday: false,
|
||||
isWeeklyOff: false,
|
||||
dayOfWeek: days.length % 7
|
||||
});
|
||||
}
|
||||
@@ -645,7 +710,8 @@ export class BankCalendarComponent implements OnInit {
|
||||
nonWorkingDays: nonWorkingCount,
|
||||
holidays: holidayCount,
|
||||
sundays: sundayCount,
|
||||
secondFourthSat: sat2nd4thCount
|
||||
secondFourthSat: sat2nd4thCount,
|
||||
weeklyOff: weeklyOffCount
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
@@ -0,0 +1,154 @@
|
||||
<!--
|
||||
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="bor-root">
|
||||
<div class="bor-head">
|
||||
<div class="bor-head-left">
|
||||
<fa-icon icon="gavel" class="bor-head-ic"></fa-icon>
|
||||
<div>
|
||||
<h2 class="bor-head-t">Board of Resolution Register — Share Capital</h2>
|
||||
<p class="bor-head-s">
|
||||
Every share account with the board resolution that authorised the allotment. Accounts with no resolution on
|
||||
record sort to the top.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<button
|
||||
class="bor-btn bor-btn--xls"
|
||||
type="button"
|
||||
[disabled]="exporting || !filtered.length"
|
||||
(click)="exportExcel()"
|
||||
>
|
||||
<fa-icon icon="file-excel"></fa-icon>
|
||||
{{ exporting ? 'Exporting…' : 'Export' }}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
@if (loading) {
|
||||
<div class="bor-note">Loading the register…</div>
|
||||
} @else if (loadError) {
|
||||
<div class="bor-note bor-note--warn"><fa-icon icon="exclamation-triangle"></fa-icon> {{ loadError }}</div>
|
||||
}
|
||||
|
||||
@if (!loading && !loadError) {
|
||||
<!-- Counted over the whole register, not the filtered view: it is a standing figure the
|
||||
secretary acts on, and hiding it behind a filter would hide the problem. -->
|
||||
@if (missingResolutionCount > 0) {
|
||||
<div class="bor-note bor-note--warn">
|
||||
<fa-icon icon="exclamation-triangle"></fa-icon>
|
||||
{{ missingResolutionCount }} share account{{ missingResolutionCount === 1 ? '' : 's' }} carr{{
|
||||
missingResolutionCount === 1 ? 'ies' : 'y'
|
||||
}}
|
||||
no resolution number. Share capital allotted without a board resolution cannot be evidenced to the Registrar.
|
||||
</div>
|
||||
}
|
||||
|
||||
<div class="bor-kpis">
|
||||
<div class="bor-kpi">
|
||||
<div class="bor-kpi-n">{{ filtered.length | number }}</div>
|
||||
<div class="bor-kpi-l">Share Accounts</div>
|
||||
</div>
|
||||
<div class="bor-kpi bor-kpi--blue">
|
||||
<div class="bor-kpi-n">{{ distinctResolutions | number }}</div>
|
||||
<div class="bor-kpi-l">Resolutions</div>
|
||||
</div>
|
||||
<div class="bor-kpi bor-kpi--green">
|
||||
<div class="bor-kpi-n">{{ totalShares | number }}</div>
|
||||
<div class="bor-kpi-l">Shares Allotted</div>
|
||||
</div>
|
||||
<div class="bor-kpi bor-kpi--amber">
|
||||
<div class="bor-kpi-n">₹{{ totalValue | number: '1.0-0' }}</div>
|
||||
<div class="bor-kpi-l">Share Value</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bor-filters">
|
||||
<div class="bor-filter">
|
||||
<label>Resolution No.</label>
|
||||
<input class="bor-inp" type="text" [(ngModel)]="filterResolution" placeholder="e.g. BOR/2026-27/001" />
|
||||
</div>
|
||||
<div class="bor-filter">
|
||||
<label>Branch</label>
|
||||
<select class="bor-inp" [(ngModel)]="filterBranch">
|
||||
<option value="">All branches</option>
|
||||
@for (b of branches; track b) {
|
||||
<option [value]="b">{{ b }}</option>
|
||||
}
|
||||
</select>
|
||||
</div>
|
||||
<div class="bor-filter">
|
||||
<label>Status</label>
|
||||
<select class="bor-inp" [(ngModel)]="filterStatus">
|
||||
<option [ngValue]="''">Any status</option>
|
||||
@for (s of statuses; track s) {
|
||||
<option [ngValue]="s">{{ statusText(s) }}</option>
|
||||
}
|
||||
</select>
|
||||
</div>
|
||||
<div class="bor-filter bor-filter--grow">
|
||||
<label>Search</label>
|
||||
<input class="bor-inp" type="text" [(ngModel)]="search" placeholder="Member name, share A/c or CIF…" />
|
||||
</div>
|
||||
<label class="bor-check">
|
||||
<input type="checkbox" [(ngModel)]="missingOnly" />
|
||||
No resolution only
|
||||
</label>
|
||||
<button class="bor-btn" type="button" (click)="resetFilters()"><fa-icon icon="undo"></fa-icon> Reset</button>
|
||||
</div>
|
||||
|
||||
<div class="bor-table-wrap">
|
||||
<table class="bor-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Resolution No.</th>
|
||||
<th>Resolution Date</th>
|
||||
<th>Share A/c No.</th>
|
||||
<th>CIF No.</th>
|
||||
<th>Member Name</th>
|
||||
<th>Branch</th>
|
||||
<th>Product</th>
|
||||
<th class="num">Shares</th>
|
||||
<th class="num">Share Value</th>
|
||||
<th class="num">Tranches</th>
|
||||
<th>Status</th>
|
||||
<th>Activated On</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@for (r of filtered; track r.shareAccountId) {
|
||||
<tr [class.bor-row--missing]="!r.resolutionNumber">
|
||||
<td>
|
||||
@if (r.resolutionNumber) {
|
||||
<strong class="bor-res">{{ r.resolutionNumber }}</strong>
|
||||
} @else {
|
||||
<span class="bor-missing">Not recorded</span>
|
||||
}
|
||||
</td>
|
||||
<td class="mono">{{ r.resolutionDate || '—' }}</td>
|
||||
<td class="mono">{{ r.accountNo }}</td>
|
||||
<td class="mono">{{ r.cifNumber || '—' }}</td>
|
||||
<td>{{ r.clientName }}</td>
|
||||
<td>{{ r.officeName || '—' }}</td>
|
||||
<td>{{ r.productName || '—' }}</td>
|
||||
<td class="num">{{ r.approvedShares | number }}</td>
|
||||
<td class="num strong">{{ r.shareValue | number: '1.2-2' }}</td>
|
||||
<td class="num">{{ r.trancheCount }}</td>
|
||||
<td>
|
||||
<span [class]="statusClass(r.statusEnum)">{{ statusText(r.statusEnum) }}</span>
|
||||
</td>
|
||||
<td class="mono">{{ r.activatedDate || '—' }}</td>
|
||||
</tr>
|
||||
} @empty {
|
||||
<tr>
|
||||
<td colspan="12" class="bor-empty">No share account matches the filters.</td>
|
||||
</tr>
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
@@ -0,0 +1,313 @@
|
||||
/**
|
||||
* 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/.
|
||||
*/
|
||||
|
||||
.bor-root {
|
||||
padding: 20px 24px 40px;
|
||||
background: #f8fafc;
|
||||
min-height: 100%;
|
||||
}
|
||||
|
||||
.bor-head {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
gap: 16px;
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
.bor-head-left {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.bor-head-ic {
|
||||
font-size: 26px;
|
||||
color: #0f4f3c;
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
.bor-head-t {
|
||||
margin: 0 0 3px;
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
color: #1e293b;
|
||||
}
|
||||
|
||||
.bor-head-s {
|
||||
margin: 0;
|
||||
max-width: 780px;
|
||||
font-size: 13px;
|
||||
line-height: 1.5;
|
||||
color: #64748b;
|
||||
}
|
||||
|
||||
.bor-note {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 9px;
|
||||
padding: 11px 14px;
|
||||
margin-bottom: 14px;
|
||||
border: 1px solid #bfdbfe;
|
||||
border-radius: 9px;
|
||||
background: #eff6ff;
|
||||
color: #1e3a8a;
|
||||
font-size: 12.5px;
|
||||
line-height: 1.55;
|
||||
|
||||
fa-icon {
|
||||
flex: 0 0 auto;
|
||||
margin-top: 1px;
|
||||
}
|
||||
|
||||
/* An allotment with no resolution behind it is the finding, not a detail. */
|
||||
&--warn {
|
||||
border-color: #fde68a;
|
||||
background: #fffbeb;
|
||||
color: #92400e;
|
||||
|
||||
fa-icon {
|
||||
color: #d97706;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.bor-kpis {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
|
||||
gap: 12px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.bor-kpi {
|
||||
background: #fff;
|
||||
border: 1px solid #e2e8f0;
|
||||
border-left: 4px solid #0f4f3c;
|
||||
border-radius: 11px;
|
||||
padding: 12px 16px;
|
||||
|
||||
&--blue {
|
||||
border-left-color: #2563eb;
|
||||
}
|
||||
|
||||
&--green {
|
||||
border-left-color: #15803d;
|
||||
}
|
||||
|
||||
&--amber {
|
||||
border-left-color: #d97706;
|
||||
}
|
||||
}
|
||||
|
||||
.bor-kpi-n {
|
||||
font-size: 22px;
|
||||
font-weight: 700;
|
||||
color: #1e293b;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.bor-kpi-l {
|
||||
font-size: 12px;
|
||||
color: #64748b;
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
.bor-filters {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: flex-end;
|
||||
gap: 12px;
|
||||
padding: 14px 16px;
|
||||
margin-bottom: 14px;
|
||||
background: #fff;
|
||||
border: 1px solid #e2e8f0;
|
||||
border-radius: 11px;
|
||||
}
|
||||
|
||||
.bor-filter {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 4px;
|
||||
|
||||
label {
|
||||
font-size: 10.5px;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.04em;
|
||||
text-transform: uppercase;
|
||||
color: #64748b;
|
||||
}
|
||||
|
||||
&--grow {
|
||||
flex: 1 1 240px;
|
||||
}
|
||||
}
|
||||
|
||||
.bor-inp {
|
||||
height: 34px;
|
||||
min-width: 170px;
|
||||
padding: 0 10px;
|
||||
border: 1px solid #cbd5e1;
|
||||
border-radius: 7px;
|
||||
font: inherit;
|
||||
font-size: 13px;
|
||||
color: #1e293b;
|
||||
background: #fff;
|
||||
|
||||
&:focus {
|
||||
outline: 2px solid #2563eb;
|
||||
outline-offset: -1px;
|
||||
}
|
||||
}
|
||||
|
||||
.bor-check {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
height: 34px;
|
||||
font-size: 12.5px;
|
||||
color: #334155;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.bor-btn {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 7px;
|
||||
height: 34px;
|
||||
padding: 0 14px;
|
||||
border: 1px solid #cbd5e1;
|
||||
border-radius: 7px;
|
||||
background: #fff;
|
||||
font: inherit;
|
||||
font-size: 12.5px;
|
||||
font-weight: 600;
|
||||
color: #334155;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover:not(:disabled) {
|
||||
background: #f1f5f9;
|
||||
}
|
||||
|
||||
&:disabled {
|
||||
opacity: 0.55;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
&--xls {
|
||||
border-color: #15803d;
|
||||
background: #16a34a;
|
||||
color: #fff;
|
||||
|
||||
&:hover:not(:disabled) {
|
||||
background: #15803d;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.bor-table-wrap {
|
||||
background: #fff;
|
||||
border: 1px solid #e2e8f0;
|
||||
border-radius: 11px;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
.bor-table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
font-size: 12.5px;
|
||||
|
||||
th {
|
||||
text-align: left;
|
||||
padding: 10px;
|
||||
background: #f1f5f9;
|
||||
font-size: 10.5px;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.04em;
|
||||
color: #475569;
|
||||
white-space: nowrap;
|
||||
border-bottom: 1px solid #e2e8f0;
|
||||
}
|
||||
|
||||
td {
|
||||
padding: 11px 10px;
|
||||
border-bottom: 1px solid #f1f5f9;
|
||||
vertical-align: middle;
|
||||
color: #334155;
|
||||
}
|
||||
|
||||
.num {
|
||||
text-align: right;
|
||||
font-family: 'DM Mono', monospace;
|
||||
}
|
||||
|
||||
.mono {
|
||||
font-family: 'DM Mono', monospace;
|
||||
}
|
||||
|
||||
.strong {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
tbody tr:hover {
|
||||
background: #f8fafc;
|
||||
}
|
||||
}
|
||||
|
||||
/* The row an auditor is looking for, marked in the table as well as counted above it. */
|
||||
.bor-row--missing {
|
||||
background: #fffbeb;
|
||||
}
|
||||
|
||||
.bor-res {
|
||||
color: #0f4f3c;
|
||||
font-family: 'DM Mono', monospace;
|
||||
}
|
||||
|
||||
.bor-missing {
|
||||
display: inline-block;
|
||||
padding: 2px 8px;
|
||||
border-radius: 999px;
|
||||
background: #fef3c7;
|
||||
color: #92400e;
|
||||
font-size: 11px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.bor-status {
|
||||
display: inline-block;
|
||||
padding: 2px 9px;
|
||||
border-radius: 999px;
|
||||
font-size: 11px;
|
||||
font-weight: 700;
|
||||
background: #f1f5f9;
|
||||
color: #475569;
|
||||
|
||||
&--active {
|
||||
background: #dcfce7;
|
||||
color: #15803d;
|
||||
}
|
||||
|
||||
&--submitted,
|
||||
&--approved {
|
||||
background: #fef3c7;
|
||||
color: #b45309;
|
||||
}
|
||||
|
||||
&--rejected,
|
||||
&--closed {
|
||||
background: #fee2e2;
|
||||
color: #b91c1c;
|
||||
}
|
||||
}
|
||||
|
||||
.bor-empty {
|
||||
padding: 30px;
|
||||
text-align: center;
|
||||
color: #94a3b8;
|
||||
}
|
||||
@@ -0,0 +1,221 @@
|
||||
/**
|
||||
* 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, OnInit, inject } from '@angular/core';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
import { FaIconComponent } from '@fortawesome/angular-fontawesome';
|
||||
import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
|
||||
|
||||
import { exportWorkbook } from '../cashier/cashier-export';
|
||||
import { BorRegisterRow, BorReportService } from './bor-report.service';
|
||||
|
||||
/** m_share_account.status_enum, as the register labels it. */
|
||||
const STATUS_LABEL: Record<number, string> = {
|
||||
100: 'Submitted',
|
||||
200: 'Approved',
|
||||
300: 'Active',
|
||||
400: 'Rejected',
|
||||
500: 'Closed',
|
||||
600: 'Inactive'
|
||||
};
|
||||
|
||||
/**
|
||||
* The Board of Resolution register for share capital.
|
||||
*
|
||||
* A co-operative allots shares only under a board resolution, and this is the list the Registrar or
|
||||
* an auditor asks for: every member's holding against the resolution that authorised it. The
|
||||
* account with no resolution recorded is the point of the register, so it sorts to the top and is
|
||||
* counted on its own rather than being left to be noticed.
|
||||
*/
|
||||
@Component({
|
||||
selector: 'mifosx-bor-report',
|
||||
templateUrl: './bor-report.component.html',
|
||||
styleUrls: ['./bor-report.component.scss'],
|
||||
imports: [
|
||||
...STANDALONE_SHARED_IMPORTS,
|
||||
FaIconComponent,
|
||||
FormsModule
|
||||
]
|
||||
})
|
||||
export class BorReportComponent implements OnInit {
|
||||
private borService = inject(BorReportService);
|
||||
|
||||
readonly statusLabel = STATUS_LABEL;
|
||||
|
||||
rows: BorRegisterRow[] = [];
|
||||
loading = false;
|
||||
loadError = '';
|
||||
|
||||
/** '' = every status. */
|
||||
filterStatus: number | '' = '';
|
||||
filterBranch = '';
|
||||
filterResolution = '';
|
||||
search = '';
|
||||
/** Only the accounts with no resolution on file — the ones that need chasing. */
|
||||
missingOnly = false;
|
||||
|
||||
exporting = false;
|
||||
|
||||
ngOnInit(): void {
|
||||
this.load();
|
||||
}
|
||||
|
||||
load(): void {
|
||||
this.loading = true;
|
||||
this.loadError = '';
|
||||
this.borService.getRegister().subscribe({
|
||||
next: (rows) => {
|
||||
this.loading = false;
|
||||
this.rows = rows;
|
||||
},
|
||||
error: (err: any) => {
|
||||
this.loading = false;
|
||||
this.rows = [];
|
||||
this.loadError = err?.error?.defaultUserMessage || 'Could not load the BOR register.';
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/** Branches present in the data, so the filter offers only what can actually be selected. */
|
||||
get branches(): string[] {
|
||||
return [...new Set(this.rows.map((r) => r.officeName).filter(Boolean))].sort();
|
||||
}
|
||||
|
||||
get statuses(): number[] {
|
||||
return [...new Set(this.rows.map((r) => r.statusEnum))].sort((a, b) => a - b);
|
||||
}
|
||||
|
||||
get filtered(): BorRegisterRow[] {
|
||||
const needle = this.search.trim().toLowerCase();
|
||||
const resolutionNeedle = this.filterResolution.trim().toLowerCase();
|
||||
return this.rows.filter((r) => {
|
||||
if (this.filterStatus !== '' && r.statusEnum !== this.filterStatus) {
|
||||
return false;
|
||||
}
|
||||
if (this.filterBranch && r.officeName !== this.filterBranch) {
|
||||
return false;
|
||||
}
|
||||
if (this.missingOnly && r.resolutionNumber) {
|
||||
return false;
|
||||
}
|
||||
if (resolutionNeedle && !r.resolutionNumber.toLowerCase().includes(resolutionNeedle)) {
|
||||
return false;
|
||||
}
|
||||
if (
|
||||
needle &&
|
||||
!(
|
||||
r.clientName.toLowerCase().includes(needle) ||
|
||||
r.accountNo.toLowerCase().includes(needle) ||
|
||||
r.cifNumber.toLowerCase().includes(needle)
|
||||
)
|
||||
) {
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
});
|
||||
}
|
||||
|
||||
get totalShares(): number {
|
||||
return this.filtered.reduce((s, r) => s + r.approvedShares, 0);
|
||||
}
|
||||
|
||||
get totalValue(): number {
|
||||
return this.filtered.reduce((s, r) => s + r.shareValue, 0);
|
||||
}
|
||||
|
||||
/** How many resolutions the filtered holdings were authorised under. */
|
||||
get distinctResolutions(): number {
|
||||
return new Set(this.filtered.map((r) => r.resolutionNumber).filter(Boolean)).size;
|
||||
}
|
||||
|
||||
get missingResolutionCount(): number {
|
||||
return this.rows.filter((r) => !r.resolutionNumber).length;
|
||||
}
|
||||
|
||||
statusText(statusEnum: number): string {
|
||||
return STATUS_LABEL[statusEnum] || '—';
|
||||
}
|
||||
|
||||
statusClass(statusEnum: number): string {
|
||||
return 'bor-status bor-status--' + (STATUS_LABEL[statusEnum] || 'unknown').toLowerCase();
|
||||
}
|
||||
|
||||
resetFilters(): void {
|
||||
this.filterStatus = '';
|
||||
this.filterBranch = '';
|
||||
this.filterResolution = '';
|
||||
this.search = '';
|
||||
this.missingOnly = false;
|
||||
}
|
||||
|
||||
async exportExcel(): Promise<void> {
|
||||
this.exporting = true;
|
||||
try {
|
||||
const rows = this.filtered;
|
||||
await exportWorkbook(
|
||||
[
|
||||
{
|
||||
sheetName: 'BOR Register',
|
||||
title: 'Board of Resolution Register — Share Capital',
|
||||
subtitle: `${rows.length} share account(s) · ${this.distinctResolutions} resolution(s) · ${this.totalShares} shares`,
|
||||
headers: [
|
||||
'Resolution No.',
|
||||
'Resolution Date',
|
||||
'Share A/c No.',
|
||||
'CIF No.',
|
||||
'Member Name',
|
||||
'Branch',
|
||||
'Product',
|
||||
'Shares',
|
||||
'Unit Price',
|
||||
'Share Value',
|
||||
'Tranches',
|
||||
'Status',
|
||||
'Activated On'
|
||||
],
|
||||
widths: [
|
||||
20,
|
||||
16,
|
||||
18,
|
||||
16,
|
||||
30,
|
||||
18,
|
||||
18,
|
||||
10,
|
||||
12,
|
||||
14,
|
||||
10,
|
||||
12,
|
||||
14
|
||||
],
|
||||
rows: rows.map((r) => [
|
||||
// Named rather than left blank, because an empty cell in a filing reads as an
|
||||
// oversight in the export rather than a gap in the register.
|
||||
r.resolutionNumber || 'NOT RECORDED',
|
||||
r.resolutionDate || '—',
|
||||
r.accountNo,
|
||||
r.cifNumber,
|
||||
r.clientName,
|
||||
r.officeName,
|
||||
r.productName,
|
||||
r.approvedShares,
|
||||
r.unitPrice,
|
||||
r.shareValue,
|
||||
r.trancheCount,
|
||||
this.statusText(r.statusEnum),
|
||||
r.activatedDate || '—'
|
||||
])
|
||||
}
|
||||
],
|
||||
'BOR-Register'
|
||||
);
|
||||
} finally {
|
||||
this.exporting = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,94 @@
|
||||
/**
|
||||
* 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';
|
||||
import { HttpClient, HttpParams } from '@angular/common/http';
|
||||
import { Observable, map } from 'rxjs';
|
||||
|
||||
/** Custom Helpers */
|
||||
import { toIsoDate } from '../core/utils/api-date';
|
||||
|
||||
/** One share account and the board resolution that authorised it. */
|
||||
export interface BorRegisterRow {
|
||||
shareAccountId: number;
|
||||
accountNo: string;
|
||||
clientId: number;
|
||||
cifNumber: string;
|
||||
clientName: string;
|
||||
officeId: number | null;
|
||||
officeName: string;
|
||||
productName: string;
|
||||
currencyCode: string;
|
||||
statusEnum: number;
|
||||
approvedShares: number;
|
||||
pendingShares: number;
|
||||
unitPrice: number;
|
||||
shareValue: number;
|
||||
resolutionNumber: string;
|
||||
/** ISO date, or '' where no meeting date was ever recorded against the allotment. */
|
||||
resolutionDate: string;
|
||||
/** How many purchase tranches make up the holding. */
|
||||
trancheCount: number;
|
||||
submittedDate: string;
|
||||
approvedDate: string;
|
||||
activatedDate: string;
|
||||
closedDate: string;
|
||||
}
|
||||
|
||||
/**
|
||||
* The BOR register.
|
||||
*
|
||||
* One call returns every account with its resolution. The share allotment report next door fetches
|
||||
* each account separately and stops at two hundred, which is a limit on a register rather than on a
|
||||
* page of one.
|
||||
*/
|
||||
@Injectable({ providedIn: 'root' })
|
||||
export class BorReportService {
|
||||
private http = inject(HttpClient);
|
||||
|
||||
getRegister(status?: number, officeId?: number): Observable<BorRegisterRow[]> {
|
||||
let params = new HttpParams();
|
||||
if (status != null) {
|
||||
params = params.set('status', String(status));
|
||||
}
|
||||
if (officeId != null) {
|
||||
params = params.set('officeId', String(officeId));
|
||||
}
|
||||
return this.http
|
||||
.get<any[]>('/shareaccounts/bor-register', { params })
|
||||
.pipe(map((rows) => (rows || []).map((r) => this.toRow(r))));
|
||||
}
|
||||
|
||||
/** Dates arrive as [y, M, d] arrays; flattened to ISO so they sort and filter as strings. */
|
||||
private toRow(r: any): BorRegisterRow {
|
||||
return {
|
||||
shareAccountId: r.shareAccountId,
|
||||
accountNo: r.accountNo || '',
|
||||
clientId: r.clientId,
|
||||
cifNumber: r.cifNumber || '',
|
||||
clientName: r.clientName || '',
|
||||
officeId: r.officeId ?? null,
|
||||
officeName: r.officeName || '',
|
||||
productName: r.productName || '',
|
||||
currencyCode: r.currencyCode || 'INR',
|
||||
statusEnum: Number(r.statusEnum) || 0,
|
||||
approvedShares: Number(r.approvedShares) || 0,
|
||||
pendingShares: Number(r.pendingShares) || 0,
|
||||
unitPrice: Number(r.unitPrice) || 0,
|
||||
shareValue: Number(r.shareValue) || 0,
|
||||
resolutionNumber: (r.resolutionNumber || '').trim(),
|
||||
resolutionDate: toIsoDate(r.resolutionDate),
|
||||
trancheCount: Number(r.trancheCount) || 0,
|
||||
submittedDate: toIsoDate(r.submittedDate),
|
||||
approvedDate: toIsoDate(r.approvedDate),
|
||||
activatedDate: toIsoDate(r.activatedDate),
|
||||
closedDate: toIsoDate(r.closedDate)
|
||||
};
|
||||
}
|
||||
}
|
||||
@@ -12,6 +12,7 @@ import { FormsModule } from '@angular/forms';
|
||||
import { MatIconModule } from '@angular/material/icon';
|
||||
import { catchError, of } from 'rxjs';
|
||||
import { CashierService } from '../cashier.service';
|
||||
import { businessToday } from 'app/core/utils/business-today';
|
||||
|
||||
interface RegisterRow {
|
||||
accountId: number;
|
||||
@@ -83,7 +84,7 @@ export class AccountRegisterComponent implements OnInit {
|
||||
|
||||
/** Local date — toISOString() would shift the day in any timezone behind UTC. */
|
||||
private today(): string {
|
||||
const d = new Date();
|
||||
const d = businessToday();
|
||||
return `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`;
|
||||
}
|
||||
|
||||
|
||||
@@ -0,0 +1,114 @@
|
||||
<!--
|
||||
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="pg">
|
||||
<header class="pg-head">
|
||||
<div>
|
||||
<div class="pg-eyebrow">BRANCH OPERATIONS · BRANCH CASH POSITION</div>
|
||||
<h1 class="pg-title">Branch Cash Position</h1>
|
||||
<p class="pg-sub">
|
||||
The notes and coins the branch holds, denomination by denomination: the vault plus every cashier's drawer. Cash
|
||||
moving between the vault and a cashier nets out; deposits, withdrawals and exchanges change it.
|
||||
</p>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="pg-toolbar pg-toolbar--mat">
|
||||
<mat-form-field appearance="outline" subscriptSizing="dynamic">
|
||||
<mat-label>As of Date</mat-label>
|
||||
<input matInput type="date" [value]="asOfDate" (change)="onDateChange($any($event.target).value)" />
|
||||
</mat-form-field>
|
||||
<button type="button" class="pg-btn pg-btn--primary" (click)="load()" [disabled]="loading">
|
||||
<mat-icon>refresh</mat-icon> Refresh
|
||||
</button>
|
||||
</div>
|
||||
|
||||
@if (errorMsg) {
|
||||
<div class="pg-empty bcp-error">{{ errorMsg }}</div>
|
||||
}
|
||||
@if (loading) {
|
||||
<div class="pg-empty">Loading…</div>
|
||||
}
|
||||
|
||||
@if (position; as p) {
|
||||
<div class="bcp-totals">
|
||||
<div class="bcp-total">
|
||||
<span>Branch</span><strong>{{ p.officeName }}</strong>
|
||||
</div>
|
||||
<div class="bcp-total">
|
||||
<span>Vault</span><strong>₹{{ p.vaultAmount | number: '1.2-2' }}</strong>
|
||||
</div>
|
||||
<div class="bcp-total">
|
||||
<span>Cashiers' drawers</span><strong>₹{{ p.cashiersAmount | number: '1.2-2' }}</strong>
|
||||
</div>
|
||||
<div class="bcp-total bcp-total--main">
|
||||
<span>Bank total</span><strong>₹{{ p.totalAmount | number: '1.2-2' }}</strong>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@if (!p.vaultHasBreakdown) {
|
||||
<div class="pg-empty bcp-note">
|
||||
No vault denomination breakdown was recorded on or before {{ p.asOfDate }}, so the vault column reads 0. Open
|
||||
the business day with a note/coin count to start tracking it.
|
||||
</div>
|
||||
}
|
||||
|
||||
<ng-template #table let-rows let-label="label" let-coin="coin">
|
||||
@if (rows.length > 0) {
|
||||
<div class="pos-section-label" [class.pos-section-label--coin]="coin">{{ label }}</div>
|
||||
<table class="pg-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Denomination</th>
|
||||
<th class="num">Vault</th>
|
||||
<th class="num">Cashiers</th>
|
||||
<th class="num">Bank total (count)</th>
|
||||
<th class="num">Bank total (₹)</th>
|
||||
<th class="num">Exchange today</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@for (d of rows; track d.denominationId) {
|
||||
<tr>
|
||||
<td>
|
||||
<span class="pg-chip" [class.pg-chip--coin]="coin">₹{{ d.denominationValue }}</span>
|
||||
</td>
|
||||
<td class="num">{{ d.vaultCount }}</td>
|
||||
<td class="num">{{ d.cashierCount }}</td>
|
||||
<td class="num bcp-strong">{{ d.totalCount }}</td>
|
||||
<td class="num">₹{{ d.totalAmount | number: '1.2-2' }}</td>
|
||||
<td
|
||||
class="num bcp-move"
|
||||
[class.bcp-move--in]="d.exchangeNet > 0"
|
||||
[class.bcp-move--out]="d.exchangeNet < 0"
|
||||
>
|
||||
{{ movement(d.exchangeNet) }}
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
}
|
||||
</ng-template>
|
||||
|
||||
<div class="pg-card bcp-card">
|
||||
<ng-container
|
||||
*ngTemplateOutlet="table; context: { $implicit: notes(), label: 'Notes', coin: false }"
|
||||
></ng-container>
|
||||
<ng-container
|
||||
*ngTemplateOutlet="table; context: { $implicit: coins(), label: 'Coins', coin: true }"
|
||||
></ng-container>
|
||||
</div>
|
||||
|
||||
<p class="bcp-foot">
|
||||
<strong>Exchange today</strong> is the notes taken in less the notes given out by cash exchanges on
|
||||
{{ p.asOfDate }}. It is already part of the Cashiers column; it is shown beside the total so a change in the mix
|
||||
can be seen.
|
||||
</p>
|
||||
}
|
||||
</div>
|
||||
@@ -0,0 +1,82 @@
|
||||
/**
|
||||
* 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/.
|
||||
*/
|
||||
|
||||
.bcp-error {
|
||||
color: #dc2626;
|
||||
}
|
||||
|
||||
.bcp-note {
|
||||
margin-bottom: 12px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.bcp-totals {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 12px;
|
||||
margin-bottom: 14px;
|
||||
}
|
||||
|
||||
.bcp-total {
|
||||
flex: 1 1 180px;
|
||||
padding: 12px 14px;
|
||||
background: #fff;
|
||||
border: 1px solid #e2e8f0;
|
||||
border-radius: 12px;
|
||||
|
||||
span {
|
||||
display: block;
|
||||
font-size: 11px;
|
||||
font-weight: 600;
|
||||
letter-spacing: 0.04em;
|
||||
text-transform: uppercase;
|
||||
color: #64748b;
|
||||
}
|
||||
|
||||
strong {
|
||||
font-size: 18px;
|
||||
font-weight: 700;
|
||||
color: #0f172a;
|
||||
}
|
||||
|
||||
&--main {
|
||||
background: #e6f4ee;
|
||||
border-color: #1f7a4d;
|
||||
|
||||
strong {
|
||||
color: #0f4f3c;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.bcp-card {
|
||||
margin-bottom: 14px;
|
||||
}
|
||||
|
||||
.bcp-strong {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.bcp-move {
|
||||
font-weight: 700;
|
||||
color: #94a3b8;
|
||||
|
||||
&--in {
|
||||
color: #16a34a;
|
||||
}
|
||||
|
||||
&--out {
|
||||
color: #dc2626;
|
||||
}
|
||||
}
|
||||
|
||||
.bcp-foot {
|
||||
margin: 0;
|
||||
font-size: 12px;
|
||||
color: #64748b;
|
||||
}
|
||||
@@ -0,0 +1,112 @@
|
||||
/**
|
||||
* 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, OnInit, inject } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { MatIconModule } from '@angular/material/icon';
|
||||
import { MatFormFieldModule } from '@angular/material/form-field';
|
||||
import { MatInputModule } from '@angular/material/input';
|
||||
import { of } from 'rxjs';
|
||||
import { catchError } from 'rxjs/operators';
|
||||
import { CashierService } from '../cashier.service';
|
||||
import { businessToday } from 'app/core/utils/business-today';
|
||||
|
||||
interface BranchDenomRow {
|
||||
denominationId: number;
|
||||
denominationValue: number;
|
||||
kind: string;
|
||||
vaultCount: number;
|
||||
cashierCount: number;
|
||||
totalCount: number;
|
||||
totalAmount: number;
|
||||
/** Notes taken in less notes given out by exchanges on the day. */
|
||||
exchangeNet: number;
|
||||
}
|
||||
|
||||
interface BranchPosition {
|
||||
officeId: number;
|
||||
officeName: string;
|
||||
asOfDate: string;
|
||||
vaultHasBreakdown: boolean;
|
||||
vaultAmount: number;
|
||||
cashiersAmount: number;
|
||||
totalAmount: number;
|
||||
denominations: BranchDenomRow[];
|
||||
}
|
||||
|
||||
/**
|
||||
* What the branch holds, denomination by denomination: the vault plus every cashier's drawer. An exchange
|
||||
* (a customer hands in 10 x ₹500 and leaves with 50 x ₹100) leaves the vault alone and changes a drawer, so
|
||||
* it only shows up in this total -- +10 on ₹500, -50 on ₹100.
|
||||
*/
|
||||
@Component({
|
||||
selector: 'mifosx-branch-cash-position',
|
||||
templateUrl: './branch-cash-position.component.html',
|
||||
styleUrls: [
|
||||
'../cashier-shared.scss',
|
||||
'../cashier-position/cashier-position.component.scss',
|
||||
'./branch-cash-position.component.scss'
|
||||
],
|
||||
standalone: true,
|
||||
imports: [
|
||||
CommonModule,
|
||||
MatIconModule,
|
||||
MatFormFieldModule,
|
||||
MatInputModule
|
||||
]
|
||||
})
|
||||
export class BranchCashPositionComponent implements OnInit {
|
||||
private service = inject(CashierService);
|
||||
|
||||
asOfDate = '';
|
||||
loading = false;
|
||||
errorMsg = '';
|
||||
position: BranchPosition | null = null;
|
||||
|
||||
ngOnInit(): void {
|
||||
const d = businessToday();
|
||||
this.asOfDate = `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`;
|
||||
this.load();
|
||||
}
|
||||
|
||||
load(): void {
|
||||
this.loading = true;
|
||||
this.errorMsg = '';
|
||||
this.position = null;
|
||||
this.service
|
||||
.branchCashPosition(this.asOfDate)
|
||||
.pipe(catchError(() => of(null)))
|
||||
.subscribe((data: BranchPosition | null) => {
|
||||
this.loading = false;
|
||||
if (!data) {
|
||||
this.errorMsg = 'Could not load the branch cash position.';
|
||||
return;
|
||||
}
|
||||
this.position = data;
|
||||
});
|
||||
}
|
||||
|
||||
onDateChange(value: string): void {
|
||||
this.asOfDate = value;
|
||||
this.load();
|
||||
}
|
||||
|
||||
notes(): BranchDenomRow[] {
|
||||
return (this.position?.denominations || []).filter((d) => d.kind !== 'coin');
|
||||
}
|
||||
|
||||
coins(): BranchDenomRow[] {
|
||||
return (this.position?.denominations || []).filter((d) => d.kind === 'coin');
|
||||
}
|
||||
|
||||
/** "+10", "-50", or a dash when the day's exchanges did not touch the denomination. */
|
||||
movement(net: number): string {
|
||||
if (!net) return '—';
|
||||
return net > 0 ? `+${net}` : `${net}`;
|
||||
}
|
||||
}
|
||||
@@ -107,11 +107,26 @@
|
||||
</span>
|
||||
</div>
|
||||
@if (canOperate) {
|
||||
<button type="button" class="pg-btn pg-btn--primary" (click)="startClose(openDay)">
|
||||
<button
|
||||
type="button"
|
||||
class="pg-btn pg-btn--primary"
|
||||
(click)="startClose(openDay)"
|
||||
[disabled]="interestPending.length > 0"
|
||||
>
|
||||
<mat-icon>lock</mat-icon> Close Day
|
||||
</button>
|
||||
}
|
||||
</div>
|
||||
@if (interestPending.length > 0) {
|
||||
<div class="bd-interest-alert">
|
||||
<mat-icon>warning</mat-icon>
|
||||
<span>
|
||||
Savings interest posting report is not approved for <strong>{{ interestPending.join(', ') }}</strong
|
||||
>. Approve it in <a routerLink="/reports/interest-posting">Reports → Interest Posting Reports</a> before
|
||||
closing the day.
|
||||
</span>
|
||||
</div>
|
||||
}
|
||||
} @else if (loaded && canOperate) {
|
||||
<div class="bd-current bd-current--shut">
|
||||
<div class="bd-current__main">
|
||||
@@ -337,6 +352,51 @@
|
||||
</div>
|
||||
}
|
||||
|
||||
<!-- Interest waiting to be posted as this branch closes. Posting runs as part of the close, so
|
||||
anything unapproved stops it: the branch sees here what it has to approve and where, rather
|
||||
than finding out from a refusal after filling in the whole count. -->
|
||||
@if (preview?.fdInterestDue?.length) {
|
||||
<div class="bd-calc bd-calc--fd">
|
||||
<div class="bd-calc__head">
|
||||
<mat-icon>savings</mat-icon>
|
||||
<strong>Fixed deposit interest due today</strong>
|
||||
</div>
|
||||
@for (d of preview.fdInterestDue; track d.productId) {
|
||||
<div class="bd-calc__row">
|
||||
<span>
|
||||
{{ d.productName }} · {{ d.fdType }} · {{ d.accountCount }} deposit(s)
|
||||
@if (d.reportStatus === 'APPROVED' || d.reportStatus === 'POSTED') {
|
||||
<span class="bd-fd-ok">{{ d.reportStatus }}</span>
|
||||
} @else {
|
||||
<span class="bd-fd-pending">{{ d.reportStatus === 'NONE' ? 'NO REPORT' : d.reportStatus }}</span>
|
||||
}
|
||||
</span>
|
||||
<span class="bd-calc__amt">₹{{ d.totalInterest | number: '1.2-2' }}</span>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
@if (preview?.fdInterestPending?.length) {
|
||||
<div class="bd-warn">
|
||||
<mat-icon>warning</mat-icon>
|
||||
<div>
|
||||
<strong>The day cannot be closed yet.</strong> Fixed deposit interest is not approved for:
|
||||
{{ preview.fdInterestPending.join(', ') }}. Approve it under Reports → FD Interest Posting Reports, then
|
||||
close the day. The user who generated a report cannot approve it.
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
@if (preview?.savingsInterestPending?.length) {
|
||||
<div class="bd-warn">
|
||||
<mat-icon>warning</mat-icon>
|
||||
<div>
|
||||
<strong>The day cannot be closed yet.</strong> Savings interest is not approved for:
|
||||
{{ preview.savingsInterestPending.join(', ') }}. Approve it under Reports → Interest Posting Reports, then
|
||||
close the day.
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
<!-- What every cash point under this branch is actually holding right now, fetched
|
||||
automatically — so closing the day doesn't mean separately checking Vault Position and
|
||||
every cashier's own Cashier Position screen by hand. -->
|
||||
|
||||
@@ -195,6 +195,75 @@
|
||||
font-size: 11px;
|
||||
color: #94a3b8;
|
||||
}
|
||||
|
||||
/* Names the block, for the interest panels that sit beside the cash arithmetic. */
|
||||
&__head {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
margin-bottom: 6px;
|
||||
padding-bottom: 6px;
|
||||
border-bottom: 1px solid #e2e8f0;
|
||||
font-size: 13px;
|
||||
color: #0d1b2a;
|
||||
|
||||
mat-icon {
|
||||
font-size: 18px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
color: #1d4ed8;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* Interest is money leaving as the day closes, not cash counted in the drawer. */
|
||||
.bd-calc--fd {
|
||||
border-left: 3px solid #1d4ed8;
|
||||
}
|
||||
|
||||
.bd-fd-ok,
|
||||
.bd-fd-pending {
|
||||
display: inline-block;
|
||||
margin-left: 6px;
|
||||
padding: 1px 7px;
|
||||
border-radius: 999px;
|
||||
font-size: 10px;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.02em;
|
||||
}
|
||||
|
||||
.bd-fd-ok {
|
||||
background: #dcfce7;
|
||||
color: #15803d;
|
||||
}
|
||||
|
||||
.bd-fd-pending {
|
||||
background: #fef3c7;
|
||||
color: #b45309;
|
||||
}
|
||||
|
||||
/* Why the close will be refused, said before the count is filled in rather than after. */
|
||||
.bd-warn {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 8px;
|
||||
max-width: 640px;
|
||||
margin-bottom: 14px;
|
||||
padding: 10px 14px;
|
||||
background: #fffbeb;
|
||||
border: 1px solid #fcd34d;
|
||||
border-radius: 8px;
|
||||
font-size: 12px;
|
||||
line-height: 1.5;
|
||||
color: #78350f;
|
||||
|
||||
mat-icon {
|
||||
flex-shrink: 0;
|
||||
font-size: 20px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
color: #b45309;
|
||||
}
|
||||
}
|
||||
|
||||
.bd-hint {
|
||||
@@ -372,3 +441,30 @@
|
||||
color: #d97706;
|
||||
}
|
||||
}
|
||||
|
||||
// Shown under the open day while a savings interest posting report due today is unapproved.
|
||||
.bd-interest-alert {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 8px;
|
||||
margin: 8px 0 12px;
|
||||
padding: 10px 14px;
|
||||
border: 1px solid #f59e0b;
|
||||
border-radius: 8px;
|
||||
background: #fef3c7;
|
||||
color: #92400e;
|
||||
font-size: 13px;
|
||||
|
||||
mat-icon {
|
||||
flex-shrink: 0;
|
||||
font-size: 20px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
a {
|
||||
color: inherit;
|
||||
font-weight: 600;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -189,6 +189,23 @@ export class BranchDayComponent implements OnInit {
|
||||
return this.totalOf(this.closeCounts);
|
||||
}
|
||||
|
||||
/**
|
||||
* Savings products whose interest posting report is due today and not yet approved. The close is
|
||||
* refused by the backend while any is pending; this only says so before the user tries.
|
||||
*/
|
||||
interestPending: string[] = [];
|
||||
|
||||
private checkInterestReports(): void {
|
||||
if (!this.openDay?.businessDate) {
|
||||
this.interestPending = [];
|
||||
return;
|
||||
}
|
||||
this.service
|
||||
.interestDayCloseCheck(this.openDay.businessDate, this.openDay.officeId)
|
||||
.pipe(catchError(() => of(null)))
|
||||
.subscribe((res) => (this.interestPending = res?.pendingProducts ?? []));
|
||||
}
|
||||
|
||||
load(): void {
|
||||
this.loading = true;
|
||||
this.errorMsg = '';
|
||||
@@ -210,6 +227,7 @@ export class BranchDayComponent implements OnInit {
|
||||
this.canOperate = !!res?.canOperate;
|
||||
this.openDate = this.today;
|
||||
this.checkFirstOpenCashMigration();
|
||||
this.checkInterestReports();
|
||||
});
|
||||
|
||||
this.service
|
||||
|
||||
+2
-1
@@ -11,6 +11,7 @@ import { CommonModule } from '@angular/common';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
import { AuthenticationService } from '../../core/authentication/authentication.service';
|
||||
import { ExportSheetSpec, exportWorkbook } from '../cashier-export';
|
||||
import { businessToday } from 'app/core/utils/business-today';
|
||||
|
||||
interface SummaryRow {
|
||||
code: string;
|
||||
@@ -1316,7 +1317,7 @@ export class CashClearingTransferSummaryComponent {
|
||||
private dateTag = '2607';
|
||||
|
||||
constructor() {
|
||||
const d = new Date();
|
||||
const d = businessToday();
|
||||
this.asOnDate = `${String(d.getDate()).padStart(2, '0')}-${String(d.getMonth() + 1).padStart(2, '0')}-${d.getFullYear()}`;
|
||||
this.dateTag = `${String(d.getFullYear()).slice(-2)}${String(d.getMonth() + 1).padStart(2, '0')}`;
|
||||
|
||||
|
||||
@@ -22,50 +22,255 @@
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<!-- ── Customer Info Bar ── -->
|
||||
<div class="cx-customer-bar">
|
||||
<div
|
||||
class="cx-customer-toggle"
|
||||
[class.cx-customer-toggle--active]="isAccountHolder"
|
||||
(click)="toggleAccountHolder()"
|
||||
>
|
||||
<mat-icon>{{ isAccountHolder ? 'check_box' : 'check_box_outline_blank' }}</mat-icon>
|
||||
<span>Account Holder</span>
|
||||
</div>
|
||||
|
||||
@if (isAccountHolder) {
|
||||
<label class="cx-field cx-field--inline">
|
||||
<span>Account No.</span>
|
||||
<input
|
||||
type="text"
|
||||
[value]="accountNo"
|
||||
(input)="accountNo = $any($event.target).value"
|
||||
placeholder="e.g. 000101234567"
|
||||
/>
|
||||
</label>
|
||||
} @else {
|
||||
<span class="cx-walk-in"><mat-icon>person_outline</mat-icon> Walk-in Customer</span>
|
||||
}
|
||||
|
||||
@if (needsIdProof) {
|
||||
<div class="cx-pan-required">
|
||||
<mat-icon>warning</mat-icon>
|
||||
<span>Amount ≥ ₹50,000 — Customer PAN / Aadhaar required (RBI)</span>
|
||||
<!-- ── Cashier: whose drawer takes the customer's notes and gives the change ── -->
|
||||
@if (cashier) {
|
||||
<section class="cx-cashier">
|
||||
<div class="cx-avatar cx-avatar--sm">{{ cashierInitials }}</div>
|
||||
<div class="cx-cashier__id">
|
||||
<div class="cx-cashier__label">Cashier at the counter</div>
|
||||
<div class="cx-cashier__name">{{ cashier.name || '—' }}</div>
|
||||
<div class="cx-cashier__flow">
|
||||
<span><mat-icon>south</mat-icon> Receives from customer</span>
|
||||
<span><mat-icon>north</mat-icon> Gives to customer</span>
|
||||
</div>
|
||||
</div>
|
||||
<label class="cx-field cx-field--inline cx-field--pan">
|
||||
<span>PAN / Aadhaar *</span>
|
||||
<input
|
||||
type="text"
|
||||
[value]="customerIdProof"
|
||||
(input)="customerIdProof = $any($event.target).value"
|
||||
placeholder="ABCDE1234F"
|
||||
maxlength="20"
|
||||
/>
|
||||
</label>
|
||||
}
|
||||
</div>
|
||||
<div class="cx-cashier__stats">
|
||||
<div>
|
||||
<span>Counter</span><strong>{{ cashier.tellerName || '—' }}</strong>
|
||||
</div>
|
||||
<div>
|
||||
<span>Branch</span><strong>{{ cashier.officeName || '—' }}</strong>
|
||||
</div>
|
||||
<div>
|
||||
<span>Allocated today</span
|
||||
><strong>{{
|
||||
cashier.allocatedAmount === null ? '—' : '₹' + (cashier.allocatedAmount | number: '1.2-2')
|
||||
}}</strong>
|
||||
</div>
|
||||
<div>
|
||||
<span>Cash in hand</span><strong>₹{{ cashier.totalAmount | number: '1.2-2' }}</strong>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
} @else if (noCashier) {
|
||||
<section class="cx-cashier cx-cashier--none">
|
||||
<mat-icon>person_off</mat-icon>
|
||||
<div>
|
||||
<div class="cx-cashier__name">Your login is not linked to a cashier</div>
|
||||
<div class="cx-cashier__label">
|
||||
A cash exchange moves notes in and out of a cashier's drawer, so it can only be recorded by a cashier. Log in
|
||||
as a cashier to continue.
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
}
|
||||
|
||||
<!-- ── Customer: an existing client (details from their record) or a walk-in identified at the counter ── -->
|
||||
<section class="cx-cust">
|
||||
<header class="cx-cust__head">
|
||||
<div class="cx-cust__title">
|
||||
<span class="cx-cust__title-icon"><mat-icon>groups</mat-icon></span>
|
||||
<div>
|
||||
<div class="cx-cust__title-text">Customer</div>
|
||||
<div class="cx-cust__title-sub">Who is exchanging cash at the counter</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="cx-cust__modes" role="tablist" aria-label="Customer type">
|
||||
<button
|
||||
type="button"
|
||||
role="tab"
|
||||
class="cx-cust__mode"
|
||||
[class.cx-cust__mode--active]="customerMode === 'existing'"
|
||||
[attr.aria-selected]="customerMode === 'existing'"
|
||||
(click)="setCustomerMode('existing')"
|
||||
>
|
||||
<mat-icon>badge</mat-icon> Existing Customer
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
role="tab"
|
||||
class="cx-cust__mode"
|
||||
[class.cx-cust__mode--active]="customerMode === 'walkin'"
|
||||
[attr.aria-selected]="customerMode === 'walkin'"
|
||||
(click)="setCustomerMode('walkin')"
|
||||
>
|
||||
<mat-icon>person_outline</mat-icon> Walk-in Customer
|
||||
</button>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="cx-cust__body">
|
||||
<!-- Who -->
|
||||
<div class="cx-cust__who">
|
||||
@if (customerMode === 'existing') {
|
||||
@if (loadingCustomer) {
|
||||
<div class="cx-cust__empty">
|
||||
<mat-icon class="cx-cust__empty-icon cx-spin">autorenew</mat-icon>
|
||||
<div class="cx-cust__empty-title">Loading customer details…</div>
|
||||
</div>
|
||||
} @else if (!selectedCustomer) {
|
||||
<div class="cx-cust__empty">
|
||||
<mat-icon class="cx-cust__empty-icon">person_search</mat-icon>
|
||||
<div class="cx-cust__empty-title">No customer selected</div>
|
||||
<div class="cx-cust__empty-sub">Search by name, account no., PAN or Aadhaar</div>
|
||||
<button type="button" class="cx-btn cx-btn--primary" (click)="openCustomerSearch()">
|
||||
<mat-icon>search</mat-icon> Search Customer
|
||||
</button>
|
||||
</div>
|
||||
} @else {
|
||||
<div class="cx-cust__card">
|
||||
<div class="cx-cust__card-top">
|
||||
<div class="cx-avatar">{{ customerInitials }}</div>
|
||||
<div class="cx-cust__card-id">
|
||||
<div class="cx-cust__name">{{ selectedCustomer.displayName }}</div>
|
||||
<div class="cx-cust__badges">
|
||||
<span
|
||||
class="cx-kyc"
|
||||
[class.cx-kyc--ok]="selectedCustomer.kycStatus === 'Verified'"
|
||||
[class.cx-kyc--warn]="selectedCustomer.kycStatus !== 'Verified'"
|
||||
>
|
||||
<mat-icon>{{
|
||||
selectedCustomer.kycStatus === 'Verified' ? 'verified_user' : 'gpp_maybe'
|
||||
}}</mat-icon>
|
||||
KYC: {{ selectedCustomer.kycStatus }}
|
||||
</span>
|
||||
@if (selectedCustomer.accountType) {
|
||||
<span class="cx-chip-tag">{{ selectedCustomer.accountType }}</span>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
<div class="cx-cust__card-actions">
|
||||
<button type="button" class="cx-link-btn" (click)="openCustomerSearch()">
|
||||
<mat-icon>swap_horiz</mat-icon> Change
|
||||
</button>
|
||||
<button type="button" class="cx-link-btn cx-link-btn--danger" (click)="clearCustomer()">
|
||||
<mat-icon>close</mat-icon> Remove
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="cx-cust__grid">
|
||||
<div>
|
||||
<span>CIF No.</span><strong>{{ selectedCustomer.cifNumber || '—' }}</strong>
|
||||
</div>
|
||||
<div>
|
||||
<span>Client ID</span><strong>{{ selectedCustomer.clientId }}</strong>
|
||||
</div>
|
||||
<div>
|
||||
<span>Mobile</span><strong>{{ selectedCustomer.mobileNo || '—' }}</strong>
|
||||
</div>
|
||||
<div>
|
||||
<span>Branch</span><strong>{{ selectedCustomer.officeName || '—' }}</strong>
|
||||
</div>
|
||||
<div>
|
||||
<span>Account</span><strong>{{ selectedCustomer.accountNo || 'No account' }}</strong>
|
||||
</div>
|
||||
<div>
|
||||
<span>PAN on record</span>
|
||||
<strong>
|
||||
{{ selectedCustomer.kycPan || 'Not on record' }}
|
||||
@if (selectedCustomer.kycPan) {
|
||||
<span
|
||||
class="cx-kyc cx-kyc--sm"
|
||||
[class.cx-kyc--ok]="selectedCustomer.panVerified"
|
||||
[class.cx-kyc--warn]="!selectedCustomer.panVerified"
|
||||
>{{ selectedCustomer.panVerified ? 'Verified' : 'Not verified' }}</span
|
||||
>
|
||||
}
|
||||
</strong>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
} @else {
|
||||
<div class="cx-cust__walkin">
|
||||
<label class="cx-field">
|
||||
<span>Customer Name{{ needsPan ? ' *' : '' }}</span>
|
||||
<input
|
||||
type="text"
|
||||
[value]="walkInName"
|
||||
(input)="walkInName = $any($event.target).value"
|
||||
placeholder="Full name as on ID"
|
||||
maxlength="150"
|
||||
autocomplete="off"
|
||||
/>
|
||||
</label>
|
||||
<label class="cx-field">
|
||||
<span>Mobile</span>
|
||||
<input
|
||||
type="tel"
|
||||
inputmode="numeric"
|
||||
[value]="walkInMobile"
|
||||
(input)="walkInMobile = $any($event.target).value"
|
||||
placeholder="10-digit mobile number"
|
||||
maxlength="15"
|
||||
autocomplete="off"
|
||||
/>
|
||||
</label>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
|
||||
<!-- PAN -->
|
||||
<div
|
||||
class="cx-pan"
|
||||
[class.cx-pan--required]="panMissing"
|
||||
[class.cx-pan--invalid]="panFormatInvalid"
|
||||
[class.cx-pan--valid]="panValue && !panFormatInvalid"
|
||||
>
|
||||
<div class="cx-pan__head">
|
||||
<mat-icon>credit_card</mat-icon>
|
||||
<span class="cx-pan__label">PAN Card</span>
|
||||
<span class="cx-pan__tag" [class.cx-pan__tag--on]="needsPan">{{ needsPan ? 'Mandatory' : 'Optional' }}</span>
|
||||
</div>
|
||||
<div class="cx-pan__input">
|
||||
<input
|
||||
type="text"
|
||||
[value]="panNumber"
|
||||
(input)="panNumber = $any($event.target).value.toUpperCase()"
|
||||
placeholder="ABCDE1234F"
|
||||
maxlength="10"
|
||||
autocomplete="off"
|
||||
spellcheck="false"
|
||||
aria-label="PAN number"
|
||||
/>
|
||||
@if (panValue && !panFormatInvalid) {
|
||||
<mat-icon class="cx-pan__state cx-pan__state--ok">check_circle</mat-icon>
|
||||
} @else if (panFormatInvalid) {
|
||||
<mat-icon class="cx-pan__state cx-pan__state--bad">error</mat-icon>
|
||||
}
|
||||
</div>
|
||||
<div class="cx-pan__hint">
|
||||
@if (panFormatInvalid) {
|
||||
PAN is 5 letters, 4 digits, 1 letter (e.g. ABCDE1234F).
|
||||
} @else if (panFromKyc) {
|
||||
<mat-icon>link</mat-icon> Fetched from the customer's KYC record.
|
||||
} @else if (panMissing) {
|
||||
Required: this exchange is above ₹50,000 (Income Tax Rule 114B / RBI).
|
||||
} @else {
|
||||
Mandatory for exchanges above ₹50,000.
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="cx-cols">
|
||||
<!-- The cashier's count of a denomination and what this exchange does to it, updated as counts are typed. -->
|
||||
<ng-template #drawerCell let-d="d">
|
||||
@if (availableFor(d) === null) {
|
||||
—
|
||||
} @else {
|
||||
In drawer <strong>{{ availableFor(d) }}</strong>
|
||||
@if (netFor(d) !== 0) {
|
||||
<span class="cx-after">
|
||||
<mat-icon>{{ netFor(d) > 0 ? 'trending_up' : 'trending_down' }}</mat-icon>
|
||||
<strong>{{ drawerAfter(d) }}</strong>
|
||||
<small>({{ netFor(d) > 0 ? '+' : '' }}{{ netFor(d) }})</small>
|
||||
</span>
|
||||
}
|
||||
}
|
||||
</ng-template>
|
||||
|
||||
<!-- RECEIVED -->
|
||||
<section class="cx-col cx-col--received">
|
||||
<header class="cx-col-head">
|
||||
@@ -78,7 +283,7 @@
|
||||
<div class="cx-subhead">Bank Notes</div>
|
||||
}
|
||||
@for (d of notes; track d.id) {
|
||||
<div class="cx-row">
|
||||
<div class="cx-row cx-row--stock">
|
||||
<span class="cx-chip">{{ d.label }}</span>
|
||||
<div class="cx-step">
|
||||
<button type="button" (click)="bump('r', d, -1)" [disabled]="countFor('r', d) === 0">−</button>
|
||||
@@ -90,6 +295,9 @@
|
||||
/>
|
||||
<button type="button" (click)="bump('r', d, 1)">+</button>
|
||||
</div>
|
||||
<span class="cx-avail" [class.cx-avail--up]="netFor(d) > 0" [class.cx-avail--down]="netFor(d) < 0">
|
||||
<ng-container *ngTemplateOutlet="drawerCell; context: { d: d }"></ng-container>
|
||||
</span>
|
||||
<span class="cx-amt" [class.cx-amt--zero]="countFor('r', d) === 0"
|
||||
>₹{{ subtotal('r', d) | number: '1.2-2' }}</span
|
||||
>
|
||||
@@ -99,7 +307,7 @@
|
||||
<div class="cx-subhead">Coins</div>
|
||||
}
|
||||
@for (d of coins; track d.id) {
|
||||
<div class="cx-row">
|
||||
<div class="cx-row cx-row--stock">
|
||||
<span class="cx-chip cx-chip--coin">{{ d.label }}</span>
|
||||
<div class="cx-step">
|
||||
<button type="button" (click)="bump('r', d, -1)" [disabled]="countFor('r', d) === 0">−</button>
|
||||
@@ -111,6 +319,9 @@
|
||||
/>
|
||||
<button type="button" (click)="bump('r', d, 1)">+</button>
|
||||
</div>
|
||||
<span class="cx-avail" [class.cx-avail--up]="netFor(d) > 0" [class.cx-avail--down]="netFor(d) < 0">
|
||||
<ng-container *ngTemplateOutlet="drawerCell; context: { d: d }"></ng-container>
|
||||
</span>
|
||||
<span class="cx-amt" [class.cx-amt--zero]="countFor('r', d) === 0"
|
||||
>₹{{ subtotal('r', d) | number: '1.2-2' }}</span
|
||||
>
|
||||
@@ -131,7 +342,7 @@
|
||||
<div class="cx-subhead">Bank Notes</div>
|
||||
}
|
||||
@for (d of notes; track d.id) {
|
||||
<div class="cx-row">
|
||||
<div class="cx-row cx-row--stock" [class.cx-row--over]="exceedsAvailable(d)">
|
||||
<span class="cx-chip">{{ d.label }}</span>
|
||||
<div class="cx-step">
|
||||
<button type="button" (click)="bump('g', d, -1)" [disabled]="countFor('g', d) === 0">−</button>
|
||||
@@ -141,8 +352,16 @@
|
||||
[value]="countFor('g', d)"
|
||||
(input)="onChange('g', d, $any($event.target).value)"
|
||||
/>
|
||||
<button type="button" (click)="bump('g', d, 1)">+</button>
|
||||
<button type="button" (click)="bump('g', d, 1)" [disabled]="!canGiveMore(d)">+</button>
|
||||
</div>
|
||||
<span
|
||||
class="cx-avail"
|
||||
[class.cx-avail--up]="netFor(d) > 0"
|
||||
[class.cx-avail--down]="netFor(d) < 0"
|
||||
[class.cx-avail--over]="exceedsAvailable(d)"
|
||||
>
|
||||
<ng-container *ngTemplateOutlet="drawerCell; context: { d: d }"></ng-container>
|
||||
</span>
|
||||
<span class="cx-amt" [class.cx-amt--zero]="countFor('g', d) === 0"
|
||||
>₹{{ subtotal('g', d) | number: '1.2-2' }}</span
|
||||
>
|
||||
@@ -152,7 +371,7 @@
|
||||
<div class="cx-subhead">Coins</div>
|
||||
}
|
||||
@for (d of coins; track d.id) {
|
||||
<div class="cx-row">
|
||||
<div class="cx-row cx-row--stock" [class.cx-row--over]="exceedsAvailable(d)">
|
||||
<span class="cx-chip cx-chip--coin">{{ d.label }}</span>
|
||||
<div class="cx-step">
|
||||
<button type="button" (click)="bump('g', d, -1)" [disabled]="countFor('g', d) === 0">−</button>
|
||||
@@ -162,8 +381,16 @@
|
||||
[value]="countFor('g', d)"
|
||||
(input)="onChange('g', d, $any($event.target).value)"
|
||||
/>
|
||||
<button type="button" (click)="bump('g', d, 1)">+</button>
|
||||
<button type="button" (click)="bump('g', d, 1)" [disabled]="!canGiveMore(d)">+</button>
|
||||
</div>
|
||||
<span
|
||||
class="cx-avail"
|
||||
[class.cx-avail--up]="netFor(d) > 0"
|
||||
[class.cx-avail--down]="netFor(d) < 0"
|
||||
[class.cx-avail--over]="exceedsAvailable(d)"
|
||||
>
|
||||
<ng-container *ngTemplateOutlet="drawerCell; context: { d: d }"></ng-container>
|
||||
</span>
|
||||
<span class="cx-amt" [class.cx-amt--zero]="countFor('g', d) === 0"
|
||||
>₹{{ subtotal('g', d) | number: '1.2-2' }}</span
|
||||
>
|
||||
@@ -173,6 +400,30 @@
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<!-- What this exchange does to the cashier's drawer, denomination by denomination. -->
|
||||
@if (impactRows.length) {
|
||||
<div class="cx-impact">
|
||||
<div class="cx-impact__title"><mat-icon>inventory_2</mat-icon> Drawer after this exchange</div>
|
||||
<div class="cx-impact__chips">
|
||||
@for (r of impactRows; track r.id) {
|
||||
<span
|
||||
class="cx-impact__chip"
|
||||
[class.cx-impact__chip--up]="r.net > 0"
|
||||
[class.cx-impact__chip--down]="r.net < 0"
|
||||
>
|
||||
<b>{{ r.label }}</b>
|
||||
{{ r.before }} → {{ r.after }}
|
||||
<em>({{ r.net > 0 ? '+' : '' }}{{ r.net }})</em>
|
||||
</span>
|
||||
}
|
||||
</div>
|
||||
<div class="cx-impact__note">
|
||||
The branch's total for each denomination moves by the same amount; the vault is not touched (Branch Ops → Branch
|
||||
Cash Position).
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
<div class="cx-summary">
|
||||
<div class="cx-sum">
|
||||
<span>Received</span><strong>₹{{ receivedTotal | number: '1.2-2' }}</strong>
|
||||
@@ -213,9 +464,15 @@
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
@if (needsIdProof && !customerIdProof.trim()) {
|
||||
@if (panMissing) {
|
||||
<div class="cx-warn cx-warn--pan">
|
||||
<mat-icon>badge</mat-icon> Enter customer PAN / Aadhaar to proceed (amount ≥ ₹50,000).
|
||||
<mat-icon>badge</mat-icon> Enter the customer's PAN to proceed (amount above ₹50,000).
|
||||
</div>
|
||||
}
|
||||
@if (!customerIdentified && !loadingCustomer) {
|
||||
<div class="cx-warn cx-warn--pan">
|
||||
<mat-icon>person_search</mat-icon>
|
||||
{{ customerMode === 'existing' ? 'Search and select the customer.' : "Enter the walk-in customer's name." }}
|
||||
</div>
|
||||
}
|
||||
|
||||
|
||||
@@ -73,99 +73,584 @@
|
||||
}
|
||||
}
|
||||
|
||||
/* ── Customer info bar ── */
|
||||
.cx-customer-bar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
padding: 10px 14px;
|
||||
background: #f8fafc;
|
||||
/* ── Customer: existing client or walk-in, plus PAN ── */
|
||||
.cx-cust {
|
||||
background: #fff;
|
||||
border: 1px solid #e2e8f0;
|
||||
border-radius: 10px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
border-radius: 14px;
|
||||
box-shadow: 0 1px 2px rgb(15 23 42 / 4%);
|
||||
overflow: hidden;
|
||||
|
||||
.cx-customer-toggle {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
color: #475569;
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
&__head {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
gap: 12px;
|
||||
padding: 12px 16px;
|
||||
background: linear-gradient(180deg, #f8fafc, #f1f5f9);
|
||||
border-bottom: 1px solid #e2e8f0;
|
||||
}
|
||||
|
||||
mat-icon {
|
||||
font-size: 20px;
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
&__title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
&__title-icon {
|
||||
display: grid;
|
||||
place-items: center;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
border-radius: 10px;
|
||||
background: #e6f4ee;
|
||||
color: #0f4f3c;
|
||||
|
||||
mat-icon {
|
||||
font-size: 20px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
&__title-text {
|
||||
font-size: 14px;
|
||||
font-weight: 700;
|
||||
color: #0f172a;
|
||||
}
|
||||
|
||||
&__title-sub {
|
||||
font-size: 12px;
|
||||
color: #64748b;
|
||||
}
|
||||
|
||||
&__modes {
|
||||
display: inline-flex;
|
||||
padding: 3px;
|
||||
background: #e2e8f0;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
&__mode {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
height: 32px;
|
||||
padding: 0 14px;
|
||||
border: 0;
|
||||
border-radius: 8px;
|
||||
background: transparent;
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
color: #475569;
|
||||
cursor: pointer;
|
||||
transition:
|
||||
background 0.15s ease,
|
||||
color 0.15s ease;
|
||||
|
||||
mat-icon {
|
||||
font-size: 18px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: #0f172a;
|
||||
}
|
||||
|
||||
&--active,
|
||||
&--active:hover {
|
||||
background: #fff;
|
||||
color: #0f4f3c;
|
||||
box-shadow: 0 1px 3px rgb(15 23 42 / 15%);
|
||||
}
|
||||
}
|
||||
|
||||
&__body {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1.7fr) minmax(260px, 1fr);
|
||||
gap: 16px;
|
||||
padding: 16px;
|
||||
}
|
||||
|
||||
&__who {
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
/* Nothing picked yet, or loading */
|
||||
&__empty {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 4px;
|
||||
min-height: 150px;
|
||||
padding: 20px;
|
||||
text-align: center;
|
||||
background: #f8fafc;
|
||||
border: 1.5px dashed #cbd5e1;
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
&__empty-icon {
|
||||
font-size: 36px;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
color: #94a3b8;
|
||||
}
|
||||
|
||||
&--active {
|
||||
color: #1e40af;
|
||||
&__empty-title {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
color: #334155;
|
||||
}
|
||||
|
||||
&__empty-sub {
|
||||
margin-bottom: 8px;
|
||||
font-size: 12px;
|
||||
color: #64748b;
|
||||
}
|
||||
|
||||
/* A picked client */
|
||||
&__card {
|
||||
padding: 14px;
|
||||
background: #fff;
|
||||
border: 1px solid #e2e8f0;
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
&__card-top {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
&__card-id {
|
||||
flex: 1 1 180px;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
&__name {
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
color: #0f172a;
|
||||
overflow-wrap: anywhere;
|
||||
}
|
||||
|
||||
&__badges {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
gap: 6px;
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
&__card-actions {
|
||||
display: flex;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
&__grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
|
||||
gap: 12px 16px;
|
||||
margin-top: 12px;
|
||||
padding-top: 12px;
|
||||
border-top: 1px dashed #e2e8f0;
|
||||
|
||||
span {
|
||||
display: block;
|
||||
margin-bottom: 2px;
|
||||
font-size: 11px;
|
||||
color: #64748b;
|
||||
}
|
||||
|
||||
strong {
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
color: #0f172a;
|
||||
}
|
||||
}
|
||||
|
||||
/* A walk-in, identified at the counter */
|
||||
&__walkin {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 12px;
|
||||
|
||||
.cx-field {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.cx-field input {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
|
||||
.cx-field input:focus {
|
||||
outline: none;
|
||||
border-color: #1f7a4d;
|
||||
box-shadow: 0 0 0 3px rgb(31 122 77 / 15%);
|
||||
}
|
||||
}
|
||||
|
||||
.cx-avatar {
|
||||
display: grid;
|
||||
place-items: center;
|
||||
flex: 0 0 auto;
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
border-radius: 50%;
|
||||
background: linear-gradient(135deg, #1f7a4d, #0f4f3c);
|
||||
font-size: 15px;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.02em;
|
||||
color: #fff;
|
||||
|
||||
&--sm {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
/* The cashier at the counter, or why there is none */
|
||||
.cx-cashier {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
gap: 14px 20px;
|
||||
padding: 12px 16px;
|
||||
background: #fff;
|
||||
border: 1px solid #e2e8f0;
|
||||
border-left: 4px solid #1f7a4d;
|
||||
border-radius: 14px;
|
||||
box-shadow: 0 1px 2px rgb(15 23 42 / 4%);
|
||||
|
||||
&__id {
|
||||
flex: 1 1 220px;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
&__label {
|
||||
font-size: 11px;
|
||||
font-weight: 600;
|
||||
letter-spacing: 0.04em;
|
||||
text-transform: uppercase;
|
||||
color: #64748b;
|
||||
}
|
||||
|
||||
&__name {
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
color: #0f172a;
|
||||
}
|
||||
|
||||
&__flow {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 4px 14px;
|
||||
margin-top: 2px;
|
||||
font-size: 12px;
|
||||
color: #475569;
|
||||
|
||||
span {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 2px;
|
||||
}
|
||||
|
||||
mat-icon {
|
||||
color: #1e40af;
|
||||
font-size: 14px;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
color: #94a3b8;
|
||||
}
|
||||
}
|
||||
|
||||
&__stats {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 10px 28px;
|
||||
|
||||
span {
|
||||
display: block;
|
||||
font-size: 11px;
|
||||
color: #64748b;
|
||||
}
|
||||
|
||||
strong {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
color: #0f172a;
|
||||
}
|
||||
}
|
||||
|
||||
&--none {
|
||||
background: #fffbeb;
|
||||
border-color: #fcd34d;
|
||||
border-left-color: #d97706;
|
||||
|
||||
mat-icon {
|
||||
color: #d97706;
|
||||
}
|
||||
|
||||
.cx-cashier__label {
|
||||
font-weight: 500;
|
||||
letter-spacing: 0;
|
||||
text-transform: none;
|
||||
color: #92400e;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.cx-walk-in {
|
||||
display: flex;
|
||||
.cx-kyc {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
font-size: 12px;
|
||||
color: #64748b;
|
||||
padding: 2px 8px;
|
||||
border-radius: 999px;
|
||||
font-size: 11px;
|
||||
font-weight: 600;
|
||||
|
||||
mat-icon {
|
||||
font-size: 16px;
|
||||
height: 16px;
|
||||
width: 16px;
|
||||
font-size: 14px;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
}
|
||||
|
||||
&--ok {
|
||||
background: #dcfce7;
|
||||
color: #166534;
|
||||
}
|
||||
|
||||
&--warn {
|
||||
background: #fef3c7;
|
||||
color: #92400e;
|
||||
}
|
||||
|
||||
&--sm {
|
||||
margin-left: 6px;
|
||||
padding: 1px 6px;
|
||||
font-size: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.cx-pan-required {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
padding: 4px 10px;
|
||||
background: #fffbeb;
|
||||
border: 1px solid #fcd34d;
|
||||
.cx-chip-tag {
|
||||
padding: 2px 8px;
|
||||
border-radius: 6px;
|
||||
background: #eef2ff;
|
||||
font-size: 11px;
|
||||
font-weight: 600;
|
||||
color: #3730a3;
|
||||
}
|
||||
|
||||
.cx-link-btn {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
height: 30px;
|
||||
padding: 0 10px;
|
||||
border: 0;
|
||||
border-radius: 8px;
|
||||
background: transparent;
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
color: #92400e;
|
||||
color: #1e40af;
|
||||
cursor: pointer;
|
||||
|
||||
mat-icon {
|
||||
font-size: 16px;
|
||||
height: 16px;
|
||||
width: 16px;
|
||||
color: #d97706;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: #eff6ff;
|
||||
}
|
||||
|
||||
&--danger {
|
||||
color: #b91c1c;
|
||||
|
||||
&:hover {
|
||||
background: #fef2f2;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.cx-field--inline {
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
/* PAN: neutral until needed, amber when required and missing, red when malformed, green when valid */
|
||||
.cx-pan {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-self: start;
|
||||
gap: 8px;
|
||||
padding: 14px;
|
||||
background: #f8fafc;
|
||||
border: 1px solid #e2e8f0;
|
||||
border-radius: 12px;
|
||||
|
||||
span {
|
||||
white-space: nowrap;
|
||||
&__head {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
|
||||
mat-icon {
|
||||
font-size: 20px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
color: #475569;
|
||||
}
|
||||
}
|
||||
|
||||
input {
|
||||
width: 180px;
|
||||
&__label {
|
||||
font-size: 13px;
|
||||
font-weight: 700;
|
||||
color: #0f172a;
|
||||
}
|
||||
|
||||
&__tag {
|
||||
margin-left: auto;
|
||||
padding: 2px 8px;
|
||||
border-radius: 999px;
|
||||
background: #e2e8f0;
|
||||
font-size: 11px;
|
||||
font-weight: 600;
|
||||
color: #475569;
|
||||
|
||||
&--on {
|
||||
background: #fef3c7;
|
||||
color: #92400e;
|
||||
}
|
||||
}
|
||||
|
||||
&__input {
|
||||
position: relative;
|
||||
|
||||
input {
|
||||
width: 100%;
|
||||
height: 44px;
|
||||
box-sizing: border-box;
|
||||
padding: 0 40px 0 12px;
|
||||
background: #fff;
|
||||
border: 1.5px solid #cbd5e1;
|
||||
border-radius: 10px;
|
||||
font-family: ui-monospace, sfmono-regular, menlo, consolas, monospace;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
letter-spacing: 0.18em;
|
||||
text-transform: uppercase;
|
||||
color: #0f172a;
|
||||
|
||||
&::placeholder {
|
||||
font-weight: 500;
|
||||
color: #cbd5e1;
|
||||
}
|
||||
|
||||
&:focus {
|
||||
outline: none;
|
||||
border-color: #1f7a4d;
|
||||
box-shadow: 0 0 0 3px rgb(31 122 77 / 15%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__state {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 10px;
|
||||
transform: translateY(-50%);
|
||||
font-size: 22px;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
|
||||
&--ok {
|
||||
color: #16a34a;
|
||||
}
|
||||
|
||||
&--bad {
|
||||
color: #dc2626;
|
||||
}
|
||||
}
|
||||
|
||||
&__hint {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
font-size: 12px;
|
||||
color: #64748b;
|
||||
|
||||
mat-icon {
|
||||
font-size: 14px;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
&--required {
|
||||
background: #fffbeb;
|
||||
border-color: #fcd34d;
|
||||
|
||||
.cx-pan__input input {
|
||||
border-color: #f59e0b;
|
||||
}
|
||||
|
||||
.cx-pan__hint {
|
||||
font-weight: 600;
|
||||
color: #92400e;
|
||||
}
|
||||
}
|
||||
|
||||
&--invalid {
|
||||
background: #fef2f2;
|
||||
border-color: #fecaca;
|
||||
|
||||
.cx-pan__input input {
|
||||
border-color: #ef4444;
|
||||
}
|
||||
|
||||
.cx-pan__hint {
|
||||
font-weight: 600;
|
||||
color: #b91c1c;
|
||||
}
|
||||
}
|
||||
|
||||
&--valid {
|
||||
background: #f0fdf4;
|
||||
border-color: #bbf7d0;
|
||||
|
||||
.cx-pan__input input {
|
||||
border-color: #22c55e;
|
||||
}
|
||||
|
||||
.cx-pan__hint {
|
||||
color: #166534;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.cx-field--pan input {
|
||||
width: 160px;
|
||||
border-color: #fcd34d;
|
||||
.cx-spin {
|
||||
animation: cx-spin 1s linear infinite;
|
||||
}
|
||||
|
||||
&:focus {
|
||||
outline: none;
|
||||
border-color: #d97706;
|
||||
@keyframes cx-spin {
|
||||
to {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
@media (width <= 900px) {
|
||||
.cx-cust__body {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
@media (width <= 600px) {
|
||||
.cx-cust__walkin {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -345,6 +830,129 @@
|
||||
border-bottom: 1px dotted #eef2f7;
|
||||
}
|
||||
|
||||
/* Both sides: the cashier's count of each denomination sits between the counter and the amount. */
|
||||
.cx-row--stock {
|
||||
grid-template-columns: 64px 120px 1fr 96px;
|
||||
}
|
||||
|
||||
.cx-row--over {
|
||||
background: #fef2f2;
|
||||
}
|
||||
|
||||
.cx-avail {
|
||||
padding-left: 6px;
|
||||
font-size: 12px;
|
||||
color: #64748b;
|
||||
|
||||
strong {
|
||||
font-weight: 700;
|
||||
color: #0f172a;
|
||||
}
|
||||
|
||||
/* the count after this exchange: green when it goes up, red when it goes down */
|
||||
.cx-after {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 3px;
|
||||
margin-left: 6px;
|
||||
font-weight: 600;
|
||||
|
||||
mat-icon {
|
||||
font-size: 16px;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
small {
|
||||
font-size: 11px;
|
||||
}
|
||||
}
|
||||
|
||||
&--up .cx-after,
|
||||
&--up .cx-after strong {
|
||||
color: #15803d;
|
||||
}
|
||||
|
||||
&--down .cx-after,
|
||||
&--down .cx-after strong {
|
||||
color: #b45309;
|
||||
}
|
||||
|
||||
&--over,
|
||||
&--over strong,
|
||||
&--over .cx-after,
|
||||
&--over .cx-after strong {
|
||||
color: #b91c1c;
|
||||
}
|
||||
}
|
||||
|
||||
/* The drawer after the whole exchange, one chip per denomination it changes */
|
||||
.cx-impact {
|
||||
padding: 12px 14px;
|
||||
background: #fff;
|
||||
border: 1px solid #e2e8f0;
|
||||
border-radius: 12px;
|
||||
|
||||
&__title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
margin-bottom: 8px;
|
||||
font-size: 13px;
|
||||
font-weight: 700;
|
||||
color: #0f172a;
|
||||
|
||||
mat-icon {
|
||||
font-size: 18px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
color: #475569;
|
||||
}
|
||||
}
|
||||
|
||||
&__chips {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
&__chip {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
padding: 5px 10px;
|
||||
border-radius: 8px;
|
||||
background: #f1f5f9;
|
||||
font-size: 12px;
|
||||
color: #334155;
|
||||
|
||||
b {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
em {
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
&--up {
|
||||
background: #dcfce7;
|
||||
color: #166534;
|
||||
}
|
||||
|
||||
&--down {
|
||||
background: #fef3c7;
|
||||
color: #92400e;
|
||||
}
|
||||
}
|
||||
|
||||
&__note {
|
||||
margin-top: 8px;
|
||||
font-size: 11px;
|
||||
color: #64748b;
|
||||
}
|
||||
}
|
||||
|
||||
.cx-chip {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
|
||||
@@ -11,7 +11,16 @@ import { CommonModule } from '@angular/common';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
import { MatIconModule } from '@angular/material/icon';
|
||||
import { MatSnackBar, MatSnackBarModule } from '@angular/material/snack-bar';
|
||||
import { MatDialog, MatDialogModule } from '@angular/material/dialog';
|
||||
import { forkJoin, of } from 'rxjs';
|
||||
import { catchError } from 'rxjs/operators';
|
||||
import { CashierService } from '../cashier.service';
|
||||
import { ClientsService } from 'app/clients/clients.service';
|
||||
import {
|
||||
CustomerSearchDialogComponent,
|
||||
CustomerSearchResult
|
||||
} from 'app/shared/customer-search-dialog/customer-search-dialog.component';
|
||||
import { businessToday } from 'app/core/utils/business-today';
|
||||
|
||||
interface Denom {
|
||||
id: number;
|
||||
@@ -20,6 +29,47 @@ interface Denom {
|
||||
label: string;
|
||||
}
|
||||
|
||||
/** An existing client picked through Customer Search, with what the counter needs to identify them. */
|
||||
interface SelectedCustomer {
|
||||
clientId: number;
|
||||
displayName: string;
|
||||
cifNumber: string | null;
|
||||
mobileNo: string | null;
|
||||
officeName: string | null;
|
||||
accountNo: string | null;
|
||||
accountType: string | null;
|
||||
/** PAN on the client's KYC record, if any. */
|
||||
kycPan: string | null;
|
||||
panVerified: boolean;
|
||||
kycStatus: string;
|
||||
}
|
||||
|
||||
/** The cashier at the counter: the one who takes the customer's notes and hands over the change. */
|
||||
interface CashierInfo {
|
||||
cashierId: number;
|
||||
name: string;
|
||||
tellerName: string | null;
|
||||
officeName: string | null;
|
||||
/** Cash the vault allocated to them for the day, once known. */
|
||||
allocatedAmount: number | null;
|
||||
/** Cash they hold now. */
|
||||
totalAmount: number;
|
||||
}
|
||||
|
||||
/** Same rule as ClientKycApiConstants.PAN_REGEX on the server: 5 letters, 4 digits, 1 letter. */
|
||||
const PAN_PATTERN = /^[A-Z]{5}[0-9]{4}[A-Z]$/;
|
||||
|
||||
/** Income Tax Rule 114B / RBI: a cash exchange above this needs the customer's PAN. */
|
||||
const PAN_MANDATORY_ABOVE = 50000;
|
||||
|
||||
const KYC_STATUS: Record<number, string> = {
|
||||
100: 'Pending',
|
||||
200: 'In Progress',
|
||||
300: 'Verified',
|
||||
400: 'Rejected',
|
||||
500: 'Expired'
|
||||
};
|
||||
|
||||
/** Cashier cash-exchange entry: customer gives some denominations and takes equal-value change (net 0). */
|
||||
@Component({
|
||||
selector: 'mifosx-cash-exchange-entry',
|
||||
@@ -30,11 +80,14 @@ interface Denom {
|
||||
CommonModule,
|
||||
FormsModule,
|
||||
MatIconModule,
|
||||
MatSnackBarModule
|
||||
MatSnackBarModule,
|
||||
MatDialogModule
|
||||
]
|
||||
})
|
||||
export class CashExchangeEntryComponent implements OnInit {
|
||||
private service = inject(CashierService);
|
||||
private clientsService = inject(ClientsService);
|
||||
private dialog = inject(MatDialog);
|
||||
private snackBar = inject(MatSnackBar);
|
||||
|
||||
notes: Denom[] = [];
|
||||
@@ -46,11 +99,17 @@ export class CashExchangeEntryComponent implements OnInit {
|
||||
saving = false;
|
||||
|
||||
// ── Customer info ──
|
||||
isAccountHolder = false;
|
||||
accountNo = '';
|
||||
customerIdProof = '';
|
||||
/** An existing client found through Customer Search, or a walk-in identified at the counter. */
|
||||
customerMode: 'existing' | 'walkin' = 'walkin';
|
||||
selectedCustomer: SelectedCustomer | null = null;
|
||||
loadingCustomer = false;
|
||||
walkInName = '';
|
||||
walkInMobile = '';
|
||||
panNumber = '';
|
||||
|
||||
// ── Cashier position (for denomination overdraft check) ──
|
||||
// ── Cashier at the counter, and their position (for the denomination overdraft check) ──
|
||||
/** The cashier linked to the logged-in user; null when the login is not a cashier's. */
|
||||
cashier: CashierInfo | null = null;
|
||||
private availableMap = new Map<number, number>();
|
||||
positionLoaded = false;
|
||||
|
||||
@@ -63,7 +122,7 @@ export class CashExchangeEntryComponent implements OnInit {
|
||||
}
|
||||
|
||||
ngOnInit(): void {
|
||||
const d = new Date();
|
||||
const d = businessToday();
|
||||
this.exchangeDate = `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`;
|
||||
this.service.getActiveDenominations().subscribe({
|
||||
next: (list) => {
|
||||
@@ -87,7 +146,19 @@ export class CashExchangeEntryComponent implements OnInit {
|
||||
((res?.denominations || []) as any[]).forEach((d: any) => {
|
||||
if (d.denominationId) this.availableMap.set(Number(d.denominationId), Number(d.count ?? 0));
|
||||
});
|
||||
const cashierId = res?.cashierId ? Number(res.cashierId) : null;
|
||||
this.cashier = cashierId
|
||||
? {
|
||||
cashierId,
|
||||
name: res.cashierName || '',
|
||||
tellerName: null,
|
||||
officeName: null,
|
||||
allocatedAmount: null,
|
||||
totalAmount: Number(res.totalAmount ?? 0)
|
||||
}
|
||||
: null;
|
||||
this.positionLoaded = true;
|
||||
if (cashierId) this.loadCashierDetails(cashierId);
|
||||
},
|
||||
error: () => {
|
||||
this.positionLoaded = true;
|
||||
@@ -95,6 +166,31 @@ export class CashExchangeEntryComponent implements OnInit {
|
||||
});
|
||||
}
|
||||
|
||||
/** The counter, branch and today's allocation; the card still shows name and cash in hand without them. */
|
||||
private loadCashierDetails(cashierId: number): void {
|
||||
this.service
|
||||
.getInterCashierCashierSummary(cashierId, this.exchangeDate)
|
||||
.pipe(catchError(() => of(null)))
|
||||
.subscribe((r: any) => {
|
||||
if (!r || this.cashier?.cashierId !== cashierId) return;
|
||||
this.cashier = {
|
||||
...this.cashier,
|
||||
tellerName: r.tellerName || null,
|
||||
officeName: r.officeName || null,
|
||||
allocatedAmount: Number(r.allocatedAmount ?? 0)
|
||||
};
|
||||
});
|
||||
}
|
||||
|
||||
/** Up to two letters for the cashier's avatar. */
|
||||
get cashierInitials(): string {
|
||||
const words = (this.cashier?.name || '').trim().split(/\s+/).filter(Boolean);
|
||||
if (words.length === 0) return '?';
|
||||
const first = words[0].charAt(0);
|
||||
const last = words.length > 1 ? words[words.length - 1].charAt(0) : '';
|
||||
return (first + last).toUpperCase();
|
||||
}
|
||||
|
||||
countFor(side: 'r' | 'g', d: Denom): number {
|
||||
return (side === 'r' ? this.receivedCounts : this.givenCounts)[d.id] || 0;
|
||||
}
|
||||
@@ -128,14 +224,102 @@ export class CashExchangeEntryComponent implements OnInit {
|
||||
return this.receivedTotal > 0 && this.receivedTotal === this.givenTotal;
|
||||
}
|
||||
|
||||
/** Above ₹50,000 PAN/ID is mandatory per RBI guideline */
|
||||
get needsIdProof(): boolean {
|
||||
return this.receivedTotal >= 50000;
|
||||
/** Above ₹50,000 the customer's PAN is mandatory (Income Tax Rule 114B, followed under RBI guidelines). */
|
||||
get needsPan(): boolean {
|
||||
return this.receivedTotal > PAN_MANDATORY_ABOVE;
|
||||
}
|
||||
|
||||
/** Up to two letters for the avatar: first and last word of the customer's name. */
|
||||
get customerInitials(): string {
|
||||
const words = (this.selectedCustomer?.displayName || '').trim().split(/\s+/).filter(Boolean);
|
||||
if (words.length === 0) return '?';
|
||||
const first = words[0].charAt(0);
|
||||
const last = words.length > 1 ? words[words.length - 1].charAt(0) : '';
|
||||
return (first + last).toUpperCase();
|
||||
}
|
||||
|
||||
get panValue(): string {
|
||||
return this.panNumber.trim().toUpperCase();
|
||||
}
|
||||
|
||||
/** A PAN that is entered must be well-formed, required or not. */
|
||||
get panFormatInvalid(): boolean {
|
||||
return !!this.panValue && !PAN_PATTERN.test(this.panValue);
|
||||
}
|
||||
|
||||
get panMissing(): boolean {
|
||||
return this.needsPan && !this.panValue;
|
||||
}
|
||||
|
||||
/** The PAN comes from the client's KYC record, so the cashier confirms it rather than types it. */
|
||||
get panFromKyc(): boolean {
|
||||
return !!this.selectedCustomer?.kycPan && this.panValue === this.selectedCustomer.kycPan.toUpperCase();
|
||||
}
|
||||
|
||||
/** Who the customer is has to be known: a picked client, or a walk-in's name once PAN is required. */
|
||||
get customerIdentified(): boolean {
|
||||
if (this.customerMode === 'existing') return !!this.selectedCustomer;
|
||||
return !this.needsPan || this.walkInName.trim().length > 0;
|
||||
}
|
||||
|
||||
/** A login with no cashier behind it has no drawer to take notes into or give change from. */
|
||||
get noCashier(): boolean {
|
||||
return this.positionLoaded && !this.cashier;
|
||||
}
|
||||
|
||||
/** How many of the denomination the cashier holds, or null while that is not known (loading, or no cashier). */
|
||||
availableFor(d: Denom): number | null {
|
||||
if (!this.positionLoaded || !this.cashier) return null;
|
||||
return this.availableMap.get(d.id) ?? 0;
|
||||
}
|
||||
|
||||
/** The cashier is giving more of this denomination than they hold. */
|
||||
exceedsAvailable(d: Denom): boolean {
|
||||
const available = this.availableFor(d);
|
||||
return available !== null && this.countFor('g', d) > available;
|
||||
}
|
||||
|
||||
/** The + on the given side stops at what the cashier holds; a larger typed number is still caught and shown. */
|
||||
canGiveMore(d: Denom): boolean {
|
||||
const available = this.availableFor(d);
|
||||
return available === null || this.countFor('g', d) < available;
|
||||
}
|
||||
|
||||
/** What this exchange does to the cashier's count of the denomination: notes taken in less notes given out. */
|
||||
netFor(d: Denom): number {
|
||||
return this.countFor('r', d) - this.countFor('g', d);
|
||||
}
|
||||
|
||||
/** The cashier's count of the denomination once this exchange is recorded, or null while it is not known. */
|
||||
drawerAfter(d: Denom): number | null {
|
||||
const available = this.availableFor(d);
|
||||
return available === null ? null : available + this.netFor(d);
|
||||
}
|
||||
|
||||
/**
|
||||
* The denominations this exchange changes, with the drawer's count before and after, so the effect shows
|
||||
* while the counts are being typed. The branch's total for each denomination moves by the same amount, as
|
||||
* the customer's notes go into the drawer and the change comes out of it; the vault is not involved.
|
||||
*/
|
||||
get impactRows(): Array<{ id: number; label: string; kind: string; net: number; before: number; after: number }> {
|
||||
if (!this.positionLoaded || !this.cashier) return [];
|
||||
return this.denoms
|
||||
.filter((d) => this.netFor(d) !== 0)
|
||||
.map((d) => ({
|
||||
id: d.id,
|
||||
label: d.label,
|
||||
kind: d.kind,
|
||||
net: this.netFor(d),
|
||||
before: this.availableFor(d) ?? 0,
|
||||
after: this.drawerAfter(d) ?? 0
|
||||
}));
|
||||
}
|
||||
|
||||
/** Denominations where cashier is giving more than currently available. */
|
||||
get givenOverdraftItems(): Array<{ label: string; available: number; requested: number }> {
|
||||
if (!this.positionLoaded) return [];
|
||||
// Without a cashier every denomination would read as "0 available"; the missing cashier is the
|
||||
// thing to tell the user, not a stock shortage.
|
||||
if (!this.positionLoaded || !this.cashier) return [];
|
||||
return this.denoms
|
||||
.map((d) => ({ label: d.label, available: this.availableMap.get(d.id) ?? 0, requested: this.countFor('g', d) }))
|
||||
.filter((item) => item.requested > 0 && item.requested > item.available);
|
||||
@@ -146,21 +330,77 @@ export class CashExchangeEntryComponent implements OnInit {
|
||||
}
|
||||
|
||||
get valid(): boolean {
|
||||
return this.matches && (!this.needsIdProof || this.customerIdProof.trim().length > 0) && !this.hasGivenOverdraft;
|
||||
return (
|
||||
this.matches &&
|
||||
!!this.cashier &&
|
||||
!this.hasGivenOverdraft &&
|
||||
!this.panFormatInvalid &&
|
||||
!this.panMissing &&
|
||||
this.customerIdentified &&
|
||||
!this.loadingCustomer
|
||||
);
|
||||
}
|
||||
|
||||
toggleAccountHolder(): void {
|
||||
this.isAccountHolder = !this.isAccountHolder;
|
||||
if (!this.isAccountHolder) this.accountNo = '';
|
||||
setCustomerMode(mode: 'existing' | 'walkin'): void {
|
||||
if (this.customerMode === mode) return;
|
||||
this.customerMode = mode;
|
||||
this.selectedCustomer = null;
|
||||
this.walkInName = '';
|
||||
this.walkInMobile = '';
|
||||
this.panNumber = '';
|
||||
}
|
||||
|
||||
/** Pick an existing client through Customer Search, then load their details and KYC (PAN). */
|
||||
openCustomerSearch(): void {
|
||||
this.dialog
|
||||
// An existing customer without an account is still a known customer, so the account is not required.
|
||||
.open(CustomerSearchDialogComponent, { width: '960px', maxWidth: '95vw', data: { requireAccount: false } })
|
||||
.afterClosed()
|
||||
.subscribe((result: CustomerSearchResult | undefined) => {
|
||||
if (!result?.clientId) return;
|
||||
this.loadCustomer(result);
|
||||
});
|
||||
}
|
||||
|
||||
private loadCustomer(result: CustomerSearchResult): void {
|
||||
this.loadingCustomer = true;
|
||||
const id = String(result.clientId);
|
||||
forkJoin({
|
||||
client: this.clientsService.getClientData(id, true).pipe(catchError(() => of(null))),
|
||||
kyc: this.clientsService.getClientKyc(id, true).pipe(catchError(() => of(null)))
|
||||
}).subscribe(({ client, kyc }: { client: any; kyc: any }) => {
|
||||
const kycPan: string | null = kyc?.panNumber || result.panNumber || null;
|
||||
this.selectedCustomer = {
|
||||
clientId: result.clientId,
|
||||
displayName: client?.displayName || result.displayName,
|
||||
cifNumber: client?.cifNumber || null,
|
||||
mobileNo: client?.mobileNo || result.mobileNo || null,
|
||||
officeName: client?.officeName || result.officeName || null,
|
||||
accountNo: result.accountNo || null,
|
||||
accountType: result.accountType || null,
|
||||
kycPan,
|
||||
panVerified: !!kyc?.panVerified,
|
||||
kycStatus: KYC_STATUS[Number(kyc?.kycStatus?.id ?? kyc?.kycStatus)] || 'Not on record'
|
||||
};
|
||||
this.panNumber = kycPan ? kycPan.toUpperCase() : '';
|
||||
this.loadingCustomer = false;
|
||||
});
|
||||
}
|
||||
|
||||
clearCustomer(): void {
|
||||
this.selectedCustomer = null;
|
||||
this.panNumber = '';
|
||||
}
|
||||
|
||||
clear(): void {
|
||||
this.receivedCounts = {};
|
||||
this.givenCounts = {};
|
||||
this.note = '';
|
||||
this.accountNo = '';
|
||||
this.customerIdProof = '';
|
||||
this.isAccountHolder = false;
|
||||
this.customerMode = 'walkin';
|
||||
this.selectedCustomer = null;
|
||||
this.walkInName = '';
|
||||
this.walkInMobile = '';
|
||||
this.panNumber = '';
|
||||
}
|
||||
|
||||
submit(): void {
|
||||
@@ -170,11 +410,17 @@ export class CashExchangeEntryComponent implements OnInit {
|
||||
this.denoms
|
||||
.filter((d) => this.countFor(side, d) > 0)
|
||||
.map((d) => ({ denominationId: d.id, denominationValue: d.value, count: this.countFor(side, d) }));
|
||||
const customer = this.customerMode === 'existing' ? this.selectedCustomer : null;
|
||||
const pan = this.panValue || null;
|
||||
const payload: any = {
|
||||
exchangeDate: this.exchangeDate,
|
||||
note: this.note || null,
|
||||
customerIdProof: this.customerIdProof.trim() || null,
|
||||
accountNo: this.isAccountHolder && this.accountNo.trim() ? this.accountNo.trim() : null,
|
||||
clientId: customer?.clientId ?? null,
|
||||
accountNo: customer?.accountNo ?? null,
|
||||
customerName: customer ? customer.displayName : this.walkInName.trim() || null,
|
||||
customerMobile: customer ? customer.mobileNo : this.walkInMobile.trim() || null,
|
||||
panNumber: pan,
|
||||
customerIdProof: pan,
|
||||
received: build('r'),
|
||||
given: build('g')
|
||||
};
|
||||
|
||||
@@ -11,25 +11,11 @@
|
||||
<div>
|
||||
<div class="pg-eyebrow">CASHIER · HISTORY</div>
|
||||
<h1 class="pg-title">Cash Movement History</h1>
|
||||
<p class="pg-sub">All transfers, settlements, and inter-cashier movements. Reverse any active transaction.</p>
|
||||
<p class="pg-sub">All transfers, settlements, inter-cashier movements and cash exchanges.</p>
|
||||
</div>
|
||||
<button type="button" class="pg-btn pg-btn--ghost" (click)="load()"><mat-icon>refresh</mat-icon> Refresh</button>
|
||||
</header>
|
||||
|
||||
<!-- Reversal confirm panel -->
|
||||
@if (reversingId !== null) {
|
||||
<div class="reverse-panel">
|
||||
<mat-icon class="reverse-icon">warning</mat-icon>
|
||||
<span
|
||||
>Reverse <strong>#{{ reversingId }}</strong
|
||||
>? This cannot be undone.</span
|
||||
>
|
||||
<input class="reverse-reason" type="text" [(ngModel)]="reverseReason" placeholder="Reason (optional)" />
|
||||
<button type="button" class="pg-btn pg-btn--danger" (click)="confirmReverse()">Confirm Reversal</button>
|
||||
<button type="button" class="pg-btn pg-btn--ghost" (click)="cancelReverse()">Cancel</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
@if (loading) {
|
||||
<div class="pg-empty">Loading…</div>
|
||||
}
|
||||
@@ -134,11 +120,6 @@
|
||||
>
|
||||
<mat-icon>visibility</mat-icon>
|
||||
</button>
|
||||
@if (!r.isReversed) {
|
||||
<button type="button" class="pg-btn pg-btn--ghost btn-sm" title="Reverse" (click)="startReverse(r)">
|
||||
<mat-icon>undo</mat-icon>
|
||||
</button>
|
||||
}
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
@@ -187,6 +168,12 @@
|
||||
<span class="detail-meta__label">Date</span>
|
||||
<span class="detail-meta__val">{{ detail.row.date }}</span>
|
||||
</div>
|
||||
@if (detail.row.type === 'exchange') {
|
||||
<div class="detail-meta__item">
|
||||
<span class="detail-meta__label">Customer PAN</span>
|
||||
<span class="detail-meta__val">{{ detail.row.panNumber || '—' }}</span>
|
||||
</div>
|
||||
}
|
||||
<div class="detail-meta__item">
|
||||
<span class="detail-meta__label">Total Amount</span>
|
||||
<span class="detail-meta__val detail-meta__val--amount">₹{{ detail.row.amount | number: '1.2-2' }}</span>
|
||||
|
||||
@@ -47,38 +47,6 @@
|
||||
}
|
||||
}
|
||||
|
||||
.reverse-panel {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
padding: 12px 16px;
|
||||
background: #fffbeb;
|
||||
border: 1px solid #fcd34d;
|
||||
border-radius: 10px;
|
||||
flex-wrap: wrap;
|
||||
font-size: 13px;
|
||||
color: #92400e;
|
||||
|
||||
.reverse-icon {
|
||||
color: #f59e0b;
|
||||
font-size: 20px;
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
}
|
||||
|
||||
.reverse-reason {
|
||||
flex: 1 1 200px;
|
||||
height: 34px;
|
||||
padding: 0 10px;
|
||||
border: 1px solid #fcd34d;
|
||||
border-radius: 7px;
|
||||
font-size: 13px;
|
||||
font-family: inherit;
|
||||
background: #fff;
|
||||
color: #1a1a1a;
|
||||
}
|
||||
}
|
||||
|
||||
/* ── Action buttons cell ── */
|
||||
.action-btns {
|
||||
display: flex;
|
||||
|
||||
@@ -8,9 +8,7 @@
|
||||
|
||||
import { Component, OnInit, inject } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
import { MatIconModule } from '@angular/material/icon';
|
||||
import { MatSnackBar, MatSnackBarModule } from '@angular/material/snack-bar';
|
||||
import { MatTabsModule } from '@angular/material/tabs';
|
||||
import { MatPaginatorModule, PageEvent } from '@angular/material/paginator';
|
||||
import { forkJoin, of } from 'rxjs';
|
||||
@@ -31,6 +29,8 @@ interface TxnRow {
|
||||
reversedBy: number | null;
|
||||
reversedAt: string | null;
|
||||
reverseReason: string | null;
|
||||
/** Customer PAN recorded on a cash exchange. */
|
||||
panNumber?: string | null;
|
||||
type: 'transfer' | 'settlement' | 'inter' | 'exchange';
|
||||
}
|
||||
|
||||
@@ -52,7 +52,10 @@ interface DetailView {
|
||||
loading: boolean;
|
||||
}
|
||||
|
||||
/** Unified history of all cash movements with reversal and detail view support. */
|
||||
/**
|
||||
* Unified history of all cash movements with a detail view. Read-only: cash movements cannot be reversed
|
||||
* from here (an earlier reversal still shows as Reversed, with who, when and why).
|
||||
*/
|
||||
@Component({
|
||||
selector: 'mifosx-cash-history',
|
||||
templateUrl: './cash-history.component.html',
|
||||
@@ -63,16 +66,13 @@ interface DetailView {
|
||||
standalone: true,
|
||||
imports: [
|
||||
CommonModule,
|
||||
FormsModule,
|
||||
MatIconModule,
|
||||
MatSnackBarModule,
|
||||
MatTabsModule,
|
||||
MatPaginatorModule
|
||||
]
|
||||
})
|
||||
export class CashHistoryComponent implements OnInit {
|
||||
private service = inject(CashierService);
|
||||
private snackBar = inject(MatSnackBar);
|
||||
|
||||
transfers: TxnRow[] = [];
|
||||
settlements: TxnRow[] = [];
|
||||
@@ -99,10 +99,6 @@ export class CashHistoryComponent implements OnInit {
|
||||
|
||||
private denomKindMap = new Map<number, 'note' | 'coin'>();
|
||||
|
||||
reversingId: number | null = null;
|
||||
reversingType: string | null = null;
|
||||
reverseReason = '';
|
||||
|
||||
detail: DetailView | null = null;
|
||||
|
||||
ngOnInit(): void {
|
||||
@@ -212,7 +208,8 @@ export class CashHistoryComponent implements OnInit {
|
||||
this.exchanges = (exchangeItems as any[]).map((e) => ({
|
||||
id: e.id,
|
||||
date: e.exchangeDate,
|
||||
fromParty: e.accountNo ? `Account ${e.accountNo}` : 'Walk-in Customer',
|
||||
fromParty: this.exchangeParty(e),
|
||||
panNumber: e.panNumber ?? null,
|
||||
toParty: e.performedByUsername || '—',
|
||||
amount: e.exchangeAmount,
|
||||
note: e.note,
|
||||
@@ -310,7 +307,8 @@ export class CashHistoryComponent implements OnInit {
|
||||
this.exchanges = (res.pageItems ?? []).map((e: any) => ({
|
||||
id: e.id,
|
||||
date: e.exchangeDate,
|
||||
fromParty: e.accountNo ? `Account ${e.accountNo}` : 'Walk-in Customer',
|
||||
fromParty: this.exchangeParty(e),
|
||||
panNumber: e.panNumber ?? null,
|
||||
toParty: e.performedByUsername || '—',
|
||||
amount: e.exchangeAmount,
|
||||
note: e.note,
|
||||
@@ -392,39 +390,12 @@ export class CashHistoryComponent implements OnInit {
|
||||
this.detail = null;
|
||||
}
|
||||
|
||||
startReverse(row: TxnRow): void {
|
||||
this.reversingId = row.id;
|
||||
this.reversingType = row.type;
|
||||
this.reverseReason = '';
|
||||
}
|
||||
|
||||
cancelReverse(): void {
|
||||
this.reversingId = null;
|
||||
this.reversingType = null;
|
||||
this.reverseReason = '';
|
||||
}
|
||||
|
||||
confirmReverse(): void {
|
||||
if (!this.reversingId || !this.reversingType) return;
|
||||
const id = this.reversingId;
|
||||
const type = this.reversingType;
|
||||
const reason = this.reverseReason;
|
||||
this.cancelReverse();
|
||||
|
||||
let obs$;
|
||||
if (type === 'transfer') obs$ = this.service.reverseCashTransfer(id, reason);
|
||||
else if (type === 'settlement') obs$ = this.service.reverseCashSettlement(id, reason);
|
||||
else if (type === 'exchange') obs$ = this.service.reverseCashExchange(id, reason);
|
||||
else obs$ = this.service.reverseInterCashierTransfer(id, reason);
|
||||
|
||||
obs$.pipe(catchError(() => of(null))).subscribe((res: any) => {
|
||||
if (res?.reversed) {
|
||||
this.snackBar.open('Transaction reversed successfully', 'Close', { duration: 3000 });
|
||||
this.load();
|
||||
} else {
|
||||
this.snackBar.open('Reversal failed', 'Close', { duration: 3000 });
|
||||
}
|
||||
});
|
||||
/** Who the exchange was with: the customer's name (and account, if one), else the account, else a walk-in. */
|
||||
private exchangeParty(e: any): string {
|
||||
if (e.customerName) {
|
||||
return e.accountNo ? `${e.customerName} (A/C ${e.accountNo})` : e.customerName;
|
||||
}
|
||||
return e.accountNo ? `Account ${e.accountNo}` : 'Walk-in Customer';
|
||||
}
|
||||
|
||||
typeLabel(type: string): string {
|
||||
|
||||
@@ -18,6 +18,7 @@ import { MatInputModule } from '@angular/material/input';
|
||||
import { forkJoin, of } from 'rxjs';
|
||||
import { catchError } from 'rxjs/operators';
|
||||
import { CashierService } from '../cashier.service';
|
||||
import { businessToday } from 'app/core/utils/business-today';
|
||||
|
||||
type PageState = 'loading' | 'no-cashier' | 'needs-reconciliation' | 'already-settled' | 'form';
|
||||
|
||||
@@ -90,7 +91,7 @@ export class CashSettlementComponent implements OnInit {
|
||||
saving = false;
|
||||
|
||||
ngOnInit(): void {
|
||||
const d = new Date();
|
||||
const d = businessToday();
|
||||
this.settlementDate = `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`;
|
||||
this.service
|
||||
.getTellers()
|
||||
|
||||
@@ -17,6 +17,7 @@ import { MatInputModule } from '@angular/material/input';
|
||||
import { of } from 'rxjs';
|
||||
import { catchError } from 'rxjs/operators';
|
||||
import { CashierService } from '../cashier.service';
|
||||
import { businessToday } from 'app/core/utils/business-today';
|
||||
|
||||
interface Denom {
|
||||
id: number;
|
||||
@@ -82,7 +83,7 @@ export class CashTransferComponent implements OnInit {
|
||||
loadingVault = false;
|
||||
|
||||
ngOnInit(): void {
|
||||
const d = new Date();
|
||||
const d = businessToday();
|
||||
this.transferDate = `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`;
|
||||
this.service.getActiveDenominations().subscribe({
|
||||
next: (list) => {
|
||||
|
||||
@@ -17,6 +17,7 @@ import { forkJoin, of } from 'rxjs';
|
||||
import { catchError } from 'rxjs/operators';
|
||||
import { CashierService } from '../cashier.service';
|
||||
import { AuthenticationService } from '../../core/authentication/authentication.service';
|
||||
import { businessToday } from 'app/core/utils/business-today';
|
||||
|
||||
interface DenomRow {
|
||||
denominationId: number;
|
||||
@@ -71,7 +72,7 @@ export class CashierPositionComponent implements OnInit {
|
||||
isCashierMode = false;
|
||||
|
||||
ngOnInit(): void {
|
||||
const d = new Date();
|
||||
const d = businessToday();
|
||||
this.asOfDate = `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`;
|
||||
|
||||
this.isCashierMode = this.authService.isCashierUser();
|
||||
|
||||
@@ -23,10 +23,10 @@ import { DayBookComponent } from './day-book/day-book.component';
|
||||
import { VoucherReportComponent } from './voucher-report/voucher-report.component';
|
||||
import { BranchDayComponent } from './branch-day/branch-day.component';
|
||||
import { VaultPositionComponent } from './vault-position/vault-position.component';
|
||||
import { BranchCashPositionComponent } from './branch-cash-position/branch-cash-position.component';
|
||||
import { AccountRegisterComponent } from './account-register/account-register.component';
|
||||
import { ClosingCashReportComponent } from './closing-cash-report/closing-cash-report.component';
|
||||
import { ExcessTransactionReportComponent } from './excess-transaction-report/excess-transaction-report.component';
|
||||
import { ShareCollectionComponent } from './share-collection/share-collection.component';
|
||||
|
||||
const routes: Routes = [
|
||||
Route.withShell([
|
||||
@@ -226,6 +226,13 @@ const routes: Routes = [
|
||||
component: VaultPositionComponent,
|
||||
data: { title: 'Vault Position', breadcrumb: 'Vault Position' }
|
||||
},
|
||||
{
|
||||
// What the whole branch holds per denomination: the vault plus every cashier's drawer, so an
|
||||
// exchange (which leaves the vault alone) is visible in the bank's total.
|
||||
path: 'branch-position',
|
||||
component: BranchCashPositionComponent,
|
||||
data: { title: 'Branch Cash Position', breadcrumb: 'Branch Cash Position' }
|
||||
},
|
||||
{
|
||||
// The same day book the clerk and cashier read, reached from where a principal officer
|
||||
// signing the day off actually looks. It carries the Officer Verification Sheet — each
|
||||
@@ -345,11 +352,6 @@ const routes: Routes = [
|
||||
component: ExcessTransactionReportComponent,
|
||||
data: { title: 'Excess Transaction Report', breadcrumb: 'Excess Transaction Report' }
|
||||
},
|
||||
{
|
||||
path: 'share-collection',
|
||||
component: ShareCollectionComponent,
|
||||
data: { title: 'Share Collection', breadcrumb: 'Share Collection' }
|
||||
},
|
||||
{
|
||||
path: 'transaction-entry',
|
||||
canActivate: [CashierOnlyGuard],
|
||||
|
||||
@@ -20,7 +20,6 @@ import { ReconciliationComponent } from './reconciliation/reconciliation.compone
|
||||
import { CashHistoryComponent } from './cash-history/cash-history.component';
|
||||
import { ClosingCashReportComponent } from './closing-cash-report/closing-cash-report.component';
|
||||
import { ExcessTransactionReportComponent } from './excess-transaction-report/excess-transaction-report.component';
|
||||
import { ShareCollectionComponent } from './share-collection/share-collection.component';
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
@@ -35,8 +34,7 @@ import { ShareCollectionComponent } from './share-collection/share-collection.co
|
||||
ReconciliationComponent,
|
||||
CashHistoryComponent,
|
||||
ClosingCashReportComponent,
|
||||
ExcessTransactionReportComponent,
|
||||
ShareCollectionComponent
|
||||
ExcessTransactionReportComponent
|
||||
]
|
||||
})
|
||||
export class CashierModule {}
|
||||
|
||||
@@ -32,9 +32,6 @@ export class CashierService {
|
||||
getCashExchange(id: number): Observable<any> {
|
||||
return this.http.get(`/cashexchange/${id}`);
|
||||
}
|
||||
reverseCashExchange(id: number, reason: string): Observable<any> {
|
||||
return this.http.post(`/cashexchange/${id}/reverse`, { reason });
|
||||
}
|
||||
|
||||
// ── Tellers / Cashiers ──
|
||||
getTellers(officeId?: number): Observable<any[]> {
|
||||
@@ -60,9 +57,6 @@ export class CashierService {
|
||||
getCashTransferById(id: number): Observable<any> {
|
||||
return this.http.get(`/cashtransfer/${id}`);
|
||||
}
|
||||
reverseCashTransfer(id: number, reason: string): Observable<any> {
|
||||
return this.http.post(`/cashtransfer/${id}/reverse`, { reason });
|
||||
}
|
||||
|
||||
// ── Cash Settlement ──
|
||||
createCashSettlement(data: any): Observable<any> {
|
||||
@@ -75,9 +69,6 @@ export class CashierService {
|
||||
getCashSettlementById(id: number): Observable<any> {
|
||||
return this.http.get(`/cashsettlement/${id}`);
|
||||
}
|
||||
reverseCashSettlement(id: number, reason: string): Observable<any> {
|
||||
return this.http.post(`/cashsettlement/${id}/reverse`, { reason });
|
||||
}
|
||||
|
||||
// ── Inter-cashier Transfer ──
|
||||
createInterCashierTransfer(data: any): Observable<any> {
|
||||
@@ -90,8 +81,10 @@ export class CashierService {
|
||||
getInterCashierById(id: number): Observable<any> {
|
||||
return this.http.get(`/cashintercashier/${id}`);
|
||||
}
|
||||
reverseInterCashierTransfer(id: number, reason: string): Observable<any> {
|
||||
return this.http.post(`/cashintercashier/${id}/reverse`, { reason });
|
||||
/** One cashier's details, today's vault allocation and denomination-wise cash, for either side of a transfer. */
|
||||
getInterCashierCashierSummary(cashierId: number, date: string): Observable<any> {
|
||||
const params = new HttpParams().set('cashierId', cashierId).set('date', date);
|
||||
return this.http.get<any>('/cashintercashier/cashier-summary', { params });
|
||||
}
|
||||
|
||||
// ── Reconciliation ──
|
||||
@@ -178,6 +171,13 @@ export class CashierService {
|
||||
return this.http.get('/vouchers/my-work', { params });
|
||||
}
|
||||
|
||||
/** One voucher and every debit/credit line it is made of — the full slip behind a summarised
|
||||
* row (a "+2 more" badge in a register only ever shows the first side of each). */
|
||||
voucherDetail(voucherNo: string): Observable<any> {
|
||||
const params = new HttpParams().set('voucherNo', voucherNo);
|
||||
return this.http.get('/vouchers/detail', { params });
|
||||
}
|
||||
|
||||
/**
|
||||
* Account register for one date: what opened and closed that day, each account's balance as it
|
||||
* stood then, and what it holds now.
|
||||
@@ -198,6 +198,23 @@ export class CashierService {
|
||||
return this.http.get('/branchday', { params });
|
||||
}
|
||||
|
||||
/**
|
||||
* The savings products whose interest posting report is due for the date and not yet approved —
|
||||
* the backend refuses to close any branch's day while one is pending.
|
||||
*/
|
||||
interestDayCloseCheck(
|
||||
date?: string,
|
||||
officeId?: number
|
||||
): Observable<{ businessDate: string; canClose: boolean; pendingProducts: string[] }> {
|
||||
let params = new HttpParams();
|
||||
if (date) params = params.set('date', date);
|
||||
if (officeId) params = params.set('officeId', String(officeId));
|
||||
return this.http.get<{ businessDate: string; canClose: boolean; pendingProducts: string[] }>(
|
||||
'/savingsinterestpostingreports/day-close-check',
|
||||
{ params }
|
||||
);
|
||||
}
|
||||
|
||||
/** Days opened and never closed — today's own open day excluded. */
|
||||
branchDayMissed(officeId?: number): Observable<any> {
|
||||
let params = new HttpParams();
|
||||
@@ -294,6 +311,16 @@ export class CashierService {
|
||||
if (asOfDate) params = params.set('asOfDate', asOfDate);
|
||||
return this.http.get('/cashreports/vault-position', { params });
|
||||
}
|
||||
/**
|
||||
* Denomination-wise cash the whole branch holds: its vault(s) plus every cashier's drawer, with the day's
|
||||
* exchange movement beside it. Not for a cashier -- the server refuses it.
|
||||
*/
|
||||
branchCashPosition(asOfDate?: string, officeId?: number): Observable<any> {
|
||||
let params = new HttpParams();
|
||||
if (asOfDate) params = params.set('asOfDate', asOfDate);
|
||||
if (officeId) params = params.set('officeId', String(officeId));
|
||||
return this.http.get('/cashreports/branch-position', { params });
|
||||
}
|
||||
excessTransactionReport(threshold: number, fromDate?: string, toDate?: string): Observable<any[]> {
|
||||
let params = new HttpParams().set('threshold', String(threshold));
|
||||
if (fromDate) params = params.set('fromDate', fromDate);
|
||||
@@ -357,19 +384,6 @@ export class CashierService {
|
||||
return this.http.get<any[]>('/paymenttypes');
|
||||
}
|
||||
|
||||
// ── Share Collection ──
|
||||
getShareAccountForCollection(accountId: string): Observable<any> {
|
||||
return this.http.get(`/accounts/share/${accountId}`);
|
||||
}
|
||||
|
||||
collectSharePayment(data: any): Observable<any> {
|
||||
return this.http.post('/cashier/sharecollection', data);
|
||||
}
|
||||
|
||||
getShareCollectionStatus(shareAccountId: number): Observable<any> {
|
||||
return this.http.get(`/cashier/sharecollection/${shareAccountId}`);
|
||||
}
|
||||
|
||||
/** One unapplied Share Sundry receipt, found by the voucher number the member quotes. */
|
||||
getShareAdvanceByVoucher(voucherNo: string, glAccountNo: string, clientId?: number): Observable<any> {
|
||||
// The voucher travels as a query parameter, not a path segment: numbers are formatted
|
||||
@@ -396,10 +410,18 @@ export class CashierService {
|
||||
return this.http.get('/shareadvancecollection/requirement', { params: { shareAccountId: String(shareAccountId) } });
|
||||
}
|
||||
|
||||
/** Receipts still sitting in Share Sundry, optionally for a single member. */
|
||||
getUnappliedShareAdvances(clientId?: number): Observable<any> {
|
||||
const suffix = clientId ? `?clientId=${clientId}` : '';
|
||||
return this.http.get(`/shareadvancecollection${suffix}`);
|
||||
/**
|
||||
* Everything an Apply screen needs, in one call: `own` is this member's own unapplied receipts,
|
||||
* ready to tick; `rows` is every other Share Collection receipt still available — unclaimed GL
|
||||
* deposits and receipts linked to another member — which attach by voucher instead.
|
||||
*
|
||||
* One request rather than two: both lists come from the same table under the same filters, and
|
||||
* splitting them across endpoints only meant the same rows were fetched twice and, where they
|
||||
* overlapped, drawn twice on the same screen.
|
||||
*/
|
||||
getShareCollectionReceipts(clientId?: number): Observable<any> {
|
||||
const params = clientId ? new HttpParams().set('clientId', String(clientId)) : undefined;
|
||||
return this.http.get('/shareadvancecollection/unattributed', { params });
|
||||
}
|
||||
|
||||
/** Moves a receipt out of Sundry into share capital for an activated account. */
|
||||
@@ -407,6 +429,12 @@ export class CashierService {
|
||||
return this.http.post(`/shareadvancecollection/${collectionId}/apply`, data);
|
||||
}
|
||||
|
||||
/** The receipt's own real Dr/Cr GL legs — never the GL account currently picked in a search box,
|
||||
* which is unrelated screen state that can name a different account than this receipt sits in. */
|
||||
getShareAdvanceGlEntries(collectionId: number): Observable<any> {
|
||||
return this.http.get(`/shareadvancecollection/${collectionId}/gl-entries`);
|
||||
}
|
||||
|
||||
/** Every additional-share tranche awaiting approval, across every share account. */
|
||||
getShareAdditionRequests(): Observable<any> {
|
||||
return this.http.get('/shareadditionrequests');
|
||||
@@ -419,4 +447,14 @@ export class CashierService {
|
||||
getShareAdditionRequest(transactionId: number): Observable<any> {
|
||||
return this.http.get(`/shareadditionrequests/${transactionId}`);
|
||||
}
|
||||
|
||||
/**
|
||||
* Entry Type options for a GL credit (General / Share Collection / DD Issue / …) — the
|
||||
* "GLEntryType" code under Admin > System > Manage Codes, so an admin can add another type later
|
||||
* without a deployment. Empty on failure rather than erroring, since a row missing this dropdown's
|
||||
* options should still be usable for every other field.
|
||||
*/
|
||||
getEntryTypeOptions(): Observable<any[]> {
|
||||
return this.http.get<any[]>('/codes/name/GLEntryType/codevalues').pipe(catchError(() => of([])));
|
||||
}
|
||||
}
|
||||
|
||||
@@ -51,6 +51,12 @@ export class ClerkShareWithdrawalService {
|
||||
return this.http.post(`/clerk/share-withdrawal-requests/${id}/validate`, {});
|
||||
}
|
||||
|
||||
/** Runs the exact same checklist approve() will run, against a draft that hasn't been submitted
|
||||
* yet — so the clerk sees it in the confirm dialog, before committing to the request. */
|
||||
previewValidate(data: any): Observable<any> {
|
||||
return this.http.post('/clerk/share-withdrawal-requests/preview-validate', data);
|
||||
}
|
||||
|
||||
approve(id: number): Observable<any> {
|
||||
return this.http.post(`/clerk/share-withdrawal-requests/${id}/approve`, {});
|
||||
}
|
||||
|
||||
@@ -12,6 +12,7 @@ import { FormsModule } from '@angular/forms';
|
||||
import { MatIconModule } from '@angular/material/icon';
|
||||
import { MatPaginatorModule, PageEvent } from '@angular/material/paginator';
|
||||
import { CashierService } from '../cashier.service';
|
||||
import { businessToday } from 'app/core/utils/business-today';
|
||||
|
||||
/** Day-wise denomination-wise closing cash collected from deposits. */
|
||||
@Component({
|
||||
@@ -174,19 +175,24 @@ export class ClosingCashReportComponent implements OnInit {
|
||||
return this.noteRows.reduce((s, r) => s + Number(r.settledOutAmount ?? 0), 0);
|
||||
}
|
||||
|
||||
/**
|
||||
* Summed from each row's own `netCount`, not re-derived from today's legs — a row's `netCount`
|
||||
* already carries forward what a cashier was holding from before today (`openingCount`), for the
|
||||
* force-closed-day/late-settlement case. Recomputing here from only today's vaultIn/deposit/
|
||||
* withdrawal/settledOut dropped that carry-forward and put the Total row back into negative
|
||||
* numbers a cashier had already reconciled.
|
||||
*/
|
||||
get noteNetCount(): number {
|
||||
return this.noteVaultInCount + this.noteDepositCount - this.noteWithdrawalCount - this.noteSettledOutCount;
|
||||
return this.noteRows.reduce((s, r) => s + Number(r.netCount ?? 0), 0);
|
||||
}
|
||||
|
||||
/**
|
||||
* What is left in the drawer in notes: everything that came in, less everything that went out.
|
||||
*
|
||||
* Was deposits minus withdrawals, which is the counter's movement rather than the drawer's
|
||||
* contents — it left out the cash drawn from the vault, so a teller holding a ₹500 note saw a net
|
||||
* of zero and had nothing to count against.
|
||||
* What is left in the drawer in notes: everything that came in, less everything that went out —
|
||||
* including cash carried forward from before today. See `noteNetCount` for why this sums each
|
||||
* row's own `netAmount` rather than re-deriving it from today's legs.
|
||||
*/
|
||||
get noteNetAmount(): number {
|
||||
return this.noteVaultInAmount + this.noteDepositAmount - this.noteWithdrawalAmount - this.noteSettledOutAmount;
|
||||
return this.noteRows.reduce((s, r) => s + Number(r.netAmount ?? 0), 0);
|
||||
}
|
||||
get coinRows(): any[] {
|
||||
return this.rows.filter((r) => r.kind === 'coin');
|
||||
@@ -199,7 +205,7 @@ export class ClosingCashReportComponent implements OnInit {
|
||||
}
|
||||
|
||||
ngOnInit(): void {
|
||||
const d = new Date();
|
||||
const d = businessToday();
|
||||
this.date = `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`;
|
||||
this.load();
|
||||
this.service.getTellers().subscribe({ next: (t: any[]) => (this.tellers = t || []), error: () => {} });
|
||||
|
||||
@@ -13,6 +13,7 @@ import { MatIconModule } from '@angular/material/icon';
|
||||
import { Router } from '@angular/router';
|
||||
import { catchError, of } from 'rxjs';
|
||||
import { CashierService } from '../cashier.service';
|
||||
import { businessToday } from 'app/core/utils/business-today';
|
||||
|
||||
/**
|
||||
* Which part of the day's work a row came from. Set by the server, one per source register.
|
||||
@@ -95,7 +96,7 @@ export class DayBookComponent implements OnInit {
|
||||
|
||||
/** Local date as yyyy-MM-dd — toISOString() would shift the day in any timezone behind UTC. */
|
||||
private today(): string {
|
||||
const d = new Date();
|
||||
const d = businessToday();
|
||||
return `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`;
|
||||
}
|
||||
|
||||
|
||||
@@ -11,41 +11,29 @@
|
||||
<div>
|
||||
<div class="pg-eyebrow">CASHIER · INTER-CASHIER TRANSFER</div>
|
||||
<h1 class="pg-title">Inter-Cashier Transfer</h1>
|
||||
<p class="pg-sub">Move denomination-wise cash between two cashiers within the same teller.</p>
|
||||
<p class="pg-sub">Hand over denomination-wise cash from your drawer to another cashier at your counter.</p>
|
||||
</div>
|
||||
<button type="button" class="pg-btn pg-btn--ghost" (click)="clear()"><mat-icon>undo</mat-icon> Clear</button>
|
||||
</header>
|
||||
|
||||
<div class="pg-toolbar pg-toolbar--mat">
|
||||
@if (tellers.length === 1) {
|
||||
<mat-form-field appearance="outline" subscriptSizing="dynamic">
|
||||
<mat-label>Teller</mat-label>
|
||||
<input matInput type="text" [value]="tellers[0].name" readonly />
|
||||
</mat-form-field>
|
||||
} @else {
|
||||
<mat-form-field appearance="outline" subscriptSizing="dynamic">
|
||||
<mat-label>Teller</mat-label>
|
||||
<mat-select [value]="selectedTellerId" (selectionChange)="onTellerSelect($event.value)">
|
||||
@for (t of tellers; track t.id) {
|
||||
<mat-option [value]="t.id">{{ t.name }}</mat-option>
|
||||
}
|
||||
@if (tellers.length === 0) {
|
||||
<mat-option [value]="null" disabled>No tellers configured</mat-option>
|
||||
}
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
}
|
||||
@if (ownCashierMissing) {
|
||||
<div class="ict-alert">
|
||||
<mat-icon>person_off</mat-icon>
|
||||
Your login is not linked to a cashier. An inter-cashier transfer is made by the cashier handing the cash over, so
|
||||
log in as that cashier.
|
||||
</div>
|
||||
}
|
||||
|
||||
<div class="pg-toolbar pg-toolbar--mat">
|
||||
<mat-form-field appearance="outline" subscriptSizing="dynamic">
|
||||
<mat-label>From (Cashier)</mat-label>
|
||||
<mat-select [value]="fromCashierId" (selectionChange)="onFromSelect($event.value)" [disabled]="!selectedTellerId">
|
||||
@for (c of availableFrom; track c.id) {
|
||||
<mat-option [value]="c.id">{{ c.label }}</mat-option>
|
||||
}
|
||||
@if (selectedTellerId && allCashiers.length === 0 && !loadingCashiers) {
|
||||
<mat-option [value]="null" disabled>No cashiers</mat-option>
|
||||
}
|
||||
</mat-select>
|
||||
<mat-label>Teller</mat-label>
|
||||
<input matInput type="text" [value]="tellerName || '—'" readonly />
|
||||
</mat-form-field>
|
||||
|
||||
<!-- The sender is always the cashier who is logged in; nothing to pick. -->
|
||||
<mat-form-field appearance="outline" subscriptSizing="dynamic">
|
||||
<mat-label>From (You)</mat-label>
|
||||
<input matInput type="text" [value]="fromParty || '—'" readonly />
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field appearance="outline" subscriptSizing="dynamic">
|
||||
@@ -54,7 +42,7 @@
|
||||
@for (c of availableTo; track c.id) {
|
||||
<mat-option [value]="c.id">{{ c.label }}</mat-option>
|
||||
}
|
||||
@if (fromCashierId && availableTo.length === 0) {
|
||||
@if (fromCashierId && !loadingCashiers && availableTo.length === 0) {
|
||||
<mat-option [value]="null" disabled>No other cashiers</mat-option>
|
||||
}
|
||||
</mat-select>
|
||||
@@ -62,7 +50,7 @@
|
||||
|
||||
<mat-form-field appearance="outline" subscriptSizing="dynamic">
|
||||
<mat-label>Date</mat-label>
|
||||
<input matInput type="date" [value]="transferDate" (change)="transferDate = $any($event.target).value" />
|
||||
<input matInput type="date" [value]="transferDate" (change)="onDateChange($any($event.target).value)" />
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field appearance="outline" subscriptSizing="dynamic" class="pg-note-field">
|
||||
@@ -71,26 +59,102 @@
|
||||
</mat-form-field>
|
||||
</div>
|
||||
|
||||
<!-- Both sides of the transfer: who they are, whether the vault has allocated them cash today,
|
||||
and what they hold now. -->
|
||||
@if (fromCashierId || toCashierId) {
|
||||
<div class="ict-parties">
|
||||
<ng-container
|
||||
*ngTemplateOutlet="
|
||||
partyCard;
|
||||
context: { title: 'From (Sending Cashier)', s: fromSummary, loading: loadingFrom, picked: !!fromCashierId }
|
||||
"
|
||||
></ng-container>
|
||||
<mat-icon class="ict-parties__arrow">arrow_forward</mat-icon>
|
||||
<ng-container
|
||||
*ngTemplateOutlet="
|
||||
partyCard;
|
||||
context: { title: 'To (Receiving Cashier)', s: toSummary, loading: loadingTo, picked: !!toCashierId }
|
||||
"
|
||||
></ng-container>
|
||||
</div>
|
||||
}
|
||||
|
||||
<ng-template #partyCard let-title="title" let-s="s" let-loading="loading" let-picked="picked">
|
||||
<div class="ict-party" [class.ict-party--blocked]="s && !s.cashAllocated">
|
||||
<div class="ict-party__title">{{ title }}</div>
|
||||
@if (!picked) {
|
||||
<div class="ict-party__empty">Select a cashier</div>
|
||||
} @else if (loading) {
|
||||
<div class="ict-party__empty">Loading…</div>
|
||||
} @else if (!s) {
|
||||
<div class="ict-party__empty">Could not load this cashier's details.</div>
|
||||
} @else {
|
||||
<div class="ict-party__name">{{ s.cashierName || '—' }}</div>
|
||||
<div class="ict-party__meta">
|
||||
<span><mat-icon>point_of_sale</mat-icon> {{ s.tellerName || '—' }}</span>
|
||||
<span><mat-icon>account_balance</mat-icon> {{ s.officeName || '—' }}</span>
|
||||
</div>
|
||||
<div class="ict-party__figures">
|
||||
<div>
|
||||
<div class="ict-party__label">Allocated today</div>
|
||||
<div class="ict-party__value">₹{{ s.allocatedAmount | number: '1.2-2' }}</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="ict-party__label">Cash in hand</div>
|
||||
<div class="ict-party__value">₹{{ s.totalAmount | number: '1.2-2' }}</div>
|
||||
</div>
|
||||
</div>
|
||||
@if (!s.cashAllocated) {
|
||||
<div class="ict-party__warn">
|
||||
<mat-icon>block</mat-icon> No cash allocated from the vault for this date — inter-cashier transfer is not
|
||||
allowed.
|
||||
</div>
|
||||
}
|
||||
}
|
||||
</div>
|
||||
</ng-template>
|
||||
|
||||
@if (fromSummary && toSummary && !bothAllocated) {
|
||||
<div class="ict-alert">
|
||||
<mat-icon>block</mat-icon>
|
||||
Both cashiers must first be allocated cash from the vault (Cash Transfer) for {{ transferDate }} before an
|
||||
inter-cashier transfer.
|
||||
</div>
|
||||
}
|
||||
@if (anyExceedsHeld) {
|
||||
<div class="ict-alert">
|
||||
<mat-icon>error_outline</mat-icon>
|
||||
The sending cashier does not hold enough of the highlighted denominations.
|
||||
</div>
|
||||
}
|
||||
|
||||
<div class="pg-card">
|
||||
<table class="pg-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Denomination</th>
|
||||
<th class="num">From holds</th>
|
||||
<th style="text-align: center">Count</th>
|
||||
<th class="num">Amount</th>
|
||||
<th class="num">To holds</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@if (notes.length) {
|
||||
<tr class="pg-section">
|
||||
<td colspan="3">Bank Notes</td>
|
||||
<td colspan="5">Bank Notes</td>
|
||||
</tr>
|
||||
}
|
||||
@for (d of notes; track d.id) {
|
||||
<tr>
|
||||
<tr [class.ict-row--over]="exceedsHeld(d)">
|
||||
<td>
|
||||
<span class="pg-chip">{{ d.label }}</span>
|
||||
</td>
|
||||
<td class="num" [class.ict-held--over]="exceedsHeld(d)">
|
||||
<ng-container
|
||||
*ngTemplateOutlet="heldCell; context: { n: heldBy(fromSummary, d), delta: -countFor(d) }"
|
||||
></ng-container>
|
||||
</td>
|
||||
<td style="display: flex; justify-content: center">
|
||||
<div class="pg-step">
|
||||
<button type="button" (click)="bump(d, -1)" [disabled]="countFor(d) === 0">−</button>
|
||||
@@ -99,18 +163,28 @@
|
||||
</div>
|
||||
</td>
|
||||
<td class="num">₹{{ subtotal(d) | number: '1.2-2' }}</td>
|
||||
<td class="num">
|
||||
<ng-container
|
||||
*ngTemplateOutlet="heldCell; context: { n: heldBy(toSummary, d), delta: countFor(d) }"
|
||||
></ng-container>
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
@if (coins.length) {
|
||||
<tr class="pg-section">
|
||||
<td colspan="3">Coins</td>
|
||||
<td colspan="5">Coins</td>
|
||||
</tr>
|
||||
}
|
||||
@for (d of coins; track d.id) {
|
||||
<tr>
|
||||
<tr [class.ict-row--over]="exceedsHeld(d)">
|
||||
<td>
|
||||
<span class="pg-chip pg-chip--coin">{{ d.label }}</span>
|
||||
</td>
|
||||
<td class="num" [class.ict-held--over]="exceedsHeld(d)">
|
||||
<ng-container
|
||||
*ngTemplateOutlet="heldCell; context: { n: heldBy(fromSummary, d), delta: -countFor(d) }"
|
||||
></ng-container>
|
||||
</td>
|
||||
<td style="display: flex; justify-content: center">
|
||||
<div class="pg-step">
|
||||
<button type="button" (click)="bump(d, -1)" [disabled]="countFor(d) === 0">−</button>
|
||||
@@ -119,17 +193,34 @@
|
||||
</div>
|
||||
</td>
|
||||
<td class="num">₹{{ subtotal(d) | number: '1.2-2' }}</td>
|
||||
<td class="num">
|
||||
<ng-container
|
||||
*ngTemplateOutlet="heldCell; context: { n: heldBy(toSummary, d), delta: countFor(d) }"
|
||||
></ng-container>
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
@if (denoms.length === 0) {
|
||||
<tr>
|
||||
<td colspan="3" class="pg-empty">No active denominations. Add some in Cash Denomination.</td>
|
||||
<td colspan="5" class="pg-empty">No active denominations. Add some in Cash Denomination.</td>
|
||||
</tr>
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<!-- A held count, with what it becomes once this transfer is recorded. -->
|
||||
<ng-template #heldCell let-n="n" let-delta="delta">
|
||||
@if (n === null) {
|
||||
—
|
||||
} @else {
|
||||
{{ n }}
|
||||
@if (delta !== 0) {
|
||||
<span class="ict-after">→ {{ n + delta }}</span>
|
||||
}
|
||||
}
|
||||
</ng-template>
|
||||
|
||||
<div class="pg-total-bar">
|
||||
Total to transfer: <strong>₹{{ total | number: '1.2-2' }}</strong>
|
||||
<button type="button" class="pg-btn pg-btn--primary" [disabled]="!valid || saving" (click)="submit()">
|
||||
|
||||
@@ -0,0 +1,150 @@
|
||||
/**
|
||||
* 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/.
|
||||
*/
|
||||
|
||||
.ict-parties {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr auto 1fr;
|
||||
align-items: stretch;
|
||||
gap: 12px;
|
||||
margin-bottom: 12px;
|
||||
|
||||
&__arrow {
|
||||
align-self: center;
|
||||
color: #64748b;
|
||||
}
|
||||
|
||||
@media (width <= 760px) {
|
||||
grid-template-columns: 1fr;
|
||||
|
||||
&__arrow {
|
||||
justify-self: center;
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.ict-party {
|
||||
padding: 12px 14px;
|
||||
background: #fff;
|
||||
border: 1px solid #e2e8f0;
|
||||
border-radius: 10px;
|
||||
|
||||
&--blocked {
|
||||
background: #fef2f2;
|
||||
border-color: #fecaca;
|
||||
}
|
||||
|
||||
&__title {
|
||||
font-size: 11px;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.04em;
|
||||
text-transform: uppercase;
|
||||
color: #64748b;
|
||||
}
|
||||
|
||||
&__empty {
|
||||
margin-top: 8px;
|
||||
font-size: 13px;
|
||||
color: #94a3b8;
|
||||
}
|
||||
|
||||
&__name {
|
||||
margin-top: 4px;
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
color: #0f172a;
|
||||
}
|
||||
|
||||
&__meta {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 14px;
|
||||
margin-top: 4px;
|
||||
font-size: 12px;
|
||||
color: #475569;
|
||||
|
||||
span {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
mat-icon {
|
||||
font-size: 14px;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
&__figures {
|
||||
display: flex;
|
||||
gap: 24px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
&__label {
|
||||
font-size: 11px;
|
||||
color: #64748b;
|
||||
}
|
||||
|
||||
&__value {
|
||||
font-size: 15px;
|
||||
font-weight: 700;
|
||||
color: #0f172a;
|
||||
}
|
||||
|
||||
&__warn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
margin-top: 10px;
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
color: #991b1b;
|
||||
|
||||
mat-icon {
|
||||
font-size: 16px;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.ict-alert {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
margin-bottom: 10px;
|
||||
padding: 8px 14px;
|
||||
background: #fef2f2;
|
||||
border: 1px solid #fecaca;
|
||||
border-radius: 8px;
|
||||
font-size: 12px;
|
||||
color: #991b1b;
|
||||
|
||||
mat-icon {
|
||||
font-size: 16px;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.ict-row--over {
|
||||
background: #fef2f2;
|
||||
}
|
||||
|
||||
.ict-held--over {
|
||||
color: #b91c1c;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.ict-after {
|
||||
margin-left: 4px;
|
||||
font-size: 11px;
|
||||
color: #64748b;
|
||||
}
|
||||
@@ -17,6 +17,7 @@ import { MatInputModule } from '@angular/material/input';
|
||||
import { of } from 'rxjs';
|
||||
import { catchError } from 'rxjs/operators';
|
||||
import { CashierService } from '../cashier.service';
|
||||
import { businessToday } from 'app/core/utils/business-today';
|
||||
|
||||
interface Denom {
|
||||
id: number;
|
||||
@@ -28,12 +29,27 @@ interface Cashier {
|
||||
id: number;
|
||||
label: string;
|
||||
}
|
||||
/** One side of the transfer, from GET /cashintercashier/cashier-summary. */
|
||||
interface CashierSummary {
|
||||
cashierId: number;
|
||||
cashierName: string;
|
||||
tellerName: string;
|
||||
officeName: string;
|
||||
cashAllocated: boolean;
|
||||
allocatedAmount: number;
|
||||
totalAmount: number;
|
||||
/** Count held per denomination id. */
|
||||
held: Record<number, number>;
|
||||
}
|
||||
|
||||
/** Move cash denomination-wise between two cashiers under the same teller. */
|
||||
@Component({
|
||||
selector: 'mifosx-inter-cashier-transfer',
|
||||
templateUrl: './inter-cashier-transfer.component.html',
|
||||
styleUrls: ['../cashier-shared.scss'],
|
||||
styleUrls: [
|
||||
'../cashier-shared.scss',
|
||||
'./inter-cashier-transfer.component.scss'
|
||||
],
|
||||
standalone: true,
|
||||
imports: [
|
||||
CommonModule,
|
||||
@@ -56,7 +72,12 @@ export class InterCashierTransferComponent implements OnInit {
|
||||
note = '';
|
||||
saving = false;
|
||||
|
||||
tellers: { id: number; name: string }[] = [];
|
||||
/**
|
||||
* The sending cashier is always the one logged in: cash is handed over from their own drawer, so there is
|
||||
* no one else to pick on that side. Only the receiving cashier is chosen.
|
||||
*/
|
||||
ownCashierMissing = false;
|
||||
tellerName = '';
|
||||
allCashiers: Cashier[] = [];
|
||||
selectedTellerId: number | null = null;
|
||||
fromCashierId: number | null = null;
|
||||
@@ -65,21 +86,25 @@ export class InterCashierTransferComponent implements OnInit {
|
||||
toParty = '';
|
||||
loadingCashiers = false;
|
||||
|
||||
/** Details and denomination-wise cash of each side, so both are seen before the transfer is recorded. */
|
||||
fromSummary: CashierSummary | null = null;
|
||||
toSummary: CashierSummary | null = null;
|
||||
loadingFrom = false;
|
||||
loadingTo = false;
|
||||
|
||||
get denoms(): Denom[] {
|
||||
return [
|
||||
...this.notes,
|
||||
...this.coins
|
||||
];
|
||||
}
|
||||
get availableFrom(): Cashier[] {
|
||||
return this.allCashiers;
|
||||
}
|
||||
/** Everyone under the same teller except the sender. */
|
||||
get availableTo(): Cashier[] {
|
||||
return this.allCashiers.filter((c) => c.id !== this.fromCashierId);
|
||||
}
|
||||
|
||||
ngOnInit(): void {
|
||||
const d = new Date();
|
||||
const d = businessToday();
|
||||
this.transferDate = `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`;
|
||||
this.service.getActiveDenominations().subscribe({
|
||||
next: (list) => {
|
||||
@@ -97,25 +122,20 @@ export class InterCashierTransferComponent implements OnInit {
|
||||
this.coins = [];
|
||||
}
|
||||
});
|
||||
this.service
|
||||
.getTellers()
|
||||
.pipe(catchError(() => of([] as any[])))
|
||||
.subscribe((list) => {
|
||||
this.tellers = (list || []).map((t: any) => ({ id: t.id, name: t.name }));
|
||||
if (this.tellers.length === 1) {
|
||||
this.onTellerSelect(this.tellers[0].id);
|
||||
}
|
||||
});
|
||||
// The sender is the cashier behind this login; their counter then gives the receivers to pick from.
|
||||
this.service.getCurrentCashierInfo().subscribe((info) => {
|
||||
if (!info) {
|
||||
this.ownCashierMissing = true;
|
||||
return;
|
||||
}
|
||||
this.fromCashierId = info.cashierId;
|
||||
this.fromParty = info.cashierName;
|
||||
this.loadSummary('from');
|
||||
});
|
||||
}
|
||||
|
||||
onTellerSelect(tellerId: number): void {
|
||||
this.selectedTellerId = tellerId;
|
||||
this.fromCashierId = null;
|
||||
this.toCashierId = null;
|
||||
this.fromParty = '';
|
||||
this.toParty = '';
|
||||
this.allCashiers = [];
|
||||
if (!tellerId) return;
|
||||
/** The other cashiers at this counter, one of whom receives the cash. */
|
||||
private loadReceivers(tellerId: number): void {
|
||||
this.loadingCashiers = true;
|
||||
this.service
|
||||
.getCashiersForTeller(tellerId)
|
||||
@@ -126,20 +146,90 @@ export class InterCashierTransferComponent implements OnInit {
|
||||
});
|
||||
}
|
||||
|
||||
onFromSelect(cashierId: number): void {
|
||||
this.fromCashierId = cashierId;
|
||||
const c = this.allCashiers.find((x) => x.id === cashierId);
|
||||
this.fromParty = c ? c.label : '';
|
||||
if (this.toCashierId === cashierId) {
|
||||
this.toCashierId = null;
|
||||
this.toParty = '';
|
||||
}
|
||||
}
|
||||
|
||||
onToSelect(cashierId: number): void {
|
||||
this.toCashierId = cashierId;
|
||||
const c = this.allCashiers.find((x) => x.id === cashierId);
|
||||
this.toParty = c ? c.label : '';
|
||||
this.loadSummary('to');
|
||||
}
|
||||
|
||||
onDateChange(value: string): void {
|
||||
this.transferDate = value;
|
||||
this.loadSummary('from');
|
||||
this.loadSummary('to');
|
||||
}
|
||||
|
||||
/** Fetch one side's details, vault allocation and denomination-wise cash for the transfer date. */
|
||||
private loadSummary(side: 'from' | 'to'): void {
|
||||
const cashierId = side === 'from' ? this.fromCashierId : this.toCashierId;
|
||||
if (side === 'from') {
|
||||
this.fromSummary = null;
|
||||
} else {
|
||||
this.toSummary = null;
|
||||
}
|
||||
if (!cashierId || !this.transferDate) return;
|
||||
this.setLoading(side, true);
|
||||
this.service
|
||||
.getInterCashierCashierSummary(cashierId, this.transferDate)
|
||||
.pipe(catchError(() => of(null)))
|
||||
.subscribe((r: any) => {
|
||||
this.setLoading(side, false);
|
||||
// A late answer for a cashier no longer selected on that side is dropped.
|
||||
const current = side === 'from' ? this.fromCashierId : this.toCashierId;
|
||||
if (!r || current !== cashierId) return;
|
||||
// The sender's summary also tells which counter they are at, hence who they can hand cash to.
|
||||
if (side === 'from' && r.tellerId && this.selectedTellerId !== Number(r.tellerId)) {
|
||||
this.selectedTellerId = Number(r.tellerId);
|
||||
this.tellerName = r.tellerName || '';
|
||||
this.loadReceivers(this.selectedTellerId);
|
||||
}
|
||||
const held: Record<number, number> = {};
|
||||
for (const d of r.denominations || []) {
|
||||
held[d.denominationId] = (held[d.denominationId] || 0) + Number(d.count || 0);
|
||||
}
|
||||
const summary: CashierSummary = {
|
||||
cashierId: r.cashierId,
|
||||
cashierName: r.cashierName,
|
||||
tellerName: r.tellerName,
|
||||
officeName: r.officeName,
|
||||
cashAllocated: !!r.cashAllocated,
|
||||
allocatedAmount: Number(r.allocatedAmount || 0),
|
||||
totalAmount: Number(r.totalAmount || 0),
|
||||
held
|
||||
};
|
||||
if (side === 'from') {
|
||||
this.fromSummary = summary;
|
||||
} else {
|
||||
this.toSummary = summary;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
private setLoading(side: 'from' | 'to', loading: boolean): void {
|
||||
if (side === 'from') {
|
||||
this.loadingFrom = loading;
|
||||
} else {
|
||||
this.loadingTo = loading;
|
||||
}
|
||||
}
|
||||
|
||||
/** Count of the denomination the cashier holds, or null while their figures are not loaded. */
|
||||
heldBy(summary: CashierSummary | null, d: Denom): number | null {
|
||||
return summary ? summary.held[d.id] || 0 : null;
|
||||
}
|
||||
|
||||
/** The sending cashier is asked to hand on more of this denomination than they hold. */
|
||||
exceedsHeld(d: Denom): boolean {
|
||||
return !!this.fromSummary && this.countFor(d) > (this.fromSummary.held[d.id] || 0);
|
||||
}
|
||||
|
||||
get anyExceedsHeld(): boolean {
|
||||
return this.denoms.some((d) => this.exceedsHeld(d));
|
||||
}
|
||||
|
||||
/** Both sides must have been allocated cash from the vault for the day before they can transfer. */
|
||||
get bothAllocated(): boolean {
|
||||
return !!this.fromSummary?.cashAllocated && !!this.toSummary?.cashAllocated;
|
||||
}
|
||||
|
||||
countFor(d: Denom): number {
|
||||
@@ -159,7 +249,14 @@ export class InterCashierTransferComponent implements OnInit {
|
||||
return this.denoms.reduce((s, d) => s + this.subtotal(d), 0);
|
||||
}
|
||||
get valid(): boolean {
|
||||
return this.total > 0 && !!this.selectedTellerId && !!this.fromCashierId && !!this.toCashierId;
|
||||
return (
|
||||
this.total > 0 &&
|
||||
!!this.selectedTellerId &&
|
||||
!!this.fromCashierId &&
|
||||
!!this.toCashierId &&
|
||||
this.bothAllocated &&
|
||||
!this.anyExceedsHeld
|
||||
);
|
||||
}
|
||||
|
||||
clear(): void {
|
||||
@@ -186,10 +283,12 @@ export class InterCashierTransferComponent implements OnInit {
|
||||
this.snackBar.open('Inter-cashier transfer recorded', 'Close', { duration: 3000 });
|
||||
this.clear();
|
||||
this.note = '';
|
||||
this.fromCashierId = null;
|
||||
// The sender stays the logged-in cashier; the receiver is picked afresh, and the sender's holdings
|
||||
// are read again now that part of them has gone.
|
||||
this.toCashierId = null;
|
||||
this.fromParty = '';
|
||||
this.toParty = '';
|
||||
this.toSummary = null;
|
||||
this.loadSummary('from');
|
||||
this.saving = false;
|
||||
},
|
||||
error: () => {
|
||||
|
||||
@@ -152,9 +152,21 @@
|
||||
<tbody>
|
||||
@for (r of g.rows; track r.voucherNo) {
|
||||
<!-- The left edge repeats the section's own colour, so a row still says which part it
|
||||
is when the heading has scrolled away. -->
|
||||
<tr [class]="'mw-row mw-row--' + r.myRole">
|
||||
<td class="mw-vno">{{ r.voucherNo }}</td>
|
||||
is when the heading has scrolled away. Clicking anywhere on the row opens the full
|
||||
slip -- every line, not just the first debit and first credit this table has room
|
||||
to show. -->
|
||||
<tr
|
||||
[class]="'mw-row mw-row--' + r.myRole"
|
||||
class="mw-row--clickable"
|
||||
(click)="openDetail(r.voucherNo)"
|
||||
[attr.aria-busy]="loadingDetailFor === r.voucherNo"
|
||||
>
|
||||
<td class="mw-vno">
|
||||
{{ r.voucherNo }}
|
||||
@if (loadingDetailFor === r.voucherNo) {
|
||||
<mat-icon class="mw-vno__spinner" inline>hourglass_empty</mat-icon>
|
||||
}
|
||||
</td>
|
||||
<td>
|
||||
<span class="mw-badge" [class]="'mw-badge--' + (r.side || 'JV')">{{ sideLabel(r.side) }}</span>
|
||||
</td>
|
||||
@@ -171,7 +183,7 @@
|
||||
<span class="mw-acct">{{ r.creditAccount }}</span>
|
||||
}
|
||||
@if (r.extraLines > 0) {
|
||||
<span class="mw-more">+{{ r.extraLines }} more</span>
|
||||
<span class="mw-more" title="Click the row to see every line">+{{ r.extraLines }} more</span>
|
||||
}
|
||||
</td>
|
||||
<td class="num">₹{{ r.amount | number: '1.2-2' }}</td>
|
||||
|
||||
@@ -178,6 +178,21 @@
|
||||
}
|
||||
}
|
||||
|
||||
.mw-row--clickable {
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background: #f8fafc;
|
||||
}
|
||||
}
|
||||
|
||||
.mw-vno__spinner {
|
||||
margin-left: 4px;
|
||||
font-size: 14px;
|
||||
vertical-align: middle;
|
||||
color: #94a3b8;
|
||||
}
|
||||
|
||||
/* One section per part played. The heading carries the section's own count and total, so a maker's
|
||||
tally and a checker's are each readable without adding rows up. */
|
||||
.mw-group {
|
||||
|
||||
@@ -10,8 +10,11 @@ import { Component, OnInit, inject } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
import { MatIconModule } from '@angular/material/icon';
|
||||
import { catchError, of } from 'rxjs';
|
||||
import { MatDialog, MatDialogModule } from '@angular/material/dialog';
|
||||
import { catchError, finalize, of } from 'rxjs';
|
||||
import { CashierService } from '../cashier.service';
|
||||
import { VoucherDetailDialogComponent } from './voucher-detail-dialog.component';
|
||||
import { businessToday } from 'app/core/utils/business-today';
|
||||
|
||||
/** What the signed-in user's part in a voucher was. */
|
||||
export type MyRole = 'RAISED' | 'VERIFIED' | 'RAISED_AND_VERIFIED';
|
||||
@@ -72,11 +75,17 @@ interface MyWorkReport {
|
||||
imports: [
|
||||
CommonModule,
|
||||
FormsModule,
|
||||
MatIconModule
|
||||
MatIconModule,
|
||||
MatDialogModule
|
||||
]
|
||||
})
|
||||
export class MyWorkComponent implements OnInit {
|
||||
private service = inject(CashierService);
|
||||
private dialog = inject(MatDialog);
|
||||
|
||||
/** Which voucher's detail is currently being fetched, so the row that was clicked can show its
|
||||
* own spinner instead of a page-wide one for what is a small, single-row lookup. */
|
||||
loadingDetailFor: string | null = null;
|
||||
|
||||
/** Day is the working default; a month is what a close or an audit asks for. */
|
||||
period: 'DAY' | 'MONTH' = 'DAY';
|
||||
@@ -323,8 +332,33 @@ export class MyWorkComponent implements OnInit {
|
||||
return { from: first, to: lastIso };
|
||||
}
|
||||
|
||||
/** Opens the full slip for one voucher — every debit and credit line, not just the first side of
|
||||
* each a table row has room to show. */
|
||||
openDetail(voucherNo: string): void {
|
||||
if (this.loadingDetailFor) {
|
||||
return;
|
||||
}
|
||||
this.loadingDetailFor = voucherNo;
|
||||
this.service
|
||||
.voucherDetail(voucherNo)
|
||||
.pipe(
|
||||
catchError(() => of(null)),
|
||||
finalize(() => (this.loadingDetailFor = null))
|
||||
)
|
||||
.subscribe((detail: any) => {
|
||||
if (!detail) {
|
||||
return;
|
||||
}
|
||||
this.dialog.open(VoucherDetailDialogComponent, {
|
||||
data: { detail },
|
||||
width: '600px',
|
||||
autoFocus: false
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
private todayIso(): string {
|
||||
const d = new Date();
|
||||
const d = businessToday();
|
||||
return `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,320 @@
|
||||
/**
|
||||
* 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 } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { MatDialogModule, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
|
||||
import { MatButtonModule } from '@angular/material/button';
|
||||
import { MatIconModule } from '@angular/material/icon';
|
||||
|
||||
export interface VoucherDetailDialogData {
|
||||
/** Already-loaded detail from CashierService.voucherDetail() — the caller fetches, this dialog
|
||||
* only renders, so one loading state lives in the row's own click handler rather than being
|
||||
* duplicated inside every dialog that could ever show a voucher. */
|
||||
detail: {
|
||||
voucherNo: string;
|
||||
voucherType: string | null;
|
||||
amount: number | null;
|
||||
branchName: string | null;
|
||||
createdBy: string | null;
|
||||
createdAt: string | null;
|
||||
totalDebit: number;
|
||||
totalCredit: number;
|
||||
balanced: boolean;
|
||||
lines: {
|
||||
lineNo: number;
|
||||
entryType: 'DR' | 'CR';
|
||||
partyName: string | null;
|
||||
accountNo: string | null;
|
||||
amount: number;
|
||||
description: string | null;
|
||||
}[];
|
||||
/** GL entries a native platform command posted for the same underlying event, outside this
|
||||
* voucher entirely — a share redemption's Dr Share Capital / Cr Share Sundry pair, posted at
|
||||
* manager approval, before this voucher's own Dr Sundry / Cr Cash at Vault settlement leg even
|
||||
* exists. Empty for every voucher that already is the whole transaction on its own. */
|
||||
relatedLines: {
|
||||
stage: string;
|
||||
entryType: 'DR' | 'CR';
|
||||
partyName: string | null;
|
||||
accountNo: string | null;
|
||||
amount: number;
|
||||
description: string | null;
|
||||
}[];
|
||||
};
|
||||
}
|
||||
|
||||
/** The full slip behind a summarised register row — every debit and credit line a voucher is
|
||||
* made of, not just the first side of each that a table row has room for. */
|
||||
@Component({
|
||||
selector: 'mifosx-voucher-detail-dialog',
|
||||
standalone: true,
|
||||
imports: [
|
||||
CommonModule,
|
||||
MatDialogModule,
|
||||
MatButtonModule,
|
||||
MatIconModule
|
||||
],
|
||||
template: `
|
||||
<div class="vd-shell">
|
||||
<div class="vd-header">
|
||||
<div class="vd-header__title">
|
||||
<mat-icon class="vd-icon">receipt_long</mat-icon>
|
||||
<div>
|
||||
<h2>{{ detail.voucherNo }}</h2>
|
||||
<p>{{ detail.voucherType || 'Voucher' }} · {{ detail.branchName || 'Head Office' }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<button mat-icon-button mat-dialog-close aria-label="Close">
|
||||
<mat-icon>close</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="vd-meta">
|
||||
<span
|
||||
>Raised by <strong>{{ detail.createdBy || '—' }}</strong></span
|
||||
>
|
||||
@if (detail.createdAt) {
|
||||
<span>{{ detail.createdAt | date: 'dd MMM yyyy, h:mm a' }}</span>
|
||||
}
|
||||
@if (!detail.balanced) {
|
||||
<span class="vd-unbalanced">
|
||||
<mat-icon inline>warning</mat-icon>
|
||||
Debit and credit do not balance
|
||||
</span>
|
||||
}
|
||||
</div>
|
||||
|
||||
<table class="vd-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Side</th>
|
||||
<th>Party</th>
|
||||
<th>Account No.</th>
|
||||
<th class="num">Amount</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@for (line of detail.lines; track line.lineNo) {
|
||||
<tr>
|
||||
<td>
|
||||
<span
|
||||
class="vd-side"
|
||||
[class.vd-side--dr]="line.entryType === 'DR'"
|
||||
[class.vd-side--cr]="line.entryType === 'CR'"
|
||||
>
|
||||
{{ line.entryType === 'DR' ? 'Debit' : 'Credit' }}
|
||||
</span>
|
||||
</td>
|
||||
<td>{{ line.partyName || '—' }}</td>
|
||||
<td class="vd-acct">{{ line.accountNo || '—' }}</td>
|
||||
<td class="num">₹{{ line.amount | number: '1.2-2' }}</td>
|
||||
</tr>
|
||||
@if (line.description) {
|
||||
<tr class="vd-desc-row">
|
||||
<td></td>
|
||||
<td colspan="3" class="vd-desc">{{ line.description }}</td>
|
||||
</tr>
|
||||
}
|
||||
} @empty {
|
||||
<tr>
|
||||
<td colspan="4" class="vd-empty">This voucher's individual lines were not recorded.</td>
|
||||
</tr>
|
||||
}
|
||||
</tbody>
|
||||
@if (detail.lines.length > 0) {
|
||||
<tfoot>
|
||||
<tr>
|
||||
<td colspan="3">Total</td>
|
||||
<td class="num">
|
||||
₹{{ detail.totalDebit | number: '1.2-2' }} / ₹{{ detail.totalCredit | number: '1.2-2' }}
|
||||
</td>
|
||||
</tr>
|
||||
</tfoot>
|
||||
}
|
||||
</table>
|
||||
|
||||
@if (detail.relatedLines.length > 0) {
|
||||
<div class="vd-related">
|
||||
<div class="vd-related__title">
|
||||
<mat-icon inline>link</mat-icon>
|
||||
Also posted for this transaction — not part of this voucher
|
||||
</div>
|
||||
<table class="vd-table vd-table--related">
|
||||
<tbody>
|
||||
@for (line of detail.relatedLines; track $index) {
|
||||
<tr>
|
||||
<td>
|
||||
<span
|
||||
class="vd-side"
|
||||
[class.vd-side--dr]="line.entryType === 'DR'"
|
||||
[class.vd-side--cr]="line.entryType === 'CR'"
|
||||
>
|
||||
{{ line.entryType === 'DR' ? 'Debit' : 'Credit' }}
|
||||
</span>
|
||||
</td>
|
||||
<td>{{ line.partyName || '—' }}</td>
|
||||
<td class="vd-acct">{{ line.accountNo || '—' }}</td>
|
||||
<td class="num">₹{{ line.amount | number: '1.2-2' }}</td>
|
||||
</tr>
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
<p class="vd-related__hint">
|
||||
{{ detail.relatedLines[0].stage }} — this and the lines above are the same transaction's full accounting.
|
||||
</p>
|
||||
</div>
|
||||
}
|
||||
|
||||
<div class="vd-actions">
|
||||
<button mat-flat-button color="primary" mat-dialog-close>Close</button>
|
||||
</div>
|
||||
</div>
|
||||
`,
|
||||
styles: [
|
||||
`
|
||||
.vd-shell {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 16px;
|
||||
padding: 20px 24px 16px;
|
||||
min-width: 420px;
|
||||
max-width: 560px;
|
||||
}
|
||||
.vd-header {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.vd-header__title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
}
|
||||
.vd-header__title h2 {
|
||||
margin: 0;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
}
|
||||
.vd-header__title p {
|
||||
margin: 2px 0 0;
|
||||
font-size: 13px;
|
||||
color: rgba(0, 0, 0, 0.6);
|
||||
}
|
||||
.vd-icon {
|
||||
color: #1976d2;
|
||||
}
|
||||
.vd-meta {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 6px 16px;
|
||||
font-size: 13px;
|
||||
color: rgba(0, 0, 0, 0.65);
|
||||
}
|
||||
.vd-unbalanced {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
color: #b91c1c;
|
||||
font-weight: 600;
|
||||
}
|
||||
.vd-table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
font-size: 13px;
|
||||
}
|
||||
.vd-table th {
|
||||
text-align: left;
|
||||
text-transform: uppercase;
|
||||
font-size: 11px;
|
||||
letter-spacing: 0.03em;
|
||||
color: rgba(0, 0, 0, 0.5);
|
||||
padding: 6px 8px;
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
.vd-table td {
|
||||
padding: 8px;
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.06);
|
||||
}
|
||||
.vd-table .num {
|
||||
text-align: right;
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
.vd-acct {
|
||||
color: rgba(0, 0, 0, 0.55);
|
||||
}
|
||||
.vd-side {
|
||||
display: inline-block;
|
||||
padding: 2px 8px;
|
||||
border-radius: 4px;
|
||||
font-size: 11px;
|
||||
font-weight: 600;
|
||||
}
|
||||
.vd-side--dr {
|
||||
background: #fee2e2;
|
||||
color: #b91c1c;
|
||||
}
|
||||
.vd-side--cr {
|
||||
background: #dcfce7;
|
||||
color: #15803d;
|
||||
}
|
||||
.vd-desc-row td {
|
||||
padding-top: 0;
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.06);
|
||||
}
|
||||
.vd-desc {
|
||||
font-size: 12px;
|
||||
color: rgba(0, 0, 0, 0.5);
|
||||
font-style: italic;
|
||||
}
|
||||
.vd-empty {
|
||||
text-align: center;
|
||||
color: rgba(0, 0, 0, 0.5);
|
||||
padding: 16px 8px;
|
||||
}
|
||||
.vd-table tfoot td {
|
||||
font-weight: 600;
|
||||
border-bottom: none;
|
||||
border-top: 1px solid rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
.vd-related {
|
||||
border-top: 1px dashed rgba(0, 0, 0, 0.15);
|
||||
padding-top: 12px;
|
||||
}
|
||||
.vd-related__title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.03em;
|
||||
color: #6d28d9;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
.vd-table--related td {
|
||||
background: #faf5ff;
|
||||
}
|
||||
.vd-related__hint {
|
||||
margin: 6px 0 0;
|
||||
font-size: 12px;
|
||||
color: rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
.vd-actions {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
`
|
||||
]
|
||||
})
|
||||
export class VoucherDetailDialogComponent {
|
||||
dialogRef = inject(MatDialogRef<VoucherDetailDialogComponent>);
|
||||
private data = inject<VoucherDetailDialogData>(MAT_DIALOG_DATA);
|
||||
|
||||
detail = this.data.detail;
|
||||
}
|
||||
@@ -19,34 +19,21 @@
|
||||
<!-- ── Entry Tab ── -->
|
||||
<mat-tab label="New Reconciliation">
|
||||
<div class="pg-tab-body">
|
||||
@if (ownCashierMissing) {
|
||||
<div class="pg-empty">
|
||||
Your login is not linked to a cashier, so there is no cash drawer to reconcile. Ask an administrator to link
|
||||
your user to a cashier.
|
||||
</div>
|
||||
}
|
||||
<div class="pg-toolbar pg-toolbar--mat">
|
||||
@if (tellers.length === 1) {
|
||||
<mat-form-field appearance="outline" subscriptSizing="dynamic">
|
||||
<mat-label>Teller</mat-label>
|
||||
<input matInput type="text" [value]="tellers[0].name" readonly />
|
||||
</mat-form-field>
|
||||
} @else {
|
||||
<mat-form-field appearance="outline" subscriptSizing="dynamic">
|
||||
<mat-label>Teller</mat-label>
|
||||
<mat-select [value]="selectedTellerId" (selectionChange)="onTellerSelect($event.value)">
|
||||
@for (t of tellers; track t.id) {
|
||||
<mat-option [value]="t.id">{{ t.name }}</mat-option>
|
||||
}
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
}
|
||||
|
||||
<!-- A reconciliation is the cashier's own count of their own drawer: nothing to pick. -->
|
||||
<mat-form-field appearance="outline" subscriptSizing="dynamic">
|
||||
<mat-label>Cashier</mat-label>
|
||||
<mat-select
|
||||
[value]="selectedCashierId"
|
||||
(selectionChange)="onCashierSelect($event.value)"
|
||||
[disabled]="!selectedTellerId"
|
||||
>
|
||||
@for (c of cashiers; track c.id) {
|
||||
<mat-option [value]="c.id">{{ c.label }}</mat-option>
|
||||
}
|
||||
</mat-select>
|
||||
<mat-label>Teller</mat-label>
|
||||
<input matInput type="text" [value]="ownTellerName || '—'" readonly />
|
||||
</mat-form-field>
|
||||
<mat-form-field appearance="outline" subscriptSizing="dynamic">
|
||||
<mat-label>Cashier (You)</mat-label>
|
||||
<input matInput type="text" [value]="cashierName || '—'" readonly />
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field appearance="outline" subscriptSizing="dynamic">
|
||||
|
||||
@@ -12,12 +12,12 @@ import { FormsModule } from '@angular/forms';
|
||||
import { MatIconModule } from '@angular/material/icon';
|
||||
import { MatSnackBar, MatSnackBarModule } from '@angular/material/snack-bar';
|
||||
import { MatFormFieldModule } from '@angular/material/form-field';
|
||||
import { MatSelectModule } from '@angular/material/select';
|
||||
import { MatInputModule } from '@angular/material/input';
|
||||
import { MatTabsModule } from '@angular/material/tabs';
|
||||
import { forkJoin, of } from 'rxjs';
|
||||
import { catchError } from 'rxjs/operators';
|
||||
import { CashierService } from '../cashier.service';
|
||||
import { businessToday } from 'app/core/utils/business-today';
|
||||
|
||||
interface DenomRow {
|
||||
denominationId: number;
|
||||
@@ -57,7 +57,6 @@ interface ReconRecord {
|
||||
MatIconModule,
|
||||
MatSnackBarModule,
|
||||
MatFormFieldModule,
|
||||
MatSelectModule,
|
||||
MatInputModule,
|
||||
MatTabsModule
|
||||
]
|
||||
@@ -66,9 +65,14 @@ export class ReconciliationComponent implements OnInit {
|
||||
private service = inject(CashierService);
|
||||
private snackBar = inject(MatSnackBar);
|
||||
|
||||
/**
|
||||
* A reconciliation is the cashier's own count of their own drawer, so nobody else makes one and there is
|
||||
* no cashier to pick: the screen is fixed to the logged-in cashier. The server refuses anything else.
|
||||
*/
|
||||
ownCashierMissing = false;
|
||||
ownTellerName = '';
|
||||
|
||||
// ── Entry form ──
|
||||
tellers: { id: number; name: string }[] = [];
|
||||
cashiers: { id: number; label: string }[] = [];
|
||||
selectedTellerId: number | null = null;
|
||||
selectedCashierId: number | null = null;
|
||||
cashierName = '';
|
||||
@@ -85,44 +89,30 @@ export class ReconciliationComponent implements OnInit {
|
||||
loadingHistory = false;
|
||||
|
||||
ngOnInit(): void {
|
||||
const d = new Date();
|
||||
const d = businessToday();
|
||||
this.reconDate = `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`;
|
||||
this.service
|
||||
.getTellers()
|
||||
.pipe(catchError(() => of([] as any[])))
|
||||
.subscribe((list) => {
|
||||
this.tellers = (list || []).map((t: any) => ({ id: t.id, name: t.name }));
|
||||
if (this.tellers.length === 1) {
|
||||
this.onTellerSelect(this.tellers[0].id);
|
||||
}
|
||||
});
|
||||
this.lockToOwnCashier();
|
||||
this.loadHistory();
|
||||
}
|
||||
|
||||
onTellerSelect(tellerId: number): void {
|
||||
this.selectedTellerId = tellerId;
|
||||
this.selectedCashierId = null;
|
||||
this.cashierName = '';
|
||||
this.cashiers = [];
|
||||
this.rows = [];
|
||||
if (!tellerId) return;
|
||||
this.service
|
||||
.getCashiersForTeller(tellerId)
|
||||
.pipe(catchError(() => of({ cashiers: [] })))
|
||||
.subscribe((r: any) => {
|
||||
this.cashiers = (r?.cashiers || []).map((c: any) => ({ id: c.id, label: c.staffName }));
|
||||
if (this.cashiers.length === 1) {
|
||||
this.onCashierSelect(this.cashiers[0].id);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
onCashierSelect(cashierId: number): void {
|
||||
this.selectedCashierId = cashierId;
|
||||
const c = this.cashiers.find((x) => x.id === cashierId);
|
||||
this.cashierName = c ? c.label : '';
|
||||
this.rows = [];
|
||||
this.fetchExpected();
|
||||
/** Take the logged-in cashier as the one being reconciled, with their counter for the record. */
|
||||
private lockToOwnCashier(): void {
|
||||
this.service.getCurrentCashierInfo().subscribe((info) => {
|
||||
if (!info) {
|
||||
this.ownCashierMissing = true;
|
||||
return;
|
||||
}
|
||||
this.selectedCashierId = info.cashierId;
|
||||
this.cashierName = info.cashierName;
|
||||
this.service
|
||||
.getInterCashierCashierSummary(info.cashierId, this.reconDate)
|
||||
.pipe(catchError(() => of(null)))
|
||||
.subscribe((r: any) => {
|
||||
this.selectedTellerId = r?.tellerId ?? null;
|
||||
this.ownTellerName = r?.tellerName || '';
|
||||
});
|
||||
this.fetchExpected();
|
||||
});
|
||||
}
|
||||
|
||||
fetchExpected(): void {
|
||||
|
||||
@@ -1,375 +0,0 @@
|
||||
<!--
|
||||
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="pg">
|
||||
<!-- ── HEADER ── -->
|
||||
<header class="pg-head">
|
||||
<div>
|
||||
<div class="pg-eyebrow">CASHIER · SHARE COLLECTION</div>
|
||||
<h1 class="pg-title">Share Collection</h1>
|
||||
<p class="pg-sub">
|
||||
Collect cash from member for share purchase — amounts are held in Sundry GL until the account is activated.
|
||||
</p>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<!-- ── SEARCH BAR ── -->
|
||||
@if (pageState !== 'success') {
|
||||
<div class="sc-search-bar">
|
||||
<div class="sc-search-bar__input-wrap">
|
||||
<mat-icon class="sc-search-bar__icon">search</mat-icon>
|
||||
<input
|
||||
class="sc-search-bar__input"
|
||||
type="text"
|
||||
placeholder="Enter Share Account ID or Account No."
|
||||
[(ngModel)]="accountInput"
|
||||
(keyup.enter)="searchAccount()"
|
||||
/>
|
||||
</div>
|
||||
<button
|
||||
type="button"
|
||||
class="pg-btn pg-btn--primary"
|
||||
[disabled]="pageState === 'searching' || !accountInput.trim()"
|
||||
(click)="searchAccount()"
|
||||
>
|
||||
<mat-icon>manage_search</mat-icon>
|
||||
{{ pageState === 'searching' ? 'Searching…' : 'Search' }}
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
|
||||
<!-- ── ERROR ── -->
|
||||
@if (errorMsg) {
|
||||
<div class="sc-alert sc-alert--error">
|
||||
<mat-icon>error_outline</mat-icon>
|
||||
<span>{{ errorMsg }}</span>
|
||||
</div>
|
||||
}
|
||||
|
||||
<!-- ── SEARCHING SPINNER ── -->
|
||||
@if (pageState === 'searching') {
|
||||
<div class="pg-empty">
|
||||
<mat-icon class="sc-spin">hourglass_empty</mat-icon>
|
||||
<p>Looking up account…</p>
|
||||
</div>
|
||||
}
|
||||
|
||||
<!-- ── ACCOUNT LOADED ── -->
|
||||
@if (pageState === 'loaded') {
|
||||
<!-- Member Card -->
|
||||
<div class="sc-member-card">
|
||||
<div class="sc-member-card__avatar">
|
||||
<mat-icon>person</mat-icon>
|
||||
</div>
|
||||
<div class="sc-member-card__info">
|
||||
<div class="sc-member-card__name">{{ account.clientName }}</div>
|
||||
<div class="sc-member-card__meta">
|
||||
<span class="sc-badge sc-badge--account">{{ account.accountNo }}</span>
|
||||
<span class="sc-badge sc-badge--product">{{ account.productName }}</span>
|
||||
<span
|
||||
class="sc-badge"
|
||||
[class.sc-badge--pending]="account.status?.code?.includes('pending')"
|
||||
[class.sc-badge--active]="account.status?.code?.includes('active')"
|
||||
>{{ account.status?.value }}</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Editable Shares + Price -->
|
||||
<div class="sc-member-card__shares">
|
||||
<div class="sc-shares-inputs">
|
||||
<div class="sc-shares-field">
|
||||
<label class="sc-shares-label">No. of Shares</label>
|
||||
<input
|
||||
class="sc-shares-input"
|
||||
type="number"
|
||||
min="0"
|
||||
[(ngModel)]="requestedSharesInput"
|
||||
(input)="recalc()"
|
||||
placeholder="0"
|
||||
/>
|
||||
</div>
|
||||
<div class="sc-shares-sep">×</div>
|
||||
<div class="sc-shares-field">
|
||||
<label class="sc-shares-label">Price / Share (₹)</label>
|
||||
<input
|
||||
class="sc-shares-input"
|
||||
type="number"
|
||||
min="0"
|
||||
[(ngModel)]="pricePerShare"
|
||||
(input)="recalc()"
|
||||
placeholder="0.00"
|
||||
/>
|
||||
</div>
|
||||
<div class="sc-shares-sep">=</div>
|
||||
<div class="sc-shares-result">
|
||||
<div class="sc-shares-label">Share Amount</div>
|
||||
<div class="sc-shares-total">{{ currencySymbol }}{{ shareAmount | number: '1.2-2' }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Amount Breakdown + GL Preview -->
|
||||
<div class="sc-split">
|
||||
<!-- LEFT: Amount Breakdown -->
|
||||
<div class="pg-card sc-breakdown">
|
||||
<div class="sc-breakdown__header">
|
||||
<mat-icon>receipt_long</mat-icon>
|
||||
<span>Amount Breakdown</span>
|
||||
</div>
|
||||
<table class="pg-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Description</th>
|
||||
<th class="num">Amount</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
Share Amount
|
||||
<span class="sc-dim">
|
||||
({{ requestedSharesInput }} shares × {{ currencySymbol }}{{ pricePerShare | number: '1.2-2' }})
|
||||
</span>
|
||||
</td>
|
||||
<td class="num">{{ currencySymbol }}{{ shareAmount | number: '1.2-2' }}</td>
|
||||
</tr>
|
||||
@for (charge of charges; track charge.id) {
|
||||
<tr>
|
||||
<td>{{ charge.name }}</td>
|
||||
<td class="num sc-charge-amount">
|
||||
<input class="sc-charge-input" type="number" min="0" [(ngModel)]="charge.amount" (input)="recalc()" />
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
@if (charges.length === 0) {
|
||||
<tr>
|
||||
<td colspan="2">
|
||||
<span class="sc-dim">No charges applicable</span>
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr class="sc-total-row">
|
||||
<td><strong>Total Payable</strong></td>
|
||||
<td class="num sc-total-amount">
|
||||
<strong>{{ currencySymbol }}{{ totalAmount | number: '1.2-2' }}</strong>
|
||||
</td>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<!-- RIGHT: GL Preview -->
|
||||
<div class="pg-card sc-gl-preview">
|
||||
<div class="sc-breakdown__header">
|
||||
<mat-icon>account_tree</mat-icon>
|
||||
<span>GL Entries Preview</span>
|
||||
</div>
|
||||
<table class="pg-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Account</th>
|
||||
<th>Dr / Cr</th>
|
||||
<th class="num">Amount</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr class="gl-row--dr">
|
||||
<td class="gl-acname">Cash Vault GL</td>
|
||||
<td><span class="sc-dr-badge">Dr</span></td>
|
||||
<td class="num gl-amt--dr">{{ currencySymbol }}{{ totalAmount | number: '1.2-2' }}</td>
|
||||
</tr>
|
||||
<tr class="gl-row--cr">
|
||||
<td class="gl-acname">Share Sundry GL</td>
|
||||
<td><span class="sc-cr-badge">Cr</span></td>
|
||||
<td class="num gl-amt--cr">{{ currencySymbol }}{{ shareAmount | number: '1.2-2' }}</td>
|
||||
</tr>
|
||||
@if (totalChargeAmount > 0) {
|
||||
<tr class="gl-row--cr">
|
||||
<td class="gl-acname">Charge Receivable GL</td>
|
||||
<td><span class="sc-cr-badge">Cr</span></td>
|
||||
<td class="num gl-amt--cr">{{ currencySymbol }}{{ totalChargeAmount | number: '1.2-2' }}</td>
|
||||
</tr>
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
<div class="sc-gl-note">
|
||||
<mat-icon>info_outline</mat-icon>
|
||||
Funds move to Share GL & Income GL when account is <strong>activated</strong>.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ── DENOMINATION (Cash Only) ── -->
|
||||
@if (isCashPayment && allDenominations.length > 0) {
|
||||
<div class="pg-card sc-denom">
|
||||
<div class="sc-breakdown__header">
|
||||
<mat-icon>payments</mat-icon>
|
||||
<span>Denomination Entry</span>
|
||||
@if (denominationTotal > 0) {
|
||||
<span
|
||||
class="sc-denom-badge"
|
||||
[class.sc-denom-badge--match]="denomMatchesTotal"
|
||||
[class.sc-denom-badge--mismatch]="!denomMatchesTotal"
|
||||
>
|
||||
₹{{ denominationTotal | number: '1.2-2' }}
|
||||
{{ denomMatchesTotal ? '✓ Matches' : '≠ Mismatch' }}
|
||||
</span>
|
||||
}
|
||||
@if (denominationTotal === 0) {
|
||||
<span class="sc-denom-required">⚠ Required for Cash</span>
|
||||
}
|
||||
</div>
|
||||
<div class="sc-denom-body">
|
||||
<table class="pg-table sc-denom-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Denomination</th>
|
||||
<th class="num">Count</th>
|
||||
<th class="num">Amount</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@for (d of allDenominations; track d.id) {
|
||||
<tr>
|
||||
<td>
|
||||
<span class="sc-denom-chip" [class.sc-denom-chip--coin]="d.kind === 'coin'">{{ d.label }}</span>
|
||||
</td>
|
||||
<td class="num">
|
||||
<div class="sc-denom-stepper">
|
||||
<button type="button" (click)="bumpDenom(d, -1)" [disabled]="countFor(d) === 0">−</button>
|
||||
<input
|
||||
type="number"
|
||||
min="0"
|
||||
[value]="countFor(d) || ''"
|
||||
placeholder="0"
|
||||
(input)="onDenomChange(d, $any($event.target).value)"
|
||||
/>
|
||||
<button type="button" (click)="bumpDenom(d, 1)">+</button>
|
||||
</div>
|
||||
</td>
|
||||
<td class="num">{{ subtotalFor(d) > 0 ? (subtotalFor(d) | number: '1.2-2') : '—' }}</td>
|
||||
</tr>
|
||||
}
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr>
|
||||
<td><strong>Total</strong></td>
|
||||
<td></td>
|
||||
<td class="num">
|
||||
<strong>₹{{ denominationTotal | number: '1.2-2' }}</strong>
|
||||
</td>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
@if (!denomMatchesTotal && denominationTotal > 0) {
|
||||
<div class="sc-denom-mismatch">
|
||||
<mat-icon>warning</mat-icon>
|
||||
Denomination ₹{{ denominationTotal | number: '1.2-2' }} must equal Total Payable ₹{{
|
||||
totalAmount | number: '1.2-2'
|
||||
}}.
|
||||
</div>
|
||||
}
|
||||
@if (denominationTotal > 0) {
|
||||
<div class="sc-denom-actions">
|
||||
<button type="button" class="pg-btn pg-btn--ghost" (click)="clearDenominations()">
|
||||
<mat-icon>clear</mat-icon> Clear
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
<!-- Transaction Details -->
|
||||
<div class="pg-toolbar pg-toolbar--mat">
|
||||
<mat-form-field appearance="outline" subscriptSizing="dynamic">
|
||||
<mat-label>Transaction Date *</mat-label>
|
||||
<input matInput type="date" [(ngModel)]="transactionDate" />
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field appearance="outline" subscriptSizing="dynamic">
|
||||
<mat-label>Payment Mode</mat-label>
|
||||
<mat-select [(ngModel)]="paymentTypeId">
|
||||
<mat-option [value]="null">— Cash (Default) —</mat-option>
|
||||
@for (pt of paymentTypes; track pt.id) {
|
||||
<mat-option [value]="pt.id">{{ pt.name }}</mat-option>
|
||||
}
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field appearance="outline" subscriptSizing="dynamic" class="pg-note-field">
|
||||
<mat-label>Note (Optional)</mat-label>
|
||||
<input matInput type="text" [(ngModel)]="note" placeholder="e.g. Share purchase for 100 shares" />
|
||||
</mat-form-field>
|
||||
</div>
|
||||
|
||||
<!-- Footer Submit Bar -->
|
||||
<div class="pg-total-bar sc-footer">
|
||||
<div class="sc-footer__summary">
|
||||
<span class="sc-footer__label">Total to Collect</span>
|
||||
<span class="sc-footer__amount">{{ currencySymbol }}{{ totalAmount | number: '1.2-2' }}</span>
|
||||
</div>
|
||||
<div class="sc-footer__actions">
|
||||
<button type="button" class="pg-btn pg-btn--ghost" (click)="reset()"><mat-icon>close</mat-icon> Cancel</button>
|
||||
<button type="button" class="pg-btn pg-btn--primary" [disabled]="!isValid || saving" (click)="submit()">
|
||||
<mat-icon>payments</mat-icon>
|
||||
{{ saving ? 'Posting…' : 'Collect & Post' }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
<!-- ── SUCCESS ── -->
|
||||
@if (pageState === 'success' && collectionResult) {
|
||||
<div class="sc-success">
|
||||
<div class="sc-success__icon-wrap">
|
||||
<mat-icon>check_circle</mat-icon>
|
||||
</div>
|
||||
<h2 class="sc-success__title">Collection Posted Successfully</h2>
|
||||
<p class="sc-success__sub">
|
||||
Cash of
|
||||
<strong>{{ collectionResult.currencyCode }} {{ collectionResult.totalAmount | number: '1.2-2' }}</strong>
|
||||
collected from <strong>{{ collectionResult.clientName }}</strong> on
|
||||
<strong>{{ collectionResult.collectionDate }}</strong> by <strong>{{ collectionResult.collectedBy }}</strong
|
||||
>.
|
||||
</p>
|
||||
|
||||
<!-- Transaction reference -->
|
||||
<div class="sc-success__ref">
|
||||
<span class="sc-success__ref-label">Transaction ID</span>
|
||||
<span class="sc-success__ref-val">{{ collectionResult.transactionId }}</span>
|
||||
</div>
|
||||
|
||||
<!-- GL entries from backend -->
|
||||
<div class="sc-success__gl">
|
||||
@for (entry of collectionResult.glEntries; track entry.account) {
|
||||
<div
|
||||
class="sc-success__gl-row"
|
||||
[class.sc-success__gl-row--dr]="entry.type === 'Dr'"
|
||||
[class.sc-success__gl-row--cr]="entry.type === 'Cr'"
|
||||
>
|
||||
<span>{{ entry.type }}. {{ entry.account }}</span>
|
||||
<span>{{ entry.currency }} {{ entry.amount | number: '1.2-2' }}</span>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
|
||||
<p class="sc-success__note">
|
||||
Funds are held in Sundry GL. They will move to Share Equity GL when the account is activated.
|
||||
</p>
|
||||
|
||||
<button type="button" class="pg-btn pg-btn--primary" (click)="reset()">
|
||||
<mat-icon>add</mat-icon> New Collection
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
@@ -1,701 +0,0 @@
|
||||
/**
|
||||
* 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/.
|
||||
*/
|
||||
|
||||
// ── Search Bar ───────────────────────────────────────────────────────────────
|
||||
|
||||
.sc-search-bar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
background: #fff;
|
||||
border: 1px solid #e2e8f0;
|
||||
border-radius: 12px;
|
||||
padding: 10px 14px;
|
||||
|
||||
&__input-wrap {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
|
||||
&__icon {
|
||||
color: #94a3b8;
|
||||
font-size: 20px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
&__input {
|
||||
flex: 1 1 auto;
|
||||
border: none;
|
||||
outline: none;
|
||||
font-size: 14px;
|
||||
font-family: inherit;
|
||||
color: #0d1b2a;
|
||||
background: transparent;
|
||||
|
||||
&::placeholder {
|
||||
color: #94a3b8;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// ── Alert ────────────────────────────────────────────────────────────────────
|
||||
|
||||
.sc-alert {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
padding: 12px 16px;
|
||||
border-radius: 10px;
|
||||
font-size: 13px;
|
||||
font-weight: 500;
|
||||
|
||||
mat-icon {
|
||||
font-size: 20px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
&--error {
|
||||
background: #fef2f2;
|
||||
border: 1px solid #fecaca;
|
||||
color: #dc2626;
|
||||
}
|
||||
}
|
||||
|
||||
// ── Spinner ──────────────────────────────────────────────────────────────────
|
||||
|
||||
.sc-spin {
|
||||
animation: sc-spin 1.2s linear infinite;
|
||||
display: block;
|
||||
margin: 0 auto 8px;
|
||||
font-size: 32px !important;
|
||||
width: 32px !important;
|
||||
height: 32px !important;
|
||||
color: #94a3b8;
|
||||
}
|
||||
|
||||
@keyframes sc-spin {
|
||||
from {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
|
||||
to {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
||||
// ── Member Card ──────────────────────────────────────────────────────────────
|
||||
|
||||
.sc-member-card {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
background: #fff;
|
||||
border: 1px solid #e2e8f0;
|
||||
border-radius: 12px;
|
||||
padding: 16px 20px;
|
||||
|
||||
&__avatar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
border-radius: 50%;
|
||||
background: #eff6ff;
|
||||
flex-shrink: 0;
|
||||
|
||||
mat-icon {
|
||||
color: #2563eb;
|
||||
font-size: 24px;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
&__info {
|
||||
flex: 1 1 auto;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
&__name {
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
color: #1e293b;
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
&__meta {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
&__shares {
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
// ── Badges ───────────────────────────────────────────────────────────────────
|
||||
|
||||
.sc-badge {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
height: 22px;
|
||||
padding: 0 8px;
|
||||
border-radius: 5px;
|
||||
font-size: 11px;
|
||||
font-weight: 700;
|
||||
background: #f1f5f9;
|
||||
color: #475569;
|
||||
border: 1px solid #e2e8f0;
|
||||
|
||||
&--account {
|
||||
background: #eff6ff;
|
||||
color: #1d4ed8;
|
||||
border-color: #bfdbfe;
|
||||
font-family: 'Roboto Mono', monospace;
|
||||
}
|
||||
|
||||
&--product {
|
||||
background: #f0fdf4;
|
||||
color: #15803d;
|
||||
border-color: #bbf7d0;
|
||||
}
|
||||
|
||||
&--pending {
|
||||
background: #fffbeb;
|
||||
color: #d97706;
|
||||
border-color: #fde68a;
|
||||
}
|
||||
|
||||
&--active {
|
||||
background: #f0fdf4;
|
||||
color: #15803d;
|
||||
border-color: #bbf7d0;
|
||||
}
|
||||
}
|
||||
|
||||
// ── Editable Share Inputs ────────────────────────────────────────────────────
|
||||
|
||||
.sc-shares-inputs {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
flex-wrap: wrap;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.sc-shares-field {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 3px;
|
||||
}
|
||||
|
||||
.sc-shares-label {
|
||||
font-size: 10px;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.07em;
|
||||
color: #94a3b8;
|
||||
}
|
||||
|
||||
.sc-shares-input {
|
||||
width: 110px;
|
||||
height: 38px;
|
||||
border: 1.5px solid #e2e8f0;
|
||||
border-radius: 8px;
|
||||
padding: 0 10px;
|
||||
font-size: 14px;
|
||||
font-weight: 700;
|
||||
font-family: inherit;
|
||||
color: #1353a0;
|
||||
text-align: right;
|
||||
outline: none;
|
||||
background: #f8fafc;
|
||||
transition: border-color 0.15s;
|
||||
|
||||
&:focus {
|
||||
border-color: #1353a0;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
&::-webkit-outer-spin-button,
|
||||
&::-webkit-inner-spin-button {
|
||||
appearance: none;
|
||||
}
|
||||
}
|
||||
|
||||
.sc-shares-sep {
|
||||
font-size: 20px;
|
||||
font-weight: 300;
|
||||
color: #94a3b8;
|
||||
padding-top: 16px;
|
||||
}
|
||||
|
||||
.sc-shares-result {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.sc-shares-total {
|
||||
font-size: 20px;
|
||||
font-weight: 800;
|
||||
color: #0f4f3c;
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
|
||||
// ── Editable Charge Amount ───────────────────────────────────────────────────
|
||||
|
||||
.sc-charge-amount {
|
||||
padding: 4px 14px !important;
|
||||
}
|
||||
|
||||
.sc-charge-input {
|
||||
width: 100px;
|
||||
height: 32px;
|
||||
border: 1.5px solid #e2e8f0;
|
||||
border-radius: 6px;
|
||||
padding: 0 8px;
|
||||
font-size: 13px;
|
||||
font-weight: 700;
|
||||
font-family: inherit;
|
||||
color: #1353a0;
|
||||
text-align: right;
|
||||
outline: none;
|
||||
background: #f8fafc;
|
||||
transition: border-color 0.15s;
|
||||
|
||||
&:focus {
|
||||
border-color: #1353a0;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
&::-webkit-outer-spin-button,
|
||||
&::-webkit-inner-spin-button {
|
||||
appearance: none;
|
||||
}
|
||||
}
|
||||
|
||||
// ── Split Layout ─────────────────────────────────────────────────────────────
|
||||
|
||||
.sc-split {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 16px;
|
||||
|
||||
@media (width <= 900px) {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
// ── Breakdown Card ───────────────────────────────────────────────────────────
|
||||
|
||||
.sc-breakdown {
|
||||
&__header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding: 12px 16px;
|
||||
background: #f8fafc;
|
||||
border-bottom: 1px solid #e2e8f0;
|
||||
font-size: 13px;
|
||||
font-weight: 700;
|
||||
color: #334155;
|
||||
|
||||
mat-icon {
|
||||
font-size: 18px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
color: #0f4f3c;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sc-gl-preview {
|
||||
.sc-breakdown__header {
|
||||
mat-icon {
|
||||
color: #1d4ed8;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sc-gl-note {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 6px;
|
||||
padding: 10px 14px;
|
||||
font-size: 12px;
|
||||
color: #64748b;
|
||||
background: #f8fafc;
|
||||
border-top: 1px solid #e2e8f0;
|
||||
|
||||
mat-icon {
|
||||
font-size: 16px;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
flex-shrink: 0;
|
||||
margin-top: 1px;
|
||||
color: #94a3b8;
|
||||
}
|
||||
}
|
||||
|
||||
// ── Table helpers ────────────────────────────────────────────────────────────
|
||||
|
||||
.sc-dim {
|
||||
color: #94a3b8;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.sc-total-row td {
|
||||
background: #f8fafc;
|
||||
border-top: 2px solid #e2e8f0;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.sc-total-amount {
|
||||
color: #0f4f3c;
|
||||
}
|
||||
|
||||
// ── Dr / Cr badges ───────────────────────────────────────────────────────────
|
||||
|
||||
.sc-dr-badge,
|
||||
.sc-cr-badge {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 32px;
|
||||
height: 20px;
|
||||
border-radius: 4px;
|
||||
font-size: 11px;
|
||||
font-weight: 800;
|
||||
letter-spacing: 0.04em;
|
||||
}
|
||||
|
||||
.sc-dr-badge {
|
||||
background: #fef2f2;
|
||||
color: #dc2626;
|
||||
border: 1px solid #fecaca;
|
||||
}
|
||||
|
||||
.sc-cr-badge {
|
||||
background: #f0fdf4;
|
||||
color: #15803d;
|
||||
border: 1px solid #bbf7d0;
|
||||
}
|
||||
|
||||
// ── Footer ───────────────────────────────────────────────────────────────────
|
||||
|
||||
.sc-footer {
|
||||
justify-content: space-between !important;
|
||||
|
||||
&__summary {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 2px;
|
||||
}
|
||||
|
||||
&__label {
|
||||
font-size: 11px;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.07em;
|
||||
color: #64748b;
|
||||
}
|
||||
|
||||
&__amount {
|
||||
font-size: 22px;
|
||||
font-weight: 800;
|
||||
color: #0f4f3c;
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
|
||||
&__actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
// ── Denomination Panel ────────────────────────────────────────────────────────
|
||||
|
||||
.sc-denom {
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.sc-denom-body {
|
||||
padding: 14px 16px;
|
||||
}
|
||||
|
||||
.sc-denom-table {
|
||||
width: 100%;
|
||||
|
||||
th,
|
||||
td {
|
||||
padding: 7px 10px;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
tfoot td {
|
||||
border-top: 2px solid #e2e8f0;
|
||||
background: #f8fafc;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
|
||||
.sc-denom-chip {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
height: 24px;
|
||||
padding: 0 10px;
|
||||
border-radius: 5px;
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
background: #eff6ff;
|
||||
color: #1d4ed8;
|
||||
border: 1px solid #bfdbfe;
|
||||
|
||||
&--coin {
|
||||
background: #fffbeb;
|
||||
color: #d97706;
|
||||
border-color: #fde68a;
|
||||
}
|
||||
}
|
||||
|
||||
.sc-denom-stepper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
justify-content: flex-end;
|
||||
|
||||
button {
|
||||
width: 26px;
|
||||
height: 26px;
|
||||
border: 1.5px solid #e2e8f0;
|
||||
border-radius: 5px;
|
||||
background: #f8fafc;
|
||||
color: #475569;
|
||||
font-size: 16px;
|
||||
line-height: 1;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0;
|
||||
|
||||
&:hover:not(:disabled) {
|
||||
background: #e0f2fe;
|
||||
border-color: #7dd3fc;
|
||||
color: #0369a1;
|
||||
}
|
||||
|
||||
&:disabled {
|
||||
opacity: 0.35;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
}
|
||||
|
||||
input {
|
||||
width: 62px;
|
||||
height: 28px;
|
||||
border: 1.5px solid #e2e8f0;
|
||||
border-radius: 6px;
|
||||
padding: 0 6px;
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
font-family: inherit;
|
||||
text-align: right;
|
||||
outline: none;
|
||||
background: #fff;
|
||||
|
||||
&:focus {
|
||||
border-color: #1353a0;
|
||||
}
|
||||
|
||||
&::-webkit-outer-spin-button,
|
||||
&::-webkit-inner-spin-button {
|
||||
appearance: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sc-denom-badge {
|
||||
margin-left: auto;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
height: 22px;
|
||||
padding: 0 10px;
|
||||
border-radius: 5px;
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
|
||||
&--match {
|
||||
background: #f0fdf4;
|
||||
color: #15803d;
|
||||
border: 1px solid #bbf7d0;
|
||||
}
|
||||
|
||||
&--mismatch {
|
||||
background: #fef2f2;
|
||||
color: #dc2626;
|
||||
border: 1px solid #fecaca;
|
||||
}
|
||||
}
|
||||
|
||||
.sc-denom-required {
|
||||
margin-left: auto;
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
color: #d97706;
|
||||
}
|
||||
|
||||
.sc-denom-mismatch {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
margin-top: 10px;
|
||||
padding: 9px 12px;
|
||||
background: #fef2f2;
|
||||
border: 1px solid #fecaca;
|
||||
border-radius: 8px;
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
color: #dc2626;
|
||||
|
||||
mat-icon {
|
||||
font-size: 16px;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.sc-denom-actions {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
// ── Success ──────────────────────────────────────────────────────────────────
|
||||
|
||||
.sc-success {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
padding: 40px 24px;
|
||||
gap: 16px;
|
||||
background: #fff;
|
||||
border: 1px solid #e2e8f0;
|
||||
border-radius: 16px;
|
||||
|
||||
&__icon-wrap {
|
||||
width: 72px;
|
||||
height: 72px;
|
||||
border-radius: 50%;
|
||||
background: #f0fdf4;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
mat-icon {
|
||||
font-size: 40px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
color: #16a34a;
|
||||
}
|
||||
}
|
||||
|
||||
&__title {
|
||||
font-size: 22px;
|
||||
font-weight: 700;
|
||||
color: #1e293b;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
&__sub {
|
||||
font-size: 14px;
|
||||
color: #64748b;
|
||||
max-width: 480px;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
&__ref {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
background: #f1f5f9;
|
||||
border: 1px solid #e2e8f0;
|
||||
border-radius: 8px;
|
||||
padding: 8px 16px;
|
||||
}
|
||||
|
||||
&__ref-label {
|
||||
font-size: 11px;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.07em;
|
||||
color: #94a3b8;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
&__ref-val {
|
||||
font-family: 'Roboto Mono', 'Courier New', monospace;
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
color: #1353a0;
|
||||
}
|
||||
|
||||
&__note {
|
||||
font-size: 12px;
|
||||
color: #94a3b8;
|
||||
max-width: 420px;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
&__gl {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 6px;
|
||||
width: 100%;
|
||||
max-width: 400px;
|
||||
background: #f8fafc;
|
||||
border: 1px solid #e2e8f0;
|
||||
border-radius: 10px;
|
||||
padding: 14px 16px;
|
||||
}
|
||||
|
||||
&__gl-row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
padding: 4px 0;
|
||||
border-bottom: 1px dotted #e2e8f0;
|
||||
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
&--dr {
|
||||
color: #dc2626;
|
||||
}
|
||||
|
||||
&--cr {
|
||||
color: #15803d;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,282 +0,0 @@
|
||||
/**
|
||||
* 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, OnInit, inject } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
import { RouterModule } from '@angular/router';
|
||||
import { MatIconModule } from '@angular/material/icon';
|
||||
import { MatSnackBar, MatSnackBarModule } from '@angular/material/snack-bar';
|
||||
import { MatFormFieldModule } from '@angular/material/form-field';
|
||||
import { MatSelectModule } from '@angular/material/select';
|
||||
import { MatInputModule } from '@angular/material/input';
|
||||
import { catchError } from 'rxjs/operators';
|
||||
import { of } from 'rxjs';
|
||||
import { CashierService } from '../cashier.service';
|
||||
|
||||
type PageState = 'idle' | 'searching' | 'loaded' | 'submitting' | 'success';
|
||||
|
||||
interface Denomination {
|
||||
id: number;
|
||||
value: number;
|
||||
kind: 'note' | 'coin';
|
||||
label: string;
|
||||
}
|
||||
|
||||
interface ShareCharge {
|
||||
id: number;
|
||||
name: string;
|
||||
amount: number;
|
||||
currencySymbol: string;
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'mifosx-share-collection',
|
||||
templateUrl: './share-collection.component.html',
|
||||
styleUrls: [
|
||||
'../cashier-shared.scss',
|
||||
'./share-collection.component.scss'
|
||||
],
|
||||
standalone: true,
|
||||
imports: [
|
||||
CommonModule,
|
||||
FormsModule,
|
||||
RouterModule,
|
||||
MatIconModule,
|
||||
MatSnackBarModule,
|
||||
MatFormFieldModule,
|
||||
MatSelectModule,
|
||||
MatInputModule
|
||||
]
|
||||
})
|
||||
export class ShareCollectionComponent implements OnInit {
|
||||
private service = inject(CashierService);
|
||||
private snackBar = inject(MatSnackBar);
|
||||
|
||||
pageState: PageState = 'idle';
|
||||
accountInput = '';
|
||||
transactionDate = '';
|
||||
paymentTypeId: number | null = null;
|
||||
paymentTypes: any[] = [];
|
||||
note = '';
|
||||
errorMsg = '';
|
||||
saving = false;
|
||||
|
||||
account: any = null;
|
||||
charges: ShareCharge[] = [];
|
||||
collectionResult: any = null; // filled after successful POST
|
||||
|
||||
// Editable fields — cashier can override if API returns 0
|
||||
requestedSharesInput = 0;
|
||||
pricePerShare = 0;
|
||||
|
||||
// ── Denomination ────────────────────────────────────────────────────────────
|
||||
notes: Denomination[] = [];
|
||||
coins: Denomination[] = [];
|
||||
denominationCounts: Record<string, number> = {};
|
||||
|
||||
get shareAmount(): number {
|
||||
return this.requestedSharesInput * this.pricePerShare;
|
||||
}
|
||||
|
||||
get totalChargeAmount(): number {
|
||||
return this.charges.reduce((s, c) => s + c.amount, 0);
|
||||
}
|
||||
|
||||
get totalAmount(): number {
|
||||
return this.shareAmount + this.totalChargeAmount;
|
||||
}
|
||||
|
||||
get currencySymbol(): string {
|
||||
return this.account?.currency?.displaySymbol ?? '₹';
|
||||
}
|
||||
|
||||
get isCashPayment(): boolean {
|
||||
if (this.paymentTypeId === null) return true;
|
||||
const pt = this.paymentTypes.find((p: any) => p.id === this.paymentTypeId);
|
||||
return !!pt?.isCashPayment;
|
||||
}
|
||||
|
||||
get allDenominations(): Denomination[] {
|
||||
const desc = (a: Denomination, b: Denomination) => b.value - a.value;
|
||||
return [
|
||||
...[...this.notes].sort(desc),
|
||||
...[...this.coins].sort(desc)
|
||||
];
|
||||
}
|
||||
|
||||
get denominationTotal(): number {
|
||||
return this.allDenominations.reduce((s, d) => s + this.subtotalFor(d), 0);
|
||||
}
|
||||
|
||||
get denomMatchesTotal(): boolean {
|
||||
return this.denominationTotal === this.totalAmount;
|
||||
}
|
||||
|
||||
get isValid(): boolean {
|
||||
if (!this.account || this.totalAmount <= 0 || !this.transactionDate) return false;
|
||||
if (this.isCashPayment && this.allDenominations.length > 0) {
|
||||
return this.denomMatchesTotal;
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
||||
ngOnInit(): void {
|
||||
const d = new Date();
|
||||
this.transactionDate = `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`;
|
||||
this.service
|
||||
.getPaymentTypes()
|
||||
.pipe(catchError(() => of([])))
|
||||
.subscribe((types: any[]) => (this.paymentTypes = types || []));
|
||||
this.loadDenominations();
|
||||
}
|
||||
|
||||
private loadDenominations(): void {
|
||||
this.service
|
||||
.getActiveDenominations()
|
||||
.pipe(catchError(() => of([])))
|
||||
.subscribe((list: any[]) => {
|
||||
const rows: Denomination[] = (list || []).map((d: any) => ({
|
||||
id: d.id,
|
||||
value: d.denomination ?? d.value,
|
||||
kind: d.type === 'coin' ? 'coin' : 'note',
|
||||
label: '₹' + (d.denomination ?? d.value)
|
||||
}));
|
||||
const order = (a: Denomination, b: Denomination) => b.value - a.value;
|
||||
this.notes = rows.filter((r) => r.kind === 'note').sort(order);
|
||||
this.coins = rows.filter((r) => r.kind === 'coin').sort(order);
|
||||
});
|
||||
}
|
||||
|
||||
// ── Denomination helpers ──────────────────────────────────────────────────
|
||||
|
||||
denomKey(d: Denomination): string {
|
||||
return `${d.kind}:${d.value}`;
|
||||
}
|
||||
|
||||
countFor(d: Denomination): number {
|
||||
return this.denominationCounts[this.denomKey(d)] || 0;
|
||||
}
|
||||
|
||||
subtotalFor(d: Denomination): number {
|
||||
return this.countFor(d) * d.value;
|
||||
}
|
||||
|
||||
onDenomChange(d: Denomination, raw: any): void {
|
||||
this.denominationCounts[this.denomKey(d)] = Math.max(0, Math.floor(Number(raw) || 0));
|
||||
}
|
||||
|
||||
bumpDenom(d: Denomination, delta: number): void {
|
||||
this.denominationCounts[this.denomKey(d)] = Math.max(0, this.countFor(d) + delta);
|
||||
}
|
||||
|
||||
clearDenominations(): void {
|
||||
this.denominationCounts = {};
|
||||
}
|
||||
|
||||
searchAccount(): void {
|
||||
const query = this.accountInput.trim();
|
||||
if (!query) return;
|
||||
this.pageState = 'searching';
|
||||
this.account = null;
|
||||
this.charges = [];
|
||||
this.errorMsg = '';
|
||||
|
||||
this.service
|
||||
.getShareAccountForCollection(query)
|
||||
.pipe(
|
||||
catchError((err) => {
|
||||
this.errorMsg =
|
||||
err?.error?.errors?.[0]?.defaultUserMessage ||
|
||||
err?.error?.developerMessage ||
|
||||
'Account not found. Please check the account ID and try again.';
|
||||
this.pageState = 'idle';
|
||||
return of(null);
|
||||
})
|
||||
)
|
||||
.subscribe((acc: any) => {
|
||||
if (!acc) return;
|
||||
this.account = acc;
|
||||
|
||||
// Auto-detect shares from summary or first pending purchasedShares entry
|
||||
const pendingTx = (acc.purchasedShares || []).find(
|
||||
(t: any) =>
|
||||
t.status?.code === 'purchasedSharesStatusType.applied' && t.type?.code === 'purchasedSharesType.purchased'
|
||||
);
|
||||
this.requestedSharesInput = Number(
|
||||
acc.summary?.totalPendingForApprovalShares || pendingTx?.numberOfShares || acc.requestedShares || 0
|
||||
);
|
||||
this.pricePerShare = Number(pendingTx?.purchasedPrice || acc.currentMarketPrice || acc.unitPrice || 0);
|
||||
|
||||
// Show ALL charges on the account — no type filtering
|
||||
this.charges = (acc.charges || []).map((c: any) => ({
|
||||
id: c.chargeId ?? c.id,
|
||||
name: c.name,
|
||||
amount: Number(c.amount ?? c.amountOutstanding ?? 0),
|
||||
currencySymbol: c.currency?.displaySymbol ?? '₹'
|
||||
}));
|
||||
|
||||
this.pageState = 'loaded';
|
||||
});
|
||||
}
|
||||
|
||||
recalc(): void {
|
||||
// triggered by input changes — nothing extra needed, getters auto-recalculate
|
||||
}
|
||||
|
||||
submit(): void {
|
||||
if (!this.isValid || this.saving) return;
|
||||
this.saving = true;
|
||||
const payload = {
|
||||
shareAccountId: this.account.id,
|
||||
accountNo: this.account.accountNo,
|
||||
clientName: this.account.clientName,
|
||||
transactionDate: this.transactionDate,
|
||||
requestedShares: this.requestedSharesInput,
|
||||
pricePerShare: this.pricePerShare,
|
||||
shareAmount: this.shareAmount,
|
||||
chargeAmount: this.totalChargeAmount,
|
||||
totalAmount: this.totalAmount,
|
||||
paymentTypeId: this.paymentTypeId || null,
|
||||
note: this.note || null
|
||||
};
|
||||
|
||||
this.service.collectSharePayment(payload).subscribe({
|
||||
next: (result: any) => {
|
||||
this.collectionResult = result;
|
||||
this.snackBar.open('Share collection posted successfully.', 'Close', { duration: 3000 });
|
||||
this.pageState = 'success';
|
||||
this.saving = false;
|
||||
},
|
||||
error: (err: any) => {
|
||||
const msg =
|
||||
err?.error?.errors?.[0]?.defaultUserMessage ||
|
||||
err?.error?.developerMessage ||
|
||||
err?.error?.defaultUserMessage ||
|
||||
'Collection failed. Please try again.';
|
||||
this.snackBar.open(msg, 'Close', { duration: 8000 });
|
||||
this.saving = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
reset(): void {
|
||||
this.pageState = 'idle';
|
||||
this.accountInput = '';
|
||||
this.account = null;
|
||||
this.charges = [];
|
||||
this.errorMsg = '';
|
||||
this.note = '';
|
||||
this.paymentTypeId = null;
|
||||
this.requestedSharesInput = 0;
|
||||
this.pricePerShare = 0;
|
||||
this.collectionResult = null;
|
||||
this.saving = false;
|
||||
this.clearDenominations();
|
||||
}
|
||||
}
|
||||
@@ -8,7 +8,7 @@
|
||||
|
||||
import { Component, OnInit, inject } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { FormsModule, ReactiveFormsModule, FormBuilder, FormGroup, Validators } from '@angular/forms';
|
||||
import { FormsModule, ReactiveFormsModule, FormBuilder, FormGroup, FormArray, Validators } from '@angular/forms';
|
||||
import { MatDialogModule, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
|
||||
import { MatFormFieldModule } from '@angular/material/form-field';
|
||||
import { MatInputModule } from '@angular/material/input';
|
||||
@@ -35,6 +35,35 @@ export interface CashierIssueDdDialogData {
|
||||
accountNo?: string;
|
||||
/** The account holder, for the same reason. */
|
||||
accountHolderName?: string;
|
||||
/**
|
||||
* How many drafts this slip raises. Absent or 1 is the ordinary single draft and the dialog is
|
||||
* unchanged; 2 or more turns it into a slip, asking for a face value, charge and beneficiary per
|
||||
* draft and reporting the combined total the account will be debited for.
|
||||
*/
|
||||
ddCount?: number;
|
||||
/**
|
||||
* Whether the funding account is a GL account rather than a member's. Only affects wording: a GL
|
||||
* account has no passbook, so it is not promised one.
|
||||
*/
|
||||
glFunded?: boolean;
|
||||
/**
|
||||
* The leaflets provisionally shown against each line of a slip.
|
||||
*
|
||||
* Only ever indicative. The server allocates the real numbers inside the locked transaction that
|
||||
* submits the slip, so what is shown here is the next-available run at the moment the dialog was
|
||||
* opened — accurate unless another clerk submits first, which is precisely why the numbers cannot
|
||||
* be promised until submit returns them.
|
||||
*/
|
||||
previewDdNumbers?: string[];
|
||||
}
|
||||
|
||||
/** One captured draft on a multi-DD slip. */
|
||||
export interface DdSlipLineResult {
|
||||
beneficiaryName: string;
|
||||
payableAtBranch: string;
|
||||
payableAtCity: string;
|
||||
faceValue: number;
|
||||
chargesAmount: number;
|
||||
}
|
||||
|
||||
@Component({
|
||||
@@ -56,10 +85,20 @@ export interface CashierIssueDdDialogData {
|
||||
<div class="dd-dialog-header__title">
|
||||
<mat-icon class="dd-icon">receipt_long</mat-icon>
|
||||
<div>
|
||||
<h2>{{ isAccountDebit ? 'Account-Debit Demand Draft (DD)' : 'Walk-in Cash Demand Draft (DD)' }}</h2>
|
||||
<h2>
|
||||
@if (isSlip) {
|
||||
Multi-DD Slip · {{ lineCount }} Demand Drafts
|
||||
} @else {
|
||||
{{ isAccountDebit ? 'Account-Debit Demand Draft (DD)' : 'Walk-in Cash Demand Draft (DD)' }}
|
||||
}
|
||||
</h2>
|
||||
<p>
|
||||
Next available DD leaflet auto-selected ·
|
||||
{{ isAccountDebit ? 'Enter beneficiary details' : 'Enter purchaser & beneficiary details' }}
|
||||
@if (isSlip) {
|
||||
One debit funds all {{ lineCount }} drafts · Enter each draft's beneficiary and amount
|
||||
} @else {
|
||||
Next available DD leaflet auto-selected ·
|
||||
{{ isAccountDebit ? 'Enter beneficiary details' : 'Enter purchaser & beneficiary details' }}
|
||||
}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
@@ -69,41 +108,91 @@ export interface CashierIssueDdDialogData {
|
||||
</div>
|
||||
|
||||
<mat-dialog-content class="dd-dialog-body">
|
||||
<!-- Draft & Financials Summary Card -->
|
||||
<div class="dd-summary-card">
|
||||
<!-- The number the customer will actually see printed on the instrument. "Auto-Selected
|
||||
<!--
|
||||
Slip running total.
|
||||
|
||||
A slip's figures are not known until every line is typed — different drafts carry different
|
||||
face values and different charges — so the total the account will be debited for is built
|
||||
up here as the clerk works, rather than shown as a fixed figure up front. Answering "what
|
||||
is this going to cost my member" without it would mean adding the lines by hand.
|
||||
-->
|
||||
@if (isSlip) {
|
||||
<div class="dd-summary-card">
|
||||
<div class="summary-col">
|
||||
<span class="label">Drafts On This Slip</span>
|
||||
<strong class="dd-number-highlight">{{ lineCount }}</strong>
|
||||
<span class="sublabel">{{ data.sponsorBankName || 'Sponsor Bank' }} · {{ data.branchName }}</span>
|
||||
</div>
|
||||
<div class="summary-divider"></div>
|
||||
<div class="summary-col">
|
||||
<span class="label">Total Face Value</span>
|
||||
<strong class="amount">₹{{ slipFaceValue | number: '1.2-2' }}</strong>
|
||||
<span class="sublabel">+ Charges ₹{{ slipCharges | number: '1.2-2' }}</span>
|
||||
</div>
|
||||
<div class="summary-divider"></div>
|
||||
<div class="summary-col">
|
||||
<span class="label">GST ({{ data.gstPercentage }}%)</span>
|
||||
<strong class="amount">₹{{ slipGst | number: '1.2-2' }}</strong>
|
||||
<span class="sublabel">on charges only</span>
|
||||
</div>
|
||||
<div class="summary-divider"></div>
|
||||
<div class="summary-col highlight-col">
|
||||
<span class="label">Total To Debit</span>
|
||||
<strong class="total-amount">₹{{ slipTotal | number: '1.2-2' }}</strong>
|
||||
<span class="sublabel">{{ data.accountNo || 'Account' }} · one debit</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--
|
||||
Said plainly because the numbers on screen are the one thing in this dialog the clerk
|
||||
cannot rely on. They are the next-available run as it stood when the dialog opened; the
|
||||
binding allocation happens inside the submit transaction, so a slip filed after another
|
||||
clerk's gets the following numbers instead.
|
||||
-->
|
||||
<div class="dd-preview-note">
|
||||
<mat-icon>info</mat-icon>
|
||||
<div>
|
||||
DD numbers below are <strong>provisional</strong>. The final numbers are allocated when the slip is
|
||||
submitted and will be confirmed on the receipt.
|
||||
</div>
|
||||
</div>
|
||||
} @else {
|
||||
<!-- Draft & Financials Summary Card -->
|
||||
<div class="dd-summary-card">
|
||||
<!-- The number the customer will actually see printed on the instrument. "Auto-Selected
|
||||
Leaflet" named the stock item rather than the draft, so it was not obvious that this
|
||||
is the DD number being issued. -->
|
||||
<div class="summary-col">
|
||||
<span class="label">DD Number Being Issued</span>
|
||||
<strong class="dd-number-highlight">{{ data.leaflet.ddNumber }}</strong>
|
||||
<span class="sublabel">{{ data.sponsorBankName || 'Sponsor Bank' }} · {{ data.branchName }}</span>
|
||||
<div class="summary-col">
|
||||
<span class="label">DD Number Being Issued</span>
|
||||
<strong class="dd-number-highlight">{{ data.leaflet.ddNumber }}</strong>
|
||||
<span class="sublabel">{{ data.sponsorBankName || 'Sponsor Bank' }} · {{ data.branchName }}</span>
|
||||
</div>
|
||||
<div class="summary-divider"></div>
|
||||
<div class="summary-col">
|
||||
<span class="label">Face Value</span>
|
||||
<strong class="amount">₹{{ data.faceValue | number: '1.2-2' }}</strong>
|
||||
<span class="sublabel">+ Charges ₹{{ data.chargesAmount | number: '1.2-2' }}</span>
|
||||
</div>
|
||||
<div class="summary-divider"></div>
|
||||
<div class="summary-col">
|
||||
<span class="label">GST ({{ data.gstPercentage }}%)</span>
|
||||
<strong class="amount">₹{{ data.gstAmount | number: '1.2-2' }}</strong>
|
||||
<span class="sublabel">on charges only</span>
|
||||
</div>
|
||||
<div class="summary-divider"></div>
|
||||
<div class="summary-col highlight-col">
|
||||
<span class="label">{{ isAccountDebit ? 'Total Debited' : 'Total Cash Collected' }}</span>
|
||||
<strong class="total-amount">₹{{ data.totalCashPayable | number: '1.2-2' }}</strong>
|
||||
<span class="sublabel">
|
||||
@if (isAccountDebit) {
|
||||
{{ data.accountNo || 'Account' }}
|
||||
} @else {
|
||||
Denominations verified
|
||||
}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="summary-divider"></div>
|
||||
<div class="summary-col">
|
||||
<span class="label">Face Value</span>
|
||||
<strong class="amount">₹{{ data.faceValue | number: '1.2-2' }}</strong>
|
||||
<span class="sublabel">+ Charges ₹{{ data.chargesAmount | number: '1.2-2' }}</span>
|
||||
</div>
|
||||
<div class="summary-divider"></div>
|
||||
<div class="summary-col">
|
||||
<span class="label">GST ({{ data.gstPercentage }}%)</span>
|
||||
<strong class="amount">₹{{ data.gstAmount | number: '1.2-2' }}</strong>
|
||||
<span class="sublabel">on charges only</span>
|
||||
</div>
|
||||
<div class="summary-divider"></div>
|
||||
<div class="summary-col highlight-col">
|
||||
<span class="label">{{ isAccountDebit ? 'Total Debited' : 'Total Cash Collected' }}</span>
|
||||
<strong class="total-amount">₹{{ data.totalCashPayable | number: '1.2-2' }}</strong>
|
||||
<span class="sublabel">
|
||||
@if (isAccountDebit) {
|
||||
{{ data.accountNo || 'Account' }}
|
||||
} @else {
|
||||
Denominations verified
|
||||
}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
<!--
|
||||
The account funding the draft, stated before the form.
|
||||
@@ -121,123 +210,237 @@ export interface CashierIssueDdDialogData {
|
||||
· {{ data.accountHolderName }}
|
||||
}
|
||||
<div class="dd-funding-sub">
|
||||
₹{{ data.totalCashPayable | number: '1.2-2' }} will be debited from this account when a checker
|
||||
approves. No cash is taken at the counter.
|
||||
@if (isSlip) {
|
||||
₹{{ slipTotal | number: '1.2-2' }} will be debited from this account as a
|
||||
<strong>single transaction</strong> covering all {{ lineCount }} drafts, when a checker approves the
|
||||
slip —
|
||||
<!-- A GL account has no passbook, so the reassurance a member gets is phrased for
|
||||
the ledger instead of promising a statement line that does not exist. -->
|
||||
@if (isGlFunded) {
|
||||
one journal entry against this GL account, not {{ lineCount }}.
|
||||
} @else {
|
||||
the member's passbook shows one entry, not {{ lineCount }}.
|
||||
}
|
||||
} @else {
|
||||
₹{{ data.totalCashPayable | number: '1.2-2' }} will be debited from this account when a checker
|
||||
approves. No cash is taken at the counter.
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
<form [formGroup]="form" class="dd-form">
|
||||
<!--
|
||||
<!--
|
||||
A slip's drafts, one card each.
|
||||
|
||||
Face value and charge sit on the line rather than on the slip because that is how the bank
|
||||
actually uses this: three drafts to three institutions are three different amounts, and the
|
||||
charge is levied per draft. The server stores and posts them per line for the same reason.
|
||||
-->
|
||||
@if (isSlip) {
|
||||
<form [formGroup]="slipForm" class="dd-form">
|
||||
<div formArrayName="lines">
|
||||
@for (lineCtrl of slipLines.controls; track $index) {
|
||||
<div class="dd-line-card" [formGroupName]="$index">
|
||||
<div class="dd-line-head">
|
||||
<span class="dd-line-badge">DD {{ $index + 1 }} of {{ lineCount }}</span>
|
||||
@if (previewNumberAt($index)) {
|
||||
<span class="dd-line-number">No. {{ previewNumberAt($index) }} <em>(provisional)</em></span>
|
||||
}
|
||||
<span class="dd-line-total"> Debit ₹{{ lineTotalAt($index) | number: '1.2-2' }} </span>
|
||||
</div>
|
||||
|
||||
<mat-form-field appearance="outline" class="full-width">
|
||||
<mat-label>Beneficiary Name (In Favour Of) *</mat-label>
|
||||
<input
|
||||
matInput
|
||||
formControlName="beneficiaryName"
|
||||
placeholder="e.g. UNIVERSITY OF MUMBAI"
|
||||
maxlength="120"
|
||||
style="text-transform: uppercase;"
|
||||
/>
|
||||
<mat-error *ngIf="lineCtrl.get('beneficiaryName')?.hasError('required')"
|
||||
>Beneficiary name is required</mat-error
|
||||
>
|
||||
<mat-error *ngIf="lineCtrl.get('beneficiaryName')?.hasError('maxlength')"
|
||||
>Max 120 characters</mat-error
|
||||
>
|
||||
</mat-form-field>
|
||||
|
||||
<div class="form-row">
|
||||
<mat-form-field appearance="outline" class="form-field-flex">
|
||||
<mat-label>Payable At - Branch *</mat-label>
|
||||
<input
|
||||
matInput
|
||||
formControlName="payableAtBranch"
|
||||
placeholder="e.g. FORT BRANCH"
|
||||
maxlength="150"
|
||||
style="text-transform: uppercase;"
|
||||
/>
|
||||
<mat-error *ngIf="lineCtrl.get('payableAtBranch')?.hasError('required')"
|
||||
>Payable Branch is required</mat-error
|
||||
>
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field appearance="outline" class="form-field-flex">
|
||||
<mat-label>Payable At - City *</mat-label>
|
||||
<input
|
||||
matInput
|
||||
formControlName="payableAtCity"
|
||||
placeholder="e.g. MUMBAI"
|
||||
maxlength="100"
|
||||
style="text-transform: uppercase;"
|
||||
/>
|
||||
<mat-error *ngIf="lineCtrl.get('payableAtCity')?.hasError('required')"
|
||||
>Payable City is required</mat-error
|
||||
>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
|
||||
<div class="form-row">
|
||||
<mat-form-field appearance="outline" class="form-field-flex">
|
||||
<mat-label>Face Value *</mat-label>
|
||||
<input matInput type="number" formControlName="faceValue" placeholder="0.00" />
|
||||
<span matPrefix>₹ </span>
|
||||
<mat-error *ngIf="lineCtrl.get('faceValue')?.hasError('required')"
|
||||
>Face value is required</mat-error
|
||||
>
|
||||
<mat-error *ngIf="lineCtrl.get('faceValue')?.hasError('min')"
|
||||
>Face value must be greater than zero</mat-error
|
||||
>
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field appearance="outline" class="form-field-flex">
|
||||
<mat-label>Charges</mat-label>
|
||||
<input matInput type="number" formControlName="chargesAmount" placeholder="0.00" />
|
||||
<span matPrefix>₹ </span>
|
||||
<mat-hint>GST ₹{{ lineGstAt($index) | number: '1.2-2' }} at {{ data.gstPercentage }}%</mat-hint>
|
||||
<mat-error *ngIf="lineCtrl.get('chargesAmount')?.hasError('min')"
|
||||
>Charges cannot be negative</mat-error
|
||||
>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</form>
|
||||
} @else {
|
||||
<form [formGroup]="form" class="dd-form">
|
||||
<!--
|
||||
Purchaser identity is asked for only when the bank has none: a walk-in paying cash. On an
|
||||
account debit the purchaser IS the account holder, already identified and KYC'd, and
|
||||
re-capturing a name and Aadhaar here would invite a mismatch against the account on record.
|
||||
-->
|
||||
@if (!isAccountDebit) {
|
||||
<div class="form-section-title">Walk-in Purchaser Details</div>
|
||||
@if (!isAccountDebit) {
|
||||
<div class="form-section-title">Walk-in Purchaser Details</div>
|
||||
|
||||
<div class="form-row">
|
||||
<mat-form-field appearance="outline" class="form-field-flex">
|
||||
<mat-label>Walk-in Purchaser Name *</mat-label>
|
||||
<input
|
||||
matInput
|
||||
formControlName="walkinPurchaserName"
|
||||
placeholder="e.g. RAMESH CHANDRA"
|
||||
style="text-transform: uppercase;"
|
||||
/>
|
||||
<mat-error *ngIf="form.get('walkinPurchaserName')?.hasError('required')"
|
||||
>Purchaser name is required</mat-error
|
||||
>
|
||||
<mat-error *ngIf="form.get('walkinPurchaserName')?.hasError('minlength')"
|
||||
>Must be at least 3 characters</mat-error
|
||||
>
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field appearance="outline" class="form-field-flex">
|
||||
<mat-label>12-Digit Aadhaar Number *</mat-label>
|
||||
<input
|
||||
matInput
|
||||
formControlName="walkinPurchaserAadhaar"
|
||||
placeholder="12-digit Aadhaar"
|
||||
maxlength="12"
|
||||
/>
|
||||
<mat-hint>Masked to last 4 digits before storage</mat-hint>
|
||||
<mat-error *ngIf="form.get('walkinPurchaserAadhaar')?.hasError('required')"
|
||||
>Aadhaar number is required</mat-error
|
||||
>
|
||||
<mat-error *ngIf="form.get('walkinPurchaserAadhaar')?.hasError('pattern')"
|
||||
>Must be exactly 12 numeric digits</mat-error
|
||||
>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
|
||||
<mat-form-field appearance="outline" class="full-width">
|
||||
<mat-label>Purchaser Address / Location *</mat-label>
|
||||
<input
|
||||
matInput
|
||||
formControlName="walkinPurchaserAddress"
|
||||
placeholder="e.g. 14, SECTOR 5, MAIN ROAD, MUMBAI"
|
||||
style="text-transform: uppercase;"
|
||||
/>
|
||||
<mat-error *ngIf="form.get('walkinPurchaserAddress')?.hasError('required')"
|
||||
>Address is required</mat-error
|
||||
>
|
||||
</mat-form-field>
|
||||
}
|
||||
|
||||
<!-- Beneficiary Section -->
|
||||
<div class="form-section-title">Beneficiary & Payment Details</div>
|
||||
|
||||
<mat-form-field appearance="outline" class="full-width">
|
||||
<mat-label>Beneficiary Name (In Favour Of) *</mat-label>
|
||||
<input
|
||||
matInput
|
||||
formControlName="beneficiaryName"
|
||||
placeholder="e.g. UNIVERSITY OF MUMBAI"
|
||||
maxlength="120"
|
||||
style="text-transform: uppercase;"
|
||||
/>
|
||||
<mat-error *ngIf="form.get('beneficiaryName')?.hasError('required')"
|
||||
>Beneficiary name is required</mat-error
|
||||
>
|
||||
<mat-error *ngIf="form.get('beneficiaryName')?.hasError('maxlength')">Max 120 characters</mat-error>
|
||||
</mat-form-field>
|
||||
|
||||
<div class="form-row">
|
||||
<mat-form-field appearance="outline" class="form-field-flex">
|
||||
<mat-label>Walk-in Purchaser Name *</mat-label>
|
||||
<mat-label>Payable At - Branch *</mat-label>
|
||||
<input
|
||||
matInput
|
||||
formControlName="walkinPurchaserName"
|
||||
placeholder="e.g. RAMESH CHANDRA"
|
||||
formControlName="payableAtBranch"
|
||||
placeholder="e.g. FORT BRANCH"
|
||||
maxlength="150"
|
||||
style="text-transform: uppercase;"
|
||||
/>
|
||||
<mat-error *ngIf="form.get('walkinPurchaserName')?.hasError('required')"
|
||||
>Purchaser name is required</mat-error
|
||||
>
|
||||
<mat-error *ngIf="form.get('walkinPurchaserName')?.hasError('minlength')"
|
||||
>Must be at least 3 characters</mat-error
|
||||
<mat-error *ngIf="form.get('payableAtBranch')?.hasError('required')"
|
||||
>Payable Branch is required</mat-error
|
||||
>
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field appearance="outline" class="form-field-flex">
|
||||
<mat-label>12-Digit Aadhaar Number *</mat-label>
|
||||
<mat-label>Payable At - City *</mat-label>
|
||||
<input
|
||||
matInput
|
||||
formControlName="walkinPurchaserAadhaar"
|
||||
placeholder="12-digit Aadhaar"
|
||||
maxlength="12"
|
||||
formControlName="payableAtCity"
|
||||
placeholder="e.g. MUMBAI"
|
||||
maxlength="100"
|
||||
style="text-transform: uppercase;"
|
||||
/>
|
||||
<mat-hint>Masked to last 4 digits before storage</mat-hint>
|
||||
<mat-error *ngIf="form.get('walkinPurchaserAadhaar')?.hasError('required')"
|
||||
>Aadhaar number is required</mat-error
|
||||
>
|
||||
<mat-error *ngIf="form.get('walkinPurchaserAadhaar')?.hasError('pattern')"
|
||||
>Must be exactly 12 numeric digits</mat-error
|
||||
>
|
||||
<mat-error *ngIf="form.get('payableAtCity')?.hasError('required')">Payable City is required</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
|
||||
<mat-form-field appearance="outline" class="full-width">
|
||||
<mat-label>Purchaser Address / Location *</mat-label>
|
||||
<input
|
||||
matInput
|
||||
formControlName="walkinPurchaserAddress"
|
||||
placeholder="e.g. 14, SECTOR 5, MAIN ROAD, MUMBAI"
|
||||
style="text-transform: uppercase;"
|
||||
/>
|
||||
<mat-error *ngIf="form.get('walkinPurchaserAddress')?.hasError('required')"
|
||||
>Address is required</mat-error
|
||||
>
|
||||
</mat-form-field>
|
||||
}
|
||||
|
||||
<!-- Beneficiary Section -->
|
||||
<div class="form-section-title">Beneficiary & Payment Details</div>
|
||||
|
||||
<mat-form-field appearance="outline" class="full-width">
|
||||
<mat-label>Beneficiary Name (In Favour Of) *</mat-label>
|
||||
<input
|
||||
matInput
|
||||
formControlName="beneficiaryName"
|
||||
placeholder="e.g. UNIVERSITY OF MUMBAI"
|
||||
maxlength="120"
|
||||
style="text-transform: uppercase;"
|
||||
/>
|
||||
<mat-error *ngIf="form.get('beneficiaryName')?.hasError('required')"
|
||||
>Beneficiary name is required</mat-error
|
||||
>
|
||||
<mat-error *ngIf="form.get('beneficiaryName')?.hasError('maxlength')">Max 120 characters</mat-error>
|
||||
</mat-form-field>
|
||||
|
||||
<div class="form-row">
|
||||
<mat-form-field appearance="outline" class="form-field-flex">
|
||||
<mat-label>Payable At - Branch *</mat-label>
|
||||
<input
|
||||
matInput
|
||||
formControlName="payableAtBranch"
|
||||
placeholder="e.g. FORT BRANCH"
|
||||
maxlength="150"
|
||||
style="text-transform: uppercase;"
|
||||
/>
|
||||
<mat-error *ngIf="form.get('payableAtBranch')?.hasError('required')"
|
||||
>Payable Branch is required</mat-error
|
||||
>
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field appearance="outline" class="form-field-flex">
|
||||
<mat-label>Payable At - City *</mat-label>
|
||||
<input
|
||||
matInput
|
||||
formControlName="payableAtCity"
|
||||
placeholder="e.g. MUMBAI"
|
||||
maxlength="100"
|
||||
style="text-transform: uppercase;"
|
||||
/>
|
||||
<mat-error *ngIf="form.get('payableAtCity')?.hasError('required')">Payable City is required</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</form>
|
||||
</form>
|
||||
}
|
||||
</mat-dialog-content>
|
||||
|
||||
<mat-dialog-actions class="dd-dialog-actions" align="end">
|
||||
@if (isSlip) {
|
||||
<span class="dd-actions-total">
|
||||
{{ lineCount }} drafts · <strong>₹{{ slipTotal | number: '1.2-2' }}</strong> to debit
|
||||
</span>
|
||||
}
|
||||
<button mat-button type="button" (click)="onClose()">Cancel</button>
|
||||
<button mat-flat-button color="primary" [disabled]="form.invalid" (click)="onSubmit()">
|
||||
Save DD Details
|
||||
<button mat-flat-button color="primary" [disabled]="activeForm.invalid" (click)="onSubmit()">
|
||||
{{ isSlip ? 'Save Slip Details' : 'Save DD Details' }}
|
||||
</button>
|
||||
</mat-dialog-actions>
|
||||
</div>
|
||||
@@ -395,6 +598,81 @@ export interface CashierIssueDdDialogData {
|
||||
line-height: 1.5;
|
||||
color: #64748b;
|
||||
}
|
||||
/* One card per draft on a slip — the boundary is what stops a clerk typing line 2's
|
||||
beneficiary against line 1's amount. */
|
||||
.dd-line-card {
|
||||
border: 1px solid #e2e8f0;
|
||||
border-left: 3px solid #0369a1;
|
||||
border-radius: 8px;
|
||||
padding: 14px 16px 4px;
|
||||
margin-bottom: 14px;
|
||||
background: #fcfdff;
|
||||
}
|
||||
.dd-line-head {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
flex-wrap: wrap;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
.dd-line-badge {
|
||||
font-size: 11px;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.4px;
|
||||
color: #ffffff;
|
||||
background: #0369a1;
|
||||
padding: 3px 9px;
|
||||
border-radius: 999px;
|
||||
}
|
||||
.dd-line-number {
|
||||
font-family: monospace;
|
||||
font-size: 12px;
|
||||
color: #475569;
|
||||
}
|
||||
.dd-line-number em {
|
||||
font-style: normal;
|
||||
color: #94a3b8;
|
||||
font-size: 11px;
|
||||
}
|
||||
.dd-line-total {
|
||||
margin-left: auto;
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
color: #065f46;
|
||||
background: #ecfdf5;
|
||||
border: 1px solid #a7f3d0;
|
||||
padding: 3px 10px;
|
||||
border-radius: 6px;
|
||||
}
|
||||
.dd-preview-note {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
align-items: flex-start;
|
||||
margin: 0 0 16px;
|
||||
padding: 9px 12px;
|
||||
background: #fffbeb;
|
||||
border: 1px solid #fde68a;
|
||||
border-radius: 6px;
|
||||
font-size: 12px;
|
||||
line-height: 1.5;
|
||||
color: #78350f;
|
||||
}
|
||||
.dd-preview-note mat-icon {
|
||||
color: #b45309;
|
||||
font-size: 18px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.dd-actions-total {
|
||||
margin-right: auto;
|
||||
font-size: 13px;
|
||||
color: #475569;
|
||||
}
|
||||
.dd-actions-total strong {
|
||||
color: #065f46;
|
||||
}
|
||||
`
|
||||
]
|
||||
})
|
||||
@@ -404,13 +682,127 @@ export class CashierIssueDdDialogComponent implements OnInit {
|
||||
public data: CashierIssueDdDialogData = inject(MAT_DIALOG_DATA);
|
||||
|
||||
form!: FormGroup;
|
||||
/** Built only in slip mode; `form` stays untouched so the single-draft path is unchanged. */
|
||||
slipForm!: FormGroup;
|
||||
|
||||
/** Whether the draft is funded by debiting a member's account rather than by cash at the counter. */
|
||||
get isAccountDebit(): boolean {
|
||||
return this.data.paymentMethod === 'ACCOUNT_DEBIT';
|
||||
}
|
||||
|
||||
/** How many drafts this dialog is capturing — 1 unless the clerk asked for a slip. */
|
||||
get lineCount(): number {
|
||||
const n = Number(this.data.ddCount) || 1;
|
||||
return n > 1 ? n : 1;
|
||||
}
|
||||
|
||||
/** Whether this dialog is capturing a multi-DD slip rather than a single draft. */
|
||||
get isSlip(): boolean {
|
||||
return this.lineCount > 1;
|
||||
}
|
||||
|
||||
/** Whether the debit lands on a GL account rather than a member's — wording only. */
|
||||
get isGlFunded(): boolean {
|
||||
return !!this.data.glFunded;
|
||||
}
|
||||
|
||||
/** The form the Save button validates against — whichever of the two was built. */
|
||||
get activeForm(): FormGroup {
|
||||
return this.isSlip ? this.slipForm : this.form;
|
||||
}
|
||||
|
||||
get slipLines(): FormArray {
|
||||
return this.slipForm.get('lines') as FormArray;
|
||||
}
|
||||
|
||||
/** The provisional leaflet number shown against a line, if the caller supplied a run of them. */
|
||||
previewNumberAt(index: number): string | null {
|
||||
return this.data.previewDdNumbers?.[index] ?? null;
|
||||
}
|
||||
|
||||
private lineValueAt(index: number, field: string): number {
|
||||
return Number(this.slipLines.at(index)?.get(field)?.value) || 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* GST on one line's charge.
|
||||
*
|
||||
* Rounded per line, matching the server, which computes and stores GST against each draft rather
|
||||
* than once for the slip. Summing rounded lines and rounding a summed charge can differ by a
|
||||
* paisa, and it is the per-line figure that ends up on the draft.
|
||||
*/
|
||||
lineGstAt(index: number): number {
|
||||
const charges = this.lineValueAt(index, 'chargesAmount');
|
||||
if (charges <= 0) return 0;
|
||||
return Math.round(charges * (Number(this.data.gstPercentage) || 0)) / 100;
|
||||
}
|
||||
|
||||
/** What one line adds to the debit — its face value, its charge and the GST on that charge. */
|
||||
lineTotalAt(index: number): number {
|
||||
return this.lineValueAt(index, 'faceValue') + this.lineValueAt(index, 'chargesAmount') + this.lineGstAt(index);
|
||||
}
|
||||
|
||||
get slipFaceValue(): number {
|
||||
return this.slipLines.controls.reduce((sum, _c, i) => sum + this.lineValueAt(i, 'faceValue'), 0);
|
||||
}
|
||||
|
||||
get slipCharges(): number {
|
||||
return this.slipLines.controls.reduce((sum, _c, i) => sum + this.lineValueAt(i, 'chargesAmount'), 0);
|
||||
}
|
||||
|
||||
get slipGst(): number {
|
||||
return this.slipLines.controls.reduce((sum, _c, i) => sum + this.lineGstAt(i), 0);
|
||||
}
|
||||
|
||||
/** The figure the account is debited for — rounded up to the whole rupee, as the single flow does. */
|
||||
get slipTotal(): number {
|
||||
return Math.ceil(this.slipFaceValue + this.slipCharges + this.slipGst - 1e-9);
|
||||
}
|
||||
|
||||
ngOnInit(): void {
|
||||
if (this.isSlip) {
|
||||
this.slipForm = this.fb.group({
|
||||
lines: this.fb.array(
|
||||
Array.from({ length: this.lineCount }, () =>
|
||||
this.fb.group({
|
||||
beneficiaryName: [
|
||||
'',
|
||||
[
|
||||
Validators.required,
|
||||
Validators.maxLength(120)
|
||||
]
|
||||
],
|
||||
payableAtBranch: [
|
||||
'',
|
||||
[Validators.required]
|
||||
],
|
||||
payableAtCity: [
|
||||
'',
|
||||
[Validators.required]
|
||||
],
|
||||
// Zero is rejected rather than merely warned about: the server refuses a line with a
|
||||
// face value at or below zero, and a slip that fails there has already cost the clerk
|
||||
// every other line they typed.
|
||||
faceValue: [
|
||||
null as
|
||||
| number
|
||||
| null,
|
||||
[
|
||||
Validators.required,
|
||||
Validators.min(0.01)
|
||||
]
|
||||
],
|
||||
chargesAmount: [
|
||||
0,
|
||||
[Validators.min(0)]
|
||||
]
|
||||
})
|
||||
)
|
||||
)
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
// Walk-in identity is required for cash and rejected outright for an account debit — the server
|
||||
// refuses a walk-in name alongside an account — so the controls are only built when they apply.
|
||||
// Registering them unconditionally and merely hiding them would hold the form invalid on a
|
||||
@@ -477,7 +869,25 @@ export class CashierIssueDdDialogComponent implements OnInit {
|
||||
}
|
||||
|
||||
onSubmit(): void {
|
||||
if (this.form.invalid) return;
|
||||
if (this.activeForm.invalid) return;
|
||||
|
||||
// A slip closes with its lines. There is no walk-in branch here: a slip is only ever offered on
|
||||
// a member-account debit, where the purchaser is the account holder already on record.
|
||||
if (this.isSlip) {
|
||||
const lines: DdSlipLineResult[] = this.slipLines.controls.map((c) => {
|
||||
const v = c.value;
|
||||
return {
|
||||
beneficiaryName: (v.beneficiaryName || '').trim().toUpperCase(),
|
||||
payableAtBranch: (v.payableAtBranch || '').trim().toUpperCase(),
|
||||
payableAtCity: (v.payableAtCity || '').trim().toUpperCase(),
|
||||
faceValue: Number(v.faceValue) || 0,
|
||||
chargesAmount: Number(v.chargesAmount) || 0
|
||||
};
|
||||
});
|
||||
this.dialogRef.close({ lines });
|
||||
return;
|
||||
}
|
||||
|
||||
const val = this.form.value;
|
||||
const beneficiary = {
|
||||
beneficiaryName: (val.beneficiaryName || '').trim().toUpperCase(),
|
||||
|
||||
@@ -117,6 +117,8 @@
|
||||
<select
|
||||
class="ws-f__ctl"
|
||||
[(ngModel)]="row.typ"
|
||||
[disabled]="isTypLocked(row)"
|
||||
[title]="isTypLocked(row) ? 'Token withdrawal - TYPE is fixed to Payment' : ''"
|
||||
(click)="$event.stopPropagation()"
|
||||
(change)="onTypChange(row)"
|
||||
>
|
||||
@@ -166,23 +168,44 @@
|
||||
</div>
|
||||
<div class="ws-f ws-f--actyp">
|
||||
<label class="ws-f__lbl" title="Account Type">AC. TP.</label>
|
||||
<select
|
||||
class="ws-f__ctl"
|
||||
[(ngModel)]="row.acTyp"
|
||||
(click)="$event.stopPropagation()"
|
||||
(change)="
|
||||
row.acTyp === 'GL' &&
|
||||
row.typ !== 'Disbursement' &&
|
||||
row.typ !== 'Fund Transfer' &&
|
||||
row.typ !== 'Enter Bank Transfer' &&
|
||||
(row.dbCr = 'Cr')
|
||||
"
|
||||
>
|
||||
@for (a of acTypOptionsFor(row); track a) {
|
||||
<option [value]="a">{{ a }}</option>
|
||||
}
|
||||
</select>
|
||||
@if (acTypLockedByToken && row === selectedRow) {
|
||||
<span
|
||||
class="ws-f__ctl ws-f__ctl--locked"
|
||||
title="Locked — filled from a token-driven request, not a normal account entry"
|
||||
>{{ acTypLockedLabel }}</span
|
||||
>
|
||||
} @else {
|
||||
<select
|
||||
class="ws-f__ctl"
|
||||
[(ngModel)]="row.acTyp"
|
||||
(click)="$event.stopPropagation()"
|
||||
(change)="isGlCreditOnly(row) && (row.dbCr = 'Cr')"
|
||||
>
|
||||
@for (a of acTypOptionsFor(row); track a) {
|
||||
<option [value]="a">{{ a }}</option>
|
||||
}
|
||||
</select>
|
||||
}
|
||||
</div>
|
||||
@if (showsEntryType(row)) {
|
||||
<div class="ws-f ws-f--paytype">
|
||||
<label
|
||||
class="ws-f__lbl ws-f__lbl--accent"
|
||||
title="What this money was actually collected for — checked before a share application or DD issuance can adopt this voucher"
|
||||
>ENTRY TYPE</label
|
||||
>
|
||||
<select
|
||||
class="ws-f__ctl ws-f__ctl--accent"
|
||||
[(ngModel)]="row.entryTypeCvId"
|
||||
(click)="$event.stopPropagation()"
|
||||
>
|
||||
<option [ngValue]="null">Select…</option>
|
||||
@for (t of entryTypeOptions; track t.id) {
|
||||
<option [ngValue]="t.id">{{ t.name }}</option>
|
||||
}
|
||||
</select>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -206,14 +229,20 @@
|
||||
? ddGlMapping?.ddPayableGlCode || 'Auto GL'
|
||||
: 'Account number'
|
||||
"
|
||||
[readonly]="row.typ === 'DD' && !isDdAccountDebitRow(row)"
|
||||
[class.ws-f__ctl--readonly]="row.typ === 'DD' && !isDdAccountDebitRow(row)"
|
||||
[readonly]="
|
||||
(row.typ === 'DD' && !isDdAccountDebitRow(row)) || (acTypLockedByToken && row === selectedRow)
|
||||
"
|
||||
[class.ws-f__ctl--readonly]="
|
||||
(row.typ === 'DD' && !isDdAccountDebitRow(row)) || (acTypLockedByToken && row === selectedRow)
|
||||
"
|
||||
[title]="
|
||||
isDdAccountDebitRow(row)
|
||||
? 'Member account the draft is funded from'
|
||||
: row.typ === 'DD'
|
||||
? 'Configured Sponsor DD Payable GL (Auto-selected)'
|
||||
: 'Account number'
|
||||
acTypLockedByToken && row === selectedRow
|
||||
? 'Locked — filled from a token-driven request, not a normal account entry'
|
||||
: isDdAccountDebitRow(row)
|
||||
? 'Member account the draft is funded from'
|
||||
: row.typ === 'DD'
|
||||
? 'Configured Sponsor DD Payable GL (Auto-selected)'
|
||||
: 'Account number'
|
||||
"
|
||||
/>
|
||||
</div>
|
||||
@@ -233,12 +262,7 @@
|
||||
type="button"
|
||||
class="ws-seg__btn ws-seg__btn--dr"
|
||||
[class.ws-seg__btn--active-dr]="row.dbCr === 'Dr'"
|
||||
[disabled]="
|
||||
row.acTyp === 'GL' &&
|
||||
row.typ !== 'Disbursement' &&
|
||||
row.typ !== 'Fund Transfer' &&
|
||||
row.typ !== 'Enter Bank Transfer'
|
||||
"
|
||||
[disabled]="isGlCreditOnly(row)"
|
||||
(click)="row.dbCr = 'Dr'"
|
||||
>
|
||||
DR
|
||||
@@ -247,6 +271,7 @@
|
||||
type="button"
|
||||
class="ws-seg__btn ws-seg__btn--cr"
|
||||
[class.ws-seg__btn--active-cr]="row.dbCr === 'Cr'"
|
||||
[disabled]="row.typ === 'Withdrawal Slip'"
|
||||
(click)="row.dbCr = 'Cr'"
|
||||
>
|
||||
CR
|
||||
@@ -286,9 +311,13 @@
|
||||
[value]="row.amount ?? ''"
|
||||
(input)="row.amount = +$any($event.target).value; syncShareLinkedAmounts()"
|
||||
(click)="$event.stopPropagation()"
|
||||
[placeholder]="row.acTyp === 'SHR' ? '0' : '0.00'"
|
||||
[readonly]="!isClerk && !!(activeWithdrawalRequest || activeClosureRequest)"
|
||||
[class.ws-amt-input--locked]="!isClerk && !!(activeWithdrawalRequest || activeClosureRequest)"
|
||||
[placeholder]="isMultiDdRow(row) ? 'Per draft' : row.acTyp === 'SHR' ? '0' : '0.00'"
|
||||
[readonly]="
|
||||
isMultiDdRow(row) || (!isClerk && !!(activeWithdrawalRequest || activeClosureRequest))
|
||||
"
|
||||
[class.ws-amt-input--locked]="
|
||||
isMultiDdRow(row) || (!isClerk && !!(activeWithdrawalRequest || activeClosureRequest))
|
||||
"
|
||||
/>
|
||||
</div>
|
||||
@if (row.acTyp === 'SHR' && rowSharePrices[row.acNo]) {
|
||||
@@ -298,6 +327,19 @@
|
||||
}}/share</span
|
||||
>
|
||||
}
|
||||
<!-- On a slip the face value belongs to each draft, so the row total is the sum of
|
||||
them and is filled in by the dialog rather than typed here. A clerk-typed
|
||||
figure could disagree with the drafts, and the account would be debited for
|
||||
a total the drafts do not add up to. -->
|
||||
@if (isMultiDdRow(row)) {
|
||||
<span class="ws-f__hint">
|
||||
{{
|
||||
row.ddLines?.length
|
||||
? 'Total of ' + row.ddLines?.length + ' drafts'
|
||||
: 'Set per draft in Fill DD Details'
|
||||
}}
|
||||
</span>
|
||||
}
|
||||
</div>
|
||||
@if (row.acTyp === 'SHR' && (row.typ === 'Enter Bank Transfer' || row.typ === 'Fund Transfer')) {
|
||||
<div class="ws-f ws-f--cheqno">
|
||||
@@ -377,9 +419,36 @@
|
||||
<div class="ws-group ws-group--flex">
|
||||
<span class="ws-caption">DD Charges & GST — Admin Rate {{ ddGstPercentage }}%</span>
|
||||
<div class="ws-group__fields">
|
||||
<!-- How many drafts this one debit funds. Typed before the details are filled in,
|
||||
because it is what decides how many beneficiary forms the dialog presents.
|
||||
Offered only where the server can honour it: a member savings/current
|
||||
account debit, never a GL or cash draft. -->
|
||||
@if (canRowBeMultiDd(row)) {
|
||||
<div class="ws-f ws-f--amt">
|
||||
<label class="ws-f__lbl" title="Number of demand drafts to raise against this single debit"
|
||||
>NO. OF DD</label
|
||||
>
|
||||
<div class="ws-amt-wrap">
|
||||
<input
|
||||
class="ws-f__ctl ws-amt-input"
|
||||
type="number"
|
||||
min="1"
|
||||
[max]="maxDdSlipLines"
|
||||
step="1"
|
||||
[value]="ddCountFor(row)"
|
||||
(input)="onDdCountChange(row, +$any($event.target).value)"
|
||||
(click)="$event.stopPropagation()"
|
||||
placeholder="1"
|
||||
/>
|
||||
</div>
|
||||
@if (isMultiDdRow(row)) {
|
||||
<span class="ws-f__hint">One debit · {{ ddCountFor(row) }} drafts</span>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
<div class="ws-f ws-f--amt">
|
||||
<label class="ws-f__lbl" title="DD issuance charges / commission">CHARGES</label>
|
||||
<div class="ws-amt-wrap">
|
||||
<div class="ws-amt-wrap" [class.ws-amt-wrap--locked]="isMultiDdRow(row)">
|
||||
<span class="ws-amt-prefix">₹</span>
|
||||
<input
|
||||
class="ws-f__ctl ws-amt-input"
|
||||
@@ -388,8 +457,15 @@
|
||||
(input)="row.ddCharges = +$any($event.target).value"
|
||||
(click)="$event.stopPropagation()"
|
||||
placeholder="0.00"
|
||||
[readonly]="isMultiDdRow(row)"
|
||||
[class.ws-amt-input--locked]="isMultiDdRow(row)"
|
||||
/>
|
||||
</div>
|
||||
<!-- Charges are levied per draft and can differ between them, so on a slip they
|
||||
are entered against each draft and totalled here. -->
|
||||
@if (isMultiDdRow(row)) {
|
||||
<span class="ws-f__hint">Set per draft</span>
|
||||
}
|
||||
</div>
|
||||
<div class="ws-f ws-f--amt">
|
||||
<label class="ws-f__lbl" title="GST on charges, at the admin-configured rate">
|
||||
@@ -400,7 +476,7 @@
|
||||
<input
|
||||
class="ws-f__ctl ws-amt-input ws-amt-input--locked"
|
||||
type="text"
|
||||
[value]="ddGstAmountFor(row) | number: '1.2-2'"
|
||||
[value]="ddGstDisplayFor(row)"
|
||||
readonly
|
||||
/>
|
||||
</div>
|
||||
@@ -414,7 +490,7 @@
|
||||
<input
|
||||
class="ws-f__ctl ws-amt-input ws-amt-input--locked"
|
||||
type="text"
|
||||
[value]="ddTotalPayableFor(row)"
|
||||
[value]="ddTotalDisplayFor(row)"
|
||||
readonly
|
||||
/>
|
||||
</div>
|
||||
@@ -427,18 +503,27 @@
|
||||
[disabled]="saving"
|
||||
(click)="openIssueWalkinDd(row); $event.stopPropagation()"
|
||||
[title]="
|
||||
isDdAccountDebitRow(row)
|
||||
? 'Auto-selects next available leaflet and opens the beneficiary form'
|
||||
: 'Auto-selects next available leaflet and opens walk-in purchaser form'
|
||||
isMultiDdRow(row)
|
||||
? 'Opens one beneficiary form per draft; DD numbers are allocated on submission'
|
||||
: isDdAccountDebitRow(row)
|
||||
? 'Auto-selects next available leaflet and opens the beneficiary form'
|
||||
: 'Auto-selects next available leaflet and opens walk-in purchaser form'
|
||||
"
|
||||
>
|
||||
<mat-icon style="font-size: 18px; width: 18px; height: 18px">{{
|
||||
row.ddDetails ? 'edit_note' : 'post_add'
|
||||
row.ddDetails || row.ddLines?.length ? 'edit_note' : 'post_add'
|
||||
}}</mat-icon>
|
||||
<!-- Names the leaflet once details are captured, so the clerk can see at a
|
||||
glance which rows are ready before pressing Save. -->
|
||||
glance which rows are ready before pressing Save. A slip names the count
|
||||
instead: its numbers are not allocated until it is submitted. -->
|
||||
<span>{{
|
||||
row.ddDetails ? 'DD ' + row.ddDetails.ddNumber + ' · Edit Details' : 'Fill DD Details'
|
||||
row.ddLines?.length
|
||||
? row.ddLines?.length + ' Drafts Captured · Edit Slip'
|
||||
: row.ddDetails
|
||||
? 'DD ' + row.ddDetails.ddNumber + ' · Edit Details'
|
||||
: isMultiDdRow(row)
|
||||
? 'Fill ' + ddCountFor(row) + ' DD Details'
|
||||
: 'Fill DD Details'
|
||||
}}</span>
|
||||
</button>
|
||||
</div>
|
||||
@@ -618,70 +703,81 @@
|
||||
<circle cx="12" cy="8" r="4" />
|
||||
<path d="M4 20c0-4 3.6-7 8-7s8 3 8 7" />
|
||||
</svg>
|
||||
Personal Information
|
||||
{{ isGlAccount ? 'GL Account Information' : 'Personal Information' }}
|
||||
</div>
|
||||
<div class="te-panel__body">
|
||||
<div class="te-field">
|
||||
<span class="te-label">Branch</span><span class="te-value">{{ officeName }}</span>
|
||||
@if (isGlAccount) {
|
||||
<div class="te-panel__body">
|
||||
@for (f of glInfo; track f.label) {
|
||||
<div class="te-field">
|
||||
<span class="te-label">{{ f.label }}</span
|
||||
><span class="te-value te-value-wrap" [class.te-mono]="f.mono">{{ f.value }}</span>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">A/c No.</span
|
||||
><span class="te-value te-mono">{{ accountDetails.accountNo }}</span>
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">Name</span><span class="te-value te-value-name">{{ clientName }}</span>
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">S/D/W/H/O</span><span class="te-value">{{ guardianName }}</span>
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">Address</span><span class="te-value te-value-wrap">{{ clientAddress }}</span>
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">Email</span><span class="te-value">{{ clientEmail }}</span>
|
||||
</div>
|
||||
<div class="te-field-row">
|
||||
} @else {
|
||||
<div class="te-panel__body">
|
||||
<div class="te-field">
|
||||
<span class="te-label">Last Txn</span><span class="te-value">{{ lastTransactionDate }}</span>
|
||||
<span class="te-label">Branch</span><span class="te-value">{{ officeName }}</span>
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">Type</span
|
||||
><span class="te-value">{{ accountDetails.depositType?.value ?? selectedRow?.acTyp ?? '—' }}</span>
|
||||
<span class="te-label">A/c No.</span
|
||||
><span class="te-value te-mono">{{ accountDetails.accountNo }}</span>
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">Name</span><span class="te-value te-value-name">{{ clientName }}</span>
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">S/D/W/H/O</span><span class="te-value">{{ guardianName }}</span>
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">Address</span><span class="te-value te-value-wrap">{{ clientAddress }}</span>
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">Email</span><span class="te-value">{{ clientEmail }}</span>
|
||||
</div>
|
||||
<div class="te-field-row">
|
||||
<div class="te-field">
|
||||
<span class="te-label">Last Txn</span><span class="te-value">{{ lastTransactionDate }}</span>
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">Type</span
|
||||
><span class="te-value">{{ accountDetails.depositType?.value ?? selectedRow?.acTyp ?? '—' }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="te-field-row">
|
||||
<div class="te-field">
|
||||
<span class="te-label">Opening Dt</span><span class="te-value">{{ openingDate }}</span>
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">Status</span
|
||||
><span class="te-value">{{ accountDetails.status?.value ?? '—' }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">CIF No.</span><span class="te-value te-mono">{{ cifNumber }}</span>
|
||||
</div>
|
||||
@if (isNonIndividual) {
|
||||
<div class="te-field">
|
||||
<span class="te-label">Constitution</span>
|
||||
<span class="te-value">{{
|
||||
nonPersonDetails?.constitution?.name ?? nonPersonDetails?.constitutionType?.name ?? '—'
|
||||
}}</span>
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">Incorp. No.</span>
|
||||
<span class="te-value te-mono">{{
|
||||
nonPersonDetails?.incorpNo ?? nonPersonDetails?.incorporationNo ?? '—'
|
||||
}}</span>
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">Main Business</span>
|
||||
<span class="te-value">{{
|
||||
nonPersonDetails?.mainBusinessLine?.name ?? nonPersonDetails?.mainBusinessLineType?.name ?? '—'
|
||||
}}</span>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
<div class="te-field-row">
|
||||
<div class="te-field">
|
||||
<span class="te-label">Opening Dt</span><span class="te-value">{{ openingDate }}</span>
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">Status</span
|
||||
><span class="te-value">{{ accountDetails.status?.value ?? '—' }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">CIF No.</span><span class="te-value te-mono">{{ cifNumber }}</span>
|
||||
</div>
|
||||
@if (isNonIndividual) {
|
||||
<div class="te-field">
|
||||
<span class="te-label">Constitution</span>
|
||||
<span class="te-value">{{
|
||||
nonPersonDetails?.constitution?.name ?? nonPersonDetails?.constitutionType?.name ?? '—'
|
||||
}}</span>
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">Incorp. No.</span>
|
||||
<span class="te-value te-mono">{{
|
||||
nonPersonDetails?.incorpNo ?? nonPersonDetails?.incorporationNo ?? '—'
|
||||
}}</span>
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">Main Business</span>
|
||||
<span class="te-value">{{
|
||||
nonPersonDetails?.mainBusinessLine?.name ?? nonPersonDetails?.mainBusinessLineType?.name ?? '—'
|
||||
}}</span>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
|
||||
<!-- Joint Holders + Nominees -->
|
||||
@@ -836,76 +932,78 @@
|
||||
|
||||
<!-- Other Info + KYC + Account Balances -->
|
||||
<div class="te-panel">
|
||||
<div class="te-panel__header">
|
||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<rect x="3" y="4" width="18" height="18" rx="2" />
|
||||
<line x1="16" y1="2" x2="16" y2="6" />
|
||||
<line x1="8" y1="2" x2="8" y2="6" />
|
||||
<line x1="3" y1="10" x2="21" y2="10" />
|
||||
</svg>
|
||||
Other Information
|
||||
</div>
|
||||
<div class="te-panel__body">
|
||||
<div class="te-field">
|
||||
<span class="te-label">Phone No.</span><span class="te-value">{{ clientPhone }}</span>
|
||||
@if (!isGlAccount) {
|
||||
<div class="te-panel__header">
|
||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<rect x="3" y="4" width="18" height="18" rx="2" />
|
||||
<line x1="16" y1="2" x2="16" y2="6" />
|
||||
<line x1="8" y1="2" x2="8" y2="6" />
|
||||
<line x1="3" y1="10" x2="21" y2="10" />
|
||||
</svg>
|
||||
Other Information
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">Client ID</span
|
||||
><span class="te-value te-mono">{{ accountDetails.clientId }}</span>
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">PAN</span><span class="te-value te-mono">{{ panNumber }}</span>
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">KYC Status</span>
|
||||
<span class="te-value" [style.color]="kycDetails?.kycStatus === 300 ? '#059669' : '#f59e0b'">{{
|
||||
kycStatus
|
||||
}}</span>
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">CKYC No.</span><span class="te-value te-mono">{{ ckycNumber }}</span>
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">Aadhaar</span><span class="te-value te-mono">{{ aadhaarNumber }}</span>
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">Product</span>
|
||||
<span class="te-value">{{
|
||||
accountDetails.savingsProductName ||
|
||||
accountDetails.depositProductName ||
|
||||
accountDetails.productName ||
|
||||
'—'
|
||||
}}</span>
|
||||
</div>
|
||||
@if (selectedRow?.acTyp === 'SHR') {
|
||||
<div class="te-panel__body">
|
||||
<div class="te-field">
|
||||
<span class="te-label">No. of Shares Held</span
|
||||
><span class="te-value te-mono">{{ accountDetails.summary?.totalApprovedShares ?? 0 }}</span>
|
||||
<span class="te-label">Phone No.</span><span class="te-value">{{ clientPhone }}</span>
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">Market Price / Share</span
|
||||
><span class="te-value te-mono"
|
||||
>{{ currencySymbol }}{{ accountDetails.currentMarketPrice | number: '1.2-2' }}</span
|
||||
>
|
||||
<span class="te-label">Client ID</span
|
||||
><span class="te-value te-mono">{{ accountDetails.clientId }}</span>
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">Resolution No.</span
|
||||
><span class="te-value te-mono">{{ accountDetails.resolutionNumber || '—' }}</span>
|
||||
<span class="te-label">PAN</span><span class="te-value te-mono">{{ panNumber }}</span>
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">Linked Savings A/C No.</span
|
||||
><span class="te-value te-mono">{{ accountDetails.savingsAccountNumber || '—' }}</span>
|
||||
<span class="te-label">KYC Status</span>
|
||||
<span class="te-value" [style.color]="kycDetails?.kycStatus === 300 ? '#059669' : '#f59e0b'">{{
|
||||
kycStatus
|
||||
}}</span>
|
||||
</div>
|
||||
@if (accountDetails.linkedLoanAccountNo) {
|
||||
<div class="te-field">
|
||||
<span class="te-label">CKYC No.</span><span class="te-value te-mono">{{ ckycNumber }}</span>
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">Aadhaar</span><span class="te-value te-mono">{{ aadhaarNumber }}</span>
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">Product</span>
|
||||
<span class="te-value">{{
|
||||
accountDetails.savingsProductName ||
|
||||
accountDetails.depositProductName ||
|
||||
accountDetails.productName ||
|
||||
'—'
|
||||
}}</span>
|
||||
</div>
|
||||
@if (selectedRow?.acTyp === 'SHR') {
|
||||
<div class="te-field">
|
||||
<span class="te-label">Linked Loan A/C No.</span
|
||||
><span class="te-value te-mono">{{ accountDetails.linkedLoanAccountNo }}</span>
|
||||
<span class="te-label">No. of Shares Held</span
|
||||
><span class="te-value te-mono">{{ accountDetails.summary?.totalApprovedShares ?? 0 }}</span>
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">Market Price / Share</span
|
||||
><span class="te-value te-mono"
|
||||
>{{ currencySymbol }}{{ accountDetails.currentMarketPrice | number: '1.2-2' }}</span
|
||||
>
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">Resolution No.</span
|
||||
><span class="te-value te-mono">{{ accountDetails.resolutionNumber || '—' }}</span>
|
||||
</div>
|
||||
<div class="te-field">
|
||||
<span class="te-label">Linked Savings A/C No.</span
|
||||
><span class="te-value te-mono">{{ accountDetails.savingsAccountNumber || '—' }}</span>
|
||||
</div>
|
||||
@if (accountDetails.linkedLoanAccountNo) {
|
||||
<div class="te-field">
|
||||
<span class="te-label">Linked Loan A/C No.</span
|
||||
><span class="te-value te-mono">{{ accountDetails.linkedLoanAccountNo }}</span>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
<div class="te-panel__header te-panel__header--mt">
|
||||
<div class="te-panel__header" [class.te-panel__header--mt]="!isGlAccount">
|
||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
||||
<line x1="12" y1="1" x2="12" y2="23" />
|
||||
<path d="M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6" />
|
||||
@@ -1474,6 +1572,8 @@
|
||||
<select
|
||||
class="ws-f__ctl"
|
||||
[(ngModel)]="row.typ"
|
||||
[disabled]="isTypLocked(row)"
|
||||
[title]="isTypLocked(row) ? 'Token withdrawal - TYPE is fixed to Payment' : ''"
|
||||
(click)="$event.stopPropagation()"
|
||||
(change)="onTypChange(row)"
|
||||
>
|
||||
@@ -1523,23 +1623,44 @@
|
||||
</div>
|
||||
<div class="ws-f ws-f--actyp">
|
||||
<label class="ws-f__lbl">AC. TP.</label>
|
||||
<select
|
||||
class="ws-f__ctl"
|
||||
[(ngModel)]="row.acTyp"
|
||||
(click)="$event.stopPropagation()"
|
||||
(change)="
|
||||
row.acTyp === 'GL' &&
|
||||
row.typ !== 'Disbursement' &&
|
||||
row.typ !== 'Fund Transfer' &&
|
||||
row.typ !== 'Enter Bank Transfer' &&
|
||||
(row.dbCr = 'Cr')
|
||||
"
|
||||
>
|
||||
@for (a of acTypOptionsFor(row); track a) {
|
||||
<option [value]="a">{{ a }}</option>
|
||||
}
|
||||
</select>
|
||||
@if (acTypLockedByToken && row === selectedRow) {
|
||||
<span
|
||||
class="ws-f__ctl ws-f__ctl--locked"
|
||||
title="Locked — filled from a token-driven request, not a normal account entry"
|
||||
>{{ acTypLockedLabel }}</span
|
||||
>
|
||||
} @else {
|
||||
<select
|
||||
class="ws-f__ctl"
|
||||
[(ngModel)]="row.acTyp"
|
||||
(click)="$event.stopPropagation()"
|
||||
(change)="isGlCreditOnly(row) && (row.dbCr = 'Cr')"
|
||||
>
|
||||
@for (a of acTypOptionsFor(row); track a) {
|
||||
<option [value]="a">{{ a }}</option>
|
||||
}
|
||||
</select>
|
||||
}
|
||||
</div>
|
||||
@if (showsEntryType(row)) {
|
||||
<div class="ws-f ws-f--paytype">
|
||||
<label
|
||||
class="ws-f__lbl ws-f__lbl--accent"
|
||||
title="What this money was actually collected for — checked before a share application or DD issuance can adopt this voucher"
|
||||
>ENTRY TYPE</label
|
||||
>
|
||||
<select
|
||||
class="ws-f__ctl ws-f__ctl--accent"
|
||||
[(ngModel)]="row.entryTypeCvId"
|
||||
(click)="$event.stopPropagation()"
|
||||
>
|
||||
<option [ngValue]="null">Select…</option>
|
||||
@for (t of entryTypeOptions; track t.id) {
|
||||
<option [ngValue]="t.id">{{ t.name }}</option>
|
||||
}
|
||||
</select>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
<div class="ws-vdivider"></div>
|
||||
@@ -1556,10 +1677,16 @@
|
||||
[placeholder]="
|
||||
row.typ === 'DD' ? ddGlMapping?.ddPayableGlCode || 'Auto GL' : 'Account number'
|
||||
"
|
||||
[readonly]="row.typ === 'DD'"
|
||||
[class.ws-f__ctl--readonly]="row.typ === 'DD'"
|
||||
[readonly]="row.typ === 'DD' || (acTypLockedByToken && row === selectedRow)"
|
||||
[class.ws-f__ctl--readonly]="
|
||||
row.typ === 'DD' || (acTypLockedByToken && row === selectedRow)
|
||||
"
|
||||
[title]="
|
||||
row.typ === 'DD' ? 'Configured Sponsor DD Payable GL (Auto-selected)' : 'Account number'
|
||||
acTypLockedByToken && row === selectedRow
|
||||
? 'Locked — filled from a token-driven request, not a normal account entry'
|
||||
: row.typ === 'DD'
|
||||
? 'Configured Sponsor DD Payable GL (Auto-selected)'
|
||||
: 'Account number'
|
||||
"
|
||||
/>
|
||||
</div>
|
||||
@@ -1578,12 +1705,7 @@
|
||||
type="button"
|
||||
class="ws-seg__btn ws-seg__btn--dr"
|
||||
[class.ws-seg__btn--active-dr]="row.dbCr === 'Dr'"
|
||||
[disabled]="
|
||||
row.acTyp === 'GL' &&
|
||||
row.typ !== 'Disbursement' &&
|
||||
row.typ !== 'Fund Transfer' &&
|
||||
row.typ !== 'Enter Bank Transfer'
|
||||
"
|
||||
[disabled]="isGlCreditOnly(row)"
|
||||
(click)="$event.stopPropagation(); row.dbCr = 'Dr'"
|
||||
>
|
||||
DR
|
||||
@@ -1592,6 +1714,7 @@
|
||||
type="button"
|
||||
class="ws-seg__btn ws-seg__btn--cr"
|
||||
[class.ws-seg__btn--active-cr]="row.dbCr === 'Cr'"
|
||||
[disabled]="row.typ === 'Withdrawal Slip'"
|
||||
(click)="$event.stopPropagation(); row.dbCr = 'Cr'"
|
||||
>
|
||||
CR
|
||||
@@ -1628,10 +1751,12 @@
|
||||
[value]="row.amount ?? ''"
|
||||
(input)="row.amount = +$any($event.target).value; syncShareLinkedAmounts()"
|
||||
(click)="$event.stopPropagation()"
|
||||
[placeholder]="row.acTyp === 'SHR' ? '0' : '0.00'"
|
||||
[readonly]="!isClerk && !!(activeWithdrawalRequest || activeClosureRequest)"
|
||||
[placeholder]="isMultiDdRow(row) ? 'Per draft' : row.acTyp === 'SHR' ? '0' : '0.00'"
|
||||
[readonly]="
|
||||
isMultiDdRow(row) || (!isClerk && !!(activeWithdrawalRequest || activeClosureRequest))
|
||||
"
|
||||
[class.ws-amt-input--locked]="
|
||||
!isClerk && !!(activeWithdrawalRequest || activeClosureRequest)
|
||||
isMultiDdRow(row) || (!isClerk && !!(activeWithdrawalRequest || activeClosureRequest))
|
||||
"
|
||||
/>
|
||||
</div>
|
||||
@@ -1642,6 +1767,19 @@
|
||||
}}/share</span
|
||||
>
|
||||
}
|
||||
<!-- On a slip the face value belongs to each draft, so the row total is the
|
||||
sum of them and is filled in by the dialog rather than typed here. A
|
||||
clerk-typed figure could disagree with the drafts, and the account would
|
||||
be debited for a total the drafts do not add up to. -->
|
||||
@if (isMultiDdRow(row)) {
|
||||
<span class="ws-f__hint">
|
||||
{{
|
||||
row.ddLines?.length
|
||||
? 'Total of ' + row.ddLines?.length + ' drafts'
|
||||
: 'Set per draft in Fill DD Details'
|
||||
}}
|
||||
</span>
|
||||
}
|
||||
</div>
|
||||
@if (
|
||||
row.acTyp === 'SHR' && (row.typ === 'Enter Bank Transfer' || row.typ === 'Fund Transfer')
|
||||
@@ -1706,9 +1844,38 @@
|
||||
<div class="ws-group ws-group--flex">
|
||||
<span class="ws-caption">DD Charges & GST — Admin Rate {{ ddGstPercentage }}%</span>
|
||||
<div class="ws-group__fields">
|
||||
<!-- How many drafts this one debit funds. Typed before the details are filled
|
||||
in, because it is what decides how many beneficiary forms the dialog
|
||||
presents. Offered only where the server can honour it: a member
|
||||
savings/current account debit, never a GL or cash draft. -->
|
||||
@if (canRowBeMultiDd(row)) {
|
||||
<div class="ws-f ws-f--amt">
|
||||
<label
|
||||
class="ws-f__lbl"
|
||||
title="Number of demand drafts to raise against this single debit"
|
||||
>NO. OF DD</label
|
||||
>
|
||||
<div class="ws-amt-wrap">
|
||||
<input
|
||||
class="ws-f__ctl ws-amt-input"
|
||||
type="number"
|
||||
min="1"
|
||||
[max]="maxDdSlipLines"
|
||||
step="1"
|
||||
[value]="ddCountFor(row)"
|
||||
(input)="onDdCountChange(row, +$any($event.target).value)"
|
||||
(click)="$event.stopPropagation()"
|
||||
placeholder="1"
|
||||
/>
|
||||
</div>
|
||||
@if (isMultiDdRow(row)) {
|
||||
<span class="ws-f__hint">One debit · {{ ddCountFor(row) }} drafts</span>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
<div class="ws-f ws-f--amt">
|
||||
<label class="ws-f__lbl" title="DD issuance charges / commission">CHARGES</label>
|
||||
<div class="ws-amt-wrap">
|
||||
<div class="ws-amt-wrap" [class.ws-amt-wrap--locked]="isMultiDdRow(row)">
|
||||
<span class="ws-amt-prefix">₹</span>
|
||||
<input
|
||||
class="ws-f__ctl ws-amt-input"
|
||||
@@ -1717,8 +1884,15 @@
|
||||
(input)="row.ddCharges = +$any($event.target).value"
|
||||
(click)="$event.stopPropagation()"
|
||||
placeholder="0.00"
|
||||
[readonly]="isMultiDdRow(row)"
|
||||
[class.ws-amt-input--locked]="isMultiDdRow(row)"
|
||||
/>
|
||||
</div>
|
||||
<!-- Charges are levied per draft and can differ between them, so on a slip
|
||||
they are entered against each draft and totalled here. -->
|
||||
@if (isMultiDdRow(row)) {
|
||||
<span class="ws-f__hint">Set per draft</span>
|
||||
}
|
||||
</div>
|
||||
<div class="ws-f ws-f--amt">
|
||||
<label class="ws-f__lbl" title="GST on charges, at the admin-configured rate">
|
||||
@@ -1729,7 +1903,7 @@
|
||||
<input
|
||||
class="ws-f__ctl ws-amt-input ws-amt-input--locked"
|
||||
type="text"
|
||||
[value]="ddGstAmountFor(row) | number: '1.2-2'"
|
||||
[value]="ddGstDisplayFor(row)"
|
||||
readonly
|
||||
/>
|
||||
</div>
|
||||
@@ -1743,7 +1917,7 @@
|
||||
<input
|
||||
class="ws-f__ctl ws-amt-input ws-amt-input--locked"
|
||||
type="text"
|
||||
[value]="ddTotalPayableFor(row)"
|
||||
[value]="ddTotalDisplayFor(row)"
|
||||
readonly
|
||||
/>
|
||||
</div>
|
||||
@@ -1756,13 +1930,28 @@
|
||||
[disabled]="saving"
|
||||
(click)="openIssueWalkinDd(row); $event.stopPropagation()"
|
||||
[title]="
|
||||
isDdAccountDebitRow(row)
|
||||
? 'Auto-selects next available leaflet and opens the beneficiary form'
|
||||
: 'Auto-selects next available leaflet and opens walk-in purchaser form'
|
||||
isMultiDdRow(row)
|
||||
? 'Opens one beneficiary form per draft; DD numbers are allocated on submission'
|
||||
: isDdAccountDebitRow(row)
|
||||
? 'Auto-selects next available leaflet and opens the beneficiary form'
|
||||
: 'Auto-selects next available leaflet and opens walk-in purchaser form'
|
||||
"
|
||||
>
|
||||
<mat-icon style="font-size: 18px; width: 18px; height: 18px">post_add</mat-icon>
|
||||
<span>Fill DD Details</span>
|
||||
<mat-icon style="font-size: 18px; width: 18px; height: 18px">{{
|
||||
row.ddDetails || row.ddLines?.length ? 'edit_note' : 'post_add'
|
||||
}}</mat-icon>
|
||||
<!-- Names what has been captured, so the clerk can see at a glance which
|
||||
rows are ready before pressing Save. A slip names its count instead:
|
||||
its numbers are not allocated until it is submitted. -->
|
||||
<span>{{
|
||||
row.ddLines?.length
|
||||
? row.ddLines?.length + ' Drafts Captured · Edit Slip'
|
||||
: row.ddDetails
|
||||
? 'DD ' + row.ddDetails.ddNumber + ' · Edit Details'
|
||||
: isMultiDdRow(row)
|
||||
? 'Fill ' + ddCountFor(row) + ' DD Details'
|
||||
: 'Fill DD Details'
|
||||
}}</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -1851,7 +2040,13 @@
|
||||
<button class="ws-btn ws-btn--ghost" type="button" (click)="onSearch()">Search</button>
|
||||
<button class="ws-btn ws-btn--mode" type="button">Change Tr.Mode</button>
|
||||
@if (isClerk) {
|
||||
<button class="ws-btn ws-btn--add" type="button" (click)="addRow()" title="Add another transaction row">
|
||||
<button
|
||||
class="ws-btn ws-btn--add"
|
||||
type="button"
|
||||
[disabled]="selectedRow?.typ === 'Withdrawal Slip'"
|
||||
(click)="addRow()"
|
||||
title="Add another transaction row"
|
||||
>
|
||||
<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5">
|
||||
<line x1="12" y1="5" x2="12" y2="19" />
|
||||
<line x1="5" y1="12" x2="19" y2="12" />
|
||||
|
||||
@@ -916,6 +916,20 @@ input.ws-f__ctl--readonly {
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
/* AC.TP shown as a locked label instead of the normal editable select, while the row is filled
|
||||
from a token-driven request whose real account type row.acTyp cannot show (see
|
||||
acTypLockedByToken in the component). */
|
||||
span.ws-f__ctl--locked {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
background: #f1f5f9;
|
||||
color: #475569;
|
||||
cursor: not-allowed;
|
||||
user-select: none;
|
||||
font-size: 11px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
input.ws-amt-input--locked {
|
||||
background: #fef9c3;
|
||||
color: #713f12;
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -16,6 +16,7 @@ import { MatInputModule } from '@angular/material/input';
|
||||
import { of } from 'rxjs';
|
||||
import { catchError } from 'rxjs/operators';
|
||||
import { CashierService } from '../cashier.service';
|
||||
import { businessToday } from 'app/core/utils/business-today';
|
||||
|
||||
interface DenomRow {
|
||||
denominationId: number;
|
||||
@@ -67,7 +68,7 @@ export class VaultPositionComponent implements OnInit {
|
||||
errorMsg = '';
|
||||
|
||||
ngOnInit(): void {
|
||||
const d = new Date();
|
||||
const d = businessToday();
|
||||
this.asOfDate = `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`;
|
||||
|
||||
this.service
|
||||
|
||||
@@ -13,6 +13,7 @@ import { ActivatedRoute } from '@angular/router';
|
||||
import { MatIconModule } from '@angular/material/icon';
|
||||
import { catchError, of } from 'rxjs';
|
||||
import { CashierService } from '../cashier.service';
|
||||
import { businessToday } from 'app/core/utils/business-today';
|
||||
|
||||
/**
|
||||
* Which side of the register a screen shows.
|
||||
@@ -227,7 +228,7 @@ export class VoucherReportComponent implements OnInit {
|
||||
}
|
||||
|
||||
private todayIso(): string {
|
||||
const now = new Date();
|
||||
const now = businessToday();
|
||||
return `${now.getFullYear()}-${String(now.getMonth() + 1).padStart(2, '0')}-${String(now.getDate()).padStart(2, '0')}`;
|
||||
}
|
||||
|
||||
|
||||
@@ -129,6 +129,31 @@
|
||||
<span>* Date of Meeting</span>
|
||||
<input type="date" [(ngModel)]="meetingDate" [disabled]="isReview" />
|
||||
</label>
|
||||
<label class="inv-form-field">
|
||||
<span>* Settlement Destination</span>
|
||||
@if (!isReview) {
|
||||
<select [ngModel]="settlementMode" (ngModelChange)="onSettlementModeChange($event)">
|
||||
<option value="SAVINGS">Member's Linked Savings Account</option>
|
||||
<option value="GL">GL Account</option>
|
||||
</select>
|
||||
} @else {
|
||||
<input
|
||||
type="text"
|
||||
[value]="reviewRequest?.settlement_mode === 'GL' ? 'GL Account' : 'Linked Savings Account'"
|
||||
readonly
|
||||
/>
|
||||
}
|
||||
</label>
|
||||
@if (!isReview && settlementMode === 'GL') {
|
||||
<label class="inv-form-field">
|
||||
<span>* Settlement GL Account</span>
|
||||
<mifosx-gl-account-selector
|
||||
[inputFormControl]="toGlAccountControl"
|
||||
[glAccountList]="glAccountsData"
|
||||
[required]="true"
|
||||
></mifosx-gl-account-selector>
|
||||
</label>
|
||||
}
|
||||
<label class="inv-form-field">
|
||||
<span>* Settlement Payment Type</span>
|
||||
@if (!isReview) {
|
||||
@@ -386,14 +411,25 @@
|
||||
<td>Date of Meeting</td>
|
||||
<td>{{ meetingDate }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Settlement Destination</td>
|
||||
<td>{{ settlementMode === 'GL' ? 'GL Account' : 'Linked Savings Account' }}</td>
|
||||
</tr>
|
||||
@if (settlementMode === 'GL') {
|
||||
<tr>
|
||||
<td>Settlement GL Account</td>
|
||||
<td>{{ selectedSettlementGlName }}</td>
|
||||
</tr>
|
||||
} @else {
|
||||
<tr>
|
||||
<td>Linked Savings Account</td>
|
||||
<td>{{ account?.savingsAccountNumber || 'None — settlement will not run automatically' }}</td>
|
||||
</tr>
|
||||
}
|
||||
<tr>
|
||||
<td>Settlement Payment Type</td>
|
||||
<td>{{ settlementPaymentTypeName }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Linked Savings Account</td>
|
||||
<td>{{ account?.savingsAccountNumber || 'None — settlement will not run automatically' }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
|
||||
import { Component, EventEmitter, Input, OnInit, Output, inject } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
import { FormsModule, UntypedFormControl } from '@angular/forms';
|
||||
import { ActivatedRoute, Router, RouterModule } from '@angular/router';
|
||||
import { MatIconModule } from '@angular/material/icon';
|
||||
import { MatSnackBar, MatSnackBarModule } from '@angular/material/snack-bar';
|
||||
@@ -19,6 +19,9 @@ import { SharesService } from '../../shares/shares.service';
|
||||
import { ClerkShareWithdrawalService } from '../../cashier/clerk-share-withdrawal.service';
|
||||
import { CashierService } from '../../cashier/cashier.service';
|
||||
import { SearchSelectComponent, SearchSelectOption } from '../../shared/search-select/search-select.component';
|
||||
import { GlAccountSelectorComponent } from '../../shared/accounting/gl-account-selector/gl-account-selector.component';
|
||||
import { AccountingService } from '../../accounting/accounting.service';
|
||||
import { GLAccount } from '../../shared/models/general.model';
|
||||
|
||||
export type ShareWdMode = 'create' | 'review';
|
||||
|
||||
@@ -51,7 +54,8 @@ interface ActivityEntry {
|
||||
RouterModule,
|
||||
MatIconModule,
|
||||
MatSnackBarModule,
|
||||
SearchSelectComponent
|
||||
SearchSelectComponent,
|
||||
GlAccountSelectorComponent
|
||||
]
|
||||
})
|
||||
export class ShareWithdrawalRequestComponent implements OnInit {
|
||||
@@ -60,6 +64,7 @@ export class ShareWithdrawalRequestComponent implements OnInit {
|
||||
private sharesService = inject(SharesService);
|
||||
private wdService = inject(ClerkShareWithdrawalService);
|
||||
private cashierService = inject(CashierService);
|
||||
private accountingService = inject(AccountingService);
|
||||
private snackBar = inject(MatSnackBar);
|
||||
|
||||
/** When embedded (e.g. opened as a popup from a list screen instead of routed to directly), mode
|
||||
@@ -91,6 +96,17 @@ export class ShareWithdrawalRequestComponent implements OnInit {
|
||||
paymentTypes: any[] = [];
|
||||
settlementPaymentTypeId: number | null = null;
|
||||
|
||||
/** Where the redeemed value goes. 'SAVINGS' (the long-standing default) credits the member's
|
||||
* linked savings account. 'GL' lets the clerk pick any postable GL account directly — same
|
||||
* option the Cashier's Transaction Entry screen already offers on its CR row, now available
|
||||
* here too so both entry points behave the same way. Naming the product's own Share Sundry GL
|
||||
* here is still fine: the backend recognises it and books straight to Sundry with no further
|
||||
* settlement leg (see ClerkShareWithdrawalRequestApiResource#submit). */
|
||||
settlementMode: 'SAVINGS' | 'GL' = 'SAVINGS';
|
||||
settlementGlAccountId: number | null = null;
|
||||
glAccountsData: GLAccount[] = [];
|
||||
toGlAccountControl = new UntypedFormControl('');
|
||||
|
||||
activityLog: ActivityEntry[] = [];
|
||||
reviewRequest: any = null;
|
||||
showRejectDialog = false;
|
||||
@@ -132,6 +148,17 @@ export class ShareWithdrawalRequestComponent implements OnInit {
|
||||
return this.selectedSettlementPaymentType?.name || '—';
|
||||
}
|
||||
|
||||
/** The chosen GL account's display name, for the confirm dialog and the checklist. Falls back to
|
||||
* the raw id while the GL account list is still loading. */
|
||||
get selectedSettlementGlName(): string {
|
||||
if (!this.settlementGlAccountId) {
|
||||
return '—';
|
||||
}
|
||||
return (
|
||||
this.glAccountsData.find((g) => g.id === this.settlementGlAccountId)?.name || `GL #${this.settlementGlAccountId}`
|
||||
);
|
||||
}
|
||||
|
||||
get isFormValid(): boolean {
|
||||
if (!this.account) return false;
|
||||
if (!this.requestedShares || this.requestedShares <= 0) return false;
|
||||
@@ -141,6 +168,7 @@ export class ShareWithdrawalRequestComponent implements OnInit {
|
||||
if (!this.resolutionNumber.trim()) return false;
|
||||
if (!this.meetingDate) return false;
|
||||
if (!this.settlementPaymentTypeId) return false;
|
||||
if (this.settlementMode === 'GL' && !this.settlementGlAccountId) return false;
|
||||
return true;
|
||||
}
|
||||
|
||||
@@ -160,11 +188,18 @@ export class ShareWithdrawalRequestComponent implements OnInit {
|
||||
pass: shares > 0 && shares <= held,
|
||||
detail: `${shares} of ${held} shares held`
|
||||
},
|
||||
{
|
||||
label: 'Linked savings account confirmed',
|
||||
pass: !!this.account?.savingsAccountNumber,
|
||||
detail: this.account?.savingsAccountNumber || 'No linked savings account — settlement cannot run automatically'
|
||||
},
|
||||
this.settlementMode === 'GL'
|
||||
? {
|
||||
label: 'Settlement GL Account selected',
|
||||
pass: !!this.settlementGlAccountId,
|
||||
detail: this.settlementGlAccountId ? this.selectedSettlementGlName : 'Missing'
|
||||
}
|
||||
: {
|
||||
label: 'Linked savings account confirmed',
|
||||
pass: !!this.account?.savingsAccountNumber,
|
||||
detail:
|
||||
this.account?.savingsAccountNumber || 'No linked savings account — settlement cannot run automatically'
|
||||
},
|
||||
{
|
||||
label: 'Settlement Payment Type selected (non-cash)',
|
||||
pass: this.settlementPaymentTypeName !== '—',
|
||||
@@ -214,11 +249,37 @@ export class ShareWithdrawalRequestComponent implements OnInit {
|
||||
.pipe(catchError(() => of([])))
|
||||
.subscribe((types: any[]) => (this.paymentTypes = types ?? []));
|
||||
|
||||
this.toGlAccountControl.valueChanges.subscribe((id: any) => {
|
||||
this.settlementGlAccountId = id ? Number(id) : null;
|
||||
});
|
||||
|
||||
if (this.requestId && this.mode === 'review') {
|
||||
this.loadReviewRequest(this.requestId);
|
||||
}
|
||||
}
|
||||
|
||||
/** Flips the settlement destination. Switching away from GL clears whatever was picked so a
|
||||
* stale GL id can never ride along on a SAVINGS submission. */
|
||||
onSettlementModeChange(mode: 'SAVINGS' | 'GL'): void {
|
||||
this.settlementMode = mode;
|
||||
if (mode === 'GL') {
|
||||
this.loadGlAccounts();
|
||||
} else {
|
||||
this.settlementGlAccountId = null;
|
||||
this.toGlAccountControl.setValue('');
|
||||
}
|
||||
}
|
||||
|
||||
/** Fetched on first use rather than with the page, since most withdrawals settle to savings. */
|
||||
private loadGlAccounts(): void {
|
||||
if (this.glAccountsData.length) {
|
||||
return;
|
||||
}
|
||||
this.accountingService.getGlAccounts().subscribe((accounts: GLAccount[]) => {
|
||||
this.glAccountsData = accounts ?? [];
|
||||
});
|
||||
}
|
||||
|
||||
onAccountSelected(accountId: string): void {
|
||||
this.selectedAccountId = accountId;
|
||||
if (!accountId) {
|
||||
@@ -246,6 +307,11 @@ export class ShareWithdrawalRequestComponent implements OnInit {
|
||||
this.resolutionNumber = req.resolution_number ?? '';
|
||||
this.meetingDate = req.meeting_date ? String(req.meeting_date).split('T')[0].split(' ')[0] : this.meetingDate;
|
||||
this.description = req.description ?? '';
|
||||
this.settlementMode = req.settlement_mode === 'GL' ? 'GL' : 'SAVINGS';
|
||||
this.settlementGlAccountId = req.settlement_gl_account_id ? Number(req.settlement_gl_account_id) : null;
|
||||
if (this.settlementMode === 'GL') {
|
||||
this.loadGlAccounts();
|
||||
}
|
||||
|
||||
if (req.activity_log) {
|
||||
try {
|
||||
@@ -289,7 +355,9 @@ export class ShareWithdrawalRequestComponent implements OnInit {
|
||||
resolutionNumber: this.resolutionNumber.trim(),
|
||||
meetingDate: this.meetingDate,
|
||||
description: this.description,
|
||||
settlementPaymentTypeId: this.settlementPaymentTypeId
|
||||
settlementPaymentTypeId: this.settlementPaymentTypeId,
|
||||
settlementMode: this.settlementMode,
|
||||
...(this.settlementMode === 'GL' ? { settlementGlAccountId: this.settlementGlAccountId } : {})
|
||||
};
|
||||
this.wdService.submit(payload).subscribe({
|
||||
next: () => {
|
||||
|
||||
@@ -643,8 +643,9 @@ export class ClientGeneralStepComponent implements OnInit, OnDestroy, OnChanges
|
||||
this.createClientForm.get('degreeQualificationId')?.setValue('');
|
||||
}
|
||||
});
|
||||
// Fetch all constitution options from code ID 17
|
||||
this.clientService.getCodeValuesById(17).subscribe((options) => {
|
||||
// Constitution options by code NAME, never by id: code ids differ per tenant (on abc_bank id 17 is the empty
|
||||
// ClientClassification code and Constitution is id 24), so a hardcoded id left the dropdown empty.
|
||||
this.clientService.getCodeValuesByName('Constitution').subscribe((options) => {
|
||||
if (options?.length) {
|
||||
this.constitutionOptions = options;
|
||||
// Sort master by value length descending so longer/more-specific keys match first
|
||||
|
||||
@@ -1321,6 +1321,11 @@
|
||||
kycForm.get('kycDocumentNumber')?.hasError('pattern') && kycForm.get('kycDocumentNumber')?.touched
|
||||
) {
|
||||
<mat-error>Only letters, numbers, hyphens and slashes allowed</mat-error>
|
||||
} @else if (
|
||||
kycForm.get('kycDocumentNumber')?.hasError('aadhaarLast4Mismatch') &&
|
||||
kycForm.get('kycDocumentNumber')?.touched
|
||||
) {
|
||||
<mat-error>Last 4 digits do not match the Aadhaar number entered above</mat-error>
|
||||
}
|
||||
</mat-form-field>
|
||||
|
||||
|
||||
@@ -8,7 +8,14 @@
|
||||
|
||||
import { Component, Input, OnInit, OnChanges, OnDestroy, SimpleChanges, inject } from '@angular/core';
|
||||
import { forkJoin, catchError, of } from 'rxjs';
|
||||
import { UntypedFormBuilder, UntypedFormGroup, Validators, FormsModule } from '@angular/forms';
|
||||
import {
|
||||
UntypedFormBuilder,
|
||||
UntypedFormGroup,
|
||||
Validators,
|
||||
FormsModule,
|
||||
AbstractControl,
|
||||
ValidationErrors
|
||||
} from '@angular/forms';
|
||||
import {
|
||||
MatDialog,
|
||||
MAT_DIALOG_DATA,
|
||||
@@ -567,6 +574,28 @@ export class ClientKycStepComponent implements OnInit, OnChanges, OnDestroy {
|
||||
/** Existing signature document ID (for re-upload/delete) */
|
||||
existingSignatureDocId: string = '';
|
||||
|
||||
/**
|
||||
* Cross-field check for the OVD "Document Number" field (kycDocumentNumber): when Aadhaar Card
|
||||
* is the selected KYC document, its value must identify the same Aadhaar as the aadhaarNumber
|
||||
* field captured earlier in this step - the last 4 digits are what's compared, since
|
||||
* aadhaarNumber may hold either the raw 12-digit number or a masked value (masking only ever
|
||||
* obscures the first 8 digits - see aadhaarMasked in the kycData getter below - so the last 4
|
||||
* characters are always the real digits either way). Not applicable to any other document type,
|
||||
* where kycDocumentNumber is unrelated to Aadhaar entirely.
|
||||
*/
|
||||
private aadhaarLast4MatchValidator = (control: AbstractControl): ValidationErrors | null => {
|
||||
if (this.selectedKycDoc?.code !== 'AADHAAR') {
|
||||
return null;
|
||||
}
|
||||
const docNumber = (control.value || '').toString().trim();
|
||||
const aadhaarValue = (control.parent?.get('aadhaarNumber')?.value || '').toString().trim();
|
||||
if (docNumber.length < 4 || aadhaarValue.length < 4) {
|
||||
// Required/pattern validators already flag an empty or too-short value on their own.
|
||||
return null;
|
||||
}
|
||||
return docNumber.slice(-4) === aadhaarValue.slice(-4) ? null : { aadhaarLast4Mismatch: true };
|
||||
};
|
||||
|
||||
/** KYC Form */
|
||||
kycForm: UntypedFormGroup = this.formBuilder.group({
|
||||
hasPan: [true],
|
||||
@@ -616,7 +645,8 @@ export class ClientKycStepComponent implements OnInit, OnChanges, OnDestroy {
|
||||
[
|
||||
Validators.required,
|
||||
Validators.pattern(/^[A-Za-z0-9\-\/\s]+$/),
|
||||
Validators.maxLength(30)
|
||||
Validators.maxLength(30),
|
||||
this.aadhaarLast4MatchValidator
|
||||
]
|
||||
],
|
||||
kycDocIssueDate: [''],
|
||||
@@ -739,6 +769,14 @@ export class ClientKycStepComponent implements OnInit, OnChanges, OnDestroy {
|
||||
this.kycForm.get('ecgcSalFlag')?.disable();
|
||||
this.kycForm.get('dormantFlag')?.disable();
|
||||
}
|
||||
|
||||
// aadhaarLast4MatchValidator (on kycDocumentNumber) reads this control's value directly rather
|
||||
// than through its own valueChanges, so a re-check has to be triggered explicitly whenever the
|
||||
// Aadhaar field itself changes - otherwise fixing aadhaarNumber after kycDocumentNumber was
|
||||
// already entered would leave a stale mismatch error in place.
|
||||
this.kycForm.get('aadhaarNumber')?.valueChanges.subscribe(() => {
|
||||
this.kycForm.get('kycDocumentNumber')?.updateValueAndValidity({ onlySelf: true });
|
||||
});
|
||||
}
|
||||
|
||||
/** Seed the document-type picker from defaults (entity RBI docs vs. individual OVDs,
|
||||
@@ -1009,6 +1047,9 @@ export class ClientKycStepComponent implements OnInit, OnChanges, OnDestroy {
|
||||
// Reset uploads + merged preview when document type changes
|
||||
this.kycDocFiles = { front: null, back: null };
|
||||
this.kycDocMergedPreview = null;
|
||||
// aadhaarLast4MatchValidator only applies while Aadhaar Card is selected - re-check so switching
|
||||
// to/away from it immediately picks up (or clears) the mismatch error.
|
||||
this.kycForm.get('kycDocumentNumber')?.updateValueAndValidity({ onlySelf: true });
|
||||
}
|
||||
|
||||
isKycDocSelected(proof: ProofType): boolean {
|
||||
@@ -1189,6 +1230,9 @@ export class ClientKycStepComponent implements OnInit, OnChanges, OnDestroy {
|
||||
// Sync chip-picker selection with the prefilled document name
|
||||
if (data.kycDocumentName) {
|
||||
this.selectedKycDoc = this.findKycDocProofByName(data.kycDocumentName);
|
||||
// patchValue above ran kycDocumentNumber's validators before selectedKycDoc was known,
|
||||
// so aadhaarLast4MatchValidator needs a fresh check now that it is.
|
||||
this.kycForm.get('kycDocumentNumber')?.updateValueAndValidity({ onlySelf: true });
|
||||
}
|
||||
// Set verification statuses from existing data
|
||||
if (data.panVerified) {
|
||||
|
||||
@@ -61,6 +61,7 @@ import { KycTabComponent } from './clients-view/kyc-tab/kyc-tab.component';
|
||||
import { CkycTabComponent } from './clients-view/ckyc-tab/ckyc-tab.component';
|
||||
import { Form60TabComponent } from './clients-view/form60-tab/form60-tab.component';
|
||||
import { Form121TabComponent } from './clients-view/form121-tab/form121-tab.component';
|
||||
import { tdsConfigResolver } from '../letter-mgmt/certificates/form-15gh/tds-config.service';
|
||||
import { EntityClassificationTabComponent } from './clients-view/entity-classification-tab/entity-classification-tab.component';
|
||||
import { AuthorizedSignatoriesTabComponent } from './clients-view/authorized-signatories-tab/authorized-signatories-tab.component';
|
||||
import { familyAllowedGuard, nomineeAllowedGuard } from './utils/family-nominee.guard';
|
||||
@@ -198,6 +199,7 @@ const routes: Routes = [
|
||||
{
|
||||
path: 'form121',
|
||||
component: Form121TabComponent,
|
||||
resolve: { tdsConfig: tdsConfigResolver },
|
||||
data: { title: 'Form 121 / TDS', breadcrumb: 'Form 121 / TDS', routeParamBreadcrumb: false }
|
||||
},
|
||||
{
|
||||
|
||||
@@ -202,9 +202,14 @@
|
||||
<div>
|
||||
<strong>Already available</strong>
|
||||
<span class="ckyc-existing__source">from {{ existing.ADDRESS_PROOF.source }}</span>
|
||||
@if (existing.ADDRESS_PROOF.previewUnavailable) {
|
||||
<span class="ckyc-existing__warn">stored file unavailable</span>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
@if (existing.ADDRESS_PROOF.previewUrl || existing.ADDRESS_PROOF.previewUrlBack) {
|
||||
@if (
|
||||
(existing.ADDRESS_PROOF.previewUrl || existing.ADDRESS_PROOF.previewUrlBack) && isImage('ADDRESS_PROOF')
|
||||
) {
|
||||
<div class="ckyc-existing__thumbs">
|
||||
@if (existing.ADDRESS_PROOF.previewUrl) {
|
||||
<img
|
||||
@@ -222,6 +227,17 @@
|
||||
}
|
||||
</div>
|
||||
}
|
||||
@if (existing.ADDRESS_PROOF.previewUrl) {
|
||||
<button
|
||||
mat-stroked-button
|
||||
type="button"
|
||||
class="ckyc-existing__view"
|
||||
(click)="openDocument('ADDRESS_PROOF')"
|
||||
>
|
||||
<fa-icon icon="eye"></fa-icon>
|
||||
View document
|
||||
</button>
|
||||
}
|
||||
<div class="ckyc-existing__meta">
|
||||
<fa-icon icon="file-alt"></fa-icon>
|
||||
<span>{{ existing.ADDRESS_PROOF.name }}</span>
|
||||
@@ -299,9 +315,12 @@
|
||||
<div>
|
||||
<strong>Already available</strong>
|
||||
<span class="ckyc-existing__source">from {{ existing.PHOTO_PROOF.source }}</span>
|
||||
@if (existing.PHOTO_PROOF.previewUnavailable) {
|
||||
<span class="ckyc-existing__warn">stored file unavailable</span>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
@if (existing.PHOTO_PROOF.previewUrl || existing.PHOTO_PROOF.previewUrlBack) {
|
||||
@if ((existing.PHOTO_PROOF.previewUrl || existing.PHOTO_PROOF.previewUrlBack) && isImage('PHOTO_PROOF')) {
|
||||
<div class="ckyc-existing__thumbs">
|
||||
@if (existing.PHOTO_PROOF.previewUrl) {
|
||||
<img
|
||||
@@ -319,6 +338,17 @@
|
||||
}
|
||||
</div>
|
||||
}
|
||||
@if (existing.PHOTO_PROOF.previewUrl) {
|
||||
<button
|
||||
mat-stroked-button
|
||||
type="button"
|
||||
class="ckyc-existing__view"
|
||||
(click)="openDocument('PHOTO_PROOF')"
|
||||
>
|
||||
<fa-icon icon="eye"></fa-icon>
|
||||
View document
|
||||
</button>
|
||||
}
|
||||
<div class="ckyc-existing__meta">
|
||||
<fa-icon icon="id-card"></fa-icon>
|
||||
<span>{{ existing.PHOTO_PROOF.name }}</span>
|
||||
@@ -393,11 +423,25 @@
|
||||
<div>
|
||||
<strong>Already available</strong>
|
||||
<span class="ckyc-existing__source">from {{ existing.CLIENT_IMAGE.source }}</span>
|
||||
@if (existing.CLIENT_IMAGE.previewUnavailable) {
|
||||
<span class="ckyc-existing__warn">stored file unavailable</span>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
@if (existing.CLIENT_IMAGE.previewUrl) {
|
||||
@if (existing.CLIENT_IMAGE.previewUrl && isImage('CLIENT_IMAGE')) {
|
||||
<img [src]="existing.CLIENT_IMAGE.previewUrl" alt="Client photo" class="ckyc-existing__thumb" />
|
||||
}
|
||||
@if (existing.CLIENT_IMAGE.previewUrl) {
|
||||
<button
|
||||
mat-stroked-button
|
||||
type="button"
|
||||
class="ckyc-existing__view"
|
||||
(click)="openDocument('CLIENT_IMAGE')"
|
||||
>
|
||||
<fa-icon icon="eye"></fa-icon>
|
||||
View document
|
||||
</button>
|
||||
}
|
||||
<button
|
||||
mat-stroked-button
|
||||
type="button"
|
||||
@@ -448,15 +492,29 @@
|
||||
<div>
|
||||
<strong>Already available</strong>
|
||||
<span class="ckyc-existing__source">from {{ existing.CLIENT_SIGNATURE.source }}</span>
|
||||
@if (existing.CLIENT_SIGNATURE.previewUnavailable) {
|
||||
<span class="ckyc-existing__warn">stored file unavailable</span>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
@if (existing.CLIENT_SIGNATURE.previewUrl) {
|
||||
@if (existing.CLIENT_SIGNATURE.previewUrl && isImage('CLIENT_SIGNATURE')) {
|
||||
<img
|
||||
[src]="existing.CLIENT_SIGNATURE.previewUrl"
|
||||
alt="Client signature"
|
||||
class="ckyc-existing__thumb ckyc-existing__thumb--wide"
|
||||
/>
|
||||
}
|
||||
@if (existing.CLIENT_SIGNATURE.previewUrl) {
|
||||
<button
|
||||
mat-stroked-button
|
||||
type="button"
|
||||
class="ckyc-existing__view"
|
||||
(click)="openDocument('CLIENT_SIGNATURE')"
|
||||
>
|
||||
<fa-icon icon="eye"></fa-icon>
|
||||
View document
|
||||
</button>
|
||||
}
|
||||
<div class="ckyc-existing__meta">
|
||||
<fa-icon icon="file-signature"></fa-icon>
|
||||
<span>{{ existing.CLIENT_SIGNATURE.name }}</span>
|
||||
|
||||
@@ -623,6 +623,35 @@
|
||||
}
|
||||
}
|
||||
|
||||
/* Opens the uploaded artefact full size in a new tab. Sits directly under the thumbnail, and is
|
||||
the only way to inspect a PDF - which cannot render as an inline <img>. */
|
||||
.ckyc-existing__view {
|
||||
align-self: flex-start;
|
||||
color: #1d6fd0;
|
||||
border-color: #bcd8f5;
|
||||
background: #fff;
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
|
||||
&:hover {
|
||||
background: #eef6ff;
|
||||
}
|
||||
}
|
||||
|
||||
/* Shown when a document row exists but its file could not be fetched from the content store,
|
||||
so "Already available" is not silently misleading. */
|
||||
.ckyc-existing__warn {
|
||||
display: inline-block;
|
||||
margin-left: 8px;
|
||||
padding: 1px 8px;
|
||||
border-radius: 10px;
|
||||
background: #fdecec;
|
||||
border: 1px solid #f3c2c2;
|
||||
color: #a12b2b;
|
||||
font-size: 11px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.ckyc-existing {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
@@ -36,11 +36,41 @@ interface ExistingArtefact {
|
||||
* already writes/reads for address proof; now shared by the photo/identity proof too. */
|
||||
description?: string;
|
||||
fileCount?: number;
|
||||
/** Set when the stored file could not be fetched - the row exists but its content is gone. */
|
||||
previewUnavailable?: boolean;
|
||||
/** Stored MIME type, so the card knows whether it can render an inline thumbnail. */
|
||||
mimeType?: string;
|
||||
}
|
||||
|
||||
type ProofKind = 'ADDRESS_PROOF' | 'PHOTO_PROOF';
|
||||
type CkycDocKind = ProofKind | 'CLIENT_IMAGE' | 'CLIENT_SIGNATURE';
|
||||
|
||||
/**
|
||||
* Client-side upload guards, kept deliberately in step with the backend so a file that passes here
|
||||
* is not rejected server-side:
|
||||
* - 5 MB matches `spring.servlet.multipart.max-file-size`
|
||||
* - the extension list is the intersection of the backend `fineract.content.regex-whitelist`
|
||||
* with what these cards can actually render.
|
||||
* The dialog's `accept=` is only a file-picker hint and is trivially bypassed, so the real check
|
||||
* runs here, on the file the dialog hands back, before anything is sent.
|
||||
*/
|
||||
const MAX_UPLOAD_BYTES = 5 * 1024 * 1024;
|
||||
const IMAGE_EXTENSIONS = [
|
||||
'png',
|
||||
'jpeg',
|
||||
'jpg'
|
||||
];
|
||||
const DOCUMENT_EXTENSIONS = [
|
||||
...IMAGE_EXTENSIONS,
|
||||
'pdf'
|
||||
];
|
||||
|
||||
/** Cards that render an inline <img>, so a PDF would not display in them. */
|
||||
const IMAGE_ONLY_KINDS: CkycDocKind[] = [
|
||||
'CLIENT_IMAGE',
|
||||
'CLIENT_SIGNATURE'
|
||||
];
|
||||
|
||||
@Component({
|
||||
selector: 'mifosx-ckyc-tab',
|
||||
templateUrl: './ckyc-tab.component.html',
|
||||
@@ -150,6 +180,11 @@ export class CkycTabComponent implements OnInit, OnDestroy {
|
||||
ngOnInit(): void {
|
||||
this.route.parent.params.subscribe((params: any) => {
|
||||
this.clientId = params['clientId'];
|
||||
// Angular reuses this component when only the clientId in the route changes, and
|
||||
// loadExistingArtefacts() only ever *assigns* what it finds - it has no "not found" branch.
|
||||
// Without clearing first, a client with no photo (or no signature, or no proof) keeps showing
|
||||
// the previous client's card.
|
||||
this.resetArtefactState();
|
||||
this.loadClientInfo();
|
||||
this.loadAccounts();
|
||||
this.loadCkycData();
|
||||
@@ -157,6 +192,46 @@ export class CkycTabComponent implements OnInit, OnDestroy {
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Returns every per-client card to its empty state, so nothing from the client just viewed can
|
||||
* survive into the next one. Covers all four cards plus the details staged for an upload - a file
|
||||
* or document number left over from another client must never be submitted against this one.
|
||||
*/
|
||||
private resetArtefactState(): void {
|
||||
this.revokePreviewUrls();
|
||||
this.existing = {
|
||||
ADDRESS_PROOF: { present: false },
|
||||
PHOTO_PROOF: { present: false },
|
||||
CLIENT_IMAGE: { present: false },
|
||||
CLIENT_SIGNATURE: { present: false }
|
||||
};
|
||||
this.selectedProofType = { ADDRESS_PROOF: null, PHOTO_PROOF: null };
|
||||
this.docFiles = {
|
||||
ADDRESS_PROOF: { front: null, back: null },
|
||||
PHOTO_PROOF: { front: null, back: null }
|
||||
};
|
||||
this.documentDetails = {
|
||||
ADDRESS_PROOF: { documentKey: '', issueDate: null, expiryDate: null },
|
||||
PHOTO_PROOF: { documentKey: '', issueDate: null, expiryDate: null }
|
||||
};
|
||||
this.clientImageFile = null;
|
||||
this.clientSignatureFile = null;
|
||||
this.uploadErrors = {
|
||||
ADDRESS_PROOF: null,
|
||||
PHOTO_PROOF: null,
|
||||
CLIENT_IMAGE: null,
|
||||
CLIENT_SIGNATURE: null
|
||||
};
|
||||
}
|
||||
|
||||
/** Frees the blob URLs held by the current cards before their references are dropped. */
|
||||
private revokePreviewUrls(): void {
|
||||
Object.values(this.existing).forEach((e) => {
|
||||
if (e.previewUrl?.startsWith('blob:')) URL.revokeObjectURL(e.previewUrl);
|
||||
if (e.previewUrlBack?.startsWith('blob:')) URL.revokeObjectURL(e.previewUrlBack);
|
||||
});
|
||||
}
|
||||
|
||||
private loadClientInfo(): void {
|
||||
this.route.parent.data.subscribe((data: any) => {
|
||||
const cv = data?.clientViewData;
|
||||
@@ -280,19 +355,29 @@ export class CkycTabComponent implements OnInit, OnDestroy {
|
||||
present: true,
|
||||
source: 'Client registration',
|
||||
name: signatureDoc.fileName || 'Client signature',
|
||||
documentId: signatureDoc.id
|
||||
documentId: signatureDoc.id,
|
||||
mimeType: signatureDoc.type
|
||||
};
|
||||
// Fetch blob for preview
|
||||
// Same endpoint getClientSignatureImage() uses, but opted out of the global error alert:
|
||||
// a m_document row whose file is no longer in the content store returns 500, and the card
|
||||
// below reports that itself. Without `silent` the interceptor pops an "Internal Server
|
||||
// Error" modal on every page load, for a failure the user cannot act on.
|
||||
this.clientsService
|
||||
.getClientSignatureImage(this.clientId, signatureDoc.id)
|
||||
.downloadClientDocument(this.clientId, String(signatureDoc.id), true)
|
||||
.pipe(takeUntil(this.destroy$))
|
||||
.subscribe({
|
||||
next: (blob: any) => {
|
||||
if (blob) {
|
||||
if (blob && blob.size > 0) {
|
||||
this.existing.CLIENT_SIGNATURE.previewUrl = URL.createObjectURL(blob);
|
||||
} else {
|
||||
// A 200 with an empty body still means there is nothing to show. Without this the
|
||||
// card would claim "Already available" with no thumbnail and no explanation.
|
||||
this.existing.CLIENT_SIGNATURE.previewUnavailable = true;
|
||||
}
|
||||
},
|
||||
error: () => undefined
|
||||
error: () => {
|
||||
this.existing.CLIENT_SIGNATURE.previewUnavailable = true;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
@@ -364,6 +449,7 @@ export class CkycTabComponent implements OnInit, OnDestroy {
|
||||
const list = Array.isArray(docs) ? docs : [];
|
||||
if (!list.length) return;
|
||||
this.existing[kind].fileCount = list.length;
|
||||
this.existing[kind].previewUnavailable = false;
|
||||
|
||||
const byNewest = (a: any, b: any) => b.id - a.id;
|
||||
const label = (d: any) => (d?.name || d?.fileName || '').toString();
|
||||
@@ -372,6 +458,9 @@ export class CkycTabComponent implements OnInit, OnDestroy {
|
||||
[...list].filter((d: any) => /front/i.test(label(d))).sort(byNewest)[0] ||
|
||||
[...list].filter((d: any) => d.id !== back?.id).sort(byNewest)[0];
|
||||
|
||||
// A proof can be scanned to PDF, which no <img> can render - remember what was stored so the
|
||||
// card offers "View document" instead of a broken thumbnail.
|
||||
if (front) this.existing[kind].mimeType = front.type;
|
||||
if (front) this.downloadIdentifierDocPreview(identifierId, front.id, kind, 'front');
|
||||
if (back && back.id !== front?.id) this.downloadIdentifierDocPreview(identifierId, back.id, kind, 'back');
|
||||
});
|
||||
@@ -388,12 +477,19 @@ export class CkycTabComponent implements OnInit, OnDestroy {
|
||||
.pipe(takeUntil(this.destroy$))
|
||||
.subscribe({
|
||||
next: (blob: any) => {
|
||||
if (!blob) return;
|
||||
if (!blob || blob.size === 0) {
|
||||
this.existing[kind].previewUnavailable = true;
|
||||
return;
|
||||
}
|
||||
const url = URL.createObjectURL(blob);
|
||||
if (slot === 'front') this.existing[kind].previewUrl = url;
|
||||
else this.existing[kind].previewUrlBack = url;
|
||||
},
|
||||
error: () => undefined
|
||||
// The row exists but its file is gone from the content store. Saying so on the card beats
|
||||
// showing "Already available" next to a blank space.
|
||||
error: () => {
|
||||
this.existing[kind].previewUnavailable = true;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
@@ -452,6 +548,18 @@ export class CkycTabComponent implements OnInit, OnDestroy {
|
||||
|
||||
ref.afterClosed().subscribe((result: CkycUploadDialogResult | null) => {
|
||||
if (!result) return;
|
||||
|
||||
// The dialog's `accept=` filter is only a hint to the file picker and is trivially bypassed,
|
||||
// so the size/type guard runs here on what actually came back. Catching it now turns a raw
|
||||
// server rejection into a message on the card.
|
||||
const rejection =
|
||||
this.validationError(result.front, kind) ?? (result.back ? this.validationError(result.back, kind) : null);
|
||||
if (rejection) {
|
||||
this.uploadErrors[kind] = rejection;
|
||||
return;
|
||||
}
|
||||
this.uploadErrors[kind] = null;
|
||||
|
||||
if (isProofKind) {
|
||||
const proofKind = kind as ProofKind;
|
||||
this.selectedProofType[proofKind] = result.proofType || null;
|
||||
@@ -470,6 +578,66 @@ export class CkycTabComponent implements OnInit, OnDestroy {
|
||||
});
|
||||
}
|
||||
|
||||
/** Extensions a given card can both store and render. */
|
||||
private allowedExtensions(kind: CkycDocKind): string[] {
|
||||
return IMAGE_ONLY_KINDS.includes(kind) ? IMAGE_EXTENSIONS : DOCUMENT_EXTENSIONS;
|
||||
}
|
||||
|
||||
/**
|
||||
* Rejects a file the backend would refuse (or the card could not render) before it is uploaded,
|
||||
* so the user gets a clear message instead of a raw server error. Returns null when the file is
|
||||
* acceptable.
|
||||
*/
|
||||
private validationError(file: File | null | undefined, kind: CkycDocKind): string | null {
|
||||
if (!file) {
|
||||
return null;
|
||||
}
|
||||
const allowed = this.allowedExtensions(kind);
|
||||
const extension = (file.name.split('.').pop() || '').toLowerCase();
|
||||
|
||||
if (!allowed.includes(extension)) {
|
||||
return `Unsupported file type ".${extension}". Allowed: ${allowed.map((e) => e.toUpperCase()).join(', ')}.`;
|
||||
}
|
||||
if (file.size > MAX_UPLOAD_BYTES) {
|
||||
const mb = (file.size / (1024 * 1024)).toFixed(1);
|
||||
return `File is ${mb} MB. The maximum allowed size is 5 MB.`;
|
||||
}
|
||||
if (file.size === 0) {
|
||||
return 'The selected file is empty.';
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
/**
|
||||
* True when the stored file can be shown as an inline thumbnail. A PDF cannot, so its card falls
|
||||
* back to the "View document" button alone rather than rendering a broken image.
|
||||
*/
|
||||
isImage(kind: CkycDocKind): boolean {
|
||||
const entry = this.existing[kind];
|
||||
// The profile image arrives as a `data:image/...;base64,` URL, which declares its own type -
|
||||
// it has neither a stored MIME type nor a file extension for the checks below to read.
|
||||
if (entry?.previewUrl?.startsWith('data:')) {
|
||||
return entry.previewUrl.startsWith('data:image/');
|
||||
}
|
||||
if (entry?.mimeType) {
|
||||
return entry.mimeType.startsWith('image/');
|
||||
}
|
||||
// Older rows can have no stored MIME type - fall back to the file extension.
|
||||
const extension = (entry?.name?.split('.').pop() || '').toLowerCase();
|
||||
return IMAGE_EXTENSIONS.includes(extension);
|
||||
}
|
||||
|
||||
/**
|
||||
* Opens the uploaded document full size in a new tab. Uses the blob already fetched for the
|
||||
* thumbnail, so it works for PDFs too and costs no extra request.
|
||||
*/
|
||||
openDocument(kind: CkycDocKind): void {
|
||||
const url = this.existing[kind]?.previewUrl;
|
||||
if (url) {
|
||||
window.open(url, '_blank', 'noopener');
|
||||
}
|
||||
}
|
||||
|
||||
/** Reads back the "Issue date: yyyy-MM-dd, Expiry date: yyyy-MM-dd" convention this tab (and
|
||||
* client-india-address-step, for address proof) writes into the identifier's description. */
|
||||
private parseDescriptionDates(description: string | undefined): { issueDate: Date | null; expiryDate: Date | null } {
|
||||
@@ -533,6 +701,10 @@ export class CkycTabComponent implements OnInit, OnDestroy {
|
||||
request$.pipe(takeUntil(this.destroy$)).subscribe({
|
||||
next: () => {
|
||||
this.uploading[documentType] = false;
|
||||
// The card is gated on `present`; without this a successful upload left it reading
|
||||
// "Not uploaded yet". uploadProofDocument() sets the same flag for the proof cards.
|
||||
this.existing[key].present = true;
|
||||
this.existing[key].source = this.existing[key].source || 'CKYC upload';
|
||||
this.alertService.alert({ type: 'success', message: 'Document uploaded successfully.' });
|
||||
this.refreshPreview(documentType);
|
||||
},
|
||||
@@ -653,13 +825,22 @@ export class CkycTabComponent implements OnInit, OnDestroy {
|
||||
if (this.existing[staleKey].previewUrlBack?.startsWith('blob:')) {
|
||||
URL.revokeObjectURL(this.existing[staleKey].previewUrlBack!);
|
||||
}
|
||||
// The upload that triggered this refresh is what repairs a previously missing file, so the
|
||||
// warning has to be cleared before the re-read - otherwise a fixed card keeps the old badge.
|
||||
this.existing[staleKey].previewUrl = undefined;
|
||||
this.existing[staleKey].previewUrlBack = undefined;
|
||||
this.existing[staleKey].previewUnavailable = false;
|
||||
switch (documentType) {
|
||||
case 'CLIENT_IMAGE':
|
||||
this.clientsService
|
||||
.getClientProfileImage(this.clientId)
|
||||
.pipe(takeUntil(this.destroy$))
|
||||
.subscribe((photo: any) => {
|
||||
if (photo) this.existing.CLIENT_IMAGE.previewUrl = photo;
|
||||
if (photo) {
|
||||
this.existing.CLIENT_IMAGE.previewUrl = photo;
|
||||
} else {
|
||||
this.existing.CLIENT_IMAGE.previewUnavailable = true;
|
||||
}
|
||||
});
|
||||
break;
|
||||
case 'CLIENT_SIGNATURE':
|
||||
@@ -672,11 +853,21 @@ export class CkycTabComponent implements OnInit, OnDestroy {
|
||||
?.sort((a: any, b: any) => b.id - a.id)?.[0];
|
||||
if (!doc) return;
|
||||
this.existing.CLIENT_SIGNATURE.documentId = doc.id;
|
||||
this.existing.CLIENT_SIGNATURE.mimeType = doc.type;
|
||||
this.clientsService
|
||||
.getClientSignatureImage(this.clientId, doc.id)
|
||||
.downloadClientDocument(this.clientId, String(doc.id), true)
|
||||
.pipe(takeUntil(this.destroy$))
|
||||
.subscribe((blob: any) => {
|
||||
if (blob) this.existing.CLIENT_SIGNATURE.previewUrl = URL.createObjectURL(blob);
|
||||
.subscribe({
|
||||
next: (blob: any) => {
|
||||
if (blob && blob.size > 0) {
|
||||
this.existing.CLIENT_SIGNATURE.previewUrl = URL.createObjectURL(blob);
|
||||
} else {
|
||||
this.existing.CLIENT_SIGNATURE.previewUnavailable = true;
|
||||
}
|
||||
},
|
||||
error: () => {
|
||||
this.existing.CLIENT_SIGNATURE.previewUnavailable = true;
|
||||
}
|
||||
});
|
||||
});
|
||||
break;
|
||||
@@ -690,10 +881,6 @@ export class CkycTabComponent implements OnInit, OnDestroy {
|
||||
ngOnDestroy(): void {
|
||||
this.destroy$.next();
|
||||
this.destroy$.complete();
|
||||
// Release object URLs
|
||||
Object.values(this.existing).forEach((e) => {
|
||||
if (e.previewUrl?.startsWith('blob:')) URL.revokeObjectURL(e.previewUrl);
|
||||
if (e.previewUrlBack?.startsWith('blob:')) URL.revokeObjectURL(e.previewUrlBack);
|
||||
});
|
||||
this.revokePreviewUrls();
|
||||
}
|
||||
}
|
||||
|
||||
@@ -55,7 +55,10 @@
|
||||
<div class="f121__note">
|
||||
<mat-icon>info_outline</mat-icon>
|
||||
<div>
|
||||
@if (!dateOfBirth) {
|
||||
@if (configMissing) {
|
||||
TDS rates for FY {{ fy }} are not configured, so the tax cannot be computed. Set them up under Organization
|
||||
› TDS Configuration.
|
||||
} @else if (!dateOfBirth) {
|
||||
Date of birth is not on record, so the senior-citizen threshold cannot be determined. Add it on the Personal
|
||||
Data tab.
|
||||
} @else {
|
||||
@@ -113,8 +116,8 @@
|
||||
<div class="f121__note f121__note--warn">
|
||||
<mat-icon>warning_amber</mat-icon>
|
||||
<div>
|
||||
A Form 121 declaration is on record for this year, but withholding is still switched on for one or more
|
||||
deposits. Turn it off on those accounts, or tax will keep being deducted.
|
||||
A declaration is on record for this year, but one or more deposits still carry a tax group. Those accounts
|
||||
deduct on their own and ignore the declaration — remove the tax group from them.
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
@@ -189,20 +192,90 @@
|
||||
}
|
||||
</span>
|
||||
</div>
|
||||
@if (declarationOnRecord && declarationFy) {
|
||||
@if (declarationRecord; as d) {
|
||||
<div class="f121__kv-row">
|
||||
<span>Declared for</span>
|
||||
<span>FY {{ declarationFy }}</span>
|
||||
<span>FY {{ d.fy }} · Form {{ d.formType }}</span>
|
||||
</div>
|
||||
}
|
||||
@if (declarationOnRecord && !acceptanceDateKnown) {
|
||||
<div class="f121__kv-row f121__kv-row--muted">
|
||||
<span>Acceptance date</span>
|
||||
<div class="f121__kv-row">
|
||||
<span>Accepted on</span>
|
||||
<span>
|
||||
Not captured — the declaration is treated as covering the whole year. A mid-year acceptance would change
|
||||
the figures below.
|
||||
{{ d.acceptedOn | date: 'd MMM y' }} — no TDS on interest credited from this day to 31 March. Interest
|
||||
credited before it is taxed as usual.
|
||||
</span>
|
||||
</div>
|
||||
@if (d.uin) {
|
||||
<div class="f121__kv-row">
|
||||
<span>UIN</span>
|
||||
<span class="f121__mono">{{ d.uin }}</span>
|
||||
</div>
|
||||
}
|
||||
<div class="f121__kv-row">
|
||||
<span></span>
|
||||
<span>
|
||||
<button type="button" class="f121__btn f121__btn--warn" (click)="revokeDeclaration()">
|
||||
Withdraw declaration
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
} @else if (fy && !configMissing) {
|
||||
<div class="f121__kv-row">
|
||||
<span></span>
|
||||
<span>
|
||||
@if (!showDeclarationForm) {
|
||||
<button type="button" class="f121__btn" (click)="openDeclarationForm()" [disabled]="!panWellFormed">
|
||||
Record {{ formLabel }} for FY {{ fy }}
|
||||
</button>
|
||||
@if (!panWellFormed) {
|
||||
<div class="muted">A valid PAN must be on the KYC first — a declaration without one is void.</div>
|
||||
}
|
||||
}
|
||||
</span>
|
||||
</div>
|
||||
@if (showDeclarationForm) {
|
||||
<div class="f121__decl-form">
|
||||
<label>
|
||||
<span>Accepted on *</span>
|
||||
<input type="date" [(ngModel)]="newDeclaration.acceptedOn" />
|
||||
</label>
|
||||
<label>
|
||||
<span>UIN</span>
|
||||
<input type="text" [(ngModel)]="newDeclaration.uin" placeholder="Allotted on acceptance" />
|
||||
</label>
|
||||
<label>
|
||||
<span>Estimated income for the year (₹)</span>
|
||||
<input type="number" min="0" [(ngModel)]="newDeclaration.estimatedIncome" />
|
||||
</label>
|
||||
@if (declarationError) {
|
||||
<div class="f121__note f121__note--warn">
|
||||
<mat-icon>error_outline</mat-icon>
|
||||
<div>{{ declarationError }}</div>
|
||||
</div>
|
||||
}
|
||||
<div class="f121__decl-actions">
|
||||
<button type="button" class="f121__btn" (click)="showDeclarationForm = false">Cancel</button>
|
||||
<button
|
||||
type="button"
|
||||
class="f121__btn f121__btn--primary"
|
||||
(click)="saveDeclaration()"
|
||||
[disabled]="savingDeclaration"
|
||||
>
|
||||
{{ savingDeclaration ? 'Saving…' : 'Save declaration' }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
@for (old of declarations; track old.id) {
|
||||
@if (old.revoked && old.fy === fy) {
|
||||
<div class="f121__kv-row f121__kv-row--muted">
|
||||
<span>Withdrawn</span>
|
||||
<span>
|
||||
Form {{ old.formType }} accepted {{ old.acceptedOn | date: 'd MMM y' }}, withdrawn
|
||||
{{ old.revokedOn | date: 'd MMM y' }} — {{ old.revokeReason }}
|
||||
</span>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
@if (eligibility) {
|
||||
@for (reason of eligibility.reasons; track reason) {
|
||||
|
||||
@@ -332,3 +332,61 @@
|
||||
font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
/* ── Recording a declaration ── */
|
||||
.f121__btn {
|
||||
padding: 6px 14px;
|
||||
border: 1px solid #d1d5db;
|
||||
border-radius: 6px;
|
||||
background: #fff;
|
||||
font: inherit;
|
||||
font-size: 12.5px;
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
|
||||
&:disabled {
|
||||
opacity: 0.55;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
&--primary {
|
||||
border-color: #1d4ed8;
|
||||
background: #1d4ed8;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
&--warn {
|
||||
border-color: #b45309;
|
||||
color: #b45309;
|
||||
}
|
||||
}
|
||||
|
||||
.f121__decl-form {
|
||||
display: grid;
|
||||
gap: 10px;
|
||||
padding: 12px 16px;
|
||||
|
||||
label {
|
||||
display: grid;
|
||||
gap: 4px;
|
||||
font-size: 12px;
|
||||
|
||||
span {
|
||||
color: #6b7280;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
input {
|
||||
max-width: 280px;
|
||||
padding: 6px 8px;
|
||||
border: 1px solid #d1d5db;
|
||||
border-radius: 6px;
|
||||
font: inherit;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.f121__decl-actions {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
@@ -23,6 +23,8 @@ import { SavingsService } from 'app/savings/savings.service';
|
||||
import { FixedDepositsService } from 'app/deposits/fixed-deposits/fixed-deposits.service';
|
||||
import { RecurringDepositsService } from 'app/deposits/recurring-deposits/recurring-deposits.service';
|
||||
import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
|
||||
import { TdsDeclarationRecord, TdsReportsService } from 'app/tds-reports/tds-reports.service';
|
||||
import { TdsDeductee } from 'app/tds-reports/tds-reports-data';
|
||||
|
||||
/** Domain logic */
|
||||
import {
|
||||
@@ -111,6 +113,7 @@ export class Form121TabComponent implements OnInit, OnDestroy {
|
||||
private savingsService = inject(SavingsService);
|
||||
private fixedDepositsService = inject(FixedDepositsService);
|
||||
private recurringDepositsService = inject(RecurringDepositsService);
|
||||
private tdsService = inject(TdsReportsService);
|
||||
|
||||
private destroy$ = new Subject<void>();
|
||||
|
||||
@@ -124,23 +127,25 @@ export class Form121TabComponent implements OnInit, OnDestroy {
|
||||
pan = '';
|
||||
panWellFormed = false;
|
||||
|
||||
// ── Declaration on record ──
|
||||
declarationOnRecord = false;
|
||||
// ── Declarations on record ──
|
||||
/**
|
||||
* Every declaration the customer has given, each for one year and from the day the branch
|
||||
* accepted it. The KYC record only ever held a type and a year, which made a September
|
||||
* declaration shield interest back to April and let last year's form run on.
|
||||
*/
|
||||
declarations: TdsDeclarationRecord[] = [];
|
||||
/**
|
||||
* The form actually in force for the selected year. From FY 2026-27 a single
|
||||
* Form 121 replaced the 15G/15H split, so this is derived from the year rather
|
||||
* than from the payee's age.
|
||||
*/
|
||||
declarationForm: DeclarationForm = '121';
|
||||
/** Kind recorded at KYC, meaningful only for a pre-2026 year. */
|
||||
declarationKind: '15G' | '15H' = '15G';
|
||||
declarationFy = '';
|
||||
/**
|
||||
* The KYC step records only the year, not the date the branch accepted the
|
||||
* declaration, so it has to be treated as covering the whole year. Surfaced on
|
||||
* screen rather than hidden — a mid-year acceptance would change the figures.
|
||||
*/
|
||||
acceptanceDateKnown = false;
|
||||
|
||||
// ── Recording a declaration ──
|
||||
showDeclarationForm = false;
|
||||
savingDeclaration = false;
|
||||
declarationError = '';
|
||||
newDeclaration = { acceptedOn: '', uin: '', estimatedIncome: null as number | null };
|
||||
|
||||
eligibility: EligibilityResult | null = null;
|
||||
|
||||
@@ -153,11 +158,13 @@ export class Form121TabComponent implements OnInit, OnDestroy {
|
||||
schedule: TdsSchedule | null = null;
|
||||
actualTds = 0;
|
||||
tdsSaved = 0;
|
||||
/** The selected year has no entry on Organization › TDS Configuration. */
|
||||
configMissing = false;
|
||||
|
||||
/** Raw account inputs, kept so the year selector can recompute cheaply. */
|
||||
private accountInputs: (TdsAccountInput & { meta: Form121AccountRow })[] = [];
|
||||
/** Withheld-tax postings by FY, from the ledger. */
|
||||
private actualTdsByFy = new Map<string, number>();
|
||||
private accountInputs: (TdsAccountInput & { meta: Form121AccountRow; taxLines: InterestCredit[] })[] = [];
|
||||
/** This customer's FD/RD interest received in savings, and TDS taken there, per year. */
|
||||
private platformByFy = new Map<string, TdsDeductee | null>();
|
||||
|
||||
ngOnInit(): void {
|
||||
this.route.parent.params.pipe(takeUntil(this.destroy$)).subscribe((params: any) => {
|
||||
@@ -180,13 +187,15 @@ export class Form121TabComponent implements OnInit, OnDestroy {
|
||||
forkJoin({
|
||||
client: this.clientsService.getClientData(this.clientId, true).pipe(catchError(() => of(null))),
|
||||
kyc: this.clientsService.getClientKyc(this.clientId, true).pipe(catchError(() => of(null))),
|
||||
accounts: this.clientsService.getClientAccountData(this.clientId).pipe(catchError(() => of(null)))
|
||||
accounts: this.clientsService.getClientAccountData(this.clientId).pipe(catchError(() => of(null))),
|
||||
declarations: this.tdsService.getDeclarations(Number(this.clientId)).pipe(catchError(() => of([])))
|
||||
})
|
||||
.pipe(
|
||||
takeUntil(this.destroy$),
|
||||
switchMap(({ client, kyc, accounts }) => {
|
||||
switchMap(({ client, kyc, accounts, declarations }) => {
|
||||
this.applyClient(client);
|
||||
this.applyKyc(kyc);
|
||||
this.declarations = declarations || [];
|
||||
const deposits = this.depositAccountsOf(accounts);
|
||||
return deposits.length ? forkJoin(deposits.map((a) => this.fetchAccount(a))) : of([] as any[]);
|
||||
}),
|
||||
@@ -210,11 +219,8 @@ export class Form121TabComponent implements OnInit, OnDestroy {
|
||||
private applyKyc(kyc: any): void {
|
||||
this.pan = (kyc?.panNumber ?? '').toUpperCase();
|
||||
this.panWellFormed = isWellFormedPan(this.pan);
|
||||
this.declarationOnRecord = !!kyc?.form15Applicable;
|
||||
this.declarationKind = kyc?.form15Type === '15H' ? '15H' : '15G';
|
||||
this.declarationForm = this.fy ? declarationFormFor(this.fy, this.dateOfBirth) : '121';
|
||||
this.declarationFy = kyc?.form15FY ?? '';
|
||||
this.acceptanceDateKnown = false;
|
||||
this.declarationForm =
|
||||
this.fy && FY_TAX_CONFIG[normaliseFy(this.fy)] ? declarationFormFor(this.fy, this.dateOfBirth) : '121';
|
||||
}
|
||||
|
||||
/** Savings, FD and RD accounts — everything that can credit interest. */
|
||||
@@ -248,7 +254,7 @@ export class Form121TabComponent implements OnInit, OnDestroy {
|
||||
*/
|
||||
private ingest(details: any[]): void {
|
||||
this.accountInputs = [];
|
||||
this.actualTdsByFy = new Map<string, number>();
|
||||
this.platformByFy = new Map<string, TdsDeductee | null>();
|
||||
const fys = new Set<string>();
|
||||
const clientIdNum = Number(this.clientId);
|
||||
|
||||
@@ -269,6 +275,7 @@ export class Form121TabComponent implements OnInit, OnDestroy {
|
||||
};
|
||||
|
||||
const credits: InterestCredit[] = [];
|
||||
const taxLines: InterestCredit[] = [];
|
||||
let tdsDeducted = 0;
|
||||
|
||||
for (const t of d.transactions ?? []) {
|
||||
@@ -286,8 +293,7 @@ export class Form121TabComponent implements OnInit, OnDestroy {
|
||||
} else if (t.transactionType?.withholdTax) {
|
||||
const amount = t.amount ?? 0;
|
||||
tdsDeducted += amount;
|
||||
const txnFy = fyOf(iso);
|
||||
this.actualTdsByFy.set(txnFy, (this.actualTdsByFy.get(txnFy) ?? 0) + amount);
|
||||
taxLines.push({ date: iso, amount, accountNo: ref.accountNo });
|
||||
}
|
||||
}
|
||||
|
||||
@@ -310,12 +316,13 @@ export class Form121TabComponent implements OnInit, OnDestroy {
|
||||
deducteeClientId: deductee
|
||||
};
|
||||
|
||||
this.accountInputs.push({ ...ref, credits, meta });
|
||||
this.accountInputs.push({ ...ref, credits, taxLines, meta });
|
||||
}
|
||||
|
||||
this.availableFys = [...fys].sort().reverse();
|
||||
if (!this.availableFys.includes(this.fy)) {
|
||||
this.fy = this.availableFys[0] ?? (this.declarationFy ? normaliseFy(this.declarationFy) : '');
|
||||
this.fy =
|
||||
this.availableFys[0] ?? this.declarations[0]?.fy ?? Object.keys(FY_TAX_CONFIG).sort().reverse()[0] ?? '';
|
||||
}
|
||||
}
|
||||
|
||||
@@ -333,14 +340,37 @@ export class Form121TabComponent implements OnInit, OnDestroy {
|
||||
}
|
||||
|
||||
const year = normaliseFy(this.fy);
|
||||
this.configMissing = !FY_TAX_CONFIG[year];
|
||||
|
||||
// TDS is tracked on FD/RD interest once it reaches savings, and deducted there. Those figures live
|
||||
// on the platform, not in the deposit's own transactions, so they are fetched once per year and
|
||||
// the computation waits for them.
|
||||
if (!this.platformByFy.has(year)) {
|
||||
this.loadPlatformYear(year);
|
||||
return;
|
||||
}
|
||||
const platform = this.platformByFy.get(year);
|
||||
for (const a of this.accountInputs) {
|
||||
if (!a.meta.tdsApplicable) {
|
||||
continue;
|
||||
}
|
||||
const match = platform?.accounts.find((p) => p.accountNo === a.accountNo);
|
||||
a.credits = match?.credits ?? [];
|
||||
a.taxLines = match?.deductions ?? [];
|
||||
}
|
||||
|
||||
// Per-account interest for the selected year, for the three lists.
|
||||
for (const a of this.accountInputs) {
|
||||
a.meta.interest = a.credits.filter((c) => fyOf(c.date) === year).reduce((s, c) => s + c.amount, 0);
|
||||
// The selected year only - this used to total every year the account had ever been taxed in.
|
||||
a.meta.tdsDeducted = a.meta.tdsApplicable
|
||||
? a.taxLines.filter((c) => fyOf(c.date) === year).reduce((s, c) => s + c.amount, 0)
|
||||
: 0;
|
||||
}
|
||||
this.actualTds = this.actualTdsByFy.get(year) ?? 0;
|
||||
// What was actually debited for this customer as deductee, wherever the savings account sits.
|
||||
this.actualTds = this.accountInputs.filter((a) => a.meta.tdsApplicable).reduce((s, a) => s + a.meta.tdsDeducted, 0);
|
||||
|
||||
if (!this.dateOfBirth) {
|
||||
if (!this.dateOfBirth || this.configMissing) {
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -378,21 +408,95 @@ export class Form121TabComponent implements OnInit, OnDestroy {
|
||||
return applicable.some((a) => a.meta.mode === 'QUARTERLY') ? 'QUARTERLY' : 'ANNUAL';
|
||||
}
|
||||
|
||||
/** The declaration, but only when it was filed for the year being shown. */
|
||||
private declarationForSelectedFy(): Declaration | null {
|
||||
if (!this.declarationOnRecord || !this.fy) {
|
||||
private loadPlatformYear(year: string): void {
|
||||
this.tdsService
|
||||
.getDepositInterest(Number(year.slice(0, 4)), Number(this.clientId))
|
||||
.pipe(
|
||||
catchError(() => of([])),
|
||||
takeUntil(this.destroy$)
|
||||
)
|
||||
.subscribe((rows) => {
|
||||
this.platformByFy.set(year, rows.find((r) => `${r.clientId}` === `${this.clientId}`) ?? null);
|
||||
this.recompute();
|
||||
});
|
||||
}
|
||||
|
||||
/** The live declaration recorded for the year being shown, if any. */
|
||||
get declarationRecord(): TdsDeclarationRecord | null {
|
||||
if (!this.fy) {
|
||||
return null;
|
||||
}
|
||||
const year = normaliseFy(this.fy);
|
||||
if (this.declarationFy && normaliseFy(this.declarationFy) !== year) {
|
||||
return this.declarations.find((d) => d.fy === year && !d.revoked) ?? null;
|
||||
}
|
||||
|
||||
get declarationOnRecord(): boolean {
|
||||
return !!this.declarationRecord;
|
||||
}
|
||||
|
||||
/** The declaration as the engine takes it — operative from the day it was accepted. */
|
||||
private declarationForSelectedFy(): Declaration | null {
|
||||
const d = this.declarationRecord;
|
||||
if (!d) {
|
||||
return null;
|
||||
}
|
||||
return {
|
||||
kind: this.declarationKind,
|
||||
// No acceptance date on record — treated as covering the whole year.
|
||||
acceptedOn: `${year.slice(0, 4)}-04-01`,
|
||||
fy: year
|
||||
};
|
||||
const kind = d.formType === '15H' ? '15H' : d.formType === '15G' ? '15G' : formKindFor(this.dateOfBirth, d.fy);
|
||||
return { kind, acceptedOn: d.acceptedOn, fy: d.fy, uin: d.uin || undefined };
|
||||
}
|
||||
|
||||
openDeclarationForm(): void {
|
||||
this.newDeclaration = { acceptedOn: new Date().toISOString().slice(0, 10), uin: '', estimatedIncome: null };
|
||||
this.declarationError = '';
|
||||
this.showDeclarationForm = true;
|
||||
}
|
||||
|
||||
saveDeclaration(): void {
|
||||
if (!this.newDeclaration.acceptedOn) {
|
||||
this.declarationError = 'Enter the date the branch accepted the form.';
|
||||
return;
|
||||
}
|
||||
this.savingDeclaration = true;
|
||||
this.declarationError = '';
|
||||
this.tdsService
|
||||
.createDeclaration({
|
||||
clientId: Number(this.clientId),
|
||||
fy: normaliseFy(this.fy),
|
||||
formType: declarationFormFor(this.fy, this.dateOfBirth),
|
||||
acceptedOn: this.newDeclaration.acceptedOn,
|
||||
uin: this.newDeclaration.uin || undefined,
|
||||
estimatedIncome: this.newDeclaration.estimatedIncome
|
||||
})
|
||||
.subscribe({
|
||||
next: (rows) => {
|
||||
this.savingDeclaration = false;
|
||||
this.showDeclarationForm = false;
|
||||
this.declarations = rows || [];
|
||||
this.recompute();
|
||||
},
|
||||
error: (err: any) => {
|
||||
this.savingDeclaration = false;
|
||||
this.declarationError =
|
||||
err?.error?.errors?.[0]?.defaultUserMessage || err?.error?.defaultUserMessage || 'Could not save.';
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
revokeDeclaration(): void {
|
||||
const d = this.declarationRecord;
|
||||
if (!d) {
|
||||
return;
|
||||
}
|
||||
const reason = prompt('Why is this declaration being withdrawn? From today, TDS will be deducted again.');
|
||||
if (!reason) {
|
||||
return;
|
||||
}
|
||||
this.tdsService.revokeDeclaration(d.id, reason).subscribe({
|
||||
next: (rows) => {
|
||||
this.declarations = rows || [];
|
||||
this.recompute();
|
||||
},
|
||||
error: (err: any) => alert(err?.error?.defaultUserMessage || 'Could not revoke the declaration.')
|
||||
});
|
||||
}
|
||||
|
||||
// ───────────────────────── Template helpers ─────────────────────────
|
||||
@@ -411,7 +515,7 @@ export class Form121TabComponent implements OnInit, OnDestroy {
|
||||
|
||||
/** The form the payee would file for the selected year. */
|
||||
get formLabel(): string {
|
||||
if (!this.fy) {
|
||||
if (!this.fy || this.configMissing) {
|
||||
return '—';
|
||||
}
|
||||
const form = declarationFormFor(this.fy, this.dateOfBirth);
|
||||
@@ -470,11 +574,12 @@ export class Form121TabComponent implements OnInit, OnDestroy {
|
||||
}
|
||||
|
||||
/**
|
||||
* A declaration is on record but deposit accounts are still set to withhold —
|
||||
* the branch has not switched them off.
|
||||
* A declaration is on record but a deposit still carries a stock Fineract tax group. Those
|
||||
* accounts withhold on their own rules and never consult the declaration record, so the form
|
||||
* does not stop their deduction until the tax group is removed.
|
||||
*/
|
||||
get declarationNotAppliedToAccounts(): boolean {
|
||||
return !!this.declarationForSelectedFy() && this.liableAccounts.some((a) => a.withHoldTax);
|
||||
return !!this.declarationForSelectedFy() && this.liableAccounts.some((a) => !!a.taxGroup);
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
@@ -591,16 +591,13 @@
|
||||
<i class="fa fa-calendar section-header__icon"></i>
|
||||
<h3 class="section-header__title">{{ 'labels.heading.Recurring Deposit Accounts' | translate }}</h3>
|
||||
</div>
|
||||
<div class="section-header__right">
|
||||
<button mat-raised-button color="primary" (click)="toggleRecurringAccountsOverview()">
|
||||
{{ viewAccountsLabel(showClosedRecurringAccounts) | translate }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@if (!showClosedRecurringAccounts) {
|
||||
<!-- Active and ended recurring deposits share one table; the Status column says how each one ended (matured or
|
||||
closed early), so the client's RD history stays visible without switching views. -->
|
||||
@if (savingAccounts) {
|
||||
<div class="table-wrapper">
|
||||
<table mat-table [dataSource]="savingAccounts | accountsFilter: 'saving' : 'open' : 'isRecurring'">
|
||||
<table mat-table [dataSource]="savingAccounts | accountsFilter: 'saving' : 'all' : 'isRecurring'">
|
||||
<ng-container matColumnDef="Account No">
|
||||
<th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Account No' | translate }}</th>
|
||||
<td mat-cell *matCellDef="let element">
|
||||
@@ -614,6 +611,15 @@
|
||||
<mifosx-long-text textValue="{{ element.productName }}" chars="35"></mifosx-long-text>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="Status">
|
||||
<th mat-header-cell *matHeaderCellDef>Status</th>
|
||||
<td mat-cell *matCellDef="let element">
|
||||
<span class="rd-status" [class.rd-status--ended]="element.timeline?.closedOnDate">{{ rdStatusLabel(element) }}</span>
|
||||
@if (element.timeline?.closedOnDate) {
|
||||
<div class="rd-status__date">on {{ element.timeline.closedOnDate | dateFormat }}</div>
|
||||
}
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="Last Active">
|
||||
<th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Last Active' | translate }}</th>
|
||||
<td mat-cell *matCellDef="let element">{{ element.lastActiveTransactionDate | dateFormat }}</td>
|
||||
@@ -638,7 +644,7 @@
|
||||
<i class="fa fa-check"></i>
|
||||
</button>
|
||||
}
|
||||
@if (!element.status.submittedAndPendingApproval && !element.status.active) {
|
||||
@if (element.status.approved) {
|
||||
<button
|
||||
class="account-action-button"
|
||||
mat-raised-button
|
||||
@@ -664,7 +670,7 @@
|
||||
</ng-container>
|
||||
|
||||
<ng-container matColumnDef="no-data">
|
||||
<td mat-footer-cell *matFooterCellDef [attr.colspan]="openSavingsColumns.length">
|
||||
<td mat-footer-cell *matFooterCellDef [attr.colspan]="recurringColumns.length">
|
||||
<div class="table-empty-state">
|
||||
<i class="fa fa-folder-open-o table-empty-state__icon"></i>
|
||||
<p class="table-empty-state__text">
|
||||
@@ -674,67 +680,17 @@
|
||||
</td>
|
||||
</ng-container>
|
||||
|
||||
<tr mat-header-row *matHeaderRowDef="openSavingsColumns"></tr>
|
||||
<tr mat-header-row *matHeaderRowDef="recurringColumns"></tr>
|
||||
<tr
|
||||
mat-row
|
||||
*matRowDef="let row; columns: openSavingsColumns"
|
||||
*matRowDef="let row; columns: recurringColumns"
|
||||
[routerLink]="['../', 'recurring-deposits-accounts', row.id, 'general']"
|
||||
class="select-row"
|
||||
></tr>
|
||||
<tr
|
||||
mat-footer-row
|
||||
*matFooterRowDef="
|
||||
(savingAccounts | accountsFilter: 'saving' : 'open' : 'isRecurring')?.length === 0 ? ['no-data'] : []
|
||||
"
|
||||
></tr>
|
||||
</table>
|
||||
</div>
|
||||
}
|
||||
|
||||
<!-- Closed Recurring Deposit Accounts -->
|
||||
@if (showClosedRecurringAccounts) {
|
||||
<div class="table-wrapper">
|
||||
<table mat-table [dataSource]="savingAccounts | accountsFilter: 'saving' : 'closed' : 'isRecurring'">
|
||||
<ng-container matColumnDef="Account No">
|
||||
<th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Account No' | translate }}</th>
|
||||
<td mat-cell *matCellDef="let element">
|
||||
<i class="fa fa-stop" [ngClass]="element.status.code | statusLookup"></i>
|
||||
<mifosx-account-number accountNo="{{ element.accountNo }}"></mifosx-account-number>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="Saving Account">
|
||||
<th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Recurring Deposit Product' | translate }}</th>
|
||||
<td mat-cell *matCellDef="let element">
|
||||
<mifosx-long-text textValue="{{ element.productName }}" chars="35"></mifosx-long-text>
|
||||
</td>
|
||||
</ng-container>
|
||||
<ng-container matColumnDef="Closed Date">
|
||||
<th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Closed Date' | translate }}</th>
|
||||
<td mat-cell *matCellDef="let element">{{ element.timeline.closedOnDate | dateFormat }}</td>
|
||||
</ng-container>
|
||||
|
||||
<ng-container matColumnDef="no-data">
|
||||
<td mat-footer-cell *matFooterCellDef [attr.colspan]="closedSavingsColumns.length">
|
||||
<div class="table-empty-state">
|
||||
<i class="fa fa-folder-open-o table-empty-state__icon"></i>
|
||||
<p class="table-empty-state__text">
|
||||
{{ 'labels.messages.No Closed Recurring Deposit Accounts Available' | translate }}
|
||||
</p>
|
||||
</div>
|
||||
</td>
|
||||
</ng-container>
|
||||
|
||||
<tr mat-header-row *matHeaderRowDef="closedSavingsColumns"></tr>
|
||||
<tr
|
||||
mat-row
|
||||
*matRowDef="let row; columns: closedSavingsColumns"
|
||||
[routerLink]="['../', 'recurring-deposits-accounts', row.id, 'general']"
|
||||
class="select-row"
|
||||
></tr>
|
||||
<tr
|
||||
mat-footer-row
|
||||
*matFooterRowDef="
|
||||
(savingAccounts | accountsFilter: 'saving' : 'closed' : 'isRecurring')?.length === 0 ? ['no-data'] : []
|
||||
(savingAccounts | accountsFilter: 'saving' : 'all' : 'isRecurring')?.length === 0 ? ['no-data'] : []
|
||||
"
|
||||
></tr>
|
||||
</table>
|
||||
|
||||
@@ -419,3 +419,24 @@ table[mat-table] {
|
||||
font-size: 24px;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.rd-status {
|
||||
display: inline-block;
|
||||
padding: 2px 8px;
|
||||
border-radius: 10px;
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
background: #dcfce7;
|
||||
color: #166534;
|
||||
|
||||
&--ended {
|
||||
background: #e2e8f0;
|
||||
color: #475569;
|
||||
}
|
||||
}
|
||||
|
||||
.rd-status__date {
|
||||
margin-top: 2px;
|
||||
font-size: 11px;
|
||||
color: #64748b;
|
||||
}
|
||||
|
||||
@@ -187,6 +187,15 @@ export class GeneralTabComponent implements OnDestroy {
|
||||
'Saving Account',
|
||||
'Closed Date'
|
||||
];
|
||||
/** Closed Recurring Deposit Accounts Columns - with how each one ended, for tracking. */
|
||||
recurringColumns: string[] = [
|
||||
'Account No',
|
||||
'Saving Account',
|
||||
'Status',
|
||||
'Last Active',
|
||||
'Balance',
|
||||
'Actions'
|
||||
];
|
||||
/** Open Shares Accounts Columns */
|
||||
openSharesColumns: string[] = [
|
||||
'Account No',
|
||||
@@ -475,6 +484,30 @@ export class GeneralTabComponent implements OnDestroy {
|
||||
);
|
||||
}
|
||||
|
||||
/** Where a recurring deposit stands - for one that has ended, how it ended. */
|
||||
rdStatusLabel(account: any): string {
|
||||
switch (account?.status?.code) {
|
||||
case 'savingsAccountStatusType.active':
|
||||
return 'Active';
|
||||
case 'savingsAccountStatusType.matured':
|
||||
return 'Matured (not closed)';
|
||||
case 'savingsAccountStatusType.submitted.and.pending.approval':
|
||||
return 'Pending Approval';
|
||||
case 'savingsAccountStatusType.approved':
|
||||
return 'Approved';
|
||||
case 'savingsAccountStatusType.closed':
|
||||
return 'Matured & Closed';
|
||||
case 'savingsAccountStatusType.pre.mature.closure':
|
||||
return 'Premature Closed';
|
||||
case 'savingsAccountStatusType.rejected':
|
||||
return 'Rejected';
|
||||
case 'savingsAccountStatusType.withdrawn.by.applicant':
|
||||
return 'Withdrawn by Client';
|
||||
default:
|
||||
return account?.status?.value ?? '';
|
||||
}
|
||||
}
|
||||
|
||||
viewAccountsLabel(closed: boolean): string {
|
||||
if (closed) {
|
||||
return 'labels.buttons.View Active Accounts';
|
||||
|
||||
@@ -1142,6 +1142,46 @@
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
|
||||
<!-- Risk profile. These are determinations about the customer rather than about anything they
|
||||
transacted, and the re-rating policy reads them directly: a PEP or a sanctions match holds the
|
||||
rating at High however ordinary the period's activity looks, and the declared income is what
|
||||
turnover is measured against. Until they are recorded the policy has nothing to test. -->
|
||||
<div class="full-span kyc-doc-fields">
|
||||
<div class="kyc-doc-fields__head">
|
||||
<h4 class="kyc-doc-fields__title">Risk Profile</h4>
|
||||
<span class="kyc-doc-fields__hint">Used by the periodic risk review</span>
|
||||
</div>
|
||||
|
||||
<div class="kyc-risk-flags">
|
||||
<mat-checkbox formControlName="isPep">
|
||||
Politically Exposed Person
|
||||
<span class="kyc-risk-hint">Holds the rating at High; never lowered on ordinary activity</span>
|
||||
</mat-checkbox>
|
||||
<mat-checkbox formControlName="sanctionsMatch">
|
||||
Sanctions / watch-list match
|
||||
<span class="kyc-risk-hint">UNSC, MHA or internal watch list</span>
|
||||
</mat-checkbox>
|
||||
<mat-checkbox formControlName="adverseMediaMatch">
|
||||
Adverse media / regulatory action
|
||||
<span class="kyc-risk-hint">FIR, court proceedings or published action</span>
|
||||
</mat-checkbox>
|
||||
</div>
|
||||
|
||||
<div class="kyc-doc-fields__grid">
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>Declared annual income (₹)</mat-label>
|
||||
<input matInput type="number" min="0" formControlName="declaredAnnualIncome" />
|
||||
<mat-hint>As stated by the customer</mat-hint>
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field appearance="outline">
|
||||
<mat-label>Declared annual turnover (₹)</mat-label>
|
||||
<input matInput type="number" min="0" formControlName="declaredAnnualTurnover" />
|
||||
<mat-hint>For a business customer</mat-hint>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Officially Valid Document. Shown when one is on file or the alert is asking for
|
||||
it, so re-collecting an expired document is done on this form rather than
|
||||
sending the officer somewhere else. -->
|
||||
@@ -1207,9 +1247,7 @@
|
||||
</div>
|
||||
|
||||
@if (!docScansLoading && !docScans.front && !docScans.back) {
|
||||
<div class="kyc-doc-scans__empty">
|
||||
No scan is on file for this document. Upload one below.
|
||||
</div>
|
||||
<div class="kyc-doc-scans__empty">No scan is on file for this document. Upload one below.</div>
|
||||
}
|
||||
|
||||
<div class="kyc-doc-scans__sides">
|
||||
|
||||
@@ -1807,3 +1807,28 @@
|
||||
color: #15803d;
|
||||
}
|
||||
}
|
||||
|
||||
/* ── Risk profile ────────────────────────────────────────────────────────────
|
||||
Determinations about the customer, which the periodic risk review reads directly. Grouped with
|
||||
the document block so the form reads as "what we know about them" rather than scattering a PEP
|
||||
flag among the identifier fields. */
|
||||
|
||||
.kyc-doc-fields__hint {
|
||||
font-size: 12px;
|
||||
color: #64748b;
|
||||
}
|
||||
|
||||
.kyc-risk-flags {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
padding: 4px 0 14px;
|
||||
}
|
||||
|
||||
/* Sits under its checkbox label: the consequence of ticking the box matters more than the box. */
|
||||
.kyc-risk-hint {
|
||||
display: block;
|
||||
font-size: 12px;
|
||||
color: #64748b;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
@@ -140,6 +140,13 @@ export class KycTabComponent implements OnInit, OnDestroy {
|
||||
1,
|
||||
[Validators.required]
|
||||
],
|
||||
// Risk profile. Determinations about the customer, which the periodic risk review reads directly - a PEP or a
|
||||
// sanctions match holds the rating at High whatever the period's activity looks like.
|
||||
isPep: [false],
|
||||
sanctionsMatch: [false],
|
||||
adverseMediaMatch: [false],
|
||||
declaredAnnualIncome: [null],
|
||||
declaredAnnualTurnover: [null],
|
||||
// The officially valid document, so a lapsed one can be re-collected on this form. The
|
||||
// backend has always accepted these four; only the fields were missing.
|
||||
kycDocumentName: [''],
|
||||
@@ -175,7 +182,10 @@ export class KycTabComponent implements OnInit, OnDestroy {
|
||||
docScans: { front: DocScanSide | null; back: DocScanSide | null } = { front: null, back: null };
|
||||
|
||||
/** The two sides, in display order, so the template loops rather than repeating itself. */
|
||||
readonly docScanSlots: ('front' | 'back')[] = ['front', 'back'];
|
||||
readonly docScanSlots: ('front' | 'back')[] = [
|
||||
'front',
|
||||
'back'
|
||||
];
|
||||
|
||||
docScanOf(slot: 'front' | 'back') {
|
||||
return this.docScans[slot];
|
||||
@@ -221,6 +231,11 @@ export class KycTabComponent implements OnInit, OnDestroy {
|
||||
this.kycForm.patchValue({
|
||||
kycType: data.kycType || 1,
|
||||
riskCategory: data.riskCategory || 1,
|
||||
isPep: !!data.isPep,
|
||||
sanctionsMatch: !!data.sanctionsMatch,
|
||||
adverseMediaMatch: !!data.adverseMediaMatch,
|
||||
declaredAnnualIncome: data.declaredAnnualIncome ?? null,
|
||||
declaredAnnualTurnover: data.declaredAnnualTurnover ?? null,
|
||||
panNumber: data.panNumber || '',
|
||||
// Aadhaar is stored masked on the server; user must re-enter
|
||||
// the full 12-digit number to re-verify, so don't pre-fill.
|
||||
@@ -446,6 +461,29 @@ export class KycTabComponent implements OnInit, OnDestroy {
|
||||
return new Date();
|
||||
}
|
||||
|
||||
/**
|
||||
* The customer's risk profile, as every save has to carry it.
|
||||
*
|
||||
* <p>
|
||||
* Sent from every path that writes the KYC record rather than only the main Save, because the form holds one set of
|
||||
* values: a save triggered from the PAN declaration or the Aadhaar receipt would otherwise write the record without
|
||||
* these and silently clear a PEP flag the officer had just ticked.
|
||||
*/
|
||||
private buildRiskProfileFields() {
|
||||
const v = this.kycForm.value;
|
||||
return {
|
||||
isPep: !!v.isPep,
|
||||
sanctionsMatch: !!v.sanctionsMatch,
|
||||
adverseMediaMatch: !!v.adverseMediaMatch,
|
||||
// Blank stays null rather than becoming zero: an income nobody asked for is unknown, and a zero would read as a
|
||||
// customer who declared no income at all.
|
||||
declaredAnnualIncome:
|
||||
v.declaredAnnualIncome === '' || v.declaredAnnualIncome == null ? null : v.declaredAnnualIncome,
|
||||
declaredAnnualTurnover:
|
||||
v.declaredAnnualTurnover === '' || v.declaredAnnualTurnover == null ? null : v.declaredAnnualTurnover
|
||||
};
|
||||
}
|
||||
|
||||
private buildExceptionFields() {
|
||||
const panVerified = this.verificationStatus.pan === 'VERIFIED' || this.kycData?.panVerified === true;
|
||||
const aadhaarVerified = this.verificationStatus.aadhaar === 'VERIFIED' || this.kycData?.aadhaarVerified === true;
|
||||
@@ -484,6 +522,7 @@ export class KycTabComponent implements OnInit, OnDestroy {
|
||||
// dateFormat is required so the backend can parse exceptionResolvedOn when an exception closes.
|
||||
dateFormat: 'dd MMMM yyyy',
|
||||
...this.buildDocumentFields(),
|
||||
...this.buildRiskProfileFields(),
|
||||
...this.buildExceptionFields()
|
||||
};
|
||||
|
||||
@@ -530,6 +569,7 @@ export class KycTabComponent implements OnInit, OnDestroy {
|
||||
remarks: this.kycForm.value.remarks || null,
|
||||
riskCategory: this.kycForm.value.riskCategory || 1,
|
||||
dateFormat: 'dd MMMM yyyy',
|
||||
...this.buildRiskProfileFields(),
|
||||
...this.buildExceptionFields()
|
||||
};
|
||||
|
||||
@@ -729,6 +769,7 @@ export class KycTabComponent implements OnInit, OnDestroy {
|
||||
dateFormat,
|
||||
riskCategory: this.kycForm.value.riskCategory || 1,
|
||||
...declarationFields,
|
||||
...this.buildRiskProfileFields(),
|
||||
...this.buildExceptionFields()
|
||||
};
|
||||
|
||||
@@ -889,6 +930,7 @@ export class KycTabComponent implements OnInit, OnDestroy {
|
||||
dateFormat,
|
||||
riskCategory: this.kycForm.value.riskCategory || 1,
|
||||
...receiptFields,
|
||||
...this.buildRiskProfileFields(),
|
||||
...this.buildExceptionFields()
|
||||
};
|
||||
|
||||
@@ -1417,7 +1459,10 @@ I further confirm that:
|
||||
this.docScansLoading = false;
|
||||
// This runs again after every replace, so the previews being thrown away are revoked
|
||||
// rather than left holding their blobs.
|
||||
for (const old of [this.docScans.front, this.docScans.back]) {
|
||||
for (const old of [
|
||||
this.docScans.front,
|
||||
this.docScans.back
|
||||
]) {
|
||||
if (old?.previewUrl) {
|
||||
URL.revokeObjectURL(old.previewUrl);
|
||||
}
|
||||
@@ -1459,7 +1504,10 @@ I further confirm that:
|
||||
}
|
||||
|
||||
this.docScans = sides;
|
||||
for (const key of ['front', 'back'] as const) {
|
||||
for (const key of [
|
||||
'front',
|
||||
'back'
|
||||
] as const) {
|
||||
if (sides[key]) {
|
||||
this.loadScanPreview(sides[key]!);
|
||||
}
|
||||
@@ -1520,7 +1568,9 @@ I further confirm that:
|
||||
error: (err: any) => {
|
||||
this.docScanUploading = null;
|
||||
this.docScanError =
|
||||
err?.error?.defaultUserMessage || err?.error?.developerMessage || `Could not replace the ${label.toLowerCase()} side.`;
|
||||
err?.error?.defaultUserMessage ||
|
||||
err?.error?.developerMessage ||
|
||||
`Could not replace the ${label.toLowerCase()} side.`;
|
||||
}
|
||||
});
|
||||
}
|
||||
@@ -1703,7 +1753,10 @@ I further confirm that:
|
||||
this.destroy$.next();
|
||||
this.destroy$.complete();
|
||||
// Object URLs are held by the browser until revoked, so the scan blobs would outlive the tab.
|
||||
for (const side of [this.docScans.front, this.docScans.back]) {
|
||||
for (const side of [
|
||||
this.docScans.front,
|
||||
this.docScans.back
|
||||
]) {
|
||||
if (side?.previewUrl) {
|
||||
URL.revokeObjectURL(side.previewUrl);
|
||||
}
|
||||
|
||||
@@ -569,8 +569,19 @@ export class ClientsService {
|
||||
return this.http.get(`/clients/${clientId}/documents`);
|
||||
}
|
||||
|
||||
downloadClientDocument(parentEntityId: string, documentId: string) {
|
||||
return this.http.get(`/clients/${parentEntityId}/documents/${documentId}/attachment`, { responseType: 'blob' });
|
||||
/**
|
||||
* Fetches a client document's stored file.
|
||||
*
|
||||
* `silent` opts the request out of ErrorHandlerInterceptor's alert. Pass it when the caller
|
||||
* renders its own failure state - notably thumbnail fetches, where a `m_document` row whose file
|
||||
* is no longer in the content store returns 500 and would otherwise pop a modal the user can do
|
||||
* nothing about. The interceptor still rethrows, so the caller's error callback continues to run.
|
||||
*/
|
||||
downloadClientDocument(parentEntityId: string, documentId: string, silent = false) {
|
||||
return this.http.get(`/clients/${parentEntityId}/documents/${documentId}/attachment`, {
|
||||
responseType: 'blob',
|
||||
...(silent ? { context: new HttpContext().set(SILENT_HTTP_ERROR, true) } : {})
|
||||
});
|
||||
}
|
||||
|
||||
uploadClientDocument(clientId: string, documentData: any) {
|
||||
@@ -992,12 +1003,28 @@ export class ClientsService {
|
||||
return this.http.post(`/clients/${clientId}/entityclassification/${category}`, data);
|
||||
}
|
||||
|
||||
getClientCkyc(clientId: string): Observable<any> {
|
||||
return this.http.get(`/clients/${clientId}/ckyc`);
|
||||
/**
|
||||
* Uploads a single CKYC artefact against the client, using the platform's generic document
|
||||
* endpoint (DocumentApiResource, POST /v1/{entityType}/{entityId}/documents). There is no
|
||||
* CKYC-specific document API on the backend - the earlier `/clients/{id}/ckyc/documents` path
|
||||
* was never implemented and returned 404.
|
||||
*
|
||||
* The multipart body must carry `file`, `name` and `description`; the caller builds those so the
|
||||
* stored document stays identifiable by CKYC artefact type. See ckyc-tab.component.ts.
|
||||
*/
|
||||
uploadCkycDocument(clientId: string, formData: FormData): Observable<any> {
|
||||
return this.http.post(`/clients/${clientId}/documents`, formData);
|
||||
}
|
||||
|
||||
uploadCkycDocument(clientId: string, formData: FormData): Observable<any> {
|
||||
return this.http.post(`/clients/${clientId}/ckyc/documents`, formData);
|
||||
/**
|
||||
* Replaces the content of an existing client document in place (DocumentApiResource PUT
|
||||
* /v1/{entityType}/{entityId}/documents/{documentId}), keeping the same document id.
|
||||
*
|
||||
* Used by the CKYC screen's "Upload new version" so a re-upload updates the existing artefact
|
||||
* rather than adding another row. Takes the same multipart body as the create call.
|
||||
*/
|
||||
replaceClientDocument(clientId: string, documentId: string, formData: FormData): Observable<any> {
|
||||
return this.http.put(`/clients/${clientId}/documents/${documentId}`, formData);
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
@@ -377,6 +377,8 @@
|
||||
</button>
|
||||
}
|
||||
@if (selectedTabIndex < totalTabs - 1) {
|
||||
<!-- Tooltip sits on a wrapper: a disabled button fires no mouse events, so it can't host it. -->
|
||||
<span [matTooltip]="currentStepBlockerMessage" [matTooltipDisabled]="!currentStepBlockerMessage">
|
||||
<button mat-raised-button color="primary" (click)="onNext()" [disabled]="savingClient || !currentStepValid">
|
||||
@if (savingClient) {
|
||||
<mat-progress-spinner diameter="18" mode="indeterminate" class="m-r-10"></mat-progress-spinner>
|
||||
@@ -390,6 +392,7 @@
|
||||
<fa-icon icon="arrow-right" class="m-l-10"></fa-icon>
|
||||
}
|
||||
</button>
|
||||
</span>
|
||||
}
|
||||
@if (selectedTabIndex === totalTabs - 1) {
|
||||
<button mat-raised-button color="primary" [routerLink]="['../']">
|
||||
|
||||
@@ -393,6 +393,12 @@ export class EditClientComponent {
|
||||
if (this.selectedTabIndex === 0 && this.clientGeneralForm?.valid && !this.contactVerificationComplete) {
|
||||
return 'Verify the OTP sent to both the old and new mobile number/email before saving.';
|
||||
}
|
||||
if (this.selectedTabIndex === 0 && this.clientGeneralForm && !this.clientGeneralForm.valid) {
|
||||
const labels = this.invalidGeneralFieldLabels();
|
||||
if (labels.length) {
|
||||
return `Please fill/correct: ${labels.join(', ')}.`;
|
||||
}
|
||||
}
|
||||
if (this.selectedTabIndex === 1) {
|
||||
const labels = this.clientKycStep?.invalidFieldLabels || [];
|
||||
if (labels.length) {
|
||||
@@ -408,6 +414,42 @@ export class EditClientComponent {
|
||||
return 'Please fill all mandatory fields on this tab to continue.';
|
||||
}
|
||||
|
||||
/**
|
||||
* Readable names of the General-tab controls that are invalid. Older clients can be missing
|
||||
* fields that are now mandatory (e.g. mobile/email), which leaves Save disabled with nothing
|
||||
* on screen saying why — this feeds the button tooltip.
|
||||
*/
|
||||
private invalidGeneralFieldLabels(): string[] {
|
||||
const labels: Record<string, string> = {
|
||||
officeId: 'Office',
|
||||
legalFormId: 'Legal Form',
|
||||
genderId: 'Gender',
|
||||
mobileNo: 'Mobile No',
|
||||
alternateMobileNo: 'Alternate Mobile No',
|
||||
emailAddress: 'Email',
|
||||
dateOfBirth: 'Date of Birth',
|
||||
submittedOnDate: 'Submitted On',
|
||||
activationDate: 'Activation Date',
|
||||
savingsProductId: 'Savings Product',
|
||||
firstname: 'First Name',
|
||||
middlename: 'Middle Name',
|
||||
lastname: 'Last Name',
|
||||
fullname: 'Name',
|
||||
monthlyIncome: 'Monthly Income',
|
||||
annualIncome: 'Annual Income',
|
||||
monthlyTurnover: 'Monthly Turnover',
|
||||
annualTurnover: 'Yearly Turnover',
|
||||
agricultureIncome: 'Agriculture Income',
|
||||
nonAgricultureIncome: 'Non-Agriculture Income',
|
||||
guardianDetails: 'Guardian',
|
||||
clientNonPersonDetails: 'Entity Details'
|
||||
};
|
||||
const controls = this.clientGeneralForm?.controls || {};
|
||||
return Object.keys(controls)
|
||||
.filter((name) => controls[name].invalid)
|
||||
.map((name) => labels[name] || name);
|
||||
}
|
||||
|
||||
/** Whether the current tab has unsaved edits */
|
||||
isCurrentTabEdited(): boolean {
|
||||
return this.tabEditMode[this.selectedTabIndex] === true;
|
||||
|
||||
+1
-7
@@ -109,13 +109,7 @@
|
||||
</button>
|
||||
}
|
||||
</div>
|
||||
<input
|
||||
#sideInput
|
||||
type="file"
|
||||
hidden
|
||||
accept="image/*,application/pdf"
|
||||
(change)="onFilePicked($event, slot)"
|
||||
/>
|
||||
<input #sideInput type="file" hidden accept="image/*,application/pdf" (change)="onFilePicked($event, slot)" />
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
|
||||
@@ -25,6 +25,41 @@ import { environment } from '../../../environments/environment';
|
||||
export class CacheInterceptor implements HttpInterceptor {
|
||||
private forceUpdate = false;
|
||||
|
||||
/**
|
||||
* Endpoints that compute a live figure from the current ledger/configuration and must never be
|
||||
* served from cache. Caching them meant a report kept showing a stale response after its
|
||||
* underlying GL mapping changed — the request was answered from cachedData and the backend was
|
||||
* never hit again. Matched as a substring of the request URL.
|
||||
*/
|
||||
private static readonly NEVER_CACHE = [
|
||||
'/rbireservereturn',
|
||||
'/rbireserveconfig',
|
||||
'/tdsconfig',
|
||||
'/tds/deposit-interest',
|
||||
// Declarations and challans are entered on the very screens that read them back.
|
||||
'/tds/declarations',
|
||||
'/tds/challans',
|
||||
'/tds/deducted',
|
||||
'/savingsinterestpostingreports',
|
||||
// Cash in vaults and drawers changes with every transaction; a cached teller list or position
|
||||
// kept showing a branch's old tellers and figures at day close.
|
||||
'/tellers',
|
||||
'/cashreports',
|
||||
'/cashreconciliation',
|
||||
'/cashsettlement',
|
||||
'/cashtransfer',
|
||||
'/branchday',
|
||||
// A deposit's lien moves with every repayment of the loan it secures, and decides whether the
|
||||
// deposit may be closed at all - a stale copy would show a released lien as still blocking.
|
||||
'/liens',
|
||||
// The RD Dashboard counts late installments as of today; a cached copy would hide a payment just taken.
|
||||
'/recurringdepositaccounts/dashboard'
|
||||
];
|
||||
|
||||
private isCacheable(url: string): boolean {
|
||||
return !CacheInterceptor.NEVER_CACHE.some((fragment) => url.includes(fragment));
|
||||
}
|
||||
|
||||
// eslint-disable-next-line @angular-eslint/prefer-inject
|
||||
constructor(private httpCacheService: HttpCacheService) {}
|
||||
|
||||
@@ -42,7 +77,7 @@ export class CacheInterceptor implements HttpInterceptor {
|
||||
}
|
||||
|
||||
intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
|
||||
if (request.method !== 'GET') {
|
||||
if (request.method !== 'GET' || !this.isCacheable(request.urlWithParams)) {
|
||||
return next.handle(request);
|
||||
}
|
||||
|
||||
|
||||
@@ -67,12 +67,18 @@ export class ErrorHandlerInterceptor implements HttpInterceptor {
|
||||
// endpoint isn't available on a given backend deployment, the client-general-step
|
||||
// component already falls back to riskRules = [] silently; no toast needed here either.
|
||||
const isKycRiskRulesRequest = request.url.includes('/kyc/risk-rules');
|
||||
// A document's own file can be missing from the content store (a database copied between
|
||||
// environments without its file store is the usual cause) even though its m_document row
|
||||
// survives — the backend reports that as a 404, same as a client with no photo, and every
|
||||
// caller that fetches a signature/attachment image already recovers with its own catchError.
|
||||
const isDocumentAttachmentRequest = request.url.match(/\/documents\/\d+\/attachment$/);
|
||||
const isSilentRequest =
|
||||
isClientImageRequest ||
|
||||
isClientKycRequest ||
|
||||
isDirectorRequest ||
|
||||
isClientPendingEditRequest ||
|
||||
isKycRiskRulesRequest;
|
||||
isKycRiskRulesRequest ||
|
||||
isDocumentAttachmentRequest;
|
||||
|
||||
// Explicit per-request opt-out (e.g. per-row enrichment fetches on a list page whose
|
||||
// component already recovers via its own catchError) — silenced for every status, since
|
||||
@@ -93,8 +99,8 @@ export class ErrorHandlerInterceptor implements HttpInterceptor {
|
||||
throw response;
|
||||
}
|
||||
|
||||
// Resolved once and emitted in one place below, so every failure here is consistently tagged
|
||||
// as an error and therefore surfaces as a centred modal rather than a corner toast.
|
||||
// Resolved once and emitted in one place below — see the severity decision there for which of
|
||||
// these surfaces as a centred modal versus a corner toast.
|
||||
let alert: { type: string; message: string } | null = null;
|
||||
if (status === 401 || (environment.oauth.enabled && status === 400)) {
|
||||
alert = { type: 'Authentication Error', message: 'Invalid User Details. Please try again!' };
|
||||
@@ -119,7 +125,13 @@ export class ErrorHandlerInterceptor implements HttpInterceptor {
|
||||
message: errorMessage || 'This action is not allowed in the current state.'
|
||||
};
|
||||
} else if (status === 500) {
|
||||
alert = { type: 'Internal Server Error', message: 'Internal Server Error. Please try again later.' };
|
||||
// errorMessage carries the backend's actual explanation (defaultUserMessage/developerMessage)
|
||||
// when one is present; the generic sentence is only a last resort for a response with no body
|
||||
// at all (a proxy timeout, a stack trace the server never wrapped into JSON).
|
||||
alert = {
|
||||
type: 'Internal Server Error',
|
||||
message: errorMessage || 'Internal Server Error. Please try again later.'
|
||||
};
|
||||
} else if (status === 501) {
|
||||
alert = {
|
||||
type: this.translate.instant('error.resource.notImplemented.type'),
|
||||
@@ -133,7 +145,17 @@ export class ErrorHandlerInterceptor implements HttpInterceptor {
|
||||
}
|
||||
|
||||
if (alert) {
|
||||
this.alertService.alert({ ...alert, severity: 'error' });
|
||||
// A GET is the page reading data it did not ask the user for, in the background — a photo,
|
||||
// an attachment, a notes list, a standing-instructions panel. Every one of those already has
|
||||
// its own catchError fallback at the call site (see transaction-entry.component.ts and
|
||||
// similar account-overview loaders), so the page keeps working regardless. Blocking the whole
|
||||
// screen on a dialog the user has to click "OK" on, for data that was never more than a
|
||||
// secondary panel, is the "irritate na ho" complaint this guards against — it goes to the
|
||||
// corner toast instead, same place a non-error alert already goes. A write (POST/PUT/PATCH/
|
||||
// DELETE) is different: that is the one action the user was waiting on, so its failure still
|
||||
// needs the centred, must-acknowledge dialog.
|
||||
const isBackgroundRead = request.method === 'GET' && (status === 500 || status === 501 || status === 503);
|
||||
this.alertService.alert({ ...alert, severity: isBackgroundRead ? undefined : 'error' });
|
||||
}
|
||||
|
||||
throw response;
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -244,6 +244,44 @@ $color: #e2e4ec;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* The cashier's bar is meant to be one row at a normal window size: it carries about eleven items, and at
|
||||
* the usual padding the last one wrapped onto a second row. The items are tightened so they fit, and spread
|
||||
* across the row. As the window narrows they tighten further, then drop their icons, and only wrap in a very
|
||||
* narrow window. The clerk's bar (cashier-nav--clerk) has its own dropdowns and is left as it was.
|
||||
*/
|
||||
.cashier-nav:not(.cashier-nav--clerk) {
|
||||
flex-wrap: nowrap;
|
||||
justify-content: space-between;
|
||||
gap: 0;
|
||||
padding: 4px 8px;
|
||||
|
||||
.cashier-nav__item {
|
||||
flex: 0 0 auto;
|
||||
gap: 4px;
|
||||
padding: 5px 8px;
|
||||
font-size: 11.5px;
|
||||
}
|
||||
|
||||
@media (width <= 1240px) {
|
||||
.cashier-nav__item {
|
||||
padding: 5px 6px;
|
||||
font-size: 11px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (width <= 1120px) {
|
||||
.cashier-nav__item fa-icon {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (width <= 900px) {
|
||||
flex-wrap: wrap;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
}
|
||||
|
||||
.sidenav {
|
||||
overflow-x: hidden;
|
||||
position: relative;
|
||||
@@ -266,7 +304,7 @@ $color: #e2e4ec;
|
||||
max-width: 100%;
|
||||
overflow-x: hidden;
|
||||
box-sizing: border-box;
|
||||
padding: 16px 28px;
|
||||
padding: 10px 18px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -282,21 +320,15 @@ $gray-700: #334155;
|
||||
/* ============================================================
|
||||
Main header (top 2-row navigation)
|
||||
--------------------------------------------------------------
|
||||
Redesigned 2026 — clean, modern enterprise SaaS feel:
|
||||
• Both rows live on the same white surface separated only by a
|
||||
hairline; r2 has a barely-there blue-50 wash so frequent vs
|
||||
secondary menus read at a glance without dark/light contrast.
|
||||
• Items are now equal-width "tabs" with NO vertical dividers
|
||||
between them (the old cell borders made it look spreadsheet-y).
|
||||
• Hover / active = a 3 px brand-coloured TOP bar + brand text +
|
||||
coloured icon. Reads instantly without colour-flooding the row.
|
||||
• Icons larger (12.5 px) and full-opacity always — easier to scan
|
||||
during demos. Caret is subtle and rotates on open.
|
||||
Compact, modern enterprise SaaS navigation:
|
||||
• Height reduced to 32px per row (64px total) to save screen space.
|
||||
• Smooth horizontal scrolling prevents menu items from getting cut off.
|
||||
• Compact typography, icons and paddings fit all banking modules cleanly.
|
||||
============================================================ */
|
||||
.main-header {
|
||||
background: #fff;
|
||||
border-bottom: 2.5px solid $brand;
|
||||
box-shadow: 0 1px 4px rgb(0 0 0 / 7%);
|
||||
border-bottom: 2px solid $brand;
|
||||
box-shadow: 0 1px 3px rgb(0 0 0 / 6%);
|
||||
position: sticky;
|
||||
|
||||
/* Sit directly under the sticky toolbar (32px tall) so both stay visible. */
|
||||
@@ -306,19 +338,19 @@ $gray-700: #334155;
|
||||
}
|
||||
|
||||
.nav-row {
|
||||
height: 44px;
|
||||
height: 32px;
|
||||
display: flex;
|
||||
align-items: stretch;
|
||||
overflow: visible;
|
||||
overflow: auto visible;
|
||||
position: relative;
|
||||
|
||||
/* Outer frame; vertical dividers between cells are drawn as `border-right`
|
||||
on each `.ni` below. Switched away from the equal-column grid so each
|
||||
cell can size to its own label — long names (General Ledger, Documents
|
||||
Hub) no longer overflow and short ones (Approvals, HRM) no longer waste
|
||||
space. */
|
||||
border: 1px solid $gray-200;
|
||||
background: #fff;
|
||||
scrollbar-width: none;
|
||||
-ms-overflow-style: none;
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.r2.nav-row {
|
||||
@@ -334,25 +366,17 @@ $gray-700: #334155;
|
||||
background: #f8fafc;
|
||||
}
|
||||
|
||||
// ===== Nav Item — modern tab style =====
|
||||
// Typography spec — same family / size / weight / color for BOTH rows.
|
||||
// ===== Nav Item — compact modern tab style =====
|
||||
.ni {
|
||||
position: relative;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 7px;
|
||||
gap: 2.5px;
|
||||
height: 100%;
|
||||
|
||||
/* Each cell sizes to its own label (min-width: max-content) and grows
|
||||
to share any leftover row width. Short labels stay compact, long ones
|
||||
get the room they need — no overlap, no wasted gap. */
|
||||
flex: 1 0 auto;
|
||||
min-width: max-content;
|
||||
padding: 0 14px;
|
||||
|
||||
/* Vertical divider between adjacent cells; outer frame is the row's
|
||||
own border, and the last cell drops its right border below. */
|
||||
min-width: 0;
|
||||
padding: 0 4px;
|
||||
border-right: 1px solid $gray-200;
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
@@ -360,11 +384,11 @@ $gray-700: #334155;
|
||||
'IBM Plex Sans',
|
||||
-apple-system,
|
||||
sans-serif;
|
||||
font-size: 12px;
|
||||
font-size: 10px;
|
||||
font-weight: 500;
|
||||
color: #0a1a2e;
|
||||
line-height: 1.3;
|
||||
letter-spacing: 0.01em;
|
||||
line-height: 1.2;
|
||||
letter-spacing: -0.015em;
|
||||
text-decoration: none;
|
||||
user-select: none;
|
||||
transition:
|
||||
@@ -373,17 +397,15 @@ $gray-700: #334155;
|
||||
box-shadow 0.15s ease;
|
||||
border-radius: 0;
|
||||
|
||||
/* 3px accent strip that fills on hover / active (uses ::before so we
|
||||
don't reflow the row when toggling). */
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 4px;
|
||||
right: 4px;
|
||||
left: 2px;
|
||||
right: 2px;
|
||||
top: 0;
|
||||
height: 3px;
|
||||
height: 2px;
|
||||
background: transparent;
|
||||
border-radius: 0 0 3px 3px;
|
||||
border-radius: 0 0 2px 2px;
|
||||
transition: background 0.15s ease;
|
||||
}
|
||||
|
||||
@@ -410,17 +432,19 @@ $gray-700: #334155;
|
||||
outline-offset: -2px;
|
||||
}
|
||||
|
||||
/* Last cell in a row sits flush against the row's own right edge, so
|
||||
drop its divider to avoid a double 2 px line. */
|
||||
&:last-child {
|
||||
border-right: none;
|
||||
}
|
||||
|
||||
.ni-short {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.ni-ico {
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
font-size: 12px;
|
||||
width: 9.5px;
|
||||
height: 9.5px;
|
||||
font-size: 9.5px;
|
||||
color: $gray-500;
|
||||
flex-shrink: 0;
|
||||
transition: color 0.15s ease;
|
||||
@@ -432,11 +456,12 @@ $gray-700: #334155;
|
||||
}
|
||||
|
||||
.ni-caret {
|
||||
width: 7px;
|
||||
height: 7px;
|
||||
font-size: 7px;
|
||||
width: 5px;
|
||||
height: 5px;
|
||||
font-size: 5px;
|
||||
color: $gray-400;
|
||||
flex-shrink: 0;
|
||||
margin-left: 0.5px;
|
||||
transition:
|
||||
transform 0.18s ease,
|
||||
color 0.18s ease;
|
||||
@@ -447,17 +472,89 @@ $gray-700: #334155;
|
||||
}
|
||||
}
|
||||
|
||||
@media (width <= 1200px) {
|
||||
@media (width >= 1400px) {
|
||||
.ni {
|
||||
padding: 0 8px;
|
||||
gap: 5px;
|
||||
padding: 0 6px;
|
||||
gap: 3.5px;
|
||||
font-size: 10.8px;
|
||||
letter-spacing: 0;
|
||||
}
|
||||
|
||||
.ni-ico {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
.ni-caret {
|
||||
width: 5.5px;
|
||||
height: 5.5px;
|
||||
font-size: 5.5px;
|
||||
margin-left: 1px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (width <= 980px) {
|
||||
@media (width <= 1200px) {
|
||||
.ni {
|
||||
padding: 0 3px;
|
||||
gap: 2px;
|
||||
font-size: 9.8px;
|
||||
letter-spacing: -0.02em;
|
||||
}
|
||||
|
||||
.ni-ico {
|
||||
width: 9px;
|
||||
height: 9px;
|
||||
font-size: 9px;
|
||||
}
|
||||
|
||||
.ni-caret {
|
||||
width: 4.5px;
|
||||
height: 4.5px;
|
||||
font-size: 4.5px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (width <= 1080px) {
|
||||
.ni {
|
||||
padding: 0 2.5px;
|
||||
gap: 1.5px;
|
||||
font-size: 9.4px;
|
||||
letter-spacing: -0.025em;
|
||||
|
||||
.ni-full {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.ni-short {
|
||||
display: inline;
|
||||
}
|
||||
}
|
||||
|
||||
.ni-ico {
|
||||
width: 8.5px;
|
||||
height: 8.5px;
|
||||
font-size: 8.5px;
|
||||
}
|
||||
|
||||
.ni-caret {
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
font-size: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (width <= 880px) {
|
||||
.nav-row {
|
||||
overflow-x: auto;
|
||||
scrollbar-width: thin;
|
||||
}
|
||||
|
||||
.ni {
|
||||
flex: 0 0 auto;
|
||||
padding: 0 6px;
|
||||
gap: 4px;
|
||||
gap: 3px;
|
||||
font-size: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -699,21 +796,29 @@ $gray-700: #334155;
|
||||
|
||||
// ===== Nav Dropdown Menus =====
|
||||
::ng-deep .nav-dropdown {
|
||||
border-radius: 8px !important;
|
||||
border-radius: 6px !important;
|
||||
border: 1px solid $gray-200 !important;
|
||||
box-shadow: 0 6px 24px rgb(0 0 0 / 10%) !important;
|
||||
min-width: 180px !important;
|
||||
padding: 4px 0 !important;
|
||||
margin-top: 2px !important;
|
||||
box-shadow: 0 4px 16px rgb(0 0 0 / 12%) !important;
|
||||
min-width: 170px !important;
|
||||
padding: 3px 0 !important;
|
||||
margin-top: 1px !important;
|
||||
|
||||
.mat-mdc-menu-item {
|
||||
font-size: 12.5px !important;
|
||||
font-size: 10.5px !important;
|
||||
font-weight: 500 !important;
|
||||
height: 34px !important;
|
||||
min-height: 34px !important;
|
||||
padding: 0 14px !important;
|
||||
height: 25px !important;
|
||||
min-height: 25px !important;
|
||||
padding: 0 6px !important;
|
||||
line-height: 25px !important;
|
||||
color: $gray-700 !important;
|
||||
font-family: 'DM Sans', Roboto, sans-serif !important;
|
||||
font-family: 'IBM Plex Sans', Roboto, sans-serif !important;
|
||||
white-space: nowrap !important;
|
||||
|
||||
.menu-item-icon {
|
||||
font-size: 10.5px !important;
|
||||
margin-right: 5px !important;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: $brand-hover !important;
|
||||
@@ -728,39 +833,44 @@ $gray-700: #334155;
|
||||
}
|
||||
|
||||
/* Deposits Mega Panel (inside mat-menu overlay) */
|
||||
.deposit-menu-grid {
|
||||
::ng-deep .deposit-menu-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: 8px 24px;
|
||||
padding: 8px 12px;
|
||||
min-width: 600px;
|
||||
gap: 4px 12px;
|
||||
padding: 6px 10px;
|
||||
min-width: 0;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.deposit-menu-group {
|
||||
::ng-deep .deposit-menu-group {
|
||||
.deposit-group-title {
|
||||
font-weight: 700;
|
||||
font-size: 11px;
|
||||
font-size: 9.5px;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.6px;
|
||||
letter-spacing: 0.5px;
|
||||
color: #1074b9;
|
||||
padding: 4px 16px 6px;
|
||||
padding: 2px 6px 3px;
|
||||
margin-bottom: 2px;
|
||||
border-bottom: 2px solid #1074b9;
|
||||
border-bottom: 1.5px solid #1074b9;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
/* NPA Mega Panel — 4 columns (Reports / Analysis / Classification / Recovery Management) */
|
||||
.npa-grid {
|
||||
grid-template-columns: repeat(4, minmax(200px, 1fr));
|
||||
min-width: 880px;
|
||||
max-width: 96vw;
|
||||
/* NPA Mega Panel — 3 columns */
|
||||
::ng-deep .npa-grid {
|
||||
grid-template-columns: repeat(3, minmax(210px, 1fr));
|
||||
min-width: 0;
|
||||
max-width: 100%;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
/* Reconciliation Mega Panel — 5 columns, teal accent to match the icon palette */
|
||||
.reconciliation-grid {
|
||||
grid-template-columns: repeat(5, minmax(190px, 1fr));
|
||||
min-width: 1040px;
|
||||
max-width: 96vw;
|
||||
/* Reconciliation Mega Panel — 5 columns */
|
||||
::ng-deep .reconciliation-grid {
|
||||
grid-template-columns: repeat(5, minmax(170px, 1fr));
|
||||
min-width: 0;
|
||||
max-width: 100%;
|
||||
overflow-x: hidden;
|
||||
|
||||
.deposit-group-title {
|
||||
color: #0d9488;
|
||||
@@ -780,47 +890,49 @@ $gray-700: #334155;
|
||||
|
||||
.gl-mega-menu {
|
||||
position: absolute;
|
||||
top: 100px;
|
||||
top: 96px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
background: #fff;
|
||||
width: 860px;
|
||||
max-width: 95vw;
|
||||
padding: 20px 24px;
|
||||
box-shadow: 0 6px 24px rgb(0 0 0 / 22%);
|
||||
border-radius: 0 0 10px 10px;
|
||||
width: 760px;
|
||||
max-width: 94vw;
|
||||
max-height: 72vh;
|
||||
overflow-y: auto;
|
||||
padding: 12px 16px;
|
||||
box-shadow: 0 6px 20px rgb(0 0 0 / 18%);
|
||||
border-radius: 0 0 8px 8px;
|
||||
z-index: 1000;
|
||||
border-top: 3px solid #0d47a1;
|
||||
border-top: 2.5px solid #0d47a1;
|
||||
}
|
||||
|
||||
.gl-mega-menu-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
margin-bottom: 14px;
|
||||
padding-bottom: 12px;
|
||||
gap: 8px;
|
||||
margin-bottom: 8px;
|
||||
padding-bottom: 6px;
|
||||
border-bottom: 1px solid #e5e7eb;
|
||||
|
||||
span {
|
||||
font-size: 18px;
|
||||
font-size: 14px;
|
||||
font-weight: 700;
|
||||
color: #0d47a1;
|
||||
letter-spacing: 0.02em;
|
||||
letter-spacing: 0.01em;
|
||||
}
|
||||
}
|
||||
|
||||
.gl-mega-menu-header-icon {
|
||||
font-size: 18px;
|
||||
font-size: 14px;
|
||||
color: #0d47a1;
|
||||
}
|
||||
|
||||
.gl-search {
|
||||
width: 100%;
|
||||
padding: 10px 14px;
|
||||
margin-bottom: 16px;
|
||||
padding: 6px 10px;
|
||||
margin-bottom: 10px;
|
||||
border: 1px solid #d0d5dd;
|
||||
border-radius: 6px;
|
||||
font-size: 14px;
|
||||
border-radius: 5px;
|
||||
font-size: 12px;
|
||||
box-sizing: border-box;
|
||||
background: #f9fafb;
|
||||
|
||||
@@ -828,36 +940,37 @@ $gray-700: #334155;
|
||||
outline: none;
|
||||
border-color: #0d47a1;
|
||||
background: #fff;
|
||||
box-shadow: 0 0 0 3px rgb(13 71 161 / 10%);
|
||||
box-shadow: 0 0 0 2px rgb(13 71 161 / 10%);
|
||||
}
|
||||
}
|
||||
|
||||
.gl-columns {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
gap: 24px;
|
||||
gap: 10px 16px;
|
||||
}
|
||||
|
||||
.gl-group-title {
|
||||
font-weight: 700;
|
||||
font-size: 11px;
|
||||
font-size: 10px;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.8px;
|
||||
letter-spacing: 0.6px;
|
||||
color: #0d47a1;
|
||||
margin-bottom: 10px;
|
||||
padding-bottom: 6px;
|
||||
border-bottom: 2px solid #0d47a1;
|
||||
margin-bottom: 5px;
|
||||
padding-bottom: 3px;
|
||||
border-bottom: 1.5px solid #0d47a1;
|
||||
}
|
||||
|
||||
.gl-link {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 7px 6px;
|
||||
padding: 3.5px 5px;
|
||||
text-decoration: none;
|
||||
color: #344054;
|
||||
font-size: 13px;
|
||||
font-size: 11.5px;
|
||||
line-height: 1.3;
|
||||
cursor: pointer;
|
||||
border-radius: 5px;
|
||||
border-radius: 4px;
|
||||
transition:
|
||||
background 0.15s,
|
||||
color 0.15s;
|
||||
@@ -873,23 +986,21 @@ $gray-700: #334155;
|
||||
}
|
||||
|
||||
.gl-icon {
|
||||
width: 18px;
|
||||
margin-right: 8px;
|
||||
width: 14px;
|
||||
margin-right: 5px;
|
||||
color: #667085;
|
||||
font-size: 13px;
|
||||
font-size: 11px;
|
||||
flex-shrink: 0;
|
||||
|
||||
.gl-link:hover & {
|
||||
color: #0d47a1;
|
||||
}
|
||||
}
|
||||
|
||||
// Marks a menu link as actually wired to a working screen/dialog (vs a still-unwired
|
||||
// placeholder) — a small green dot at the end of the row, so a reviewer can tell at a glance
|
||||
// which items in a mega-menu are functional without having to click every one of them.
|
||||
.gl-link--live::after {
|
||||
content: '';
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
width: 5px;
|
||||
height: 5px;
|
||||
margin-left: auto;
|
||||
flex-shrink: 0;
|
||||
border-radius: 50%;
|
||||
@@ -899,9 +1010,9 @@ $gray-700: #334155;
|
||||
|
||||
/* RBI Mega Menu */
|
||||
.rbi-mega-menu {
|
||||
width: 1100px;
|
||||
max-width: 97vw;
|
||||
max-height: 80vh;
|
||||
width: 880px;
|
||||
max-width: 94vw;
|
||||
max-height: 72vh;
|
||||
overflow-y: auto;
|
||||
border-top-color: #b71c1c;
|
||||
}
|
||||
@@ -909,7 +1020,7 @@ $gray-700: #334155;
|
||||
.rbi-columns {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
gap: 20px;
|
||||
gap: 10px 16px;
|
||||
}
|
||||
|
||||
@keyframes move {
|
||||
|
||||
@@ -167,7 +167,9 @@ export class ShellComponent implements OnInit, OnDestroy {
|
||||
url.includes('/clerk/withdrawal-request') ||
|
||||
url.includes('/clerk/my-disbursement-requests');
|
||||
const isElectionRoute = url.includes('/election');
|
||||
this.hideShellLayout = isCashierOnly || isClerkRoute || isElectionRoute || this.isWithdrawalReviewUrl;
|
||||
const isFdDashboardRoute = url.includes('/fd-dashboard');
|
||||
this.hideShellLayout =
|
||||
isCashierOnly || isClerkRoute || isElectionRoute || isFdDashboardRoute || this.isWithdrawalReviewUrl;
|
||||
this.cdr.detectChanges();
|
||||
};
|
||||
this.routeSub = this.router.events.pipe(filter((e) => e instanceof NavigationEnd)).subscribe(() => checkLayout());
|
||||
@@ -180,10 +182,7 @@ export class ShellComponent implements OnInit, OnDestroy {
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Toggles the current collapsed state of sidenav according to the emitted event.
|
||||
* @param {boolean} event denotes state of sidenav
|
||||
*/
|
||||
/** Toggles the current collapsed state of sidenav according to the emitted event. */
|
||||
toggleCollapse($event: boolean) {
|
||||
this.sidenavCollapsed = $event;
|
||||
this.cdr.detectChanges();
|
||||
@@ -204,12 +203,15 @@ export class ShellComponent implements OnInit, OnDestroy {
|
||||
return /\/checker-inbox-and-tasks\/(share-)?withdrawal-requests\/\d+\/review/.test(this.router.url);
|
||||
}
|
||||
|
||||
/** ESC key — exit fullscreen at Clerk Dashboard / Election / review screen, restoring full shell header. */
|
||||
/** ESC key — exit fullscreen at Clerk Dashboard / Election / FD Dashboard / review screen, restoring full shell header. */
|
||||
@HostListener('document:keydown.escape')
|
||||
onEscapeKey(): void {
|
||||
if (
|
||||
this.hideShellLayout &&
|
||||
(this.router.url.includes('/clerk/') || this.router.url.includes('/election') || this.isWithdrawalReviewUrl)
|
||||
(this.router.url.includes('/clerk/') ||
|
||||
this.router.url.includes('/election') ||
|
||||
this.router.url.includes('/fd-dashboard') ||
|
||||
this.isWithdrawalReviewUrl)
|
||||
) {
|
||||
this.hideShellLayout = false;
|
||||
this.cdr.detectChanges();
|
||||
|
||||
@@ -20,7 +20,9 @@
|
||||
<div class="t-live"></div>
|
||||
LIVE
|
||||
</div>
|
||||
<div class="t-chip">Branch: <strong>HO</strong></div>
|
||||
<div class="t-chip">
|
||||
Branch: <strong>{{ officeLabel }}</strong>
|
||||
</div>
|
||||
<div class="t-chip">
|
||||
Date: <strong>{{ today | date: 'dd MMM yyyy' }}</strong>
|
||||
</div>
|
||||
@@ -522,7 +524,7 @@
|
||||
</mat-menu>
|
||||
|
||||
<!-- Application User Help Menu -->
|
||||
<mat-menu #applicationMenu="matMenu" [overlapTrigger]="false">
|
||||
<mat-menu #applicationMenu="matMenu" [overlapTrigger]="false" class="t-user-menu" xPosition="before">
|
||||
<button mat-menu-item (click)="help()" tabindex="0">
|
||||
<mat-icon matListIcon>
|
||||
<fa-icon icon="question-circle" size="sm"></fa-icon>
|
||||
|
||||
@@ -390,6 +390,103 @@ $icon-hover-border: rgb(255 255 255 / 28%);
|
||||
max-height: 80vh;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
// Compact card per AI module
|
||||
.ai-card.mat-mdc-menu-item {
|
||||
display: flex !important;
|
||||
align-items: flex-start !important;
|
||||
gap: 10px !important;
|
||||
padding: 10px !important;
|
||||
min-height: 52px !important;
|
||||
height: auto !important;
|
||||
border-radius: 9px !important;
|
||||
font-family: inherit !important;
|
||||
line-height: 1.3 !important;
|
||||
white-space: normal !important;
|
||||
overflow: visible !important;
|
||||
transition: background 0.16s ease !important;
|
||||
|
||||
.mat-mdc-menu-item-text,
|
||||
.mdc-list-item__primary-text,
|
||||
.mdc-list-item__content {
|
||||
display: flex !important;
|
||||
align-items: flex-start !important;
|
||||
gap: 10px !important;
|
||||
width: 100% !important;
|
||||
white-space: normal !important;
|
||||
overflow: visible !important;
|
||||
}
|
||||
|
||||
.ai-card-ic {
|
||||
width: 32px !important;
|
||||
height: 32px !important;
|
||||
min-width: 32px !important;
|
||||
display: inline-flex !important;
|
||||
align-items: center !important;
|
||||
justify-content: center !important;
|
||||
border-radius: 8px !important;
|
||||
font-size: 13px !important;
|
||||
flex-shrink: 0 !important;
|
||||
background: var(--c-bg) !important;
|
||||
color: var(--c-color) !important;
|
||||
margin: 0 !important;
|
||||
opacity: 1 !important;
|
||||
transition:
|
||||
background 0.16s ease,
|
||||
color 0.16s ease,
|
||||
transform 0.16s ease !important;
|
||||
|
||||
fa-icon {
|
||||
font-size: 13px !important;
|
||||
width: auto !important;
|
||||
min-width: auto !important;
|
||||
margin: 0 !important;
|
||||
color: inherit !important;
|
||||
opacity: 1 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.ai-card-body {
|
||||
display: flex !important;
|
||||
flex-direction: column !important;
|
||||
flex: 1 !important;
|
||||
min-width: 0 !important;
|
||||
text-align: left !important;
|
||||
white-space: normal !important;
|
||||
}
|
||||
|
||||
.ai-card-t {
|
||||
font-size: 12.5px !important;
|
||||
font-weight: 600 !important;
|
||||
color: #0f172a !important;
|
||||
line-height: 1.25 !important;
|
||||
white-space: normal !important;
|
||||
display: block !important;
|
||||
}
|
||||
|
||||
.ai-card-d {
|
||||
font-size: 10.5px !important;
|
||||
color: #64748b !important;
|
||||
margin-top: 3px !important;
|
||||
line-height: 1.35 !important;
|
||||
white-space: normal !important;
|
||||
display: block !important;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: var(--c-bg) !important;
|
||||
|
||||
.ai-card-ic {
|
||||
background: var(--c-hover) !important;
|
||||
color: #fff !important;
|
||||
transform: scale(1.06) !important;
|
||||
}
|
||||
|
||||
.ai-card-t {
|
||||
color: var(--c-color) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.ai-menu-header {
|
||||
@@ -488,70 +585,101 @@ $icon-hover-border: rgb(255 255 255 / 28%);
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
// Compact card per AI module
|
||||
.ai-card.mat-mdc-menu-item {
|
||||
display: flex !important;
|
||||
align-items: flex-start;
|
||||
gap: 10px;
|
||||
padding: 9px 10px;
|
||||
min-height: 0;
|
||||
height: auto;
|
||||
border-radius: 9px;
|
||||
font-family: inherit;
|
||||
line-height: 1.3;
|
||||
white-space: normal;
|
||||
transition: background 0.16s ease;
|
||||
// ===== User Account Dropdown Menu =====
|
||||
::ng-deep .t-user-menu.mat-mdc-menu-panel {
|
||||
min-width: 190px !important;
|
||||
border-radius: 10px !important;
|
||||
box-shadow:
|
||||
0 10px 25px rgb(15 23 42 / 12%),
|
||||
0 2px 6px rgb(15 23 42 / 6%) !important;
|
||||
border: 1px solid #e2e8f0 !important;
|
||||
padding: 6px 0 !important;
|
||||
background: #fff !important;
|
||||
|
||||
.ai-card-ic {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 8px;
|
||||
font-size: 13px;
|
||||
flex-shrink: 0;
|
||||
background: var(--c-bg);
|
||||
color: var(--c-color);
|
||||
.mat-mdc-menu-content {
|
||||
padding: 4px 0 !important;
|
||||
}
|
||||
|
||||
.mat-mdc-menu-item {
|
||||
height: 38px !important;
|
||||
min-height: 38px !important;
|
||||
line-height: 38px !important;
|
||||
padding: 0 14px !important;
|
||||
display: flex !important;
|
||||
align-items: center !important;
|
||||
font-size: 13px !important;
|
||||
font-weight: 500 !important;
|
||||
color: #334155 !important;
|
||||
transition:
|
||||
background 0.16s ease,
|
||||
color 0.16s ease,
|
||||
transform 0.16s ease;
|
||||
}
|
||||
background-color 0.15s ease,
|
||||
color 0.15s ease !important;
|
||||
|
||||
.ai-card-body {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.ai-card-t {
|
||||
font-size: 12.5px;
|
||||
font-weight: 600;
|
||||
color: #0f172a;
|
||||
line-height: 1.25;
|
||||
}
|
||||
|
||||
.ai-card-d {
|
||||
font-size: 10.5px;
|
||||
color: #64748b;
|
||||
margin-top: 2px;
|
||||
line-height: 1.35;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: var(--c-bg);
|
||||
|
||||
.ai-card-ic {
|
||||
background: var(--c-hover);
|
||||
color: #fff;
|
||||
transform: scale(1.06);
|
||||
.mat-mdc-menu-item-text {
|
||||
display: inline-flex !important;
|
||||
align-items: center !important;
|
||||
width: 100% !important;
|
||||
font-size: 13px !important;
|
||||
color: inherit !important;
|
||||
font-weight: 500 !important;
|
||||
}
|
||||
|
||||
.ai-card-t {
|
||||
color: var(--c-color);
|
||||
mat-icon {
|
||||
margin-right: 10px !important;
|
||||
width: 18px !important;
|
||||
height: 18px !important;
|
||||
min-width: 18px !important;
|
||||
display: inline-flex !important;
|
||||
align-items: center !important;
|
||||
justify-content: center !important;
|
||||
color: #64748b !important;
|
||||
font-size: 14px !important;
|
||||
flex-shrink: 0 !important;
|
||||
|
||||
fa-icon {
|
||||
font-size: 14px !important;
|
||||
width: 14px !important;
|
||||
min-width: 14px !important;
|
||||
text-align: center !important;
|
||||
margin-right: 0 !important;
|
||||
color: inherit !important;
|
||||
opacity: 1 !important;
|
||||
}
|
||||
}
|
||||
|
||||
span {
|
||||
font-size: 13px !important;
|
||||
color: inherit !important;
|
||||
font-weight: 500 !important;
|
||||
white-space: nowrap !important;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: #f1f5f9 !important;
|
||||
color: #0d47a1 !important;
|
||||
|
||||
mat-icon {
|
||||
color: #0d47a1 !important;
|
||||
}
|
||||
}
|
||||
|
||||
&#logout {
|
||||
color: #dc2626 !important;
|
||||
border-top: 1px solid #f1f5f9 !important;
|
||||
margin-top: 4px !important;
|
||||
padding-top: 2px !important;
|
||||
|
||||
mat-icon {
|
||||
color: #dc2626 !important;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: #fef2f2 !important;
|
||||
color: #b91c1c !important;
|
||||
|
||||
mat-icon {
|
||||
color: #b91c1c !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -49,6 +49,7 @@ import { MatIcon } from '@angular/material/icon';
|
||||
import { NotificationsTrayComponent as NotificationsTrayComponent_1 } from '../../../shared/notifications-tray/notifications-tray.component';
|
||||
import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
|
||||
import { DocumentationLinksService } from 'app/shared/services/documentation-links.service';
|
||||
import { businessToday } from 'app/core/utils/business-today';
|
||||
|
||||
/**
|
||||
* Toolbar component.
|
||||
@@ -92,6 +93,14 @@ export class ToolbarComponent implements OnInit, AfterViewInit, AfterContentChec
|
||||
@ViewChild('templateAppMenu') templateAppMenu: TemplateRef<any>;
|
||||
@ViewChild('notificationsTray') notificationsTray: NotificationsTrayComponent;
|
||||
|
||||
/** The signed-in user's office — this chip read "HO" for every login, branch staff included. */
|
||||
get officeLabel(): string {
|
||||
if (this.authenticationService.isHeadOfficeUser()) {
|
||||
return 'HO';
|
||||
}
|
||||
return this.authenticationService.getCredentials()?.officeName || '—';
|
||||
}
|
||||
|
||||
/** Subscription to breakpoint observer for handset. */
|
||||
isHandset$: Observable<boolean> = this.breakpointObserver
|
||||
.observe(Breakpoints.Handset)
|
||||
@@ -100,8 +109,10 @@ export class ToolbarComponent implements OnInit, AfterViewInit, AfterContentChec
|
||||
/** Sets the initial state of sidenav as collapsed. Not collapsed if false. */
|
||||
sidenavCollapsed = true;
|
||||
|
||||
/** Current date for top bar display */
|
||||
today = new Date();
|
||||
/** The bank's "today" for the top bar — the business date when enabled, else the server date. */
|
||||
get today(): Date {
|
||||
return businessToday();
|
||||
}
|
||||
|
||||
/** Last login time display */
|
||||
lastLoginTime = this.formatLastLogin();
|
||||
|
||||
@@ -0,0 +1,30 @@
|
||||
/**
|
||||
* 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/.
|
||||
*/
|
||||
|
||||
/**
|
||||
* The bank's "today": the business date while `enable-business-date` is on, the server's own date
|
||||
* while it is off. The server decides which (GET /branchday/today); the web app stores the answer
|
||||
* in `mifosXServerDate` at login and whenever the business date changes. Before that has happened
|
||||
* the browser clock is the only date there is, so it is the fallback.
|
||||
*/
|
||||
export function businessToday(): Date {
|
||||
const stored = localStorage.getItem('mifosXServerDate');
|
||||
const match = stored ? /^(\d{4})-(\d{2})-(\d{2})$/.exec(stored) : null;
|
||||
if (!match) {
|
||||
return new Date();
|
||||
}
|
||||
// Built from parts so it is local midnight — new Date('yyyy-MM-dd') would be UTC midnight and
|
||||
// land on the previous day in any timezone behind UTC.
|
||||
return new Date(Number(match[1]), Number(match[2]) - 1, Number(match[3]));
|
||||
}
|
||||
|
||||
/** {@link businessToday} as yyyy-MM-dd. */
|
||||
export function businessTodayIso(): string {
|
||||
const d = businessToday();
|
||||
return `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`;
|
||||
}
|
||||
@@ -8,7 +8,10 @@
|
||||
|
||||
<div class="cur-view">
|
||||
<!-- ─── Dormancy risk alert (only when subStatus has left Active) ──── -->
|
||||
<mifosx-dormancy-alert-panel [accountData]="currentAccountData"></mifosx-dormancy-alert-panel>
|
||||
<!-- Shown only when the account's product has Dormancy Alert = Yes -->
|
||||
@if (currentAccountData?.dormancyAlert) {
|
||||
<mifosx-dormancy-alert-panel [accountData]="currentAccountData"></mifosx-dormancy-alert-panel>
|
||||
}
|
||||
|
||||
<!-- ─── Gradient hero header ─────────────────────────────────────── -->
|
||||
<header class="cur-hero">
|
||||
|
||||
+71
-153
@@ -59,16 +59,7 @@
|
||||
<span class="nx-mono">[{{ currentAccountData.currency.code }}]</span>
|
||||
</span>
|
||||
</div>
|
||||
<div class="nx-row">
|
||||
<span class="nx-row__label">{{ 'labels.inputs.Nominal Interest Rate' | translate }}</span>
|
||||
<span class="nx-row__value nx-row__value--amount">
|
||||
@if (currentAccountData.nominalAnnualInterestRate) {
|
||||
{{ currentAccountData.nominalAnnualInterestRate | formatNumber }} %
|
||||
} @else {
|
||||
0 %
|
||||
}
|
||||
</span>
|
||||
</div>
|
||||
<!-- A current account earns no interest, so no interest rate is shown here; OD interest is under Overdraft. -->
|
||||
} @else {
|
||||
<div class="nx-row">
|
||||
<span class="nx-row__label">{{ 'labels.inputs.Field Officer' | translate }}</span>
|
||||
@@ -102,17 +93,17 @@
|
||||
</span>
|
||||
</div>
|
||||
}
|
||||
@if (currentAccountData.summary.totalInterestEarned >= 0) {
|
||||
@if (currentAccountData.summary.totalWithdrawals) {
|
||||
<div class="nx-row">
|
||||
<span class="nx-row__label">{{ 'labels.inputs.Total Interest Earned' | translate }}</span>
|
||||
<span class="nx-row__value nx-row__value--amount">
|
||||
<span class="nx-row__label">{{ 'labels.inputs.Total Withdrawls' | translate }}</span>
|
||||
<span class="nx-row__value nx-row__value--amount nx-row__value--negative">
|
||||
{{
|
||||
currentAccountData.summary.totalInterestEarned | currency: currency.code : 'symbol-narrow' : '1.2-2'
|
||||
currentAccountData.summary.totalWithdrawals | currency: currency.code : 'symbol-narrow' : '1.2-2'
|
||||
}}
|
||||
</span>
|
||||
</div>
|
||||
}
|
||||
@if (!currentAccountData.summary.totalDeposits && !(currentAccountData.summary.totalInterestEarned >= 0)) {
|
||||
@if (!currentAccountData.summary.totalDeposits && !currentAccountData.summary.totalWithdrawals) {
|
||||
<div class="nx-empty">
|
||||
<fa-icon icon="inbox" class="nx-empty__ico"></fa-icon>
|
||||
<span>No activity yet.</span>
|
||||
@@ -132,16 +123,7 @@
|
||||
<h3 class="nx-card__title">{{ 'labels.heading.Account Summary' | translate }}</h3>
|
||||
</header>
|
||||
<div class="nx-card__body">
|
||||
@if (currentAccountData.summary.totalWithdrawals) {
|
||||
<div class="nx-row">
|
||||
<span class="nx-row__label">{{ 'labels.inputs.Total Withdrawls' | translate }}</span>
|
||||
<span class="nx-row__value nx-row__value--amount nx-row__value--negative">
|
||||
{{
|
||||
currentAccountData.summary.totalWithdrawals | currency: currency.code : 'symbol-narrow' : '1.2-2'
|
||||
}}
|
||||
</span>
|
||||
</div>
|
||||
}
|
||||
<!-- A current account earns no interest: no interest earned/posted rows. OD interest has its own card. -->
|
||||
@if (currentAccountData.summary.totalWithdrawalFees) {
|
||||
<div class="nx-row">
|
||||
<span class="nx-row__label">{{ 'labels.inputs.Withdrawals Fees' | translate }}</span>
|
||||
@@ -160,89 +142,6 @@
|
||||
</span>
|
||||
</div>
|
||||
}
|
||||
@if (currentAccountData.summary.totalInterestEarned >= 0) {
|
||||
<div class="nx-row">
|
||||
<span class="nx-row__label">{{ 'labels.inputs.Interest Earned' | translate }}</span>
|
||||
<span class="nx-row__value nx-row__value--amount">
|
||||
{{
|
||||
currentAccountData.summary.totalInterestEarned | currency: currency.code : 'symbol-narrow' : '1.2-2'
|
||||
}}
|
||||
</span>
|
||||
</div>
|
||||
}
|
||||
@if (currentAccountData.summary.totalInterestPosted) {
|
||||
<div class="nx-row">
|
||||
<span class="nx-row__label">{{ 'labels.inputs.Interest Posted' | translate }}</span>
|
||||
<span class="nx-row__value nx-row__value--amount">
|
||||
{{
|
||||
currentAccountData.summary.totalInterestPosted | currency: currency.code : 'symbol-narrow' : '1.2-2'
|
||||
}}
|
||||
</span>
|
||||
</div>
|
||||
}
|
||||
@if (currentAccountData.summary.interestNotPosted >= 0) {
|
||||
<div class="nx-row">
|
||||
<span class="nx-row__label">{{ 'labels.inputs.Interest Earned Not Posted' | translate }}</span>
|
||||
<span class="nx-row__value nx-row__value--amount">
|
||||
{{
|
||||
currentAccountData.summary.interestNotPosted | currency: currency.code : 'symbol-narrow' : '1.2-2'
|
||||
}}
|
||||
</span>
|
||||
</div>
|
||||
}
|
||||
@if (currentAccountData.summary.totalOverdraftInterestDerived) {
|
||||
<div class="nx-row">
|
||||
<span class="nx-row__label">{{ 'labels.inputs.Interest On Overdraft' | translate }}</span>
|
||||
<span class="nx-row__value nx-row__value--amount">
|
||||
{{
|
||||
currentAccountData.summary.totalOverdraftInterestDerived
|
||||
| currency: currency.code : 'symbol-narrow' : '1.2-2'
|
||||
}}
|
||||
</span>
|
||||
</div>
|
||||
}
|
||||
@if (currentAccountData.summary.interestNotPosted < 0) {
|
||||
<div class="nx-row">
|
||||
<span class="nx-row__label">{{ 'labels.inputs.Overdraft Interest Not Posted' | translate }}</span>
|
||||
<span class="nx-row__value nx-row__value--amount">
|
||||
{{
|
||||
currentAccountData.summary.interestNotPosted | currency: currency.code : 'symbol-narrow' : '1.2-2'
|
||||
}}
|
||||
</span>
|
||||
</div>
|
||||
}
|
||||
@if (currentAccountData.nominalAnnualInterestRate) {
|
||||
<div class="nx-row">
|
||||
<span class="nx-row__label">{{ 'labels.inputs.Nominal Interest Rate' | translate }}</span>
|
||||
<span class="nx-row__value nx-row__value--amount">
|
||||
{{ currentAccountData.nominalAnnualInterestRate | formatNumber }} %
|
||||
</span>
|
||||
</div>
|
||||
}
|
||||
<div class="nx-row">
|
||||
<span class="nx-row__label">{{ 'labels.inputs.Interest Compounding Period' | translate }}</span>
|
||||
<span class="nx-row__value">
|
||||
{{ currentAccountData.interestCompoundingPeriodType.value | translateKey: 'catalogs' }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="nx-row">
|
||||
<span class="nx-row__label">{{ 'labels.inputs.Interest Posting Period' | translate }}</span>
|
||||
<span class="nx-row__value">
|
||||
{{ currentAccountData.interestPostingPeriodType.value | translateKey: 'catalogs' }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="nx-row">
|
||||
<span class="nx-row__label">{{ 'labels.inputs.Interest Calculated Using' | translate }}</span>
|
||||
<span class="nx-row__value">
|
||||
{{ currentAccountData.interestCalculationType.value | translateKey: 'catalogs' }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="nx-row">
|
||||
<span class="nx-row__label">{{ 'labels.inputs.Days in Year' | translate }}</span>
|
||||
<span class="nx-row__value">
|
||||
{{ currentAccountData.interestCalculationDaysInYearType.value | translateKey: 'catalogs' }}
|
||||
</span>
|
||||
</div>
|
||||
@if (currentAccountData.withdrawalFee) {
|
||||
<div class="nx-row">
|
||||
<span class="nx-row__label">{{ 'labels.inputs.Withdrawal Fee' | translate }}</span>
|
||||
@@ -289,37 +188,6 @@
|
||||
</span>
|
||||
</div>
|
||||
}
|
||||
@if (currentAccountData.allowOverdraft) {
|
||||
<div class="nx-row">
|
||||
<span class="nx-row__label">{{ 'labels.inputs.Overdraft Limit' | translate }}</span>
|
||||
<span class="nx-row__value nx-row__value--amount">
|
||||
{{ currentAccountData.overdraftLimit | currency: currency.code : 'symbol-narrow' : '1.2-2' }}
|
||||
</span>
|
||||
</div>
|
||||
}
|
||||
@if (currentAccountData.allowOverdraft) {
|
||||
<div class="nx-row">
|
||||
<span class="nx-row__label">
|
||||
{{ 'labels.inputs.Minimum Overdraft Required for Interest Calculation' | translate }}
|
||||
</span>
|
||||
<span class="nx-row__value">
|
||||
{{
|
||||
currentAccountData.minOverdraftForInterestCalculation
|
||||
| currency: currency.code : 'symbol-narrow' : '1.2-2'
|
||||
}}
|
||||
</span>
|
||||
</div>
|
||||
}
|
||||
@if (currentAccountData.minBalanceForInterestCalculation) {
|
||||
<div class="nx-row">
|
||||
<span class="nx-row__label">
|
||||
{{ 'labels.inputs.Min Balance Required for Interest Calculation' | translate }}
|
||||
</span>
|
||||
<span class="nx-row__value">
|
||||
{{ currentAccountData.minBalanceForInterestCalculation | formatNumber }}
|
||||
</span>
|
||||
</div>
|
||||
}
|
||||
@if (currentAccountData.minRequiredBalance) {
|
||||
<div class="nx-row">
|
||||
<span class="nx-row__label">{{ 'labels.inputs.Minimum Required Balance' | translate }}</span>
|
||||
@@ -332,14 +200,6 @@
|
||||
<span class="nx-row__value">{{ currentAccountData.enforceMinRequiredBalance | yesNo }}</span>
|
||||
</div>
|
||||
}
|
||||
@if (currentAccountData.summary.lastInterestCalculationDate) {
|
||||
<div class="nx-row">
|
||||
<span class="nx-row__label">{{ 'labels.inputs.Interest Recalculation Date' | translate }}</span>
|
||||
<span class="nx-row__value">
|
||||
{{ currentAccountData.summary.lastInterestCalculationDate | dateFormat }}
|
||||
</span>
|
||||
</div>
|
||||
}
|
||||
@if (currentAccountData.onHoldFunds) {
|
||||
<div class="nx-row">
|
||||
<span class="nx-row__label">{{ 'labels.inputs.On Hold Funds' | translate }}</span>
|
||||
@@ -350,14 +210,72 @@
|
||||
</span>
|
||||
</div>
|
||||
}
|
||||
@if (currentAccountData.withHoldTax) {
|
||||
<div class="nx-row">
|
||||
<span class="nx-row__label">{{ 'labels.inputs.Withhold Tax Group' | translate }}</span>
|
||||
<span class="nx-row__value">{{ currentAccountData.taxGroup.name }}</span>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Overdraft: the only interest on a current account is what the customer pays on an OD. -->
|
||||
@if (currentAccountData.allowOverdraft) {
|
||||
<section class="nx-card">
|
||||
<header class="nx-card__head">
|
||||
<fa-icon icon="hand-holding-usd" class="nx-card__ico"></fa-icon>
|
||||
<h3 class="nx-card__title">Overdraft (OD)</h3>
|
||||
</header>
|
||||
<div class="nx-card__body">
|
||||
<div class="nx-row">
|
||||
<span class="nx-row__label">Maximum OD Limit (per product)</span>
|
||||
<span class="nx-row__value nx-row__value--amount">
|
||||
{{ currentAccountData.overdraftLimit | currency: currency.code : 'symbol-narrow' : '1.2-2' }}
|
||||
</span>
|
||||
</div>
|
||||
@if (currentAccountData.nominalAnnualInterestRateOverdraft) {
|
||||
<div class="nx-row">
|
||||
<span class="nx-row__label">OD Interest Rate</span>
|
||||
<span class="nx-row__value">
|
||||
{{ currentAccountData.nominalAnnualInterestRateOverdraft | formatNumber }} % p.a.
|
||||
</span>
|
||||
</div>
|
||||
}
|
||||
@if (currentAccountData.minOverdraftForInterestCalculation) {
|
||||
<div class="nx-row">
|
||||
<span class="nx-row__label">Minimum OD for Interest</span>
|
||||
<span class="nx-row__value">
|
||||
{{
|
||||
currentAccountData.minOverdraftForInterestCalculation
|
||||
| currency: currency.code : 'symbol-narrow' : '1.2-2'
|
||||
}}
|
||||
</span>
|
||||
</div>
|
||||
}
|
||||
<div class="nx-row">
|
||||
<span class="nx-row__label">OD Interest Posting</span>
|
||||
<span class="nx-row__value">
|
||||
{{ currentAccountData.interestPostingPeriodType?.value | translateKey: 'catalogs' }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="nx-row">
|
||||
<span class="nx-row__label">{{ 'labels.inputs.Days in Year' | translate }}</span>
|
||||
<span class="nx-row__value">
|
||||
{{ currentAccountData.interestCalculationDaysInYearType?.value | translateKey: 'catalogs' }}
|
||||
</span>
|
||||
</div>
|
||||
@if (currentAccountData.validForPeriod) {
|
||||
<div class="nx-row">
|
||||
<span class="nx-row__label">Sanction Validity</span>
|
||||
<span class="nx-row__value">{{ currentAccountData.validForPeriod }}</span>
|
||||
</div>
|
||||
}
|
||||
<div class="nx-row">
|
||||
<span class="nx-row__label">OD Interest Charged</span>
|
||||
<span class="nx-row__value nx-row__value--amount">
|
||||
{{
|
||||
currentAccountData.summary.totalOverdraftInterestDerived || 0
|
||||
| currency: currency.code : 'symbol-narrow' : '1.2-2'
|
||||
}}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
}
|
||||
} @else {
|
||||
<section class="nx-card">
|
||||
<header class="nx-card__head">
|
||||
|
||||
+21
-2
@@ -54,8 +54,8 @@
|
||||
<mat-icon>account_balance</mat-icon>
|
||||
</div>
|
||||
<div class="bank-name-block">
|
||||
<div class="bank-title">LincPay Co-operative Bank Ltd.</div>
|
||||
<div class="bank-subtitle">Current Account Statement</div>
|
||||
<div class="bank-title">{{ bankName }}</div>
|
||||
<div class="bank-subtitle">{{ bankSubtitle }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="statement-label">
|
||||
@@ -64,6 +64,25 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Branch line — IFSC/MICR are how a UCB customer identifies which branch issued this, and are
|
||||
needed for NEFT/RTGS/cheque printing, so a real passbook always carries them. -->
|
||||
@if (branchName || ifscCode || micrCode) {
|
||||
<div class="branch-line">
|
||||
@if (branchName) {
|
||||
<span>{{ branchName }} Branch</span>
|
||||
}
|
||||
@if (branchAddress) {
|
||||
<span>{{ branchAddress }}</span>
|
||||
}
|
||||
@if (ifscCode) {
|
||||
<span>IFSC: {{ ifscCode }}</span>
|
||||
}
|
||||
@if (micrCode) {
|
||||
<span>MICR: {{ micrCode }}</span>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
|
||||
<!-- Account Details -->
|
||||
<div class="account-details-band">
|
||||
<div class="account-details-grid">
|
||||
|
||||
+12
@@ -127,6 +127,18 @@ $header-text: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
// ─── Branch Identification Line ──────────────────────────────────────────────
|
||||
.branch-line {
|
||||
background: #e8edf5;
|
||||
border-bottom: 1px solid $border-color;
|
||||
padding: 6px 24px;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 4px 18px;
|
||||
font-size: 11px;
|
||||
color: #4a5a7a;
|
||||
}
|
||||
|
||||
// ─── Account Details Band ────────────────────────────────────────────────────
|
||||
.account-details-band {
|
||||
background: #f0f3f9;
|
||||
|
||||
+53
-1
@@ -11,11 +11,12 @@ import { Component, OnInit, OnDestroy, inject, ElementRef, ViewChild } from '@an
|
||||
import { ActivatedRoute } from '@angular/router';
|
||||
import { UntypedFormBuilder } from '@angular/forms';
|
||||
import { CurrencyPipe } from '@angular/common';
|
||||
import { Subject, takeUntil } from 'rxjs';
|
||||
import { Subject, takeUntil, catchError, forkJoin, of } from 'rxjs';
|
||||
|
||||
/** Custom Services */
|
||||
import { SettingsService } from 'app/settings/settings.service';
|
||||
import { Dates } from 'app/core/utils/dates';
|
||||
import { OrganizationService } from '../../../organization/organization.service';
|
||||
import { Currency } from 'app/shared/models/general.model';
|
||||
import {
|
||||
CurrentAccountTransaction,
|
||||
@@ -44,6 +45,7 @@ export class PassbookTabComponent implements OnInit, OnDestroy {
|
||||
private formBuilder = inject(UntypedFormBuilder);
|
||||
private settingsService = inject(SettingsService);
|
||||
private dateUtils = inject(Dates);
|
||||
private organizationService = inject(OrganizationService);
|
||||
|
||||
private destroy$ = new Subject<void>();
|
||||
|
||||
@@ -60,6 +62,17 @@ export class PassbookTabComponent implements OnInit, OnDestroy {
|
||||
availableBalance: number = 0;
|
||||
activatedOnDate: any = null;
|
||||
|
||||
/** Bank/branch letterhead — real values from Institution Profile + Branch Profile (Organization
|
||||
* module) rather than a hardcoded name, so a printed passbook actually identifies which bank and
|
||||
* branch issued it, the way a real UCB's core banking system does. Falls back to a generic label
|
||||
* if the profile was never filled in, rather than showing a fabricated bank name. */
|
||||
bankName = 'Bank';
|
||||
bankSubtitle = 'Current Account Statement';
|
||||
branchName = '';
|
||||
branchAddress = '';
|
||||
ifscCode = '';
|
||||
micrCode = '';
|
||||
|
||||
/** Transactions */
|
||||
allTransactions: CurrentAccountTransaction[] = [];
|
||||
filteredTransactions: CurrentAccountTransaction[] = [];
|
||||
@@ -92,6 +105,33 @@ export class PassbookTabComponent implements OnInit, OnDestroy {
|
||||
fromDate: [''],
|
||||
toDate: ['']
|
||||
});
|
||||
|
||||
this.loadLetterhead();
|
||||
}
|
||||
|
||||
/** Institution Profile is the bank's own single record; Branch Profile is per-office. There is no
|
||||
* office id on the current account data reaching this tab, and this deployment runs a single
|
||||
* branch, so the first branch profile on record is the correct one here — a genuinely
|
||||
* multi-branch deployment would need the account's own office id threaded through instead. */
|
||||
private loadLetterhead(): void {
|
||||
forkJoin({
|
||||
institution: this.organizationService.getInstitutionProfile().pipe(catchError(() => of(null))),
|
||||
branches: this.organizationService.getBranchProfiles().pipe(catchError(() => of([])))
|
||||
}).subscribe(({ institution, branches }: any) => {
|
||||
if (institution) {
|
||||
this.bankName = institution.passbookHeaderName || institution.bankName || institution.legalName || 'Bank';
|
||||
this.bankSubtitle = institution.licenseNumber
|
||||
? `Lic. No. ${institution.licenseNumber}`
|
||||
: 'Current Account Statement';
|
||||
}
|
||||
const branch = Array.isArray(branches) ? branches[0] : null;
|
||||
if (branch) {
|
||||
this.branchName = branch.officeName || '';
|
||||
this.branchAddress = branch.address || '';
|
||||
this.ifscCode = branch.ifscCode || '';
|
||||
this.micrCode = branch.micrCode || '';
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
private computeRunningBalances(transactions: CurrentAccountTransaction[]): CurrentAccountTransaction[] {
|
||||
@@ -279,6 +319,18 @@ export class PassbookTabComponent implements OnInit, OnDestroy {
|
||||
margin-top: 3px;
|
||||
}
|
||||
|
||||
/* Branch identification line */
|
||||
.branch-line {
|
||||
background: #e8edf5;
|
||||
border-bottom: 1px solid #d0d7e3;
|
||||
padding: 5px 20px;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 4px 16px;
|
||||
font-size: 9.5px;
|
||||
color: #4a5a7a;
|
||||
}
|
||||
|
||||
/* Account details band */
|
||||
.account-details-band {
|
||||
background: #f0f3f9;
|
||||
|
||||
-12
@@ -135,18 +135,6 @@
|
||||
<mat-icon><fa-icon icon="eye" size="sm"></fa-icon></mat-icon>
|
||||
<span>{{ 'labels.text.View Transaction' | translate }}</span>
|
||||
</button>
|
||||
@if (!transaction.reversed) {
|
||||
<span>
|
||||
<button
|
||||
mat-menu-item
|
||||
*mifosxHasPermission="'ADJUSTTRANSACTION_CURRENTACCOUNT'"
|
||||
(click)="undoTransaction(transaction, $event)"
|
||||
>
|
||||
<mat-icon><fa-icon icon="undo" size="sm"></fa-icon></mat-icon>
|
||||
<span>{{ 'tooltips.Undo Transaction' | translate }}</span>
|
||||
</button>
|
||||
</span>
|
||||
}
|
||||
<button
|
||||
mat-menu-item
|
||||
class="account-action-button"
|
||||
|
||||
-12
@@ -40,18 +40,6 @@
|
||||
</button>
|
||||
</span>
|
||||
}
|
||||
@if (allowUndo()) {
|
||||
<span>
|
||||
<button
|
||||
mat-raised-button
|
||||
color="warn"
|
||||
*mifosxHasPermission="'UNDOTRANSACTION_CURRENTACCOUNT'"
|
||||
(click)="undoTransaction()"
|
||||
>
|
||||
<fa-icon icon="undo" class="m-r-10"></fa-icon>{{ 'labels.buttons.Undo' | translate }}
|
||||
</button>
|
||||
</span>
|
||||
}
|
||||
</div>
|
||||
|
||||
<div class="container">
|
||||
|
||||
+381
@@ -0,0 +1,381 @@
|
||||
<!--
|
||||
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="dialog-wrapper">
|
||||
<div class="dialog-header">
|
||||
<div class="header-icon">
|
||||
<mat-icon>account_balance_wallet</mat-icon>
|
||||
</div>
|
||||
<div class="header-text">
|
||||
<h2>Apply DDS Receipt</h2>
|
||||
<p>
|
||||
Agent <strong class="mono">{{ data.agentCode }}</strong> · {{ data.agentName }}
|
||||
@if (data.glCode) {
|
||||
· GL <strong class="mono">{{ data.glCode }}</strong>
|
||||
}
|
||||
</p>
|
||||
</div>
|
||||
<button type="button" mat-icon-button class="header-close" [mat-dialog-close]="false" aria-label="Close">
|
||||
<mat-icon>close</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<mat-dialog-content class="dialog-body">
|
||||
@if (loading) {
|
||||
<div class="state-block">
|
||||
<mat-spinner diameter="30"></mat-spinner>
|
||||
<span>Loading entries and receipts…</span>
|
||||
</div>
|
||||
} @else {
|
||||
<!-- What the picked vouchers have to cover, and whether they do. -->
|
||||
<div class="sc-card">
|
||||
<div class="sc-row" [class.sc-ok]="canApply" [class.sc-bad]="pickedReceipts.size > 0 && difference !== 0">
|
||||
<div class="sc-left">
|
||||
<span class="sc-label">Collections up to {{ data.entryDate | date: 'dd/MM/yyyy' }}</span>
|
||||
<span class="sc-sub"
|
||||
>{{ pickedEntryCount }} {{ pickedEntryCount === 1 ? 'entry' : 'entries' }} to settle</span
|
||||
>
|
||||
</div>
|
||||
<div class="sc-right">
|
||||
<span class="sc-val">{{ required | number: '1.2-2' }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="sc-row sc-sep"
|
||||
[class.sc-ok]="canApply"
|
||||
[class.sc-bad]="pickedReceipts.size > 0 && difference !== 0"
|
||||
>
|
||||
<div class="sc-left">
|
||||
<span class="sc-label">Vouchers picked</span>
|
||||
<span class="sc-sub"
|
||||
>{{ pickedReceipts.size }} {{ pickedReceipts.size === 1 ? 'voucher' : 'vouchers' }}</span
|
||||
>
|
||||
</div>
|
||||
<div class="sc-right">
|
||||
<span
|
||||
class="sc-val"
|
||||
[class.sc-val-ok]="canApply"
|
||||
[class.sc-val-bad]="pickedReceipts.size > 0 && difference !== 0"
|
||||
>
|
||||
{{ received | number: '1.2-2' }}
|
||||
</span>
|
||||
@if (pickedReceipts.size > 0 && pickedDays.size > 0 && difference < 0) {
|
||||
<span class="sc-tag sc-tag-bad">Short {{ -difference | number: '1.2-2' }}</span>
|
||||
} @else if (pickedReceipts.size > 0 && pickedDays.size > 0 && difference > 0) {
|
||||
<span class="sc-tag sc-tag-bad">Over {{ difference | number: '1.2-2' }}</span>
|
||||
} @else if (canApply) {
|
||||
<span class="sc-tag sc-tag-ok">✓ Matches</span>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sc-total-row" [class.sc-total-ok]="canApply">
|
||||
<span class="sc-total-lbl">Total to Apply</span>
|
||||
<div class="sc-total-nums">
|
||||
<span class="sc-total-req mono">{{ required | number: '1.2-2' }}</span>
|
||||
<span class="sc-arrow">→</span>
|
||||
<span class="sc-total-got mono" [class.sc-total-got-ok]="canApply">{{ received | number: '1.2-2' }}</span>
|
||||
<span class="sc-status-pill" [class.sc-pill-ok]="canApply" [class.sc-pill-pending]="!canApply">
|
||||
{{ canApply ? '✓ Ready' : 'Pending' }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ── 1: the days the agent wrote down ──────────────────────────────────── -->
|
||||
<section class="slot">
|
||||
<header class="slot-head">
|
||||
<span class="slot-step">1</span>
|
||||
<div class="slot-title">
|
||||
<h3>Outstanding up to {{ data.entryDate | date: 'dd/MM/yyyy' }}</h3>
|
||||
<p>Everything the agent wrote down and has not handed in, day by day. Open a day to see its lines.</p>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
@if (days.length) {
|
||||
<ul class="options">
|
||||
@for (day of days; track day.date) {
|
||||
<li class="option" (click)="toggleOpen(day, $event)">
|
||||
<div class="option-main">
|
||||
<span class="option-voucher mono">{{ day.date | date: 'dd/MM/yyyy' }}</span>
|
||||
<span class="option-meta"
|
||||
>{{ day.entries.length }} {{ day.entries.length === 1 ? 'entry' : 'entries' }}</span
|
||||
>
|
||||
</div>
|
||||
<span class="option-amount mono">{{ day.total | number: '1.2-2' }}</span>
|
||||
<button
|
||||
type="button"
|
||||
class="option-info"
|
||||
(click)="toggleOpen(day, $event)"
|
||||
aria-label="Show the day's lines"
|
||||
>
|
||||
<mat-icon>{{ openDay === day.date ? 'expand_less' : 'expand_more' }}</mat-icon>
|
||||
</button>
|
||||
</li>
|
||||
@if (openDay === day.date) {
|
||||
<li class="day-lines">
|
||||
@if (day.entries.length > 8) {
|
||||
<input
|
||||
class="day-search"
|
||||
type="text"
|
||||
[(ngModel)]="daySearch"
|
||||
placeholder="Search party code or name"
|
||||
autocomplete="off"
|
||||
/>
|
||||
}
|
||||
<div class="day-scroll">
|
||||
<table class="entries">
|
||||
<tbody>
|
||||
@for (entry of visibleEntries(day); track entry.id) {
|
||||
<tr>
|
||||
<td class="entry-code">{{ entry.partyCode }}</td>
|
||||
<td class="entry-name">{{ entry.partyName }}</td>
|
||||
<td>
|
||||
{{ entry.transactionMode }}
|
||||
@if (entry.advanceDays) {
|
||||
· {{ entry.advanceDays }}d advance
|
||||
}
|
||||
@if (entry.arrearsDays) {
|
||||
· {{ entry.arrearsDays }}d previous
|
||||
}
|
||||
</td>
|
||||
<td class="num mono">{{ entry.amount | number: '1.2-2' }}</td>
|
||||
</tr>
|
||||
} @empty {
|
||||
<tr>
|
||||
<td colspan="4" class="entry-name">No line matches.</td>
|
||||
</tr>
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</li>
|
||||
}
|
||||
}
|
||||
</ul>
|
||||
} @else {
|
||||
<p class="slot-empty">
|
||||
{{ data.agentName }} has nothing outstanding for {{ data.entryDate | date: 'dd/MM/yyyy' }}. Change the date
|
||||
on the screen to the day the entries were written.
|
||||
</p>
|
||||
}
|
||||
</section>
|
||||
|
||||
<!-- ── 2: the cashier's receipts ─────────────────────────────────────────── -->
|
||||
<section class="slot">
|
||||
<header class="slot-head">
|
||||
<span class="slot-step">2</span>
|
||||
<div class="slot-title">
|
||||
<h3>DDS Cash Receipts</h3>
|
||||
<p>Tick the vouchers. Posts Dr Agent GL / Cr DDS Customer Deposits.</p>
|
||||
</div>
|
||||
<button type="button" class="slot-search" (click)="openSearch()">
|
||||
<mat-icon>search</mat-icon>
|
||||
<span>Find by voucher</span>
|
||||
</button>
|
||||
</header>
|
||||
|
||||
@if (available.length) {
|
||||
<ul class="options">
|
||||
@for (option of available; track option.id) {
|
||||
<li class="option" [class.option-picked]="pickedReceipts.has(option.id)" (click)="toggleReceipt(option)">
|
||||
<mat-icon class="option-check">{{
|
||||
pickedReceipts.has(option.id) ? 'check_box' : 'check_box_outline_blank'
|
||||
}}</mat-icon>
|
||||
<div class="option-main">
|
||||
<span class="option-voucher mono">{{ option.voucherNo }}</span>
|
||||
<span class="option-meta">{{ option.txnDate }} · {{ glLabel(option) }}</span>
|
||||
@if (option.description) {
|
||||
<span class="option-desc">{{ option.description }}</span>
|
||||
}
|
||||
</div>
|
||||
<span class="option-amount mono">{{ option.amount | number: '1.2-2' }}</span>
|
||||
<button type="button" class="option-info" (click)="openDetail(option, $event)" aria-label="GL entries">
|
||||
<mat-icon>receipt_long</mat-icon>
|
||||
</button>
|
||||
</li>
|
||||
}
|
||||
</ul>
|
||||
} @else {
|
||||
<p class="slot-empty">
|
||||
No DDS receipt is waiting on this agent's GL account. Collect the cash at
|
||||
<em>Cashier › Transaction Entry</em> with entry type <strong>DDS</strong> and have the manager approve it,
|
||||
or find an earlier voucher by number.
|
||||
</p>
|
||||
}
|
||||
|
||||
@if (pickedReceipts.size > 0 && pickedDays.size > 0 && difference !== 0) {
|
||||
<p class="slot-note note-bad">
|
||||
The vouchers ({{ received | number: '1.2-2' }}) have to match the day's entries ({{
|
||||
required | number: '1.2-2'
|
||||
}}) exactly, so every customer is credited what the agent wrote down.
|
||||
</p>
|
||||
}
|
||||
</section>
|
||||
|
||||
@if (errorMsg && !searchOpen) {
|
||||
<div class="alert">
|
||||
<mat-icon>error_outline</mat-icon>
|
||||
<span>{{ errorMsg }}</span>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
</mat-dialog-content>
|
||||
|
||||
<mat-dialog-actions class="dialog-actions">
|
||||
<button type="button" mat-stroked-button [mat-dialog-close]="false" [disabled]="submitting">Cancel</button>
|
||||
<button type="button" mat-flat-button color="primary" [disabled]="!canApply" (click)="apply()">
|
||||
@if (submitting) {
|
||||
<mat-spinner diameter="16"></mat-spinner>
|
||||
<span>Applying…</span>
|
||||
} @else {
|
||||
<mat-icon>check</mat-icon>
|
||||
<span>Apply Receipt</span>
|
||||
}
|
||||
</button>
|
||||
</mat-dialog-actions>
|
||||
</div>
|
||||
|
||||
<!-- ── Find a voucher the list does not carry ───────────────────────────────── -->
|
||||
@if (searchOpen) {
|
||||
<div class="overlay" (click)="closeSearch()">
|
||||
<div class="popup" (click)="$event.stopPropagation()">
|
||||
<header class="popup-head">
|
||||
<h3>Find a DDS receipt</h3>
|
||||
<button type="button" mat-icon-button (click)="closeSearch()" aria-label="Close">
|
||||
<mat-icon>close</mat-icon>
|
||||
</button>
|
||||
</header>
|
||||
|
||||
<div class="popup-body">
|
||||
<label class="field">
|
||||
<span>GL Account</span>
|
||||
<div class="field-readonly mono">{{ data.glCode || '—' }} · {{ data.agentCode }}</div>
|
||||
</label>
|
||||
|
||||
<label class="field">
|
||||
<span>Voucher No.</span>
|
||||
<input
|
||||
type="text"
|
||||
[(ngModel)]="searchVoucherNo"
|
||||
placeholder="CR/24092026/0001"
|
||||
(keyup.enter)="runSearch()"
|
||||
autocomplete="off"
|
||||
/>
|
||||
</label>
|
||||
|
||||
@if (errorMsg) {
|
||||
<div class="alert">
|
||||
<mat-icon>error_outline</mat-icon>
|
||||
<span>{{ errorMsg }}</span>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
|
||||
<footer class="popup-foot">
|
||||
<button type="button" mat-stroked-button (click)="closeSearch()">Cancel</button>
|
||||
<button
|
||||
type="button"
|
||||
mat-flat-button
|
||||
color="primary"
|
||||
[disabled]="!searchVoucherNo.trim() || searching"
|
||||
(click)="runSearch()"
|
||||
>
|
||||
@if (searching) {
|
||||
<mat-spinner diameter="16"></mat-spinner>
|
||||
} @else {
|
||||
<span>Find & Use</span>
|
||||
}
|
||||
</button>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
<!-- ── A receipt's own GL entries ───────────────────────────────────────────── -->
|
||||
@if (viewing) {
|
||||
<div class="overlay" (click)="closeDetail()">
|
||||
<div class="popup" (click)="$event.stopPropagation()">
|
||||
<header class="popup-head">
|
||||
<h3>
|
||||
Voucher <span class="mono">{{ viewing.voucherNo }}</span>
|
||||
</h3>
|
||||
<button type="button" mat-icon-button (click)="closeDetail()" aria-label="Close">
|
||||
<mat-icon>close</mat-icon>
|
||||
</button>
|
||||
</header>
|
||||
|
||||
<div class="popup-body">
|
||||
<dl class="detail-list">
|
||||
<div>
|
||||
<dt>Date</dt>
|
||||
<dd class="mono">{{ viewing.txnDate }}</dd>
|
||||
</div>
|
||||
<div>
|
||||
<dt>Amount</dt>
|
||||
<dd class="mono">{{ viewing.amount | number: '1.2-2' }}</dd>
|
||||
</div>
|
||||
<div>
|
||||
<dt>GL Account</dt>
|
||||
<dd>{{ glLabel(viewing) }}</dd>
|
||||
</div>
|
||||
@if (viewing.cashierName) {
|
||||
<div>
|
||||
<dt>Collected By</dt>
|
||||
<dd>{{ viewing.cashierName }}</dd>
|
||||
</div>
|
||||
}
|
||||
@if (viewing.managerName) {
|
||||
<div>
|
||||
<dt>Approved By</dt>
|
||||
<dd>{{ viewing.managerName }}</dd>
|
||||
</div>
|
||||
}
|
||||
@if (viewing.description) {
|
||||
<div>
|
||||
<dt>Description</dt>
|
||||
<dd>{{ viewing.description }}</dd>
|
||||
</div>
|
||||
}
|
||||
</dl>
|
||||
|
||||
<h4 class="detail-heading">Journal Entries</h4>
|
||||
@if (loadingGlEntries) {
|
||||
<div class="state-block"><mat-spinner diameter="22"></mat-spinner></div>
|
||||
} @else if (viewingGlEntries?.length) {
|
||||
<table class="gl-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Account</th>
|
||||
<th class="num">Debit</th>
|
||||
<th class="num">Credit</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@for (entry of viewingGlEntries; track entry.id) {
|
||||
<tr>
|
||||
<td>
|
||||
<span class="mono">{{ entry.glCode }}</span> {{ entry.glName }}
|
||||
</td>
|
||||
<td class="num mono">{{ entry.drCr === 'DR' ? (entry.amount | number: '1.2-2') : '' }}</td>
|
||||
<td class="num mono">{{ entry.drCr === 'CR' ? (entry.amount | number: '1.2-2') : '' }}</td>
|
||||
</tr>
|
||||
}
|
||||
</tbody>
|
||||
</table>
|
||||
} @else {
|
||||
<p class="slot-empty">No journal entries are recorded against this receipt.</p>
|
||||
}
|
||||
</div>
|
||||
|
||||
<footer class="popup-foot">
|
||||
<button type="button" mat-stroked-button (click)="closeDetail()">Close</button>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user