CBSNexora/cbsnexora
4
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Chargeback Loan Transaction

Browse Source
This commit is contained in:
Jose Alberto Hernandez
2022-10-01 20:16:14 -05:00
parent 1784a8def0
commit 7a3502abab
21 changed files with 382 additions and 159 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/core/shell/breadcrumb/breadcrumb.component.html
+1 -1
View File
@@ -1,6 +1,6 @@
<nav class="breadcrumb-wrapper">
<ul class="breadcrumb">
<span #breadcrumb class="breadcrumb-title">{{ 'labels.breadcrumbs.' + breadcrumbs[breadcrumbs.length-1].label | translate }}</span>
<span #breadcrumb class="breadcrumb-title">{{ breadcrumbs[breadcrumbs.length-1].label | translate }}</span>
<span *ngIf="breadcrumbs.length-1 !== 0" class="separator">
<li *ngFor="let breadcrumb of breadcrumbs; let last = last" class="breadcrumb-label">
<span *ngIf="!last" class="breadcrumb-link">
src/app/loans/loans-view/repayment-schedule-tab/repayment-schedule-tab.component.html
+46 -46
View File
@@ -3,96 +3,96 @@
<table mat-table [dataSource]="repaymentScheduleDetails.periods">
<ng-container matColumnDef="number">
<th mat-header-cell *matHeaderCellDef> # </th>
<td mat-cell *matCellDef="let ele"> {{ ele.period }} </td>
<th mat-header-cell class="center" *matHeaderCellDef> # </th>
<td mat-cell class="right" *matCellDef="let ele"> {{ ele.period }} </td>
<td mat-footer-cell *matFooterCellDef> &nbsp; </td>
</ng-container>
<ng-container matColumnDef="days">
<th mat-header-cell *matHeaderCellDef> Days </th>
<td mat-cell *matCellDef="let ele"> {{ ele.daysInPeriod }} </td>
<td mat-footer-cell *matFooterCellDef> <b> Total</b> </td>
<th mat-header-cell class="center" *matHeaderCellDef> Days </th>
<td mat-cell class="center" *matCellDef="let ele"> {{ ele.daysInPeriod }} </td>
<td mat-footer-cell class="center" *matFooterCellDef> <b> Total</b> </td>
</ng-container>
<ng-container matColumnDef="date">
<th mat-header-cell *matHeaderCellDef> Date </th>
<td mat-cell *matCellDef="let ele"> {{ ele.dueDate | dateFormat}} </td>
<th mat-header-cell class="center" *matHeaderCellDef> Date </th>
<td mat-cell class="center" *matCellDef="let ele"> {{ ele.dueDate | dateFormat}} </td>
<td mat-footer-cell *matFooterCellDef> </td>
</ng-container>
<ng-container matColumnDef="paiddate">
<th mat-header-cell *matHeaderCellDef> Paid Date </th>
<td mat-cell *matCellDef="let ele"> {{ ele.obligationsMetOnDate | dateFormat}} </td>
<th mat-header-cell class="center" *matHeaderCellDef> Paid Date </th>
<td mat-cell class="center" *matCellDef="let ele"> {{ ele.obligationsMetOnDate | dateFormat}} </td>
<td mat-footer-cell *matFooterCellDef> </td>
</ng-container>
<ng-container matColumnDef="check">
<th mat-header-cell *matHeaderCellDef> &nbsp; </th>
<td mat-cell *matCellDef="let ele">
<td mat-cell class="center" *matCellDef="let ele">
<span *ngIf="ele.obligationsMetOnDate"> <i class='fa fa-check'></i> </span>
</td>
<td mat-footer-cell *matFooterCellDef> </td>
</ng-container>
<ng-container matColumnDef="principalDue">
<th mat-header-cell *matHeaderCellDef> Principal Due </th>
<td mat-cell class="check" *matCellDef="let ele"> {{ ele.principalDue | number }} </td>
<td mat-footer-cell class="check" *matFooterCellDef> <b> {{ repaymentScheduleDetails.totalPrincipalExpected | number }}</b> </td>
<th mat-header-cell class="r-amount" *matHeaderCellDef> Principal Due </th>
<td mat-cell class="check r-amount" *matCellDef="let ele"> {{ ele.principalDue | number }} </td>
<td mat-footer-cell class="check r-amount" *matFooterCellDef> <b> {{ repaymentScheduleDetails.totalPrincipalExpected | currency }}</b> </td>
</ng-container>
<ng-container matColumnDef="balanceOfLoan">
<th mat-header-cell *matHeaderCellDef> Balance Of Loan </th>
<td mat-cell *matCellDef="let ele"> {{ ele.principalLoanBalanceOutstanding | number }} </td>
<td mat-footer-cell *matFooterCellDef> &nbsp; </td>
<th mat-header-cell class="r-amount" *matHeaderCellDef> Balance Of Loan </th>
<td mat-cell class="r-amount" *matCellDef="let ele"> {{ ele.principalLoanBalanceOutstanding | number }} </td>
<td mat-footer-cell class="r-amount" *matFooterCellDef> &nbsp; </td>
</ng-container>
<ng-container matColumnDef="interest">
<th mat-header-cell *matHeaderCellDef> Interest </th>
<td mat-cell *matCellDef="let ele"> {{ ele.interestOriginalDue | number}} </td>
<td mat-footer-cell *matFooterCellDef> <b> {{ repaymentScheduleDetails.totalInterestCharged | number }} </b> </td>
<th mat-header-cell class="r-amount" *matHeaderCellDef> Interest </th>
<td mat-cell class="r-amount" *matCellDef="let ele"> {{ ele.interestOriginalDue | number}} </td>
<td mat-footer-cell class="r-amount" *matFooterCellDef> <b> {{ repaymentScheduleDetails.totalInterestCharged | currency }} </b> </td>
</ng-container>
<ng-container matColumnDef="fees">
<th mat-header-cell *matHeaderCellDef> Fees </th>
<td mat-cell *matCellDef="let ele"> {{ ele.feeChargesDue | number}} </td>
<td mat-footer-cell *matFooterCellDef> <b> {{ repaymentScheduleDetails.totalFeeChargesCharged | number }} </b> </td>
<th mat-header-cell class="r-amount" *matHeaderCellDef> Fees </th>
<td mat-cell class="r-amount" *matCellDef="let ele"> {{ ele.feeChargesDue | number}} </td>
<td mat-footer-cell class="r-amount" *matFooterCellDef> <b> {{ repaymentScheduleDetails.totalFeeChargesCharged | currency }} </b> </td>
</ng-container>
<ng-container matColumnDef="penalties">
<th mat-header-cell *matHeaderCellDef> Penalties </th>
<td mat-cell *matCellDef="let ele"> {{ ele.penaltyChargesDue | number}} </td>
<td mat-footer-cell *matFooterCellDef> <b> {{ repaymentScheduleDetails.totalPenaltyChargesCharged | number }} </b> </td>
<th mat-header-cell class="r-amount" *matHeaderCellDef> Penalties </th>
<td mat-cell class="r-amount" *matCellDef="let ele"> {{ ele.penaltyChargesDue | number}} </td>
<td mat-footer-cell class="r-amount" *matFooterCellDef> <b> {{ repaymentScheduleDetails.totalPenaltyChargesCharged | currency }} </b> </td>
</ng-container>
<ng-container matColumnDef="due">
<th mat-header-cell *matHeaderCellDef> Due </th>
<td mat-cell *matCellDef="let ele"> {{ ele.totalDueForPeriod | number}} </td>
<td mat-footer-cell *matFooterCellDef> <b> {{ repaymentScheduleDetails.totalRepaymentExpected | number }} </b> </td>
<th mat-header-cell class="r-amount" *matHeaderCellDef> Due </th>
<td mat-cell class="r-amount" *matCellDef="let ele"> {{ ele.totalDueForPeriod | number}} </td>
<td mat-footer-cell class="r-amount" *matFooterCellDef> <b> {{ repaymentScheduleDetails.totalRepaymentExpected | currency }} </b> </td>
</ng-container>
<ng-container matColumnDef="paid">
<th mat-header-cell *matHeaderCellDef> Paid </th>
<td mat-cell *matCellDef="let ele"> {{ ele.totalPaidForPeriod | number}} </td>
<td mat-footer-cell *matFooterCellDef> <b> {{ repaymentScheduleDetails.totalRepayment | number }} </b> </td>
<th mat-header-cell class="r-amount" *matHeaderCellDef> Paid </th>
<td mat-cell class="r-amount" *matCellDef="let ele"> {{ ele.totalPaidForPeriod | number}} </td>
<td mat-footer-cell class="r-amount" *matFooterCellDef> <b> {{ repaymentScheduleDetails.totalRepayment | currency }} </b> </td>
</ng-container>
<ng-container matColumnDef="inadvance">
<th mat-header-cell *matHeaderCellDef> In advance </th>
<td mat-cell *matCellDef="let ele"> {{ ele.totalPaidInAdvanceForPeriod | number}} </td>
<td mat-footer-cell *matFooterCellDef> <b> {{ repaymentScheduleDetails.totalPaidInAdvance | number }} </b> </td>
<th mat-header-cell class="r-amount" *matHeaderCellDef> In advance </th>
<td mat-cell class="r-amount" *matCellDef="let ele"> {{ ele.totalPaidInAdvanceForPeriod | number}} </td>
<td mat-footer-cell class="r-amount" *matFooterCellDef> <b> {{ repaymentScheduleDetails.totalPaidInAdvance | currency }} </b> </td>
</ng-container>
<ng-container matColumnDef="late">
<th mat-header-cell *matHeaderCellDef> Late </th>
<td mat-cell *matCellDef="let ele"> {{ ele.totalPaidLateForPeriod | number}} </td>
<td mat-footer-cell *matFooterCellDef> <b> {{ repaymentScheduleDetails.totalPaidLate | number }} </b> </td>
<th mat-header-cell class="r-amount" *matHeaderCellDef> Late </th>
<td mat-cell class="r-amount" *matCellDef="let ele"> {{ ele.totalPaidLateForPeriod | number}} </td>
<td mat-footer-cell class="r-amount" *matFooterCellDef> <b> {{ repaymentScheduleDetails.totalPaidLate | currency }} </b> </td>
</ng-container>
<ng-container *ngIf="isWaived">
<ng-container matColumnDef="waived">
<th mat-header-cell *matHeaderCellDef> Waived </th>
<td mat-cell *matCellDef="let ele"> {{ ele.totalWaivedForPeriod | number}} </td>
<td mat-footer-cell *matFooterCellDef> <b> {{ repaymentScheduleDetails.totalWaived | number }} </b> </td>
<th mat-header-cell class="r-amount" *matHeaderCellDef> Waived </th>
<td mat-cell class="r-amount" *matCellDef="let ele"> {{ ele.totalWaivedForPeriod | number}} </td>
<td mat-footer-cell class="r-amount" *matFooterCellDef> <b> {{ repaymentScheduleDetails.totalWaived | currency }} </b> </td>
</ng-container>
</ng-container>
@@ -105,9 +105,9 @@
</ng-container>
<ng-container matColumnDef="outstanding">
<th mat-header-cell *matHeaderCellDef> Outstanding </th>
<td mat-cell *matCellDef="let ele"> {{ ele.totalOutstandingForPeriod | number}} </td>
<td mat-footer-cell *matFooterCellDef> <b> {{ repaymentScheduleDetails.totalOutstanding | number }} </b> </td>
<th mat-header-cell class="r-amount" *matHeaderCellDef> Outstanding </th>
<td mat-cell class="r-amount" *matCellDef="let ele"> {{ ele.totalOutstandingForPeriod | number}} </td>
<td mat-footer-cell class="r-amount" *matFooterCellDef> <b> {{ repaymentScheduleDetails.totalOutstanding | currency }} </b> </td>
</ng-container>
<ng-container matColumnDef="header">
@@ -115,15 +115,15 @@
</ng-container>
<ng-container matColumnDef="header-amount">
<th mat-header-cell *matHeaderCellDef [attr.colspan]="2"> Loan Amount and Balance </th>
<th mat-header-cell class="center" *matHeaderCellDef [attr.colspan]="2"> Loan Amount and Balance </th>
</ng-container>
<ng-container matColumnDef="header-total-cost">
<th mat-header-cell *matHeaderCellDef [attr.colspan]="3"> Total Cost of Loan </th>
<th mat-header-cell class="center" *matHeaderCellDef [attr.colspan]="3"> Total Cost of Loan </th>
</ng-container>
<ng-container matColumnDef="header-installment-totals">
<th mat-header-cell *matHeaderCellDef [attr.colspan]="6"> Installment Totals </th>
<th mat-header-cell class="center" *matHeaderCellDef [attr.colspan]="6"> Installment Totals </th>
</ng-container>
<tr mat-header-row *matHeaderRowDef="['header', 'header-amount', 'header-total-cost', 'header-installment-totals']"></tr>
src/app/loans/loans-view/transactions-tab/transactions-tab.component.html
+12 -12
View File
@@ -13,58 +13,58 @@
<table mat-table [dataSource]="showTransactionsData">
<ng-container matColumnDef="id">
<th mat-header-cell *matHeaderCellDef> Date </th>
<td mat-cell *matCellDef="let transaction" [ngClass]="{'strike': transaction.manuallyReversed}"> {{ transaction.id }} </td>
<th mat-header-cell *matHeaderCellDef> Id </th>
<td mat-cell *matCellDef="let transaction" [ngClass]="loanTransactionColor(transaction)"> {{ transaction.id }} </td>
</ng-container>
<ng-container matColumnDef="office">
<th mat-header-cell *matHeaderCellDef> Office </th>
<td mat-cell *matCellDef="let transaction" [ngClass]="{'strike': transaction.manuallyReversed}"> {{ transaction.officeName }} </td>
<td mat-cell *matCellDef="let transaction" [ngClass]="loanTransactionColor(transaction)"> {{ transaction.officeName }} </td>
</ng-container>
<ng-container matColumnDef="transactionDate">
<th mat-header-cell *matHeaderCellDef> Transaction Date </th>
<td mat-cell *matCellDef="let transaction" [ngClass]="{'strike': transaction.manuallyReversed}"> {{ transaction.date | dateFormat }} </td>
<td mat-cell *matCellDef="let transaction" [ngClass]="loanTransactionColor(transaction)"> {{ transaction.date | dateFormat }} </td>
</ng-container>
<ng-container matColumnDef="transactionType">
<th mat-header-cell *matHeaderCellDef> Transaction Type </th>
<td mat-cell *matCellDef="let transaction" [ngClass]="{'strike': transaction.manuallyReversed}"> {{ transaction.type.value }} </td>
<td mat-cell *matCellDef="let transaction" [ngClass]="loanTransactionColor(transaction)"> {{ transaction.type.value }} </td>
</ng-container>
<ng-container matColumnDef="amount">
<th mat-header-cell *matHeaderCellDef> Amount </th>
<td mat-cell *matCellDef="let transaction" [ngClass]="{'strike': transaction.manuallyReversed}"> {{ transaction.amount | number }} </td>
<td mat-cell *matCellDef="let transaction" [ngClass]="loanTransactionColor(transaction)"> {{ transaction.amount | number }} </td>
</ng-container>
<ng-container matColumnDef="principal">
<th mat-header-cell *matHeaderCellDef> Breakdown </th>
<td mat-cell *matCellDef="let transaction" [ngClass]="{'strike': transaction.manuallyReversed}"> {{ transaction.principalPortion | number }} </td>
<td mat-cell *matCellDef="let transaction" [ngClass]="loanTransactionColor(transaction)"> {{ transaction.principalPortion | number }} </td>
</ng-container>
<ng-container matColumnDef="interest">
<th mat-header-cell *matHeaderCellDef> </th>
<td mat-cell *matCellDef="let transaction" [ngClass]="{'strike': transaction.manuallyReversed}"> {{ transaction.interestPortion | number }} </td>
<td mat-cell *matCellDef="let transaction" [ngClass]="loanTransactionColor(transaction)"> {{ transaction.interestPortion | number }} </td>
</ng-container>
<ng-container matColumnDef="fee">
<th mat-header-cell *matHeaderCellDef> </th>
<td mat-cell *matCellDef="let transaction" [ngClass]="{'strike': transaction.manuallyReversed}"> {{ transaction.feeChargesPortion | number }} </td>
<td mat-cell *matCellDef="let transaction" [ngClass]="loanTransactionColor(transaction)"> {{ transaction.feeChargesPortion | number }} </td>
</ng-container>
<ng-container matColumnDef="penalties">
<th mat-header-cell *matHeaderCellDef> </th>
<td mat-cell *matCellDef="let transaction" [ngClass]="{'strike': transaction.manuallyReversed}"> {{ transaction.penaltyChargesPortion | number }} </td>
<td mat-cell *matCellDef="let transaction" [ngClass]="loanTransactionColor(transaction)"> {{ transaction.penaltyChargesPortion | number }} </td>
</ng-container>
<ng-container matColumnDef="loanBalance">
<th mat-header-cell *matHeaderCellDef> Loan Balance </th>
<td mat-cell *matCellDef="let transaction" [ngClass]="{'strike': transaction.manuallyReversed}"> {{ transaction.outstandingLoanBalance | number }} </td>
<td mat-cell *matCellDef="let transaction" [ngClass]="loanTransactionColor(transaction)"> {{ transaction.outstandingLoanBalance | number }} </td>
</ng-container>
<ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef> Actions </th>
<td mat-cell *matCellDef="let transaction" [ngClass]="{'strike': transaction.manuallyReversed}">
<td mat-cell *matCellDef="let transaction" [ngClass]="loanTransactionColor(transaction)">
<button class="account-action-button" *ngIf="!transaction.manuallyReversed" mat-raised-button color="primary" (click)="routeEdit($event)"
[routerLink]="[transaction.id, 'reciept']" matTooltip="View Receipts">
<i class="fa fa-file-text"></i>
src/app/loans/loans-view/transactions-tab/transactions-tab.component.scss
+7
View File
@@ -1,3 +1,5 @@
@import "assets/styles/helper";
.container {
padding-bottom: 2%;
@@ -24,5 +26,10 @@
text-decoration: line-through;
color: red;
}
.linked {
text-decoration: line-through;
color: $status-approved;
}
}
}
src/app/loans/loans-view/transactions-tab/transactions-tab.component.ts
+10
View File
@@ -80,6 +80,16 @@ export class TransactionsTabComponent implements OnInit {
}
}
loanTransactionColor(loanTransaction: any): string {
if (loanTransaction.manuallyReversed) {
return 'strike';
}
if (loanTransaction.transactionRelations && loanTransaction.transactionRelations.length > 0) {
return 'linked';
}
return '';
}
/**
* Stops the propagation to view pages.
* @param $event Mouse Event
src/app/loans/loans-view/transactions/view-transaction/view-transaction.component.html
+73 -17
View File
@@ -1,12 +1,17 @@
<div fxLayoutAlign="end" class="container m-b-20 transaction-buttons" fxLayoutGap="2%"
*ngIf="!(transactionData.type.contra)">
<span *mifosxHasPermission="'ADJUST_LOAN'">
<button mat-raised-button color="primary" [routerLink]="'edit'" *ngIf="allowEdition">
<fa-icon icon="edit"></fa-icon>&nbsp;&nbsp;Edit
<button mat-raised-button color="primary" [routerLink]="'edit'" [disabled]="!allowEdition">
<fa-icon icon="edit"></fa-icon>&nbsp;&nbsp;{{ 'Edit' | translate }}
</button>
<button mat-raised-button color="warn" (click)="undoTransaction()" *ngIf="allowUndo">
<fa-icon icon="undo"></fa-icon>&nbsp;&nbsp;Undo
<button mat-raised-button color="warn" (click)="undoTransaction()" [disabled]="!allowUndo">
<fa-icon icon="undo"></fa-icon>&nbsp;&nbsp;{{ 'Undo' | translate }}
</button>
</span>
<span *mifosxHasPermission="'CHARGEBACK_LOAN'">
<button mat-raised-button color="warn" [disabled]="!allowChargeback" (click)="chargebackTransaction()">
<fa-icon icon="undo"></fa-icon>&nbsp;&nbsp;{{ 'Chargeback' | translate }}
</button>
</span>
</div>
@@ -18,17 +23,29 @@
<mat-card-content>
<div fxLayout="row wrap" class="content">
<div fxFlex="100%" [ngClass]="loanTransactionColor()">
</div>
<div fxFlex="50%" class="mat-body-strong">
Transaction Id
{{ 'Transaction Id' | translate }}
</div>
<div fxFlex="50%">
{{ transactionData.id }}
</div>
<div fxFlex="50%" class="mat-body-strong" *ngIf="transactionData.toLoanTransactionRelation">
{{ 'Repayment Transaction' | translate }}
</div>
<div fxFlex="50%" *ngIf="transactionData.toLoanTransactionRelation">
<a [href]="loanTransactionRelatedLink(transactionData.toLoanTransactionRelation.fromLoanTransaction)">
{{ transactionData.toLoanTransactionRelation.fromLoanTransaction }}
</a>
</div>
<div fxFlex="50%" class="mat-body-strong">
Type
{{ 'Type' | translate }}
</div>
<div fxFlex="50%">
@@ -36,15 +53,15 @@
</div>
<div fxFlex="50%" class="mat-body-strong">
Transaction Date
{{ 'Transaction Date' | translate }}
</div>
<div fxFlex="50%">
{{ transactionData.date | dateFormat }}
{{ transactionData.date | dateFormat }}
</div>
<div fxFlex="50%" class="mat-body-strong">
Currency
{{ 'Currency' | translate }}
</div>
<div fxFlex="50%">
@@ -52,17 +69,53 @@
</div>
<div fxFlex="50%" class="mat-body-strong">
Amount
{{ 'Amount' | translate }}
</div>
<div fxFlex="50%">
{{ transactionData.amount }}
{{ transactionData.amount | currency:transactionData.currency.code }} {{ transactionData.currency.code }}
</div>
<mat-divider *ngIf="existTransactionRelations" [inset]="true"></mat-divider>
<div fxFlex="100%" class="mat-body-strong" *ngIf="existTransactionRelations">
{{ 'Linked Transactions' | translate }}
<br>
<table mat-table [dataSource]="transactionRelations">
<ng-container matColumnDef="relationType">
<th mat-header-cell *matHeaderCellDef> Relation Type </th>
<td mat-cell *matCellDef="let transactionRel" [matTooltip]="transactionRel.paymentType">
{{ transactionRel.relationType | translate }}
</td>
</ng-container>
<ng-container matColumnDef="toTransaction">
<th mat-header-cell *matHeaderCellDef> Transaction </th>
<td mat-cell *matCellDef="let transactionRel">
<a [href]="loanTransactionRelatedLink(transactionRel.toLoanTransaction)">
{{ transactionRel.toLoanTransaction }}
</a>
</td>
</ng-container>
<ng-container matColumnDef="amount">
<th mat-header-cell *matHeaderCellDef> Amount </th>
<td mat-cell *matCellDef="let transactionRel">
{{ transactionRel.amount | currency:transactionData.currency.code }} {{ transactionData.currency.code }}
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
</div>
<mat-divider *ngIf="transactionData.paymentDetailData" [inset]="true"></mat-divider>
<ng-container *ngIf="transactionData.paymentDetailData">
<div *ngIf="transactionData.paymentDetailData.paymentType" fxFlex="50%" class="mat-body-strong">
Payment Type
{{ 'Payment Type' | translate }}
</div>
<div *ngIf="transactionData.paymentDetailData.paymentType" fxFlex="50%">
@@ -70,7 +123,7 @@
</div>
<div *ngIf="transactionData.paymentDetailData.accountNumber" fxFlex="50%" class="mat-body-strong">
Account No.
{{ 'Account No.' | translate }}
</div>
<div *ngIf="transactionData.paymentDetailData.accountNumber" fxFlex="50%">
@@ -78,7 +131,7 @@
</div>
<div *ngIf="transactionData.paymentDetailData.checkNumber" fxFlex="50%" class="mat-body-strong">
Cheque Number
{{ 'Cheque Number' | translate }}
</div>
<div *ngIf="transactionData.paymentDetailData.checkNumber" fxFlex="50%">
@@ -86,7 +139,7 @@
</div>
<div *ngIf="transactionData.paymentDetailData.routingCode" fxFlex="50%" class="mat-body-strong">
Routing Code
{{ 'Routing Code' | translate }}
</div>
<div *ngIf="transactionData.paymentDetailData.routingCode" fxFlex="50%">
@@ -94,7 +147,7 @@
</div>
<div *ngIf="transactionData.paymentDetailData.receiptNumber" fxFlex="50%" class="mat-body-strong">
Receipt No.
{{ 'Receipt No.' | translate }}
</div>
<div *ngIf="transactionData.paymentDetailData.receiptNumber" fxFlex="50%">
@@ -102,7 +155,7 @@
</div>
<div *ngIf="transactionData.paymentDetailData.bankNumber" fxFlex="50%" class="mat-body-strong">
Bank No.
{{ 'Bank No.' | translate }}
</div>
<div *ngIf="transactionData.paymentDetailData.bankNumber" fxFlex="50%">
@@ -113,6 +166,9 @@
</div>
<div fxLayout="row" fxLayoutAlign="center" fxLayoutGap="2%" fxLayout.lt-md="column">
<button type="button" mat-raised-button color="primary" [routerLink]="['../']">{{ 'Back' | translate }}</button>
</div>
</mat-card-content>
</mat-card>
src/app/loans/loans-view/transactions/view-transaction/view-transaction.component.scss
+21
View File
@@ -1,3 +1,5 @@
@import "assets/styles/helper";
.container {
max-width: 37rem;
.content {
@@ -11,3 +13,22 @@
.transaction-buttons {
margin-top: 3%;
}
.loan-relation {
background-color: $mid-grey;
}
.active {
background-color: $status-active;
height: 4px;
}
.linked {
background-color: $status-approved;
height: 4px;
}
.undo {
background-color: $status-active-overdue;
height: 4px;
}
src/app/loans/loans-view/transactions/view-transaction/view-transaction.component.ts
+112 -5
View File
@@ -1,5 +1,5 @@
/** Angular Imports */
import { Component } from '@angular/core';
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
import { MatDialog } from '@angular/material/dialog';
@@ -8,6 +8,12 @@ import { LoansService } from 'app/loans/loans.service';
import { ConfirmationDialogComponent } from 'app/shared/confirmation-dialog/confirmation-dialog.component';
import { SettingsService } from 'app/settings/settings.service';
import { Dates } from 'app/core/utils/dates';
import { OrganizationService } from 'app/organization/organization.service';
import { FormfieldBase } from 'app/shared/form-dialog/formfield/model/formfield-base';
import { InputBase } from 'app/shared/form-dialog/formfield/model/input-base';
import { SelectBase } from 'app/shared/form-dialog/formfield/model/select-base';
import { FormDialogComponent } from 'app/shared/form-dialog/form-dialog.component';
import { MatTableDataSource } from '@angular/material/table';
/** Custom Dialogs */
@@ -20,14 +26,27 @@ import { Dates } from 'app/core/utils/dates';
templateUrl: './view-transaction.component.html',
styleUrls: ['./view-transaction.component.scss']
})
export class ViewTransactionComponent {
export class ViewTransactionComponent implements OnInit {
/** Transaction data. */
transactionData: any;
/** Is Editable */
allowEdition = true;
/** Is Undoable */
allowUndo = true;
/** Is Undoable */
allowUndo = true;
/** Is able to be Chargeback */
allowChargeback = true;
existTransactionRelations = false;
paymentTypeOptions: {}[] = [];
transactionRelations = new MatTableDataSource();
/** Columns to be displayed in Transaction Relations table. */
displayedColumns: string[] = ['relationType', 'toTransaction', 'amount'];
isFullRelated = false;
amountRelationsAllowed = 0;
clientId: number;
loanId: number;
/**
* Retrieves the Transaction data from `resolve`.
@@ -43,13 +62,43 @@ export class ViewTransactionComponent {
private dateUtils: Dates,
private router: Router,
public dialog: MatDialog,
private settingsService: SettingsService) {
private settingsService: SettingsService,
private organizationService: OrganizationService) {
this.route.data.subscribe((data: { loansAccountTransaction: any }) => {
this.transactionData = data.loansAccountTransaction;
this.allowEdition = !this.transactionData.manuallyReversed && !(this.transactionData.type.id === 20 || this.transactionData.type.id === 21 || this.transactionData.type.id === 22
|| this.transactionData.type.id === 23);
this.allowUndo = !this.transactionData.manuallyReversed;
this.allowChargeback = this.transactionData.type.repayment;
if (this.transactionData.type.repayment) {
if (this.transactionData.transactionRelations) {
this.transactionRelations.data = this.transactionData.transactionRelations;
this.existTransactionRelations = (this.transactionData.transactionRelations.length > 0);
let amountRelations = 0;
this.transactionData.transactionRelations.forEach((relation: any) => {
amountRelations += relation.amount;
});
this.amountRelationsAllowed = this.transactionData.amount - amountRelations;
this.isFullRelated = (this.amountRelationsAllowed === 0);
this.allowChargeback = this.transactionData.type.repayment && !this.isFullRelated;
}
}
if (!this.allowChargeback || this.existTransactionRelations) {
this.allowUndo = false;
this.allowEdition = false;
}
});
this.clientId = this.route.snapshot.params['clientId'];
this.loanId = this.route.snapshot.params['loanId'];
}
ngOnInit(): void {
if (this.allowChargeback) {
this.organizationService.getPaymentTypesWithCode().toPromise()
.then(data => {
this.paymentTypeOptions = data;
});
}
}
/**
@@ -77,4 +126,62 @@ export class ViewTransactionComponent {
});
}
chargebackTransaction() {
const accountId = this.route.parent.parent.parent.snapshot.params['loanId'];
const formfields: FormfieldBase[] = [
new SelectBase({
controlName: 'paymentTypeId',
label: 'Payment Type',
value: '',
options: { label: 'name', value: 'id', data: this.paymentTypeOptions },
required: true,
order: 1
}),
new InputBase({
controlName: 'amount',
label: 'Amount',
value: this.amountRelationsAllowed,
type: 'number',
required: true,
max: this.amountRelationsAllowed,
order: 2
})
];
const data = {
title: 'Chargeback Repayment Transaction',
layout: { addButtonText: 'Chargeback' },
formfields: formfields
};
const chargebackDialogRef = this.dialog.open(FormDialogComponent, { data });
chargebackDialogRef.afterClosed().subscribe((response: { data: any }) => {
if (response.data) {
if (response.data.value.amount <= this.amountRelationsAllowed) {
const locale = this.settingsService.language.code;
const payload = {
transactionAmount: response.data.value.amount,
paymentTypeId: response.data.value.paymentTypeId,
locale
};
this.loansService.executeLoansAccountTransactionsCommand(accountId, 'chargeback', payload, this.transactionData.id).subscribe(() => {
this.router.navigate(['../'], { relativeTo: this.route });
});
}
}
});
}
loanTransactionRelatedLink(transactionId: number) {
return `/#/clients/${this.clientId}/loans-accounts/${this.loanId}/transactions/${transactionId}`;
}
loanTransactionColor(): string {
if (this.transactionData.manuallyReversed) {
return 'undo';
}
if (this.existTransactionRelations) {
return 'linked';
}
return 'active';
}
}
src/app/organization/offices/offices.component.html
+42 -26
View File
@@ -7,18 +7,19 @@
</button>
</div>
<div #buttonCreateOffice class="in-block">
<button mat-raised-button color="primary" [routerLink]="['create']" *mifosxHasPermission="'CREATE_OFFICE'">
<fa-icon icon="plus"></fa-icon>&nbsp;&nbsp;
Create Office
</button>
<div #buttonCreateOffice class="in-block">
<button mat-raised-button color="primary" [routerLink]="['create']" *mifosxHasPermission="'CREATE_OFFICE'">
<fa-icon icon="plus"></fa-icon>&nbsp;&nbsp;
Create Office
</button>
</div>
<div #buttonImportOffices class="in-block">
<button mat-raised-button color="primary" *mifosxHasPermission="'CREATE_OFFICE'" [routerLink]="['/organization', 'bulk-import', 'Offices']">
<fa-icon icon="upload"></fa-icon>&nbsp;&nbsp;
Import Offices
</button>
<div #buttonImportOffices class="in-block">
<button mat-raised-button color="primary" *mifosxHasPermission="'CREATE_OFFICE'"
[routerLink]="['/organization', 'bulk-import', 'Offices']">
<fa-icon icon="upload"></fa-icon>&nbsp;&nbsp;
Import Offices
</button>
</div>
</div>
@@ -53,11 +54,12 @@
<ng-container matColumnDef="openingDate">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Opened On </th>
<td mat-cell *matCellDef="let offices"> {{ offices.openingDate | dateFormat }} </td>
<td mat-cell *matCellDef="let offices"> {{ offices.openingDate | dateFormat }} </td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;" class="select-row" [routerLink]="[row.id, 'general']"></tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;" class="select-row"
[routerLink]="[row.id, 'general']"></tr>
</table>
@@ -69,11 +71,14 @@
<ng-template #templateButtonTreeView let-popover="popover">
<h2>Tree View</h2>
<p class="mw300">This will launch an alternative view which allows you to view the office hierarchy for your organization.</p>
<p class="mw300">This will launch an alternative view which allows you to view the office hierarchy for your
organization.</p>
<div fxLayout="row" fxLayoutAlign="end" fxLayoutGap="2%" fxLayout.lt-md="column">
<button mat-raised-button color="warn" (click)="popover.close();configurationWizardService.closeConfigWizard()">Close</button>
<button mat-raised-button color="warn"
(click)="popover.close();configurationWizardService.closeConfigWizard()">Close</button>
<button mat-raised-button color="primary" (click)="popover.close();previousStep();">Back</button>
<button mat-raised-button color="primary" (click)="popover.close();showPopover(templateButtonCreateOffice,buttonCreateOffice,'bottom', true);">Next</button>
<button mat-raised-button color="primary"
(click)="popover.close();showPopover(templateButtonCreateOffice,buttonCreateOffice,'bottom', true);">Next</button>
</div>
</ng-template>
@@ -81,9 +86,12 @@
<h2>Create Office</h2>
<p class="mw300">This option allows you to create new offices in your organization.</p>
<div fxLayout="row" fxLayoutAlign="end" fxLayoutGap="2%" fxLayout.lt-md="column">
<button mat-raised-button color="warn" (click)="popover.close();configurationWizardService.closeConfigWizard()">Close</button>
<button mat-raised-button color="primary" (click)="popover.close();showPopover(templateButtonTreeView,buttonTreeView,'bottom', true);">Back</button>
<button mat-raised-button color="primary" (click)="popover.close();showPopover(templateButtonImportOffices,buttonImportOffices,'bottom', true);">Next</button>
<button mat-raised-button color="warn"
(click)="popover.close();configurationWizardService.closeConfigWizard()">Close</button>
<button mat-raised-button color="primary"
(click)="popover.close();showPopover(templateButtonTreeView,buttonTreeView,'bottom', true);">Back</button>
<button mat-raised-button color="primary"
(click)="popover.close();showPopover(templateButtonImportOffices,buttonImportOffices,'bottom', true);">Next</button>
</div>
</ng-template>
@@ -91,26 +99,34 @@
<h2>Import Offices</h2>
<p class="mw300">This will launch the Bulk import/Offices page.</p>
<div fxLayout="row" fxLayoutAlign="end" fxLayoutGap="2%" fxLayout.lt-md="column">
<button mat-raised-button color="warn" (click)="popover.close();configurationWizardService.closeConfigWizard()">Close</button>
<button mat-raised-button color="primary" (click)="popover.close();showPopover(templateButtonCreateOffice,buttonCreateOffice,'bottom', true);">Back</button>
<button mat-raised-button color="primary" (click)="popover.close();showPopover(templateFilter,filter,'bottom', true);">Next</button>
<button mat-raised-button color="warn"
(click)="popover.close();configurationWizardService.closeConfigWizard()">Close</button>
<button mat-raised-button color="primary"
(click)="popover.close();showPopover(templateButtonCreateOffice,buttonCreateOffice,'bottom', true);">Back</button>
<button mat-raised-button color="primary"
(click)="popover.close();showPopover(templateFilter,filter,'bottom', true);">Next</button>
</div>
</ng-template>
<ng-template #templateFilter let-popover="popover">
<h4>Search bar to filter offices.</h4>
<div fxLayout="row" fxLayoutAlign="end" fxLayoutGap="2%" fxLayout.lt-md="column">
<button mat-raised-button color="warn" (click)="popover.close();configurationWizardService.closeConfigWizard()">Close</button>
<button mat-raised-button color="primary" (click)="popover.close();showPopover(templateButtonImportOffices,buttonImportOffices,'bottom', true);">Back</button>
<button mat-raised-button color="primary" (click)="popover.close();showPopover(templateTableOffices,tableOffices,'top', true);">Next</button>
<button mat-raised-button color="warn"
(click)="popover.close();configurationWizardService.closeConfigWizard()">Close</button>
<button mat-raised-button color="primary"
(click)="popover.close();showPopover(templateButtonImportOffices,buttonImportOffices,'bottom', true);">Back</button>
<button mat-raised-button color="primary"
(click)="popover.close();showPopover(templateTableOffices,tableOffices,'top', true);">Next</button>
</div>
</ng-template>
<ng-template #templateTableOffices let-popover="popover">
<h4>List of offices in the organization.</h4>
<div fxLayout="row" fxLayoutAlign="end" fxLayoutGap="2%" fxLayout.lt-md="column">
<button mat-raised-button color="warn" (click)="popover.close();configurationWizardService.closeConfigWizard()">Close</button>
<button mat-raised-button color="primary" (click)="popover.close();showPopover(templateFilter,filter,'bottom', true);">Back</button>
<button mat-raised-button color="warn"
(click)="popover.close();configurationWizardService.closeConfigWizard()">Close</button>
<button mat-raised-button color="primary"
(click)="popover.close();showPopover(templateFilter,filter,'bottom', true);">Back</button>
<button mat-raised-button color="primary" (click)="popover.close();nextStep()">Next</button>
</div>
</ng-template>
src/app/organization/organization-routing.module.ts
+1 -3
View File
@@ -76,7 +76,6 @@ import { AdhocQueryResolver } from './adhoc-query/common-resolvers/adhoc-query.r
import { TellersResolver } from './tellers/common-resolvers/tellers.resolver';
import { TellerResolver } from './tellers/common-resolvers/teller.resolver';
import { PaymentTypesResolver } from './payment-types/payment-types.resolver';
import { PaymentTypeResolver } from './payment-types/payment-type.resolver';
import { PasswordPreferencesTemplateResolver } from './password-preferences/password-preferences-template.resolver';
import { EntityDataTableChecksResolver } from './entity-data-table-checks/entity-data-table-checks.resolver';
import { WorkingDaysResolver } from './working-days/working-days.resolver';
@@ -518,7 +517,7 @@ const routes: Routes = [
component: EditPaymentTypeComponent,
data: { title: extract('Edit Payment Type'), breadcrumb: 'Edit', routeParamBreadcrumb: false },
resolve: {
paymentType: PaymentTypeResolver
paymentType: PaymentTypesResolver
}
}
]
@@ -669,7 +668,6 @@ const routes: Routes = [
TellersResolver,
TellerResolver,
PaymentTypesResolver,
PaymentTypeResolver,
PasswordPreferencesTemplateResolver,
EntityDataTableChecksResolver,
WorkingDaysResolver,
src/app/organization/organization.service.ts
+7
View File
@@ -487,6 +487,13 @@ export class OrganizationService {
return this.http.get('/paymenttypes');
}
/**
* @returns {Observable<any>} Payment Types data
*/
getPaymentTypesWithCode(): Observable<any> {
return this.http.get('/paymenttypes?onlyWithCode=true');
}
/**
* @param {any} paymentType Payment type to be created.
* @returns {Observable<any>}
src/app/organization/payment-types/payment-type.resolver.ts
-31
View File
@@ -1,31 +0,0 @@
/** Angular Imports */
import { Injectable } from '@angular/core';
import { Resolve, ActivatedRouteSnapshot } from '@angular/router';
/** rxjs Imports */
import { Observable } from 'rxjs';
/** Custom Services */
import { OrganizationService } from 'app/organization/organization.service';
/**
* Payment Type data resolver.
*/
@Injectable()
export class PaymentTypeResolver implements Resolve<Object> {
/**
* @param {OrganizationService} organizationService Organization service.
*/
constructor(private organizationService: OrganizationService) {}
/**
* Returns the payment type data.
* @returns {Observable<any>}
*/
resolve(route: ActivatedRouteSnapshot): Observable<any> {
const paymentTypeId = route.paramMap.get('id');
return this.organizationService.getPaymentType(paymentTypeId);
}
}
src/app/organization/payment-types/payment-types.component.html
+19 -4
View File
@@ -30,10 +30,25 @@
<td mat-cell *matCellDef="let paymentType"> {{ paymentType.description }} </td>
</ng-container>
<ng-container matColumnDef="codeName">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Code </th>
<td mat-cell *matCellDef="let paymentType"> {{ paymentType.codeName }} </td>
</ng-container>
<ng-container matColumnDef="isSystemDefined">
<th mat-header-cell *matHeaderCellDef mat-sort-header> System Defined </th>
<td mat-cell *matCellDef="let paymentType">
<div [className]="paymentType.isSystemDefined === true ? 'true text-center' : 'false text-center'">
<fa-icon *ngIf="paymentType.isSystemDefined" icon="check-circle" size="lg" matTooltip="Yes" matTooltipPosition="right"></fa-icon>
<fa-icon *ngIf="!paymentType.isSystemDefined" icon="times-circle" size="lg" matTooltip="No" matTooltipPosition="right"></fa-icon>
</div>
</td>
</ng-container>
<ng-container matColumnDef="isCashPayment">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Cash Payment </th>
<td mat-cell *matCellDef="let paymentType">
<div [className]="paymentType.isCashPayment === true ? 'true' : 'false'">
<div [className]="paymentType.isCashPayment === true ? 'true text-center' : 'false text-center'">
<fa-icon *ngIf="paymentType.isCashPayment" icon="check-circle" size="lg" matTooltip="Yes" matTooltipPosition="right"></fa-icon>
<fa-icon *ngIf="!paymentType.isCashPayment" icon="times-circle" size="lg" matTooltip="No" matTooltipPosition="right"></fa-icon>
</div>
@@ -42,16 +57,16 @@
<ng-container matColumnDef="position">
<th mat-header-cell *matHeaderCellDef mat-sort-header> Position </th>
<td mat-cell *matCellDef="let paymentType"> {{ paymentType.position }} </td>
<td mat-cell *matCellDef="let paymentType" class="text-center"> {{ paymentType.position }} </td>
</ng-container>
<ng-container matColumnDef="actions">
<th mat-header-cell *matHeaderCellDef> Actions </th>
<td mat-cell *matCellDef="let paymentType">
<button mat-button [routerLink]="[paymentType.id, 'edit']" color="primary">
<button mat-button [routerLink]="[paymentType.id, 'edit']" color="primary" *ngIf="!paymentType.isSystemDefined">
<fa-icon icon="edit"></fa-icon>&nbsp;&nbsp;Edit
</button>
<button mat-button (click)="deletePaymentType(paymentType.id)" color="warn">
<button mat-button (click)="deletePaymentType(paymentType.id)" color="warn" *ngIf="!paymentType.isSystemDefined">
<fa-icon icon="trash"></fa-icon>&nbsp;&nbsp;Delete
</button>
</td>
src/app/organization/payment-types/payment-types.component.scss
+4
View File
@@ -9,3 +9,7 @@ table {
.false {
color: #f44366;
}
.text-center {
text-align: center;
}
src/app/organization/payment-types/payment-types.component.ts
+1 -4
View File
@@ -6,9 +6,6 @@ import { MatSort } from '@angular/material/sort';
import { MatTableDataSource } from '@angular/material/table';
import { ActivatedRoute } from '@angular/router';
/** rxjs Imports */
import { of } from 'rxjs';
/** Custom Services */
import { OrganizationService } from '../organization.service';
@@ -28,7 +25,7 @@ export class PaymentTypesComponent implements OnInit {
/** Payment Types data. */
paymentTypesData: any;
/** Columns to be displayed in payment types table. */
displayedColumns: string[] = ['name', 'description', 'isCashPayment', 'position', 'actions'];
displayedColumns: string[] = ['name', 'description', 'codeName', 'isSystemDefined', 'isCashPayment', 'position', 'actions'];
/** Data source for payment types table. */
dataSource: MatTableDataSource<any>;
src/app/organization/payment-types/payment-types.resolver.ts
+8 -3
View File
@@ -1,6 +1,6 @@
/** Angular Imports */
import { Injectable } from '@angular/core';
import { Resolve } from '@angular/router';
import { ActivatedRouteSnapshot, Resolve } from '@angular/router';
/** rxjs Imports */
import { Observable } from 'rxjs';
@@ -23,8 +23,13 @@ export class PaymentTypesResolver implements Resolve<Object> {
* Returns the payment types data.
* @returns {Observable<any>}
*/
resolve(): Observable<any> {
return this.organizationService.getPaymentTypes();
resolve(route: ActivatedRouteSnapshot): Observable<any> {
const paymentTypeId = route.paramMap.get('id');
if (paymentTypeId) {
return this.organizationService.getPaymentType(paymentTypeId);
} else {
return this.organizationService.getPaymentTypes();
}
}
}
src/app/settings/settings.service.ts
+3 -2
View File
@@ -40,9 +40,10 @@ export class SettingsService {
}
setDefaultLanguage() {
const defaultLanguage = environment.defaultLanguage ? environment.defaultLanguage : 'en-US';
this.setLanguage({
name: environment.defaultLanguage,
code: environment.defaultLanguage.substring(0, 2)
name: defaultLanguage,
code: defaultLanguage.substring(0, 2)
});
}
src/app/shared/shared.module.ts
+1
View File
@@ -73,6 +73,7 @@ import { TranslateModule } from '@ngx-translate/core';
MaterialModule,
FormsModule,
ReactiveFormsModule,
TranslateModule
]
})
export class SharedModule { }
src/assets/styles/_align.scss
+13
View File
@@ -16,3 +16,16 @@
.v-super {
vertical-align: super;
}
.r-amount {
text-align: right !important;
padding-right: 5px;
}
.right {
text-align: right !important;
}
.center {
text-align: center !important;
}
src/assets/styles/_status.scss
-4
View File
@@ -26,10 +26,6 @@
color: $status-active-overdue;
}
.status-active-overdue {
color: $status-active-overdue;
}
.status-matured {
color: $status-matured;
}
src/index.html
+1 -1
View File
@@ -2,7 +2,7 @@
<html lang="en">
<head>
<meta charset="utf-8"/>
<title>Mifos X</title>
<title>{{ 'APP_NAME' | translate }}</title>
<base href="/"/>
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"/>
<meta name="apple-mobile-web-app-capable" content="yes">