690519:1631 224 to 226 AI #01

2026-05-19 16:31:50 +07:00
parent 3e25097470
commit ea5499123e
127 changed files with 12387 additions and 42 deletions
@@ -0,0 +1,96 @@
+// File: app/(admin)/admin/ai/intent-classification/analytics/page.tsx
+// Change Log
+// - 2026-05-19: สร้างหน้า Analytics Dashboard สำหรับ Intent Classification (T037, US3).
+
+'use client';
+
+import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
+import { Skeleton } from '@/components/ui/skeleton';
+import { useIntentAnalytics } from '@/hooks/ai/use-intent-classification';
+import { AnalyticsSummaryCards } from '@/components/ai/intent-classification/analytics/analytics-summary-cards';
+import { MethodBreakdownTable } from '@/components/ai/intent-classification/analytics/method-breakdown-table';
+import { IntentBreakdownTable } from '@/components/ai/intent-classification/analytics/intent-breakdown-table';
+import { RecalibrationPanel } from '@/components/ai/intent-classification/analytics/recalibration-panel';
+
+/**
+ * หน้า Analytics Dashboard สำหรับ Intent Classification
+ * แสดง Summary Cards, Method Breakdown, Intent Breakdown, Recalibration
+ */
+export default function IntentAnalyticsPage() {
+  const { data, isLoading, isError, error } = useIntentAnalytics();
+
+  if (isLoading) {
+    return (
+      <div className="space-y-6 p-6">
+        <h1 className="text-2xl font-bold">Intent Classification Analytics</h1>
+        <div className="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4">
+          {Array.from({ length: 4 }).map((_, i) => (
+            <Skeleton key={i} className="h-[120px]" />
+          ))}
+        </div>
+        <Skeleton className="h-[300px]" />
+      </div>
+    );
+  }
+
+  if (isError) {
+    return (
+      <div className="p-6">
+        <h1 className="text-2xl font-bold mb-4">Intent Classification Analytics</h1>
+        <Card>
+          <CardContent className="p-6">
+            <p className="text-destructive">
+              เกิดข้อผิดพลาด: {error instanceof Error ? error.message : 'ไม่สามารถโหลดข้อมูลได้'}
+            </p>
+          </CardContent>
+        </Card>
+      </div>
+    );
+  }
+
+  if (!data) {
+    return null;
+  }
+
+  return (
+    <div className="space-y-6 p-6">
+      <div className="flex items-center justify-between">
+        <h1 className="text-2xl font-bold">Intent Classification Analytics</h1>
+        <p className="text-sm text-muted-foreground">ข้อมูลย้อนหลัง 30 วัน</p>
+      </div>
+
+      {/* Summary Cards */}
+      <AnalyticsSummaryCards data={data} />
+
+      {/* Method Breakdown */}
+      <Card>
+        <CardHeader>
+          <CardTitle>Classification Method Breakdown</CardTitle>
+        </CardHeader>
+        <CardContent>
+          <MethodBreakdownTable data={data.byMethod} />
+        </CardContent>
+      </Card>
+
+      {/* Intent Breakdown */}
+      <Card>
+        <CardHeader>
+          <CardTitle>Intent Code Breakdown</CardTitle>
+        </CardHeader>
+        <CardContent>
+          <IntentBreakdownTable data={data.byIntent} />
+        </CardContent>
+      </Card>
+
+      {/* Recalibration */}
+      <Card>
+        <CardHeader>
+          <CardTitle>Recalibration Recommendations</CardTitle>
+        </CardHeader>
+        <CardContent>
+          <RecalibrationPanel data={data.recalibration} />
+        </CardContent>
+      </Card>
+    </div>
+  );
+}