品牌化重构: StreamCore + 现代UI主题 + 英文界面

- 移除所有emoji (HomePage中的🎬改为VideoCameraOutlined图标)
- 主题重设计: 深蓝色系主色(#1E3A5F),系统sans-serif字体
  白色/浅灰背景,现代卡片阴影和圆角,完全去除复古感
- 首页移除管理入口,纯观众视角(渐变横幅+卡片列表)
- 统一品牌名称 StreamCore (替换LiveStream)
- 全部界面英文(antd默认locale,去除zhCN)
- 登录页渐变+卡片居中布局
This commit is contained in:
admin committed 2026-08-10 14:40:58 +08:00
1 parent b81a7bf293
commit 5f19fc6aa5
14 files changed
+253 -225

No files matched your search

+25 -20
View File
@@ -1,9 +1,9 @@
import { useState, useEffect } from 'react'
import { Row, Col, Card, Statistic, Typography, Table, Tag, Space } from 'antd'
import { VideoCameraOutlined, EyeOutlined, SignalFilled } from '@ant-design/icons'
import { VideoCameraOutlined, SignalFilled, PlayCircleOutlined } from '@ant-design/icons'
import { fetchStreams, type StreamInfo } from '../../api/streams'
const { Title } = Typography
const { Title, Text } = Typography
export default function Dashboard() {
const [streams, setStreams] = useState<StreamInfo[]>([])
@@ -27,60 +27,65 @@ export default function Dashboard() {
const pendingCount = streams.filter((s) => s.status === 'pending').length
const statusMap: Record<string, { color: string; label: string }> = {
pending: { color: 'blue', label: '待开播' },
live: { color: 'green', label: '直播中' },
ended: { color: 'default', label: '已结束' },
cancelled: { color: 'red', label: '已取消' },
pending: { color: 'blue', label: 'Scheduled' },
live: { color: 'green', label: 'Live' },
ended: { color: 'default', label: 'Ended' },
cancelled: { color: 'red', label: 'Cancelled' },
}
const recentColumns = [
{ title: '标题', dataIndex: 'title', key: 'title', ellipsis: true },
{ title: 'Title', dataIndex: 'title', key: 'title', ellipsis: true },
{
title: '状态', dataIndex: 'status', key: 'status',
title: 'Status', dataIndex: 'status', key: 'status',
render: (status: string) => {
const s = statusMap[status] || { color: 'default', label: status }
return <Tag color={s.color}>{s.label}</Tag>
},
width: 110,
},
{
title: 'Created', dataIndex: 'created_at', key: 'created_at',
render: (v: string) => v?.slice(0, 16),
width: 170,
},
{ title: '创建时间', dataIndex: 'created_at', key: 'created_at', render: (v: string) => v?.slice(0, 16) },
]
return (
<div>
<Title level={3} style={{ marginBottom: 24 }}>概览</Title>
<Title level={3} style={{ marginBottom: 24, fontWeight: 600 }}>Overview</Title>
<Row gutter={[24, 24]}>
<Col xs={24} sm={8}>
<Card>
<Card style={{ borderRadius: 12 }}>
<Statistic
title="直播中"
title="Live Now"
value={liveCount}
prefix={<SignalFilled style={{ color: '#52c41a' }} />}
prefix={<SignalFilled style={{ color: '#2E7D32' }} />}
loading={loading}
/>
</Card>
</Col>
<Col xs={24} sm={8}>
<Card>
<Card style={{ borderRadius: 12 }}>
<Statistic
title="待开播"
title="Scheduled"
value={pendingCount}
prefix={<VideoCameraOutlined style={{ color: '#1677ff' }} />}
prefix={<VideoCameraOutlined style={{ color: '#1565C0' }} />}
loading={loading}
/>
</Card>
</Col>
<Col xs={24} sm={8}>
<Card>
<Card style={{ borderRadius: 12 }}>
<Statistic
title="直播总数"
title="Total Streams"
value={streams.length}
prefix={<EyeOutlined />}
prefix={<PlayCircleOutlined />}
loading={loading}
/>
</Card>
</Col>
</Row>
<Card title="最近直播" style={{ marginTop: 24 }}>
<Card title="Recent Streams" style={{ marginTop: 24, borderRadius: 12 }}>
<Table
dataSource={streams.slice(0, 10)}
columns={recentColumns}