import type React from "react";
import { useState } from "react";

import { Modal, Switch, Space, Select } from "antd";

import { ReportType } from "../../types/types";

interface GenerateReportModalProps {
  open: boolean;
  onCancel: () => void;
  onSubmit: (reportType: ReportType, useAI: boolean) => void;
}

const GenerateReportModal: React.FC<GenerateReportModalProps> = ({
  open,
  onCancel,
  onSubmit,
}) => {
  const [reportType, setReportType] = useState<ReportType>(
    ReportType.WEEKLY_REPORT,
  );
  const [useAI, setUseAI] = useState(true);

  const handleSubmit = () => {
    onSubmit(reportType, useAI);
  };

  return (
    <Modal
      title="生成报告"
      open={open}
      onCancel={onCancel}
      onOk={handleSubmit}
      okText="生成预览"
      cancelText="取消"
    >
      <Space direction="vertical">
        <div className="flex gap-x-2 items-center">
          <div>报告类型</div>
          <Select
            value={reportType}
            style={{ width: 120 }}
            onChange={(value) => setReportType(value)}
            options={[
              { value: ReportType.WEEKLY_REPORT, label: "本周周报" },
              { value: ReportType.LAST_WEEK_REPORT, label: "上周周报" },
              { value: ReportType.DAILY_REPORT, label: "本日日报" },
              { value: ReportType.YESTERDAY_REPORT, label: "昨日日报" },
            ]}
          />
        </div>
        <div className="flex gap-x-2">
          <div style={{ marginBottom: 8 }}>AI自动整理</div>
          <Switch
            checked={useAI}
            onChange={setUseAI}
            checkedChildren="开启"
            unCheckedChildren="关闭"
          />
        </div>
      </Space>
    </Modal>
  );
};

export default GenerateReportModal;