feat: non-individual entity UI improvements — hide individual-only sections, fix legal form display, send extended fields to API
- Hide Family Members tab/section for non-individual entities in client view, create flow, and preview - Hide Financial & Classification section for non-individual entities in personal data and preview - Fix legal form column in clients list — fetch legalForm from client API for correct display - Add person/business icon before client name in list rows - Remove unsupportedNpd filter — send authorizedSignatory, additionalInfo, dateOfRegistration to API - Add registration number format hint (mat-hint) based on constitution type - Add spacing between verification row and constitution type dropdowns - Reduce table cell padding and prevent action buttons from being clipped - Add missing MPL-2.0 license headers Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Aditya
co-authored by
Claude Opus 4.6
Claude Opus 4.6
parent
ab01111424
commit
b890d24bb7
@@ -6,347 +6,186 @@
|
||||
file, You can obtain one at http://mozilla.org/MPL/2.0/.
|
||||
-->
|
||||
|
||||
<!-- TODO: Refactor Permissions -->
|
||||
<div class="container">
|
||||
<mat-card>
|
||||
<div class="layout-row responsive-column gap-20px">
|
||||
<div class="flex-50">
|
||||
<mat-nav-list>
|
||||
<mat-list-item *mifosxHasPermission="'READ_OFFICE'">
|
||||
<mat-icon matListIcon [routerLink]="['Offices']">
|
||||
<fa-icon icon="building" size="sm"></fa-icon>
|
||||
</mat-icon>
|
||||
<h4 matLine [routerLink]="['Offices']">{{ 'labels.heading.Offices' | translate }}</h4>
|
||||
@if (!arrowBooleans[0]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(0)" icon="arrow-down" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[0]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(0)" icon="arrow-up" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[0]) {
|
||||
<p matLine [routerLink]="['Offices']">
|
||||
{{ 'labels.text.Download, Upload Offices Template' | translate }}
|
||||
</p>
|
||||
}
|
||||
</mat-list-item>
|
||||
|
||||
<mat-list-item *mifosxHasPermission="'READ_OFFICE'">
|
||||
<mat-icon matListIcon [routerLink]="['Users']">
|
||||
<fa-icon icon="user" size="sm"></fa-icon>
|
||||
</mat-icon>
|
||||
<h4 matLine [routerLink]="['Users']">{{ 'labels.heading.Users' | translate }}</h4>
|
||||
@if (!arrowBooleans[1]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(1)" icon="arrow-down" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[1]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(1)" icon="arrow-up" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[1]) {
|
||||
<p matLine [routerLink]="['Users']">
|
||||
{{ 'labels.text.Download offices template and Upload office excel files' | translate }}
|
||||
</p>
|
||||
}
|
||||
</mat-list-item>
|
||||
|
||||
<mat-list-item *mifosxHasPermission="'READ_OFFICE'">
|
||||
<mat-icon matListIcon [routerLink]="['Groups']">
|
||||
<fa-icon icon="users" size="sm"></fa-icon>
|
||||
</mat-icon>
|
||||
<h4 matLine [routerLink]="['Groups']">{{ 'labels.heading.Groups' | translate }}</h4>
|
||||
@if (!arrowBooleans[2]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(2)" icon="arrow-down" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[2]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(2)" icon="arrow-up" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[2]) {
|
||||
<p matLine [routerLink]="['Groups']">
|
||||
{{ 'labels.text.Download groups template and Upload group excel files' | translate }}
|
||||
</p>
|
||||
}
|
||||
</mat-list-item>
|
||||
|
||||
<mat-list-item *mifosxHasPermission="'READ_OFFICE'">
|
||||
<mat-icon matListIcon [routerLink]="['Loan Accounts']">
|
||||
<fa-icon icon="money-bill-alt" size="sm"></fa-icon>
|
||||
</mat-icon>
|
||||
<h4 matLine [routerLink]="['Loan Accounts']">{{ 'labels.heading.Loan Accounts' | translate }}</h4>
|
||||
@if (!arrowBooleans[3]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(3)" icon="arrow-down" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[3]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(3)" icon="arrow-up" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[3]) {
|
||||
<p matLine [routerLink]="['Loan Accounts']">
|
||||
{{ 'labels.text.Download loan accounts template and upload loan account excel files' | translate }}
|
||||
</p>
|
||||
}
|
||||
</mat-list-item>
|
||||
|
||||
<mat-list-item *mifosxHasPermission="'READ_OFFICE'">
|
||||
<mat-icon matListIcon [routerLink]="['Savings Accounts']">
|
||||
<fa-icon icon="briefcase" size="sm"></fa-icon>
|
||||
</mat-icon>
|
||||
<h4 matLine [routerLink]="['Savings Accounts']">{{ 'labels.heading.Savings Accounts' | translate }}</h4>
|
||||
@if (!arrowBooleans[4]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(4)" icon="arrow-down" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[4]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(4)" icon="arrow-up" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[4]) {
|
||||
<p matLine [routerLink]="['Savings Accounts']">
|
||||
{{
|
||||
'labels.text.Download savings accounts template and upload savings account excel files' | translate
|
||||
}}
|
||||
</p>
|
||||
}
|
||||
</mat-list-item>
|
||||
|
||||
<mat-list-item *mifosxHasPermission="'READ_OFFICE'">
|
||||
<mat-icon matListIcon [routerLink]="['Fixed Deposit Accounts']">
|
||||
<fa-icon icon="briefcase" size="sm"></fa-icon>
|
||||
</mat-icon>
|
||||
<h4 matLine [routerLink]="['Fixed Deposit Accounts']">
|
||||
{{ 'labels.heading.Fixed Deposit Accounts' | translate }}
|
||||
</h4>
|
||||
@if (!arrowBooleans[5]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(5)" icon="arrow-down" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[5]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(5)" icon="arrow-up" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[5]) {
|
||||
<p matLine [routerLink]="['Fixed Deposit Accounts']">
|
||||
{{
|
||||
'labels.text.Download fixed deposit accounts template and upload fixed deposit account excel files'
|
||||
| translate
|
||||
}}
|
||||
</p>
|
||||
}
|
||||
</mat-list-item>
|
||||
|
||||
<mat-list-item *mifosxHasPermission="'READ_OFFICE'">
|
||||
<mat-icon matListIcon [routerLink]="['Chart of Accounts']">
|
||||
<fa-icon icon="money-bill-alt" size="sm"></fa-icon>
|
||||
</mat-icon>
|
||||
<h4 matLine [routerLink]="['Chart of Accounts']">{{ 'labels.heading.Chart of Accounts' | translate }}</h4>
|
||||
@if (!arrowBooleans[6]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(6)" icon="arrow-down" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[6]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(6)" icon="arrow-up" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[6]) {
|
||||
<p matLine [routerLink]="['Chart of Accounts']">
|
||||
{{
|
||||
'labels.text.Download chart of accounts template and upload chart of account excel files' | translate
|
||||
}}
|
||||
</p>
|
||||
}
|
||||
</mat-list-item>
|
||||
|
||||
<mat-list-item *mifosxHasPermission="'READ_OFFICE'">
|
||||
<mat-icon matListIcon [routerLink]="['Share Accounts']">
|
||||
<fa-icon icon="briefcase" size="sm"></fa-icon>
|
||||
</mat-icon>
|
||||
<h4 matLine [routerLink]="['Share Accounts']">{{ 'labels.heading.Share Accounts' | translate }}</h4>
|
||||
@if (!arrowBooleans[7]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(7)" icon="arrow-down" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[7]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(7)" icon="arrow-up" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[7]) {
|
||||
<p matLine [routerLink]="['Share Accounts']">
|
||||
{{ 'labels.text.Download share accounts template and upload share account excel files' | translate }}
|
||||
</p>
|
||||
}
|
||||
</mat-list-item>
|
||||
</mat-nav-list>
|
||||
</div>
|
||||
|
||||
<div class="flex-50">
|
||||
<mat-nav-list>
|
||||
<mat-list-item *mifosxHasPermission="'READ_OFFICE'">
|
||||
<mat-icon matListIcon [routerLink]="['Employees']">
|
||||
<fa-icon icon="user" size="sm"></fa-icon>
|
||||
</mat-icon>
|
||||
<h4 matLine [routerLink]="['Employees']">{{ 'labels.heading.Employees' | translate }}</h4>
|
||||
@if (!arrowBooleans[8]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(8)" icon="arrow-down" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[8]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(8)" icon="arrow-up" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[8]) {
|
||||
<p matLine [routerLink]="['Employees']">
|
||||
{{ 'labels.text.Download loan accounts template and upload loan account excel files' | translate }}
|
||||
</p>
|
||||
}
|
||||
</mat-list-item>
|
||||
|
||||
<mat-list-item *mifosxHasPermission="'READ_OFFICE'">
|
||||
<mat-icon matListIcon [routerLink]="['Clients']">
|
||||
<fa-icon icon="user" size="sm"></fa-icon>
|
||||
</mat-icon>
|
||||
<h4 matLine [routerLink]="['Clients']">{{ 'labels.heading.Clients' | translate }}</h4>
|
||||
@if (!arrowBooleans[9]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(9)" icon="arrow-down" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[9]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(9)" icon="arrow-up" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[9]) {
|
||||
<p matLine [routerLink]="['Clients']">
|
||||
{{ 'labels.text.Download clients template and upload clients excel files' | translate }}
|
||||
</p>
|
||||
}
|
||||
</mat-list-item>
|
||||
|
||||
<mat-list-item *mifosxHasPermission="'READ_OFFICE'">
|
||||
<mat-icon matListIcon [routerLink]="['Centers']">
|
||||
<fa-icon icon="users" size="sm"></fa-icon>
|
||||
</mat-icon>
|
||||
<h4 matLine [routerLink]="['Centers']">{{ 'labels.heading.Centers' | translate }}</h4>
|
||||
@if (!arrowBooleans[10]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(10)" icon="arrow-down" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[10]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(10)" icon="arrow-up" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[10]) {
|
||||
<p matLine [routerLink]="['Centers']">
|
||||
{{ 'labels.text.Download centers template and upload centers excel files' | translate }}
|
||||
</p>
|
||||
}
|
||||
</mat-list-item>
|
||||
|
||||
<mat-list-item *mifosxHasPermission="'READ_OFFICE'">
|
||||
<mat-icon matListIcon [routerLink]="['Loan Repayments']">
|
||||
<fa-icon icon="briefcase" size="sm"></fa-icon>
|
||||
</mat-icon>
|
||||
<h4 matLine [routerLink]="['Loan Repayments']">{{ 'labels.heading.Loan Repayments' | translate }}</h4>
|
||||
@if (!arrowBooleans[11]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(11)" icon="arrow-down" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[11]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(11)" icon="arrow-up" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[11]) {
|
||||
<p matLine [routerLink]="['Loan Repayments']">
|
||||
{{ 'labels.text.Download loan repayments template and upload loan repayment excel files' | translate }}
|
||||
</p>
|
||||
}
|
||||
</mat-list-item>
|
||||
|
||||
<mat-list-item *mifosxHasPermission="'READ_OFFICE'">
|
||||
<mat-icon matListIcon [routerLink]="['Savings Transactions']">
|
||||
<fa-icon icon="briefcase" size="sm"></fa-icon>
|
||||
</mat-icon>
|
||||
<h4 matLine [routerLink]="['Savings Transactions']">
|
||||
{{ 'labels.heading.Savings Transactions' | translate }}
|
||||
</h4>
|
||||
@if (!arrowBooleans[12]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(12)" icon="arrow-down" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[12]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(12)" icon="arrow-up" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[12]) {
|
||||
<p matLine [routerLink]="['Savings Transactions']">
|
||||
{{
|
||||
'labels.text.Download savings transactions template and upload savings transaction excel files'
|
||||
| translate
|
||||
}}
|
||||
</p>
|
||||
}
|
||||
</mat-list-item>
|
||||
|
||||
<mat-list-item *mifosxHasPermission="'READ_OFFICE'">
|
||||
<mat-icon matListIcon [routerLink]="['Fixed Deposit Transactions']">
|
||||
<fa-icon icon="briefcase" size="sm"></fa-icon>
|
||||
</mat-icon>
|
||||
<h4 matLine [routerLink]="['Fixed Deposit Transactions']">
|
||||
{{ 'labels.heading.Fixed Deposit Transactions' | translate }}
|
||||
</h4>
|
||||
@if (!arrowBooleans[13]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(13)" icon="arrow-down" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[13]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(13)" icon="arrow-up" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[13]) {
|
||||
<p matLine [routerLink]="['Fixed Deposit Transactions']">
|
||||
{{
|
||||
'labels.text.Download fixed deposit transactions template and upload fixed deposit transaction excel files'
|
||||
| translate
|
||||
}}
|
||||
</p>
|
||||
}
|
||||
</mat-list-item>
|
||||
|
||||
<mat-list-item *mifosxHasPermission="'READ_OFFICE'">
|
||||
<mat-icon matListIcon [routerLink]="['Recurring Deposit Transactions']">
|
||||
<fa-icon icon="briefcase" size="sm"></fa-icon>
|
||||
</mat-icon>
|
||||
<h4 matLine [routerLink]="['Recurring Deposit Transactions']">
|
||||
{{ 'labels.heading.Recurring Deposit Transactions' | translate }}
|
||||
</h4>
|
||||
@if (!arrowBooleans[14]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(14)" icon="arrow-down" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[14]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(14)" icon="arrow-up" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[14]) {
|
||||
<p matLine [routerLink]="['Recurring Deposit Transactions']">
|
||||
{{
|
||||
'labels.text.Download recurring deposit transactions template and upload recurring deposit transaction excel files'
|
||||
| translate
|
||||
}}
|
||||
</p>
|
||||
}
|
||||
</mat-list-item>
|
||||
|
||||
<mat-list-item *mifosxHasPermission="'READ_OFFICE'">
|
||||
<mat-icon matListIcon [routerLink]="['Journal Entries']">
|
||||
<fa-icon icon="chevron-right" size="sm"></fa-icon>
|
||||
</mat-icon>
|
||||
<h4 matLine [routerLink]="['Journal Entries']">{{ 'labels.heading.Journal Entries' | translate }}</h4>
|
||||
@if (!arrowBooleans[15]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(15)" icon="arrow-down" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[15]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(15)" icon="arrow-up" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[15]) {
|
||||
<p matLine [routerLink]="['Journal Entries']">
|
||||
{{ 'labels.text.Download journal entries template and upload journal entries excel files' | translate }}
|
||||
</p>
|
||||
}
|
||||
</mat-list-item>
|
||||
|
||||
<mat-list-item *mifosxHasPermission="'READ_OFFICE'">
|
||||
<mat-icon matListIcon [routerLink]="['Guarantors']">
|
||||
<fa-icon icon="chevron-right" size="sm"></fa-icon>
|
||||
</mat-icon>
|
||||
<h4 matLine [routerLink]="['Guarantors']">{{ 'labels.heading.Guarantors' | translate }}</h4>
|
||||
@if (!arrowBooleans[16]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(16)" icon="arrow-down" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[16]) {
|
||||
<fa-icon (click)="arrowBooleansToggle(16)" icon="arrow-up" size="md"></fa-icon>
|
||||
}
|
||||
@if (arrowBooleans[16]) {
|
||||
<p matLine [routerLink]="['Guarantors']">
|
||||
{{ 'labels.text.Download guarantors template and upload guarantor excel files' | translate }}
|
||||
</p>
|
||||
}
|
||||
</mat-list-item>
|
||||
</mat-nav-list>
|
||||
</div>
|
||||
<div class="org-container">
|
||||
<div class="org-header">
|
||||
<div class="org-header__icon"><i class="fas fa-upload"></i></div>
|
||||
<div>
|
||||
<h1 class="org-header__title">{{ 'labels.heading.Bulk Import' | translate }}</h1>
|
||||
<p class="org-header__sub">Download templates and upload excel files for bulk data import</p>
|
||||
</div>
|
||||
</mat-card>
|
||||
</div>
|
||||
|
||||
<div class="org-grid">
|
||||
|
||||
<!-- Offices -->
|
||||
<a class="org-card" [routerLink]="['Offices']" *mifosxHasPermission="'READ_OFFICE'">
|
||||
<div class="org-card__icon org-card__icon--blue"><i class="fas fa-building"></i></div>
|
||||
<div class="org-card__body">
|
||||
<h3 class="org-card__title">{{ 'labels.heading.Offices' | translate }}</h3>
|
||||
<p class="org-card__desc">{{ 'labels.text.Download, Upload Offices Template' | translate }}</p>
|
||||
</div>
|
||||
<i class="fas fa-chevron-right org-card__arrow"></i>
|
||||
</a>
|
||||
|
||||
<!-- Users -->
|
||||
<a class="org-card" [routerLink]="['Users']" *mifosxHasPermission="'READ_OFFICE'">
|
||||
<div class="org-card__icon org-card__icon--purple"><i class="fas fa-user"></i></div>
|
||||
<div class="org-card__body">
|
||||
<h3 class="org-card__title">{{ 'labels.heading.Users' | translate }}</h3>
|
||||
<p class="org-card__desc">{{ 'labels.text.Download offices template and Upload office excel files' | translate }}</p>
|
||||
</div>
|
||||
<i class="fas fa-chevron-right org-card__arrow"></i>
|
||||
</a>
|
||||
|
||||
<!-- Groups -->
|
||||
<a class="org-card" [routerLink]="['Groups']" *mifosxHasPermission="'READ_OFFICE'">
|
||||
<div class="org-card__icon org-card__icon--green"><i class="fas fa-users"></i></div>
|
||||
<div class="org-card__body">
|
||||
<h3 class="org-card__title">{{ 'labels.heading.Groups' | translate }}</h3>
|
||||
<p class="org-card__desc">{{ 'labels.text.Download groups template and Upload group excel files' | translate }}</p>
|
||||
</div>
|
||||
<i class="fas fa-chevron-right org-card__arrow"></i>
|
||||
</a>
|
||||
|
||||
<!-- Loan Accounts -->
|
||||
<a class="org-card" [routerLink]="['Loan Accounts']" *mifosxHasPermission="'READ_OFFICE'">
|
||||
<div class="org-card__icon org-card__icon--orange"><i class="fas fa-money-bill-alt"></i></div>
|
||||
<div class="org-card__body">
|
||||
<h3 class="org-card__title">{{ 'labels.heading.Loan Accounts' | translate }}</h3>
|
||||
<p class="org-card__desc">{{ 'labels.text.Download loan accounts template and upload loan account excel files' | translate }}</p>
|
||||
</div>
|
||||
<i class="fas fa-chevron-right org-card__arrow"></i>
|
||||
</a>
|
||||
|
||||
<!-- Savings Accounts -->
|
||||
<a class="org-card" [routerLink]="['Savings Accounts']" *mifosxHasPermission="'READ_OFFICE'">
|
||||
<div class="org-card__icon org-card__icon--emerald"><i class="fas fa-briefcase"></i></div>
|
||||
<div class="org-card__body">
|
||||
<h3 class="org-card__title">{{ 'labels.heading.Savings Accounts' | translate }}</h3>
|
||||
<p class="org-card__desc">{{ 'labels.text.Download savings accounts template and upload savings account excel files' | translate }}</p>
|
||||
</div>
|
||||
<i class="fas fa-chevron-right org-card__arrow"></i>
|
||||
</a>
|
||||
|
||||
<!-- Fixed Deposit Accounts -->
|
||||
<a class="org-card" [routerLink]="['Fixed Deposit Accounts']" *mifosxHasPermission="'READ_OFFICE'">
|
||||
<div class="org-card__icon org-card__icon--teal"><i class="fas fa-briefcase"></i></div>
|
||||
<div class="org-card__body">
|
||||
<h3 class="org-card__title">{{ 'labels.heading.Fixed Deposit Accounts' | translate }}</h3>
|
||||
<p class="org-card__desc">{{ 'labels.text.Download fixed deposit accounts template and upload fixed deposit account excel files' | translate }}</p>
|
||||
</div>
|
||||
<i class="fas fa-chevron-right org-card__arrow"></i>
|
||||
</a>
|
||||
|
||||
<!-- Chart of Accounts -->
|
||||
<a class="org-card" [routerLink]="['Chart of Accounts']" *mifosxHasPermission="'READ_OFFICE'">
|
||||
<div class="org-card__icon org-card__icon--amber"><i class="fas fa-money-bill-alt"></i></div>
|
||||
<div class="org-card__body">
|
||||
<h3 class="org-card__title">{{ 'labels.heading.Chart of Accounts' | translate }}</h3>
|
||||
<p class="org-card__desc">{{ 'labels.text.Download chart of accounts template and upload chart of account excel files' | translate }}</p>
|
||||
</div>
|
||||
<i class="fas fa-chevron-right org-card__arrow"></i>
|
||||
</a>
|
||||
|
||||
<!-- Share Accounts -->
|
||||
<a class="org-card" [routerLink]="['Share Accounts']" *mifosxHasPermission="'READ_OFFICE'">
|
||||
<div class="org-card__icon org-card__icon--indigo"><i class="fas fa-briefcase"></i></div>
|
||||
<div class="org-card__body">
|
||||
<h3 class="org-card__title">{{ 'labels.heading.Share Accounts' | translate }}</h3>
|
||||
<p class="org-card__desc">{{ 'labels.text.Download share accounts template and upload share account excel files' | translate }}</p>
|
||||
</div>
|
||||
<i class="fas fa-chevron-right org-card__arrow"></i>
|
||||
</a>
|
||||
|
||||
<!-- Employees -->
|
||||
<a class="org-card" [routerLink]="['Employees']" *mifosxHasPermission="'READ_OFFICE'">
|
||||
<div class="org-card__icon org-card__icon--purple"><i class="fas fa-user"></i></div>
|
||||
<div class="org-card__body">
|
||||
<h3 class="org-card__title">{{ 'labels.heading.Employees' | translate }}</h3>
|
||||
<p class="org-card__desc">{{ 'labels.text.Download loan accounts template and upload loan account excel files' | translate }}</p>
|
||||
</div>
|
||||
<i class="fas fa-chevron-right org-card__arrow"></i>
|
||||
</a>
|
||||
|
||||
<!-- Clients -->
|
||||
<a class="org-card" [routerLink]="['Clients']" *mifosxHasPermission="'READ_OFFICE'">
|
||||
<div class="org-card__icon org-card__icon--cyan"><i class="fas fa-user"></i></div>
|
||||
<div class="org-card__body">
|
||||
<h3 class="org-card__title">{{ 'labels.heading.Clients' | translate }}</h3>
|
||||
<p class="org-card__desc">{{ 'labels.text.Download clients template and upload clients excel files' | translate }}</p>
|
||||
</div>
|
||||
<i class="fas fa-chevron-right org-card__arrow"></i>
|
||||
</a>
|
||||
|
||||
<!-- Centers -->
|
||||
<a class="org-card" [routerLink]="['Centers']" *mifosxHasPermission="'READ_OFFICE'">
|
||||
<div class="org-card__icon org-card__icon--green"><i class="fas fa-users"></i></div>
|
||||
<div class="org-card__body">
|
||||
<h3 class="org-card__title">{{ 'labels.heading.Centers' | translate }}</h3>
|
||||
<p class="org-card__desc">{{ 'labels.text.Download centers template and upload centers excel files' | translate }}</p>
|
||||
</div>
|
||||
<i class="fas fa-chevron-right org-card__arrow"></i>
|
||||
</a>
|
||||
|
||||
<!-- Loan Repayments -->
|
||||
<a class="org-card" [routerLink]="['Loan Repayments']" *mifosxHasPermission="'READ_OFFICE'">
|
||||
<div class="org-card__icon org-card__icon--rose"><i class="fas fa-briefcase"></i></div>
|
||||
<div class="org-card__body">
|
||||
<h3 class="org-card__title">{{ 'labels.heading.Loan Repayments' | translate }}</h3>
|
||||
<p class="org-card__desc">{{ 'labels.text.Download loan repayments template and upload loan repayment excel files' | translate }}</p>
|
||||
</div>
|
||||
<i class="fas fa-chevron-right org-card__arrow"></i>
|
||||
</a>
|
||||
|
||||
<!-- Savings Transactions -->
|
||||
<a class="org-card" [routerLink]="['Savings Transactions']" *mifosxHasPermission="'READ_OFFICE'">
|
||||
<div class="org-card__icon org-card__icon--emerald"><i class="fas fa-briefcase"></i></div>
|
||||
<div class="org-card__body">
|
||||
<h3 class="org-card__title">{{ 'labels.heading.Savings Transactions' | translate }}</h3>
|
||||
<p class="org-card__desc">{{ 'labels.text.Download savings transactions template and upload savings transaction excel files' | translate }}</p>
|
||||
</div>
|
||||
<i class="fas fa-chevron-right org-card__arrow"></i>
|
||||
</a>
|
||||
|
||||
<!-- Fixed Deposit Transactions -->
|
||||
<a class="org-card" [routerLink]="['Fixed Deposit Transactions']" *mifosxHasPermission="'READ_OFFICE'">
|
||||
<div class="org-card__icon org-card__icon--teal"><i class="fas fa-briefcase"></i></div>
|
||||
<div class="org-card__body">
|
||||
<h3 class="org-card__title">{{ 'labels.heading.Fixed Deposit Transactions' | translate }}</h3>
|
||||
<p class="org-card__desc">{{ 'labels.text.Download fixed deposit transactions template and upload fixed deposit transaction excel files' | translate }}</p>
|
||||
</div>
|
||||
<i class="fas fa-chevron-right org-card__arrow"></i>
|
||||
</a>
|
||||
|
||||
<!-- Recurring Deposit Transactions -->
|
||||
<a class="org-card" [routerLink]="['Recurring Deposit Transactions']" *mifosxHasPermission="'READ_OFFICE'">
|
||||
<div class="org-card__icon org-card__icon--amber"><i class="fas fa-briefcase"></i></div>
|
||||
<div class="org-card__body">
|
||||
<h3 class="org-card__title">{{ 'labels.heading.Recurring Deposit Transactions' | translate }}</h3>
|
||||
<p class="org-card__desc">{{ 'labels.text.Download recurring deposit transactions template and upload recurring deposit transaction excel files' | translate }}</p>
|
||||
</div>
|
||||
<i class="fas fa-chevron-right org-card__arrow"></i>
|
||||
</a>
|
||||
|
||||
<!-- Journal Entries -->
|
||||
<a class="org-card" [routerLink]="['Journal Entries']" *mifosxHasPermission="'READ_OFFICE'">
|
||||
<div class="org-card__icon org-card__icon--slate"><i class="fas fa-chevron-right"></i></div>
|
||||
<div class="org-card__body">
|
||||
<h3 class="org-card__title">{{ 'labels.heading.Journal Entries' | translate }}</h3>
|
||||
<p class="org-card__desc">{{ 'labels.text.Download journal entries template and upload journal entries excel files' | translate }}</p>
|
||||
</div>
|
||||
<i class="fas fa-chevron-right org-card__arrow"></i>
|
||||
</a>
|
||||
|
||||
<!-- Guarantors -->
|
||||
<a class="org-card" [routerLink]="['Guarantors']" *mifosxHasPermission="'READ_OFFICE'">
|
||||
<div class="org-card__icon org-card__icon--red"><i class="fas fa-chevron-right"></i></div>
|
||||
<div class="org-card__body">
|
||||
<h3 class="org-card__title">{{ 'labels.heading.Guarantors' | translate }}</h3>
|
||||
<p class="org-card__desc">{{ 'labels.text.Download guarantors template and upload guarantor excel files' | translate }}</p>
|
||||
</div>
|
||||
<i class="fas fa-chevron-right org-card__arrow"></i>
|
||||
</a>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -5,3 +5,212 @@
|
||||
* 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/.
|
||||
*/
|
||||
|
||||
$border: #e2e8f0;
|
||||
$gray-50: #f8fafc;
|
||||
$gray-100: #f1f5f9;
|
||||
$gray-400: #94a3b8;
|
||||
$gray-500: #64748b;
|
||||
$gray-700: #334155;
|
||||
$gray-900: #0f172a;
|
||||
|
||||
// ── Container ──
|
||||
.org-container {
|
||||
max-width: 1100px;
|
||||
margin: 0 auto;
|
||||
padding: 24px 20px;
|
||||
}
|
||||
|
||||
// ── Page Header ──
|
||||
.org-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
margin-bottom: 28px;
|
||||
|
||||
&__icon {
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
border-radius: 10px;
|
||||
background: linear-gradient(135deg, #0d3d78, #1a5276);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #fff;
|
||||
font-size: 18px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
&__title {
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
color: $gray-900;
|
||||
margin: 0;
|
||||
letter-spacing: -0.3px;
|
||||
}
|
||||
|
||||
&__sub {
|
||||
font-size: 13px;
|
||||
color: $gray-500;
|
||||
margin: 2px 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
// ── Card Grid ──
|
||||
.org-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
gap: 12px;
|
||||
|
||||
@media (max-width: 768px) {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
// ── Individual Card ──
|
||||
.org-card {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 14px;
|
||||
padding: 14px 16px;
|
||||
background: #fff;
|
||||
border: 1px solid $border;
|
||||
border-radius: 10px;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
transition: all 0.15s ease;
|
||||
|
||||
&:hover {
|
||||
border-color: #cbd5e1;
|
||||
background: $gray-50;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
|
||||
|
||||
.org-card__arrow {
|
||||
color: $gray-700;
|
||||
transform: translateX(2px);
|
||||
}
|
||||
}
|
||||
|
||||
&__icon {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 9px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 15px;
|
||||
flex-shrink: 0;
|
||||
|
||||
&--blue {
|
||||
background: rgba(59, 130, 246, 0.1);
|
||||
color: #2563eb;
|
||||
}
|
||||
|
||||
&--amber {
|
||||
background: rgba(245, 158, 11, 0.1);
|
||||
color: #d97706;
|
||||
}
|
||||
|
||||
&--green {
|
||||
background: rgba(34, 197, 94, 0.1);
|
||||
color: #16a34a;
|
||||
}
|
||||
|
||||
&--emerald {
|
||||
background: rgba(16, 185, 129, 0.1);
|
||||
color: #059669;
|
||||
}
|
||||
|
||||
&--purple {
|
||||
background: rgba(139, 92, 246, 0.1);
|
||||
color: #7c3aed;
|
||||
}
|
||||
|
||||
&--indigo {
|
||||
background: rgba(99, 102, 241, 0.1);
|
||||
color: #4f46e5;
|
||||
}
|
||||
|
||||
&--slate {
|
||||
background: rgba(100, 116, 139, 0.1);
|
||||
color: #475569;
|
||||
}
|
||||
|
||||
&--orange {
|
||||
background: rgba(249, 115, 22, 0.1);
|
||||
color: #ea580c;
|
||||
}
|
||||
|
||||
&--teal {
|
||||
background: rgba(20, 184, 166, 0.1);
|
||||
color: #0d9488;
|
||||
}
|
||||
|
||||
&--cyan {
|
||||
background: rgba(6, 182, 212, 0.1);
|
||||
color: #0891b2;
|
||||
}
|
||||
|
||||
&--rose {
|
||||
background: rgba(244, 63, 94, 0.1);
|
||||
color: #e11d48;
|
||||
}
|
||||
|
||||
&--red {
|
||||
background: rgba(239, 68, 68, 0.1);
|
||||
color: #dc2626;
|
||||
}
|
||||
}
|
||||
|
||||
&__body {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
&__title {
|
||||
font-size: 13.5px;
|
||||
font-weight: 600;
|
||||
color: $gray-900;
|
||||
margin: 0;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
&__desc {
|
||||
font-size: 11.5px;
|
||||
color: $gray-400;
|
||||
margin: 3px 0 0;
|
||||
line-height: 1.35;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
&__arrow {
|
||||
font-size: 11px;
|
||||
color: #cbd5e1;
|
||||
flex-shrink: 0;
|
||||
transition: all 0.15s ease;
|
||||
}
|
||||
}
|
||||
|
||||
// ── Dark mode ──
|
||||
:host-context(.dark-theme) {
|
||||
.org-header {
|
||||
&__title { color: #e2e8f0; }
|
||||
&__sub { color: #94a3b8; }
|
||||
}
|
||||
|
||||
.org-card {
|
||||
background: #1e1e1e;
|
||||
border-color: #333;
|
||||
|
||||
&:hover {
|
||||
background: #262626;
|
||||
border-color: #444;
|
||||
}
|
||||
|
||||
&__title { color: #e2e8f0; }
|
||||
&__desc { color: #64748b; }
|
||||
&__arrow { color: #444; }
|
||||
}
|
||||
}
|
||||
|
||||
@@ -8,10 +8,6 @@
|
||||
|
||||
/** Angular Imports */
|
||||
import { Component } from '@angular/core';
|
||||
import { MatNavList, MatListItem } from '@angular/material/list';
|
||||
import { MatIcon } from '@angular/material/icon';
|
||||
import { FaIconComponent } from '@fortawesome/angular-fontawesome';
|
||||
import { MatLine } from '@angular/material/grid-list';
|
||||
import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
|
||||
|
||||
/**
|
||||
@@ -22,27 +18,7 @@ import { STANDALONE_SHARED_IMPORTS } from 'app/standalone-shared.module';
|
||||
templateUrl: './bulk-import.component.html',
|
||||
styleUrls: ['./bulk-import.component.scss'],
|
||||
imports: [
|
||||
...STANDALONE_SHARED_IMPORTS,
|
||||
MatNavList,
|
||||
MatListItem,
|
||||
MatIcon,
|
||||
FaIconComponent,
|
||||
MatLine
|
||||
...STANDALONE_SHARED_IMPORTS
|
||||
]
|
||||
})
|
||||
export class BulkImportComponent {
|
||||
// Initialize an array of 17 boolean values, all set to false
|
||||
arrowBooleans: boolean[] = new Array(17).fill(false);
|
||||
|
||||
constructor() {}
|
||||
|
||||
/**
|
||||
* Popover function
|
||||
* @param arrowNumber - The index of the boolean value to toggle.
|
||||
*/
|
||||
|
||||
arrowBooleansToggle(arrowNumber: number) {
|
||||
// Toggle the boolean value at the given index
|
||||
this.arrowBooleans[arrowNumber] = !this.arrowBooleans[arrowNumber];
|
||||
}
|
||||
}
|
||||
export class BulkImportComponent {}
|
||||
|
||||
Reference in New Issue
Block a user