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

优化 ui

Browse Source
This commit is contained in:
yml2213
2026-06-22 14:21:39 +08:00
parent b08f0a647d
commit 627f06d0a0
14 changed files with 322 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/backend/__pycache__/main.cpython-312.pyc
BIN
View File
Binary file not shown.
web/backend/main.py
+2 -1
View File
@@ -6,7 +6,7 @@ from fastapi import FastAPI
from fastapi.middleware.cors import CORSMiddleware
from .database import init_db
from .routers import auth, users, accounts, login, proxy
from .routers import auth, users, accounts, login, proxy, cookies
@asynccontextmanager
@@ -36,6 +36,7 @@ app.include_router(users.router)
app.include_router(accounts.router)
app.include_router(login.router)
app.include_router(proxy.router)
app.include_router(cookies.router)
@app.get("/api/health")
web/backend/routers/__pycache__/login.cpython-312.pyc
BIN
View File
Binary file not shown.
web/backend/routers/cookies.py
+95
View File
@@ -0,0 +1,95 @@
"""Cookie 管理路由"""
from fastapi import APIRouter, Depends, HTTPException
from fastapi.responses import StreamingResponse
from sqlalchemy.orm import Session
import io
import csv
from ..database import get_db
from ..models import User, LoginTask, Account
from ..deps import get_current_user, require_permission
from ..permissions import has_permission
router = APIRouter(prefix="/api/cookies", tags=["Cookie管理"])
@router.get("")
def list_cookies(
db: Session = Depends(get_db),
current: User = Depends(get_current_user),
):
"""查看登录成功的 Cookie 列表。"""
query = db.query(LoginTask).filter(LoginTask.status == "success")
# 客服只能看自己账号的
if not has_permission(current.role, "login:view_all"):
query = query.join(Account, LoginTask.account_id == Account.id).filter(
Account.assigned_to == current.id
)
tasks = query.order_by(LoginTask.finished_at.desc()).all()
result = []
for t in tasks:
acc = db.query(Account).filter(Account.id == t.account_id).first()
item = {
"id": t.id,
"batch_id": t.batch_id,
"account_id": t.account_id,
"account_username": acc.username if acc else "",
"created_at": t.finished_at.isoformat() if t.finished_at else None,
}
# 只有有 cookie:view 权限才返回 cookie 内容
if has_permission(current.role, "cookie:view"):
cookie = t.cookie or ""
item["cookie"] = cookie
item["cookie_preview"] = cookie[:50] + "..." if len(cookie) > 50 else cookie
else:
item["cookie"] = ""
item["cookie_preview"] = "***"
result.append(item)
return result
@router.get("/export")
def export_cookies(
db: Session = Depends(get_db),
current: User = Depends(require_permission("cookie:export")),
):
"""导出 Cookie 为 CSV。"""
tasks = db.query(LoginTask).filter(
LoginTask.status == "success"
).order_by(LoginTask.finished_at.desc()).all()
output = io.StringIO()
writer = csv.writer(output)
writer.writerow(["账号", "Cookie", "时间"])
for t in tasks:
acc = db.query(Account).filter(Account.id == t.account_id).first()
username = acc.username if acc else ""
writer.writerow([username, t.cookie or "", t.finished_at.isoformat() if t.finished_at else ""])
output.seek(0)
return StreamingResponse(
iter([output.getvalue()]),
media_type="text/csv",
headers={"Content-Disposition": "attachment; filename=cookies.csv"},
)
@router.delete("/{task_id}")
def delete_cookie(
task_id: int,
db: Session = Depends(get_db),
current: User = Depends(require_permission("cookie:export")),
):
"""删除一条 Cookie 记录。"""
task = db.query(LoginTask).filter(LoginTask.id == task_id).first()
if not task:
raise HTTPException(status_code=404, detail="记录不存在")
task.cookie = ""
task.status = "failed"
task.message = "Cookie已清除"
db.commit()
return {"message": "已删除", "success": True}
web/backend/routers/login.py
+26 -10
View File
@@ -15,12 +15,12 @@ from ..services.login_service import LoginBatchRunner
router = APIRouter(prefix="/api/login", tags=["登录任务"])
# 运行中的批次: batch_id -> {runner, log_queue, loop}
# 运行中的批次: batch_id -> {log_queue, loop, runner}
_active_batches: dict[str, dict] = {}
@router.post("/batch")
def create_batch(
async def create_batch(
req: LoginBatchRequest,
db: Session = Depends(get_db),
current: User = Depends(require_permission("login:batch")),
@@ -46,6 +46,10 @@ def create_batch(
if not valid_ids:
raise HTTPException(status_code=403, detail="没有可登录的账号")
# 在主事件循环中创建 log_queue，传给后台线程
log_queue = asyncio.Queue()
loop = asyncio.get_running_loop()
# 创建执行器（用独立的 DB 会话，因为在线程中运行）
thread_db = SessionLocal()
runner = LoginBatchRunner(
@@ -55,10 +59,19 @@ def create_batch(
creator_role=current.role,
max_geetest_retries=req.max_geetest_retries,
proxy_config=proxy,
log_queue=log_queue,
loop=loop,
)
batch_id = runner.batch_id
# 先注册到全局，再启动线程，确保 WebSocket 连接时能找到
_active_batches[batch_id] = {
"log_queue": log_queue,
"loop": loop,
"runner": runner,
}
# 启动线程
thread = threading.Thread(target=runner.run, daemon=True)
thread.start()
@@ -114,21 +127,24 @@ async def ws_login_logs(websocket: WebSocket, batch_id: str):
"""WebSocket 推送登录实时日志。"""
await websocket.accept()
log_queue = asyncio.Queue()
loop = asyncio.get_running_loop()
# 从已注册的批次中获取 log_queue（由 create_batch 创建）
batch = _active_batches.get(batch_id)
if not batch:
await websocket.send_json({"level": "error", "message": "批次不存在或已结束"})
await websocket.close()
return
# 查找已运行的批次，或等待新批次
# 简化：直接把 log_queue 注册到全局，前端创建批次后连 ws
_active_batches[batch_id] = {
"log_queue": log_queue,
"loop": loop,
}
log_queue: asyncio.Queue = batch["log_queue"]
try:
while True:
try:
msg = await asyncio.wait_for(log_queue.get(), timeout=30)
await websocket.send_json(msg)
# 收到 result 表示任务结束
if msg.get("level") == "result":
await asyncio.sleep(0.1)
break
except asyncio.TimeoutError:
await websocket.send_json({"level": "heartbeat", "message": ""})
except WebSocketDisconnect:
web/backend/services/__pycache__/login_service.cpython-312.pyc
BIN
View File
Binary file not shown.
web/backend/services/login_service.py
+1
View File
@@ -175,3 +175,4 @@ class LoginBatchRunner:
self.db.commit()
self._push_log("info", f"批量登录任务 {batch_id} 完成")
self._push_log("result", "")
web/frontend/src/App.tsx
+2
View File
@@ -9,6 +9,7 @@ import AccountsPage from './pages/AccountsPage';
import LoginTasksPage from './pages/LoginTasksPage';
import ProxyPage from './pages/ProxyPage';
import UsersPage from './pages/UsersPage';
import CookiePage from './pages/CookiePage';
import { getToken } from './store/auth';
function App() {
@@ -29,6 +30,7 @@ function App() {
<Route index element={<DashboardPage />} />
<Route path="accounts" element={<AccountsPage />} />
<Route path="login-tasks" element={<LoginTasksPage />} />
<Route path="cookies" element={<CookiePage />} />
<Route path="proxy" element={<ProxyPage />} />
<Route path="users" element={<UsersPage />} />
</Route>
web/frontend/src/api/modules.ts
+6
View File
@@ -52,6 +52,12 @@ export const loginApi = {
stop: (batch_id: string) => api.post<any, any>(`/login/stop/${batch_id}`),
};
export const cookieApi = {
list: () => api.get<any, any[]>('/cookies'),
exportCsv: () => api.get('/cookies/export', { responseType: 'blob' }),
delete: (id: number) => api.delete<any, any>(`/cookies/${id}`),
};
export const proxyApi = {
get: () => api.get<any, any>('/proxy'),
update: (data: any) => api.put<any, any>('/proxy', data),
web/frontend/src/layouts/MainLayout.tsx
+56 -33
View File
@@ -1,14 +1,15 @@
import { useEffect, useState } from 'react';
import { Layout, Menu, Dropdown, Avatar, Space, Typography } from 'antd';
import { Layout, Menu, Avatar, Space, Typography, Button } from 'antd';
import {
DashboardOutlined, UserOutlined, LogoutOutlined,
CloudServerOutlined, TeamOutlined, ApiOutlined,
CloudServerOutlined, TeamOutlined, ApiOutlined, KeyOutlined,
MenuFoldOutlined, MenuUnfoldOutlined,
} from '@ant-design/icons';
import { useNavigate, useLocation, Outlet } from 'react-router-dom';
import { getUser, clearAuth, hasPerm, type AuthUser } from '../store/auth';
import { authApi } from '../api/modules';
const { Header, Sider, Content } = Layout;
const { Sider, Content } = Layout;
const { Text } = Typography;
const ROLE_LABELS: Record<string, string> = {
@@ -44,6 +45,11 @@ export default function MainLayout({ onLogout }: { onLogout?: () => void }) {
menuItems.push({ key: '/login-tasks', label: '登录任务', icon: <ApiOutlined /> });
}
// Cookie 管理
if (hasPerm(user, 'cookie:view')) {
menuItems.push({ key: '/cookies', label: 'Cookie 管理', icon: <KeyOutlined /> });
}
// 代理配置
if (hasPerm(user, 'proxy:manage')) {
menuItems.push({ key: '/proxy', label: '代理配置', icon: <CloudServerOutlined /> });
@@ -59,30 +65,30 @@ export default function MainLayout({ onLogout }: { onLogout?: () => void }) {
await authApi.logout();
} catch {}
clearAuth();
onLogout?.(); // 触发 App 重渲染
onLogout?.();
navigate('/login', { replace: true });
};
const userMenu = {
items: [
{
key: 'logout',
label: '退出登录',
icon: <LogoutOutlined />,
onClick: handleLogout,
},
],
};
return (
<Layout style={{ minHeight: '100vh' }}>
<Sider collapsible collapsed={collapsed} onCollapse={setCollapsed}>
<Layout style={{ height: '100vh', overflow: 'hidden' }}>
<Sider trigger={null} collapsed={collapsed} onCollapse={setCollapsed}
style={{ display: 'flex', flexDirection: 'column' }}>
<div style={{
height: 48, margin: 12, color: '#fff', fontSize: 16,
height: 48, margin: '12px 12px 0', color: '#fff', fontSize: 16,
textAlign: 'center', lineHeight: '48px', fontWeight: 'bold',
whiteSpace: 'nowrap', overflow: 'hidden',
whiteSpace: 'nowrap', overflow: 'hidden', flexShrink: 0,
display: 'flex', alignItems: 'center', justifyContent: 'center', gap: 8,
}}>
{collapsed ? '鱼' : '斗鱼登录后台'}
<span style={{ overflow: 'hidden', textOverflow: 'ellipsis' }}>
{collapsed ? '鱼' : '斗鱼登录后台'}
</span>
<Button
type="text"
size="small"
icon={collapsed ? <MenuUnfoldOutlined /> : <MenuFoldOutlined />}
onClick={() => setCollapsed(!collapsed)}
style={{ color: '#fff', flexShrink: 0 }}
/>
</div>
<Menu
theme="dark"
@@ -90,22 +96,39 @@ export default function MainLayout({ onLogout }: { onLogout?: () => void }) {
selectedKeys={[location.pathname]}
items={menuItems}
onClick={({ key }) => navigate(key)}
style={{ flex: 1, overflow: 'auto', marginTop: 8 }}
/>
<div style={{
borderTop: '1px solid rgba(255,255,255,0.1)',
padding: '12px',
flexShrink: 0,
}}>
<Space style={{ color: '#fff', width: '100%', marginBottom: collapsed ? 0 : 8 }}>
<Avatar icon={<UserOutlined />} size="small" />
{!collapsed && (
<>
<Text style={{ color: '#fff' }}>{user.username}</Text>
<Text style={{ color: 'rgba(255,255,255,0.65)', fontSize: 12 }}>
({ROLE_LABELS[user.role] || user.role})
</Text>
</>
)}
</Space>
{!collapsed && (
<Button
block
size="small"
icon={<LogoutOutlined />}
onClick={handleLogout}
style={{ textAlign: 'left' }}
>
退出登录
</Button>
)}
</div>
</Sider>
<Layout>
<Header style={{
background: '#fff', padding: '0 24px',
display: 'flex', justifyContent: 'flex-end', alignItems: 'center',
}}>
<Dropdown menu={userMenu} placement="bottomRight">
<Space style={{ cursor: 'pointer' }}>
<Avatar icon={<UserOutlined />} />
<Text>{user.username}</Text>
<Text type="secondary">({ROLE_LABELS[user.role] || user.role})</Text>
</Space>
</Dropdown>
</Header>
<Content style={{ margin: 16, padding: 24, background: '#fff', borderRadius: 8 }}>
<Content style={{ margin: 16, padding: 24, background: '#fff', borderRadius: 8, overflow: 'auto' }}>
<Outlet />
</Content>
</Layout>
web/frontend/src/pages/CookiePage.tsx
+108
View File
@@ -0,0 +1,108 @@
import { useEffect, useState } from 'react';
import { Table, Button, Card, Row, Col, Statistic, message, Tag, Popconfirm } from 'antd';
import { DownloadOutlined, DeleteOutlined } from '@ant-design/icons';
import { cookieApi } from '../api/modules';
import { getUser, hasPerm } from '../store/auth';
export default function CookiePage() {
const [cookies, setCookies] = useState<any[]>([]);
const [loading, setLoading] = useState(false);
const user = getUser();
const canView = hasPerm(user, 'cookie:view');
const canExport = hasPerm(user, 'cookie:export');
const loadCookies = async () => {
setLoading(true);
try {
const data = await cookieApi.list();
setCookies(data);
} catch (e: any) {
message.error(e.message);
} finally {
setLoading(false);
}
};
useEffect(() => {
loadCookies();
}, []);
const handleExport = async () => {
try {
const res = await cookieApi.exportCsv();
const url = URL.createObjectURL(new Blob([res.data]));
const a = document.createElement('a');
a.href = url;
a.download = 'cookies.csv';
a.click();
URL.revokeObjectURL(url);
message.success('已导出');
} catch (e: any) {
message.error(e.message);
}
};
const handleDelete = async (id: number) => {
try {
await cookieApi.delete(id);
message.success('已删除');
loadCookies();
} catch (e: any) {
message.error(e.message);
}
};
const columns: any[] = [
{ title: 'ID', dataIndex: 'id', width: 60 },
{ title: '账号', dataIndex: 'account_username' },
{
title: 'Cookie',
dataIndex: 'cookie_preview',
ellipsis: true,
render: (val: string) => {
if (!canView) return <Tag>***</Tag>;
return <span style={{ fontFamily: 'monospace', fontSize: 12 }}>{val}</span>;
},
},
{ title: '时间', dataIndex: 'created_at', width: 180 },
];
if (canExport) {
columns.push({
title: '操作',
width: 80,
render: (_: any, record: any) => (
<Popconfirm title="确认删除？" onConfirm={() => handleDelete(record.id)}>
<Button danger size="small" icon={<DeleteOutlined />}>删除</Button>
</Popconfirm>
),
});
}
return (
<div>
<div style={{ marginBottom: 16, display: 'flex', justifyContent: 'space-between' }}>
<h2>Cookie 管理</h2>
{canExport && (
<Button type="primary" icon={<DownloadOutlined />} onClick={handleExport}>
导出 CSV
</Button>
)}
</div>
<Row gutter={16} style={{ marginBottom: 16 }}>
<Col span={6}>
<Card size="small"><Statistic title="Cookie 总数" value={cookies.length} /></Card>
</Col>
</Row>
<Table
columns={columns}
dataSource={cookies}
rowKey="id"
loading={loading}
size="small"
pagination={{ pageSize: 20 }}
/>
</div>
);
}
web/frontend/src/pages/LoginTasksPage.tsx
+8 -1
View File
@@ -29,6 +29,7 @@ export default function LoginTasksPage() {
const [loading, setLoading] = useState(false);
const [batchId, setBatchId] = useState<string | null>(null);
const [logs, setLogs] = useState<{ level: string; message: string }[]>([]);
const [wsConnected, setWsConnected] = useState(false);
const wsRef = useRef<WebSocket | null>(null);
const user = getUser();
@@ -75,13 +76,19 @@ export default function LoginTasksPage() {
const wsUrl = `ws://${window.location.hostname}:8000/api/login/ws/login/${result.batch_id}`;
const ws = new WebSocket(wsUrl);
wsRef.current = ws;
setWsConnected(true);
ws.onmessage = (event) => {
const msg = JSON.parse(event.data);
if (msg.level === 'heartbeat') return;
if (msg.level === 'result') return;
setLogs((prev) => [...prev, msg]);
};
ws.onclose = () => {
wsRef.current = null;
setWsConnected(false);
};
ws.onerror = () => {
setWsConnected(false);
};
} catch (e: any) {
message.error(e.message);
@@ -183,7 +190,7 @@ export default function LoginTasksPage() {
bodyStyle={{ maxHeight: 500, overflow: 'auto', fontFamily: 'monospace', fontSize: 12 }}
>
{logs.length === 0 ? (
<Spin spinning={!!batchId} size="small" />
<Spin spinning={wsConnected} size="small" />
) : (
logs.map((log, i) => (
<div
web/frontend/src/pages/ProxyPage.tsx
+18 -16
View File
@@ -112,8 +112,8 @@ export default function ProxyPage() {
};
return (
<div style={{ display: 'flex', flexDirection: 'column', height: '100%' }}>
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: 16 }}>
<div style={{ display: 'flex', flexDirection: 'column', height: '100%', gap: 8 }}>
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', flexShrink: 0 }}>
<h2 style={{ margin: 0 }}>代理配置</h2>
<Button type="primary" onClick={handleSave} loading={loading}>保存配置</Button>
</div>
@@ -122,6 +122,7 @@ export default function ProxyPage() {
form={form}
layout="vertical"
disabled={!configLoaded}
size="small"
initialValues={{
enabled: false,
whitelist_enabled: false,
@@ -131,37 +132,38 @@ export default function ProxyPage() {
whitelist_uid: '',
whitelist_ukey: '',
}}
style={{ flexShrink: 0 }}
>
<Row gutter={16}>
<Row gutter={12}>
<Col span={12}>
<Card title="代理设置" size="small" style={{ marginBottom: 16 }}>
<Form.Item name="enabled" label="启用代理" valuePropName="checked">
<Card title="代理设置" size="small" styles={{ body: { paddingBottom: 8 } }}>
<Form.Item name="enabled" label="启用代理" valuePropName="checked" style={{ marginBottom: 8 }}>
<Switch />
</Form.Item>
<Form.Item name="api_url" label="代理API地址">
<Form.Item name="api_url" label="代理API地址" style={{ marginBottom: 8 }}>
<Input placeholder="http://op.xiequ.cn/...?act=get" />
</Form.Item>
<Form.Item name="http" label="静态HTTP代理">
<Form.Item name="http" label="静态HTTP代理" style={{ marginBottom: 8 }}>
<Input placeholder="http://ip:port" />
</Form.Item>
<Form.Item name="https" label="静态HTTPS代理">
<Form.Item name="https" label="静态HTTPS代理" style={{ marginBottom: 8 }}>
<Input placeholder="http://ip:port" />
</Form.Item>
<Button onClick={handleTestProxy} loading={testing}>测试代理</Button>
<Button size="small" onClick={handleTestProxy} loading={testing}>测试代理</Button>
</Card>
</Col>
<Col span={12}>
<Card title="白名单管理" size="small" style={{ marginBottom: 16 }}>
<Form.Item name="whitelist_enabled" label="启用白名单自动管理" valuePropName="checked">
<Card title="白名单管理" size="small" styles={{ body: { paddingBottom: 8 } }}>
<Form.Item name="whitelist_enabled" label="启用白名单自动管理" valuePropName="checked" style={{ marginBottom: 8 }}>
<Switch />
</Form.Item>
<Form.Item name="whitelist_uid" label="协固UID">
<Form.Item name="whitelist_uid" label="协固UID" style={{ marginBottom: 8 }}>
<Input placeholder="如: 99769" />
</Form.Item>
<Form.Item name="whitelist_ukey" label="协固UKEY">
<Form.Item name="whitelist_ukey" label="协固UKEY" style={{ marginBottom: 8 }}>
<Input placeholder="如: C99371082B965B70F46DCAA87A04618B" />
</Form.Item>
<Button onClick={handleTestWhitelist} loading={testingWl}>测试白名单</Button>
<Button size="small" onClick={handleTestWhitelist} loading={testingWl}>测试白名单</Button>
</Card>
</Col>
</Row>
@@ -170,8 +172,8 @@ export default function ProxyPage() {
<Card
title="实时日志"
size="small"
style={{ flex: 1, minHeight: 200, overflow: 'auto' }}
styles={{ body: { maxHeight: 350, overflow: 'auto', fontFamily: 'monospace', fontSize: 12, padding: '8px 16px' } }}
style={{ flex: 1, overflow: 'hidden' }}
styles={{ body: { height: '100%', overflow: 'auto', fontFamily: 'monospace', fontSize: 12, padding: '8px 16px' } }}
>
{logs.length === 0 ? (
<span style={{ color: '#999' }}>点击"测试代理"或"测试白名单"查看日志</span>