SamProject/sam-manage
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: [RD] 온보딩 가이드 startDemoGuide 즉시 정의 (ReferenceError 수정)

Browse Source
This commit is contained in:
김보곤
2026-03-22 21:07:30 +09:00
parent 47cc16ba03
commit 22591b62df
1 changed files with 30 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files

76
resources/views/rd/onboarding-guide/index.blade.php
View File

@@ -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