yml/live-hub-py
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

实现虎牙绑定小程序码展示

Browse Source
This commit is contained in:
yml2213
2026-07-04 19:05:35 +08:00
parent 728706deb2
commit 7e92008f7b
6 changed files with 837 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/frontend/src/pages/HuyaTasksPage.tsx
+109 -13
View File
@@ -1,11 +1,11 @@
import { useCallback, useEffect, useMemo, useState } from 'react';
import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
import {
Button, Card, Col, Form, Input, InputNumber, message, Row, Select, Space, Table, Tag, Tooltip, Typography, theme,
Button, Card, Col, Form, Input, InputNumber, message, Modal, Row, Select, Space, Table, Tag, Tooltip, Typography, theme,
} from 'antd';
import type { TableProps } from 'antd';
import {
AppstoreOutlined, CheckCircleOutlined, CreditCardOutlined, FieldTimeOutlined, GiftOutlined,
LinkOutlined, PlayCircleOutlined, ReloadOutlined, SearchOutlined, SettingOutlined, ShoppingOutlined,
LinkOutlined, PlayCircleOutlined, QrcodeOutlined, ReloadOutlined, SearchOutlined, SettingOutlined, ShoppingOutlined,
} from '@ant-design/icons';
import {
huyaApi,
@@ -69,6 +69,22 @@ function accountLabel(account: HuyaAccountItem): string {
return `${name}${tag}${phone}`;
}
function resultText(result: Record<string, unknown> | null | undefined, key: string): string {
const value = result?.[key];
return typeof value === 'string' ? value : '';
}
function resultProfileNick(result: Record<string, unknown> | null | undefined): string {
const profile = result?.profile;
if (!profile || typeof profile !== 'object' || Array.isArray(profile)) return '';
const nick = (profile as Record<string, unknown>).nick;
return typeof nick === 'string' ? nick : '';
}
function hasMiniQrcode(task: HuyaTaskItem): boolean {
return task.task_type === 'get_bind_qr' && Boolean(resultText(task.result, 'mini_qrcode_image'));
}
export default function HuyaTasksPage() {
const { token } = theme.useToken();
const [form] = Form.useForm<HuyaConfig>();
@@ -88,6 +104,9 @@ export default function HuyaTasksPage() {
const [starting, setStarting] = useState(false);
const [savingConfig, setSavingConfig] = useState(false);
const [batchId, setBatchId] = useState<string | null>(null);
const [qrTask, setQrTask] = useState<HuyaTaskItem | null>(null);
const autoOpenedQrTaskIds = useRef<Set<number>>(new Set());
const autoOpenQrReady = useRef(false);
const { logs, connected: wsConnected, connect: connectLogs } = useWebSocketLogs();
const { can } = usePermissions();
@@ -98,6 +117,17 @@ export default function HuyaTasksPage() {
localStorage.setItem('huya_task_concurrency', String(concurrency));
}, [concurrency]);
const rememberExistingQrcodes = useCallback((items: HuyaTaskItem[]) => {
if (autoOpenQrReady.current) return;
items.filter(hasMiniQrcode).forEach((task) => autoOpenedQrTaskIds.current.add(task.id));
autoOpenQrReady.current = true;
}, []);
const openQrTask = useCallback((task: HuyaTaskItem) => {
autoOpenedQrTaskIds.current.add(task.id);
setQrTask(task);
}, []);
const loadAll = useCallback(async () => {
setLoading(true);
try {
@@ -110,7 +140,10 @@ export default function HuyaTasksPage() {
]);
if (accountResult.status === 'fulfilled') setAccounts(accountResult.value);
if (taskResult.status === 'fulfilled') setTasks(taskResult.value);
if (taskResult.status === 'fulfilled') {
rememberExistingQrcodes(taskResult.value);
setTasks(taskResult.value);
}
if (goodsResult.status === 'fulfilled') setGoods(goodsResult.value);
if (configResult.status === 'fulfilled' && configResult.value) form.setFieldsValue(configResult.value);
if (taskTypeResult.status === 'fulfilled') setTaskTypes({ ...FALLBACK_TASK_TYPES, ...taskTypeResult.value });
@@ -128,16 +161,17 @@ export default function HuyaTasksPage() {
} finally {
setLoading(false);
}
}, [canConfig, form]);
}, [canConfig, form, rememberExistingQrcodes]);
const loadTasks = useCallback(async () => {
try {
const data = await huyaApi.listTasks();
rememberExistingQrcodes(data);
setTasks(data);
} catch {
// 轮询失败不打扰操作，下一轮继续刷新。
}
}, []);
}, [rememberExistingQrcodes]);
useEffect(() => {
loadAll();
@@ -148,6 +182,14 @@ export default function HuyaTasksPage() {
return () => clearInterval(timer);
}, [loadTasks]);
useEffect(() => {
if (!autoOpenQrReady.current || qrTask) return;
const nextQrTask = tasks
.filter((task) => hasMiniQrcode(task) && !autoOpenedQrTaskIds.current.has(task.id))
.sort((a, b) => b.id - a.id)[0];
if (nextQrTask) openQrTask(nextQrTask);
}, [openQrTask, qrTask, tasks]);
const accountOptions = useMemo(() => {
return accounts.map((account) => ({ value: account.id, label: accountLabel(account) }));
}, [accounts]);
@@ -221,6 +263,32 @@ export default function HuyaTasksPage() {
const successCount = tasks.filter((task) => task.status === 'success').length;
const plannedCount = tasks.filter((task) => task.status === 'planned').length;
const failedCount = tasks.filter((task) => ['failed', 'error'].includes(task.status)).length;
const qrResult = qrTask?.result || null;
const qrImage = resultText(qrResult, 'mini_qrcode_image');
const qrAccountName = qrTask
? resultProfileNick(qrResult) || qrTask.account_nickname || qrTask.account_uid || `#${qrTask.account_id}`
: '';
const renderTaskResult = (value: Record<string, unknown> | null, record: HuyaTaskItem) => {
const bindQrImage = resultText(value, 'mini_qrcode_image');
if (bindQrImage) {
return (
<Button size="small" icon={<QrcodeOutlined />} onClick={() => openQrTask(record)}>
查看二维码
</Button>
);
}
if (record.task_type === 'get_bind_qr') {
return <Text type="secondary">-</Text>;
}
const availableScore = value?.available_score;
if (typeof availableScore === 'number') {
return <Tag color="blue">可用积分 {availableScore}</Tag>;
}
return value ? <Text code style={{ fontSize: 12 }}>{JSON.stringify(value)}</Text> : <Text type="secondary">-</Text>;
};
const taskColumns: TableProps<HuyaTaskItem>['columns'] = [
{ title: 'ID', dataIndex: 'id', width: 70, align: 'center' },
@@ -248,11 +316,9 @@ export default function HuyaTasksPage() {
{
title: '结果',
dataIndex: 'result',
width: 180,
width: 210,
ellipsis: true,
render: (value: Record<string, unknown> | null) => (
value ? <Text code style={{ fontSize: 12 }}>{JSON.stringify(value)}</Text> : <Text type="secondary">-</Text>
),
render: renderTaskResult,
},
{
title: '时间',
@@ -329,8 +395,8 @@ export default function HuyaTasksPage() {
</Form.Item>
</Col>
<Col span={12}>
<Form.Item label="绑定活动 ID" name="bind_act_id">
<Input placeholder="默认 17096" />
<Form.Item label="绑定 bActId" name="bind_act_id">
<Input placeholder="默认 9271" />
</Form.Item>
</Col>
<Col span={12}>
@@ -447,7 +513,7 @@ export default function HuyaTasksPage() {
))}
</div>
<Text type="secondary" style={{ fontSize: 12 }}>
当前阶段只创建 planned 任务并打通日志通道，真实 WSS/HTTP 执行器后续接入。
当前已接入查询积分和获取绑定二维码，其余任务会先保留计划记录。
</Text>
</div>
</Card>
@@ -480,6 +546,36 @@ export default function HuyaTasksPage() {
spinWhenEmpty
style={{ marginTop: 4 }}
/>
<Modal
title="绑定小程序码"
open={!!qrTask}
onCancel={() => setQrTask(null)}
footer={null}
width={360}
>
{qrTask && (
<div style={{ display: 'flex', flexDirection: 'column', alignItems: 'center', gap: 12, padding: '8px 0 12px' }}>
<Text strong style={{ maxWidth: '100%', textAlign: 'center' }}>{qrAccountName}</Text>
{qrImage ? (
<img
src={qrImage}
alt="绑定小程序码"
style={{
width: 260,
height: 260,
objectFit: 'contain',
display: 'block',
borderRadius: 8,
background: token.colorBgContainer,
}}
/>
) : (
<Text type="secondary">暂无二维码</Text>
)}
</div>
)}
</Modal>
</div>
);
}