Files
kjh2064 3f293d8aa8
deploy / deploy (push) Successful in 1m52s
deploy / notify (push) Successful in 1s
V13-FE-006: consolidate approved UI and contract hardening
2026-08-13 02:41:00 +09:00

127 lines
8.8 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!doctype html>
<html lang="ko">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'; style-src 'self'; img-src 'self' data:; connect-src 'self'; font-src 'self'; object-src 'none'; frame-src 'none'; worker-src 'none'; base-uri 'none'; frame-ancestors 'none'; form-action 'self'" />
<meta name="referrer" content="no-referrer" />
<meta name="color-scheme" content="light dark" />
<!-- FE Reference Lab v53 compatibility baseline retained for regression gates. -->
<!-- FE Reference Lab v54 compatibility baseline retained for regression gates. -->
<!-- FE Reference Lab v55 compatibility baseline retained for regression gates. -->
<title>KBX FE Reference Lab v60 · Canonical Status Contract · Runtime Evidence · Grid/Filter/Workflow Truth · T01~T09</title>
<link rel="stylesheet" href="./kbx-fe.css" />
</head>
<body>
<div id="app" class="kbx-app" data-density="compact" data-nav="expanded" data-module="COMMON">
<a class="skip-link" href="#workspace">본문 바로가기</a>
<header class="global-header">
<div class="brand-area">
<button id="homeButton" class="brand" type="button" aria-label="KBX 홈으로 이동">
<strong>KBX</strong><span>업무 플랫폼</span>
</button>
<label class="module-select"><span class="sr-only">업무 모듈</span>
<select id="moduleSelect"><option value="ALL">전체 모듈</option><option value="OMS">OMS</option><option value="ERP">ERP</option><option value="WMS">WMS</option><option value="COMMON">공통</option></select>
</label>
</div>
<button id="globalSearchButton" class="global-search" type="button" aria-keyshortcuts="Control+K">
<span>메뉴명 · 화면코드 · 업무명 검색</span><kbd>Ctrl K</kbd>
</button>
<div class="header-actions">
<button id="jobsButton" type="button" data-panel="jobs" aria-controls="systemPanel" aria-expanded="false">작업 <b>2</b></button>
<button id="noticeButton" type="button" data-panel="notice" aria-controls="systemPanel" aria-expanded="false">알림 <b>4</b></button>
<button id="densityButton" type="button" title="화면 밀도 전환">Compact</button>
<button id="themeButton" type="button" title="KBX Business 테마 전환" aria-label="어두운 테마로 변경"><span aria-hidden="true"></span> <span>Light</span></button>
<button type="button">사용자</button>
</div>
</header>
<div class="shell-body">
<aside id="sideNav" class="side-nav" aria-label="업무 메뉴">
<div class="side-nav-top">
<button id="sideHomeButton" class="nav-home active" type="button"><span aria-hidden="true"></span><span class="nav-label"></span></button>
<button id="collapseButton" class="collapse-button" type="button" aria-label="메뉴 접기" aria-expanded="true"></button>
</div>
<button id="sideSearchButton" class="side-search" type="button" aria-keyshortcuts="Control+K"><span class="nav-label">메뉴·화면 검색</span><kbd class="nav-label">Ctrl K</kbd><span class="collapsed-only" aria-hidden="true"></span></button>
<nav id="moduleSwitcher" class="module-switcher" aria-label="업무 모듈"></nav>
<div id="favoriteNav" class="personal-nav"></div>
<div id="recentNav" class="personal-nav"></div>
<div id="menuNav" class="menu-nav"></div>
</aside>
<main class="workspace-shell">
<nav id="workspaceTabs" class="workspace-tabs" role="tablist" aria-label="열린 업무"></nav>
<div id="workspace" class="workspace" tabindex="-1"></div>
</main>
</div>
<dialog id="menuSearchDialog" class="menu-search-dialog" aria-labelledby="menuSearchTitle">
<div class="search-dialog-shell">
<header><strong id="menuSearchTitle">업무 화면 검색</strong><button id="searchCloseButton" type="button" aria-label="닫기">×</button></header>
<label class="search-input-wrap"><span class="sr-only">검색어</span><input id="menuSearchInput" autocomplete="off" placeholder="예: 주문, 재고, OMS-ORD-001" role="combobox" aria-controls="menuSearchResults" /></label>
<div id="menuSearchResults" class="menu-search-results" role="listbox" aria-label="검색 결과"></div>
<footer><span>↑↓ 이동 · Enter 열기 · Esc 닫기</span><span>화면코드 검색 지원</span></footer>
</div>
</dialog>
<dialog id="unsavedDialog" class="confirm-dialog" aria-labelledby="unsavedTitle">
<form method="dialog" class="confirm-shell">
<header><strong id="unsavedTitle">저장하지 않은 변경사항이 있습니다.</strong></header>
<p id="unsavedMessage">변경사항을 저장하거나 버린 뒤 화면을 닫을 수 있습니다.</p>
<footer>
<button id="unsavedStay" value="cancel" class="btn" type="submit">계속 편집</button>
<button id="unsavedDiscard" value="discard" class="btn danger" type="button">변경 버리기</button>
<button id="unsavedSave" value="save" class="btn primary" type="button">저장 후 닫기</button>
</footer>
</form>
</dialog>
<dialog id="lookupDialog" class="lookup-dialog" aria-labelledby="lookupTitle">
<div class="lookup-dialog-shell">
<header><div><strong id="lookupTitle">업무 조회</strong><small id="lookupSubtitle">F2 조회</small></div><button id="lookupCloseButton" type="button" aria-label="닫기">×</button></header>
<form id="lookupSearchForm" class="lookup-search">
<label><span class="sr-only">검색어</span><input id="lookupSearchInput" autocomplete="off" maxlength="80" placeholder="코드 또는 명칭" /></label>
<button class="btn" type="submit">조회</button>
</form>
<div id="lookupResults" class="lookup-results" role="listbox" aria-label="조회 결과"></div>
<footer><span id="lookupStatus">↑↓ 이동 · Enter 선택 · Esc 닫기</span><button id="lookupSelectButton" class="btn primary" type="button">선택</button></footer>
</div>
</dialog>
<dialog id="quantityDialog" class="confirm-dialog" aria-labelledby="quantityTitle">
<form method="dialog" class="confirm-shell" id="quantityForm">
<header><strong id="quantityTitle">피킹 수량 입력</strong></header>
<label class="dialog-field"><span>수량</span><input id="quantityInput" type="number" inputmode="numeric" min="0" step="1" /></label>
<p class="dialog-help" id="quantityHelp">필요수량을 초과할 수 없습니다.</p>
<footer><button class="btn" value="cancel" type="submit">취소</button><button id="quantityApply" class="btn primary" type="button">적용</button></footer>
</form>
</dialog>
<dialog id="exceptionDialog" class="confirm-dialog" aria-labelledby="exceptionTitle">
<form method="dialog" class="confirm-shell" id="exceptionForm">
<header><strong id="exceptionTitle">재고부족 신고</strong></header>
<fieldset class="exception-options"><legend>사유</legend><label><input type="radio" name="exceptionReason" value="실물 없음" checked /> 실물 없음</label><label><input type="radio" name="exceptionReason" value="수량 부족" /> 수량 부족</label><label><input type="radio" name="exceptionReason" value="위치 오류" /> 위치 오류</label><label><input type="radio" name="exceptionReason" value="상품 이상" /> 상품 이상</label></fieldset>
<label class="dialog-field"><span>메모</span><textarea id="exceptionMemo" rows="3" maxlength="200" placeholder="선택 입력"></textarea></label>
<footer><button class="btn" value="cancel" type="submit">취소</button><button id="exceptionApply" class="btn primary" type="button">등록</button></footer>
</form>
</dialog>
<aside id="systemPanel" class="system-panel" hidden tabindex="-1" role="region" aria-labelledby="systemPanelTitle">
<header><strong id="systemPanelTitle">업무 센터</strong><button id="systemPanelClose" type="button" aria-label="패널 닫기">×</button></header>
<div id="systemPanelBody" class="system-panel-body"></div>
</aside>
<aside id="drawer" class="drawer" aria-hidden="true" role="dialog" aria-modal="true" aria-labelledby="drawerTitle" tabindex="-1">
<header><strong id="drawerTitle">상세</strong><button id="drawerClose" type="button" aria-label="닫기">×</button></header>
<div id="drawerBody" class="drawer-body"></div>
</aside>
<div id="drawerBackdrop" class="drawer-backdrop" hidden></div>
<div id="toastRegion" class="toast-region" aria-live="polite" aria-atomic="true"></div>
<div id="liveRegion" class="sr-only" aria-live="polite" aria-atomic="true"></div>
</div>
<script src="./kbx-fe.js"></script>
</body>
</html>