From 66748d4f196d654fcba41c2b59cccd1b1bad276e Mon Sep 17 00:00:00 2001 From: Your Name Date: Fri, 6 Feb 2026 15:54:53 +0800 Subject: [PATCH] =?UTF-8?q?feat(agency):=20=E4=BC=98=E5=8C=96=E5=AE=A1?= =?UTF-8?q?=E6=A0=B8=E5=8F=B0=E5=88=97=E8=A1=A8=E9=A1=B5=E5=B9=B6=E6=96=B0?= =?UTF-8?q?=E5=A2=9E=E7=94=B3=E8=AF=89=E5=A4=84=E7=90=86=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 审核台列表页优化： - 每个任务项显示文件名、文件大小 - 添加下载按钮支持文件下载 - 点击"审核"按钮才跳转到详情页 - 按风险等级显示不同颜色的状态标签和按钮 新增申诉处理功能： - 申诉列表页：展示所有达人申诉，支持搜索和状态筛选 - 申诉详情页：查看申诉内容、附件、原审核问题 - 处理决策面板：通过/驳回申诉并填写处理意见 - 侧边栏添加"申诉处理"菜单入口 Co-Authored-By: Claude Opus 4.5 --- frontend/app/agency/appeals/[id]/page.tsx | 348 +++++++++++++++++++++ frontend/app/agency/appeals/page.tsx | 280 +++++++++++++++++ frontend/app/agency/review/page.tsx | 227 +++++++++++--- frontend/components/navigation/Sidebar.tsx | 4 +- 4 files changed, 815 insertions(+), 44 deletions(-) create mode 100644 frontend/app/agency/appeals/[id]/page.tsx create mode 100644 frontend/app/agency/appeals/page.tsx diff --git a/frontend/app/agency/appeals/[id]/page.tsx b/frontend/app/agency/appeals/[id]/page.tsx new file mode 100644 index 0000000..697c4f8 --- /dev/null +++ b/frontend/app/agency/appeals/[id]/page.tsx @@ -0,0 +1,348 @@ +'use client' + +import { useState } from 'react' +import { useRouter, useParams } from 'next/navigation' +import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/Card' +import { Button } from '@/components/ui/Button' +import { + ArrowLeft, + MessageSquare, + Clock, + CheckCircle, + XCircle, + AlertTriangle, + User, + FileText, + Video, + Download, + File, + Send, + Image as ImageIcon +} from 'lucide-react' + +// 申诉状态类型 +type AppealStatus = 'pending' | 'processing' | 'approved' | 'rejected' + +// 模拟申诉详情数据 +const mockAppealDetail = { + id: 'appeal-001', + taskId: 'task-001', + taskTitle: '夏日护肤推广脚本', + creatorId: 'creator-001', + creatorName: '小美护肤', + creatorAvatar: '小', + type: 'ai' as const, + contentType: 'script' as const, + reason: 'AI误判', + content: '脚本中提到的"某品牌"是泛指，并非特指竞品，AI系统可能误解了语境。我在脚本中使用的是泛化表述，并没有提及任何具体的竞品名称。请代理商重新审核此处，谢谢！', + status: 'pending' as AppealStatus, + createdAt: '2026-02-06 10:30', + // 附件 + attachments: [ + { id: 'att-001', name: '品牌授权证明.pdf', size: '1.2 MB', type: 'pdf' }, + { id: 'att-002', name: '脚本原文截图.png', size: '345 KB', type: 'image' }, + ], + // 原审核问题 + originalIssue: { + type: 'ai', + title: '疑似竞品提及', + description: '脚本第3段提到"某品牌"，可能涉及竞品露出风险。', + location: '脚本第3段，第2行', + }, + // 相关任务信息 + taskInfo: { + projectName: 'XX品牌618推广', + scriptFileName: '夏日护肤推广_脚本v2.docx', + scriptFileSize: '245 KB', + }, +} + +// 状态配置 +const statusConfig: Record = { + pending: { label: '待处理', color: 'text-accent-amber', bgColor: 'bg-accent-amber/15', icon: Clock }, + processing: { label: '处理中', color: 'text-accent-indigo', bgColor: 'bg-accent-indigo/15', icon: MessageSquare }, + approved: { label: '已通过', color: 'text-accent-green', bgColor: 'bg-accent-green/15', icon: CheckCircle }, + rejected: { label: '已驳回', color: 'text-accent-coral', bgColor: 'bg-accent-coral/15', icon: XCircle }, +} + +export default function AgencyAppealDetailPage() { + const router = useRouter() + const params = useParams() + const [appeal] = useState(mockAppealDetail) + const [replyContent, setReplyContent] = useState('') + const [isSubmitting, setIsSubmitting] = useState(false) + + const status = statusConfig[appeal.status] + const StatusIcon = status.icon + + const handleApprove = async () => { + if (!replyContent.trim()) { + alert('请填写处理意见') + return + } + setIsSubmitting(true) + // 模拟提交 + await new Promise(resolve => setTimeout(resolve, 1000)) + alert('申诉已通过') + router.push('/agency/appeals') + } + + const handleReject = async () => { + if (!replyContent.trim()) { + alert('请填写驳回原因') + return + } + setIsSubmitting(true) + // 模拟提交 + await new Promise(resolve => setTimeout(resolve, 1000)) + alert('申诉已驳回') + router.push('/agency/appeals') + } + + return ( +
+ {/* 顶部导航 */} +
+
+ +
+

申诉处理

+

申诉编号: {appeal.id}

+
+
+
+ + {status.label} +
+
+ +
+ {/* 左侧：申诉详情 */} +
+ {/* 申诉人信息 */} + + + + + 申诉人信息 + + + +
+
+ {appeal.creatorAvatar} +
+
+

{appeal.creatorName}

+

达人ID: {appeal.creatorId}

+
+
+
+
+ 任务名称 +

{appeal.taskTitle}

+
+
+ 所属项目 +

{appeal.taskInfo.projectName}

+
+
+ 内容类型 +

+ {appeal.contentType === 'script' ? :

+
+
+ 提交时间 +

{appeal.createdAt}

+
+
+ + + + {/* 原审核问题 */} + + + + + 原审核问题 + + + +
+
+ + {appeal.originalIssue.type === 'ai' ? 'AI检测' : '人工审核'} + + {appeal.originalIssue.title} +
+

{appeal.originalIssue.description}

+

位置: {appeal.originalIssue.location}

+
+ + + + {/* 申诉内容 */} + + + + + 申诉内容 + + + +
+
+ 申诉原因 +

{appeal.reason}

+
+
+ 详细说明 +

{appeal.content}

+
+ + {/* 附件 */} + {appeal.attachments.length > 0 && ( +
+ 附件材料 +
+ {appeal.attachments.map((att) => ( +
+
+ {att.type === 'image' ? ( + + ) : ( + + )} +
+
+

{att.name}

+

{att.size}

+
+ +
+ ))} +
+
+ )} +
+ + +
+ + {/* 右侧：处理面板 */} +
+ {/* 相关文件 */} + + + + + 相关文件 + + + +
+
+ +
+
+

+ {appeal.taskInfo.scriptFileName} +

+

{appeal.taskInfo.scriptFileSize}

+
+ +
+ + + + {/* 处理决策 */} + {appeal.status === 'pending' || appeal.status === 'processing' ? ( + + + 处理决策 + + +
+ +