dros/src/pages/exam/components/ExamExitFeedback.tsx

import React from 'react';
import { Modal, Button, Space } from 'antd';
import { ExclamationCircleFilled } from '@ant-design/icons';

export interface ExamExitFeedbackProps {
  /** 是否显示组件 */
  open: boolean;
  /** 点击"挂起"按钮的处理函数 */
  onContinue: () => void;
  /** 点击"保存并完成"按钮的处理函数 */
  onSave: () => void;
  /** 点击"直接中止"按钮的处理函数 */
  onAbort: () => void;
  /** 自定义标题 */
  title?: string;
  /** 自定义提示内容 */
  message?: string;
}

const ExamExitFeedback: React.FC<ExamExitFeedbackProps> = ({
  open,
  onContinue,
  onSave,
  onAbort,
  title = '检查未完成',
  message = '当前检查的曝光步骤尚未完成。中止后，本次检查的进度将不会保存。',
}) => {
  return (
    <Modal
      title={
        <Space>
          <ExclamationCircleFilled style={{ color: '#faad14' }} />
          <span>{title}</span>
        </Space>
      }
      open={open}
      onCancel={onContinue}
      footer={
        <Space>
          <Button onClick={onContinue}>继续检查</Button>
          <Button type="primary" onClick={onSave}>
            保存并完成
          </Button>
          <Button type="primary" danger onClick={onAbort}>
            直接中止
          </Button>
        </Space>
      }
      centered
      closable={false}
    >
      <p>{message}</p>
    </Modal>
  );
};

export default ExamExitFeedback;