1127 lines
38 KiB
JavaScript
1127 lines
38 KiB
JavaScript
(function () {
|
||
var FIRST_BILL_MONTH = '2026-06';
|
||
var BD_SALARY_ASSET = 'BD_SALARY_USD';
|
||
|
||
var data = {
|
||
profile: null,
|
||
balance: { available: 0 },
|
||
billMonth: currentMonth(),
|
||
agencyBill: {
|
||
agencyNumber: 0,
|
||
totalSalary: 0,
|
||
totalRecharge: 0,
|
||
memberBillList: [],
|
||
},
|
||
inviteRecords: [],
|
||
};
|
||
|
||
var state = {
|
||
billMonth: normalizeBillMonth(data.billMonth),
|
||
inviteQuery: '',
|
||
inviteMode: 'records',
|
||
inviteStatus: '',
|
||
inviteStatusType: '',
|
||
searched: [],
|
||
inviting: {},
|
||
messages: [],
|
||
processingMessages: {},
|
||
searching: false,
|
||
loading: true,
|
||
};
|
||
|
||
function $(id) {
|
||
return document.getElementById(id);
|
||
}
|
||
|
||
function api() {
|
||
return window.HyAppAPI || {};
|
||
}
|
||
|
||
function centerAPI() {
|
||
return api().bdCenter || null;
|
||
}
|
||
|
||
function t(key, fallback) {
|
||
return window.HyAppI18n && window.HyAppI18n.t
|
||
? window.HyAppI18n.t(key, fallback)
|
||
: fallback || key;
|
||
}
|
||
|
||
function avatarData(text, background, foreground) {
|
||
var raw =
|
||
String(text || 'B')
|
||
.trim()
|
||
.charAt(0) || 'B';
|
||
var letter = raw.replace(/[<>&"']/g, '');
|
||
var svg =
|
||
'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 96 96">' +
|
||
'<rect width="96" height="96" rx="48" fill="' +
|
||
background +
|
||
'"/>' +
|
||
'<text x="50%" y="54%" text-anchor="middle" dominant-baseline="middle" fill="' +
|
||
foreground +
|
||
'" font-family="Arial, sans-serif" font-size="38" font-weight="800">' +
|
||
letter +
|
||
'</text>' +
|
||
'</svg>';
|
||
return 'data:image/svg+xml;charset=UTF-8,' + encodeURIComponent(svg);
|
||
}
|
||
|
||
function currentMonth() {
|
||
var now = new Date();
|
||
return (
|
||
String(now.getFullYear()) +
|
||
'-' +
|
||
String(now.getMonth() + 1).padStart(2, '0')
|
||
);
|
||
}
|
||
|
||
function monthDate(value) {
|
||
var parts = String(value || currentMonth()).split('-');
|
||
var year = Number(parts[0]) || new Date().getFullYear();
|
||
var month = Number(parts[1]) || new Date().getMonth() + 1;
|
||
return new Date(year, month - 1, 1);
|
||
}
|
||
|
||
function monthValue(date) {
|
||
return (
|
||
String(date.getFullYear()) +
|
||
'-' +
|
||
String(date.getMonth() + 1).padStart(2, '0')
|
||
);
|
||
}
|
||
|
||
function monthTime(value) {
|
||
return monthDate(value).getTime();
|
||
}
|
||
|
||
function normalizeBillMonth(value) {
|
||
if (monthTime(value) < monthTime(FIRST_BILL_MONTH)) {
|
||
return FIRST_BILL_MONTH;
|
||
}
|
||
if (monthTime(value) > monthTime(currentMonth())) {
|
||
return currentMonth();
|
||
}
|
||
return monthValue(monthDate(value));
|
||
}
|
||
|
||
function monthLabel(value) {
|
||
var date = monthDate(value);
|
||
return (
|
||
String(date.getFullYear()) +
|
||
'/' +
|
||
String(date.getMonth() + 1).padStart(2, '0') +
|
||
''
|
||
);
|
||
}
|
||
|
||
function monthOptions() {
|
||
var options = [];
|
||
var cursor = monthDate(currentMonth());
|
||
var first = monthDate(FIRST_BILL_MONTH);
|
||
while (cursor.getTime() >= first.getTime()) {
|
||
options.push(new Date(cursor.getFullYear(), cursor.getMonth(), 1));
|
||
cursor = new Date(cursor.getFullYear(), cursor.getMonth() - 1, 1);
|
||
}
|
||
return options;
|
||
}
|
||
|
||
function money(value) {
|
||
var number = Number(value || 0);
|
||
return number.toLocaleString('en-US', {
|
||
minimumFractionDigits: 2,
|
||
maximumFractionDigits: 2,
|
||
});
|
||
}
|
||
|
||
function count(value) {
|
||
return Number(value || 0).toLocaleString('en-US', {
|
||
maximumFractionDigits: 0,
|
||
});
|
||
}
|
||
|
||
function initial(text) {
|
||
return String(text || '')
|
||
.trim()
|
||
.charAt(0)
|
||
.toUpperCase();
|
||
}
|
||
|
||
function firstValue(item, keys) {
|
||
if (!item) return '';
|
||
for (var i = 0; i < keys.length; i += 1) {
|
||
var value = item[keys[i]];
|
||
if (value !== undefined && value !== null && value !== '') {
|
||
return value;
|
||
}
|
||
}
|
||
return '';
|
||
}
|
||
|
||
function displayName(user, fallback) {
|
||
return (
|
||
firstValue(user, ['username', 'name', 'display_user_id']) ||
|
||
fallback ||
|
||
'-'
|
||
);
|
||
}
|
||
|
||
function displayID(user, fallback) {
|
||
return (
|
||
firstValue(user, [
|
||
'short_id',
|
||
'shortId',
|
||
'display_user_id',
|
||
'displayUserID',
|
||
]) ||
|
||
firstValue(user, ['user_id', 'userId', 'id']) ||
|
||
fallback ||
|
||
'-'
|
||
);
|
||
}
|
||
|
||
function salaryAmount(salary) {
|
||
if (!salary) return 0;
|
||
if (salary.display_amount !== undefined)
|
||
return Number(salary.display_amount);
|
||
if (salary.displayAmount !== undefined)
|
||
return Number(salary.displayAmount);
|
||
if (salary.available_amount !== undefined) {
|
||
return Number(salary.available_amount || 0) / 100;
|
||
}
|
||
if (salary.availableAmount !== undefined) {
|
||
return Number(salary.availableAmount || 0) / 100;
|
||
}
|
||
return 0;
|
||
}
|
||
|
||
function toast(message) {
|
||
if (window.HyAppToast) {
|
||
window.HyAppToast.show(message);
|
||
return;
|
||
}
|
||
window.alert(message);
|
||
}
|
||
|
||
function replaceChildren(node, children) {
|
||
node.textContent = '';
|
||
children.forEach(function (child) {
|
||
node.appendChild(child);
|
||
});
|
||
}
|
||
|
||
function setSkeleton(element, loading, text) {
|
||
if (!element) return;
|
||
element.classList.toggle('skeleton-line', Boolean(loading));
|
||
if (loading) {
|
||
element.textContent = '';
|
||
return;
|
||
}
|
||
element.textContent = text || '';
|
||
}
|
||
|
||
function renderImageAvatar(container, src, name, fallbackClass) {
|
||
container.textContent = '';
|
||
if (!src) {
|
||
var fallback = document.createElement('span');
|
||
fallback.className = fallbackClass || 'member-fallback';
|
||
fallback.textContent = initial(name) || 'B';
|
||
container.appendChild(fallback);
|
||
return;
|
||
}
|
||
var image = document.createElement('img');
|
||
image.src = src;
|
||
image.alt = '';
|
||
image.addEventListener('error', function () {
|
||
container.textContent = '';
|
||
var fallback = document.createElement('span');
|
||
fallback.className = fallbackClass || 'member-fallback';
|
||
fallback.textContent = initial(name) || 'B';
|
||
container.appendChild(fallback);
|
||
});
|
||
container.appendChild(image);
|
||
}
|
||
|
||
function normalizeProfile(payload) {
|
||
var profile =
|
||
payload && payload.profile ? payload.profile : payload || {};
|
||
var name = displayName(profile, 'BD');
|
||
return {
|
||
name: name,
|
||
uid: displayID(profile),
|
||
avatar:
|
||
firstValue(profile, ['avatar']) ||
|
||
avatarData(initial(name) || 'B', '#dbc8ff', '#7d57c7'),
|
||
};
|
||
}
|
||
|
||
function normalizeAgencyItem(item) {
|
||
var agency = (item && item.agency) || item || {};
|
||
var owner = (item && item.owner) || {};
|
||
// Agency 列表展示的是负责人维度；用户改昵称后应跟随 owner 最新资料，agency.name 只作为旧数据兜底。
|
||
var name =
|
||
displayName(owner, '') ||
|
||
firstValue(agency, ['name']) ||
|
||
'Agency ' + displayID(owner, displayID(agency));
|
||
var account =
|
||
displayID(owner, '') ||
|
||
firstValue(agency, [
|
||
'short_id',
|
||
'shortId',
|
||
'display_user_id',
|
||
'displayUserID',
|
||
'agency_id',
|
||
'agencyId',
|
||
]) ||
|
||
'-';
|
||
return {
|
||
name: name,
|
||
account: account,
|
||
avatar:
|
||
firstValue(agency, ['avatar']) ||
|
||
firstValue(owner, ['avatar']) ||
|
||
avatarData(initial(name) || 'A', '#dbc8ff', '#7d57c7'),
|
||
teamSalaryAmount: Number(
|
||
firstValue(item, ['team_salary', 'teamSalary']) || 0
|
||
),
|
||
teamRechargeAmount: Number(
|
||
firstValue(item, ['team_recharge', 'teamRecharge']) || 0
|
||
),
|
||
teamMemberCount: Number(
|
||
firstValue(item, ['host_count', 'hostCount']) ||
|
||
firstValue(agency, ['host_count', 'hostCount']) ||
|
||
0
|
||
),
|
||
};
|
||
}
|
||
|
||
function applyOverview(payload) {
|
||
var overview = payload && payload.overview ? payload.overview : {};
|
||
data.profile = normalizeProfile(payload || {});
|
||
data.balance = { available: salaryAmount(payload && payload.salary) };
|
||
data.agencyBill.agencyNumber = Number(
|
||
firstValue(overview, ['total_agency', 'totalAgency']) || 0
|
||
);
|
||
}
|
||
|
||
function applyAgencies(payload) {
|
||
var items =
|
||
payload && (payload.items || payload.agencies)
|
||
? payload.items || payload.agencies
|
||
: [];
|
||
var rows = items.map(normalizeAgencyItem);
|
||
data.agencyBill.memberBillList = rows;
|
||
data.agencyBill.agencyNumber = rows.length;
|
||
data.agencyBill.totalSalary = rows.reduce(function (sum, item) {
|
||
return sum + Number(item.teamSalaryAmount || 0);
|
||
}, 0);
|
||
data.agencyBill.totalRecharge = rows.reduce(function (sum, item) {
|
||
return sum + Number(item.teamRechargeAmount || 0);
|
||
}, 0);
|
||
}
|
||
|
||
function normalizeInviteProfile(payload, fallbackID) {
|
||
var user = payload && (payload.user || payload.profile || payload);
|
||
if (!user) return null;
|
||
var userID = firstValue(user, ['user_id', 'userId', 'id']);
|
||
if (!userID) return null;
|
||
var account = displayID(user, fallbackID);
|
||
var name = displayName(user, 'User ' + account);
|
||
return {
|
||
userId: String(userID),
|
||
id: String(userID),
|
||
name: name,
|
||
account: account,
|
||
avatar:
|
||
firstValue(user, ['avatar']) ||
|
||
avatarData(initial(name) || 'U', '#dbc8ff', '#7d57c7'),
|
||
};
|
||
}
|
||
|
||
function renderProfile() {
|
||
var image = $('profileAvatar');
|
||
var fallback = $('profileAvatarFallback');
|
||
var profile = data.profile || {};
|
||
var loading = Boolean(state.loading);
|
||
setSkeleton($('profileName'), loading, profile.name || '-');
|
||
setSkeleton($('profileUID'), loading, 'UID: ' + (profile.uid || '-'));
|
||
fallback.classList.toggle('avatar-skeleton', loading);
|
||
if (loading) {
|
||
image.hidden = true;
|
||
image.removeAttribute('src');
|
||
fallback.hidden = false;
|
||
fallback.textContent = '';
|
||
return;
|
||
}
|
||
fallback.textContent = initial(profile.name) || 'B';
|
||
image.onload = function () {
|
||
image.hidden = false;
|
||
fallback.hidden = true;
|
||
};
|
||
image.onerror = function () {
|
||
image.hidden = true;
|
||
fallback.hidden = false;
|
||
};
|
||
image.src = profile.avatar || '';
|
||
if (!profile.avatar) {
|
||
image.hidden = true;
|
||
fallback.hidden = false;
|
||
}
|
||
}
|
||
|
||
function renderBalance() {
|
||
var loading = Boolean(state.loading);
|
||
var coinIcon = document.querySelector('.salary-value .coin-icon');
|
||
if (coinIcon) coinIcon.classList.toggle('skeleton-coin', loading);
|
||
setSkeleton(
|
||
$('availableBalance'),
|
||
loading,
|
||
money(data.balance && data.balance.available)
|
||
);
|
||
}
|
||
|
||
function summaryCell(label, value) {
|
||
var cell = document.createElement('div');
|
||
var labelNode = document.createElement('span');
|
||
var valueNode = document.createElement('strong');
|
||
labelNode.textContent = label;
|
||
valueNode.textContent = value;
|
||
cell.appendChild(labelNode);
|
||
cell.appendChild(valueNode);
|
||
return cell;
|
||
}
|
||
|
||
function summarySkeletonCell() {
|
||
var cell = document.createElement('div');
|
||
var labelNode = document.createElement('span');
|
||
var valueNode = document.createElement('strong');
|
||
labelNode.className = 'skeleton-line';
|
||
valueNode.className = 'skeleton-line';
|
||
cell.appendChild(labelNode);
|
||
cell.appendChild(valueNode);
|
||
return cell;
|
||
}
|
||
|
||
function skeletonMemberRow() {
|
||
var row = document.createElement('article');
|
||
var avatar = document.createElement('div');
|
||
var main = document.createElement('div');
|
||
var name = document.createElement('div');
|
||
var meta = document.createElement('div');
|
||
var side = document.createElement('div');
|
||
row.className = 'member-row is-skeleton';
|
||
avatar.className = 'member-avatar avatar-skeleton';
|
||
main.className = 'member-main';
|
||
name.className = 'member-name skeleton-line';
|
||
meta.className = 'member-meta skeleton-line';
|
||
side.className = 'member-side';
|
||
for (var i = 0; i < 3; i += 1) {
|
||
var line = document.createElement('div');
|
||
line.className = 'skeleton-line';
|
||
side.appendChild(line);
|
||
}
|
||
main.appendChild(name);
|
||
main.appendChild(meta);
|
||
row.appendChild(avatar);
|
||
row.appendChild(main);
|
||
row.appendChild(side);
|
||
return row;
|
||
}
|
||
|
||
function memberRow(item) {
|
||
var row = document.createElement('article');
|
||
var avatar = document.createElement('div');
|
||
var main = document.createElement('div');
|
||
var name = document.createElement('div');
|
||
var meta = document.createElement('div');
|
||
var side = document.createElement('div');
|
||
row.className = 'member-row';
|
||
avatar.className = 'member-avatar';
|
||
main.className = 'member-main';
|
||
name.className = 'member-name';
|
||
meta.className = 'member-meta';
|
||
side.className = 'member-side';
|
||
renderImageAvatar(avatar, item.avatar, item.name);
|
||
name.textContent = item.name || '-';
|
||
meta.textContent = 'UID: ' + (item.account || '-');
|
||
[
|
||
t('bd_center.team_salary', 'Team salary') +
|
||
': $' +
|
||
money(item.teamSalaryAmount),
|
||
t('bd_center.recharge', 'Recharge') +
|
||
': $' +
|
||
money(item.teamRechargeAmount),
|
||
t('bd_center.host', 'Host') + ': ' + count(item.teamMemberCount),
|
||
].forEach(function (line) {
|
||
var node = document.createElement('div');
|
||
node.textContent = line;
|
||
side.appendChild(node);
|
||
});
|
||
main.appendChild(name);
|
||
main.appendChild(meta);
|
||
row.appendChild(avatar);
|
||
row.appendChild(main);
|
||
row.appendChild(side);
|
||
return row;
|
||
}
|
||
|
||
function renderTeamList() {
|
||
var bill = data.agencyBill;
|
||
$('billMonthText').textContent = monthLabel(state.billMonth);
|
||
|
||
if (state.loading) {
|
||
replaceChildren($('teamListSummary'), [
|
||
summarySkeletonCell(),
|
||
summarySkeletonCell(),
|
||
]);
|
||
replaceChildren($('teamListContent'), [
|
||
skeletonMemberRow(),
|
||
skeletonMemberRow(),
|
||
skeletonMemberRow(),
|
||
]);
|
||
return;
|
||
}
|
||
|
||
replaceChildren($('teamListSummary'), [
|
||
summaryCell(
|
||
t('bd_center.agency_number', 'Agency number'),
|
||
count(bill.agencyNumber)
|
||
),
|
||
summaryCell(
|
||
t('bd_center.team_salary', 'Team salary'),
|
||
'$' + money(bill.totalSalary)
|
||
),
|
||
]);
|
||
|
||
var rows = (bill.memberBillList || []).map(memberRow);
|
||
if (!rows.length) {
|
||
var empty = document.createElement('div');
|
||
empty.className = 'empty-state';
|
||
empty.textContent = t('bd_center.no_data', 'No data');
|
||
rows = [empty];
|
||
}
|
||
replaceChildren($('teamListContent'), rows);
|
||
}
|
||
|
||
function monthOption(date) {
|
||
var value = monthValue(date);
|
||
var option = document.createElement('button');
|
||
option.className = 'month-option';
|
||
option.type = 'button';
|
||
option.setAttribute('role', 'option');
|
||
option.setAttribute('data-month', value);
|
||
option.setAttribute('aria-selected', String(value === state.billMonth));
|
||
option.textContent = monthLabel(value);
|
||
if (value === state.billMonth) option.classList.add('is-selected');
|
||
return option;
|
||
}
|
||
|
||
function renderMonthSheet() {
|
||
replaceChildren(
|
||
$('monthOptionList'),
|
||
monthOptions().map(function (date) {
|
||
return monthOption(date);
|
||
})
|
||
);
|
||
}
|
||
|
||
function openMonthSheet() {
|
||
renderMonthSheet();
|
||
$('monthSheet').hidden = false;
|
||
$('monthSheet').setAttribute('aria-hidden', 'false');
|
||
document.body.classList.add('modal-open');
|
||
window.setTimeout(function () {
|
||
var selected = $('monthOptionList').querySelector('.is-selected');
|
||
if (selected && selected.scrollIntoView) {
|
||
selected.scrollIntoView({ block: 'center' });
|
||
}
|
||
}, 0);
|
||
}
|
||
|
||
function closeMonthSheet() {
|
||
$('monthSheet').hidden = true;
|
||
$('monthSheet').setAttribute('aria-hidden', 'true');
|
||
document.body.classList.remove('modal-open');
|
||
}
|
||
|
||
function selectMonth(value) {
|
||
var nextMonth = normalizeBillMonth(value);
|
||
if (!nextMonth || nextMonth === state.billMonth) {
|
||
closeMonthSheet();
|
||
return;
|
||
}
|
||
state.billMonth = nextMonth;
|
||
closeMonthSheet();
|
||
renderTeamList();
|
||
}
|
||
|
||
function inviteProfile(item) {
|
||
return item.profile || item;
|
||
}
|
||
|
||
function statusLabel(status) {
|
||
if (
|
||
status === 'success' ||
|
||
status === 'Success' ||
|
||
status === 'accepted'
|
||
) {
|
||
return t('bd_center.success', 'Success');
|
||
}
|
||
if (status === 'pending' || status === 'Pending')
|
||
return t('bd_center.pending', 'Pending');
|
||
return '';
|
||
}
|
||
|
||
function commandID(prefix, targetUserID) {
|
||
return [
|
||
prefix,
|
||
targetUserID,
|
||
Date.now(),
|
||
Math.random().toString(16).slice(2),
|
||
].join('-');
|
||
}
|
||
|
||
function normalizeInvitationMessage(item) {
|
||
var invitation = (item && item.invitation) || item || {};
|
||
var inviter = (item && item.inviter) || {};
|
||
var id = String(
|
||
invitation.invitation_id || invitation.invitationId || ''
|
||
);
|
||
var type = firstValue(invitation, [
|
||
'invitation_type',
|
||
'invitationType',
|
||
]);
|
||
var agencyName = firstValue(invitation, ['agency_name', 'agencyName']);
|
||
var inviterName =
|
||
displayName(inviter, '') ||
|
||
firstValue(invitation, ['inviter_user_id', 'inviterUserId']) ||
|
||
t('bd_center.inviter', 'Inviter');
|
||
return {
|
||
id: id,
|
||
type: type,
|
||
name: inviterName,
|
||
account:
|
||
displayID(inviter, '') ||
|
||
firstValue(invitation, ['inviter_user_id', 'inviterUserId']),
|
||
avatar: firstValue(inviter, ['avatar']),
|
||
title: invitationMessageTitle(type, inviterName, agencyName),
|
||
};
|
||
}
|
||
|
||
function invitationMessageTitle(type, inviterName, agencyName) {
|
||
if (type === 'host') {
|
||
return t(
|
||
'bd_center.host_invitation',
|
||
'{name} invited you to join {agency}'
|
||
)
|
||
.replace('{name}', inviterName)
|
||
.replace(
|
||
'{agency}',
|
||
agencyName || t('bd_center.agency', 'Agency')
|
||
);
|
||
}
|
||
if (type === 'agency') {
|
||
return t(
|
||
'bd_center.agency_invitation',
|
||
'{name} invited you to create agency {agency}'
|
||
)
|
||
.replace('{name}', inviterName)
|
||
.replace(
|
||
'{agency}',
|
||
agencyName || t('bd_center.agency', 'Agency')
|
||
);
|
||
}
|
||
if (type === 'bd') {
|
||
return t(
|
||
'bd_center.bd_invitation',
|
||
'{name} invited you to become BD'
|
||
).replace('{name}', inviterName);
|
||
}
|
||
return t(
|
||
'bd_center.role_invitation',
|
||
'{name} sent you an invitation'
|
||
).replace('{name}', inviterName);
|
||
}
|
||
|
||
function inviteCard(item) {
|
||
var profile = inviteProfile(item);
|
||
var status = item.status || '';
|
||
var card = document.createElement('article');
|
||
var avatar = document.createElement('div');
|
||
var main = document.createElement('div');
|
||
var name = document.createElement('div');
|
||
var meta = document.createElement('div');
|
||
var side = document.createElement('div');
|
||
card.className = 'invite-user-card';
|
||
avatar.className = 'invite-user-avatar';
|
||
main.className = 'invite-user-main';
|
||
name.className = 'invite-user-name';
|
||
meta.className = 'invite-user-meta';
|
||
side.className = 'invite-user-side';
|
||
renderImageAvatar(
|
||
avatar,
|
||
profile.avatar,
|
||
profile.name,
|
||
'invite-avatar-fallback'
|
||
);
|
||
name.textContent = profile.name || '-';
|
||
meta.textContent = 'UID: ' + (profile.account || '-');
|
||
main.appendChild(name);
|
||
main.appendChild(meta);
|
||
|
||
if (status) {
|
||
var badge = document.createElement('span');
|
||
badge.className =
|
||
'invite-badge ' +
|
||
(status === 'pending' || status === 'Pending'
|
||
? 'pending'
|
||
: 'success');
|
||
badge.textContent = statusLabel(status);
|
||
side.appendChild(badge);
|
||
} else {
|
||
var targetUserID = String(profile.userId || profile.id || '');
|
||
var invite = document.createElement('button');
|
||
invite.className = 'invite-action';
|
||
invite.type = 'button';
|
||
invite.disabled = Boolean(state.inviting[targetUserID]);
|
||
invite.textContent = state.inviting[targetUserID]
|
||
? t('bd_center.pending', 'Pending')
|
||
: t('bd_center.invite', 'Invite');
|
||
invite.addEventListener('click', function () {
|
||
submitInvite(profile);
|
||
});
|
||
side.appendChild(invite);
|
||
}
|
||
|
||
card.appendChild(avatar);
|
||
card.appendChild(main);
|
||
card.appendChild(side);
|
||
return card;
|
||
}
|
||
|
||
function setInviteStatus(text, type) {
|
||
var node = $('inviteStatus');
|
||
node.textContent = text || '';
|
||
node.hidden = !text;
|
||
node.classList.toggle('is-error', type === 'error');
|
||
node.classList.toggle('is-success', type === 'success');
|
||
}
|
||
|
||
function renderInviteModal() {
|
||
var rows =
|
||
state.inviteMode === 'search'
|
||
? state.searched.map(inviteCard)
|
||
: data.inviteRecords.map(inviteCard);
|
||
setInviteStatus(state.inviteStatus, state.inviteStatusType);
|
||
replaceChildren($('inviteList'), rows);
|
||
$('inviteEmpty').hidden =
|
||
rows.length > 0 || Boolean(state.inviteStatus);
|
||
$('inviteSearchButton').disabled =
|
||
!state.inviteQuery.trim() || Boolean(state.searching);
|
||
}
|
||
|
||
function renderUnread() {
|
||
var dot = $('messageUnreadDot');
|
||
if (dot) dot.hidden = state.messages.length <= 0;
|
||
}
|
||
|
||
function renderMessages() {
|
||
var list = $('messageList');
|
||
var empty = $('messageEmpty');
|
||
if (!list || !empty) return;
|
||
list.textContent = '';
|
||
empty.hidden = state.messages.length > 0;
|
||
empty.textContent = t('bd_center.no_messages', 'No messages');
|
||
state.messages.forEach(function (message) {
|
||
var card = document.createElement('article');
|
||
var avatar = document.createElement('div');
|
||
var main = document.createElement('div');
|
||
var title = document.createElement('div');
|
||
var meta = document.createElement('div');
|
||
var side = document.createElement('div');
|
||
var agree = document.createElement('button');
|
||
var refuse = document.createElement('button');
|
||
card.className = 'message-card';
|
||
avatar.className = 'message-avatar';
|
||
main.className = 'message-main';
|
||
title.className = 'message-title';
|
||
meta.className = 'message-meta';
|
||
side.className = 'message-actions';
|
||
agree.className = 'message-action agree';
|
||
refuse.className = 'message-action refuse';
|
||
agree.type = 'button';
|
||
refuse.type = 'button';
|
||
agree.disabled = Boolean(state.processingMessages[message.id]);
|
||
refuse.disabled = Boolean(state.processingMessages[message.id]);
|
||
renderImageAvatar(
|
||
avatar,
|
||
message.avatar,
|
||
message.name,
|
||
'message-fallback'
|
||
);
|
||
title.textContent = message.title;
|
||
meta.textContent = message.account ? 'ID: ' + message.account : '';
|
||
agree.textContent = t('bd_center.agree', 'Agree');
|
||
refuse.textContent = t('bd_center.refuse', 'Refuse');
|
||
agree.addEventListener('click', function () {
|
||
processInvitationMessage(message, 'accept');
|
||
});
|
||
refuse.addEventListener('click', function () {
|
||
processInvitationMessage(message, 'reject');
|
||
});
|
||
main.appendChild(title);
|
||
main.appendChild(meta);
|
||
side.appendChild(agree);
|
||
side.appendChild(refuse);
|
||
card.appendChild(avatar);
|
||
card.appendChild(main);
|
||
card.appendChild(side);
|
||
list.appendChild(card);
|
||
});
|
||
renderUnread();
|
||
}
|
||
|
||
function openInviteModal() {
|
||
state.inviteQuery = '';
|
||
state.inviteMode = 'records';
|
||
state.searched = [];
|
||
state.inviteStatus = '';
|
||
state.inviteStatusType = '';
|
||
state.searching = false;
|
||
$('inviteSearchInput').value = '';
|
||
$('inviteModal').hidden = false;
|
||
$('inviteModal').setAttribute('aria-hidden', 'false');
|
||
document.body.classList.add('modal-open');
|
||
renderInviteModal();
|
||
window.setTimeout(function () {
|
||
$('inviteSearchInput').focus();
|
||
}, 80);
|
||
}
|
||
|
||
function closeInviteModal() {
|
||
$('inviteModal').hidden = true;
|
||
$('inviteModal').setAttribute('aria-hidden', 'true');
|
||
document.body.classList.remove('modal-open');
|
||
}
|
||
|
||
function searchInvite(event) {
|
||
event.preventDefault();
|
||
var queryValue = state.inviteQuery.trim();
|
||
state.inviteMode = 'search';
|
||
state.inviteStatus = '';
|
||
state.inviteStatusType = '';
|
||
state.searched = [];
|
||
if (!queryValue) {
|
||
renderInviteModal();
|
||
return;
|
||
}
|
||
if (!api().user || !api().user.resolveDisplayUserID) {
|
||
state.inviteStatus = t(
|
||
'bd_center.api_not_ready',
|
||
'API module is not ready.'
|
||
);
|
||
state.inviteStatusType = 'error';
|
||
renderInviteModal();
|
||
return;
|
||
}
|
||
state.inviteStatus = t('bd_center.searching', 'Searching...');
|
||
state.searching = true;
|
||
renderInviteModal();
|
||
api()
|
||
.user.resolveDisplayUserID(queryValue)
|
||
.then(function (payload) {
|
||
var profile = normalizeInviteProfile(payload, queryValue);
|
||
state.inviteStatus = profile
|
||
? ''
|
||
: t('bd_center.no_users_found', 'No users found');
|
||
state.inviteStatusType = '';
|
||
state.searched = profile ? [profile] : [];
|
||
renderInviteModal();
|
||
})
|
||
.catch(function (error) {
|
||
state.inviteStatus =
|
||
(error && error.message) ||
|
||
t(
|
||
'bd_center.search_failed',
|
||
'Search failed. Try again later.'
|
||
);
|
||
state.inviteStatusType = 'error';
|
||
state.searched = [];
|
||
renderInviteModal();
|
||
})
|
||
.finally(function () {
|
||
state.searching = false;
|
||
renderInviteModal();
|
||
});
|
||
}
|
||
|
||
function submitInvite(profile) {
|
||
var targetUserID = String(profile.userId || profile.id || '');
|
||
if (!targetUserID) return;
|
||
if (!centerAPI() || !centerAPI().inviteAgency) {
|
||
state.inviteStatus = t(
|
||
'bd_center.api_not_ready',
|
||
'API module is not ready.'
|
||
);
|
||
state.inviteStatusType = 'error';
|
||
renderInviteModal();
|
||
return;
|
||
}
|
||
state.inviting[targetUserID] = true;
|
||
renderInviteModal();
|
||
centerAPI()
|
||
.inviteAgency({
|
||
command_id: commandID('bd-agency', targetUserID),
|
||
target_user_id: targetUserID,
|
||
agency_name: profile.name,
|
||
})
|
||
.then(function () {
|
||
data.inviteRecords.unshift({
|
||
id: 'inv-' + Date.now(),
|
||
status: 'success',
|
||
profile: profile,
|
||
});
|
||
state.inviteMode = 'records';
|
||
state.searched = [];
|
||
state.inviteStatus = t(
|
||
'bd_center.invitation_submitted',
|
||
'Invitation submitted'
|
||
);
|
||
state.inviteStatusType = 'success';
|
||
loadRealData().catch(function () {});
|
||
renderInviteModal();
|
||
})
|
||
.catch(function (error) {
|
||
state.inviteStatus =
|
||
(error && error.message) ||
|
||
t(
|
||
'bd_center.invite_failed',
|
||
'Invite failed. Try again later.'
|
||
);
|
||
state.inviteStatusType = 'error';
|
||
renderInviteModal();
|
||
})
|
||
.finally(function () {
|
||
delete state.inviting[targetUserID];
|
||
renderInviteModal();
|
||
});
|
||
}
|
||
|
||
function navigateToWithdrawExchange() {
|
||
var params = new URLSearchParams(window.location.search);
|
||
params.set('identity', 'BD');
|
||
params.set('salaryType', BD_SALARY_ASSET);
|
||
params.set('asset_type', BD_SALARY_ASSET);
|
||
if (!params.has('mode')) params.set('mode', 'withdraw');
|
||
window.location.href =
|
||
'../withdraw-exchange/index.html?' + params.toString();
|
||
}
|
||
|
||
function loadRoleInvitations() {
|
||
if (!api().roleInvitations || !api().roleInvitations.list) {
|
||
state.messages = [];
|
||
renderMessages();
|
||
return Promise.resolve(false);
|
||
}
|
||
return api()
|
||
.roleInvitations.list('pending', 50)
|
||
.then(function (payload) {
|
||
var items =
|
||
(payload && (payload.items || payload.invitations)) || [];
|
||
state.messages = items
|
||
.map(normalizeInvitationMessage)
|
||
.filter(function (item) {
|
||
return !!item.id;
|
||
});
|
||
renderMessages();
|
||
return true;
|
||
})
|
||
.catch(function () {
|
||
state.messages = [];
|
||
renderMessages();
|
||
return false;
|
||
});
|
||
}
|
||
|
||
function processInvitationMessage(message, action) {
|
||
if (
|
||
!message ||
|
||
!message.id ||
|
||
!api().roleInvitations ||
|
||
!api().roleInvitations.process
|
||
) {
|
||
return;
|
||
}
|
||
state.processingMessages[message.id] = true;
|
||
renderMessages();
|
||
api()
|
||
.roleInvitations.process(message.id, {
|
||
command_id: commandID('role-invite-' + action, message.id),
|
||
action: action,
|
||
reason: 'h5_message_center',
|
||
})
|
||
.then(function () {
|
||
state.messages = state.messages.filter(function (item) {
|
||
return item.id !== message.id;
|
||
});
|
||
toast(
|
||
t(
|
||
action === 'accept'
|
||
? 'bd_center.invitation_accepted'
|
||
: 'bd_center.invitation_rejected',
|
||
action === 'accept'
|
||
? 'Invitation accepted.'
|
||
: 'Invitation rejected.'
|
||
)
|
||
);
|
||
renderMessages();
|
||
return loadRealData();
|
||
})
|
||
.catch(function (error) {
|
||
toast(
|
||
(error && error.message) ||
|
||
t(
|
||
'bd_center.process_failed',
|
||
'Process failed. Try again later.'
|
||
)
|
||
);
|
||
})
|
||
.finally(function () {
|
||
delete state.processingMessages[message.id];
|
||
renderMessages();
|
||
});
|
||
}
|
||
|
||
function openMessages() {
|
||
$('messageModal').hidden = false;
|
||
$('messageModal').setAttribute('aria-hidden', 'false');
|
||
document.body.classList.add('modal-open');
|
||
renderMessages();
|
||
}
|
||
|
||
function closeMessages() {
|
||
$('messageModal').hidden = true;
|
||
$('messageModal').setAttribute('aria-hidden', 'true');
|
||
document.body.classList.remove('modal-open');
|
||
}
|
||
|
||
function setLoading(loading) {
|
||
state.loading = Boolean(loading);
|
||
render();
|
||
}
|
||
|
||
function loadRealData() {
|
||
var service = centerAPI();
|
||
setLoading(true);
|
||
if (
|
||
!service ||
|
||
!service.overview ||
|
||
!service.agencies ||
|
||
!service.inviteAgency
|
||
) {
|
||
setLoading(false);
|
||
return Promise.reject(
|
||
new Error(
|
||
t('bd_center.api_not_ready', 'API module is not ready.')
|
||
)
|
||
);
|
||
}
|
||
return Promise.all([service.overview(), service.agencies(50)])
|
||
.then(function (results) {
|
||
applyOverview(results[0] || {});
|
||
applyAgencies(results[1] || {});
|
||
return true;
|
||
})
|
||
.catch(function (error) {
|
||
data.profile = null;
|
||
data.balance = { available: 0 };
|
||
data.agencyBill = {
|
||
agencyNumber: 0,
|
||
totalSalary: 0,
|
||
totalRecharge: 0,
|
||
memberBillList: [],
|
||
};
|
||
throw error;
|
||
})
|
||
.finally(function () {
|
||
setLoading(false);
|
||
});
|
||
}
|
||
|
||
function bindEvents() {
|
||
$('backButton').addEventListener('click', function () {
|
||
if (window.HyAppBridge) {
|
||
window.HyAppBridge.back();
|
||
return;
|
||
}
|
||
if (window.history.length > 1) window.history.back();
|
||
});
|
||
$('withdrawExchangeButton').addEventListener(
|
||
'click',
|
||
navigateToWithdrawExchange
|
||
);
|
||
$('messageButton').addEventListener('click', openMessages);
|
||
$('messageBackdrop').addEventListener('click', closeMessages);
|
||
$('messageCloseButton').addEventListener('click', closeMessages);
|
||
$('inviteAgentButton').addEventListener('click', openInviteModal);
|
||
$('inviteBackdrop').addEventListener('click', closeInviteModal);
|
||
$('inviteCloseButton').addEventListener('click', closeInviteModal);
|
||
$('inviteSearchInput').addEventListener('input', function (event) {
|
||
state.inviteQuery = event.target.value;
|
||
if (!state.inviteQuery.trim()) {
|
||
state.inviteMode = 'records';
|
||
state.searched = [];
|
||
state.inviteStatus = '';
|
||
state.inviteStatusType = '';
|
||
}
|
||
renderInviteModal();
|
||
});
|
||
$('inviteSearchForm').addEventListener('submit', searchInvite);
|
||
$('billMonthButton').addEventListener('click', openMonthSheet);
|
||
$('monthSheetBackdrop').addEventListener('click', closeMonthSheet);
|
||
$('monthSheetCloseButton').addEventListener('click', closeMonthSheet);
|
||
$('monthOptionList').addEventListener('click', function (event) {
|
||
var option = event.target.closest('[data-month]');
|
||
if (!option) return;
|
||
selectMonth(option.getAttribute('data-month'));
|
||
});
|
||
}
|
||
|
||
function render() {
|
||
renderProfile();
|
||
renderBalance();
|
||
renderTeamList();
|
||
renderInviteModal();
|
||
renderMessages();
|
||
}
|
||
|
||
document.addEventListener('DOMContentLoaded', function () {
|
||
render();
|
||
bindEvents();
|
||
loadRealData()
|
||
.catch(function (error) {
|
||
toast(
|
||
(error && error.message) ||
|
||
t(
|
||
'bd_center.load_failed',
|
||
'Load failed. Try again later.'
|
||
)
|
||
);
|
||
})
|
||
.finally(loadRoleInvitations);
|
||
if (window.HyAppBridge) {
|
||
window.HyAppBridge.ready({
|
||
page: 'bd-center',
|
||
});
|
||
}
|
||
});
|
||
|
||
window.addEventListener('hyapp:i18n-ready', function () {
|
||
render();
|
||
});
|
||
|
||
window.addEventListener('hyapp:role-invitation-processed', function () {
|
||
loadRealData().catch(function () {});
|
||
});
|
||
})();
|