本功能将在现有的调解看板界面中添加状态控制能力,允许用户暂停或恢复AI自动调解流程。设计遵循现有系统的组件结构和交互模式。
位置:位于人工接管按钮右侧
显示逻辑: if (caseState === 0 || caseState === 1) { // 显示"终止"按钮,蓝色样式 buttonText = "终止"; buttonStyle = "primary"; } else if (caseState === 5) { // 显示"恢复"按钮,绿色样式 buttonText = "恢复"; buttonStyle = "success"; } else { // 不显示按钮 showButton = false; }
触发条件:用户点击状态控制按钮
内容结构:
- 标题:根据操作类型显示"确认终止调解"或"确认恢复调解"
- 描述文本:说明操作的影响
- 输入框:可选的备注信息
- 操作按钮:确认/取消
数据来源:从localStorage中的case_data_timeline获取案件状态
更新机制:API调用成功后重新加载案件数据
1. 用户点击按钮
2. 显示确认对话框
3. 用户确认操作
4. 调用ProcessAPIService.updateMediationState
5. 处理API响应
6. 成功:刷新页面数据
7. 失败:显示错误提示
终止按钮:
- 背景色:#1A6FB8(项目主题蓝色,与人工接管按钮相同)
- 文字颜色:白色
- 悬停效果:背景色加深至#0d4a8a
恢复按钮:
- 背景色:#52c41a(Ant Design success green,区别于人工接管的蓝色)
- 文字颜色:白色
- 悬停效果:背景色加深
加载状态:
- 按钮显示loading状态
- 禁用其他相关操作
- 显示操作进度提示
反馈机制:
- 操作成功:显示成功消息,自动刷新数据
- 操作失败:显示错误消息,保持当前界面状态