Compare commits
2 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 95d90bb756 | |||
| 510ce349f7 |
@@ -139,18 +139,21 @@ const DETAIL_COLUMNS: ColumnsType<AdRevenueRecord> = [
|
||||
},
|
||||
];
|
||||
|
||||
// 趋势图(纯 SVG,零依赖):柱=展示条数(左轴),线=预估收益元(右轴)。x 轴按传入点序。
|
||||
// 趋势图(纯 SVG,零依赖):柱=展示条数(左轴),橙线=客户端预估收益元(右轴),
|
||||
// 绿线=穿山甲后台预估收益元(右轴,仅按天且有数据时出现)。x 轴按传入点序。
|
||||
const CHART_BAR = '#69b1ff';
|
||||
const CHART_LINE = '#fa8c16';
|
||||
const CHART_LINE2 = '#52c41a'; // 穿山甲后台收益线
|
||||
|
||||
interface TrendPoint {
|
||||
label: string; // x 轴刻度文案(小时数 / MM-DD)
|
||||
tip: string; // hover 原生 tooltip 全文
|
||||
impressions: number;
|
||||
revenue: number;
|
||||
pangleRevenue: number | null; // 穿山甲后台预估收益(元);无则 null(不画绿线点)
|
||||
}
|
||||
|
||||
// 按小时聚合(0–23),数据源是 hourly(后端全量聚合,不受分页影响)
|
||||
// 按小时聚合(0–23),数据源是 hourly(后端全量聚合,不受分页影响)。穿山甲为天级,小时视图无该线。
|
||||
function aggregateHourly(rows: AdRevenueHourly[]): TrendPoint[] {
|
||||
const byHour = Array.from({ length: 24 }, (_, h) => ({ hour: h, impressions: 0, revenue: 0 }));
|
||||
for (const r of rows) {
|
||||
@@ -163,10 +166,12 @@ function aggregateHourly(rows: AdRevenueHourly[]): TrendPoint[] {
|
||||
tip: `${String(b.hour).padStart(2, '0')}:00 展示 ${b.impressions} 条 · 预估收益 ${b.revenue.toFixed(4)} 元`,
|
||||
impressions: b.impressions,
|
||||
revenue: b.revenue,
|
||||
pangleRevenue: null,
|
||||
}));
|
||||
}
|
||||
|
||||
// 按天聚合,数据源是 daily(全量,不受 limit 影响);用 from..to 补齐空缺日为 0,轴连续
|
||||
// 按天聚合,数据源是 daily(全量,不受 limit 影响);用 from..to 补齐空缺日为 0,轴连续。
|
||||
// 穿山甲收益(pangle_revenue_yuan)为 null 时该日不画绿线点(T+1 未出/非全量视图)。
|
||||
function aggregateDaily(dateFrom: string, dateTo: string, daily: AdRevenueDaily[]): TrendPoint[] {
|
||||
const map = new Map(daily.map((d) => [d.date, d]));
|
||||
const out: TrendPoint[] = [];
|
||||
@@ -177,11 +182,14 @@ function aggregateDaily(dateFrom: string, dateTo: string, daily: AdRevenueDaily[
|
||||
const d = map.get(ds);
|
||||
const impressions = d?.impressions ?? 0;
|
||||
const revenue = d?.revenue_yuan ?? 0;
|
||||
const pangleRevenue = d?.pangle_revenue_yuan ?? null;
|
||||
const pangleTip = pangleRevenue != null ? ` · 穿山甲收益 ${pangleRevenue.toFixed(4)} 元` : '';
|
||||
out.push({
|
||||
label: ds.slice(5),
|
||||
tip: `${ds} 展示 ${impressions} 条 · 预估收益 ${revenue.toFixed(4)} 元`,
|
||||
tip: `${ds} 展示 ${impressions} 条 · 预估收益 ${revenue.toFixed(4)} 元${pangleTip}`,
|
||||
impressions,
|
||||
revenue,
|
||||
pangleRevenue,
|
||||
});
|
||||
cur = cur.add(1, 'day');
|
||||
guard += 1;
|
||||
@@ -192,7 +200,11 @@ function aggregateDaily(dateFrom: string, dateTo: string, daily: AdRevenueDaily[
|
||||
function TrendChart({ points }: { points: TrendPoint[] }) {
|
||||
const n = points.length;
|
||||
const maxImp = Math.max(1, ...points.map((p) => p.impressions));
|
||||
const maxRev = Math.max(1e-9, ...points.map((p) => p.revenue));
|
||||
const maxRev = Math.max(
|
||||
1e-9,
|
||||
...points.map((p) => p.revenue),
|
||||
...points.map((p) => p.pangleRevenue ?? 0),
|
||||
);
|
||||
|
||||
const W = 960;
|
||||
const H = 280;
|
||||
@@ -248,6 +260,24 @@ function TrendChart({ points }: { points: TrendPoint[] }) {
|
||||
<title>{p.tip}</title>
|
||||
</circle>
|
||||
))}
|
||||
{/* 穿山甲后台收益线(绿,仅非 null 的天画;按天且已同步 T+1 数据时出现) */}
|
||||
{(() => {
|
||||
const pp = points
|
||||
.map((p, i) => ({ i, v: p.pangleRevenue, tip: p.tip }))
|
||||
.filter((x): x is { i: number; v: number; tip: string } => x.v != null);
|
||||
if (pp.length === 0) return null;
|
||||
const pangleLine = pp.map((x) => `${cx(x.i)},${revY(x.v)}`).join(' ');
|
||||
return (
|
||||
<g>
|
||||
<polyline points={pangleLine} fill="none" stroke={CHART_LINE2} strokeWidth={2} />
|
||||
{pp.map((x) => (
|
||||
<circle key={`p-${x.i}`} cx={cx(x.i)} cy={revY(x.v)} r={2.5} fill={CHART_LINE2}>
|
||||
<title>{x.tip}</title>
|
||||
</circle>
|
||||
))}
|
||||
</g>
|
||||
);
|
||||
})()}
|
||||
{points.map((p, i) =>
|
||||
i % labelEvery === 0 || i === n - 1 ? (
|
||||
<text key={i} x={cx(i)} y={H - 14} textAnchor="middle" fontSize={11} fill="#999">
|
||||
@@ -500,6 +530,11 @@ export default function AdRevenueReportPage() {
|
||||
「预估收益」为客户端在广告展示(onAdShow)时上报 eCPM 折算的预估值(每千次展示 ÷1000
|
||||
累加),<b>只要广告展示就计入、不论是否看完发奖</b>;穿山甲会过滤无效/过短曝光,故预估值可能偏高,
|
||||
<b>实际收益一律以穿山甲后台结算为准</b>。测试应用多为 0。「广告位ID / 来源应用」为本期新增,历史记录留空。
|
||||
<br />
|
||||
<br />
|
||||
核心指标里的<b>「穿山甲后台收益(T+1)」</b>来自穿山甲 GroMore 数据 API(后台结算口径,次日出数):
|
||||
<b>穿山甲预估收益</b>=接口 revenue、<b>收益API</b>=各 ADN 回传更接近结算。穿山甲不提供分用户/类型/场景维度,
|
||||
故仅在<b>全量视图</b>(未按用户/类型/场景筛选)展示;逐条事件行仍是客户端预估,不受其影响。
|
||||
</div>
|
||||
}
|
||||
>
|
||||
@@ -666,6 +701,69 @@ export default function AdRevenueReportPage() {
|
||||
</Typography.Text>
|
||||
</Col>
|
||||
</Row>
|
||||
<Divider orientation="left" plain style={{ marginTop: 20, marginBottom: 16 }}>
|
||||
<Tooltip title="来自穿山甲 GroMore 数据 API(后台结算口径,T+1 次日出数)。穿山甲不提供分用户/类型/场景维度,故仅在「全量视图」(未按用户/类型/场景筛选)展示;按代码位×应用×日期汇总。revenue=预估收益、收益API=各 ADN 回传更接近结算。">
|
||||
<Typography.Text type="secondary" style={{ fontSize: 12 }}>
|
||||
穿山甲后台收益(T+1)
|
||||
<InfoCircleOutlined style={{ marginLeft: 4 }} />
|
||||
</Typography.Text>
|
||||
</Tooltip>
|
||||
</Divider>
|
||||
{data.pangle_revenue_available ? (
|
||||
<Row gutter={[16, 12]}>
|
||||
<Col flex="1 1 0">
|
||||
<Statistic
|
||||
title="穿山甲预估收益(元)"
|
||||
value={data.total_pangle_revenue_yuan ?? 0}
|
||||
precision={4}
|
||||
/>
|
||||
</Col>
|
||||
<Col flex="1 1 0">
|
||||
<Statistic
|
||||
title="穿山甲收益API(元)"
|
||||
value={data.total_pangle_api_revenue_yuan ?? '-'}
|
||||
precision={data.total_pangle_api_revenue_yuan == null ? undefined : 4}
|
||||
/>
|
||||
{data.total_pangle_api_revenue_yuan == null && (
|
||||
<Typography.Text type="secondary" style={{ fontSize: 12 }}>
|
||||
未配 Reporting / 当天无
|
||||
</Typography.Text>
|
||||
)}
|
||||
</Col>
|
||||
<Col flex="1 1 0">
|
||||
<Statistic
|
||||
title={
|
||||
<Tooltip title="客户端预估相对穿山甲预估的高估幅度 =(客户端预估 − 穿山甲预估)÷ 穿山甲预估;客户端按 onAdShow 计、不滤无效曝光,通常偏高">
|
||||
<span>
|
||||
客户端预估偏差
|
||||
<InfoCircleOutlined style={{ marginLeft: 4 }} />
|
||||
</span>
|
||||
</Tooltip>
|
||||
}
|
||||
value={
|
||||
data.total_pangle_revenue_yuan && data.total_pangle_revenue_yuan > 0
|
||||
? ((data.total_revenue_yuan - data.total_pangle_revenue_yuan) /
|
||||
data.total_pangle_revenue_yuan) *
|
||||
100
|
||||
: '-'
|
||||
}
|
||||
precision={
|
||||
data.total_pangle_revenue_yuan && data.total_pangle_revenue_yuan > 0
|
||||
? 1
|
||||
: undefined
|
||||
}
|
||||
suffix={
|
||||
data.total_pangle_revenue_yuan && data.total_pangle_revenue_yuan > 0 ? '%' : ''
|
||||
}
|
||||
/>
|
||||
</Col>
|
||||
</Row>
|
||||
) : (
|
||||
<Typography.Text type="secondary" style={{ fontSize: 13 }}>
|
||||
本视图无穿山甲后台收益:仅「全量视图」(未按用户/类型/场景筛选)且对应日期已同步到数据时展示。
|
||||
穿山甲 T+1 出数,可由 <Typography.Text code>scripts/sync_pangle_revenue</Typography.Text> 每日拉取入库。
|
||||
</Typography.Text>
|
||||
)}
|
||||
<Divider orientation="left" plain style={{ marginTop: 20, marginBottom: 16 }}>
|
||||
<Typography.Text type="secondary" style={{ fontSize: 12 }}>
|
||||
分广告类型
|
||||
@@ -743,8 +841,22 @@ export default function AdRevenueReportPage() {
|
||||
verticalAlign: 'middle',
|
||||
}}
|
||||
/>
|
||||
预估收益(元)
|
||||
客户端预估收益(元)
|
||||
</span>
|
||||
{queriedMultiDay && (
|
||||
<span style={{ fontSize: 12, color: '#666' }}>
|
||||
<span
|
||||
style={{
|
||||
display: 'inline-block',
|
||||
width: 14,
|
||||
borderTop: `2px solid ${CHART_LINE2}`,
|
||||
marginRight: 4,
|
||||
verticalAlign: 'middle',
|
||||
}}
|
||||
/>
|
||||
穿山甲后台收益(元)
|
||||
</span>
|
||||
)}
|
||||
</Space>
|
||||
}
|
||||
>
|
||||
|
||||
+1
-1
@@ -49,7 +49,7 @@ interface PreviewItem {
|
||||
|
||||
const yuan = (cents: number) => (cents / 100).toFixed(2);
|
||||
|
||||
/** 首页轮播「种子」管理(真实记录不足时的兜底假数据,现为「生成规则」)。「数据大盘」页的一个区块。 */
|
||||
/** 首页轮播「种子」管理(真实记录不足时的兜底假数据,现为「生成规则」)。「系统配置 / 首页」里的一个区块。 */
|
||||
export default function HomeMarqueeSeeds() {
|
||||
const { message } = App.useApp();
|
||||
const [seeds, setSeeds] = useState<Seed[]>([]);
|
||||
+1
-1
@@ -246,7 +246,7 @@ function buildBody(metric: string, e: Edit, immediate: boolean): Record<string,
|
||||
return body;
|
||||
}
|
||||
|
||||
/** 首页三门面数字(帮助用户/完成比价/累计节省)的展示模式配置。作为「数据大盘」页的一个区块。 */
|
||||
/** 首页三门面数字(帮助用户/完成比价/累计节省)的展示模式配置。「系统配置 / 首页」里的一个区块。 */
|
||||
export default function HomeStatsConfig() {
|
||||
const { message, modal } = App.useApp();
|
||||
const [items, setItems] = useState<StatItem[]>([]);
|
||||
@@ -1,8 +1,10 @@
|
||||
'use client';
|
||||
|
||||
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 HomeMarqueeSeeds from './HomeMarqueeSeeds';
|
||||
import HomeStatsConfig from './HomeStatsConfig';
|
||||
|
||||
interface ConfigItem {
|
||||
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 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 (
|
||||
<div>
|
||||
@@ -90,64 +149,21 @@ export default function ConfigPage() {
|
||||
<p style={{ color: '#999' }}>
|
||||
改完即生效(业务下次读取用新值)。涉及金额 / 上限,改前请确认。每次改动都进审计日志。
|
||||
</p>
|
||||
{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>
|
||||
))}
|
||||
<Tabs
|
||||
items={[
|
||||
{
|
||||
key: 'home',
|
||||
label: '首页',
|
||||
children: (
|
||||
<>
|
||||
<HomeStatsConfig />
|
||||
<HomeMarqueeSeeds />
|
||||
</>
|
||||
),
|
||||
},
|
||||
{ key: 'welfare', label: '福利页', children: welfareConfig },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
+1265
-49
File diff suppressed because it is too large
Load Diff
+7
-2
@@ -369,7 +369,9 @@ export interface AdRevenueRecord {
|
||||
export interface AdRevenueDaily {
|
||||
date: string; // 北京时间 YYYY-MM-DD
|
||||
impressions: number;
|
||||
revenue_yuan: number;
|
||||
revenue_yuan: number; // 客户端预估收益(eCPM 折算)
|
||||
pangle_revenue_yuan: number | null; // 穿山甲后台预估收益(GroMore revenue);非全量视图/无数据为 null
|
||||
pangle_api_revenue_yuan: number | null; // 穿山甲收益API(更接近结算);未配/当天/无数据为 null
|
||||
expected_coin: number;
|
||||
actual_coin: number;
|
||||
}
|
||||
@@ -427,7 +429,10 @@ export interface AdRevenueReport {
|
||||
total: number; // 当前筛选下的分页总条数(全量,不受分页影响)
|
||||
truncated: boolean; // 当前页之后是否还有更多事件(分页后前端不再据此报警)
|
||||
total_impressions: number;
|
||||
total_revenue_yuan: number;
|
||||
total_revenue_yuan: number; // 客户端预估收益合计(eCPM 折算)
|
||||
total_pangle_revenue_yuan: number | null; // 穿山甲后台预估收益合计(GroMore revenue);非全量视图/无数据为 null
|
||||
total_pangle_api_revenue_yuan: number | null; // 穿山甲收益API合计(更接近结算);未配/当天/非全量视图为 null
|
||||
pangle_revenue_available: boolean; // 本次结果是否带穿山甲后台收益(全量视图且已同步到数据)
|
||||
total_expected_coin: number;
|
||||
total_actual_coin: number;
|
||||
mismatch_count: number; // 应发≠实发的发奖条数
|
||||
|
||||
Reference in New Issue
Block a user