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

WEB-673 Create a Tasks sections just like it was available in the legacy Mifos Community App (#3106)

Browse Source
This commit is contained in:
Soni Jay
2026-02-07 17:36:00 -06:00
committed by GitHub
parent a3a2f8471e
commit f25f82a004
29 changed files with 709 additions and 256 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/core/shell/toolbar/toolbar.component.html
+10
View File
@@ -49,6 +49,16 @@
</a>
<span class="hide-lt-md">
<a
#tasks
class="tab-link tasks-link"
[routerLink]="['/checker-inbox-and-tasks/checker-inbox']"
tabindex="0"
*mifosxHasPermission="'ALL_FUNCTIONS_READ'"
>
<fa-icon class="mr-05" icon="check" size="lg"></fa-icon>
{{ 'labels.menus.Tasks' | translate }}
</a>
<a
#accounting
class="tab-link accounting-link"
src/app/tasks/checker-inbox-and-tasks-tabs/checker-inbox/checker-inbox.component.html
+118 -109
View File
@@ -6,34 +6,43 @@
file, You can obtain one at http://mozilla.org/MPL/2.0/.
-->
@if (checkerData) {
<div class="tab-container mat-typography">
<div class="layout-row align-start-center">
<div class="search-box flex-40">
<mat-form-field class="flex-fill flex-90">
<input
matInput
placeholder="{{ 'labels.text.Search by user' | translate }}"
(keyup)="applyFilter($event.target.value)"
/>
</mat-form-field>
</div>
<div class="flex-60 gap-8px">
<button mat-raised-button color="success" (click)="approveChecker()">
<fa-icon icon="check" class="m-r-10"></fa-icon>{{ 'labels.buttons.Approve' | translate }}
</button>
<button mat-raised-button color="warn" (click)="deleteChecker()">
<fa-icon icon="trash" class="m-r-10"></fa-icon>{{ 'labels.buttons.Delete' | translate }}
</button>
<button mat-raised-button color="reject" (click)="rejectChecker()">
<fa-icon icon="times" class="m-r-10"></fa-icon>{{ 'labels.buttons.Reject' | translate }}
</button>
</div>
</div>
<div class="tab-container mat-typography">
<div class="search-row">
<mat-form-field class="search-field">
<input
matInput
placeholder="{{ 'labels.text.Search by user' | translate }}"
(keyup)="applyFilter($event.target.value)"
/>
</mat-form-field>
<button
mat-icon-button
(click)="toggleAdvancedSearch()"
class="icon-button"
[attr.aria-label]="
showAdvancedSearch
? ('labels.buttons.Hide advanced search' | translate)
: ('labels.buttons.Show advanced search' | translate)
"
[attr.aria-expanded]="showAdvancedSearch"
>
<mat-icon>{{ showAdvancedSearch ? 'arrow_drop_up' : 'arrow_drop_down' }}</mat-icon>
</button>
<button mat-raised-button class="action-button btn-success" (click)="approveChecker()">
<fa-icon icon="check" class="m-r-10"></fa-icon>{{ 'labels.buttons.Approve' | translate }}
</button>
<button mat-raised-button color="warn" (click)="deleteChecker()" class="action-button">
<fa-icon icon="trash" class="m-r-10"></fa-icon>{{ 'labels.buttons.Delete' | translate }}
</button>
<button mat-raised-button class="action-button btn-reject" (click)="rejectChecker()">
<fa-icon icon="times" class="m-r-10"></fa-icon>{{ 'labels.buttons.Reject' | translate }}
</button>
</div>
@if (showAdvancedSearch) {
<form [formGroup]="makerCheckerSearchForm">
<div class="layout-row-wrap gap-2px responsive-column">
<mat-form-field class="flex-fill flex-31" (click)="makerDateTimeFromPicker.open()">
<mat-label>{{ 'labels.inputs.From Date' | translate }}</mat-label>
<div class="advanced-search-container">
<mat-form-field class="search-field" (click)="makerDateTimeFromPicker.open()">
<mat-label>{{ 'labels.inputs.From date' | translate }}</mat-label>
<input
matInput
[min]="minDate"
@@ -44,8 +53,8 @@
<mat-datepicker-toggle matSuffix [for]="makerDateTimeFromPicker"></mat-datepicker-toggle>
<mat-datepicker #makerDateTimeFromPicker></mat-datepicker>
</mat-form-field>
<mat-form-field class="flex-fill flex-31" (click)="makerDateTimetoPicker.open()">
<mat-label>{{ 'labels.inputs.To Date' | translate }}</mat-label>
<mat-form-field class="search-field" (click)="makerDateTimetoPicker.open()">
<mat-label>{{ 'labels.inputs.To date' | translate }}</mat-label>
<input
matInput
[min]="minDate"
@@ -56,8 +65,8 @@
<mat-datepicker-toggle matSuffix [for]="makerDateTimetoPicker"></mat-datepicker-toggle>
<mat-datepicker #makerDateTimetoPicker></mat-datepicker>
</mat-form-field>
<mat-form-field class="flex-31">
<mat-label>{{ 'labels.inputs.Action' | translate }}</mat-label>
<mat-form-field class="search-field">
<mat-label>{{ 'labels.inputs.Select action' | translate }}</mat-label>
<mat-select formControlName="actionName">
@for (action of makerCheckerTemplate.actionNames; track action) {
<mat-option [value]="action">
@@ -66,8 +75,8 @@
}
</mat-select>
</mat-form-field>
<mat-form-field class="flex-31">
<mat-label>{{ 'labels.inputs.Entity' | translate }}</mat-label>
<mat-form-field class="search-field">
<mat-label>{{ 'labels.inputs.Select entity' | translate }}</mat-label>
<mat-select formControlName="entityName">
@for (entity of makerCheckerTemplate.entityNames; track entity) {
<mat-option [value]="entity">
@@ -76,86 +85,86 @@
}
</mat-select>
</mat-form-field>
<mat-form-field class="flex-31">
<mat-label>{{ 'labels.inputs.Resource ID' | translate }}</mat-label>
<mat-form-field class="search-field">
<mat-label>{{ 'labels.inputs.Resource id' | translate }}</mat-label>
<input matInput formControlName="resourceId" />
</mat-form-field>
<button mat-raised-button color="primary" id="search-button" (click)="search()">
{{ 'labels.buttons.Search' | translate }}
<button mat-raised-button color="primary" id="search-button" type="button" (click)="search()">
<fa-icon icon="search" class="m-r-10"></fa-icon>{{ 'labels.buttons.Advanced Search' | translate }}
</button>
</div>
</form>
@if (!noSearchedData) {
<table mat-table [dataSource]="dataSource">
<ng-container matColumnDef="select">
<th mat-header-cell *matHeaderCellDef>
<mat-checkbox
(change)="$event ? masterToggle() : null"
[checked]="selection.hasValue() && isAllSelected()"
[indeterminate]="selection.hasValue() && !isAllSelected()"
[aria-label]="checkboxLabel()"
>
</mat-checkbox>
</th>
<td mat-cell *matCellDef="let row">
<mat-checkbox
(click)="$event.stopPropagation()"
(change)="$event ? selection.toggle(row) : null"
[checked]="selection.isSelected(row)"
[aria-label]="checkboxLabel(row)"
>
</mat-checkbox>
</td>
</ng-container>
<ng-container matColumnDef="id">
<th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.ID' | translate }}</th>
<td mat-cell *matCellDef="let makerChecker">{{ makerChecker.id }}</td>
</ng-container>
<ng-container matColumnDef="madeOnDate">
<th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Made on Date' | translate }}</th>
<td mat-cell *matCellDef="let makerChecker">{{ makerChecker.madeOnDate | dateFormat }}</td>
</ng-container>
<ng-container matColumnDef="status">
<th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Status' | translate }}</th>
<td mat-cell *matCellDef="let makerChecker">{{ makerChecker.processingResult }}</td>
</ng-container>
<ng-container matColumnDef="user">
<th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.User' | translate }}</th>
<td mat-cell *matCellDef="let makerChecker">{{ makerChecker.maker }}</td>
</ng-container>
<ng-container matColumnDef="action">
<th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Action' | translate }}</th>
<td mat-cell *matCellDef="let makerChecker">{{ makerChecker.actionName }}</td>
</ng-container>
<ng-container matColumnDef="entity">
<th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Entity' | translate }}</th>
<td mat-cell *matCellDef="let makerChecker">{{ makerChecker.entityName }}</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr
mat-row
*matRowDef="let row; columns: displayedColumns"
[routerLink]="[row.id, 'view']"
class="select-row"
></tr>
</table>
}
@if (noSearchedData) {
<div class="alert">
<div class="message">
<i class="fa fa-exclamation-circle alert-check fa-2x"></i>
{{ 'labels.text.No checker inbox data available for this search' | translate }}
</div>
}
@if (checkerData && !noSearchedData) {
<table mat-table [dataSource]="dataSource">
<ng-container matColumnDef="select">
<th mat-header-cell *matHeaderCellDef>
<mat-checkbox
(change)="$event ? masterToggle() : null"
[checked]="selection.hasValue() && isAllSelected()"
[indeterminate]="selection.hasValue() && !isAllSelected()"
[aria-label]="checkboxLabel()"
>
</mat-checkbox>
</th>
<td mat-cell *matCellDef="let row">
<mat-checkbox
(click)="$event.stopPropagation()"
(change)="$event ? selection.toggle(row) : null"
[checked]="selection.isSelected(row)"
[aria-label]="checkboxLabel(row)"
>
</mat-checkbox>
</td>
</ng-container>
<ng-container matColumnDef="id">
<th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.ID' | translate }}</th>
<td mat-cell *matCellDef="let makerChecker">{{ makerChecker.id }}</td>
</ng-container>
<ng-container matColumnDef="madeOnDate">
<th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Made on Date' | translate }}</th>
<td mat-cell *matCellDef="let makerChecker">{{ makerChecker.madeOnDate | dateFormat }}</td>
</ng-container>
<ng-container matColumnDef="status">
<th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Status' | translate }}</th>
<td mat-cell *matCellDef="let makerChecker">{{ makerChecker.processingResult }}</td>
</ng-container>
<ng-container matColumnDef="user">
<th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.User' | translate }}</th>
<td mat-cell *matCellDef="let makerChecker">{{ makerChecker.maker }}</td>
</ng-container>
<ng-container matColumnDef="action">
<th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Action' | translate }}</th>
<td mat-cell *matCellDef="let makerChecker">{{ makerChecker.actionName }}</td>
</ng-container>
<ng-container matColumnDef="entity">
<th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Entity' | translate }}</th>
<td mat-cell *matCellDef="let makerChecker">{{ makerChecker.entityName }}</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr
mat-row
*matRowDef="let row; columns: displayedColumns"
[routerLink]="[row.id, 'view']"
class="select-row"
></tr>
</table>
}
@if (checkerData && noSearchedData) {
<div class="alert">
<div class="message">
<i class="fa fa-exclamation-circle alert-check fa-2x"></i>
{{ 'labels.text.No checker inbox data available for this search' | translate }}
</div>
}
</div>
}
@if (!checkerData) {
<div class="alert">
<div class="message">
<i class="fa fa-exclamation-circle alert-check fa-2x"></i>
{{ 'labels.text.No checker inbox data available for this account' | translate }}
</div>
</div>
}
}
@if (!checkerData) {
<div class="alert">
<div class="message">
<i class="fa fa-exclamation-circle alert-check fa-2x"></i>
{{ 'labels.text.No checker inbox data available for this account' | translate }}
</div>
</div>
}
</div>
src/app/tasks/checker-inbox-and-tasks-tabs/checker-inbox/checker-inbox.component.scss
+93 -6
View File
@@ -10,14 +10,93 @@
padding: 1%;
margin: 1%;
.mat-raised-button.mat-success {
color: #fff;
background-color: #008000ab;
::ng-deep mat-form-field {
width: 280px;
min-width: 280px;
max-width: 280px;
.mat-mdc-form-field-subscript-wrapper {
height: 0;
min-height: 0;
}
.mat-mdc-text-field-wrapper {
margin-bottom: 0;
width: 100%;
}
.mat-mdc-form-field-flex {
width: 100%;
}
.mat-mdc-form-field-infix {
padding-top: 8px;
padding-bottom: 8px;
min-height: 48px;
}
input {
height: 48px;
width: 100%;
}
}
.mat-raised-button.mat-reject {
color: #fff;
background-color: #ffca00;
::ng-deep .mat-mdc-select {
width: 100%;
}
::ng-deep .mat-mdc-select-trigger {
width: 100%;
height: 48px;
display: flex;
align-items: center;
}
button.mat-mdc-raised-button {
height: 48px;
line-height: 48px;
padding: 0 16px;
min-height: 48px;
}
button.mat-mdc-icon-button {
width: 48px;
height: 48px;
padding: 0;
}
button.mat-mdc-raised-button.btn-success {
color: #000 !important;
background-color: #fff !important;
}
button.mat-mdc-raised-button.btn-reject {
color: #000 !important;
background-color: #fff !important;
}
/* ---------- SEARCH & LAYOUT ---------- */
.search-row {
display: flex;
align-items: center;
gap: 8px;
margin-bottom: 16px;
}
.search-field {
width: 280px;
min-width: 280px;
max-width: 280px;
margin: 0;
flex: 0 0 280px;
}
.advanced-search-container {
display: flex;
flex-wrap: wrap;
gap: 16px;
margin-bottom: 16px;
align-items: flex-start;
}
#search-button {
@@ -25,6 +104,14 @@
margin-top: 1rem;
}
.icon-button {
margin: 0;
}
.action-button {
margin: 0;
}
.view-details {
cursor: pointer;
}
src/app/tasks/checker-inbox-and-tasks-tabs/checker-inbox/checker-inbox.component.ts
+12 -1
View File
@@ -25,6 +25,7 @@ import {
MatRow
} from '@angular/material/table';
import { MatDialog } from '@angular/material/dialog';
import { MatIcon } from '@angular/material/icon';
/** Custom Services */
import { TasksService } from '../../tasks.service';
@@ -57,7 +58,8 @@ import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
MatHeaderRow,
MatRowDef,
MatRow,
DateFormatPipe
DateFormatPipe,
MatIcon
]
})
export class CheckerInboxComponent implements OnInit {
@@ -78,6 +80,8 @@ export class CheckerInboxComponent implements OnInit {
noSearchedData = false;
/** Checks if there is any checker data */
checkerData = false;
/** Show/hide advanced search form */
showAdvancedSearch = false;
/** Maker Checker Search Form */
makerCheckerSearchForm: UntypedFormGroup;
/** Minimum date allowed. */
@@ -138,6 +142,13 @@ export class CheckerInboxComponent implements OnInit {
});
}
/**
* Toggle advanced search form visibility.
*/
toggleAdvancedSearch() {
this.showAdvancedSearch = !this.showAdvancedSearch;
}
search() {
const dateFormat = this.settingsService.dateFormat;
const makerCheckerSearchParams = {
src/app/tasks/checker-inbox-and-tasks-tabs/client-approval/client-approval.component.html
+18 -15
View File
@@ -8,21 +8,24 @@
@if (showData) {
<div class="tab-container mat-typography">
<div class="layout-row align-start-center">
<div class="search-box flex-40">
<mat-form-field class="flex-fill flex-90">
<input
matInput
placeholder="{{ 'labels.text.Filter by name' | translate }}"
(keyup)="applyFilter($event.target.value)"
/>
</mat-form-field>
</div>
<div class="flex-60">
<button mat-raised-button color="success" *mifosxHasPermission="'ACTIVATE_CLIENT'" (click)="approveClients()">
<fa-icon icon="check" class="m-r-10"></fa-icon>{{ 'labels.buttons.Approve' | translate }}
</button>
</div>
<div class="tasks-header">
<mat-form-field class="tasks-search-field">
<input
#filterInput
matInput
placeholder="{{ 'labels.text.Filter by name' | translate }}"
(keyup)="applyFilter(filterInput.value)"
/>
</mat-form-field>
<button
mat-raised-button
color="success"
*mifosxHasPermission="'ACTIVATE_CLIENT'"
(click)="approveClients()"
class="tasks-action-btn"
>
<fa-icon icon="check" class="m-r-10"></fa-icon>{{ 'labels.buttons.Approve' | translate }}
</button>
</div>
@for (client of groupedClients | keyvalue; track client) {
<h3>{{ client.key }}</h3>
src/app/tasks/checker-inbox-and-tasks-tabs/client-approval/client-approval.component.scss
+44
View File
@@ -10,6 +10,34 @@
padding: 1%;
margin: 1%;
::ng-deep mat-form-field {
.mat-mdc-form-field-subscript-wrapper {
height: 0;
min-height: 0;
}
.mat-mdc-text-field-wrapper {
margin-bottom: 0;
}
.mat-mdc-form-field-infix {
padding-top: 8px;
padding-bottom: 8px;
min-height: 48px;
}
input {
height: 48px;
}
}
button.mat-mdc-raised-button {
height: 48px;
line-height: 48px;
padding: 0 16px;
min-height: 48px;
}
.mat-raised-button.mat-success {
color: #fff;
background-color: #008000ab;
@@ -18,6 +46,22 @@
.view-details {
cursor: pointer;
}
.tasks-header {
display: flex;
align-items: center;
gap: 8px;
margin-bottom: 16px;
}
.tasks-search-field {
width: 280px;
margin: 0;
}
.tasks-action-btn {
margin: 0;
}
}
.alert {
src/app/tasks/checker-inbox-and-tasks-tabs/loan-approval/loan-approval.component.html
+17 -15
View File
@@ -8,21 +8,23 @@
@if (showData) {
<div class="tab-container mat-typography">
<div class="layout-row align-start-center">
<div class="search-box flex-40">
<mat-form-field class="flex-fill flex-90">
<input
matInput
placeholder="{{ 'labels.text.Filter by name' | translate }}"
(keyup)="applyFilter($event.target.value)"
/>
</mat-form-field>
</div>
<div class="flex-60">
<button mat-raised-button color="success" *mifosxHasPermission="'APPROVE_LOAN'" (click)="approveLoan()">
<fa-icon icon="check" class="m-r-10"></fa-icon>{{ 'labels.buttons.Approve' | translate }}
</button>
</div>
<div class="tasks-header">
<mat-form-field class="tasks-search-field">
<input
matInput
placeholder="{{ 'labels.text.Filter by name' | translate }}"
(keyup)="applyFilter($event.target.value)"
/>
</mat-form-field>
<button
mat-raised-button
color="success"
*mifosxHasPermission="'APPROVE_LOAN'"
(click)="approveLoan()"
class="tasks-action-btn"
>
<fa-icon icon="check" class="m-r-10"></fa-icon>{{ 'labels.buttons.Approve' | translate }}
</button>
</div>
@for (office of officesArray; track office) {
<h3 class="mat-h3">{{ office.name }}</h3>
src/app/tasks/checker-inbox-and-tasks-tabs/loan-approval/loan-approval.component.scss
+44
View File
@@ -10,6 +10,34 @@
padding: 1%;
margin: 1%;
::ng-deep mat-form-field {
.mat-mdc-form-field-subscript-wrapper {
height: 0;
min-height: 0;
}
.mat-mdc-text-field-wrapper {
margin-bottom: 0;
}
.mat-mdc-form-field-infix {
padding-top: 8px;
padding-bottom: 8px;
min-height: 48px;
}
input {
height: 48px;
}
}
button.mat-mdc-raised-button {
height: 48px;
line-height: 48px;
padding: 0 16px;
min-height: 48px;
}
.mat-raised-button.mat-success {
color: #fff;
background-color: #008000ab;
@@ -18,6 +46,22 @@
.view-details {
cursor: pointer;
}
.tasks-header {
display: flex;
align-items: center;
gap: 8px;
margin-bottom: 16px;
}
.tasks-search-field {
width: 280px;
margin: 0;
}
.tasks-action-btn {
margin: 0;
}
}
.alert {
src/app/tasks/checker-inbox-and-tasks-tabs/loan-disbursal/loan-disbursal.component.html
+18 -15
View File
@@ -8,21 +8,24 @@
@if (loans && loans.length > 0) {
<div class="tab-container mat-typography">
<div class="layout-row align-start-center">
<div class="search-box flex-40">
<mat-form-field class="flex-fill flex-90">
<input
matInput
placeholder="{{ 'labels.text.Filter by name' | translate }}"
(keyup)="applyFilter($event.target.value)"
/>
</mat-form-field>
</div>
<div class="flex-60">
<button mat-raised-button color="success" *mifosxHasPermission="'APPROVE_LOAN'" (click)="disburseLoan()">
<fa-icon icon="check" class="m-r-10"></fa-icon>{{ 'labels.menus.Disburse' | translate }}
</button>
</div>
<div class="tasks-header">
<mat-form-field class="tasks-search-field">
<input
#filterInput
matInput
placeholder="{{ 'labels.text.Filter by name' | translate }}"
(keyup)="applyFilter(filterInput.value)"
/>
</mat-form-field>
<button
mat-raised-button
color="success"
*mifosxHasPermission="'APPROVE_LOAN'"
(click)="disburseLoan()"
class="tasks-action-btn"
>
<fa-icon icon="check" class="m-r-10"></fa-icon>{{ 'labels.menus.Disburse' | translate }}
</button>
</div>
<table mat-table [dataSource]="dataSource">
<ng-container matColumnDef="select">
src/app/tasks/checker-inbox-and-tasks-tabs/loan-disbursal/loan-disbursal.component.scss
+44
View File
@@ -10,6 +10,34 @@
padding: 1%;
margin: 1%;
::ng-deep mat-form-field {
.mat-mdc-form-field-subscript-wrapper {
height: 0;
min-height: 0;
}
.mat-mdc-text-field-wrapper {
margin-bottom: 0;
}
.mat-mdc-form-field-infix {
padding-top: 8px;
padding-bottom: 8px;
min-height: 48px;
}
input {
height: 48px;
}
}
button.mat-mdc-raised-button {
height: 48px;
line-height: 48px;
padding: 0 16px;
min-height: 48px;
}
.mat-raised-button.mat-success {
color: #fff;
background-color: #008000ab;
@@ -18,6 +46,22 @@
.view-details {
cursor: pointer;
}
.tasks-header {
display: flex;
align-items: center;
gap: 8px;
margin-bottom: 16px;
}
.tasks-search-field {
width: 280px;
margin: 0;
}
.tasks-action-btn {
margin: 0;
}
}
.alert {
src/app/tasks/checker-inbox-and-tasks-tabs/reschedule-loan/reschedule-loan.component.html
+28 -29
View File
@@ -8,34 +8,33 @@
@if (loans && loans.length > 0) {
<div class="tab-container mat-typography">
<div class="layout-row align-start-center">
<div class="search-box flex-40">
<mat-form-field class="flex-90">
<input
matInput
placeholder="{{ 'labels.text.Filter by name' | translate }}"
(keyup)="applyFilter($event.target.value)"
/>
</mat-form-field>
</div>
<div class="flex-60">
<button
mat-raised-button
color="success"
*mifosxHasPermission="'APPROVE_LOANRESCHEDULE'"
(click)="bulkLoanReschedule('Approve')"
>
<fa-icon icon="check" class="m-r-10"></fa-icon>{{ 'labels.buttons.Approve' | translate }}
</button>
<button
mat-raised-button
color="reject"
*mifosxHasPermission="'APPROVE_LOANRESCHEDULE'"
(click)="bulkLoanReschedule('Reject')"
>
<fa-icon icon="times" class="m-r-10"></fa-icon>{{ 'labels.buttons.Reject' | translate }}
</button>
</div>
<div class="tasks-header">
<mat-form-field class="tasks-search-field">
<input
#filterInput
matInput
placeholder="{{ 'labels.text.Filter by name' | translate }}"
(keyup)="applyFilter(filterInput.value)"
/>
</mat-form-field>
<button
mat-raised-button
color="success"
*mifosxHasPermission="'APPROVE_LOANRESCHEDULE'"
(click)="bulkLoanReschedule('Approve')"
class="tasks-action-btn"
>
<fa-icon icon="check" class="m-r-10"></fa-icon>{{ 'labels.buttons.Approve' | translate }}
</button>
<button
mat-raised-button
color="reject"
*mifosxHasPermission="'APPROVE_LOANRESCHEDULE'"
(click)="bulkLoanReschedule('Reject')"
class="tasks-action-btn"
>
<fa-icon icon="times" class="m-r-10"></fa-icon>{{ 'labels.buttons.Reject' | translate }}
</button>
</div>
<table mat-table [dataSource]="dataSource">
<ng-container matColumnDef="select">
@@ -98,7 +97,7 @@
</div>
}
@if (loans.length === 0) {
@if (loans?.length === 0) {
<div class="alert">
<div class="message">
<i class="fa fa-exclamation-circle alert-check"></i>
src/app/tasks/checker-inbox-and-tasks-tabs/reschedule-loan/reschedule-loan.component.scss
+44
View File
@@ -10,6 +10,34 @@
padding: 1%;
margin: 1%;
::ng-deep mat-form-field {
.mat-mdc-form-field-subscript-wrapper {
height: 0;
min-height: 0;
}
.mat-mdc-text-field-wrapper {
margin-bottom: 0;
}
.mat-mdc-form-field-infix {
padding-top: 8px;
padding-bottom: 8px;
min-height: 48px;
}
input {
height: 48px;
}
}
button.mat-mdc-raised-button {
height: 48px;
line-height: 48px;
padding: 0 16px;
min-height: 48px;
}
.mat-raised-button.mat-success {
color: #fff;
background-color: #008000ab;
@@ -18,6 +46,22 @@
.view-details {
cursor: pointer;
}
.tasks-header {
display: flex;
align-items: center;
gap: 8px;
margin-bottom: 16px;
}
.tasks-search-field {
width: 280px;
margin: 0;
}
.tasks-action-btn {
margin: 0;
}
}
.alert {
src/app/tasks/checker-inbox-and-tasks/checker-inbox-and-tasks.component.html
+2
View File
@@ -9,6 +9,8 @@
<div class="container">
<mat-card class="tasks-card">
<mat-card-content>
<div class="card-heading">{{ 'labels.heading.Pending Tasks' | translate }}</div>
<mat-divider></mat-divider>
<nav mat-tab-nav-bar class="navigation-tabs" [tabPanel]="tabPanel">
<a
mat-tab-link
src/app/tasks/checker-inbox-and-tasks/checker-inbox-and-tasks.component.scss
+11
View File
@@ -5,3 +5,14 @@
* 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/.
*/
.card-heading {
font-size: 20px;
font-weight: 500;
color: #333;
margin-bottom: 16px;
}
mat-divider {
margin-bottom: 16px;
}
src/app/tasks/checker-inbox-and-tasks/checker-inbox-and-tasks.component.ts
+3 -1
View File
@@ -9,6 +9,7 @@
/** Angular Imports */
import { Component } from '@angular/core';
import { MatTabNav, MatTabLink, MatTabNavPanel } from '@angular/material/tabs';
import { MatDivider } from '@angular/material/divider';
import { RouterLinkActive, RouterLink, RouterOutlet } from '@angular/router';
import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
@@ -25,7 +26,8 @@ import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
MatTabLink,
RouterLinkActive,
MatTabNavPanel,
RouterOutlet
RouterOutlet,
MatDivider
]
})
export class CheckerInboxAndTasksComponent {
src/app/tasks/tasks.service.ts
+13 -5
View File
@@ -44,14 +44,14 @@ export class TasksService {
* Get Maker Checker Template
*/
getMakerCheckerTemplate(): Observable<any> {
return this.http.get('/makercheckers');
return this.http.get('/makercheckers/searchtemplate');
}
/**
* Get Grouped Clients Data
*/
getGroupedClientsData(): Observable<any> {
const httpParams = new HttpParams().set('limit', '1000').set('status', 'PENDING');
const httpParams = new HttpParams().set('limit', '1000').set('status', 'pending');
return this.http.get('/clients', { params: httpParams });
}
@@ -66,18 +66,26 @@ export class TasksService {
* Get all loans to be approved
*/
getAllLoansToBeApproved(): Observable<any> {
const httpParams = new HttpParams().set('limit', '1000').set('status', '100');
const httpParams = new HttpParams().set('limit', '1000').set('sqlSearch', 'l.loan_status_id in (100,200)');
return this.http.get('/loans', { params: httpParams });
}
/**
* Get all loans to be created
* Get all loans to be disbursed
*/
getAllLoansToBeDisbursed(): Observable<any> {
const httpParams = new HttpParams().set('limit', '1000').set('status', '200');
const httpParams = new HttpParams().set('limit', '1000').set('sqlSearch', 'l.loan_status_id in (200)');
return this.http.get('/loans', { params: httpParams });
}
/**
* Get all savings accounts to be approved
*/
getAllSavingsToBeApproved(): Observable<any> {
const httpParams = new HttpParams().set('limit', '1000').set('sqlSearch', 's.status_enum in (100,200)');
return this.http.get('/savingsaccounts', { params: httpParams });
}
/**
* Get Loans Locked Data using pages and limit
*/