# AI 合同平台 V2 - 审批时间线与批注意见增强记录

日期：2026-06-25

## 背景

对照《AI 合同平台 V2 重构版开发方案》Phase 5 企业协作闭环，本轮完成审批时间线展示增强和退回批注意见功能。

## 目标

- 审批退回时支持填写处理意见。
- 意见记录到审批时间线和审计事件。
- 审批时间线采用更清晰的视觉样式。
- 不同审批节点（提交、通过、退回）采用不同颜色标识。

## 已完成内容

### 1. 退回批注意见对话框

文件：

- `yuqei-contract-platform/apps/contract-web/src/app/contracts/[id]/contract-actions.tsx`

完成点：

- 退回按钮点击后弹出意见输入对话框。
- 对话框包含意见文本框和确认/取消按钮。
- 提交退回时将意见一并传入后端 API。
- 后端已支持 `comment` 字段，会自动记录到审批时间线和审计事件。

### 2. 审批时间线视觉增强

文件：

- `yuqei-contract-platform/apps/contract-web/src/app/contracts/[id]/page.tsx`
- `yuqei-contract-platform/apps/contract-web/src/app/globals.css`

完成点：

- 审批时间线采用竖向时间线布局。
- 每个节点包含：圆点标记 + 连接线 + 内容区域。
- 不同操作类型采用不同颜色：
  - 通过：绿色 (`approval-timeline-dot-success`)
  - 退回：红色 (`approval-timeline-dot-danger`)
  - 重新提交：橙色 (`approval-timeline-dot-warning`)
  - 提交审批：默认蓝色
- 意见内容单独展示在节点下方，带左边框强调。
- 退回意见使用红色背景区分。

### 3. CSS 样式新增

```css
.approval-timeline
.approval-timeline-item
.approval-timeline-marker
.approval-timeline-dot
.approval-timeline-line
.approval-timeline-content
.approval-timeline-action
.approval-timeline-meta
.approval-timeline-comment
.reject-dialog
.reject-dialog-header
.reject-dialog-body
.reject-dialog-label
.reject-dialog-textarea
.reject-dialog-actions
```

## 验证结果

已通过：

```powershell
npm --prefix yuqei-contract-platform/apps/contract-web run typecheck
npm --prefix yuqei-contract-platform/apps/contract-web run build
```

结果：

- TypeScript 类型检查通过。
- Next.js 生产构建通过。

## 当前闭环

现在审批流程体验为：

1. 业务用户提交审批。
2. 审批人打开合同详情，看到审批时间线。
3. 审批人点击"退回修改"，弹出意见输入框。
4. 审批人填写退回原因和修改建议，确认退回。
5. 退回意见记录到时间线，合同状态变为"已退回"。
6. 业务用户看到退回意见，修改后重新提交。
7. 重新提交记录追加到时间线。
8. 审批通过后时间线显示完整审批历程。

这符合 V2 方案中"审批按条件出现、退回后能修改并重新提交、所有关键操作有审计"的目标。

## 后续建议

下一步可以继续完善：

1. **条件审批规则**: 根据合同类型/金额/风险等级自动触发审批。
2. **通知中心**: 审批通知、审查完成通知、履约提醒的统一入口。
3. **版本比对**: 合同正文版本差异对比功能。