mirror of
https://github.com/tiennm99/artemis-demo-agent.git
synced 2026-09-04 14:19:45 +00:00
174 lines
7.2 KiB
HTML
174 lines
7.2 KiB
HTML
<!doctype html>
|
||
<html lang="vi">
|
||
<head>
|
||
<meta charset="utf-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||
<title>Vũ trụ đồ đạc - Phiên chợ trên mây</title>
|
||
<link rel="stylesheet" href="styles.css?v=backend-v18" />
|
||
</head>
|
||
<body>
|
||
<section id="loginPanel" class="login-panel" aria-label="Đăng nhập domain">
|
||
<form id="loginForm" class="login-form">
|
||
<h2>Vũ trụ đồ đạc - Phiên chợ trên mây</h2>
|
||
<p>Hãy nhập domain để Artemis ghi nhớ tín hiệu và gửi thông báo radar về đúng bạn nhé.</p>
|
||
<input id="loginDomain" type="text" placeholder="Nhập domain của bạn" required />
|
||
<input id="loginPassword" type="password" placeholder="Mật khẩu domain của bạn" />
|
||
<p id="loginStatus" class="login-status" aria-live="polite"></p>
|
||
<button type="submit">Bay vào vũ trụ</button>
|
||
</form>
|
||
</section>
|
||
|
||
<main class="page">
|
||
<section class="hero" aria-label="Vũ trụ đồ đạc">
|
||
<img class="asteroid asteroid-left" src="assets/asteroid-left.png" alt="" />
|
||
<img class="asteroid asteroid-right" src="assets/asteroid-right.png" alt="" />
|
||
|
||
<button id="notificationButton" class="notification-button" type="button" aria-label="Ô thông báo">
|
||
<img src="assets/notification-icon.png" alt="" />
|
||
<span id="notificationBadge">0</span>
|
||
</button>
|
||
|
||
<header class="title-block">
|
||
<h1>Vũ trụ đồ đạc</h1>
|
||
<p>giúp Starter tìm đồ thất lạc</p>
|
||
<div id="signalStats" class="signal-stats" aria-label="Số liệu tín hiệu"></div>
|
||
</header>
|
||
|
||
<section class="moon-stage" aria-label="Starter Galaxy Agent">
|
||
<div id="radarWordCloud" class="radar-word-cloud" aria-hidden="true"></div>
|
||
<img class="moon" src="assets/moon.png" alt="" />
|
||
<div id="moonText" class="moon-text"></div>
|
||
</section>
|
||
|
||
<form id="chatForm" class="chat-bar" aria-label="Khung chat">
|
||
<label class="chat-image-button" title="Thêm ảnh vật phẩm">
|
||
Ảnh
|
||
<input id="chatImage" type="file" accept="image/*" />
|
||
</label>
|
||
<input id="chatInput" type="text" autocomplete="off" placeholder="Nhắn với radar..." />
|
||
<button type="submit">Gửi</button>
|
||
</form>
|
||
|
||
<div id="choiceRail" class="choice-rail" aria-label="Lựa chọn nhanh"></div>
|
||
</section>
|
||
|
||
<section class="market" aria-label="Phiên chợ trên mây">
|
||
<div class="market-divider"></div>
|
||
<header class="market-heading">
|
||
<h2>Phiên chợ trên mây</h2>
|
||
<p>match người pass với người cần</p>
|
||
</header>
|
||
|
||
<form id="marketSearchForm" class="market-search" aria-label="Tìm vật phẩm trên phiên chợ">
|
||
<label for="marketSearchInput">Starter cần mua gì?</label>
|
||
<div>
|
||
<input id="marketSearchInput" type="text" autocomplete="off" placeholder="Nhập từ khóa món đồ..." />
|
||
<button type="submit">Dò mây</button>
|
||
</div>
|
||
<p id="marketSearchStatus" aria-live="polite"></p>
|
||
</form>
|
||
|
||
<div id="marketGrid" class="market-grid"></div>
|
||
|
||
<button id="openLaunchForm" class="launch-button" type="button">
|
||
<img src="assets/rocket.png" alt="" />
|
||
<span>Phóng<br />vật phẩm<br />lên chợ</span>
|
||
</button>
|
||
|
||
<button id="openAdminPanel" class="admin-button" type="button" hidden>Artemis duyệt chợ</button>
|
||
</section>
|
||
|
||
<section id="launchPanel" class="launch-panel" aria-label="Đăng vật phẩm lên chợ" hidden>
|
||
<form id="marketForm" class="launch-form" novalidate>
|
||
<div class="form-heading">
|
||
<h3>Phóng vật phẩm lên chợ</h3>
|
||
<button id="closeLaunchForm" type="button" aria-label="Đóng">×</button>
|
||
</div>
|
||
|
||
<div id="launchWizard" class="launch-wizard" hidden>
|
||
<div id="launchWizardMessages" class="launch-wizard-messages"></div>
|
||
<div class="launch-wizard-input">
|
||
<input id="launchWizardInput" type="text" autocomplete="off" />
|
||
<button id="launchWizardNext" type="button">Gửi</button>
|
||
</div>
|
||
</div>
|
||
|
||
<label data-market-field="name">
|
||
Tên vật phẩm
|
||
<input id="marketName" type="text" maxlength="60" placeholder="Tối đa 5 từ" required />
|
||
</label>
|
||
|
||
<label data-market-field="quantity">
|
||
Số lượng
|
||
<input id="marketQuantity" type="number" min="1" value="1" required />
|
||
</label>
|
||
|
||
<label data-market-field="description">
|
||
Mô tả sản phẩm hoặc link thông tin
|
||
<textarea id="marketDescription" rows="3" maxlength="900" placeholder="Tối đa 99 từ" required></textarea>
|
||
</label>
|
||
|
||
<label data-market-field="price">
|
||
Giá hữu nghị
|
||
<input id="marketPrice" type="text" inputmode="numeric" placeholder="150,000" required />
|
||
</label>
|
||
|
||
<label data-market-field="image">
|
||
Ảnh đính kèm
|
||
<input id="marketImage" type="file" accept="image/*" required />
|
||
</label>
|
||
|
||
<label class="stock-field" hidden>
|
||
Trạng thái
|
||
<select id="marketStockStatus">
|
||
<option value="Còn hàng">Còn hàng</option>
|
||
<option value="Hết hàng">Hết hàng</option>
|
||
</select>
|
||
</label>
|
||
|
||
<label data-market-field="contact">
|
||
Contact
|
||
<input id="marketContact" type="text" placeholder="nguyetntm5" required />
|
||
</label>
|
||
|
||
<button class="submit-launch" type="submit">Submit</button>
|
||
<p id="launchStatus" class="launch-status" aria-live="polite"></p>
|
||
</form>
|
||
</section>
|
||
|
||
<section id="notificationPanel" class="notification-panel" aria-label="Ô thông báo" hidden>
|
||
<div class="notification-card">
|
||
<button id="closeNotificationPanel" type="button" aria-label="Đóng">×</button>
|
||
<h3>Ô thông báo</h3>
|
||
<div id="notificationList">
|
||
<p class="empty-note">Chưa có tín hiệu mới.</p>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="adminPanel" class="notification-panel" aria-label="Admin duyệt vật phẩm" hidden>
|
||
<div class="notification-card admin-card">
|
||
<button id="closeAdminPanel" type="button" aria-label="Đóng">×</button>
|
||
<h3>Artemis duyệt chợ</h3>
|
||
<div id="adminList" class="admin-list"></div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="detailPanel" class="notification-panel" aria-label="Chi tiết vật phẩm" hidden>
|
||
<div class="notification-card">
|
||
<button id="closeDetailPanel" type="button" aria-label="Đóng">×</button>
|
||
<h3 id="detailTitle">Chi tiết vật phẩm</h3>
|
||
<div id="detailContent" class="detail-grid"></div>
|
||
</div>
|
||
</section>
|
||
|
||
<button id="backToTop" class="back-to-top" type="button" aria-label="Lên đầu trang" hidden>
|
||
↑
|
||
</button>
|
||
</main>
|
||
|
||
<script src="app.js?v=backend-v18"></script>
|
||
</body>
|
||
</html>
|
||
|