2 Commits

Author SHA1 Message Date
78ce686f97 feat: เพิ่มระบบ caching
- เพิ่ม caching interceptor และ service

- เพิ่ม configสำหรับ caching
2025-11-13 13:30:02 +07:00
f25488370a -เพิ่ม guard jwt token
-เพิ่ม  jwt-decoded
-เพิ่ม  ระบบ first setup ดึงข้อมูล  accounting
2025-11-13 11:45:03 +07:00
6 changed files with 164 additions and 19 deletions

View File

@@ -61,6 +61,7 @@
"bootstrap": "^5.3.8",
"chart.js": "^4.5.1",
"dotenv": "^17.2.3",
"jwt-decode": "^4.0.0",
"ng2-charts": "^6.0.1",
"postcss": "^8.5.6",
"rxjs": "~7.8.0",
@@ -73,6 +74,7 @@
"@angular/cli": "^20.3.9",
"@angular/compiler-cli": "^20.3.10",
"@capacitor/cli": "latest",
"@types/jasmine": "~5.1.0",
"cross-env": "^10.1.0",
"electron": "^39.0.0",
"electron-builder": "^26.0.12",
@@ -84,7 +86,6 @@
"karma-jasmine-html-reporter": "~2.1.0",
"ngx-toastr": "^19.1.0",
"postcss": "^8.5.3",
"typescript": "~5.9.3",
"@types/jasmine": "~5.1.0"
"typescript": "~5.9.3"
}
}

View File

@@ -0,0 +1,11 @@
export const CACHEABLE_URLS = {
GET: [
// Add GET URIs here that you want to cache
// e.g., '/api/data'
],
POST: [
'/api/web/accountingSearch'
// Add POST URIs here that you want to cache
// e.g., '/api/search'
]
};

View File

@@ -47,31 +47,53 @@ export class MainDashboardContentComponent implements OnInit {
constructor(private generalService: GeneralService) {}
ngOnInit(): void {
this.fetchChartData();
let token = localStorage.getItem('access_token')
this.OnSearchAct(token, true);
}
fetchChartData(): void {
// NOTE: Using a placeholder endpoint as the actual one was not provided.
const uri = '/api/dashboard/summary-last-6-months';
this.generalService.getRequest(uri).subscribe({
OnSearchAct(value: any, setupFirst: boolean): void {
const uri = '/api/web/accountingSearch';
let request = {
token: value
}
this.generalService.postRequest(uri, request).subscribe({
next: (result: any) => {
if (result.code === '200' && result.data) {
this.processChartData(result.data);
} else {
console.warn('Could not fetch chart data:', result.message_th);
// Optionally, display placeholder data or an error message
this.setupPlaceholderData();
if (result.code === '200') {
this.generalService.trowApi(result);
console.log(`✅ OTP ส่งไปที่ ${value.email}`);
}
},
error: (error: any) => {
console.error('Error fetching chart data:', error);
// Display placeholder data on error to show the graph structure
this.setupPlaceholderData();
},
complete: () => {
}
});
}
// fetchChartData(): void {
// // NOTE: Using a placeholder endpoint as the actual one was not provided.
// const uri = '/api/dashboard/summary-last-6-months';
// this.generalService.getRequest(uri).subscribe({
// next: (result: any) => {
// if (result.code === '200' && result.data) {
// this.processChartData(result.data);
// } else {
// console.warn('Could not fetch chart data:', result.message_th);
// // Optionally, display placeholder data or an error message
// this.setupPlaceholderData();
// }
// },
// error: (error: any) => {
// console.error('Error fetching chart data:', error);
// // Display placeholder data on error to show the graph structure
// this.setupPlaceholderData();
// }
// });
// }
processChartData(data: any[]): void {
const labels = data.map(item => item.month);
const revenues = data.map(item => item.revenue);

View File

@@ -1,12 +1,30 @@
import { inject } from '@angular/core';
import { CanActivateFn, Router } from '@angular/router';
import { jwtDecode } from 'jwt-decode';
export const authGuard: CanActivateFn = (route, state) => {
const router = inject(Router);
const accessToken = localStorage.getItem('access_token');
if (accessToken) {
return true;
try {
const decodedToken: any = jwtDecode(accessToken);
const currentTime = Date.now() / 1000;
if (decodedToken.exp < currentTime) {
// Token expired
localStorage.removeItem('access_token');
router.navigate(['/login']);
return false;
}
return true;
} catch (error) {
// Error decoding token
localStorage.removeItem('access_token');
router.navigate(['/login']);
return false;
}
} else {
router.navigate(['/login']);
return false;

View File

@@ -0,0 +1,52 @@
import { Injectable } from '@angular/core';
import {
HttpEvent, HttpInterceptor, HttpHandler, HttpRequest, HttpResponse
} from '@angular/common/http';
import { Observable, of } from 'rxjs';
import { tap } from 'rxjs/operators';
import { CachingService } from './caching.service';
import { CACHEABLE_URLS } from '../config/caching.config';
@Injectable()
export class CachingInterceptor implements HttpInterceptor {
constructor(private cache: CachingService) {}
intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
if (!this.isCacheable(req)) {
return next.handle(req);
}
const cachedResponse = this.cache.get(this.getCacheKey(req));
if (cachedResponse) {
return of(cachedResponse.clone());
}
return next.handle(req).pipe(
tap(event => {
if (event instanceof HttpResponse) {
this.cache.put(this.getCacheKey(req), event.clone());
}
})
);
}
private isCacheable(req: HttpRequest<any>): boolean {
if (req.method === 'GET') {
return CACHEABLE_URLS.GET.some(url => req.urlWithParams.includes(url));
}
if (req.method === 'POST') {
return CACHEABLE_URLS.POST.some(url => req.urlWithParams.includes(url));
}
return false;
}
private getCacheKey(req: HttpRequest<any>): string {
if (req.method === 'POST') {
return req.urlWithParams + JSON.stringify(req.body);
}
return req.urlWithParams;
}
}

View File

@@ -0,0 +1,41 @@
import { Injectable } from '@angular/core';
import { HttpResponse } from '@angular/common/http';
@Injectable({
providedIn: 'root'
})
export class CachingService {
private cache = new Map<string, [Date, HttpResponse<any>]>();
private cacheDurationInMs = 600000; // 5 minutes
constructor() { }
get(key: string): HttpResponse<any> | null {
const tuple = this.cache.get(key);
if (!tuple) {
return null;
}
const expires = tuple[0];
const httpResponse = tuple[1];
// Don't observe expired keys
const now = new Date();
if (expires && expires.getTime() < now.getTime()) {
this.cache.delete(key);
return null;
}
return httpResponse;
}
put(key: string, value: HttpResponse<any>): void {
const expires = new Date();
expires.setMilliseconds(expires.getMilliseconds() + this.cacheDurationInMs);
this.cache.set(key, [expires, value]);
}
clear(): void {
this.cache.clear();
}
}