import React from 'react';
|
|
/**
|
* 顶部区域组件 - 标题、AI状态、案件信息
|
*/
|
const TopSection = ({ caseInfo = {}, aiStatus = 'AI调解中' }) => {
|
const {
|
caseNumber = 'LD-2026-0014',
|
disputeType = '劳动争议/拖欠、克扣工资',
|
startTime = '2026-01-15 09:30',
|
endTime = '2026-01-15 11:00',
|
} = caseInfo;
|
|
return (
|
<section className="top-section">
|
<div className="header">
|
<div className="title-area">
|
<div className="title-icon">
|
<img
|
style={{ width: 36 }}
|
src="http://gz.hugeinfo.com.cn/dyh/wx414ae04ac3f10b4e/images/pngAI_logo.png"
|
alt="云小调"
|
/>
|
</div>
|
<div className="title-text">
|
<h1>"云小调"劳动争议AI调解智能体</h1>
|
<div className="title-subtitle">
|
<div className="subtitle-text">AI调解员驾驶舱 - 全自动调解系统</div>
|
<div className="ai-status-tag">
|
<i className="fas fa-circle" style={{ fontSize: '0.6rem' }}></i>
|
{aiStatus}
|
</div>
|
</div>
|
</div>
|
</div>
|
<div className="case-info">
|
<div className="info-item">
|
<div className="info-label">事项编号</div>
|
<div className="info-value">{caseNumber}</div>
|
</div>
|
<div className="info-item">
|
<div className="info-label">纠纷类型</div>
|
<div className="info-value">{disputeType}</div>
|
</div>
|
<div className="info-item">
|
<div className="info-label">调解开始时间</div>
|
<div className="info-value">{startTime}</div>
|
</div>
|
<div className="info-item">
|
<div className="info-label">预计结束时间</div>
|
<div className="info-value">{endTime}</div>
|
</div>
|
</div>
|
</div>
|
</section>
|
);
|
};
|
|
export default TopSection;
|
