feat(price-reports): 运营后台「上报审核」页

用户上报"某平台比我们算的最低价更便宜"+截图,运营人工审核:
- price-reports/page.tsx: 列表+截图预览+通过(发1000金币)/拒绝(填理由),仿 withdraws
- layout.tsx: 侧边栏菜单加「上报审核」(FlagOutlined)
- lib/types.ts: PriceReport / PriceReportSummary DTO
- .gitignore: 加 CLAUDE.md(本地维护不入库,同 android/app-server 约定)

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
xianze
2026-06-10 13:45:29 +08:00
parent 45b9c7140d
commit cac9a38192
4 changed files with 357 additions and 0 deletions
+3
View File
@@ -7,3 +7,6 @@ next-env.d.ts
.DS_Store
data/
.run-logs/
# CLAUDE.md 本地维护、不入库(同 android/app-server 约定)
CLAUDE.md
+2
View File
@@ -5,6 +5,7 @@ import { usePathname, useRouter } from 'next/navigation';
import {
DashboardOutlined,
FileSearchOutlined,
FlagOutlined,
LogoutOutlined,
MessageOutlined,
MoneyCollectOutlined,
@@ -22,6 +23,7 @@ const MENU = [
{ key: '/dashboard', icon: <DashboardOutlined />, label: '数据大盘' },
{ key: '/users', icon: <UserOutlined />, label: '用户管理' },
{ key: '/withdraws', icon: <MoneyCollectOutlined />, label: '提现管理' },
{ key: '/price-reports', icon: <FlagOutlined />, label: '上报审核' },
{ key: '/feedbacks', icon: <MessageOutlined />, label: '反馈工单' },
{ key: '/config', icon: <SettingOutlined />, label: '系统配置' },
{ key: '/admins', icon: <TeamOutlined />, label: '管理员', superOnly: true },
+325
View File
@@ -0,0 +1,325 @@
'use client';
import { useEffect, useState } from 'react';
import {
Button,
Card,
Image,
Input,
Modal,
Space,
Statistic,
Table,
Tabs,
Tag,
Typography,
message,
} from 'antd';
import type { ColumnsType } from 'antd/es/table';
import { CheckCircleOutlined, CloseCircleOutlined } from '@ant-design/icons';
import dayjs from 'dayjs';
import { api, errMsg } from '@/lib/api';
import { canDo } from '@/lib/auth';
import { useCursorList } from '@/lib/useCursorList';
import type { PriceReport, PriceReportSummary } from '@/lib/types';
const { Text } = Typography;
// 后端 created_at/reviewed_at 存的是北京 wall-clock(naive,同 savings/comparison),
// 直接本地解析、不加 Z(否则会差 8h)。
const dt = (v: string | null) => (v ? dayjs(v).format('YYYY-MM-DD HH:mm') : '-');
const yuan = (c: number | null) => (c == null ? '-' : `¥${(c / 100).toFixed(2)}`);
// 截图是 app-server 的 /media 相对路径,本地由 :8770 提供(NEXT_PUBLIC_MEDIA_BASE);生产同域走 nginx 代理。
const MEDIA_BASE = process.env.NEXT_PUBLIC_MEDIA_BASE || '';
const mediaUrl = (p: string) => (p.startsWith('http') ? p : MEDIA_BASE + p);
const STATUS_COLOR: Record<string, string> = {
pending: 'gold',
approved: 'green',
rejected: 'default',
};
const STATUS_LABEL: Record<string, string> = {
pending: '待审核',
approved: '已通过',
rejected: '已拒绝',
};
const STATUS_TABS = [
{ key: 'pending', label: '待审核' },
{ key: 'approved', label: '已通过' },
{ key: 'rejected', label: '已拒绝' },
{ key: 'all', label: '全部' },
];
const REJECT_TEMPLATES = ['截图不清晰', '商品不匹配', '价格不属实', '平台不支持', '重复上报', '其他原因'];
function statusTag(status: string) {
return <Tag color={STATUS_COLOR[status]}>{STATUS_LABEL[status] || status}</Tag>;
}
export default function PriceReportsPage() {
const [activeStatus, setActiveStatus] = useState('pending');
const [summary, setSummary] = useState<PriceReportSummary | null>(null);
const [rejecting, setRejecting] = useState<PriceReport | null>(null);
const [rejectReason, setRejectReason] = useState('');
const filters: Record<string, unknown> = {};
if (activeStatus !== 'all') filters.status = activeStatus;
const { items, nextCursor, loading, loadMore, reload } = useCursorList<PriceReport>(
'/admin/api/price-reports',
filters,
);
const canReview = canDo(['operator']);
const loadSummary = async () => {
try {
const { data } = await api.get<PriceReportSummary>('/admin/api/price-reports/summary');
setSummary(data);
} catch {
/* 统计失败不阻塞列表 */
}
};
useEffect(() => {
loadSummary();
}, []);
const refreshAfterChange = () => {
reload();
loadSummary();
};
const approve = (r: PriceReport) => {
Modal.confirm({
title: '确认通过该上报?',
icon: <CheckCircleOutlined style={{ color: '#52c41a' }} />,
content: (
<div>
<div> #{r.user_id}</div>
<div>: {r.store_name || '-'}</div>
<div>
: {yuan(r.reported_price_cents)}{r.reported_platform_name}
</div>
<div style={{ marginTop: 8, color: '#8c8c8c' }}>
1000
</div>
</div>
),
okText: '通过并发金币',
onOk: async () => {
try {
await api.post(`/admin/api/price-reports/${r.id}/approve`);
message.success('已通过,已发放 1000 金币');
refreshAfterChange();
} catch (e) {
message.error(errMsg(e));
}
},
});
};
const confirmReject = async () => {
if (!rejecting) return;
const reason = rejectReason.trim();
if (!reason) {
message.warning('请填写拒绝理由');
return;
}
try {
await api.post(`/admin/api/price-reports/${rejecting.id}/reject`, { reason });
message.success('已拒绝');
setRejecting(null);
setRejectReason('');
refreshAfterChange();
} catch (e) {
message.error(errMsg(e));
}
};
const columns: ColumnsType<PriceReport> = [
{
title: '用户',
dataIndex: 'user_id',
width: 90,
render: (v: number) => <Text strong>#{v}</Text>,
},
{
title: '门店 / 菜品',
key: 'store',
width: 200,
render: (_: unknown, r: PriceReport) => (
<Space direction="vertical" size={0}>
<Text>{r.store_name || '-'}</Text>
<Text type="secondary" style={{ fontSize: 12 }}>
{r.dish_summary || '-'}
</Text>
</Space>
),
},
{
title: '原最低价 → 上报价',
key: 'price',
width: 220,
render: (_: unknown, r: PriceReport) => (
<Space direction="vertical" size={0}>
<Text type="secondary" style={{ fontSize: 12 }}>
{r.original_platform_name || '原'}: {yuan(r.original_price_cents)}
</Text>
<Text strong style={{ color: '#fa541c' }}>
{r.reported_platform_name}: {yuan(r.reported_price_cents)}
</Text>
</Space>
),
},
{
title: '截图证明',
dataIndex: 'images',
width: 180,
render: (imgs: string[]) =>
imgs && imgs.length ? (
<Image.PreviewGroup>
<Space size={4} wrap>
{imgs.map((src, i) => (
<Image
key={i}
src={mediaUrl(src)}
width={44}
height={44}
style={{ objectFit: 'cover', borderRadius: 4 }}
/>
))}
</Space>
</Image.PreviewGroup>
) : (
<Text type="secondary"></Text>
),
},
{ title: '状态', dataIndex: 'status', width: 90, render: statusTag },
{
title: '提交时间',
dataIndex: 'created_at',
width: 150,
render: (v: string) => dt(v),
},
{
title: '操作 / 结果',
key: 'op',
fixed: 'right',
width: 200,
render: (_: unknown, r: PriceReport) => {
if (r.status === 'pending') {
if (!canReview) return <Text type="secondary"></Text>;
return (
<Space>
<Button
size="small"
type="link"
icon={<CheckCircleOutlined />}
onClick={() => approve(r)}
>
</Button>
<Button
size="small"
type="link"
danger
icon={<CloseCircleOutlined />}
onClick={() => {
setRejecting(r);
setRejectReason('');
}}
>
</Button>
</Space>
);
}
if (r.status === 'approved') {
return <Text type="success"> {r.reward_coins ?? 0} </Text>;
}
if (r.status === 'rejected') {
return <Text type="secondary">: {r.reject_reason || '-'}</Text>;
}
return <Text type="secondary">-</Text>;
},
},
];
return (
<div>
<Space direction="vertical" style={{ marginBottom: 16 }}>
<Typography.Title level={4} style={{ margin: 0 }}>
</Typography.Title>
<Text type="secondary">
+ 1000 app
</Text>
</Space>
{summary && (
<Space size="large" style={{ marginBottom: 16 }}>
<Statistic title="待审核" value={summary.pending} valueStyle={{ color: '#faad14' }} />
<Statistic title="已通过" value={summary.approved} valueStyle={{ color: '#52c41a' }} />
<Statistic title="已拒绝" value={summary.rejected} />
<Statistic title="合计" value={summary.total} />
</Space>
)}
<Card>
<Tabs
activeKey={activeStatus}
onChange={setActiveStatus}
items={STATUS_TABS.map((t) => ({ key: t.key, label: t.label }))}
/>
<Table
rowKey="id"
columns={columns}
dataSource={items}
loading={loading}
pagination={false}
scroll={{ x: 1100 }}
/>
<div style={{ marginTop: 16, textAlign: 'center' }}>
<Button onClick={loadMore} disabled={!nextCursor} loading={loading}>
{nextCursor ? '加载更多' : '没有更多了'}
</Button>
</div>
</Card>
<Modal
title="拒绝上报"
open={!!rejecting}
okText="确认拒绝"
okButtonProps={{ danger: true, icon: <CloseCircleOutlined /> }}
onOk={confirmReject}
onCancel={() => {
setRejecting(null);
setRejectReason('');
}}
>
{rejecting && (
<Space direction="vertical" style={{ width: '100%' }}>
<Text>
#{rejecting.user_id} · {rejecting.store_name || '-'}
</Text>
<Space wrap>
{REJECT_TEMPLATES.map((tpl) => (
<Button size="small" key={tpl} onClick={() => setRejectReason(tpl)}>
{tpl}
</Button>
))}
</Space>
<Input.TextArea
rows={4}
maxLength={200}
value={rejectReason}
placeholder="请输入拒绝理由,用户端记录页会看到"
onChange={(e) => setRejectReason(e.target.value)}
/>
</Space>
)}
</Modal>
</div>
);
}
+27
View File
@@ -198,3 +198,30 @@ export interface DashboardOverview {
feedback: { new: number };
cps: { available: boolean; note: string };
}
export interface PriceReport {
id: number;
user_id: number;
comparison_record_id: number | null;
store_name: string | null;
dish_summary: string | null;
original_platform_id: string | null;
original_platform_name: string | null;
original_price_cents: number | null;
reported_platform_id: string;
reported_platform_name: string;
reported_price_cents: number;
images: string[];
status: string; // pending / approved / rejected
reject_reason: string | null;
reward_coins: number | null;
reviewed_at: string | null;
created_at: string;
}
export interface PriceReportSummary {
pending: number;
approved: number;
rejected: number;
total: number;
}