Ankit | Test | View financial reports of multiple company together with currency filter

apps/web-giddh/src/app/app.routes.ts

@@ -100,6 +100,7 @@ export const ROUTES: Routes = [
             { path: 'vouchers', loadChildren: () => import('./vouchers/vouchers.module').then(module => module.VouchersModule), canActivate: [NeedsAuthorization] },
             { path: 'group-name', loadChildren: () => import('./group-name/group-name.module').then(module => module.GroupNameModule), canActivate: [NeedsAuthorization] },
             { path: 'auth-hmrc', loadChildren: () => import('./auth-hmrc/auth-hmrc.module').then(module => module.AuthHMRCModule), canActivate: [NeedsAuthorization] },
+            { path: 'multi-currency-report', loadChildren: () => import('./multi-currency-reports/multi-currency-reports.module').then(module => module.MultiCurrencyReportsModule), canActivate: [NeedsAuthorization] },
             { path: '**', redirectTo: 'home', pathMatch: 'full' }
         ]
     },

apps/web-giddh/src/app/financial-reports/financial-reports.module.ts

@@ -68,7 +68,6 @@ import { AccountsFilterPipe } from './pipes/accounts-filter.pipe';
         BalanceSheetGridComponent,
         BalanceSheetGridRowComponent,
         FinancialAccordionDirective,
-        FinancialSearchPipe,
         AccountsFilterPipe
     ],
     exports: [
@@ -102,7 +101,8 @@ import { AccountsFilterPipe } from './pipes/accounts-filter.pipe';
         AmountFieldComponentModule,
         DatepickerWrapperModule,
         PopoverModule.forRoot(),
-        AsideMenuAccountModule
+        AsideMenuAccountModule,
+        FinancialSearchPipe
     ],
 })
 export class FinancialReportsModule {

apps/web-giddh/src/app/multi-currency-reports/balance-sheet/balance-sheet-report.component.html

@@ -0,0 +1,32 @@
+<ng-container
+    appTranslate
+    [file]="'trial-profit-balance/balance-sheet'"
+    (localeData)="localeData = $event"
+    (commonLocaleData)="commonLocaleData = $event"
+>
+    <filter-multi-currency
+        #filter
+        (filterValue)="searchData($event)"
+        (onPropertyChanged)="filterData()"
+        (lastSyncDate)="lastDate($event)"
+        (searchChange)="searchChanged($event)"
+        (expandAllChange)="expandAllEvent()"
+        [(expandAll)]="expandAll"
+    ></filter-multi-currency>
+    <giddh-page-loader *ngIf="showLoader | async" [cssClass]="'mt-0 mb-0'"></giddh-page-loader>
+    <div *ngIf="!(showLoader | async) && data">
+        <balance-sheet-report-grid
+            #bsGrid
+            [search]="search"
+            [from]="from"
+            [to]="to"
+            (searchChange)="searchChanged($event)"
+            [expandAll]="expandAll"
+            [bsData]="data"
+            [lastSyncDate]="lastSyncDate"
+        ></balance-sheet-report-grid>
+    </div>
+    <div *ngIf="!(showLoader | async) && !data" class="text-center tb-pl-bs-data">
+        <h2>{{ localeData?.no_data_found }}</h2>
+    </div>
+</ng-container>

apps/web-giddh/src/app/multi-currency-reports/balance-sheet/balance-sheet-report.component.ts

@@ -0,0 +1,182 @@
+import {
+    AfterViewInit,
+    ChangeDetectionStrategy,
+    ChangeDetectorRef,
+    Component,
+    Input,
+    OnDestroy,
+    ViewChild,
+} from '@angular/core';
+import { Observable, ReplaySubject } from 'rxjs';
+import { takeUntil } from 'rxjs/operators';
+import { BalanceSheetData, ProfitLossRequest } from '../../models/api-models/tb-pl-bs';
+import { BalanceSheetReportGridComponent } from './components/balance-sheet-grid/balance-sheet-report-grid.component';
+import { cloneDeep } from '../../lodash-optimized';
+import { Account, ChildGroup } from '../../models/api-models/Search';
+import { ReportType } from '../multi-currency.const';
+import { MultiCurrencyReportsComponentStore } from '../multi-currency-reports.store';
+import { prepareBalanceSheetData } from '../../store/tl-pl/tl-pl.reducer';
+
+@Component({
+    selector: 'balance-sheet-report',
+    templateUrl: './balance-sheet-report.component.html',
+    changeDetection: ChangeDetectionStrategy.OnPush,
+    providers: [MultiCurrencyReportsComponentStore]
+})
+export class BalanceSheetReportComponent implements AfterViewInit, OnDestroy {
+    /** Reference to the balance sheet grid component */
+    @ViewChild('bsGrid', { static: true }) public bsGrid: BalanceSheetReportGridComponent;
+    /** Indicates whether a date has been selected */
+    @Input() public isDateSelected: boolean = false;
+    /** Holds the local JSON data */
+    public localeData: any = {};
+    /** Holds the common JSON data */
+    public commonLocaleData: any = {};
+    /** Observable to indicate if the loader is visible */
+    public showLoader: Observable<boolean> = this.componentStore.inProgressReport$;;
+    /** Stores the balance sheet data */
+    public data: BalanceSheetData;
+    /** Stores the profit and loss request parameters */
+    public request: ProfitLossRequest;
+    /** Indicates whether all items are expanded */
+    public expandAll: boolean;
+    /** Holds the search text */
+    public search: string;
+    /** Stores the start date of the range */
+    public from: string;
+    /** Stores the end date of the range */
+    public to: string;
+    /** Stores the last sync date */
+    public lastSyncDate: string = "";
+    /** Subject to handle component destruction */
+    private destroyed$: ReplaySubject<boolean> = new ReplaySubject(1);
+
+    constructor(private changeDetectionRef: ChangeDetectorRef, private componentStore: MultiCurrencyReportsComponentStore) {
+        this.componentStore.reportDataList$.pipe(takeUntil(this.destroyed$)).subscribe((response) => {
+            if (response) {
+                let data = prepareBalanceSheetData(cloneDeep(response));
+                if (data && data.liabilities) {
+                    this.initData(data.liabilities);
+                    data.liabilities.forEach(childGroup => {
+                        childGroup['isVisible'] = true;
+                        childGroup['isCreated'] = true;
+                        childGroup['isIncludedInSearch'] = true;
+                    });
+                }
+                if (data && data.assets) {
+                    this.initData(data.assets);
+                    data.assets.forEach(childGroup => {
+                        childGroup['isVisible'] = true;
+                        childGroup['isCreated'] = true;
+                        childGroup['isIncludedInSearch'] = true;
+                    });
+                }
+                this.data = data;
+                this.changeDetectionRef.detectChanges();
+            } else {
+                this.data = null;
+            }
+        });
+    }
+
+    /**
+     * Initializes data for the balance sheet groups
+     * @returns {void}
+     * @param {ChildGroup[]} groupList The list of child groups
+     * @memberof BalanceSheetReportComponent
+     */
+    public initData(groupList: ChildGroup[]): void {
+        groupList.forEach((childGroup: ChildGroup) => {
+            childGroup['isVisible'] = false;
+            childGroup['isCreated'] = false;
+            childGroup['isIncludedInSearch'] = true;
+            childGroup.accounts.forEach((account: Account) => {
+                account['isIncludedInSearch'] = true;
+                account['isCreated'] = false;
+                account['isVisible'] = false;
+            });
+            if (childGroup.childGroups) {
+                this.initData(childGroup.childGroups);
+            }
+        });
+    }
+
+    /**
+     * Detects changes after the view is initialized
+     *
+     * @returns {void}
+     * @memberof BalanceSheetReportComponent
+     */
+    public ngAfterViewInit(): void {
+        this.changeDetectionRef.detectChanges();
+    }
+
+    /**
+     * Filters data based on the given request
+     *
+     * @returns {void}
+     * @memberof BalanceSheetReportComponent
+     */
+    public filterData(): void {
+        this.componentStore.getMultiCurrencyReport(ReportType.BalanceSheet);
+    }
+    /**
+     * Updates the last sync date
+     *
+     * @param {any} event The event containing the sync date
+     * @returns {void}
+     * @memberof BalanceSheetReportComponent
+     */
+    public lastDate(event: any): void {
+        this.lastSyncDate = event;
+    }
+
+    /**
+     * Searches and updates data based on the provided criteria
+     *
+     * @returns {void}
+     * @param {any} event The event containing search criteria
+     * @memberof BalanceSheetReportComponent
+     */
+    public searchData(event: any): void {
+        this.componentStore.creatMultiCurrencyReport({ reportType: ReportType.BalanceSheet, payload: event });
+    }
+
+    /**
+     * Cleans up resources when the component is destroyed
+     * @returns {void}
+     * @memberof BalanceSheetReportComponent
+     */
+    public ngOnDestroy(): void {
+        this.destroyed$.next(true);
+        this.destroyed$.complete();
+    }
+
+    /**
+     * Expands all items in the balance sheet
+     *
+     * @returns {void}
+     * @memberof BalanceSheetReportComponent
+     */
+    public expandAllEvent(): void {
+        setTimeout(() => {
+            this.changeDetectionRef.detectChanges();
+        }, 1);
+    }
+
+    /**
+     * Updates the search text and handles search functionality
+     *
+     * @returns {void}
+     * @param {string} event The new search text
+     * @memberof BalanceSheetReportComponent
+     */
+    public searchChanged(event: string): void {
+        this.search = event;
+        if (!this.search) {
+            this.expandAll = false;
+        }
+        this.changeDetectionRef.detectChanges();
+    }
+
+}