// REQ-USR-003: KPI 头条（标题 + 今日未处理/未清总数统计 + AI 占位按钮，复刻原型 .kpi-head）。
import { Button } from 'antd';
import { ThunderboltOutlined } from '@ant-design/icons';
import type { KPI_STATS } from './dashboardData';
import styles from './HomePage.module.css';

interface KpiHeadBarProps {
  stats: typeof KPI_STATS;
}

export default function KpiHeadBar({ stats }: KpiHeadBarProps) {
  return (
    <div className={`${styles.panel} ${styles.kpiHead}`}>
      <span className={styles.kpiHeadTitle}>KPI监控</span>
      <span className={styles.kpiStat}>
        <span>今日未处理：</span>
        <b>{stats.todayPending}</b>
      </span>
      <span className={styles.kpiSep}>|</span>
      <span className={`${styles.kpiStat} ${styles.kpiStatBlue}`}>
        <span>未清总数：</span>
        <b>{stats.openTotal}</b>
      </span>
      <Button type="primary" className={styles.aiBtn} icon={<ThunderboltOutlined />}>
        小ai同学,请帮我安排今日工作
      </Button>
    </div>
  );
}