[agent-pipeline] pipe-20260306194817-rw8w round-2

frontend/app/(main)/main/page.tsx

@@ -1,29 +1,93 @@
 "use client";
 
-import { Card, CardContent } from "@/components/ui/card";
-import { Badge } from "@/components/ui/badge";
+import { useRouter } from "next/navigation";
+import { useAuth } from "@/hooks/useAuth";
+import { FileCheck, Menu, Users, Bell, FileText, Layout, Server, Shield, Calendar } from "lucide-react";
+
+const quickAccessItems = [
+  { label: "결재함", icon: FileCheck, href: "/admin/approvalBox" },
+  { label: "메뉴 관리", icon: Menu, href: "/admin/menu" },
+  { label: "사용자 관리", icon: Users, href: "/admin/userMng" },
+  { label: "공지사항", icon: Bell, href: "/admin/system-notices" },
+  { label: "감사 로그", icon: FileText, href: "/admin/audit-log" },
+  { label: "화면 관리", icon: Layout, href: "/admin/screenMng" },
+];
 
-/**
- * 메인 페이지 컴포넌트
- * 대시보드 내용만 포함
- */
 export default function MainPage() {
+  const router = useRouter();
+  const { user } = useAuth();
+
+  const userName = user?.userName || "사용자";
+
   return (
-    <div className="space-y-6 p-4">
-      {/* Welcome Message */}
-      <Card>
-        <CardContent className="pt-6">
-          <div className="space-y-6 text-center">
-            <h3 className="text-lg font-semibold">Vexplor에 오신 것을 환영합니다!</h3>
-            <p className="text-muted-foreground">제품 수명 주기 관리 시스템을 통해 효율적인 업무를 시작하세요.</p>
-            <div className="flex justify-center space-x-2">
-              <Badge variant="secondary">Node.js</Badge>
-              <Badge variant="secondary">Next.js</Badge>
-              <Badge variant="secondary">Shadcn/ui</Badge>
+    <div className="space-y-6 p-4 sm:p-6">
+      {/* 환영 영역 */}
+      <div className="rounded-xl bg-gradient-to-r from-primary/10 via-primary/5 to-transparent p-6 sm:p-8">
+        <h1 className="text-xl font-bold sm:text-2xl">
+          안녕하세요, {userName}님
+        </h1>
+        <p className="mt-2 text-sm text-muted-foreground">
+          오늘도 효율적인 업무를 시작하세요.
+        </p>
+      </div>
+
+      {/* 퀵 액세스 카드 */}
+      <div>
+        <h2 className="mb-4 text-lg font-semibold">바로가기</h2>
+        <div className="grid grid-cols-2 gap-3 sm:grid-cols-3 lg:grid-cols-4">
+          {quickAccessItems.map((item) => {
+            const Icon = item.icon;
+            return (
+              <button
+                key={item.href}
+                onClick={() => router.push(item.href)}
+                className="group flex flex-col items-center gap-3 rounded-xl border bg-card p-4 shadow-sm transition-all hover:border-primary/30 hover:shadow-md sm:p-6"
+              >
+                <div className="flex h-10 w-10 items-center justify-center rounded-lg bg-primary/10 text-primary transition-colors group-hover:bg-primary/20 sm:h-12 sm:w-12">
+                  <Icon className="h-5 w-5 sm:h-6 sm:w-6" />
+                </div>
+                <span className="text-xs font-medium sm:text-sm">{item.label}</span>
+              </button>
+            );
+          })}
+        </div>
+      </div>
+
+      {/* 시스템 정보 */}
+      <div className="rounded-xl border bg-card p-4 shadow-sm sm:p-6">
+        <h2 className="mb-3 text-lg font-semibold">시스템 정보</h2>
+        <div className="grid grid-cols-1 gap-4 sm:grid-cols-3">
+          <div className="flex items-center gap-3">
+            <div className="flex h-8 w-8 items-center justify-center rounded-lg bg-muted">
+              <Server className="h-4 w-4 text-muted-foreground" />
+            </div>
+            <div>
+              <p className="text-xs text-muted-foreground">플랫폼</p>
+              <p className="text-sm font-medium">WACE ERP/PLM</p>
             </div>
           </div>
-        </CardContent>
-      </Card>
+          <div className="flex items-center gap-3">
+            <div className="flex h-8 w-8 items-center justify-center rounded-lg bg-muted">
+              <Shield className="h-4 w-4 text-muted-foreground" />
+            </div>
+            <div>
+              <p className="text-xs text-muted-foreground">버전</p>
+              <p className="text-sm font-medium">v2.0.0</p>
+            </div>
+          </div>
+          <div className="flex items-center gap-3">
+            <div className="flex h-8 w-8 items-center justify-center rounded-lg bg-muted">
+              <Calendar className="h-4 w-4 text-muted-foreground" />
+            </div>
+            <div>
+              <p className="text-xs text-muted-foreground">오늘 날짜</p>
+              <p className="text-sm font-medium">
+                {new Date().toLocaleDateString("ko-KR", { year: "numeric", month: "long", day: "numeric" })}
+              </p>
+            </div>
+          </div>
+        </div>
+      </div>
     </div>
   );
 }

frontend/app/(main)/page.tsx

@@ -1,18 +1,91 @@
-export default function MainHomePage() {
-  return (
-    <div className="space-y-6 p-4">
-      {/* 대시보드 컨텐츠 */}
-      <div className="rounded-lg border bg-background p-6 shadow-sm">
-        <h3 className="mb-4 text-lg font-semibold">WACE 솔루션에 오신 것을 환영합니다!</h3>
-        <p className="mb-6 text-muted-foreground">제품 수명 주기 관리 시스템을 통해 효율적인 업무를 시작하세요.</p>
+"use client";
 
-        <div className="flex gap-2">
-          <span className="inline-flex items-center rounded-md bg-success/10 px-2 py-1 text-xs font-medium text-success ring-1 ring-success/10 ring-inset">
-            Next.js
-          </span>
-          <span className="inline-flex items-center rounded-md bg-primary/10 px-2 py-1 text-xs font-medium text-primary ring-1 ring-primary/10 ring-inset">
-            Shadcn/ui
-          </span>
+import { useRouter } from "next/navigation";
+import { useAuth } from "@/hooks/useAuth";
+import { FileCheck, Menu, Users, Bell, FileText, Layout, Server, Shield, Calendar } from "lucide-react";
+
+const quickAccessItems = [
+  { label: "결재함", icon: FileCheck, href: "/admin/approvalBox" },
+  { label: "메뉴 관리", icon: Menu, href: "/admin/menu" },
+  { label: "사용자 관리", icon: Users, href: "/admin/userMng" },
+  { label: "공지사항", icon: Bell, href: "/admin/system-notices" },
+  { label: "감사 로그", icon: FileText, href: "/admin/audit-log" },
+  { label: "화면 관리", icon: Layout, href: "/admin/screenMng" },
+];
+
+export default function MainHomePage() {
+  const router = useRouter();
+  const { user } = useAuth();
+
+  const userName = user?.userName || "사용자";
+
+  return (
+    <div className="space-y-6 p-4 sm:p-6">
+      {/* 환영 영역 */}
+      <div className="rounded-xl bg-gradient-to-r from-primary/10 via-primary/5 to-transparent p-6 sm:p-8">
+        <h1 className="text-xl font-bold sm:text-2xl">
+          안녕하세요, {userName}님
+        </h1>
+        <p className="mt-2 text-sm text-muted-foreground">
+          오늘도 효율적인 업무를 시작하세요.
+        </p>
+      </div>
+
+      {/* 퀵 액세스 카드 */}
+      <div>
+        <h2 className="mb-4 text-lg font-semibold">바로가기</h2>
+        <div className="grid grid-cols-2 gap-3 sm:grid-cols-3 lg:grid-cols-4">
+          {quickAccessItems.map((item) => {
+            const Icon = item.icon;
+            return (
+              <button
+                key={item.href}
+                onClick={() => router.push(item.href)}
+                className="group flex flex-col items-center gap-3 rounded-xl border bg-card p-4 shadow-sm transition-all hover:border-primary/30 hover:shadow-md sm:p-6"
+              >
+                <div className="flex h-10 w-10 items-center justify-center rounded-lg bg-primary/10 text-primary transition-colors group-hover:bg-primary/20 sm:h-12 sm:w-12">
+                  <Icon className="h-5 w-5 sm:h-6 sm:w-6" />
+                </div>
+                <span className="text-xs font-medium sm:text-sm">{item.label}</span>
+              </button>
+            );
+          })}
+        </div>
+      </div>
+
+      {/* 시스템 정보 */}
+      <div className="rounded-xl border bg-card p-4 shadow-sm sm:p-6">
+        <h2 className="mb-3 text-lg font-semibold">시스템 정보</h2>
+        <div className="grid grid-cols-1 gap-4 sm:grid-cols-3">
+          <div className="flex items-center gap-3">
+            <div className="flex h-8 w-8 items-center justify-center rounded-lg bg-muted">
+              <Server className="h-4 w-4 text-muted-foreground" />
+            </div>
+            <div>
+              <p className="text-xs text-muted-foreground">플랫폼</p>
+              <p className="text-sm font-medium">WACE ERP/PLM</p>
+            </div>
+          </div>
+          <div className="flex items-center gap-3">
+            <div className="flex h-8 w-8 items-center justify-center rounded-lg bg-muted">
+              <Shield className="h-4 w-4 text-muted-foreground" />
+            </div>
+            <div>
+              <p className="text-xs text-muted-foreground">버전</p>
+              <p className="text-sm font-medium">v2.0.0</p>
+            </div>
+          </div>
+          <div className="flex items-center gap-3">
+            <div className="flex h-8 w-8 items-center justify-center rounded-lg bg-muted">
+              <Calendar className="h-4 w-4 text-muted-foreground" />
+            </div>
+            <div>
+              <p className="text-xs text-muted-foreground">오늘 날짜</p>
+              <p className="text-sm font-medium">
+                {new Date().toLocaleDateString("ko-KR", { year: "numeric", month: "long", day: "numeric" })}
+              </p>
+            </div>
+          </div>
         </div>
       </div>
     </div>