import { useState } from 'react';
import { Button, Modal } from '@/components/ui';

export type ReportWorkbookFormat = 'excel_drawing' | 'wps_cell_image';

export function ReportExportFormatModal({
  busy = false,
  onClose,
  onConfirm,
  title = '选择报备文件格式',
}: {
  busy?: boolean;
  onClose: () => void;
  onConfirm: (format: ReportWorkbookFormat) => void;
  title?: string;
}) {
  const [format, setFormat] = useState<ReportWorkbookFormat>('excel_drawing');
  return (
    <Modal
      footer={
        <>
          <Button disabled={busy} onClick={onClose} variant="ghost">
            取消
          </Button>
          <Button disabled={busy} onClick={() => onConfirm(format)}>
            {busy ? '生成中…' : '确认导出'}
          </Button>
        </>
      }
      onClose={onClose}
      open
      title={title}
    >
      <div className="report-export-format-options" role="radiogroup" aria-label="报备文件格式">
        <button
          aria-checked={format === 'excel_drawing'}
          onClick={() => setFormat('excel_drawing')}
          role="radio"
          type="button"
        >
          <strong>系统 Excel 文件</strong>
          <span>标准 Drawing 图片，兼容 Microsoft Excel 及多数办公软件。</span>
        </button>
        <button
          aria-checked={format === 'wps_cell_image'}
          onClick={() => setFormat('wps_cell_image')}
          role="radio"
          type="button"
        >
          <strong>WPS 单元格图片文件</strong>
          <span>使用 DISPIMG 和 cellimages.xml，适配业务常用的 WPS 报备资料格式。</span>
        </button>
      </div>
    </Modal>
  );
}