Merge branch 'main' into codex/coupon-point-score

## 变更内容
- 列表从最多串行拉取 200 页改为仅请求当前页
- 概览改用后端聚合接口，与列表并行加载
- 主耗时五项只展示成功比价数据
- 中途退出五项在桌面端同一行展示，小屏自动换行
- 翻页不再重复请求概览

## 依赖
- 配套 Server MR #152

## 验证
- npx tsc --noEmit
- npm run build

---------

Co-authored-by: linkeyu <798648091@qq.com>
Reviewed-on: #55
Co-authored-by: linkeyu <linkeyu@wonderable.ai>
Co-committed-by: linkeyu <linkeyu@wonderable.ai>

src/app/(main)/ad-revenue-report/page.tsx

@@ -300,6 +300,8 @@ export default function AdRevenueReportPage() {
   const { message } = App.useApp();
   const [range, setRange] = useState<[Dayjs, Dayjs]>([dayjs().subtract(1, 'day'), dayjs().subtract(1, 'day')]);
   const [userId, setUserId] = useState<number | null>(null);
+  const [appEnv, setAppEnv] = useState<'prod' | 'test' | 'all'>('prod');
+  const [revenueScope, setRevenueScope] = useState<'business' | 'all'>('business');
   const [adType, setAdType] = useState<string | undefined>();
   // 「场景」作为后端全局筛选(feed_scene):同时影响明细 / 合计 / 趋势,与「用户 / 类型」一致,点「查询」生效。
   const [scene, setScene] = useState<string | undefined>();
@@ -333,6 +335,8 @@ export default function AdRevenueReportPage() {
           date_from: from,
           date_to: to,
           user_id: userId ?? undefined,
+          app_env: appEnv === 'all' ? undefined : appEnv,
+          revenue_scope: revenueScope,
           ad_type: adType ?? undefined,
           feed_scene: scene ?? undefined,
           granularity: gran,
@@ -374,7 +378,7 @@ export default function AdRevenueReportPage() {
         setLoading(false);
       }
     },
-    [range, userId, adType, scene, granularity, limit, sortBy],
+    [range, userId, appEnv, revenueScope, adType, scene, granularity, limit, sortBy],
   );
 
   useEffect(() => {
@@ -620,7 +624,8 @@ export default function AdRevenueReportPage() {
               <br />
               核心指标里的<b>「穿山甲后台收益(T+1)」</b>来自穿山甲 GroMore 数据 API(后台结算口径,次日出数):
               <b>穿山甲预估收益</b>=接口 revenue、<b>收益API</b>=各 ADN 回传更接近结算。穿山甲不提供分用户/类型/场景维度,
-              故仅在<b>全量视图</b>(未按用户/类型/场景筛选)展示;逐条事件行仍是客户端预估,不受其影响。
+              故仅在<b>可对账视图</b>(未按用户/类型/场景筛选)展示;环境和数据范围会同时作用于客户端与穿山甲汇总。
+              默认“正式 + 业务代码位”用于同口径对账;切到“全部代码位”会包含广告测试等非业务曝光。
             </div>
           }
         >
@@ -655,6 +660,31 @@ export default function AdRevenueReportPage() {
               style={{ width: 130 }}
             />
           </Space>
+          <Space size={6}>
+            <Typography.Text type="secondary">环境</Typography.Text>
+            <Select
+              value={appEnv}
+              onChange={setAppEnv}
+              style={{ width: 130 }}
+              options={[
+                { value: 'prod', label: '正式(prod)' },
+                { value: 'test', label: '测试(dev)' },
+                { value: 'all', label: '全部' },
+              ]}
+            />
+          </Space>
+          <Space size={6}>
+            <Typography.Text type="secondary">数据范围</Typography.Text>
+            <Select
+              value={revenueScope}
+              onChange={setRevenueScope}
+              style={{ width: 150 }}
+              options={[
+                { value: 'business', label: '业务代码位' },
+                { value: 'all', label: '全部代码位' },
+              ]}
+            />
+          </Space>
           <Space size={6}>
             <Typography.Text type="secondary">类型</Typography.Text>
             <Select

src/app/(main)/comparison-records/page.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import { useEffect, useMemo, useState } from 'react';
+import { useEffect, useState } from 'react';
 import type { CSSProperties, ReactNode } from 'react';
 import {
   App, Button, Card, Col, Collapse, DatePicker, Descriptions, Divider, Drawer, Input, InputNumber,
@@ -9,8 +9,13 @@ import {
 import type { ColumnsType } from 'antd/es/table';
 import dayjs, { type Dayjs } from 'dayjs';
 import { api, errMsg } from '@/lib/api';
-import { formatWallTime, percentile, yuan } from '@/lib/format';
+import { formatWallTime, yuan } from '@/lib/format';
-import type { ComparisonRecordDetail, ComparisonRecordListItem, CursorPage } from '@/lib/types';
+import type {
+  ComparisonRecordDetail,
+  ComparisonRecordListItem,
+  ComparisonRecordsSummary,
+  CursorPage,
+} from '@/lib/types';
 
 const { RangePicker } = DatePicker;
 
@@ -105,8 +110,11 @@ export default function ComparisonRecordsPage() {
     date_from: dayjs().subtract(1, 'day').format('YYYY-MM-DD'),
     date_to: dayjs().subtract(1, 'day').format('YYYY-MM-DD'),
   });
-  const [allItems, setAllItems] = useState<ComparisonRecordListItem[]>([]);
+  const [items, setItems] = useState<ComparisonRecordListItem[]>([]);
-  const [loading, setLoading] = useState(false);
+  const [total, setTotal] = useState(0);
+  const [overview, setOverview] = useState<ComparisonRecordsSummary | null>(null);
+  const [listLoading, setListLoading] = useState(false);
+  const [summaryLoading, setSummaryLoading] = useState(false);
   const [page, setPage] = useState(1);
   const [pageSize, setPageSize] = useState(20);
   // LLM 单价(元/百万 token),本地持久化;仅用于前端估算成本,不入库、不影响其它页面
@@ -125,7 +133,8 @@ export default function ComparisonRecordsPage() {
   const [detail, setDetail] = useState<ComparisonRecordDetail | null>(null);
   const [detailLoading, setDetailLoading] = useState(false);
 
-  const search = () =>
+  const search = () => {
+    setPage(1);
     setApplied({
       date_from: range[0].format('YYYY-MM-DD'),
       date_to: range[1].format('YYYY-MM-DD'),
@@ -135,6 +144,7 @@ export default function ComparisonRecordsPage() {
       store: store.trim() || undefined,
       product: product.trim() || undefined,
     });
+  };
 
   const reset = () => {
     setUserId(null);
@@ -143,6 +153,7 @@ export default function ComparisonRecordsPage() {
     setStore('');
     setProduct('');
     const yesterday = dayjs().subtract(1, 'day');
+    setPage(1);
     setRange([yesterday, yesterday]);
     setApplied({
       date_from: yesterday.format('YYYY-MM-DD'),
@@ -152,49 +163,50 @@ export default function ComparisonRecordsPage() {
 
   useEffect(() => {
     let alive = true;
-    const loadAll = async () => {
+    const loadPage = async () => {
-      setLoading(true);
+      setListLoading(true);
       try {
-        const serverFilters = { ...applied };
-        delete serverFilters.date_from;
-        delete serverFilters.date_to;
-        const rows: ComparisonRecordListItem[] = [];
-        let cursor = 0;
-        for (let pageIndex = 0; pageIndex < 200; pageIndex += 1) {
         const { data } = await api.get<CursorPage<ComparisonRecordListItem>>(
           '/admin/api/comparison-records',
-            { params: { ...serverFilters, limit: 100, cursor } },
+          { params: { ...applied, limit: pageSize, cursor: (page - 1) * pageSize } },
         );
-          rows.push(...data.items);
-          if (data.next_cursor == null || data.items.length === 0) break;
-          cursor = data.next_cursor;
-        }
         if (alive) {
-          setAllItems(rows);
+          setItems(data.items);
-          setPage(1);
+          setTotal(data.total ?? 0);
         }
       } catch (e) {
         if (alive) message.error(errMsg(e));
       } finally {
-        if (alive) setLoading(false);
+        if (alive) setListLoading(false);
       }
     };
-    loadAll();
+    loadPage();
+    return () => {
+      alive = false;
+    };
+  }, [applied, message, page, pageSize]);
+
+  useEffect(() => {
+    let alive = true;
+    const loadSummary = async () => {
+      setSummaryLoading(true);
+      try {
+        const { data } = await api.get<ComparisonRecordsSummary>(
+          '/admin/api/comparison-records/summary',
+          { params: applied },
+        );
+        if (alive) setOverview(data);
+      } catch (e) {
+        if (alive) message.error(errMsg(e));
+      } finally {
+        if (alive) setSummaryLoading(false);
+      }
+    };
+    loadSummary();
     return () => {
       alive = false;
     };
   }, [applied, message]);
-
-  const filteredItems = useMemo(() => {
-    const from = String(applied.date_from ?? '');
-    const to = String(applied.date_to ?? '');
-    return allItems.filter((item) => {
-      const date = dayjs(item.created_at).format('YYYY-MM-DD');
-      return (!from || date >= from) && (!to || date <= to);
-    });
-  }, [allItems, applied]);
-  const total = filteredItems.length;
-  const items = filteredItems.slice((page - 1) * pageSize, page * pageSize);
   const onChange = (nextPage: number, nextPageSize: number) => {
     setPageSize(nextPageSize);
     setPage(nextPageSize === pageSize ? nextPage : 1);
@@ -218,46 +230,6 @@ export default function ComparisonRecordsPage() {
     setDetailLoading(false);
   };
 
-  const overview = useMemo(() => {
-    const completed = filteredItems.filter(
-      (item) => item.status === 'success' || item.status === 'failed',
-    );
-    const cancelled = filteredItems.filter((item) => item.status === 'cancelled');
-    const success = filteredItems.filter((item) => item.status === 'success');
-    const successRateDenominator = filteredItems.length - cancelled.length;
-    const completedDurations = completed
-      .map((item) => item.total_ms)
-      .filter((value): value is number => value != null);
-    const cancelledDurations = cancelled
-      .map((item) => item.total_ms)
-      .filter((value): value is number => value != null);
-    const costs = filteredItems
-      .map((item) => item.llm_cost_yuan)
-      .filter((value): value is number => value != null);
-    const avg = (values: number[]) =>
-      values.length ? values.reduce((sum, value) => sum + value, 0) / values.length : null;
-    return {
-      started: filteredItems.length,
-      completed: completed.length,
-      success: success.length,
-      successRate: successRateDenominator ? success.length / successRateDenominator : null,
-      avgTokenCost: avg(costs),
-      lowerPriceRate: success.length
-        ? success.filter((item) => (item.saved_amount_cents ?? 0) > 0).length / success.length
-        : null,
-      avgMs: avg(completedDurations),
-      p5Ms: percentile(completedDurations, 0.05),
-      p50Ms: percentile(completedDurations, 0.5),
-      p95Ms: percentile(completedDurations, 0.95),
-      p99Ms: percentile(completedDurations, 0.99),
-      cancelled: cancelled.length,
-      cancelledRate: filteredItems.length ? cancelled.length / filteredItems.length : null,
-      cancelledP5Ms: percentile(cancelledDurations, 0.05),
-      cancelledP50Ms: percentile(cancelledDurations, 0.5),
-      cancelledP95Ms: percentile(cancelledDurations, 0.95),
-    };
-  }, [filteredItems]);
-
   const columns: ColumnsType<ComparisonRecordListItem> = [
     { title: '时间', dataIndex: 'created_at', width: 150, render: (v: string) => formatWallTime(v) },
     {
@@ -424,28 +396,28 @@ export default function ComparisonRecordsPage() {
         </Space>
       </Card>
 
-      <Card size="small" style={{ marginBottom: 16 }} loading={loading}>
+      <Card size="small" style={{ marginBottom: 16 }} loading={summaryLoading}>
         <Divider orientation="left" plain style={{ marginTop: 0 }}>数据概览</Divider>
         <Row gutter={[16, 16]}>
-          <Col xs={12} md={6}><Statistic title="比价发起数" value={overview.started} /></Col>
+          <Col xs={12} md={6}><Statistic title="比价发起数" value={overview?.started ?? 0} /></Col>
-          <Col xs={12} md={6}><Statistic title="比价完成数" value={overview.completed} /></Col>
+          <Col xs={12} md={6}><Statistic title="比价完成数" value={overview?.completed ?? 0} /></Col>
-          <Col xs={12} md={6}><Statistic title="比价成功次数" value={overview.success} /></Col>
+          <Col xs={12} md={6}><Statistic title="比价成功次数" value={overview?.success ?? 0} /></Col>
-          <Col xs={12} md={6}><Statistic title="比价成功率" value={fmtRate(overview.successRate)} /></Col>
+          <Col xs={12} md={6}><Statistic title="比价成功率" value={fmtRate(overview?.success_rate ?? null)} /></Col>
-          <Col xs={12} md={6}><Statistic title="平均 TOKEN 成本" value={overview.avgTokenCost ?? '-'} precision={4} prefix="¥" /></Col>
+          <Col xs={12} md={6}><Statistic title="平均 TOKEN 成本" value={overview?.avg_token_cost ?? '-'} precision={4} prefix="¥" /></Col>
-          <Col xs={12} md={6}><Statistic title="比出更低价率" value={fmtRate(overview.lowerPriceRate)} /></Col>
+          <Col xs={12} md={6}><Statistic title="比出更低价率" value={fmtRate(overview?.lower_price_rate ?? null)} /></Col>
-          <Col xs={12} md={6}><Statistic title="耗时平均数" value={fmtMs(overview.avgMs)} /></Col>
+          <Col xs={12} md={6}><Statistic title="耗时平均数" value={fmtMs(overview?.avg_duration_ms ?? null)} /></Col>
-          <Col xs={12} md={6}><Statistic title="耗时 5 分位" value={fmtMs(overview.p5Ms)} /></Col>
+          <Col xs={12} md={6}><Statistic title="耗时 5 分位" value={fmtMs(overview?.p5_duration_ms ?? null)} /></Col>
-          <Col xs={12} md={6}><Statistic title="耗时 50 分位" value={fmtMs(overview.p50Ms)} /></Col>
+          <Col xs={12} md={6}><Statistic title="耗时 50 分位" value={fmtMs(overview?.p50_duration_ms ?? null)} /></Col>
-          <Col xs={12} md={6}><Statistic title="耗时 95 分位" value={fmtMs(overview.p95Ms)} /></Col>
+          <Col xs={12} md={6}><Statistic title="耗时 95 分位" value={fmtMs(overview?.p95_duration_ms ?? null)} /></Col>
-          <Col xs={12} md={6}><Statistic title="耗时 99 分位" value={fmtMs(overview.p99Ms)} /></Col>
+          <Col xs={12} md={6}><Statistic title="耗时 99 分位" value={fmtMs(overview?.p99_duration_ms ?? null)} /></Col>
         </Row>
         <Divider orientation="left" plain>中途退出</Divider>
         <Row gutter={[16, 16]}>
-          <Col xs={12} md={6}><Statistic title="中途退出次数" value={overview.cancelled} /></Col>
+          <Col flex="1 1 180px"><Statistic title="中途退出次数" value={overview?.cancelled ?? 0} /></Col>
-          <Col xs={12} md={6}><Statistic title="中途退出率" value={fmtRate(overview.cancelledRate)} /></Col>
+          <Col flex="1 1 180px"><Statistic title="中途退出率" value={fmtRate(overview?.cancelled_rate ?? null)} /></Col>
-          <Col xs={12} md={6}><Statistic title="退出耗时 5 分位" value={fmtMs(overview.cancelledP5Ms)} /></Col>
+          <Col flex="1 1 180px"><Statistic title="退出耗时 5 分位" value={fmtMs(overview?.cancelled_p5_ms ?? null)} /></Col>
-          <Col xs={12} md={6}><Statistic title="退出耗时 50 分位" value={fmtMs(overview.cancelledP50Ms)} /></Col>
+          <Col flex="1 1 180px"><Statistic title="退出耗时 50 分位" value={fmtMs(overview?.cancelled_p50_ms ?? null)} /></Col>
-          <Col xs={12} md={6}><Statistic title="退出耗时 95 分位" value={fmtMs(overview.cancelledP95Ms)} /></Col>
+          <Col flex="1 1 180px"><Statistic title="退出耗时 95 分位" value={fmtMs(overview?.cancelled_p95_ms ?? null)} /></Col>
         </Row>
       </Card>
 
@@ -453,7 +425,7 @@ export default function ComparisonRecordsPage() {
         rowKey="id"
         columns={columns}
         dataSource={items}
-        loading={loading}
+        loading={listLoading}
         pagination={{
           current: page,
           pageSize,

src/app/(main)/coupon-data/page.tsx

@@ -10,9 +10,11 @@ import {
   DatePicker,
   Divider,
   Input,
+  Popover,
   Row,
   Select,
   Space,
+  Spin,
   Statistic,
   Table,
   Tag,
@@ -72,9 +74,23 @@ interface CouponDataRow {
   app_env: string | null;
   started_at: string;
   claimed_count: number | null;
+  point_success_count: number | null;
+  point_total_count: number | null;
+  // 兼容旧后端的内嵌明细；新后端不再返回，改为点击后按 trace 加载。
+  point_details?: CouponPointDetail[];
   trace_url: string | null;
   ad_revenue_yuan: number | null; // 本次领券看的信息流广告预估收益(元);未填充为 null
 }
+interface CouponPointDetail {
+  coupon_id: string;
+  coupon_name: string | null;
+  status: string;
+  reason: string | null;
+}
+interface CouponPointDetailsOut {
+  trace_id: string;
+  items: CouponPointDetail[];
+}
 interface CouponDataReport {
   date_from: string;
   date_to: string;
@@ -116,6 +132,94 @@ const STATUS_TAG: Record<string, { color: string; label: string }> = {
   abandoned: { color: 'orange', label: '中途退出' },
 };
 
+const POINT_STATUS_TAG: Record<string, { color: string; label: string }> = {
+  success: { color: 'success', label: '成功' },
+  already_claimed: { color: 'processing', label: '已领' },
+  failed: { color: 'error', label: '失败' },
+  skipped: { color: 'default', label: '跳过' },
+};
+
+function PointScorePopover({ row }: { row: CouponDataRow }) {
+  const { message } = App.useApp();
+  const [details, setDetails] = useState<CouponPointDetail[] | null>(row.point_details ?? null);
+  const [loading, setLoading] = useState(false);
+  const [loadError, setLoadError] = useState<string | null>(null);
+
+  if (row.point_success_count == null || row.point_total_count == null || row.point_total_count <= 0) {
+    return <Typography.Text type="secondary">-</Typography.Text>;
+  }
+  const score = `${row.point_success_count}/${row.point_total_count}`;
+  const loadDetails = async () => {
+    if (details !== null || loading) return;
+    setLoading(true);
+    setLoadError(null);
+    try {
+      const response = await api.get<CouponPointDetailsOut>('/admin/api/coupon-data/point-details', {
+        params: { trace_id: row.trace_id },
+      });
+      setDetails(response.data.items);
+    } catch (error) {
+      const errorMessage = errMsg(error);
+      setLoadError(errorMessage);
+      message.error(errorMessage);
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  return (
+    <Popover
+      trigger="click"
+      placement="bottomLeft"
+      title={`点位明细（${score}）`}
+      onOpenChange={(open) => {
+        if (open) void loadDetails();
+      }}
+      content={(
+        <div style={{ width: 380, maxHeight: 360, overflowY: 'auto' }}>
+          {loading || (details === null && loadError === null) ? (
+            <Spin size="small" style={{ display: 'block', margin: '24px auto' }} />
+          ) : loadError ? (
+            <Typography.Text type="danger">明细加载失败，请关闭后重试</Typography.Text>
+          ) : details && details.length > 0 ? details.map((point, index) => {
+            const status = POINT_STATUS_TAG[point.status] ?? {
+              color: 'default', label: point.status,
+            };
+            return (
+              <div
+                key={`${point.coupon_id}-${index}`}
+                style={{
+                  padding: '8px 0',
+                  borderBottom: index < details.length - 1 ? '1px solid #f0f0f0' : undefined,
+                }}
+              >
+                <div style={{ display: 'flex', alignItems: 'flex-start', gap: 12 }}>
+                  <div style={{ flex: 1, minWidth: 0 }}>
+                    <Typography.Text>{point.coupon_name || point.coupon_id}</Typography.Text>
+                    {point.coupon_name ? (
+                      <div><Typography.Text type="secondary">{point.coupon_id}</Typography.Text></div>
+                    ) : null}
+                  </div>
+                  <Tag color={status.color} style={{ marginInlineEnd: 0 }}>{status.label}</Tag>
+                </div>
+                {point.reason ? (
+                  <div style={{ marginTop: 4 }}>
+                    <Typography.Text type="danger">原因：{point.reason}</Typography.Text>
+                  </div>
+                ) : null}
+              </div>
+            );
+          }) : (
+            <Typography.Text type="secondary">暂无点位明细</Typography.Text>
+          )}
+        </div>
+      )}
+    >
+      <Button type="link" size="small" style={{ height: 'auto', padding: 0 }}>{score}</Button>
+    </Popover>
+  );
+}
+
 // ms → "1.5s"(空值显示 -)
 const fmtSec = (ms: number | null | undefined): string =>
   ms == null ? '-' : `${(ms / 1000).toFixed(1)}s`;
@@ -495,17 +599,7 @@ export default function CouponDataPage() {
       title: '点位成功率',
       key: 'point_success_rate',
       width: 110,
-      render: (_: unknown, r: CouponDataRow) => (
+      render: (_: unknown, r: CouponDataRow) => <PointScorePopover row={r} />,
-        <Tooltip title="当前接口未返回本场应领点位及逐点结果，前端不使用全局均值冒充本场成功率。">
-          {r.trace_url ? (
-            <a href={r.trace_url} target="_blank" rel="noreferrer">
-              查看明细
-            </a>
-          ) : (
-            <Typography.Text type="secondary">待埋点</Typography.Text>
-          )}
-        </Tooltip>
-      ),
     },
     {
       title: '广告收益',

src/lib/types.ts

@@ -364,6 +364,25 @@ export interface ComparisonRecordListItem {
   created_at: string;
 }
 
+export interface ComparisonRecordsSummary {
+  started: number;
+  completed: number;
+  success: number;
+  success_rate: number | null;
+  avg_token_cost: number | null;
+  lower_price_rate: number | null;
+  avg_duration_ms: number | null;
+  p5_duration_ms: number | null;
+  p50_duration_ms: number | null;
+  p95_duration_ms: number | null;
+  p99_duration_ms: number | null;
+  cancelled: number;
+  cancelled_rate: number | null;
+  cancelled_p5_ms: number | null;
+  cancelled_p50_ms: number | null;
+  cancelled_p95_ms: number | null;
+}
+
 // 单次 LLM 调用明细(pricebot chat() 收口落盘,server 按 trace 拉来)
 export interface LlmCall {
   ts?: number;