Fix to upload documents (#1621)
Co-authored-by: Jose Alberto Hernandez <alberto@MacBook-Pro.local>
This commit is contained in:
José Alberto Hernández
co-authored by
Jose Alberto Hernandez
Jose Alberto Hernandez
parent
9d19d1b061
commit
28d5d7595f
-28
@@ -1,28 +0,0 @@
|
||||
<h1 mat-dialog-title>Load Loan Document</h1>
|
||||
|
||||
<div>
|
||||
<form [formGroup]="uploadDocumentForm" fxLayout="column">
|
||||
|
||||
<mat-form-field fxFlex>
|
||||
<mat-label>File Name</mat-label>
|
||||
<input formControlName="name" required matInput />
|
||||
<mat-error *ngIf="uploadDocumentForm.controls.name.hasError('required')">
|
||||
File Name is <strong>required</strong>
|
||||
</mat-error>
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field fxFlex>
|
||||
<mat-label>Description</mat-label>
|
||||
<input formControlName="description" matInput />
|
||||
</mat-form-field>
|
||||
|
||||
<mifosx-file-upload flex="60%" (change)="onFileSelect($event)"></mifosx-file-upload>
|
||||
|
||||
<mat-dialog-actions align="end">
|
||||
<button mat-raised-button mat-dialog-close>Cancel</button>
|
||||
<button mat-raised-button color="primary" [disabled]="!uploadDocumentForm.valid" *mifosxHasPermission="'CREATE_DOCUMENT'"
|
||||
[mat-dialog-close]="{data: {name: uploadDocumentForm.value.name, description: uploadDocumentForm.value.description, file: uploadDocumentForm.value.file} }">Confirm</button>
|
||||
</mat-dialog-actions>
|
||||
|
||||
</form>
|
||||
</div>
|
||||
-25
@@ -1,25 +0,0 @@
|
||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { LoanAccountLoadDocumentsDialogComponent } from './loan-account-load-documents-dialog.component';
|
||||
|
||||
describe('LoanAccountLoadDocumentsDialogComponent', () => {
|
||||
let component: LoanAccountLoadDocumentsDialogComponent;
|
||||
let fixture: ComponentFixture<LoanAccountLoadDocumentsDialogComponent>;
|
||||
|
||||
beforeEach(async(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ LoanAccountLoadDocumentsDialogComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
}));
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(LoanAccountLoadDocumentsDialogComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
-51
@@ -1,51 +0,0 @@
|
||||
import { Component, OnInit, Inject } from '@angular/core';
|
||||
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
|
||||
import { FormGroup, FormBuilder, Validators, FormControl } from '@angular/forms';
|
||||
|
||||
@Component({
|
||||
selector: 'mifosx-loan-account-load-documents-dialog',
|
||||
templateUrl: './loan-account-load-documents-dialog.component.html',
|
||||
styleUrls: ['./loan-account-load-documents-dialog.component.scss']
|
||||
})
|
||||
export class LoanAccountLoadDocumentsDialogComponent implements OnInit {
|
||||
|
||||
/** Upload Document form. */
|
||||
uploadDocumentForm: FormGroup;
|
||||
|
||||
/**
|
||||
* @param {MatDialogRef} dialogRef Dialog reference element
|
||||
* @param {FormBuilder} formBuilder Form Builder
|
||||
* @param {any} data Dialog Data
|
||||
*/
|
||||
constructor(public dialogRef: MatDialogRef<LoanAccountLoadDocumentsDialogComponent>,
|
||||
private formBuilder: FormBuilder,
|
||||
@Inject(MAT_DIALOG_DATA) public data: any) {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.createUploadDocumentForm();
|
||||
}
|
||||
|
||||
/**
|
||||
* Creates the upload Document form.
|
||||
*/
|
||||
createUploadDocumentForm() {
|
||||
this.uploadDocumentForm = this.formBuilder.group({
|
||||
'name': ['', Validators.required],
|
||||
'description': [''],
|
||||
'file': ['']
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Sets file form control value.
|
||||
* @param {any} $event file change event.
|
||||
*/
|
||||
onFileSelect($event: any) {
|
||||
if ($event.target.files.length > 0) {
|
||||
const file = $event.target.files[0];
|
||||
this.uploadDocumentForm.get('file').setValue(file);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
@@ -1,59 +1,52 @@
|
||||
<div class="tab-container mat-typography">
|
||||
|
||||
<div>
|
||||
<div fxLayout="column" fxFlex="100%">
|
||||
<div fxLayout="row" fxLayoutAlign="flex-end">
|
||||
<button mat-raised-button color="primary" (click)="uploadDocument()" *ngIf="choice">
|
||||
<fa-icon icon="plus"></fa-icon> Upload
|
||||
<h3>Documents</h3>
|
||||
|
||||
<button mat-raised-button class="f-right" color="primary" (click)="uploadDocument()"
|
||||
*mifosxHasPermission="'CREATE_DOCUMENT'">
|
||||
<fa-icon icon="plus" class="m-r-10"></fa-icon>Add
|
||||
</button>
|
||||
|
||||
<table mat-table #documentsTable [dataSource]="dataSource" matSort>
|
||||
|
||||
<ng-container matColumnDef="name">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header> Name </th>
|
||||
<td mat-cell *matCellDef="let document"> {{ document.name }} </td>
|
||||
</ng-container>
|
||||
|
||||
<ng-container matColumnDef="description">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header> Description </th>
|
||||
<td mat-cell *matCellDef="let document"> {{ document.description }} </td>
|
||||
</ng-container>
|
||||
|
||||
<ng-container matColumnDef="filename">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header> File Name </th>
|
||||
<td mat-cell *matCellDef="let document"> {{ document.fileName }} </td>
|
||||
</ng-container>
|
||||
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header> Actions </th>
|
||||
<td mat-cell *matCellDef="let document; let index">
|
||||
<button class="document-action-button" mat-raised-button color="primary">
|
||||
<fa-icon icon="cloud-download-alt"></fa-icon>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ng-container *ngIf="loanDocuments.length > 0">
|
||||
<button class="document-action-button" mat-raised-button color="primary" *ngIf="document.fileIsImage">
|
||||
<i class="fa fa-eye"></i>
|
||||
</button>
|
||||
|
||||
<table mat-table #documentsTable [dataSource]="dataSource" matSort>
|
||||
<button class="document-action-button" mat-raised-button color="warn"
|
||||
(click)="deleteDocument(document.id, index)">
|
||||
<fa-icon icon="times"></fa-icon>
|
||||
</button>
|
||||
|
||||
<ng-container matColumnDef="name">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header> Name </th>
|
||||
<td mat-cell *matCellDef="let document"> {{ document.name }} </td>
|
||||
</ng-container>
|
||||
</td>
|
||||
</ng-container>
|
||||
|
||||
<ng-container matColumnDef="description">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header> Description </th>
|
||||
<td mat-cell *matCellDef="let document"> {{ document.description }} </td>
|
||||
</ng-container>
|
||||
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
|
||||
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
|
||||
</table>
|
||||
|
||||
<ng-container matColumnDef="filename">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header> File Name </th>
|
||||
<td mat-cell *matCellDef="let document"> {{ document.fileName }} </td>
|
||||
</ng-container>
|
||||
|
||||
<ng-container matColumnDef="actions">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header> Actions </th>
|
||||
<td mat-cell *matCellDef="let document; let index">
|
||||
<button class="loan-document-action-button" mat-raised-button color="primary">
|
||||
<fa-icon icon="cloud-download-alt"></fa-icon>
|
||||
</button>
|
||||
|
||||
<button class="loan-document-action-button" mat-raised-button color="primary" *ngIf="document.fileIsImage">
|
||||
<i class="fa fa-eye"></i>
|
||||
</button>
|
||||
|
||||
<button class="loan-document-action-button" mat-raised-button color="warn"
|
||||
(click)="deleteDocument(document.id, index)">
|
||||
<fa-icon icon="times"></fa-icon>
|
||||
</button>
|
||||
|
||||
</td>
|
||||
</ng-container>
|
||||
|
||||
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
|
||||
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
|
||||
</table>
|
||||
|
||||
<mat-paginator [pageSizeOptions]="[10, 25, 50, 100]" showFirstLastButtons></mat-paginator>
|
||||
|
||||
</ng-container>
|
||||
<mat-paginator [pageSizeOptions]="[10, 25, 50, 100]" showFirstLastButtons></mat-paginator>
|
||||
|
||||
</div>
|
||||
|
||||
@@ -1,12 +1,12 @@
|
||||
table {
|
||||
width: 100%;
|
||||
margin-top: 3%;
|
||||
.account-action-button{
|
||||
.document-action-button {
|
||||
min-width: 26px;
|
||||
padding: 0 6px;
|
||||
margin: 4px;
|
||||
line-height: 25px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tab-container {
|
||||
|
||||
@@ -11,9 +11,9 @@ import { environment } from 'environments/environment';
|
||||
import { LoansService } from 'app/loans/loans.service';
|
||||
|
||||
/** Dialog Components */
|
||||
import { LoanAccountLoadDocumentsDialogComponent } from 'app/loans/custom-dialog/loan-account-load-documents-dialog/loan-account-load-documents-dialog.component';
|
||||
import { DeleteDialogComponent } from 'app/shared/delete-dialog/delete-dialog.component';
|
||||
import { SettingsService } from 'app/settings/settings.service';
|
||||
import { UploadDocumentDialogComponent } from 'app/clients/clients-view/custom-dialogs/upload-document-dialog/upload-document-dialog.component';
|
||||
|
||||
/**
|
||||
* Overdue charges tab component
|
||||
@@ -24,7 +24,7 @@ import { SettingsService } from 'app/settings/settings.service';
|
||||
styleUrls: ['./loan-documents-tab.component.scss']
|
||||
})
|
||||
export class LoanDocumentsTabComponent implements OnInit {
|
||||
@ViewChild('documentsTable') documentsTable: MatTable<Element>;
|
||||
@ViewChild('documentsTable', { static: true }) documentsTable: MatTable<Element>;
|
||||
|
||||
/** Stores the resolved loan documents data */
|
||||
loanDocuments: any;
|
||||
@@ -91,11 +91,26 @@ export class LoanDocumentsTabComponent implements OnInit {
|
||||
}
|
||||
|
||||
uploadDocument() {
|
||||
const uploadLoanDocumentDialogRef = this.dialog.open(LoanAccountLoadDocumentsDialogComponent);
|
||||
uploadLoanDocumentDialogRef.afterClosed().subscribe((data: any) => {
|
||||
if (data) {
|
||||
this.loansService.loadLoanDocument(this.loanDetailsData.id, data)
|
||||
.subscribe(() => {});
|
||||
const uploadDocumentDialogRef = this.dialog.open(UploadDocumentDialogComponent, {
|
||||
data: { documentIdentifier: false, entityType: 'Loan' }
|
||||
});
|
||||
uploadDocumentDialogRef.afterClosed().subscribe((dialogResponse: any) => {
|
||||
if (dialogResponse) {
|
||||
const formData: FormData = new FormData;
|
||||
formData.append('name', dialogResponse.fileName);
|
||||
formData.append('file', dialogResponse.file);
|
||||
formData.append('description', dialogResponse.description);
|
||||
this.loansService.loadLoanDocument(this.loanDetailsData.id, formData).subscribe((res: any) => {
|
||||
this.loanDocuments.push({
|
||||
id: res.resourceId,
|
||||
parentEntityType: 'loans',
|
||||
parentEntityId: this.loanDetailsData.id,
|
||||
name: dialogResponse.fileName,
|
||||
description: dialogResponse.description,
|
||||
fileName: dialogResponse.file.name
|
||||
});
|
||||
this.documentsTable.renderRows();
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
@@ -68,7 +68,6 @@ import { GlimPreviewStepComponent } from './glim-account/create-glim-account/gli
|
||||
/** Dialog Components */
|
||||
import { LoansAccountViewGuarantorDetailsDialogComponent } from './custom-dialog/loans-account-view-guarantor-details-dialog/loans-account-view-guarantor-details-dialog.component';
|
||||
import { LoansAccountAddCollateralDialogComponent } from './custom-dialog/loans-account-add-collateral-dialog/loans-account-add-collateral-dialog.component';
|
||||
import { LoanAccountLoadDocumentsDialogComponent } from './custom-dialog/loan-account-load-documents-dialog/loan-account-load-documents-dialog.component';
|
||||
import { LoanCreditBalanceRefundComponent } from './loans-view/loan-account-actions/loan-credit-balance-refund/loan-credit-balance-refund.component';
|
||||
import { LoanDelinquencyTagsTabComponent } from './loans-view/loan-delinquency-tags-tab/loan-delinquency-tags-tab.component';
|
||||
import { LoansAccountScheduleStepComponent } from './loans-account-stepper/loans-account-schedule-step/loans-account-schedule-step.component';
|
||||
@@ -126,7 +125,6 @@ import { DisburseToSavingsAccountComponent } from './loans-view/loan-account-act
|
||||
AddCollateralComponent,
|
||||
UndoDisbursalComponent,
|
||||
LoanDocumentsTabComponent,
|
||||
LoanAccountLoadDocumentsDialogComponent,
|
||||
StandingInstructionsTabComponent,
|
||||
EditLoansAccountComponent,
|
||||
LoanScreenReportsComponent,
|
||||
|
||||
Reference in New Issue
Block a user