feat: AI Worker 平台 MVP v1.0.0 - 多租户/项目管理/AI Worker/任务编排/HITL审核/成本治理
This commit is contained in:
@@ -0,0 +1,311 @@
|
||||
import { useState, useEffect } from 'react';
|
||||
import {
|
||||
Card, Table, Button, Modal, Tag, Space, message, Input,
|
||||
Typography, Empty, Badge, Tooltip,
|
||||
} from 'antd';
|
||||
import {
|
||||
CheckOutlined, CloseOutlined, EyeOutlined, FileSearchOutlined,
|
||||
} from '@ant-design/icons';
|
||||
import { reviewApi } from '@/api';
|
||||
import type { Review, ReviewDecisionPayload } from '@/types';
|
||||
|
||||
const { TextArea } = Input;
|
||||
const { Text, Paragraph } = Typography;
|
||||
|
||||
const reviewStatusConfig: Record<string, { label: string; color: string }> = {
|
||||
pending: { label: '待审核', color: 'orange' },
|
||||
approved: { label: '已通过', color: 'green' },
|
||||
rejected: { label: '已拒绝', color: 'red' },
|
||||
escalated: { label: '已升级', color: 'purple' },
|
||||
};
|
||||
|
||||
const reviewTypeConfig: Record<string, string> = {
|
||||
approval: '审批',
|
||||
acceptance: '验收',
|
||||
arbitration: '仲裁',
|
||||
quality_check: '质量检查',
|
||||
};
|
||||
|
||||
export default function Reviews() {
|
||||
const [reviews, setReviews] = useState<Review[]>([]);
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [statusFilter, setStatusFilter] = useState<string>('pending');
|
||||
const [detailModal, setDetailModal] = useState<Review | null>(null);
|
||||
const [decisionModal, setDecisionModal] = useState<{
|
||||
review: Review;
|
||||
decision: 'approved' | 'rejected';
|
||||
} | null>(null);
|
||||
const [comment, setComment] = useState('');
|
||||
|
||||
const fetchData = async () => {
|
||||
setLoading(true);
|
||||
try {
|
||||
const data = await reviewApi.list({ status: statusFilter === 'all' ? undefined : statusFilter });
|
||||
setReviews(data);
|
||||
} catch {
|
||||
message.error('加载审核列表失败');
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
fetchData();
|
||||
}, [statusFilter]);
|
||||
|
||||
const handleDecision = async () => {
|
||||
if (!decisionModal) return;
|
||||
try {
|
||||
const payload: ReviewDecisionPayload = {
|
||||
comment,
|
||||
status: decisionModal.decision,
|
||||
};
|
||||
await reviewApi.decision(String(decisionModal.review.id), payload);
|
||||
message.success(
|
||||
decisionModal.decision === 'approved' ? '已通过审核' : '已拒绝并退回',
|
||||
);
|
||||
setDecisionModal(null);
|
||||
setComment('');
|
||||
fetchData();
|
||||
} catch {
|
||||
message.error('操作失败');
|
||||
}
|
||||
};
|
||||
|
||||
const openDecision = (review: Review, decision: 'approved' | 'rejected') => {
|
||||
setDecisionModal({ review, decision });
|
||||
setComment('');
|
||||
};
|
||||
|
||||
const columns = [
|
||||
{
|
||||
title: 'ID',
|
||||
dataIndex: 'id',
|
||||
key: 'id',
|
||||
width: 60,
|
||||
},
|
||||
{
|
||||
title: '任务',
|
||||
key: 'task',
|
||||
render: (_: any, record: Review) => (
|
||||
<Space direction="vertical" size={0}>
|
||||
<Text strong>任务 #{record.task_id}</Text>
|
||||
<Text type="secondary" style={{ fontSize: 12 }}>
|
||||
项目 #{record.project_id}
|
||||
</Text>
|
||||
</Space>
|
||||
),
|
||||
},
|
||||
{
|
||||
title: '审核类型',
|
||||
dataIndex: 'review_type',
|
||||
key: 'review_type',
|
||||
render: (type: string) => (
|
||||
<Tag>{reviewTypeConfig[type] || type}</Tag>
|
||||
),
|
||||
},
|
||||
{
|
||||
title: '状态',
|
||||
dataIndex: 'status',
|
||||
key: 'status',
|
||||
render: (status: string) => {
|
||||
const cfg = reviewStatusConfig[status] || { label: status, color: 'default' };
|
||||
return <Badge status={cfg.color as any} text={cfg.label} />;
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '提交时间',
|
||||
dataIndex: 'submitted_at',
|
||||
key: 'submitted_at',
|
||||
render: (time: string) => (
|
||||
<Text style={{ fontSize: 12 }}>
|
||||
{time ? new Date(time).toLocaleString('zh-CN') : '-'}
|
||||
</Text>
|
||||
),
|
||||
},
|
||||
{
|
||||
title: '审核人',
|
||||
key: 'reviewer',
|
||||
render: (_: any, record: Review) => (
|
||||
record.reviewer_id ? (
|
||||
<Text style={{ fontSize: 12 }}>
|
||||
#{record.reviewer_id}
|
||||
{record.reviewer_role ? ` (${record.reviewer_role})` : ''}
|
||||
</Text>
|
||||
) : (
|
||||
<Text type="secondary">-</Text>
|
||||
)
|
||||
),
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
key: 'action',
|
||||
width: 220,
|
||||
render: (_: any, record: Review) => (
|
||||
<Space>
|
||||
<Tooltip title="查看详情">
|
||||
<Button
|
||||
size="small"
|
||||
icon={<EyeOutlined />}
|
||||
onClick={() => setDetailModal(record)}
|
||||
/>
|
||||
</Tooltip>
|
||||
{record.status === 'pending' && (
|
||||
<>
|
||||
<Button
|
||||
size="small"
|
||||
type="primary"
|
||||
icon={<CheckOutlined />}
|
||||
onClick={() => openDecision(record, 'approved')}
|
||||
>
|
||||
通过
|
||||
</Button>
|
||||
<Button
|
||||
size="small"
|
||||
danger
|
||||
icon={<CloseOutlined />}
|
||||
onClick={() => openDecision(record, 'rejected')}
|
||||
>
|
||||
拒绝
|
||||
</Button>
|
||||
</>
|
||||
)}
|
||||
</Space>
|
||||
),
|
||||
},
|
||||
];
|
||||
|
||||
const filterButtons = ['pending', 'approved', 'rejected', 'all'].map((s) => (
|
||||
<Button
|
||||
key={s}
|
||||
type={statusFilter === s ? 'primary' : 'default'}
|
||||
onClick={() => setStatusFilter(s)}
|
||||
>
|
||||
{s === 'all' ? '全部' : reviewStatusConfig[s]?.label || s}
|
||||
</Button>
|
||||
));
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Card
|
||||
title={
|
||||
<Space>
|
||||
<FileSearchOutlined />
|
||||
审核管理
|
||||
</Space>
|
||||
}
|
||||
extra={<Space>{filterButtons}</Space>}
|
||||
>
|
||||
{reviews.length === 0 && !loading ? (
|
||||
<Empty
|
||||
description={
|
||||
statusFilter === 'pending'
|
||||
? '暂无待审核项'
|
||||
: '暂无审核记录'
|
||||
}
|
||||
/>
|
||||
) : (
|
||||
<Table
|
||||
columns={columns}
|
||||
dataSource={reviews}
|
||||
rowKey="id"
|
||||
loading={loading}
|
||||
pagination={{ pageSize: 10 }}
|
||||
/>
|
||||
)}
|
||||
</Card>
|
||||
|
||||
{/* 审核详情弹窗 */}
|
||||
<Modal
|
||||
title={`审核详情 #${detailModal?.id || ''}`}
|
||||
open={!!detailModal}
|
||||
onCancel={() => setDetailModal(null)}
|
||||
footer={<Button onClick={() => setDetailModal(null)}>关闭</Button>}
|
||||
width={640}
|
||||
>
|
||||
{detailModal && (
|
||||
<div>
|
||||
<Space style={{ marginBottom: 12 }}>
|
||||
<Tag>{reviewTypeConfig[detailModal.review_type] || detailModal.review_type}</Tag>
|
||||
<Badge
|
||||
status={reviewStatusConfig[detailModal.status]?.color as any}
|
||||
text={reviewStatusConfig[detailModal.status]?.label || detailModal.status}
|
||||
/>
|
||||
</Space>
|
||||
|
||||
<div style={{ marginBottom: 12 }}>
|
||||
<Text type="secondary">任务 ID: </Text>
|
||||
<Text strong>{detailModal.task_id}</Text>
|
||||
<Text type="secondary"> | 项目 ID: </Text>
|
||||
<Text strong>{detailModal.project_id}</Text>
|
||||
</div>
|
||||
|
||||
<div style={{ marginBottom: 12 }}>
|
||||
<Text type="secondary">提交时间: </Text>
|
||||
<Text>
|
||||
{detailModal.submitted_at
|
||||
? new Date(detailModal.submitted_at).toLocaleString('zh-CN')
|
||||
: '-'}
|
||||
</Text>
|
||||
</div>
|
||||
|
||||
{detailModal.reviewed_at && (
|
||||
<div style={{ marginBottom: 12 }}>
|
||||
<Text type="secondary">审核时间: </Text>
|
||||
<Text>{new Date(detailModal.reviewed_at).toLocaleString('zh-CN')}</Text>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<Text type="secondary">AI 产出内容:</Text>
|
||||
<Card
|
||||
size="small"
|
||||
style={{ marginTop: 8, marginBottom: 12, maxHeight: 300, overflow: 'auto' }}
|
||||
>
|
||||
<Paragraph style={{ whiteSpace: 'pre-wrap', marginBottom: 0 }}>
|
||||
{detailModal.review_content}
|
||||
</Paragraph>
|
||||
</Card>
|
||||
|
||||
{detailModal.reviewer_comment && (
|
||||
<div>
|
||||
<Text type="secondary">审核意见:</Text>
|
||||
<Card size="small" style={{ marginTop: 8 }}>
|
||||
<Text>{detailModal.reviewer_comment}</Text>
|
||||
</Card>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</Modal>
|
||||
|
||||
{/* 审核决策弹窗 */}
|
||||
<Modal
|
||||
title={
|
||||
decisionModal?.decision === 'approved' ? '确认通过审核' : '确认拒绝（退回返工）'
|
||||
}
|
||||
open={!!decisionModal}
|
||||
onOk={handleDecision}
|
||||
onCancel={() => setDecisionModal(null)}
|
||||
okText="确认"
|
||||
cancelText="取消"
|
||||
okButtonProps={{
|
||||
danger: decisionModal?.decision === 'rejected',
|
||||
type: decisionModal?.decision === 'approved' ? 'primary' : 'default',
|
||||
}}
|
||||
>
|
||||
<Text>请输入审核意见:</Text>
|
||||
<TextArea
|
||||
rows={4}
|
||||
value={comment}
|
||||
onChange={(e) => setComment(e.target.value)}
|
||||
placeholder={
|
||||
decisionModal?.decision === 'approved'
|
||||
? '产出符合要求，准予通过...'
|
||||
: '请说明拒绝原因，AI 将根据反馈返工...'
|
||||
}
|
||||
style={{ marginTop: 8 }}
|
||||
/>
|
||||
</Modal>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user