# 5. OPC UA 서버 기능 (Phase 1) — 완료

src/Web/wwwroot/index.html

@@ -60,6 +60,11 @@
         <span class="ni">07</span>
         <span class="nl">이력 조회</span>
       </li>
+      <li class="nav-item" data-tab="opcsvr">
+        <span class="ni">08</span>
+        <span class="nl">OPC UA 서버</span>
+        <span class="nb" id="opcsvr-dot"></span>
+      </li>
     </ul>
 
     <div class="sb-foot">
@@ -538,6 +543,37 @@
   </main>
 </div>
 
+<!-- ══════════════════════════════════════════════════════
+     08  OPC UA 서버
+═══════════════════════════════════════════════════════ -->
+<section class="pane" id="pane-opcsvr">
+  <header class="pane-hdr">
+    <div>
+      <h1>OPC UA 서버</h1>
+      <p class="sub">ExperionCrawler를 OPC UA 서버로 동작시켜 외부 클라이언트에 실시간 값을 제공합니다.</p>
+    </div>
+  </header>
+
+  <!-- 상태 카드 -->
+  <div class="srv-status-card" id="srv-status-card">
+    <div class="srv-status-row">
+      <span class="dot" id="srv-dot"></span>
+      <span id="srv-status-txt" class="srv-label">상태 조회 중...</span>
+    </div>
+    <div class="srv-meta" id="srv-meta"></div>
+  </div>
+
+  <!-- 버튼 행 -->
+  <div class="row-btns" style="margin-top:12px">
+    <button class="btn-a" onclick="srvStart()">▶ 서버 시작</button>
+    <button class="btn-b" onclick="srvStop()">■ 서버 중지</button>
+    <button class="btn-b" onclick="srvRebuild()">↺ 주소공간 재구성</button>
+    <button class="btn-b" onclick="srvLoad()">↻ 상태 새로고침</button>
+  </div>
+
+  <div id="srv-log" class="log-box hidden" style="margin-top:16px"></div>
+</section>
+
 <!-- ── 날짜/시간 선택 팝업 ──────────────────────────────────── -->
 <div id="dt-overlay" class="dt-overlay hidden" onclick="dtCancel()"></div>
 <div id="dt-popup" class="dt-popup hidden">