fix: glim, gsim account create (#2375)

src/app/loans/loans-account-stepper/loans-account-charges-step/loans-account-charges-step.component.html

@@ -132,60 +132,6 @@
     <tr mat-header-row *matHeaderRowDef="overdueChargesDisplayedColumns"></tr>
     <tr mat-row *matRowDef="let row; columns: overdueChargesDisplayedColumns"></tr>
   </table>
-
-  <div fxFlex="98%" *ngIf="activeClientMembers">
-    <table fxFlex="98%" mat-table [dataSource]="dataSource">
-      <!-- Check Column -->
-      <ng-container matColumnDef="check">
-        <th mat-header-cell *matHeaderCellDef>
-          <mat-checkbox (change)="toggleSelects()" [(ngModel)]="selectAllItems"></mat-checkbox>
-        </th>
-        <td mat-cell *matCellDef="let element">
-          <mat-checkbox (change)="toggleSelect()" [(ngModel)]="element.selected"></mat-checkbox>
-        </td>
-      </ng-container>
-
-      <!-- Position Column -->
-      <ng-container matColumnDef="id">
-        <th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Client ID' | translate }}</th>
-        <td mat-cell *matCellDef="let element">{{ element.id }}</td>
-      </ng-container>
-
-      <!-- Name Column -->
-      <ng-container matColumnDef="name">
-        <th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Client Name' | translate }}</th>
-        <td mat-cell *matCellDef="let element">{{ element.displayName }}</td>
-      </ng-container>
-
-      <!-- Weight Column -->
-      <ng-container matColumnDef="purpose">
-        <th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Loan Purpose' | translate }}</th>
-        <td mat-cell *matCellDef="let element">
-          <mat-form-field>
-            <mat-label>{{ 'labels.inputs.Select Purpose' | translate }}</mat-label>
-            <mat-select [(ngModel)]="element.loanPurposeId">
-              <mat-option *ngFor="let purpose of loanPurposeOptions" [value]="purpose.id">
-                {{ purpose.name }}
-              </mat-option>
-            </mat-select>
-          </mat-form-field>
-        </td>
-      </ng-container>
-
-      <!-- Symbol Column -->
-      <ng-container matColumnDef="amount">
-        <th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Original Loan' | translate }}</th>
-        <td mat-cell *matCellDef="let element">
-          <mat-form-field>
-            <input type="number" matInput [(ngModel)]="element.principal" />
-          </mat-form-field>
-        </td>
-      </ng-container>
-
-      <tr mat-header-row *matHeaderRowDef="displayedColumn"></tr>
-      <tr mat-row *matRowDef="let row; columns: displayedColumn"></tr>
-    </table>
-  </div>
 </div>
 
 <div fxLayout="row" class="margin-t" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="2%">
@@ -193,7 +139,7 @@
     <fa-icon icon="arrow-left" class="m-r-10"></fa-icon>
     {{ 'labels.buttons.Previous' | translate }}
   </button>
-  <button mat-raised-button matStepperNext [disabled]="!loansAccountFormValid">
+  <button mat-raised-button matStepperNext>
     {{ 'labels.buttons.Next' | translate }}
     <fa-icon icon="arrow-right" class="m-l-10"></fa-icon>
   </button>

src/app/loans/loans-account-stepper/loans-account-charges-step/loans-account-charges-step.component.ts

@@ -264,10 +264,9 @@ export class LoansAccountChargesStepComponent implements OnInit, OnChanges {
   }
 
   get isValid() {
-    return (
-      !this.activeClientMembers ||
-      this.selectedClientMembers?.selectedMembers?.reduce((acc: any, cur: any) => acc + (cur.principal ?? 0), 0) > 0
-    );
+    return true;
+    // !this.activeClientMembers ||
+    // this.selectedClientMembers?.selectedMembers?.reduce((acc: any, cur: any) => acc + (cur.principal ?? 0), 0) > 0
   }
 
   /**

src/app/loans/loans-account-stepper/loans-account-terms-step/loans-account-terms-step.component.ts

@@ -241,10 +241,13 @@ export class LoansAccountTermsStepComponent implements OnInit, OnChanges {
 
     if (this.loansAccountTermsData) {
       if (this.loansAccountTermsData.loanProductId) {
+        let formattedDate = null;
+        if (this.loansAccountTermsData.expectedFirstRepaymentOnDate) {
+          const repaymentDate = new Date(this.loansAccountTermsData.expectedFirstRepaymentOnDate);
+          formattedDate = this.formatDateToDDMMYYYY(repaymentDate);
+        }
         this.loansAccountTermsForm.patchValue({
-          repaymentsStartingFromDate:
-            this.loansAccountTermsData.expectedFirstRepaymentOnDate &&
-            new Date(this.loansAccountTermsData.expectedFirstRepaymentOnDate)
+          repaymentsStartingFromDate: this.loansAccountTermsData.expectedFirstRepaymentOnDate && formattedDate
         });
       }
       this.loansAccountTermsForm.patchValue({
@@ -284,6 +287,12 @@ export class LoansAccountTermsStepComponent implements OnInit, OnChanges {
   allowAddDisbursementDetails() {
     return this.multiDisburseLoan && !this.loansAccountTermsData.disallowExpectedDisbursements;
   }
+  formatDateToDDMMYYYY(date: Date): string {
+    const day = date.getDate().toString().padStart(2, '0');
+    const month = (date.getMonth() + 1).toString().padStart(2, '0');
+    const year = date.getFullYear();
+    return `${day}-${month}-${year}`;
+  }
 
   /** Custom Validators for the form */
   setCustomValidators() {

src/app/loans/loans-account-stepper/loans-active-client-members/loans-active-client-members.component.html

@@ -0,0 +1,67 @@
+<div fxLayout="row wrap" fxLayoutGap="2%" fxLayout.lt-md="column" *ngIf="activeClientMembers">
+  <table fxFlex="98%" mat-table [dataSource]="dataSource">
+    <!-- Check Column -->
+    <ng-container matColumnDef="check">
+      <th mat-header-cell *matHeaderCellDef>
+        <mat-checkbox (change)="toggleSelects()" [(ngModel)]="selectAllItems"></mat-checkbox>
+      </th>
+      <td mat-cell *matCellDef="let element">
+        <mat-checkbox (change)="toggleSelect()" [(ngModel)]="element.selected"></mat-checkbox>
+      </td>
+    </ng-container>
+
+    <!-- Position Column -->
+    <ng-container matColumnDef="id">
+      <th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Client ID' | translate }}</th>
+      <td mat-cell *matCellDef="let element">{{ element.id }}</td>
+    </ng-container>
+
+    <!-- Name Column -->
+    <ng-container matColumnDef="name">
+      <th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Client Name' | translate }}</th>
+      <td mat-cell *matCellDef="let element">{{ element.displayName }}</td>
+    </ng-container>
+
+    <!-- Weight Column -->
+    <ng-container matColumnDef="purpose">
+      <th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Loan Purpose' | translate }}</th>
+      <td mat-cell *matCellDef="let element">
+        <mat-form-field>
+          <mat-label>{{ 'labels.inputs.Select Purpose' | translate }}</mat-label>
+          <mat-select [(ngModel)]="element.loanPurposeId">
+            <mat-option *ngFor="let purpose of loanPurposeOptions" [value]="purpose.id">
+              {{ purpose.name }}
+            </mat-option>
+          </mat-select>
+        </mat-form-field>
+      </td>
+    </ng-container>
+
+    <!-- Symbol Column -->
+    <ng-container matColumnDef="amount">
+      <th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Original Loan' | translate }}</th>
+      <td mat-cell *matCellDef="let element">
+        <mat-form-field>
+          <input type="number" matInput [(ngModel)]="element.principal" />
+        </mat-form-field>
+      </td>
+    </ng-container>
+
+    <tr mat-header-row *matHeaderRowDef="displayedColumn"></tr>
+    <tr mat-row *matRowDef="let row; columns: displayedColumn"></tr>
+  </table>
+</div>
+
+<div fxLayout="row" class="margin-t" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="2%">
+  <button mat-raised-button matStepperPrevious>
+    <fa-icon icon="arrow-left" class="m-r-10"></fa-icon>
+    {{ 'labels.buttons.Previous' | translate }}
+  </button>
+  <button mat-raised-button matStepperNext [disabled]="!loansAccountFormValid">
+    {{ 'labels.buttons.Next' | translate }}
+    <fa-icon icon="arrow-right" class="m-l-10"></fa-icon>
+  </button>
+  <button mat-raised-button *ngIf="loanId" [routerLink]="['../', 'general']">
+    {{ 'labels.buttons.Cancel' | translate }}
+  </button>
+</div>

src/app/loans/loans-account-stepper/loans-active-client-members/loans-active-client-members.component.scss

@@ -0,0 +1,36 @@
+table {
+  width: 100%;
+}
+
+.mat-elevation-z1 {
+  margin: 1em 0 1.5em;
+}
+
+.margin-t {
+  margin-top: 1em;
+}
+
+h4 {
+  font-weight: 500;
+  margin: 1em 0;
+}
+
+h3 {
+  font-weight: 500;
+}
+
+mat-divider {
+  margin: 1em 0;
+}
+
+.margin-v {
+  margin: 1em 0;
+}
+
+.margin-b {
+  margin: 0 0 1em;
+}
+
+.tableName {
+  padding-left: 2%;
+}

src/app/loans/loans-account-stepper/loans-active-client-members/loans-active-client-members.component.spec.ts

@@ -0,0 +1,22 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { LoansActiveClientMembersComponent } from './loans-active-client-members.component';
+
+describe('LoansActiveClientMembersComponent', () => {
+  let component: LoansActiveClientMembersComponent;
+  let fixture: ComponentFixture<LoansActiveClientMembersComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [LoansActiveClientMembersComponent]
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(LoansActiveClientMembersComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/loans/loans-account-stepper/loans-active-client-members/loans-active-client-members.component.ts

@@ -0,0 +1,62 @@
+import { Component, OnInit, Input } from '@angular/core';
+import { MatTableDataSource } from '@angular/material/table';
+import { ActivatedRoute } from '@angular/router';
+
+@Component({
+  selector: 'mifosx-loans-active-client-members',
+  templateUrl: './loans-active-client-members.component.html',
+  styleUrls: ['./loans-active-client-members.component.scss']
+})
+export class LoansActiveClientMembersComponent implements OnInit {
+  loanId: any = null;
+  @Input() activeClientMembers?: any;
+  @Input() loansAccountFormValid: boolean;
+
+  constructor(private route: ActivatedRoute) {
+    this.loanId = this.route.snapshot.params['loanId'];
+  }
+  dataSource: any;
+  /** Check for select all the Clients List */
+  selectAllItems = false;
+  /** Loan Purpose Options */
+  loanPurposeOptions: string[] = [];
+  /** Table Displayed Columns */
+  displayedColumn: string[] = [
+    'check',
+    'id',
+    'name',
+    'purpose',
+    'amount'
+  ];
+
+  ngOnInit(): void {
+    // console.log("Active Client Members in LoansActiveClientMembersComponent:", this.activeClientMembers);
+
+    this.dataSource = new MatTableDataSource<any>(this.activeClientMembers);
+  }
+
+  get isValid() {
+    // console.log("LoansActiveClientMembersComponent isValid:", this.selectedClientMembers?.selectedMembers?.reduce((acc: any, cur: any) => acc + (cur.principal ?? 0), 0) > 0);
+    return (
+      !this.activeClientMembers ||
+      this.selectedClientMembers?.selectedMembers?.reduce((acc: any, cur: any) => acc + (cur.principal ?? 0), 0) > 0
+    );
+  }
+  get selectedClientMembers() {
+    return { selectedMembers: this.activeClientMembers.filter((item: any) => item.selected) };
+  }
+
+  /** Toggle all checks */
+  toggleSelects() {
+    for (const member of this.activeClientMembers) {
+      member.selected = this.selectAllItems;
+    }
+  }
+
+  /** Check if all the checks are selected */
+  toggleSelect() {
+    const len = this.activeClientMembers.length;
+    this.selectAllItems =
+      len === 0 ? false : this.activeClientMembers.filter((item: any) => item.selected).length === len;
+  }
+}