hy/chatapp-h5
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: show host target level and format metrics

Browse Source
This commit is contained in:
zhx 2026-05-29 16:59:32 +08:00
parent 196438b02c
commit c484579358
3 changed files with 54 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
h5/hyapp/host-center/index.html
View File

@ -4,7 +4,7 @@
<meta charset="UTF-8" /> <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" /> <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> <title>Host Center</title>
<link rel="stylesheet" href="./style.css?v=20260429-0300" /> <link rel="stylesheet" href="./style.css?v=20260529-1200" />
</head> </head>
<body> <body>
<div class="host-center" aria-label="Host Center" data-i18n-aria="page_label" data-loading="true" data-view="loading"> <div class="host-center" aria-label="Host Center" data-i18n-aria="page_label" data-loading="true" data-view="loading">
@ -56,7 +56,10 @@
</div> </div>
<div class="vertical-line" aria-hidden="true"></div> <div class="vertical-line" aria-hidden="true"></div>
<div class="metric gift-metric"> <div class="metric gift-metric">
<div class="label" data-i18n="target">Target</div> <div class="target-label-row">
<div class="label" data-i18n="target">Target</div>
<span class="target-level" id="currentTargetLevel">Lv. -</span>
</div>
<button class="gift-value" type="button" aria-live="polite" aria-label="Open daily data" data-i18n-aria="open_daily_data"> <button class="gift-value" type="button" aria-live="polite" aria-label="Open daily data" data-i18n-aria="open_daily_data">
<span class="amount-text" id="currentGiftValue"></span> <span class="amount-text" id="currentGiftValue"></span>
<span class="chevron">&rsaquo;</span> <span class="chevron">&rsaquo;</span>
@ -185,6 +188,6 @@
<div class="loading-copy">loading....</div> <div class="loading-copy">loading....</div>
</div> </div>
</div> </div>
<script src="./script.js?v=20260428-2120" defer></script> <script src="./script.js?v=20260529-1200" defer></script>
</body> </body>
</html> </html>

22
h5/hyapp/host-center/script.js
View File

@ -245,6 +245,7 @@
let currentSalary = "0.00"; let currentSalary = "0.00";
let currentStreamingDuration = "0"; let currentStreamingDuration = "0";
let currentGiftValue = "0"; let currentGiftValue = "0";
let currentTargetLevel = "-";
let currentDailyTargets = []; let currentDailyTargets = [];
let foundJoinAgency = null; let foundJoinAgency = null;
let pendingJoinRecord = null; let pendingJoinRecord = null;
@ -658,7 +659,7 @@
const numericValue = Number(value); const numericValue = Number(value);
if (!Number.isFinite(numericValue)) return "0"; if (!Number.isFinite(numericValue)) return "0";
const safeValue = Math.max(0, numericValue); const safeValue = Math.max(0, numericValue);
return Number.isInteger(safeValue) ? String(safeValue) : String(Number(safeValue.toFixed(2))); return formatCountValue(safeValue);
} }
function pickStreamingDuration(body) { function pickStreamingDuration(body) {
@ -675,11 +676,20 @@
function formatCountValue(value) { function formatCountValue(value) {
if (value === null || value === undefined || value === "") return "-"; if (value === null || value === undefined || value === "") return "-";
const number = Number(value); const number = Number(value);
if (Number.isFinite(number) && Number.isInteger(number)) return String(number); if (Number.isFinite(number)) {
if (Number.isFinite(number)) return String(Number(number.toFixed(2))); return new Intl.NumberFormat("en-US", {
maximumFractionDigits: 2
}).format(number);
}
return String(value); return String(value);
} }
function renderCurrentTargetLevel(value) {
currentTargetLevel = formatCountValue(value);
const levelNode = document.querySelector("#currentTargetLevel");
if (levelNode) levelNode.textContent = `Lv. ${currentTargetLevel}`;
}
function renderCurrentGiftValue(value) { function renderCurrentGiftValue(value) {
currentGiftValue = formatCountValue(value === null || value === undefined || value === "" ? 0 : value); currentGiftValue = formatCountValue(value === null || value === undefined || value === "" ? 0 : value);
const giftNode = document.querySelector("#currentGiftValue"); const giftNode = document.querySelector("#currentGiftValue");
@ -698,6 +708,11 @@
return target.acceptGiftValue ?? target.giftValue ?? target.giftScore ?? target.currentGiftValue ?? null; return target.acceptGiftValue ?? target.giftValue ?? target.giftScore ?? target.currentGiftValue ?? null;
} }
function pickTargetLevel(workTarget) {
const target = workTarget?.target || workTarget || {};
return target?.settlementResult?.level ?? target.level ?? "-";
}
function pickDailyTargets(workTarget) { function pickDailyTargets(workTarget) {
const target = workTarget?.target || workTarget || {}; const target = workTarget?.target || workTarget || {};
return Array.isArray(target.dailyTargets) ? target.dailyTargets : []; return Array.isArray(target.dailyTargets) ? target.dailyTargets : [];
@ -767,6 +782,7 @@
const workTarget = pickFirstMemberWorkTarget(memberWork); const workTarget = pickFirstMemberWorkTarget(memberWork);
renderStreamingDuration(pickStreamingDuration(memberWork)); renderStreamingDuration(pickStreamingDuration(memberWork));
renderCurrentGiftValue(pickGiftValue(workTarget) ?? 0); renderCurrentGiftValue(pickGiftValue(workTarget) ?? 0);
renderCurrentTargetLevel(pickTargetLevel(workTarget));
renderDailyTargets(pickDailyTargets(workTarget)); renderDailyTargets(pickDailyTargets(workTarget));
} }

29
h5/hyapp/host-center/style.css
View File

@ -471,6 +471,35 @@ a {
line-height: 1.12; line-height: 1.12;
} }
.target-label-row {
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 8px;
min-height: 36px;
}
.target-label-row .label {
min-height: 0;
}
.target-level {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 42px;
min-height: 22px;
flex: 0 0 auto;
padding: 0 7px;
border-radius: 999px;
background: #f1fbf8;
color: #18a777;
font-size: 12px;
font-weight: 950;
line-height: 1;
white-space: nowrap;
}
.value { .value {
margin-top: 4px; margin-top: 4px;
color: #292d33; color: #292d33;