171 lines
8.2 KiB
HTML
171 lines
8.2 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>Withdraw/Exchange</title>
|
|
<link rel="stylesheet" href="./style.css?v=20260529-0100" />
|
|
</head>
|
|
<body>
|
|
<div class="wallet-page" aria-label="Withdraw and exchange" data-i18n-aria="page_label">
|
|
<div class="hero-bg" aria-hidden="true"></div>
|
|
<nav class="title-bar">
|
|
<button class="back-button" type="button" aria-label="Back" data-i18n-aria="back">
|
|
<svg viewBox="0 0 32 32" aria-hidden="true">
|
|
<path d="M20 8 12 16l8 8" />
|
|
</svg>
|
|
</button>
|
|
<h1 data-i18n="title">Withdraw/Exchange</h1>
|
|
<div class="language-switcher">
|
|
<button class="language-button" type="button" aria-label="Change language" data-i18n-aria="language_button_aria" aria-expanded="false">EN</button>
|
|
<div class="language-menu" hidden>
|
|
<button type="button" data-lang="en">EN</button>
|
|
<button type="button" data-lang="ar">AR</button>
|
|
<button type="button" data-lang="tr">TR</button>
|
|
<button type="button" data-lang="id">ID</button>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<main class="content">
|
|
<section class="balance-card">
|
|
<div class="balance-head">
|
|
<div class="balance-label" data-i18n="available_income">salary</div>
|
|
<button class="balance-history-button" id="salaryHistoryButton" type="button" aria-label="Salary history" data-i18n-aria="salary_history">
|
|
<svg viewBox="0 0 24 24" aria-hidden="true">
|
|
<path d="m9 5 7 7-7 7" />
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
<div class="balance-value">
|
|
<span class="balance-currency" aria-hidden="true">$</span>
|
|
<span id="balanceAmount">0.00</span>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="salary-selector-card" id="salarySelector" hidden>
|
|
<div class="salary-selector-tabs">
|
|
<button class="salary-selector-tab" type="button" data-salary-type="BD_SALARY" data-i18n="bd_salary">BD salary</button>
|
|
<button class="salary-selector-tab" type="button" data-salary-type="BD_LEADER_SALARY" data-i18n="bd_leader_salary">BD Leader salary</button>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="mode-card">
|
|
<div class="mode-tabs" role="tablist" aria-label="Withdraw, exchange, or transfer">
|
|
<button class="mode-tab active" type="button" role="tab" aria-selected="true" data-mode="withdraw" data-i18n="withdraw">Withdraw</button>
|
|
<button class="mode-tab" type="button" role="tab" aria-selected="false" data-mode="exchange" data-i18n="exchange">Exchange</button>
|
|
<button class="mode-tab" type="button" role="tab" aria-selected="false" data-mode="transfer" data-i18n="transfer">Transfer</button>
|
|
</div>
|
|
|
|
<div class="mode-panel active" data-panel="withdraw">
|
|
<label class="field">
|
|
<span data-i18n="withdraw_amount">Withdraw amount</span>
|
|
<div class="field-control amount-control">
|
|
<span>$</span>
|
|
<input id="withdrawAmount" type="number" inputmode="decimal" min="50" step="0.01" aria-label="Withdraw amount" data-i18n-aria="withdraw_amount" />
|
|
</div>
|
|
</label>
|
|
<div class="hint-row">
|
|
<span data-i18n="minimum">Minimum 50 USD</span>
|
|
<button class="text-action" type="button" data-i18n="all">All</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mode-panel" data-panel="exchange">
|
|
<label class="field">
|
|
<span data-i18n="exchange_amount">Exchange amount</span>
|
|
<div class="field-control amount-control">
|
|
<span>$</span>
|
|
<input id="exchangeAmount" type="number" inputmode="decimal" min="0" step="0.01" aria-label="Exchange amount" data-i18n-aria="exchange_amount" />
|
|
</div>
|
|
</label>
|
|
<div class="exchange-preview">
|
|
<span data-i18n="exchange_rate">Exchange rate</span>
|
|
<strong id="exchangeRateText">1$ = 80000 golds</strong>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mode-panel" data-panel="transfer">
|
|
<label class="field">
|
|
<span data-i18n="transfer_to">Transfer to</span>
|
|
<div class="transfer-search">
|
|
<input id="transferAccount" type="text" inputmode="numeric" autocomplete="off" aria-label="Transfer to" data-i18n-aria="transfer_to" />
|
|
<button class="search-payee-button" id="searchPayeeButton" type="button" data-i18n="search">Search</button>
|
|
</div>
|
|
</label>
|
|
<div class="payee-result" id="payeeResult" hidden></div>
|
|
<label class="field transfer-amount-field">
|
|
<span data-i18n="transfer_amount">Transfer amount</span>
|
|
<div class="field-control amount-control">
|
|
<span>$</span>
|
|
<input id="transferAmount" type="number" inputmode="decimal" min="0" step="0.01" aria-label="Transfer amount" data-i18n-aria="transfer_amount" />
|
|
</div>
|
|
</label>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="card-section payment-section" data-payment-section>
|
|
<div class="section-head">
|
|
<div>
|
|
<div class="section-title" data-i18n="payment_method">USDT TRC20 address</div>
|
|
<div class="section-subtitle" data-i18n="payment_method_subtitle">Withdrawals are sent to your TRC20 USDT address.</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="empty-address-state">
|
|
<div class="empty-icon" aria-hidden="true">
|
|
<svg viewBox="0 0 32 32">
|
|
<path d="M9 16a5 5 0 0 1 5-5h3" />
|
|
<path d="M15 21h-3a5 5 0 0 1 0-10h3" />
|
|
<path d="M17 21h3a5 5 0 0 0 0-10h-3" />
|
|
<path d="M13 16h6" />
|
|
</svg>
|
|
</div>
|
|
<div>
|
|
<div class="empty-title" data-i18n="no_payment_info">No USDT address</div>
|
|
<div class="empty-copy" data-i18n="no_payment_info_copy">Fill in a TRC20 USDT address before withdrawing.</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="address-form" id="addressForm" hidden>
|
|
<label class="field">
|
|
<span data-i18n="trc20_address">TRC20 address</span>
|
|
<input id="trc20Address" type="text" autocomplete="off" />
|
|
</label>
|
|
<button class="primary-button" id="saveAddressButton" type="button" data-i18n="save_address">Save address</button>
|
|
</div>
|
|
|
|
<div class="bound-address-card" hidden>
|
|
<div class="network-badge" aria-hidden="true">TRC20</div>
|
|
<div class="bound-copy">
|
|
<div class="bound-network">USDT TRC20</div>
|
|
<div class="bound-address">-</div>
|
|
<div class="bound-meta" data-i18n="usdt_only">USDT only</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<button class="submit-button" type="button" disabled data-i18n="withdraw_now">Withdraw now</button>
|
|
</main>
|
|
|
|
<div class="toast" hidden></div>
|
|
<div class="salary-history-modal" id="salaryHistoryModal" hidden>
|
|
<div class="salary-history-backdrop" data-close-salary-history></div>
|
|
<section class="salary-history-dialog" role="dialog" aria-modal="true" aria-labelledby="salaryHistoryTitle">
|
|
<div class="salary-history-head">
|
|
<h2 id="salaryHistoryTitle" data-i18n="salary_history">Salary history</h2>
|
|
<button class="salary-history-close" type="button" aria-label="Close" data-i18n-aria="close" data-close-salary-history>×</button>
|
|
</div>
|
|
<div class="salary-history-summary">
|
|
<span data-i18n="available_income">salary</span>
|
|
<strong id="salaryHistoryTotal">$0.00</strong>
|
|
</div>
|
|
<div class="salary-history-list" id="salaryHistoryList"></div>
|
|
</section>
|
|
</div>
|
|
<div class="home-indicator" aria-hidden="true"></div>
|
|
</div>
|
|
<script src="./script.js?v=20260601-0100" defer></script>
|
|
</body>
|
|
</html>
|