admin 권한설정 완료, 교육과정 작업중1

src/app/admin/courses/page.tsx

@@ -1,27 +1,67 @@
 'use client';
 
+import { useState } from "react";
 import AdminSidebar from "@/app/components/AdminSidebar";
+import CourseRegistrationModal from "./CourseRegistrationModal";
 
 export default function AdminCoursesPage() {
+  const [totalCount, setTotalCount] = useState(0);
+  const [isModalOpen, setIsModalOpen] = useState(false);
+
   return (
     <div className="min-h-screen flex flex-col bg-white">
-      <div className="flex flex-1 min-h-0">
-        <AdminSidebar />
-
-        <main className="flex-1 min-w-0 bg-white">
-          <div className="h-full flex flex-col">
-            <div className="h-[100px] flex items-center px-8 border-b border-[#dee1e6]">
-              <h1 className="text-[24px] font-bold leading-[1.5] text-[#1b2027]">
-                교육과정 관리
-              </h1>
-            </div>
-
-            <div className="flex-1 px-8 pt-8 pb-20">
-            </div>
+      {/* 메인 레이아웃 */}
+      <div className="flex flex-1 min-h-0 justify-center">
+        <div className="w-full max-w-[1120px] flex min-h-0">
+          {/* 사이드바 */}
+          <div className="px-8 flex">
+            <AdminSidebar />
           </div>
-        </main>
+
+          {/* 메인 콘텐츠 */}
+          <main className="flex-1 min-w-0 bg-white">
+            <div className="h-full flex flex-col">
+              {/* 제목 영역 */}
+              <div className="h-[100px] flex items-center">
+                <h1 className="text-[24px] font-bold leading-[1.5] text-[#1b2027]">
+                  교육과정 관리
+                </h1>
+              </div>
+
+              {/* 헤더 영역 (제목과 콘텐츠 사이) */}
+              <div className="pt-8 pb-4 flex items-center justify-between">
+                <p className="text-[15px] font-medium leading-[1.5] text-[#333c47] whitespace-nowrap">
+                  총 {totalCount}건
+                </p>
+                <button
+                  type="button"
+                  onClick={() => setIsModalOpen(true)}
+                  className="h-[40px] px-4 rounded-[8px] bg-[#1f2b91] text-[16px] font-semibold leading-[1.5] text-white whitespace-nowrap hover:bg-[#1a2478] transition-colors"
+                >
+                  등록하기
+                </button>
+              </div>
+
+              {/* 콘텐츠 영역 */}
+              <div className="flex-1 pt-2 pb-20 flex flex-col">
+                <div className="rounded-[8px] border border-[#dee1e6] bg-[#fafbfc] min-h-[398px] flex items-center justify-center">
+                  <p className="text-[15px] font-normal text-[#858fa3]">
+                    <span className="block w-full text-center">
+                      등록된 교육과정이 없습니다.
+                      <br />
+                      과목을 등록해주세요.
+                    </span>
+                  </p>
+                </div>
+              </div>
+            </div>
+          </main>
+        </div>
       </div>
+      <CourseRegistrationModal
+        open={isModalOpen}
+        onClose={() => setIsModalOpen(false)}
+      />
     </div>
   );
-}
-
+}