292 lines
12 KiB
HTML
292 lines
12 KiB
HTML
<!doctype html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="UTF-8" />
|
||
<meta
|
||
name="viewport"
|
||
content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, viewport-fit=cover"
|
||
/>
|
||
<title>BD Center</title>
|
||
<link rel="stylesheet" href="../../../common/theme.css" />
|
||
<link rel="stylesheet" href="../../packages/ui/center.css" />
|
||
<link rel="stylesheet" href="./style.css" />
|
||
<script src="../../packages/core/product-context.js"></script>
|
||
<script src="../../products/fami/product.js"></script>
|
||
</head>
|
||
<body>
|
||
<div class="guild-center fami-bd-center">
|
||
<header class="center-header">
|
||
<button
|
||
class="icon-button"
|
||
id="backButton"
|
||
type="button"
|
||
data-i18n-aria="fami_common.back"
|
||
aria-label="Back"
|
||
>
|
||
<span aria-hidden="true">‹</span>
|
||
</button>
|
||
<h1 data-i18n="fami_bd.title">BD Center</h1>
|
||
<div class="language-switcher">
|
||
<button
|
||
class="language-button"
|
||
type="button"
|
||
data-language-toggle
|
||
data-current-lang
|
||
aria-expanded="false"
|
||
data-i18n-aria="fami_common.change_language"
|
||
aria-label="Change language"
|
||
>
|
||
EN
|
||
</button>
|
||
<div class="language-menu" data-language-menu hidden>
|
||
<button type="button" data-lang-option="en">EN</button
|
||
><button type="button" data-lang-option="ar">AR</button
|
||
><button type="button" data-lang-option="tr">TR</button
|
||
><button type="button" data-lang-option="es">ES</button>
|
||
</div>
|
||
</div>
|
||
</header>
|
||
|
||
<main class="guild-center__content" aria-live="polite">
|
||
<section class="guild-card profile-card">
|
||
<div class="profile-avatar">
|
||
<img id="profileAvatar" alt="" hidden /><span
|
||
id="profileInitial"
|
||
aria-hidden="true"
|
||
>B</span
|
||
>
|
||
</div>
|
||
<div class="profile-copy">
|
||
<span class="role-pill">BD</span
|
||
><strong id="profileName">—</strong
|
||
><span id="profileUID">UID: —</span>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="guild-card contact-card">
|
||
<span class="contact-icon" aria-hidden="true">☎</span>
|
||
<div>
|
||
<strong data-i18n="fami_bd.contact">WhatsApp</strong
|
||
><span id="contactValue">—</span>
|
||
</div>
|
||
<button
|
||
id="editContactButton"
|
||
type="button"
|
||
data-i18n="fami_common.edit"
|
||
>
|
||
Edit
|
||
</button>
|
||
</section>
|
||
|
||
<button
|
||
class="add-agency-card"
|
||
id="addAgencyButton"
|
||
type="button"
|
||
>
|
||
<span aria-hidden="true">＋</span
|
||
><span data-i18n="fami_bd.add_agency">Add agency</span>
|
||
</button>
|
||
|
||
<section class="data-section" aria-labelledby="dataTitle">
|
||
<div class="section-title-row">
|
||
<h2 id="dataTitle" data-i18n="fami_bd.agency_data">
|
||
Agency data
|
||
</h2>
|
||
<span id="rangeCaption"></span>
|
||
</div>
|
||
<div
|
||
class="guild-filter-bar"
|
||
id="rangeFilters"
|
||
role="group"
|
||
data-i18n-aria="fami_range.label"
|
||
aria-label="Date range"
|
||
>
|
||
<button
|
||
type="button"
|
||
data-range="today"
|
||
data-i18n="fami_range.today"
|
||
>
|
||
Today</button
|
||
><button
|
||
type="button"
|
||
data-range="yesterday"
|
||
data-i18n="fami_range.yesterday"
|
||
>
|
||
Yesterday</button
|
||
><button
|
||
type="button"
|
||
data-range="last_7_days"
|
||
data-i18n="fami_range.last_7_days"
|
||
>
|
||
Last 7 days</button
|
||
><button
|
||
type="button"
|
||
data-range="last_30_days"
|
||
data-i18n="fami_range.last_30_days"
|
||
>
|
||
Last 30 days</button
|
||
><button
|
||
type="button"
|
||
data-range="this_month"
|
||
data-i18n="fami_range.this_month"
|
||
>
|
||
This month</button
|
||
><button
|
||
type="button"
|
||
data-range="last_month"
|
||
data-i18n="fami_range.last_month"
|
||
>
|
||
Last month</button
|
||
><button
|
||
type="button"
|
||
data-range="custom"
|
||
data-i18n="fami_range.custom"
|
||
>
|
||
Custom
|
||
</button>
|
||
</div>
|
||
<div class="stats-status" id="statsStatus" hidden></div>
|
||
<div class="guild-card agency-table-shell">
|
||
<table class="agency-table">
|
||
<thead>
|
||
<tr>
|
||
<th data-i18n="fami_bd.agency">Agency</th>
|
||
<th data-i18n="fami_bd.owner_id">
|
||
Owner ID
|
||
</th>
|
||
<th data-i18n="fami_bd.country">Country</th>
|
||
<th data-i18n="fami_agency.total_hosts">
|
||
Total hosts
|
||
</th>
|
||
<th data-i18n="fami_agency.gifted_hosts">
|
||
Gifted hosts
|
||
</th>
|
||
<th data-i18n="fami_bd.diamond_earnings">
|
||
Agency diamond earnings
|
||
</th>
|
||
<th data-i18n="fami_bd.joined_at">
|
||
Joined
|
||
</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody id="agencyTableBody"></tbody>
|
||
</table>
|
||
<div
|
||
class="empty-state"
|
||
id="agencyEmpty"
|
||
hidden
|
||
data-i18n="fami_bd.no_agencies"
|
||
>
|
||
No agencies yet.
|
||
</div>
|
||
</div>
|
||
</section>
|
||
</main>
|
||
|
||
<dialog class="edit-dialog" id="contactDialog">
|
||
<form method="dialog" id="contactForm">
|
||
<h2 data-i18n="fami_bd.edit_contact">Edit WhatsApp</h2>
|
||
<label
|
||
><span data-i18n="fami_agency.contact_number"
|
||
>Contact number</span
|
||
><input
|
||
id="contactInput"
|
||
type="text"
|
||
maxlength="64"
|
||
autocomplete="tel"
|
||
/></label>
|
||
<div class="dialog-actions">
|
||
<button
|
||
type="button"
|
||
id="cancelContactButton"
|
||
data-i18n="fami_common.cancel"
|
||
>
|
||
Cancel</button
|
||
><button
|
||
class="primary-action"
|
||
type="submit"
|
||
data-i18n="fami_common.save"
|
||
>
|
||
Save
|
||
</button>
|
||
</div>
|
||
</form>
|
||
</dialog>
|
||
<dialog class="edit-dialog" id="rangeDialog">
|
||
<form method="dialog" id="rangeForm">
|
||
<h2 data-i18n="fami_range.custom_title">
|
||
Custom date range
|
||
</h2>
|
||
<label
|
||
><span data-i18n="fami_range.start">Start date</span
|
||
><input id="rangeStart" type="date" required /></label
|
||
><label
|
||
><span data-i18n="fami_range.end">End date</span
|
||
><input id="rangeEnd" type="date" required
|
||
/></label>
|
||
<div class="dialog-actions">
|
||
<button
|
||
type="button"
|
||
id="cancelRangeButton"
|
||
data-i18n="fami_common.cancel"
|
||
>
|
||
Cancel</button
|
||
><button
|
||
class="primary-action"
|
||
type="submit"
|
||
data-i18n="fami_common.apply"
|
||
>
|
||
Apply
|
||
</button>
|
||
</div>
|
||
</form>
|
||
</dialog>
|
||
<dialog class="edit-dialog" id="inviteDialog">
|
||
<form method="dialog" id="inviteForm">
|
||
<h2 data-i18n="fami_bd.add_agency">Add agency</h2>
|
||
<p data-i18n="fami_bd.invite_hint">
|
||
Enter the future agency owner's display ID. The agency
|
||
is created after the invitation is accepted.
|
||
</p>
|
||
<label
|
||
><span data-i18n="fami_bd.owner_id">Owner ID</span
|
||
><input
|
||
id="ownerDisplayID"
|
||
type="text"
|
||
inputmode="numeric"
|
||
maxlength="32"
|
||
required /></label
|
||
><label
|
||
><span data-i18n="fami_bd.agency_name">Agency name</span
|
||
><input id="agencyNameInput" type="text" maxlength="64"
|
||
/></label>
|
||
<div class="dialog-actions">
|
||
<button
|
||
type="button"
|
||
id="cancelInviteButton"
|
||
data-i18n="fami_common.cancel"
|
||
>
|
||
Cancel</button
|
||
><button
|
||
class="primary-action"
|
||
type="submit"
|
||
data-i18n="fami_agency.send_invite"
|
||
>
|
||
Send invite
|
||
</button>
|
||
</div>
|
||
</form>
|
||
</dialog>
|
||
</div>
|
||
|
||
<script src="../../../common/api.js"></script>
|
||
<script src="../../../common/params.js"></script>
|
||
<script src="../../../common/i18n.js"></script>
|
||
<script src="../../../common/jsbridge.js"></script>
|
||
<script src="../../../common/toast.js"></script>
|
||
<script src="../../packages/core/date-range.js"></script>
|
||
<script src="../../packages/bd-center/bd-center.js"></script>
|
||
<script src="./script.js"></script>
|
||
</body>
|
||
</html>
|