Compare commits
4 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| a7a793bbe7 | |||
| a1d9923f33 | |||
| 510ce349f7 | |||
| 03ef222b71 |
@@ -9,6 +9,7 @@ import {
|
|||||||
Card,
|
Card,
|
||||||
Col,
|
Col,
|
||||||
DatePicker,
|
DatePicker,
|
||||||
|
Descriptions,
|
||||||
Divider,
|
Divider,
|
||||||
InputNumber,
|
InputNumber,
|
||||||
Modal,
|
Modal,
|
||||||
@@ -19,6 +20,7 @@ import {
|
|||||||
Statistic,
|
Statistic,
|
||||||
Table,
|
Table,
|
||||||
Tag,
|
Tag,
|
||||||
|
Tooltip,
|
||||||
Typography,
|
Typography,
|
||||||
} from 'antd';
|
} from 'antd';
|
||||||
import {
|
import {
|
||||||
@@ -32,9 +34,11 @@ import { api, errMsg } from '@/lib/api';
|
|||||||
import { formatUtcTime } from '@/lib/format';
|
import { formatUtcTime } from '@/lib/format';
|
||||||
import type {
|
import type {
|
||||||
AdRevenueDaily,
|
AdRevenueDaily,
|
||||||
|
AdRevenueHourly,
|
||||||
AdRevenueRecord,
|
AdRevenueRecord,
|
||||||
AdRevenueReport,
|
AdRevenueReport,
|
||||||
AdRevenueRow,
|
AdRevenueRow,
|
||||||
|
AdRevenueTypeStat,
|
||||||
} from '@/lib/types';
|
} from '@/lib/types';
|
||||||
|
|
||||||
const { RangePicker } = DatePicker;
|
const { RangePicker } = DatePicker;
|
||||||
@@ -135,19 +139,22 @@ const DETAIL_COLUMNS: ColumnsType<AdRevenueRecord> = [
|
|||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
// 趋势图(纯 SVG,零依赖):柱=展示条数(左轴),线=预估收益元(右轴)。x 轴按传入点序。
|
// 趋势图(纯 SVG,零依赖):柱=展示条数(左轴),橙线=客户端预估收益元(右轴),
|
||||||
|
// 绿线=穿山甲后台预估收益元(右轴,仅按天且有数据时出现)。x 轴按传入点序。
|
||||||
const CHART_BAR = '#69b1ff';
|
const CHART_BAR = '#69b1ff';
|
||||||
const CHART_LINE = '#fa8c16';
|
const CHART_LINE = '#fa8c16';
|
||||||
|
const CHART_LINE2 = '#52c41a'; // 穿山甲后台收益线
|
||||||
|
|
||||||
interface TrendPoint {
|
interface TrendPoint {
|
||||||
label: string; // x 轴刻度文案(小时数 / MM-DD)
|
label: string; // x 轴刻度文案(小时数 / MM-DD)
|
||||||
tip: string; // hover 原生 tooltip 全文
|
tip: string; // hover 原生 tooltip 全文
|
||||||
impressions: number;
|
impressions: number;
|
||||||
revenue: number;
|
revenue: number;
|
||||||
|
pangleRevenue: number | null; // 穿山甲后台预估收益(元);无则 null(不画绿线点)
|
||||||
}
|
}
|
||||||
|
|
||||||
// 按小时聚合(0–23),数据源是 items(被 limit 截断时会偏少,调用处给警告)
|
// 按小时聚合(0–23),数据源是 hourly(后端全量聚合,不受分页影响)。穿山甲为天级,小时视图无该线。
|
||||||
function aggregateHourly(rows: AdRevenueRow[]): TrendPoint[] {
|
function aggregateHourly(rows: AdRevenueHourly[]): TrendPoint[] {
|
||||||
const byHour = Array.from({ length: 24 }, (_, h) => ({ hour: h, impressions: 0, revenue: 0 }));
|
const byHour = Array.from({ length: 24 }, (_, h) => ({ hour: h, impressions: 0, revenue: 0 }));
|
||||||
for (const r of rows) {
|
for (const r of rows) {
|
||||||
if (r.hour == null || r.hour < 0 || r.hour > 23) continue;
|
if (r.hour == null || r.hour < 0 || r.hour > 23) continue;
|
||||||
@@ -159,10 +166,12 @@ function aggregateHourly(rows: AdRevenueRow[]): TrendPoint[] {
|
|||||||
tip: `${String(b.hour).padStart(2, '0')}:00 展示 ${b.impressions} 条 · 预估收益 ${b.revenue.toFixed(4)} 元`,
|
tip: `${String(b.hour).padStart(2, '0')}:00 展示 ${b.impressions} 条 · 预估收益 ${b.revenue.toFixed(4)} 元`,
|
||||||
impressions: b.impressions,
|
impressions: b.impressions,
|
||||||
revenue: b.revenue,
|
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[] {
|
function aggregateDaily(dateFrom: string, dateTo: string, daily: AdRevenueDaily[]): TrendPoint[] {
|
||||||
const map = new Map(daily.map((d) => [d.date, d]));
|
const map = new Map(daily.map((d) => [d.date, d]));
|
||||||
const out: TrendPoint[] = [];
|
const out: TrendPoint[] = [];
|
||||||
@@ -173,11 +182,14 @@ function aggregateDaily(dateFrom: string, dateTo: string, daily: AdRevenueDaily[
|
|||||||
const d = map.get(ds);
|
const d = map.get(ds);
|
||||||
const impressions = d?.impressions ?? 0;
|
const impressions = d?.impressions ?? 0;
|
||||||
const revenue = d?.revenue_yuan ?? 0;
|
const revenue = d?.revenue_yuan ?? 0;
|
||||||
|
const pangleRevenue = d?.pangle_revenue_yuan ?? null;
|
||||||
|
const pangleTip = pangleRevenue != null ? ` · 穿山甲收益 ${pangleRevenue.toFixed(4)} 元` : '';
|
||||||
out.push({
|
out.push({
|
||||||
label: ds.slice(5),
|
label: ds.slice(5),
|
||||||
tip: `${ds} 展示 ${impressions} 条 · 预估收益 ${revenue.toFixed(4)} 元`,
|
tip: `${ds} 展示 ${impressions} 条 · 预估收益 ${revenue.toFixed(4)} 元${pangleTip}`,
|
||||||
impressions,
|
impressions,
|
||||||
revenue,
|
revenue,
|
||||||
|
pangleRevenue,
|
||||||
});
|
});
|
||||||
cur = cur.add(1, 'day');
|
cur = cur.add(1, 'day');
|
||||||
guard += 1;
|
guard += 1;
|
||||||
@@ -188,7 +200,11 @@ function aggregateDaily(dateFrom: string, dateTo: string, daily: AdRevenueDaily[
|
|||||||
function TrendChart({ points }: { points: TrendPoint[] }) {
|
function TrendChart({ points }: { points: TrendPoint[] }) {
|
||||||
const n = points.length;
|
const n = points.length;
|
||||||
const maxImp = Math.max(1, ...points.map((p) => p.impressions));
|
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 W = 960;
|
||||||
const H = 280;
|
const H = 280;
|
||||||
@@ -244,6 +260,24 @@ function TrendChart({ points }: { points: TrendPoint[] }) {
|
|||||||
<title>{p.tip}</title>
|
<title>{p.tip}</title>
|
||||||
</circle>
|
</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) =>
|
{points.map((p, i) =>
|
||||||
i % labelEvery === 0 || i === n - 1 ? (
|
i % labelEvery === 0 || i === n - 1 ? (
|
||||||
<text key={i} x={cx(i)} y={H - 14} textAnchor="middle" fontSize={11} fill="#999">
|
<text key={i} x={cx(i)} y={H - 14} textAnchor="middle" fontSize={11} fill="#999">
|
||||||
@@ -263,10 +297,12 @@ export default function AdRevenueReportPage() {
|
|||||||
const [range, setRange] = useState<[Dayjs, Dayjs]>([dayjs(), dayjs()]);
|
const [range, setRange] = useState<[Dayjs, Dayjs]>([dayjs(), dayjs()]);
|
||||||
const [userId, setUserId] = useState<number | null>(null);
|
const [userId, setUserId] = useState<number | null>(null);
|
||||||
const [adType, setAdType] = useState<string | undefined>();
|
const [adType, setAdType] = useState<string | undefined>();
|
||||||
// 「场景」为纯前端过滤(后端 query 暂不支持 feed_scene),只作用于下方明细表,不重新请求、不影响趋势/日汇总。
|
// 「场景」作为后端全局筛选(feed_scene):同时影响明细 / 合计 / 趋势,与「用户 / 类型」一致,点「查询」生效。
|
||||||
const [scene, setScene] = useState<string | undefined>();
|
const [scene, setScene] = useState<string | undefined>();
|
||||||
const [granularity, setGranularity] = useState<'day' | 'hour'>('day');
|
const [granularity, setGranularity] = useState<'day' | 'hour'>('day');
|
||||||
const [limit, setLimit] = useState<number>(500);
|
const [sortBy, setSortBy] = useState<'time' | 'ecpm'>('time'); // 明细排序:time=时间倒序 / ecpm=eCPM 倒序
|
||||||
|
const [limit, setLimit] = useState<number>(500); // 每页条数(分页大小)
|
||||||
|
const [page, setPage] = useState<number>(1); // 当前页码(后端分页;1 起)
|
||||||
const [queriedGranularity, setQueriedGranularity] = useState<'day' | 'hour'>('day'); // 本次结果对应的粒度,决定是否显示「小时」列
|
const [queriedGranularity, setQueriedGranularity] = useState<'day' | 'hour'>('day'); // 本次结果对应的粒度,决定是否显示「小时」列
|
||||||
const [queriedMultiDay, setQueriedMultiDay] = useState(false); // 本次结果是否跨多天,决定显示「日期」列 + 按天/按小时图
|
const [queriedMultiDay, setQueriedMultiDay] = useState(false); // 本次结果是否跨多天,决定显示「日期」列 + 按天/按小时图
|
||||||
const [data, setData] = useState<AdRevenueReport | null>(null);
|
const [data, setData] = useState<AdRevenueReport | null>(null);
|
||||||
@@ -277,33 +313,41 @@ export default function AdRevenueReportPage() {
|
|||||||
// 当前选择是否跨多天:跨多天时「按小时」无意义,粒度强制按天
|
// 当前选择是否跨多天:跨多天时「按小时」无意义,粒度强制按天
|
||||||
const rangeMultiDay = range[0].format('YYYY-MM-DD') !== range[1].format('YYYY-MM-DD');
|
const rangeMultiDay = range[0].format('YYYY-MM-DD') !== range[1].format('YYYY-MM-DD');
|
||||||
|
|
||||||
const load = useCallback(async () => {
|
// load(目标页, 每页条数):分页与筛选都经它。offset 由 页码×每页 算;场景(feed_scene)随筛选下推后端。
|
||||||
const from = range[0].format('YYYY-MM-DD');
|
const load = useCallback(
|
||||||
const to = range[1].format('YYYY-MM-DD');
|
async (targetPage = 1, targetLimit = limit, targetSort = sortBy) => {
|
||||||
const multiDay = from !== to;
|
const from = range[0].format('YYYY-MM-DD');
|
||||||
const gran = multiDay ? 'day' : granularity; // 跨多天强制按天
|
const to = range[1].format('YYYY-MM-DD');
|
||||||
setLoading(true);
|
const multiDay = from !== to;
|
||||||
try {
|
const gran = multiDay ? 'day' : granularity; // 跨多天强制按天
|
||||||
const res = await api.get<AdRevenueReport>('/admin/api/ad-revenue-report', {
|
setLoading(true);
|
||||||
params: {
|
try {
|
||||||
date_from: from,
|
const res = await api.get<AdRevenueReport>('/admin/api/ad-revenue-report', {
|
||||||
date_to: to,
|
params: {
|
||||||
user_id: userId ?? undefined,
|
date_from: from,
|
||||||
ad_type: adType ?? undefined,
|
date_to: to,
|
||||||
granularity: gran,
|
user_id: userId ?? undefined,
|
||||||
limit,
|
ad_type: adType ?? undefined,
|
||||||
},
|
feed_scene: scene ?? undefined,
|
||||||
});
|
granularity: gran,
|
||||||
setData(res.data);
|
limit: targetLimit,
|
||||||
setQueriedLimit(limit);
|
offset: (targetPage - 1) * targetLimit,
|
||||||
setQueriedGranularity(gran);
|
sort: targetSort,
|
||||||
setQueriedMultiDay(multiDay);
|
},
|
||||||
} catch (e) {
|
});
|
||||||
message.error(errMsg(e));
|
setData(res.data);
|
||||||
} finally {
|
setPage(targetPage);
|
||||||
setLoading(false);
|
setQueriedLimit(targetLimit);
|
||||||
}
|
setQueriedGranularity(gran);
|
||||||
}, [range, userId, adType, granularity, limit]);
|
setQueriedMultiDay(multiDay);
|
||||||
|
} catch (e) {
|
||||||
|
message.error(errMsg(e));
|
||||||
|
} finally {
|
||||||
|
setLoading(false);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
[range, userId, adType, scene, granularity, limit, sortBy],
|
||||||
|
);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
load();
|
load();
|
||||||
@@ -361,13 +405,6 @@ export default function AdRevenueReportPage() {
|
|||||||
return <Tag color={t.color}>{t.label}</Tag>;
|
return <Tag color={t.color}>{t.label}</Tag>;
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
|
||||||
title: '广告位ID',
|
|
||||||
dataIndex: 'our_code_id',
|
|
||||||
width: 110,
|
|
||||||
render: (v: string | null) =>
|
|
||||||
v ? <Typography.Text code>{v}</Typography.Text> : <Typography.Text type="secondary">-</Typography.Text>,
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
title: 'eCPM(分)',
|
title: 'eCPM(分)',
|
||||||
dataIndex: 'ecpm',
|
dataIndex: 'ecpm',
|
||||||
@@ -375,6 +412,17 @@ export default function AdRevenueReportPage() {
|
|||||||
align: 'right',
|
align: 'right',
|
||||||
render: (v: string | null) => v ?? '-',
|
render: (v: string | null) => v ?? '-',
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
title: 'eCPM(元)',
|
||||||
|
key: 'ecpm_yuan',
|
||||||
|
width: 100,
|
||||||
|
align: 'right',
|
||||||
|
render: (_: unknown, r: AdRevenueRow) => {
|
||||||
|
// eCPM 原始值单位「分/千次」,÷100 转「元/千次」(块);非数字 / 空显示 -。
|
||||||
|
const cents = r.ecpm == null ? null : Number(r.ecpm);
|
||||||
|
return cents == null || Number.isNaN(cents) ? '-' : (cents / 100).toFixed(2);
|
||||||
|
},
|
||||||
|
},
|
||||||
{
|
{
|
||||||
title: '预估收益(元)',
|
title: '预估收益(元)',
|
||||||
dataIndex: 'revenue_yuan',
|
dataIndex: 'revenue_yuan',
|
||||||
@@ -420,6 +468,13 @@ export default function AdRevenueReportPage() {
|
|||||||
<Typography.Text type="secondary">-</Typography.Text>
|
<Typography.Text type="secondary">-</Typography.Text>
|
||||||
),
|
),
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
title: '广告位ID',
|
||||||
|
dataIndex: 'our_code_id',
|
||||||
|
width: 110,
|
||||||
|
render: (v: string | null) =>
|
||||||
|
v ? <Typography.Text code>{v}</Typography.Text> : <Typography.Text type="secondary">-</Typography.Text>,
|
||||||
|
},
|
||||||
{
|
{
|
||||||
title: '底层 ADN',
|
title: '底层 ADN',
|
||||||
dataIndex: 'adn',
|
dataIndex: 'adn',
|
||||||
@@ -429,14 +484,11 @@ export default function AdRevenueReportPage() {
|
|||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
// 派生指标(全部基于全量 total_* 字段,不受 limit 截断影响,准):
|
// 派生指标(全部基于全量 total_* 字段,不受分页影响,准):
|
||||||
// 平均 eCPM = 收益÷展示×1000;发奖成本(元)= 实发金币÷汇率;预估毛利 = 收益−发奖成本;
|
// 发奖成本(元)= 实发金币÷汇率;预估毛利 = 收益−发奖成本;发奖占收益比 = 发奖成本÷收益;
|
||||||
// 发奖占收益比 = 发奖成本÷收益;应发实发差额(金币)= 应发−实发(正=少发/负=多发)。
|
// 应发实发差额(金币)= 应发−实发(正=少发/负=多发);ARPU = 预估收益÷今日DAU(仅今日)。
|
||||||
const derived = data
|
const derived = data
|
||||||
? {
|
? {
|
||||||
avgEcpm: data.total_impressions
|
|
||||||
? (data.total_revenue_yuan / data.total_impressions) * 1000
|
|
||||||
: 0,
|
|
||||||
payoutYuan: data.total_actual_coin / COIN_PER_YUAN,
|
payoutYuan: data.total_actual_coin / COIN_PER_YUAN,
|
||||||
grossProfit: data.total_revenue_yuan - data.total_actual_coin / COIN_PER_YUAN,
|
grossProfit: data.total_revenue_yuan - data.total_actual_coin / COIN_PER_YUAN,
|
||||||
payoutRatioPct:
|
payoutRatioPct:
|
||||||
@@ -444,18 +496,19 @@ export default function AdRevenueReportPage() {
|
|||||||
? (data.total_actual_coin / COIN_PER_YUAN / data.total_revenue_yuan) * 100
|
? (data.total_actual_coin / COIN_PER_YUAN / data.total_revenue_yuan) * 100
|
||||||
: null,
|
: null,
|
||||||
coinGap: data.total_expected_coin - data.total_actual_coin,
|
coinGap: data.total_expected_coin - data.total_actual_coin,
|
||||||
|
// ARPU(今日)= 预估广告收益 ÷ 今日 DAU;dau 为 null(历史/多天)或 0 时不可算 → null,前端显示「-」。
|
||||||
|
arpu: data.dau && data.dau > 0 ? data.total_revenue_yuan / data.dau : null,
|
||||||
}
|
}
|
||||||
: null;
|
: null;
|
||||||
|
|
||||||
// 「场景」纯前端过滤:只对已加载的明细 items 生效(后端 query 暂不支持 feed_scene);趋势图/日汇总仍用全量 daily/total_*。
|
// 第二行大盘「分广告类型」:draw / 激励视频 各自 收益 / eCPM / 展示条数;eCPM = 收益÷展示×1000。
|
||||||
const allItems = data?.items ?? [];
|
const drawStat = data?.type_stats?.draw;
|
||||||
const filteredItems = scene ? allItems.filter((r) => r.feed_scene === scene) : allItems;
|
const rvStat = data?.type_stats?.reward_video;
|
||||||
|
const ecpmOf = (s?: AdRevenueTypeStat) =>
|
||||||
|
s && s.impressions > 0 ? (s.revenue_yuan / s.impressions) * 1000 : 0;
|
||||||
|
|
||||||
// 选中比价/领券且类型=draw 时,给出该场景在已加载明细内的实发金币小计(仅明细口径,可能受 limit 截断)。
|
// 明细直接用后端返回的当前页 items(「场景」已由后端 feed_scene 全局过滤,前端不再二次筛)。
|
||||||
const sceneCoinSubtotal =
|
const items = data?.items ?? [];
|
||||||
adType === 'draw' && (scene === 'comparison' || scene === 'coupon')
|
|
||||||
? filteredItems.reduce((s, r) => s + (r.has_reward ? r.actual_coin : 0), 0)
|
|
||||||
: null;
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
@@ -477,6 +530,11 @@ export default function AdRevenueReportPage() {
|
|||||||
「预估收益」为客户端在广告展示(onAdShow)时上报 eCPM 折算的预估值(每千次展示 ÷1000
|
「预估收益」为客户端在广告展示(onAdShow)时上报 eCPM 折算的预估值(每千次展示 ÷1000
|
||||||
累加),<b>只要广告展示就计入、不论是否看完发奖</b>;穿山甲会过滤无效/过短曝光,故预估值可能偏高,
|
累加),<b>只要广告展示就计入、不论是否看完发奖</b>;穿山甲会过滤无效/过短曝光,故预估值可能偏高,
|
||||||
<b>实际收益一律以穿山甲后台结算为准</b>。测试应用多为 0。「广告位ID / 来源应用」为本期新增,历史记录留空。
|
<b>实际收益一律以穿山甲后台结算为准</b>。测试应用多为 0。「广告位ID / 来源应用」为本期新增,历史记录留空。
|
||||||
|
<br />
|
||||||
|
<br />
|
||||||
|
核心指标里的<b>「穿山甲后台收益(T+1)」</b>来自穿山甲 GroMore 数据 API(后台结算口径,次日出数):
|
||||||
|
<b>穿山甲预估收益</b>=接口 revenue、<b>收益API</b>=各 ADN 回传更接近结算。穿山甲不提供分用户/类型/场景维度,
|
||||||
|
故仅在<b>全量视图</b>(未按用户/类型/场景筛选)展示;逐条事件行仍是客户端预估,不受其影响。
|
||||||
</div>
|
</div>
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
@@ -534,7 +592,6 @@ export default function AdRevenueReportPage() {
|
|||||||
onChange={setScene}
|
onChange={setScene}
|
||||||
allowClear
|
allowClear
|
||||||
style={{ width: 130 }}
|
style={{ width: 130 }}
|
||||||
title="仅前端过滤下方明细,不影响趋势图/汇总"
|
|
||||||
options={[
|
options={[
|
||||||
{ value: 'comparison', label: '比价' },
|
{ value: 'comparison', label: '比价' },
|
||||||
{ value: 'coupon', label: '领券' },
|
{ value: 'coupon', label: '领券' },
|
||||||
@@ -557,15 +614,33 @@ export default function AdRevenueReportPage() {
|
|||||||
/>
|
/>
|
||||||
</Space>
|
</Space>
|
||||||
<Space size={6}>
|
<Space size={6}>
|
||||||
<Typography.Text type="secondary">条数</Typography.Text>
|
<Typography.Text type="secondary">排序</Typography.Text>
|
||||||
<Select
|
<Select
|
||||||
value={limit}
|
value={sortBy}
|
||||||
onChange={setLimit}
|
onChange={(v) => {
|
||||||
style={{ width: 110 }}
|
setSortBy(v);
|
||||||
options={[100, 200, 500, 1000].map((n) => ({ value: n, label: `${n} 条` }))}
|
load(1, limit, v); // 改排序:回第 1 页并重查
|
||||||
|
}}
|
||||||
|
style={{ width: 130 }}
|
||||||
|
options={[
|
||||||
|
{ value: 'time', label: '时间倒序' },
|
||||||
|
{ value: 'ecpm', label: 'eCPM 倒序' },
|
||||||
|
]}
|
||||||
/>
|
/>
|
||||||
</Space>
|
</Space>
|
||||||
<Button type="primary" onClick={load} loading={loading}>
|
<Space size={6}>
|
||||||
|
<Typography.Text type="secondary">每页</Typography.Text>
|
||||||
|
<Select
|
||||||
|
value={limit}
|
||||||
|
onChange={(v) => {
|
||||||
|
setLimit(v);
|
||||||
|
load(1, v); // 改每页大小:回到第 1 页并重查
|
||||||
|
}}
|
||||||
|
style={{ width: 120 }}
|
||||||
|
options={[20, 50, 100, 200, 500, 1000].map((n) => ({ value: n, label: `${n} 条/页` }))}
|
||||||
|
/>
|
||||||
|
</Space>
|
||||||
|
<Button type="primary" onClick={() => load(1)} loading={loading}>
|
||||||
查询
|
查询
|
||||||
</Button>
|
</Button>
|
||||||
</Space>
|
</Space>
|
||||||
@@ -575,41 +650,46 @@ export default function AdRevenueReportPage() {
|
|||||||
<Card size="small" style={{ marginBottom: 16 }}>
|
<Card size="small" style={{ marginBottom: 16 }}>
|
||||||
<Divider orientation="left" plain style={{ marginTop: 0, marginBottom: 16 }}>
|
<Divider orientation="left" plain style={{ marginTop: 0, marginBottom: 16 }}>
|
||||||
<Typography.Text type="secondary" style={{ fontSize: 12 }}>
|
<Typography.Text type="secondary" style={{ fontSize: 12 }}>
|
||||||
广告展示与收益
|
核心指标
|
||||||
</Typography.Text>
|
</Typography.Text>
|
||||||
</Divider>
|
</Divider>
|
||||||
<Row gutter={[16, 12]}>
|
<Row gutter={[16, 12]}>
|
||||||
<Col span={6}>
|
<Col flex="1 1 0">
|
||||||
<Statistic title="展示条数合计" value={data.total_impressions} />
|
|
||||||
</Col>
|
|
||||||
<Col span={6}>
|
|
||||||
<Statistic title="平均 eCPM(元/千次)" value={derived.avgEcpm} precision={2} />
|
|
||||||
</Col>
|
|
||||||
<Col span={6}>
|
|
||||||
<Statistic title="预估收益合计(元)" value={data.total_revenue_yuan} precision={4} />
|
<Statistic title="预估收益合计(元)" value={data.total_revenue_yuan} precision={4} />
|
||||||
</Col>
|
</Col>
|
||||||
<Col span={6}>
|
<Col flex="1 1 0">
|
||||||
<Statistic title="广告事件数" value={data.total} />
|
|
||||||
</Col>
|
|
||||||
</Row>
|
|
||||||
<Divider orientation="left" plain style={{ marginTop: 20, marginBottom: 16 }}>
|
|
||||||
<Typography.Text type="secondary" style={{ fontSize: 12 }}>
|
|
||||||
发奖与对账
|
|
||||||
</Typography.Text>
|
|
||||||
</Divider>
|
|
||||||
<Row gutter={[16, 12]}>
|
|
||||||
<Col span={6}>
|
|
||||||
<Statistic title="应发金币合计" value={data.total_expected_coin} />
|
|
||||||
</Col>
|
|
||||||
<Col span={6}>
|
|
||||||
<Statistic title="实发金币合计" value={data.total_actual_coin} />
|
|
||||||
</Col>
|
|
||||||
<Col span={6}>
|
|
||||||
<Statistic title="发奖成本(元)" value={derived.payoutYuan} precision={4} />
|
|
||||||
</Col>
|
|
||||||
<Col span={6}>
|
|
||||||
<Statistic
|
<Statistic
|
||||||
title="预估毛利(元)"
|
title={
|
||||||
|
<Tooltip title="每活跃用户广告预估收入 = 预估收益 ÷ 今日 DAU;DAU 仅今日口径,历史/多天显示 -">
|
||||||
|
<span>
|
||||||
|
ARPU(今日)
|
||||||
|
<InfoCircleOutlined style={{ marginLeft: 4 }} />
|
||||||
|
</span>
|
||||||
|
</Tooltip>
|
||||||
|
}
|
||||||
|
value={derived.arpu ?? '-'}
|
||||||
|
precision={4}
|
||||||
|
/>
|
||||||
|
</Col>
|
||||||
|
<Col flex="1 1 0">
|
||||||
|
<Statistic
|
||||||
|
title={
|
||||||
|
<Tooltip title="今日活跃用户(复用大盘口径 last_login_at = 今日登录过);仅查询=今日时有值,历史/多天显示 -">
|
||||||
|
<span>
|
||||||
|
今日活跃 DAU
|
||||||
|
<InfoCircleOutlined style={{ marginLeft: 4 }} />
|
||||||
|
</span>
|
||||||
|
</Tooltip>
|
||||||
|
}
|
||||||
|
value={data.dau ?? '-'}
|
||||||
|
/>
|
||||||
|
</Col>
|
||||||
|
<Col flex="1 1 0">
|
||||||
|
<Statistic title="发放金币合计(元)" value={derived.payoutYuan} precision={4} />
|
||||||
|
</Col>
|
||||||
|
<Col flex="1 1 0">
|
||||||
|
<Statistic
|
||||||
|
title="预估广告毛利(元)"
|
||||||
value={derived.grossProfit}
|
value={derived.grossProfit}
|
||||||
precision={4}
|
precision={4}
|
||||||
prefix={derived.grossProfit >= 0 ? <RiseOutlined /> : <FallOutlined />}
|
prefix={derived.grossProfit >= 0 ? <RiseOutlined /> : <FallOutlined />}
|
||||||
@@ -621,6 +701,94 @@ export default function AdRevenueReportPage() {
|
|||||||
</Typography.Text>
|
</Typography.Text>
|
||||||
</Col>
|
</Col>
|
||||||
</Row>
|
</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 }}>
|
||||||
|
分广告类型
|
||||||
|
</Typography.Text>
|
||||||
|
</Divider>
|
||||||
|
<Row gutter={[16, 12]}>
|
||||||
|
<Col span={4}>
|
||||||
|
<Statistic title="Draw 信息流收益(元)" value={drawStat?.revenue_yuan ?? 0} precision={4} />
|
||||||
|
</Col>
|
||||||
|
<Col span={4}>
|
||||||
|
<Statistic title="Draw 信息流 eCPM(元/千次)" value={ecpmOf(drawStat)} precision={2} />
|
||||||
|
</Col>
|
||||||
|
<Col span={4}>
|
||||||
|
<Statistic title="Draw 信息流条数" value={drawStat?.impressions ?? 0} />
|
||||||
|
</Col>
|
||||||
|
<Col span={4}>
|
||||||
|
<Statistic title="激励视频收益(元)" value={rvStat?.revenue_yuan ?? 0} precision={4} />
|
||||||
|
</Col>
|
||||||
|
<Col span={4}>
|
||||||
|
<Statistic title="激励视频 eCPM(元/千次)" value={ecpmOf(rvStat)} precision={2} />
|
||||||
|
</Col>
|
||||||
|
<Col span={4}>
|
||||||
|
<Statistic title="激励视频条数" value={rvStat?.impressions ?? 0} />
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
</Card>
|
</Card>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
@@ -637,36 +805,13 @@ export default function AdRevenueReportPage() {
|
|||||||
) : (
|
) : (
|
||||||
<Alert type="success" showIcon message={`共 ${data.total} 条广告事件,应发与实发全部一致。`} />
|
<Alert type="success" showIcon message={`共 ${data.total} 条广告事件,应发与实发全部一致。`} />
|
||||||
)}
|
)}
|
||||||
{data.truncated && (
|
|
||||||
<Alert
|
|
||||||
type="warning"
|
|
||||||
showIcon
|
|
||||||
message={`明细已截断到 ${queriedLimit} 条,还有更多未显示——请按用户/类型/日期缩小范围,或调大「条数」。合计数字不受影响。`}
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
{sceneCoinSubtotal != null && (
|
|
||||||
<Alert
|
|
||||||
type="info"
|
|
||||||
showIcon
|
|
||||||
message={
|
|
||||||
<span>
|
|
||||||
当前已加载明细中,
|
|
||||||
<Tag color={SCENE_TAG[scene!].color} style={{ marginInline: 4 }}>
|
|
||||||
{SCENE_TAG[scene!].text}
|
|
||||||
</Tag>
|
|
||||||
Draw 信息流 实发金币小计 <b>{sceneCoinSubtotal}</b>(共 {filteredItems.length} 条;
|
|
||||||
仅明细口径,若已截断可能偏少;上方汇总/趋势仍为全量)。
|
|
||||||
</span>
|
|
||||||
}
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
</Space>
|
</Space>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{data &&
|
{data &&
|
||||||
(queriedMultiDay
|
(queriedMultiDay
|
||||||
? (data.daily?.length ?? 0) > 0
|
? (data.daily?.length ?? 0) > 0
|
||||||
: queriedGranularity === 'hour' && (data.items?.length ?? 0) > 0) && (
|
: queriedGranularity === 'hour' && (data.hourly?.length ?? 0) > 0) && (
|
||||||
<Card
|
<Card
|
||||||
size="small"
|
size="small"
|
||||||
title={queriedMultiDay ? '按天趋势' : '按小时趋势'}
|
title={queriedMultiDay ? '按天趋势' : '按小时趋势'}
|
||||||
@@ -696,32 +841,30 @@ export default function AdRevenueReportPage() {
|
|||||||
verticalAlign: 'middle',
|
verticalAlign: 'middle',
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
预估收益(元)
|
客户端预估收益(元)
|
||||||
</span>
|
</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>
|
</Space>
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
{/* 趋势图与日汇总恒为全量:按天图用 daily(全量),按小时图用全量 items;「场景」前端过滤只作用于下方明细表,不影响此图。 */}
|
{/* 趋势图恒为全量(不受分页影响):按天图用 daily,按小时图用 hourly;「场景」已下推后端,趋势随场景筛选一并变化。 */}
|
||||||
{!queriedMultiDay && data.truncated && (
|
|
||||||
<Alert
|
|
||||||
type="warning"
|
|
||||||
showIcon
|
|
||||||
style={{ marginBottom: 12 }}
|
|
||||||
message={`图表按小时聚合的是已截断到 ${queriedLimit} 组的明细,可能少算——调大「条数」或缩小筛选可还原真实趋势。`}
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
{scene && (
|
|
||||||
<Alert
|
|
||||||
type="info"
|
|
||||||
showIcon
|
|
||||||
style={{ marginBottom: 12 }}
|
|
||||||
message="趋势图为全量数据,不随「场景」筛选变化;场景过滤仅作用于下方明细表与其金币小计。"
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
{queriedMultiDay ? (
|
{queriedMultiDay ? (
|
||||||
<TrendChart points={aggregateDaily(data.date_from, data.date_to, data.daily)} />
|
<TrendChart points={aggregateDaily(data.date_from, data.date_to, data.daily)} />
|
||||||
) : (
|
) : (
|
||||||
<TrendChart points={aggregateHourly(data.items)} />
|
<TrendChart points={aggregateHourly(data.hourly)} />
|
||||||
)}
|
)}
|
||||||
</Card>
|
</Card>
|
||||||
)}
|
)}
|
||||||
@@ -729,15 +872,22 @@ export default function AdRevenueReportPage() {
|
|||||||
<Table
|
<Table
|
||||||
rowKey="event_key"
|
rowKey="event_key"
|
||||||
columns={columns}
|
columns={columns}
|
||||||
dataSource={filteredItems}
|
dataSource={items}
|
||||||
loading={loading}
|
loading={loading}
|
||||||
pagination={false}
|
pagination={{
|
||||||
|
current: page,
|
||||||
|
pageSize: queriedLimit,
|
||||||
|
total: data?.total ?? 0,
|
||||||
|
showSizeChanger: false,
|
||||||
|
showTotal: (t) => `共 ${t} 条`,
|
||||||
|
onChange: (p) => load(p, queriedLimit),
|
||||||
|
}}
|
||||||
size="small"
|
size="small"
|
||||||
scroll={{ x: 1280 }}
|
scroll={{ x: 1380 }}
|
||||||
rowClassName={(r) => (r.has_reward && !r.matched ? 'row-mismatch' : '')}
|
rowClassName={(r) => (r.has_reward && !r.matched ? 'row-mismatch' : '')}
|
||||||
expandable={{
|
expandable={{
|
||||||
// 只有发了奖的事件可展开,看「这条广告金币怎么算的」;纯展示行无复算、不可展开。
|
// 每行都可展开(左侧恒有 + 号):有发奖看「金币复算因子」;纯展示看「展示明细」。
|
||||||
rowExpandable: (r) => r.reward_detail != null,
|
rowExpandable: () => true,
|
||||||
expandedRowRender: (r) =>
|
expandedRowRender: (r) =>
|
||||||
r.reward_detail ? (
|
r.reward_detail ? (
|
||||||
<div>
|
<div>
|
||||||
@@ -756,7 +906,28 @@ export default function AdRevenueReportPage() {
|
|||||||
rowClassName={(d) => (d.matched ? '' : 'row-mismatch')}
|
rowClassName={(d) => (d.matched ? '' : 'row-mismatch')}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
) : null,
|
) : (
|
||||||
|
<div>
|
||||||
|
<Typography.Text strong>展示明细</Typography.Text>{' '}
|
||||||
|
<Typography.Text type="secondary">(纯展示事件,未单独发奖,无金币复算)</Typography.Text>
|
||||||
|
<Descriptions size="small" column={3} bordered style={{ marginTop: 8 }}>
|
||||||
|
<Descriptions.Item label="时间">{formatUtcTime(r.created_at)}</Descriptions.Item>
|
||||||
|
<Descriptions.Item label="eCPM(分)">{r.ecpm ?? '-'}</Descriptions.Item>
|
||||||
|
<Descriptions.Item label="eCPM(元)">
|
||||||
|
{r.ecpm != null && !Number.isNaN(Number(r.ecpm))
|
||||||
|
? (Number(r.ecpm) / 100).toFixed(2)
|
||||||
|
: '-'}
|
||||||
|
</Descriptions.Item>
|
||||||
|
<Descriptions.Item label="预估收益(元)">
|
||||||
|
{r.has_impression ? r.revenue_yuan.toFixed(4) : '-'}
|
||||||
|
</Descriptions.Item>
|
||||||
|
<Descriptions.Item label="底层 ADN">{r.adn ?? '-'}</Descriptions.Item>
|
||||||
|
<Descriptions.Item label="底层代码位(rit)">{r.slot_id ?? '-'}</Descriptions.Item>
|
||||||
|
<Descriptions.Item label="我方代码位">{r.our_code_id ?? '-'}</Descriptions.Item>
|
||||||
|
<Descriptions.Item label="来源应用">{r.app_env ?? '-'}</Descriptions.Item>
|
||||||
|
</Descriptions>
|
||||||
|
</div>
|
||||||
|
),
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
<Modal
|
<Modal
|
||||||
@@ -772,7 +943,7 @@ export default function AdRevenueReportPage() {
|
|||||||
<Typography.Paragraph type="secondary" style={{ fontSize: 13 }}>
|
<Typography.Paragraph type="secondary" style={{ fontSize: 13 }}>
|
||||||
· eCPM 取自穿山甲 SDK <Typography.Text code>getEcpm()</Typography.Text> 原值,单位「分/千次展示」,计算时 ÷100 转元;单次收益按「每千次 ÷1000」折到每次。
|
· eCPM 取自穿山甲 SDK <Typography.Text code>getEcpm()</Typography.Text> 原值,单位「分/千次展示」,计算时 ÷100 转元;单次收益按「每千次 ÷1000」折到每次。
|
||||||
<br />· 金币汇率:<b>1 元 = {COIN_PER_YUAN.toLocaleString()} 金币</b>,最终四舍五入取整。
|
<br />· 金币汇率:<b>1 元 = {COIN_PER_YUAN.toLocaleString()} 金币</b>,最终四舍五入取整。
|
||||||
<br />· 因子2「LT 累计条数」按该账号累计第几条计(不按天重置);激励视频每次 1 条,信息流每满 10 秒折 1 条。
|
<br />· 因子2「LT 累计条数」按该账号累计第几条计(不按天重置);<b>一条广告 = 1 条</b>(激励视频每次 1 条;信息流看满 10 秒即发该条满额,不按时长折多份)。
|
||||||
<br />· 本表与发奖后端同源,本页「应发金币」即按此复算并与「实发金币」对账。
|
<br />· 本表与发奖后端同源,本页「应发金币」即按此复算并与「实发金币」对账。
|
||||||
</Typography.Paragraph>
|
</Typography.Paragraph>
|
||||||
<Row gutter={16}>
|
<Row gutter={16}>
|
||||||
|
|||||||
+1
-1
@@ -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[]>([]);
|
||||||
+1
-1
@@ -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[]>([]);
|
||||||
@@ -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>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
+1265
-49
File diff suppressed because it is too large
Load Diff
+243
-29
@@ -11,7 +11,6 @@ import {
|
|||||||
HeartOutlined,
|
HeartOutlined,
|
||||||
LogoutOutlined,
|
LogoutOutlined,
|
||||||
MessageOutlined,
|
MessageOutlined,
|
||||||
MobileOutlined,
|
|
||||||
MoneyCollectOutlined,
|
MoneyCollectOutlined,
|
||||||
NotificationOutlined,
|
NotificationOutlined,
|
||||||
ProfileOutlined,
|
ProfileOutlined,
|
||||||
@@ -20,25 +19,65 @@ import {
|
|||||||
TeamOutlined,
|
TeamOutlined,
|
||||||
UserOutlined,
|
UserOutlined,
|
||||||
} from '@ant-design/icons';
|
} from '@ant-design/icons';
|
||||||
import { Avatar, Dropdown, Layout, Menu } from 'antd';
|
import { Avatar, Dropdown, Layout, Tooltip } from 'antd';
|
||||||
import { clearAuth, getAdmin, getToken } from '@/lib/auth';
|
import { clearAuth, getAdmin, getToken } from '@/lib/auth';
|
||||||
import type { AdminInfo } from '@/lib/types';
|
import type { AdminInfo } from '@/lib/types';
|
||||||
|
|
||||||
const { Sider, Header, Content } = Layout;
|
const { Sider, Header, Content } = Layout;
|
||||||
|
|
||||||
const MENU = [
|
type NavItem = {
|
||||||
{ key: '/dashboard', icon: <DashboardOutlined />, label: '数据大盘' },
|
key: string;
|
||||||
{ key: '/users', icon: <UserOutlined />, label: '用户管理' },
|
icon: React.ReactNode;
|
||||||
{ key: '/devices', icon: <MobileOutlined />, label: '设备管理' },
|
label: string;
|
||||||
{ key: '/device-liveness', icon: <HeartOutlined />, label: '设备存活' },
|
superOnly?: boolean;
|
||||||
{ key: '/withdraws', icon: <MoneyCollectOutlined />, label: '提现管理' },
|
};
|
||||||
{ key: '/price-reports', icon: <FlagOutlined />, label: '上报审核' },
|
|
||||||
{ key: '/comparison-records', icon: <ProfileOutlined />, label: '比价记录' },
|
type NavGroup =
|
||||||
{ key: '/feedbacks', icon: <MessageOutlined />, label: '反馈工单' },
|
| (NavItem & { children?: never })
|
||||||
{ key: '/ad-revenue', icon: <NotificationOutlined />, label: '广告配置' },
|
| {
|
||||||
{ key: '/ad-revenue-report', icon: <BarChartOutlined />, label: '广告收益' },
|
key: string;
|
||||||
{ key: '/cps', icon: <ShareAltOutlined />, label: 'CPS 分发' },
|
icon: React.ReactNode;
|
||||||
{ key: '/config', icon: <SettingOutlined />, label: '系统配置' },
|
label: string;
|
||||||
|
children: NavItem[];
|
||||||
|
superOnly?: boolean;
|
||||||
|
};
|
||||||
|
|
||||||
|
const hasChildren = (group: NavGroup): group is NavGroup & { children: NavItem[] } =>
|
||||||
|
Array.isArray(group.children);
|
||||||
|
|
||||||
|
const NAV_GROUPS: NavGroup[] = [
|
||||||
|
{
|
||||||
|
key: 'dashboard',
|
||||||
|
icon: <DashboardOutlined />,
|
||||||
|
label: '看板',
|
||||||
|
children: [
|
||||||
|
{ key: '/dashboard', icon: <DashboardOutlined />, label: '数据大盘' },
|
||||||
|
{ key: '/ad-revenue-report', icon: <BarChartOutlined />, label: '广告收益' },
|
||||||
|
{ key: '/comparison-records', icon: <ProfileOutlined />, label: '比价记录' },
|
||||||
|
{ key: '/cps', icon: <ShareAltOutlined />, label: 'CPS收益' },
|
||||||
|
{ key: '/device-liveness', icon: <HeartOutlined />, label: '设备存活' },
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'reward-review',
|
||||||
|
icon: <MoneyCollectOutlined />,
|
||||||
|
label: '奖励审核',
|
||||||
|
children: [
|
||||||
|
{ key: '/withdraws', icon: <MoneyCollectOutlined />, label: '提现审核' },
|
||||||
|
{ key: '/price-reports', icon: <FlagOutlined />, label: '低价审核' },
|
||||||
|
{ key: '/feedbacks', icon: <MessageOutlined />, label: '用户反馈' },
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'data-config',
|
||||||
|
icon: <SettingOutlined />,
|
||||||
|
label: '数据配置',
|
||||||
|
children: [
|
||||||
|
{ key: '/config', icon: <SettingOutlined />, label: '系统配置' },
|
||||||
|
{ key: '/ad-revenue', icon: <NotificationOutlined />, label: '广告配置' },
|
||||||
|
{ key: '/users', icon: <UserOutlined />, label: '用户管理' },
|
||||||
|
],
|
||||||
|
},
|
||||||
{ key: '/admins', icon: <TeamOutlined />, label: '管理员', superOnly: true },
|
{ key: '/admins', icon: <TeamOutlined />, label: '管理员', superOnly: true },
|
||||||
{ key: '/event-logs', icon: <DatabaseOutlined />, label: '埋点日志' },
|
{ key: '/event-logs', icon: <DatabaseOutlined />, label: '埋点日志' },
|
||||||
{ key: '/audit-logs', icon: <FileSearchOutlined />, label: '审计日志' },
|
{ key: '/audit-logs', icon: <FileSearchOutlined />, label: '审计日志' },
|
||||||
@@ -48,6 +87,7 @@ export default function MainLayout({ children }: { children: React.ReactNode })
|
|||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const pathname = usePathname();
|
const pathname = usePathname();
|
||||||
const [admin, setAdmin] = useState<AdminInfo | null>(null);
|
const [admin, setAdmin] = useState<AdminInfo | null>(null);
|
||||||
|
const [collapsed, setCollapsed] = useState(false);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (!getToken()) {
|
if (!getToken()) {
|
||||||
@@ -59,14 +99,19 @@ export default function MainLayout({ children }: { children: React.ReactNode })
|
|||||||
|
|
||||||
if (!admin) return null; // 守卫期间不闪烁内容
|
if (!admin) return null; // 守卫期间不闪烁内容
|
||||||
|
|
||||||
const items = MENU.filter((m) => !m.superOnly || admin.role === 'super_admin').map((m) => ({
|
|
||||||
key: m.key,
|
|
||||||
icon: m.icon,
|
|
||||||
label: m.label,
|
|
||||||
}));
|
|
||||||
|
|
||||||
// 选中态:取路径一级(/users/123 → /users)
|
// 选中态:取路径一级(/users/123 → /users)
|
||||||
const selectedKey = '/' + (pathname.split('/')[1] || 'dashboard');
|
const selectedKey = '/' + (pathname.split('/')[1] || 'dashboard');
|
||||||
|
const canShow = (item: { superOnly?: boolean }) => !item.superOnly || admin.role === 'super_admin';
|
||||||
|
const visibleGroups = NAV_GROUPS
|
||||||
|
.filter(canShow)
|
||||||
|
.map((group) => {
|
||||||
|
if (!hasChildren(group)) return group;
|
||||||
|
return { ...group, children: group.children.filter(canShow) };
|
||||||
|
})
|
||||||
|
.filter((group) => !hasChildren(group) || group.children.length > 0);
|
||||||
|
const flatNavItems = visibleGroups.flatMap((group) =>
|
||||||
|
hasChildren(group) ? group.children : [group],
|
||||||
|
);
|
||||||
|
|
||||||
const logout = () => {
|
const logout = () => {
|
||||||
clearAuth();
|
clearAuth();
|
||||||
@@ -75,7 +120,15 @@ export default function MainLayout({ children }: { children: React.ReactNode })
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<Layout style={{ minHeight: '100vh' }}>
|
<Layout style={{ minHeight: '100vh' }}>
|
||||||
<Sider theme="dark" breakpoint="lg" collapsible>
|
<Sider
|
||||||
|
theme="dark"
|
||||||
|
breakpoint="lg"
|
||||||
|
collapsible
|
||||||
|
collapsed={collapsed}
|
||||||
|
collapsedWidth={72}
|
||||||
|
width={220}
|
||||||
|
onCollapse={setCollapsed}
|
||||||
|
>
|
||||||
<div
|
<div
|
||||||
style={{
|
style={{
|
||||||
height: 48,
|
height: 48,
|
||||||
@@ -88,13 +141,61 @@ export default function MainLayout({ children }: { children: React.ReactNode })
|
|||||||
>
|
>
|
||||||
运营后台
|
运营后台
|
||||||
</div>
|
</div>
|
||||||
<Menu
|
<nav className={`side-nav${collapsed ? ' side-nav-collapsed' : ''}`} aria-label="后台导航">
|
||||||
theme="dark"
|
{collapsed
|
||||||
mode="inline"
|
? flatNavItems.map((item) => (
|
||||||
selectedKeys={[selectedKey]}
|
<Tooltip key={item.key} title={item.label} placement="right">
|
||||||
items={items}
|
<button
|
||||||
onClick={({ key }) => router.push(key)}
|
type="button"
|
||||||
/>
|
className={`nav-icon-button${selectedKey === item.key ? ' is-selected' : ''}`}
|
||||||
|
onClick={() => router.push(item.key)}
|
||||||
|
aria-label={item.label}
|
||||||
|
>
|
||||||
|
{item.icon}
|
||||||
|
</button>
|
||||||
|
</Tooltip>
|
||||||
|
))
|
||||||
|
: visibleGroups.map((group) => {
|
||||||
|
const isGroup = hasChildren(group);
|
||||||
|
const groupSelected = isGroup
|
||||||
|
? group.children.some((child) => child.key === selectedKey)
|
||||||
|
: selectedKey === group.key;
|
||||||
|
if (!isGroup) {
|
||||||
|
return (
|
||||||
|
<button
|
||||||
|
key={group.key}
|
||||||
|
type="button"
|
||||||
|
className={`nav-primary nav-direct${groupSelected ? ' is-selected' : ''}`}
|
||||||
|
onClick={() => router.push(group.key)}
|
||||||
|
>
|
||||||
|
<span className="nav-primary-icon">{group.icon}</span>
|
||||||
|
<span>{group.label}</span>
|
||||||
|
</button>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
return (
|
||||||
|
<section key={group.key} className={`nav-group${groupSelected ? ' is-active' : ''}`}>
|
||||||
|
<div className="nav-primary">
|
||||||
|
<span className="nav-primary-icon">{group.icon}</span>
|
||||||
|
<span>{group.label}</span>
|
||||||
|
</div>
|
||||||
|
<div className="nav-children">
|
||||||
|
{group.children.map((child) => (
|
||||||
|
<button
|
||||||
|
key={child.key}
|
||||||
|
type="button"
|
||||||
|
className={`nav-child${selectedKey === child.key ? ' is-selected' : ''}`}
|
||||||
|
onClick={() => router.push(child.key)}
|
||||||
|
>
|
||||||
|
<span className="nav-child-icon">{child.icon}</span>
|
||||||
|
<span>{child.label}</span>
|
||||||
|
</button>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
</nav>
|
||||||
</Sider>
|
</Sider>
|
||||||
<Layout>
|
<Layout>
|
||||||
<Header
|
<Header
|
||||||
@@ -120,6 +221,119 @@ export default function MainLayout({ children }: { children: React.ReactNode })
|
|||||||
</Header>
|
</Header>
|
||||||
<Content style={{ margin: 24 }}>{children}</Content>
|
<Content style={{ margin: 24 }}>{children}</Content>
|
||||||
</Layout>
|
</Layout>
|
||||||
|
<style jsx global>{`
|
||||||
|
.side-nav {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 4px;
|
||||||
|
padding: 0 10px 14px;
|
||||||
|
}
|
||||||
|
.nav-group {
|
||||||
|
padding: 6px 0 8px;
|
||||||
|
}
|
||||||
|
.nav-group + .nav-group,
|
||||||
|
.nav-group + .nav-direct,
|
||||||
|
.nav-direct + .nav-direct {
|
||||||
|
margin-top: 4px;
|
||||||
|
}
|
||||||
|
.nav-primary {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 10px;
|
||||||
|
min-height: 36px;
|
||||||
|
padding: 0 12px;
|
||||||
|
color: rgba(255, 255, 255, 0.88);
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 600;
|
||||||
|
letter-spacing: 0;
|
||||||
|
}
|
||||||
|
.nav-primary-icon,
|
||||||
|
.nav-child-icon {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
color: rgba(255, 255, 255, 0.72);
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
.nav-direct,
|
||||||
|
.nav-child,
|
||||||
|
.nav-icon-button {
|
||||||
|
border: 0;
|
||||||
|
cursor: pointer;
|
||||||
|
font: inherit;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
.nav-direct {
|
||||||
|
width: 100%;
|
||||||
|
border-radius: 8px;
|
||||||
|
background: transparent;
|
||||||
|
}
|
||||||
|
.nav-direct:hover,
|
||||||
|
.nav-direct.is-selected {
|
||||||
|
background: #1677ff;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.nav-direct:hover .nav-primary-icon,
|
||||||
|
.nav-direct.is-selected .nav-primary-icon {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.nav-children {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 2px;
|
||||||
|
margin-left: 34px;
|
||||||
|
margin-top: -2px;
|
||||||
|
padding-right: 2px;
|
||||||
|
}
|
||||||
|
.nav-child {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 8px;
|
||||||
|
width: 100%;
|
||||||
|
min-height: 34px;
|
||||||
|
border-radius: 8px;
|
||||||
|
background: transparent;
|
||||||
|
color: rgba(255, 255, 255, 0.72);
|
||||||
|
font-size: 13px;
|
||||||
|
padding: 0 10px;
|
||||||
|
}
|
||||||
|
.nav-child:hover {
|
||||||
|
background: rgba(255, 255, 255, 0.08);
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.nav-child.is-selected {
|
||||||
|
background: #1677ff;
|
||||||
|
color: #fff;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
.nav-child.is-selected .nav-child-icon {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.nav-group.is-active .nav-primary {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.side-nav-collapsed {
|
||||||
|
align-items: center;
|
||||||
|
gap: 6px;
|
||||||
|
padding: 0 8px 14px;
|
||||||
|
}
|
||||||
|
.nav-icon-button {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
border-radius: 8px;
|
||||||
|
background: transparent;
|
||||||
|
color: rgba(255, 255, 255, 0.72);
|
||||||
|
font-size: 17px;
|
||||||
|
}
|
||||||
|
.nav-icon-button:hover,
|
||||||
|
.nav-icon-button.is-selected {
|
||||||
|
background: #1677ff;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
`}</style>
|
||||||
</Layout>
|
</Layout>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
+103
-6
@@ -365,15 +365,38 @@ export interface AdRevenueRecord {
|
|||||||
matched: boolean;
|
matched: boolean;
|
||||||
}
|
}
|
||||||
|
|
||||||
// 广告收益报表:按日期汇总的一天(按天趋势图用;全量,不受 limit 影响)
|
// 广告收益报表:按日期汇总的一天(按天趋势图用;全量,不受分页影响)
|
||||||
export interface AdRevenueDaily {
|
export interface AdRevenueDaily {
|
||||||
date: string; // 北京时间 YYYY-MM-DD
|
date: string; // 北京时间 YYYY-MM-DD
|
||||||
impressions: number;
|
impressions: 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;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 广告收益报表:按北京小时(0–23)汇总的一小时(按小时趋势图用;全量,不受分页影响;按天查询时为空)
|
||||||
|
export interface AdRevenueHourly {
|
||||||
|
hour: number; // 北京时间小时 0–23
|
||||||
|
impressions: number;
|
||||||
revenue_yuan: number;
|
revenue_yuan: number;
|
||||||
expected_coin: number;
|
expected_coin: number;
|
||||||
actual_coin: number;
|
actual_coin: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 广告收益报表:按广告类型(ad_type)的小计(展示条数 + 预估收益;eCPM 前端用 收益÷展示×1000 算)
|
||||||
|
export interface AdRevenueTypeStat {
|
||||||
|
impressions: number; // 该类型展示条数合计
|
||||||
|
revenue_yuan: number; // 该类型预估收益合计(元)
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface AdRevenueTypeBreakdown extends AdRevenueTypeStat {
|
||||||
|
ad_type: string;
|
||||||
|
expected_coin: number;
|
||||||
|
actual_coin: number;
|
||||||
|
}
|
||||||
|
|
||||||
// 广告收益报表:一次广告事件(逐条一行)。激励视频展示+发奖按 ad_session_id 合并;信息流展示/发奖各自成行。
|
// 广告收益报表:一次广告事件(逐条一行)。激励视频展示+发奖按 ad_session_id 合并;信息流展示/发奖各自成行。
|
||||||
export interface AdRevenueRow {
|
export interface AdRevenueRow {
|
||||||
event_key: string; // 事件稳定唯一键(前端 rowKey)
|
event_key: string; // 事件稳定唯一键(前端 rowKey)
|
||||||
@@ -406,16 +429,65 @@ export interface AdRevenueReport {
|
|||||||
date_from: string; // 起始日 北京时间 YYYY-MM-DD
|
date_from: string; // 起始日 北京时间 YYYY-MM-DD
|
||||||
date_to: string; // 结束日 北京时间 YYYY-MM-DD(闭区间;单日时与 date_from 相同)
|
date_to: string; // 结束日 北京时间 YYYY-MM-DD(闭区间;单日时与 date_from 相同)
|
||||||
daily: AdRevenueDaily[]; // 按日期汇总序列(全量,供按天趋势图)
|
daily: AdRevenueDaily[]; // 按日期汇总序列(全量,供按天趋势图)
|
||||||
total: number; // 广告事件总数(全量,不受 limit 影响)
|
hourly: AdRevenueHourly[]; // 按小时汇总序列(全量,供按小时趋势图;按天查询时为空)
|
||||||
truncated: boolean;
|
type_stats: Record<string, AdRevenueTypeStat>; // 按广告类型小计;前端取 draw / reward_video
|
||||||
|
dau: number | null; // 今日活跃(复用大盘 last_login_at);仅查询=今日时有值,否则 null
|
||||||
|
total: number; // 当前筛选下的分页总条数(全量,不受分页影响)
|
||||||
|
truncated: boolean; // 当前页之后是否还有更多事件(分页后前端不再据此报警)
|
||||||
total_impressions: number;
|
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_expected_coin: number;
|
||||||
total_actual_coin: number;
|
total_actual_coin: number;
|
||||||
mismatch_count: number; // 应发≠实发的发奖条数
|
mismatch_count: number; // 应发≠实发的发奖条数
|
||||||
|
by_ad_type?: Record<string, AdRevenueTypeBreakdown>;
|
||||||
items: AdRevenueRow[];
|
items: AdRevenueRow[];
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export interface DashboardPeriodTrendPoint {
|
||||||
|
date: string;
|
||||||
|
active_users: number;
|
||||||
|
new_users: number;
|
||||||
|
comparisons: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface DashboardPeriodStats {
|
||||||
|
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: DashboardPeriodTrendPoint[];
|
||||||
|
}
|
||||||
|
|
||||||
export interface DashboardOverview {
|
export interface DashboardOverview {
|
||||||
users: {
|
users: {
|
||||||
total: number;
|
total: number;
|
||||||
@@ -425,7 +497,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;
|
||||||
@@ -433,8 +515,23 @@ 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: DashboardPeriodStats;
|
||||||
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;
|
||||||
|
jd_order_count?: number;
|
||||||
|
jd_commission_cents?: number;
|
||||||
|
jd_actual_commission_cents?: number;
|
||||||
|
jd_estimated_commission_cents?: number;
|
||||||
|
jd_invalid_count?: number;
|
||||||
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface PriceReport {
|
export interface PriceReport {
|
||||||
|
|||||||
Reference in New Issue
Block a user