Initial dashboard organization setup

2026-03-25 10:26:33 +09:00
commit d9023abed6
22 changed files with 5340 additions and 0 deletions
--- a/frontend/public/index.html
+++ b/frontend/public/index.html
@@ -0,0 +1,79 @@
+<!DOCTYPE html>
+<html lang="ko">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>MH Dashboard Hub</title>
+  <link rel="preconnect" href="https://fonts.googleapis.com">
+  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+  <link href="https://fonts.googleapis.com/css2?family=SUIT:wght@400;500;700;800&display=swap" rel="stylesheet">
+  <link rel="stylesheet" href="/styles.css">
+</head>
+<body>
+  <div class="app-shell">
+    <section class="panel hero" id="login-panel">
+      <div class="hero-copy">
+        <p class="eyebrow">Intranet Preview</p>
+        <h1>MH Dashboard Hub</h1>
+        <p class="hero-text">
+          현재 단계에서는 화면상 로그인만 우선 적용합니다. 로그인 후 조직도 레거시 화면과
+          서버 준비 상태를 한 곳에서 확인할 수 있습니다.
+        </p>
+      </div>
+      <form id="login-form" class="login-card">
+        <label>
+          <span>아이디</span>
+          <input name="username" type="text" placeholder="예: admin" required>
+        </label>
+        <label>
+          <span>비밀번호</span>
+          <input name="password" type="password" placeholder="아무 값이나 입력" required>
+        </label>
+        <button type="submit">대시보드 입장</button>
+        <p id="login-message" class="helper-text">사내망용 임시 로그인 화면입니다.</p>
+      </form>
+    </section>
+
+    <section id="dashboard-panel" class="hidden">
+      <header class="topbar">
+        <div>
+          <p class="eyebrow">Internal Dashboard</p>
+          <h2>조직 관리 허브</h2>
+        </div>
+        <div class="topbar-actions">
+          <span id="user-badge" class="badge"></span>
+          <button id="logout-btn" class="secondary">로그아웃</button>
+        </div>
+      </header>
+
+      <main class="grid">
+        <article class="panel card">
+          <p class="eyebrow">Legacy Module</p>
+          <h3>조직도 관리</h3>
+          <p>기존 단일 HTML 조직도 도구를 보존한 상태로 연결했습니다.</p>
+          <a class="primary-link" href="/organization.html">레거시 조직도 열기</a>
+        </article>
+
+        <article class="panel card">
+          <p class="eyebrow">API Readiness</p>
+          <h3>서버 상태</h3>
+          <p id="health-status">서버 상태를 확인하는 중입니다.</p>
+          <button id="refresh-health-btn" class="secondary">상태 새로고침</button>
+        </article>
+
+        <article class="panel card">
+          <p class="eyebrow">Roadmap</p>
+          <h3>다음 단계</h3>
+          <ul class="roadmap">
+            <li>프로필 사진 업로드 API 연결</li>
+            <li>좌석 배치도 좌표 저장 기능 연결</li>
+            <li>월말 스냅샷 자동화</li>
+          </ul>
+        </article>
+      </main>
+    </section>
+  </div>
+  <script src="/app.js"></script>
+</body>
+</html>
+