From 22591b62df04437bc89a963bbee24a8106dfcd5c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EA=B9=80=EB=B3=B4=EA=B3=A4?=
 <lightone2017@codebridge-x.com>
Date: Sun, 22 Mar 2026 21:07:30 +0900
Subject: [PATCH] =?UTF-8?q?fix:=20[RD]=20=EC=98=A8=EB=B3=B4=EB=94=A9=20?=
 =?UTF-8?q?=EA=B0=80=EC=9D=B4=EB=93=9C=20startDemoGuide=20=EC=A6=89?=
 =?UTF-8?q?=EC=8B=9C=20=EC=A0=95=EC=9D=98=20(ReferenceError=20=EC=88=98?=
 =?UTF-8?q?=EC=A0=95)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../views/rd/onboarding-guide/index.blade.php | 76 ++++++++-----------
 1 file changed, 30 insertions(+), 46 deletions(-)

diff --git a/resources/views/rd/onboarding-guide/index.blade.php b/resources/views/rd/onboarding-guide/index.blade.php
index 48a763e6..4c5712ae 100644
--- a/resources/views/rd/onboarding-guide/index.blade.php
+++ b/resources/views/rd/onboarding-guide/index.blade.php
@@ -249,54 +249,38 @@
 
 <!-- 스크립트: @section('content') 안에 배치하여 HTMX 스왑 시에도 실행 -->
 <script>
-(function() {
-    function init() {
-        if (typeof SamOnboarding === 'undefined') {
-            setTimeout(init, 100);
-            return;
-        }
+// 즉시 정의 (클릭 시 SamOnboarding 로드 대기)
+var _demoGuide = null;
+function startDemoGuide() {
+    if (!_demoGuide) return;
+    _demoGuide.reset();
+    _demoGuide.start();
+}
+function resetDemoGuide() {
+    if (!_demoGuide) return;
+    _demoGuide.reset();
+    _updateDemoStatus();
+}
+function _updateDemoStatus() {
+    var el = document.getElementById('demo-status');
+    if (!el || !_demoGuide) return;
+    el.innerHTML = _demoGuide.isCompleted()
+        ? '<span class="text-green-600"><i class="ri-check-line"></i> 데모 가이드 완료됨</span>'
+        : '<span class="text-gray-400">아직 체험하지 않음</span>';
+}
 
-        var demoGuide = new SamOnboarding('onboarding-demo', [
-            { element: '#demo-stat-card', title: '1. 통계 카드', description: '주요 지표를 한눈에 확인할 수 있는 통계 카드입니다.<br>실시간으로 업데이트되는 현황을 파악하세요.', side: 'bottom' },
-            { element: '#demo-progress-card', title: '2. 진행 현황', description: '전체 작업 대비 완료율을 보여줍니다.<br>목표 달성률을 추적하세요.', side: 'bottom' },
-            { element: '#demo-alert-card', title: '3. 주의 항목', description: '확인이 필요한 항목의 수를 표시합니다.<br>클릭하면 상세 목록으로 이동합니다.', side: 'bottom' },
-            { element: '#demo-btn-create', title: '4. 신규 등록', description: '새로운 항목을 등록할 수 있는 버튼입니다.<br>클릭하면 등록 폼이 열립니다.', side: 'bottom' },
-            { element: '#demo-btn-filter', title: '5. 필터', description: '날짜, 상태, 담당자 등 다양한 조건으로<br>데이터를 필터링할 수 있습니다.', side: 'bottom' },
-            { element: '#demo-data-table', title: '6. 데이터 목록', description: '등록된 데이터를 테이블 형태로 확인합니다.<br>행을 클릭하면 상세 페이지로 이동합니다.', side: 'top' },
-        ]);
+(function waitForOnboarding() {
+    if (typeof SamOnboarding === 'undefined') { setTimeout(waitForOnboarding, 100); return; }
 
-        window.startDemoGuide = function() { demoGuide.reset(); demoGuide.start(); };
-        window.resetDemoGuide = function() { demoGuide.reset(); updateStatus(); };
-
-        function updateStatus() {
-            var el = document.getElementById('demo-status');
-            if (!el) return;
-            el.innerHTML = demoGuide.isCompleted()
-                ? '<span class="text-green-600"><i class="ri-check-line"></i> 데모 가이드 완료됨</span>'
-                : '<span class="text-gray-400">아직 체험하지 않음</span>';
-        }
-
-        function renderPages() {
-            var keys = GuideRegistry.keys();
-            var list = document.getElementById('applied-pages-list');
-            var noMsg = document.getElementById('no-pages-msg');
-            if (!list || !noMsg) return;
-            if (keys.length === 0) { noMsg.style.display = ''; return; }
-            noMsg.style.display = 'none';
-            list.innerHTML = keys.map(function(key) {
-                var done = localStorage.getItem('sam_onboarding_' + key) === 'completed';
-                var badge = done
-                    ? '<span class="bg-green-100 text-green-700 px-2 py-1 rounded-full text-xs">완료</span>'
-                    : '<span class="bg-gray-100 text-gray-500 px-2 py-1 rounded-full text-xs">미완료</span>';
-                return '<div class="flex items-center justify-between p-3 rounded-lg border border-gray-100 hover:bg-gray-50"><div class="flex items-center gap-3"><i class="ri-file-text-line text-gray-400"></i><span class="text-sm font-medium text-gray-700">' + key + '</span></div><div class="flex items-center gap-2">' + badge + '</div></div>';
-            }).join('');
-        }
-
-        updateStatus();
-        renderPages();
-    }
-
-    init();
+    _demoGuide = new SamOnboarding('onboarding-demo', [
+        { element: '#demo-stat-card', title: '1. 통계 카드', description: '주요 지표를 한눈에 확인할 수 있는 통계 카드입니다.<br>실시간으로 업데이트되는 현황을 파악하세요.', side: 'bottom' },
+        { element: '#demo-progress-card', title: '2. 진행 현황', description: '전체 작업 대비 완료율을 보여줍니다.<br>목표 달성률을 추적하세요.', side: 'bottom' },
+        { element: '#demo-alert-card', title: '3. 주의 항목', description: '확인이 필요한 항목의 수를 표시합니다.<br>클릭하면 상세 목록으로 이동합니다.', side: 'bottom' },
+        { element: '#demo-btn-create', title: '4. 신규 등록', description: '새로운 항목을 등록할 수 있는 버튼입니다.<br>클릭하면 등록 폼이 열립니다.', side: 'bottom' },
+        { element: '#demo-btn-filter', title: '5. 필터', description: '날짜, 상태, 담당자 등 다양한 조건으로<br>데이터를 필터링할 수 있습니다.', side: 'bottom' },
+        { element: '#demo-data-table', title: '6. 데이터 목록', description: '등록된 데이터를 테이블 형태로 확인합니다.<br>행을 클릭하면 상세 페이지로 이동합니다.', side: 'top' },
+    ]);
+    _updateDemoStatus();
 })();
 </script>
 @endsection