transaction-logs updated

transaction-logs updated, removed extra service file and matched architecture with other components
mazdak/UX-2025
Mazdak Gibran 3 weeks ago
parent 66c51a9e70
commit 8dd969fbf6

@ -1,71 +0,0 @@
import { Injectable } from '@angular/core';
import { BehaviorSubject, map, Observable } from 'rxjs';
import { URIKey } from '../../utils/uri-enums';
import { HttpErrorResponse, HttpParams } from '@angular/common/http';
import { HttpURIService } from '../../app.http.uri.service';
import { TransactionLog } from '../../models/user';
@Injectable({
providedIn: 'root'
})
export class TransactionLogService {
private logsSubject = new BehaviorSubject<TransactionLog[]>([]);
private currentPageSubject = new BehaviorSubject<number>(1);
private totalCountSubject = new BehaviorSubject<number>(0);
private itemsPerPageSubject = new BehaviorSubject<number>(5);
logs$ = this.logsSubject.asObservable();
currentPage$ = this.currentPageSubject.asObservable();
totalCount$ = this.totalCountSubject.asObservable();
itemsPerPage$ = this.itemsPerPageSubject.asObservable();
constructor(private httpUriService: HttpURIService) {}
loadLogs(): void {
const params = new HttpParams();
this.httpUriService
.requestGET<any>(URIKey.TRANSACTION_LOGS, params)
.subscribe({
next: (res) => {
const logs = Array.isArray(res) ? res : res?.data;
this.logsSubject.next(logs ?? []);
this.totalCountSubject.next(logs.length);
},
error: (err) => console.error(err)
});
}
setItemsPerPage(itemsPerPage: number): void {
this.itemsPerPageSubject.next(itemsPerPage);
this.currentPageSubject.next(1);
}
nextPage(): void {
const totalPages = this.getTotalPages();
const currentPage = this.currentPageSubject.value;
if (currentPage < totalPages) {
this.currentPageSubject.next(currentPage + 1);
}
}
previousPage(): void {
const currentPage = this.currentPageSubject.value;
if (currentPage > 1) {
this.currentPageSubject.next(currentPage - 1);
}
}
goToPage(page: number): void {
const totalPages = this.getTotalPages();
if (page > 0 && page <= totalPages) {
this.currentPageSubject.next(page);
}
}
getTotalPages(): number {
const totalCount = this.totalCountSubject.value;
const itemsPerPage = this.itemsPerPageSubject.value;
return Math.ceil(totalCount / itemsPerPage);
}
}

@ -49,7 +49,7 @@
<p>{{'loadingTransactionLogs' | translate}}</p>
</div>
<div *ngIf="!isLoading && logs.length === 0" class="text-center text-muted">
<div *ngIf="!isLoading && transactionLog.length === 0" class="text-center text-muted">
<p>{{'noTransactionLogsFound' | translate}}</p>
</div>
@ -57,7 +57,7 @@
{{ errorMessage }}
</div>
<div *ngIf="!isLoading && logs.length > 0" class="table-responsive">
<div *ngIf="!isLoading && transactionLog.length > 0" class="table-responsive">
<table class="table mb-0 border">
<thead class="table-light">
<tr>
@ -73,12 +73,9 @@
</tr>
</thead>
<tbody>
<tr *ngFor="
let log of (
(logs$ | async) ?? []
| transactionLogFilter: searchText
).slice((currentPage - 1) * itemsPerPage, currentPage * itemsPerPage)
">
<tr
*ngFor="let log of (allItems | tableFilter: searchText: ['logID','organization','transactionID','drAccount','crAccount','paymentMode','date','channel','createdAt']).slice((currentPage-1)*itemsPerPage, currentPage*itemsPerPage)">
<td>{{ log.logId }}</td>
<td>{{ log.porOrgacode }}</td>
<td>{{ log.transactionID }}</td>
@ -96,13 +93,13 @@
class="d-flex justify-content-between align-items-center mt-3">
<div class="form-group mb-0">
<ng-select class="form-select-sm" [items]="pageSizeOptions" bindLabel="label" bindValue="value"
[(ngModel)]="itemsPerPage" (change)="onPageSizeChange(itemsPerPage)" [searchable]="false" [clearable]="false"
[(ngModel)]="itemsPerPage" (change)="itemsPerPageChanged()" [searchable]="false" [clearable]="false"
[dropdownPosition]="'top'">
</ng-select>
</div>
<div class="text-muted">
{{ 'page' | translate }} {{ currentPage }} {{ 'of' | translate }} {{ getTotalPages() }} ({{ totalCount }} {{ 'totalItems' | translate }})
{{ 'page' | translate }} {{ currentPage }} {{ 'of' | translate }} {{ totalPages() }} ({{ totalCount }} {{ 'totalItems' | translate }})
</div>
<div class="btn-group">

@ -1,5 +1,4 @@
import { Component, OnInit } from '@angular/core';
import { TransactionLogService } from '../shared/services/transaction-log.service';
import { CommonModule } from '@angular/common';
import { TranslateModule } from '@ngx-translate/core';
import { ExcelExportService } from '../shared/services/excel-export.service';
@ -7,80 +6,98 @@ import { TRANSACTION_LOGS_FILE_NAME } from '../utils/app.constants';
import { pageSizeOptions } from '../utils/app.constants';
import { NgSelectModule } from '@ng-select/ng-select';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { TransactionLogFilterPipe } from '../shared/pipes/transactionLogFilter.pipe';
import { TableFilterPipe } from '../shared/pipes/table-filter.pipe';
import {TransactionLog} from "../models/user"
import { URIKey } from '../utils/uri-enums';
import { HttpParams } from '@angular/common/http';
import { HttpURIService } from '../app.http.uri.service';
@Component({
selector: 'app-transaction-logs',
templateUrl: './transaction-logs.component.html',
providers: [TransactionLogService],
imports: [CommonModule, TranslateModule, NgSelectModule, FormsModule, ReactiveFormsModule, TransactionLogFilterPipe, ]
imports: [CommonModule, TranslateModule, NgSelectModule, FormsModule, ReactiveFormsModule, TableFilterPipe ]
})
export class TransactionLogsComponent implements OnInit {
onPageSizeChange(arg0: number) {
throw new Error('Method not implemented.');
}
currentPage: number = 1;
totalCount: number = 0;
renewalDataExpanded: boolean = true;
pageSizeOptions = pageSizeOptions;
itemsPerPage: number = 5;
logs: TransactionLog[] = [];
transactionLog: TransactionLog[] = [];
isLoading = false;
pagedItems: any[] = [];
errorMessage: string = '';
searchText: string = '';
allItems: any;
constructor(
private transactionLogService: TransactionLogService,
private excelExportService: ExcelExportService
private excelExportService: ExcelExportService,
private httpService: HttpURIService,
) {}
get logs$(){
return this.transactionLogService.logs$;
}
ngOnInit(): void {
this.transactionLogService.loadLogs();
this.loadTransactionLogs();
}
loadTransactionLogs(): void {
this.isLoading = true;
const params = new HttpParams();
this.httpService
.requestGET<any>(URIKey.TRANSACTION_LOGS, params)
.subscribe({
next: (res) => {
const logs = Array.isArray(res) ? res : res?.data;
this.transactionLog = logs ?? [];
this.allItems = [...this.transactionLog];
this.totalCount = this.transactionLog.length;
this.transactionLogService.logs$.subscribe((logs: TransactionLog[]) => {
this.logs = logs;
this.updatePagedItems();
this.isLoading = false;
},
error: (err) => {
console.error('Error fetching logging details data:', err);
this.transactionLog = [];
this.isLoading = false;
}
});
}
this.transactionLogService.currentPage$.subscribe((page) => {
this.currentPage = page;
});
this.transactionLogService.totalCount$.subscribe((count) => {
this.totalCount = count;
});
this.transactionLogService.itemsPerPage$.subscribe((size) => {
this.itemsPerPage = size;
});
itemsPerPageChanged(): void {
this.currentPage = 1;
this.updatePagedItems();
}
onSearch(value: string): void {
this.searchText = value;
}
get paginatedLogs(): TransactionLog[] {
const start = (this.currentPage - 1) * this.itemsPerPage;
const end = start + this.itemsPerPage;
return this.logs.slice(start, end);
totalPages(): number {
return Math.ceil(this.allItems.length / this.itemsPerPage);
}
exportDataInExcel(){
this.excelExportService.exportExcel(this.logs, TRANSACTION_LOGS_FILE_NAME)
previousPage(): void {
if (this.currentPage > 1) {
this.currentPage--;
this.updatePagedItems();
}
getTotalPages(): number {
return this.transactionLogService.getTotalPages();
}
onPageSizeChange(pageSize: number): void {
this.transactionLogService.setItemsPerPage(pageSize);
updatePagedItems(): void {
const startIndex = (this.currentPage - 1) * this.itemsPerPage;
const endIndex = startIndex + this.itemsPerPage;
this.pagedItems = this.allItems.slice(startIndex, endIndex);
}
nextPage(): void {
this.transactionLogService.nextPage();
if (this.currentPage < this.totalPages()) {
this.currentPage++;
this.updatePagedItems();
}
previousPage(): void {
this.transactionLogService.previousPage();
}
exportDataInExcel() {
this.excelExportService.exportExcel(this.transactionLog, TRANSACTION_LOGS_FILE_NAME)
}
}
Loading…
Cancel
Save