권한부여 및 정합성 검사 추가

adminfront/src/features/overview/GlobalOverviewPage.tsx

@@ -1,7 +1,9 @@
 import { useQuery } from "@tanstack/react-query";
 import {
   Activity,
+  AlertTriangle,
   BarChart3,
+  CheckCircle2,
   Database,
   ShieldCheck,
   Users,
@@ -9,12 +11,14 @@ import {
 import { type ReactNode, useMemo, useState } from "react";
 import { RoleGuard } from "../../components/auth/RoleGuard";
 import {
+  type DataIntegrityStatus,
   type RPUsageDailyMetric,
   type RPUsagePeriod,
   type TenantSummary,
   fetchAdminOverviewStats,
   fetchAdminRPUsageDaily,
   fetchAllTenants,
+  fetchDataIntegrityReport,
 } from "../../lib/adminApi";
 import { t } from "../../lib/i18n";
 
@@ -151,6 +155,102 @@ function OverviewMetric({
   );
 }
 
+function formatOverviewDateTime(value?: string) {
+  if (!value) return "-";
+  const date = new Date(value);
+  if (Number.isNaN(date.getTime())) return value;
+  return new Intl.DateTimeFormat("ko-KR", {
+    dateStyle: "medium",
+    timeStyle: "short",
+  }).format(date);
+}
+
+function integrityStatusText(status: DataIntegrityStatus) {
+  switch (status) {
+    case "pass":
+      return "정상";
+    case "warning":
+      return "주의";
+    default:
+      return "실패";
+  }
+}
+
+function integrityStatusClass(status: DataIntegrityStatus) {
+  switch (status) {
+    case "pass":
+      return "text-emerald-700 dark:text-emerald-300";
+    case "warning":
+      return "text-amber-700 dark:text-amber-300";
+    default:
+      return "text-destructive";
+  }
+}
+
+function IntegrityOverviewSummary() {
+  const { data, isError } = useQuery({
+    queryKey: ["admin-overview-integrity"],
+    queryFn: fetchDataIntegrityReport,
+    retry: false,
+  });
+
+  if (isError) {
+    return (
+      <section className="border-t border-border/60 pt-4">
+        <div className="flex items-center gap-2 text-sm text-muted-foreground">
+          <AlertTriangle size={16} />
+          <span>정합성 최종 검증 결과를 불러오지 못했습니다.</span>
+        </div>
+      </section>
+    );
+  }
+
+  if (!data) {
+    return null;
+  }
+
+  return (
+    <section className="border-t border-border/60 pt-4">
+      <div className="flex flex-wrap items-center justify-between gap-3">
+        <div className="flex items-center gap-2">
+          {data.status === "pass" ? (
+            <CheckCircle2 size={18} className="text-emerald-600" />
+          ) : (
+            <AlertTriangle size={18} className="text-amber-600" />
+          )}
+          <h3 className="text-base font-semibold">정합성 최종 검증</h3>
+        </div>
+        <div className="flex flex-wrap items-center gap-3 text-sm">
+          <span
+            className={`font-semibold ${integrityStatusClass(data.status)}`}
+          >
+            {integrityStatusText(data.status)}
+          </span>
+          <span className="tabular-nums">실패 {data.summary.failures}건</span>
+          <span className="text-muted-foreground">
+            {formatOverviewDateTime(data.checkedAt)}
+          </span>
+        </div>
+      </div>
+      <div className="mt-3 grid gap-2 text-sm sm:grid-cols-2">
+        {data.sections.map((section) => (
+          <div
+            key={section.key}
+            className="flex items-center justify-between gap-3 rounded border border-border/60 px-3 py-2"
+          >
+            <span>{section.label}</span>
+            <span
+              className={`font-medium ${integrityStatusClass(section.status)}`}
+            >
+              {integrityStatusText(section.status)}
+            </span>
+          </div>
+        ))}
+      </div>
+    </section>
+  );
+}
+
 function RPUsageMixedChart({
   rows,
   filters,
@@ -371,6 +471,7 @@ function GlobalOverviewPage() {
     retry: false,
   });
   const stats = statsQuery.data;
+  const visibleTenantCount = tenantsQuery.data?.items.length;
   const usageRows = usageQuery.data?.items ?? [];
   const metric = (value: number | undefined) =>
     value === undefined ? "-" : value.toLocaleString();
@@ -444,7 +545,7 @@ function GlobalOverviewPage() {
               "ui.admin.overview.summary.total_tenants",
               "전체 테넌트 수",
             )}
-            value={metric(stats?.totalTenants)}
+            value={metric(visibleTenantCount ?? stats?.totalTenants)}
           />
           <OverviewMetric
             icon={<ShieldCheck size={14} />}
@@ -454,6 +555,11 @@ function GlobalOverviewPage() {
             )}
             value={metric(stats?.oidcClients)}
           />
+          <OverviewMetric
+            icon={<Users size={14} />}
+            label={t("ui.admin.overview.summary.total_users", "전체 사용자 수")}
+            value={metric(stats?.totalUsers)}
+          />
         </RoleGuard>
         <OverviewMetric
           icon={<Activity size={14} />}
@@ -491,6 +597,10 @@ function GlobalOverviewPage() {
           period={period}
         />
       )}
+
+      <RoleGuard roles={["super_admin"]}>
+        <IntegrityOverviewSummary />
+      </RoleGuard>
     </div>
   );
 }