import React from 'react';
import { Card, Timeline, Button } from 'antd';
import { ClockCircleOutlined } from '@ant-design/icons';

const CommunicationJourney = () => {
  return (
    <Card 
      title="沟通历程"
      extra={
        <Button type="primary">导出记录</Button>
      }
    >
      <Timeline
        mode="alternate"
        items={[
          {
            children: '创建营销活动 2023-10-25 10:00:00',
          },
          {
            children: '发送邮件通知 2023-10-25 10:30:00',
            color: 'green',
          },
          {
            dot: <ClockCircleOutlined style={{ fontSize: '16px' }} />,
            children: '客户查看邮件 2023-10-25 11:00:00',
          },
          {
            color: 'red',
            children: '系统提醒跟进 2023-10-25 14:00:00',
          },
          {
            children: '完成跟进 2023-10-25 16:00:00',
          },
        ]}
      />
    </Card>
  );
};

export default CommunicationJourney;