/**
|
* AISuggestionCard 组件 - AI调解建议
|
* 展示AI生成的调解建议内容
|
*/
|
|
import React, { useCallback } from 'react';
|
import { Button, message } from 'antd';
|
import { BulbOutlined, RightOutlined } from '@ant-design/icons';
|
import './AISuggestionCard.css';
|
|
// Mock数据 - AI调解建议内容
|
const MOCK_SUGGESTION = `建议调解员优先安抚申请人张三的情绪。目前双方在补偿金额上的差距已缩小至15%，可尝试引入"互谅互让"原则进行最后博弈。建议调解员优先安抚申请人张三的情绪。目前双方在补偿金额上的差距已缩小至15%，可尝试引入"互谅互让"原则进行最后博弈。建议调解员优先安抚申请人张三的情绪。`;
|
|
/**
|
* AISuggestionCard 主组件
|
*/
|
const AISuggestionCard = () => {
|
// 点击查看详细策略建议
|
const handleViewDetail = useCallback(() => {
|
message.info('该功能正在升级中，敬请期待！');
|
}, []);
|
|
return (
|
<div className="ai-suggestion-card">
|
{/* 背景图标 */}
|
<img src="/ai-bg.png" alt="" className="ai-suggestion-bg" />
|
|
{/* 标题 */}
|
<div className="ai-suggestion-header">
|
<BulbOutlined className="ai-suggestion-icon" />
|
<span className="ai-suggestion-title">AI 调解建议</span>
|
</div>
|
|
{/* 建议内容 */}
|
<div className="ai-suggestion-content">
|
{MOCK_SUGGESTION}
|
</div>
|
|
{/* 查看详情按钮 */}
|
<div className="ai-suggestion-footer">
|
<Button
|
type="link"
|
className="ai-suggestion-btn"
|
onClick={handleViewDetail}
|
>
|
查看详细策略建议 <RightOutlined />
|
</Button>
|
</div>
|
</div>
|
);
|
};
|
|
export default AISuggestionCard;
|
