From 3083ffc0a3b49f4a97fdeb9ce060b0cbaeea8b3b Mon Sep 17 00:00:00 2001
From: leeheejin <imleesinok@gmail.com>
Date: Tue, 23 Sep 2025 12:34:34 +0900
Subject: [PATCH] =?UTF-8?q?=EC=99=B8=EB=B6=80=EC=BB=A4=EB=84=A5=EC=85=98?=
 =?UTF-8?q?=EA=B4=80=EB=A6=AC=20=EC=88=98=EC=A0=95=EC=8B=9C=20=EC=97=B0?=
 =?UTF-8?q?=EA=B2=B0=ED=85=8C=EC=8A=A4=ED=8A=B8=20=EB=AC=B8=EC=A0=9C=20?=
 =?UTF-8?q?=ED=95=B4=EA=B2=B0=EA=B3=BC=20=ED=94=84=EB=A1=A0=ED=8A=B8=20?=
 =?UTF-8?q?=EC=95=BD=EA=B0=84=20=EC=88=98=EC=A0=95=ED=95=9C=20=EB=82=B4?=
 =?UTF-8?q?=EC=9A=A9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/app/(main)/admin/page.tsx            | 38 +++++++++----------
 .../admin/ExternalDbConnectionModal.tsx       | 21 +++++-----
 frontend/components/layout/AppLayout.tsx      | 12 +++++-
 3 files changed, 39 insertions(+), 32 deletions(-)

diff --git a/frontend/app/(main)/admin/page.tsx b/frontend/app/(main)/admin/page.tsx
index e4bec481..b320ab45 100644
--- a/frontend/app/(main)/admin/page.tsx
+++ b/frontend/app/(main)/admin/page.tsx
@@ -5,13 +5,13 @@ import Link from "next/link";
  */
 export default function AdminPage() {
   return (
-    <div className="space-y-6">
+    <div className="min-h-screen bg-gradient-to-br from-slate-50 to-blue-50/30 p-8 space-y-8">
       {/* 관리자 기능 카드들 */}
-      <div className="grid gap-6 md:grid-cols-2 lg:grid-cols-3">
+      <div className="mx-auto max-w-7xl grid gap-6 md:grid-cols-2 lg:grid-cols-3">
         <Link href="/admin/userMng" className="block">
           <div className="rounded-lg border bg-white p-6 shadow-sm transition-colors hover:bg-gray-50">
             <div className="flex items-center gap-4">
-              <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-blue-50">
+              <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-gradient-to-br from-blue-200 to-blue-300">
                 <Users className="h-6 w-6 text-blue-600" />
               </div>
               <div>
@@ -24,8 +24,8 @@ export default function AdminPage() {
 
         <div className="rounded-lg border bg-white p-6 shadow-sm">
           <div className="flex items-center gap-4">
-            <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-green-50">
-              <Shield className="h-6 w-6 text-green-600" />
+              <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-gradient-to-br from-emerald-200 to-emerald-300">
+                <Shield className="h-6 w-6 text-emerald-600" />
             </div>
             <div>
               <h3 className="font-semibold text-gray-900">권한 관리</h3>
@@ -36,8 +36,8 @@ export default function AdminPage() {
 
         <div className="rounded-lg border bg-white p-6 shadow-sm">
           <div className="flex items-center gap-4">
-            <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-purple-50">
-              <Settings className="h-6 w-6 text-purple-600" />
+              <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-gradient-to-br from-violet-200 to-violet-300">
+                <Settings className="h-6 w-6 text-violet-600" />
             </div>
             <div>
               <h3 className="font-semibold text-gray-900">시스템 설정</h3>
@@ -48,8 +48,8 @@ export default function AdminPage() {
 
         <div className="rounded-lg border bg-white p-6 shadow-sm">
           <div className="flex items-center gap-4">
-            <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-orange-50">
-              <BarChart3 className="h-6 w-6 text-orange-600" />
+              <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-gradient-to-br from-amber-200 to-amber-300">
+                <BarChart3 className="h-6 w-6 text-amber-600" />
             </div>
             <div>
               <h3 className="font-semibold text-gray-900">통계 및 리포트</h3>
@@ -61,7 +61,7 @@ export default function AdminPage() {
         <Link href="/admin/screenMng" className="block">
           <div className="rounded-lg border bg-white p-6 shadow-sm transition-colors hover:bg-gray-50">
             <div className="flex items-center gap-4">
-              <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-indigo-50">
+              <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-gradient-to-br from-indigo-200 to-indigo-300">
                 <Palette className="h-6 w-6 text-indigo-600" />
               </div>
               <div>
@@ -74,14 +74,14 @@ export default function AdminPage() {
       </div>
 
       {/* 표준 관리 섹션 */}
-      <div className="space-y-4">
+      <div className="mx-auto max-w-7xl space-y-4">
         <h2 className="text-xl font-semibold text-gray-900">표준 관리</h2>
         <div className="grid gap-6 md:grid-cols-2 lg:grid-cols-4">
           <Link href="/admin/standards" className="block">
             <div className="rounded-lg border bg-white p-6 shadow-sm transition-colors hover:bg-gray-50">
               <div className="flex items-center gap-4">
-                <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-teal-50">
-                  <Database className="h-6 w-6 text-teal-600" />
+              <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-gradient-to-br from-teal-200 to-teal-300">
+                <Database className="h-6 w-6 text-teal-600" />
                 </div>
                 <div>
                   <h3 className="font-semibold text-gray-900">웹타입 관리</h3>
@@ -94,8 +94,8 @@ export default function AdminPage() {
           <Link href="/admin/templates" className="block">
             <div className="rounded-lg border bg-white p-6 shadow-sm transition-colors hover:bg-gray-50">
               <div className="flex items-center gap-4">
-                <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-emerald-50">
-                  <Layout className="h-6 w-6 text-emerald-600" />
+              <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-gradient-to-br from-emerald-200 to-emerald-300">
+                <Layout className="h-6 w-6 text-emerald-600" />
                 </div>
                 <div>
                   <h3 className="font-semibold text-gray-900">템플릿 관리</h3>
@@ -108,8 +108,8 @@ export default function AdminPage() {
           <Link href="/admin/tableMng" className="block">
             <div className="rounded-lg border bg-white p-6 shadow-sm transition-colors hover:bg-gray-50">
               <div className="flex items-center gap-4">
-                <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-cyan-50">
-                  <Database className="h-6 w-6 text-cyan-600" />
+              <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-gradient-to-br from-cyan-200 to-cyan-300">
+                <Database className="h-6 w-6 text-cyan-600" />
                 </div>
                 <div>
                   <h3 className="font-semibold text-gray-900">테이블 관리</h3>
@@ -122,8 +122,8 @@ export default function AdminPage() {
           <Link href="/admin/components" className="block">
             <div className="rounded-lg border bg-white p-6 shadow-sm transition-colors hover:bg-gray-50">
               <div className="flex items-center gap-4">
-                <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-violet-50">
-                  <Package className="h-6 w-6 text-violet-600" />
+              <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-gradient-to-br from-violet-200 to-violet-300">
+                <Package className="h-6 w-6 text-violet-600" />
                 </div>
                 <div>
                   <h3 className="font-semibold text-gray-900">컴포넌트 관리</h3>
diff --git a/frontend/components/admin/ExternalDbConnectionModal.tsx b/frontend/components/admin/ExternalDbConnectionModal.tsx
index b86050f8..4959f6fe 100644
--- a/frontend/components/admin/ExternalDbConnectionModal.tsx
+++ b/frontend/components/admin/ExternalDbConnectionModal.tsx
@@ -211,18 +211,17 @@ export const ExternalDbConnectionModal: React.FC<ExternalDbConnectionModalProps>
       setTestingConnection(true);
       setTestResult(null);
 
-      const testData: ConnectionTestRequest = {
-        db_type: formData.db_type,
-        host: formData.host,
-        port: formData.port,
-        database_name: formData.database_name,
-        username: formData.username,
-        password: formData.password,
-        connection_timeout: formData.connection_timeout,
-        ssl_enabled: formData.ssl_enabled,
-      };
+      // 편집 모드일 때만 연결 테스트 실행
+      if (!isEditMode || !connection?.id) {
+        toast({
+          title: "연결 테스트 불가",
+          description: "연결을 먼저 저장한 후 테스트할 수 있습니다.",
+          variant: "destructive",
+        });
+        return;
+      }
 
-      const result = await ExternalDbConnectionAPI.testConnection(testData);
+      const result = await ExternalDbConnectionAPI.testConnection(connection.id);
       setTestResult(result);
 
       if (result.success) {
diff --git a/frontend/components/layout/AppLayout.tsx b/frontend/components/layout/AppLayout.tsx
index f99c72f5..22cd259b 100644
--- a/frontend/components/layout/AppLayout.tsx
+++ b/frontend/components/layout/AppLayout.tsx
@@ -307,7 +307,11 @@ function AppLayoutInner({ children }: AppLayoutProps) {
       <div key={menu.id}>
         <div
           className={`group flex cursor-pointer items-center justify-between rounded-lg px-3 py-2 text-sm font-medium transition-colors hover:cursor-pointer ${
-            isExpanded ? "bg-slate-100 text-slate-900" : "text-slate-600 hover:bg-slate-50 hover:text-slate-900"
+            pathname === menu.url
+              ? "bg-gradient-to-br from-slate-100 to-blue-100/40 text-slate-900 border-l-4 border-blue-500"
+              : isExpanded
+                ? "bg-slate-100 text-slate-900"
+                : "text-slate-600 hover:bg-slate-50 hover:text-slate-900"
           } ${level > 0 ? "ml-6" : ""}`}
           onClick={() => handleMenuClick(menu)}
         >
@@ -328,7 +332,11 @@ function AppLayoutInner({ children }: AppLayoutProps) {
             {menu.children?.map((child: any) => (
               <div
                 key={child.id}
-                className="flex cursor-pointer items-center rounded-lg px-3 py-2 text-sm text-slate-600 transition-colors hover:cursor-pointer hover:bg-slate-50 hover:text-slate-900"
+                className={`flex cursor-pointer items-center rounded-lg px-3 py-2 text-sm transition-colors hover:cursor-pointer ${
+                  pathname === child.url
+                    ? "bg-gradient-to-br from-slate-100 to-blue-100/40 text-slate-900 border-l-4 border-blue-500"
+                    : "text-slate-600 hover:bg-slate-50 hover:text-slate-900"
+                }`}
                 onClick={() => handleMenuClick(child)}
               >
                 {child.icon}