feat: 接入新版数据大盘与系统配置分页 (#24)

改了什么:按产品 HTML 重做数据大盘 UI,接入可确认的大盘聚合数据;将首页配置和首页轮播种子迁入系统配置页并拆分首页/福利页 Tab。
验证:npx tsc --noEmit。

---------

Co-authored-by: lowmaster-chen <1119780489@qq.com>
Reviewed-on: #24
Co-authored-by: chenshuobo <chenshuobo@wonderable.ai>
Co-committed-by: chenshuobo <chenshuobo@wonderable.ai>
This commit was merged in pull request #24.
This commit is contained in:
chenshuobo
2026-06-28 10:37:56 +08:00
committed by marco
parent 03ef222b71
commit 510ce349f7
5 changed files with 1411 additions and 114 deletions
@@ -49,7 +49,7 @@ interface PreviewItem {
const yuan = (cents: number) => (cents / 100).toFixed(2); const yuan = (cents: number) => (cents / 100).toFixed(2);
/** 首页轮播「种子」管理(真实记录不足时的兜底假数据,现为「生成规则」)。「数据大盘」页的一个区块。 */ /** 首页轮播「种子」管理(真实记录不足时的兜底假数据,现为「生成规则」)。「系统配置 / 首页」里的一个区块。 */
export default function HomeMarqueeSeeds() { export default function HomeMarqueeSeeds() {
const { message } = App.useApp(); const { message } = App.useApp();
const [seeds, setSeeds] = useState<Seed[]>([]); const [seeds, setSeeds] = useState<Seed[]>([]);
@@ -246,7 +246,7 @@ function buildBody(metric: string, e: Edit, immediate: boolean): Record<string,
return body; return body;
} }
/** 首页三门面数字(帮助用户/完成比价/累计节省)的展示模式配置。作为「数据大盘」页的一个区块。 */ /** 首页三门面数字(帮助用户/完成比价/累计节省)的展示模式配置。「系统配置 / 首页」里的一个区块。 */
export default function HomeStatsConfig() { export default function HomeStatsConfig() {
const { message, modal } = App.useApp(); const { message, modal } = App.useApp();
const [items, setItems] = useState<StatItem[]>([]); const [items, setItems] = useState<StatItem[]>([]);
+77 -61
View File
@@ -1,8 +1,10 @@
'use client'; 'use client';
import { useEffect, useState } from 'react'; import { useEffect, useState } from 'react';
import { App, Button, Card, Input, InputNumber, Space, Spin, Switch, Tag, Tooltip } from 'antd'; import { App, Button, Card, Input, InputNumber, Space, Spin, Switch, Tabs, Tag, Tooltip } from 'antd';
import { api, errMsg } from '@/lib/api'; import { api, errMsg } from '@/lib/api';
import HomeMarqueeSeeds from './HomeMarqueeSeeds';
import HomeStatsConfig from './HomeStatsConfig';
interface ConfigItem { interface ConfigItem {
key: string; key: string;
@@ -80,9 +82,66 @@ export default function ConfigPage() {
} }
}; };
if (loading) return <Spin style={{ display: 'block', marginTop: 80 }} />;
const groups = [...new Set(items.map((i) => i.group))]; const groups = [...new Set(items.map((i) => i.group))];
const welfareConfig = loading ? (
<Spin style={{ display: 'block', marginTop: 24 }} />
) : (
groups.map((g) => (
<Card key={g} title={g} size="small" style={{ marginBottom: 16 }}>
{items
.filter((i) => i.group === g)
.map((item) => (
<div
key={item.key}
style={{ marginBottom: 12, paddingBottom: 12, borderBottom: '1px solid #f0f0f0' }}
>
<div style={{ marginBottom: 4 }}>
<b>{item.label}</b> {item.overridden ? <Tag color="blue"></Tag> : <Tag></Tag>}
{item.help && (
<Tooltip title={item.help}>
<span style={{ color: '#999', marginLeft: 6, fontSize: 12, cursor: 'help' }}>
</span>
</Tooltip>
)}
</div>
<Space wrap>
{item.type === 'bool' ? (
<Switch
checked={!!edits[item.key]}
onChange={(v) => setEdits({ ...edits, [item.key]: v })}
/>
) : item.type === 'int' ? (
<InputNumber
value={edits[item.key]}
onChange={(v) => setEdits({ ...edits, [item.key]: v })}
style={{ width: 180 }}
/>
) : (
<Input
value={edits[item.key]}
onChange={(e) => setEdits({ ...edits, [item.key]: e.target.value })}
style={{ width: 380 }}
placeholder={
item.type === 'int_list' ? '逗号分隔,如 10, 20, 30' : 'JSON,如 {"key": 100}'
}
/>
)}
<Button
type="primary"
size="small"
loading={saving === item.key}
onClick={() => save(item)}
>
</Button>
<span style={{ color: '#bbb', fontSize: 12 }}> {JSON.stringify(item.default)}</span>
</Space>
</div>
))}
</Card>
))
);
return ( return (
<div> <div>
@@ -90,64 +149,21 @@ export default function ConfigPage() {
<p style={{ color: '#999' }}> <p style={{ color: '#999' }}>
() / , () / ,
</p> </p>
{groups.map((g) => ( <Tabs
<Card key={g} title={g} size="small" style={{ marginBottom: 16 }}> items={[
{items {
.filter((i) => i.group === g) key: 'home',
.map((item) => ( label: '首页',
<div children: (
key={item.key} <>
style={{ marginBottom: 12, paddingBottom: 12, borderBottom: '1px solid #f0f0f0' }} <HomeStatsConfig />
> <HomeMarqueeSeeds />
<div style={{ marginBottom: 4 }}> </>
<b>{item.label}</b>{' '} ),
{item.overridden ? <Tag color="blue"></Tag> : <Tag></Tag>} },
{item.help && ( { key: 'welfare', label: '福利页', children: welfareConfig },
<Tooltip title={item.help}> ]}
<span style={{ color: '#999', marginLeft: 6, fontSize: 12, cursor: 'help' }}> />
</span>
</Tooltip>
)}
</div>
<Space wrap>
{item.type === 'bool' ? (
<Switch
checked={!!edits[item.key]}
onChange={(v) => setEdits({ ...edits, [item.key]: v })}
/>
) : item.type === 'int' ? (
<InputNumber
value={edits[item.key]}
onChange={(v) => setEdits({ ...edits, [item.key]: v })}
style={{ width: 180 }}
/>
) : (
<Input
value={edits[item.key]}
onChange={(e) => setEdits({ ...edits, [item.key]: e.target.value })}
style={{ width: 380 }}
placeholder={
item.type === 'int_list' ? '逗号分隔,如 10, 20, 30' : 'JSON,如 {"key": 100}'
}
/>
)}
<Button
type="primary"
size="small"
loading={saving === item.key}
onClick={() => save(item)}
>
</Button>
<span style={{ color: '#bbb', fontSize: 12 }}>
{JSON.stringify(item.default)}
</span>
</Space>
</div>
))}
</Card>
))}
</div> </div>
); );
} }
File diff suppressed because it is too large Load Diff
+67 -2
View File
@@ -431,6 +431,13 @@ export interface AdRevenueReport {
total_expected_coin: number; total_expected_coin: number;
total_actual_coin: number; total_actual_coin: number;
mismatch_count: number; // 应发≠实发的发奖条数 mismatch_count: number; // 应发≠实发的发奖条数
by_ad_type?: Record<string, {
ad_type: string;
impressions: number;
revenue_yuan: number;
expected_coin: number;
actual_coin: number;
}>;
items: AdRevenueRow[]; items: AdRevenueRow[];
} }
@@ -443,7 +450,17 @@ export interface DashboardOverview {
new_today: number; new_today: number;
dau: number; dau: number;
}; };
coins: { granted_total: number }; coins: {
granted_total: number;
reward_video_coin_total?: number;
reward_video_watch_count?: number;
feed_ad_coin_total?: number;
feed_ad_watch_count?: number;
signin_coin_total?: number;
signin_count?: number;
signin_boost_coin_total?: number;
signin_boost_watch_count?: number;
};
cash: { cash: {
withdraw_success_cents: number; withdraw_success_cents: number;
withdraw_pending_count: number; withdraw_pending_count: number;
@@ -451,8 +468,56 @@ export interface DashboardOverview {
withdraw_failed_count: number; withdraw_failed_count: number;
}; };
comparison: { total: number; success: number; success_rate: number }; comparison: { total: number; success: number; success_rate: number };
period: {
date_from: string;
date_to: string;
users: {
new: number;
active: number;
retained_new_users: number;
retention_rate: number | null;
retention_note: string;
};
comparison: {
total: number;
success: number;
success_rate: number;
ordered: number;
average_duration_ms: number | null;
average_saved_cents: number | null;
};
coins: {
granted_total: number;
reward_video_coin_total: number;
feed_ad_coin_total: number;
signin_coin_total: number;
signin_boost_coin_total: number;
task_coin_total: number;
coupon_reward_coin_total: number;
comparison_reward_coin_total: number;
regular_task_coin_total: number;
};
cash: {
withdraw_success_cents: number;
};
trend: Array<{
date: string;
active_users: number;
new_users: number;
comparisons: number;
}>;
};
feedback: { new: number }; feedback: { new: number };
cps: { available: boolean; note: string }; cps: {
available: boolean;
note: string;
meituan_order_count?: number;
meituan_commission_cents?: number;
meituan_hit_count?: number;
meituan_miss_count?: number;
meituan_unknown_rate_count?: number;
meituan_hit_rate?: number | null;
};
} }
export interface PriceReport { export interface PriceReport {