112 lines
5.6 KiB
HTML
112 lines
5.6 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover" />
|
|
<title>Host Center</title>
|
|
<link rel="stylesheet" href="./host-center.css" />
|
|
</head>
|
|
<body>
|
|
<div class="host-center">
|
|
<header class="page-header">
|
|
<button class="header-icon" type="button" data-action="back" aria-label="Back"><img id="backIcon" alt="" /></button>
|
|
<h1 data-i18n="host_center">Host Center</h1>
|
|
<button class="lang-button" type="button" data-action="language">EN</button>
|
|
</header>
|
|
|
|
<main class="page-content">
|
|
<section class="section-title" data-i18n="my_agency">My agency</section>
|
|
|
|
<section class="surface-card agency-card">
|
|
<div class="avatar">
|
|
<img id="agencyAvatar" src="" alt="" />
|
|
<span id="avatarFallback">U</span>
|
|
</div>
|
|
<div class="user-info">
|
|
<div id="agencyName" class="agency-name">-</div>
|
|
<div class="agency-id"><span data-i18n="user_id_prefix">ID:</span> <span id="agencyId">-</span></div>
|
|
</div>
|
|
<button class="leave-button" type="button" data-action="leave" data-i18n="leave">Leave</button>
|
|
</section>
|
|
|
|
<section class="surface-card salary-card">
|
|
<div class="card-row">
|
|
<div class="card-title" data-i18n="my_available_salary">My available salary</div>
|
|
<button class="text-link" type="button" data-route="/history-salary" data-i18n="my_salary_details">My salary details</button>
|
|
</div>
|
|
<div class="salary-value"><img id="moneyIcon" class="money-icon" alt="" /><span id="currentSalary">0</span></div>
|
|
</section>
|
|
|
|
<section class="surface-card task-card">
|
|
<div class="task-title" data-i18n="todays_task">Today's task</div>
|
|
<div class="task-grid">
|
|
<div class="task-item">
|
|
<div class="task-label" data-i18n="anchor_type">Anchor type</div>
|
|
<div class="task-value" id="anchorType">Chat</div>
|
|
</div>
|
|
<div class="task-item">
|
|
<div class="task-label" data-i18n="minutes">Minutes</div>
|
|
<div class="task-value"><span id="minutesProgress">0</span>/<span id="minutesTotal">120</span></div>
|
|
</div>
|
|
<div class="task-item">
|
|
<div class="task-label" data-i18n="gift_task">Gift Task</div>
|
|
<div class="task-value" id="giftTask">0</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="surface-card menu-card">
|
|
<button class="menu-row" type="button" data-route="/platform-policy?from=hostcenter">
|
|
<span class="menu-main"><img class="menu-icon" id="policyIcon" alt="" /><span data-i18n="platform_policy">Platform policy</span></span>
|
|
<img class="arrow-icon" id="arrowIcon1" alt="" />
|
|
</button>
|
|
<div class="divider"></div>
|
|
<button class="menu-row" type="button" data-route="/exchange-gold-coins">
|
|
<span class="menu-main"><img class="menu-icon" id="exchangeIcon" alt="" /><span data-i18n="exchange_coins">Exchange coins</span></span>
|
|
<img class="arrow-icon" id="arrowIcon2" alt="" />
|
|
</button>
|
|
<div class="divider"></div>
|
|
<button class="menu-row" type="button" data-route="/transfer">
|
|
<span class="menu-main"><img class="menu-icon" id="transferIcon" alt="" /><span data-i18n="transfer">Transfer</span></span>
|
|
<img class="arrow-icon" id="arrowIcon3" alt="" />
|
|
</button>
|
|
<div class="divider" id="cashDivider" hidden></div>
|
|
<button class="menu-row" type="button" data-action="cash-withdraw" id="cashWithdrawRow" hidden>
|
|
<span class="menu-main"><img class="menu-icon" id="withdrawIcon" alt="" /><span data-i18n="cash_withdraw">Cash withdraw</span></span>
|
|
<img class="arrow-icon" id="arrowIcon4" alt="" />
|
|
</button>
|
|
<div class="divider"></div>
|
|
<button class="menu-row" type="button" data-route="/host-setting">
|
|
<span class="menu-main"><img class="menu-icon" id="bankIcon" alt="" /><span data-i18n="bank_accounts">Bank accounts</span></span>
|
|
<img class="arrow-icon" id="arrowIcon5" alt="" />
|
|
</button>
|
|
</section>
|
|
</main>
|
|
|
|
<div class="toast" id="toast" hidden></div>
|
|
|
|
<div class="modal-layer" id="infoMissingModal" hidden>
|
|
<div class="modal-card">
|
|
<div class="modal-title" data-i18n="prompt">Prompt</div>
|
|
<div class="modal-message" data-i18n="fill_info_tips">Please complete your information first.</div>
|
|
<div class="modal-submessage" data-i18n="card_issue_tips">Please make sure your bank card and KYC information are available.</div>
|
|
<button class="modal-primary" type="button" data-action="improve" data-i18n="to_improve">To improve</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="modal-layer" id="leaveModal" hidden>
|
|
<div class="modal-card">
|
|
<div class="modal-title" data-i18n="tips">Tips</div>
|
|
<div class="modal-message" data-i18n="leave_agent_tips">Are you sure you want to leave?</div>
|
|
<div class="modal-actions">
|
|
<button class="modal-secondary" type="button" data-action="cancel-leave" data-i18n="cancel">Cancel</button>
|
|
<button class="modal-primary" type="button" data-action="confirm-leave" data-i18n="confirm">Confirm</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script type="module" src="./host-center.js"></script>
|
|
</body>
|
|
</html>
|