Chargeback Loan Transaction

2022-10-01 20:16:14 -05:00
parent 1784a8def0
commit 7a3502abab
21 changed files with 382 additions and 159 deletions
@@ -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>