97 lines
3.4 KiB
HTML
97 lines
3.4 KiB
HTML
<!doctype html>
|
|
<html lang="ko">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
<title>Air-Watcher Dashboard</title>
|
|
<link rel="stylesheet" href="/dashboard.css" />
|
|
</head>
|
|
<body>
|
|
<div class="page-gradient" aria-hidden="true"></div>
|
|
<main class="layout">
|
|
<header class="topbar panel">
|
|
<div>
|
|
<p class="eyebrow">AIR-WATCHER</p>
|
|
<h1>Flight Watch Dashboard</h1>
|
|
</div>
|
|
<div class="config" id="configBanner">초기화 중...</div>
|
|
</header>
|
|
|
|
<section class="panel composer">
|
|
<div class="section-title">
|
|
<h2>LLM 입력 파싱</h2>
|
|
<p>자연어를 넣으면 조회 조건을 자동 정리합니다.</p>
|
|
</div>
|
|
|
|
<label for="queryInput" class="label">항공권 요청 문장</label>
|
|
<textarea id="queryInput" rows="4" placeholder="예: 11월 말~12월 초 출발, 인천->마드리드, 20시간 이하, 비즈니스 2명"></textarea>
|
|
|
|
<div class="controls-grid">
|
|
<label class="switch-field">
|
|
<input id="useLlm" type="checkbox" checked />
|
|
<span>LLM 파싱 사용</span>
|
|
</label>
|
|
|
|
<label class="field">
|
|
<span>알림 기준</span>
|
|
<select id="alertOn">
|
|
<option value="both">가격변동 + 목표가</option>
|
|
<option value="change">가격변동만</option>
|
|
<option value="threshold">목표가만</option>
|
|
</select>
|
|
</label>
|
|
|
|
<label class="field">
|
|
<span>목표 가격 (원)</span>
|
|
<input id="targetPrice" type="number" min="1" step="1" placeholder="예: 1300000" />
|
|
</label>
|
|
</div>
|
|
|
|
<div class="action-row">
|
|
<button id="parseBtn" class="btn secondary">파싱만 실행</button>
|
|
<button id="createWatchBtn" class="btn primary">추적 추가</button>
|
|
</div>
|
|
|
|
<div id="parseSummary" class="summary empty">파싱 결과 요약이 여기에 표시됩니다.</div>
|
|
<pre id="parseOutput" class="json-view">{}</pre>
|
|
</section>
|
|
|
|
<section class="panel system-panel">
|
|
<div class="section-title">
|
|
<h2>전역 제어</h2>
|
|
<p>전체 추적 동작을 한 번에 켜고 끌 수 있습니다.</p>
|
|
</div>
|
|
|
|
<div class="toggle-row">
|
|
<label class="switch-field">
|
|
<input id="globalCrawling" type="checkbox" />
|
|
<span>전체 크롤링 ON/OFF</span>
|
|
</label>
|
|
<label class="switch-field">
|
|
<input id="globalAlerts" type="checkbox" />
|
|
<span>전체 알림 ON/OFF</span>
|
|
</label>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="panel watches-panel">
|
|
<div class="section-title">
|
|
<h2>추적 목록</h2>
|
|
<p>각 항목별로 크롤링/알림 토글을 조정하세요.</p>
|
|
</div>
|
|
<div id="watchList" class="watch-list empty">아직 등록된 watch가 없습니다.</div>
|
|
</section>
|
|
|
|
<section class="panel events-panel">
|
|
<div class="section-title">
|
|
<h2>최근 이벤트</h2>
|
|
<p>목표가 도달/가격 변동 이벤트를 확인합니다.</p>
|
|
</div>
|
|
<div id="eventList" class="event-list empty">이벤트가 아직 없습니다.</div>
|
|
</section>
|
|
</main>
|
|
|
|
<script src="/dashboard.js"></script>
|
|
</body>
|
|
</html>
|