import { useEffect, useRef, useState } from 'react';
import * as pdfjsLib from 'pdfjs-dist';
import pdfjsWorker from 'pdfjs-dist/build/pdf.worker.min.mjs?url';

import type { OutputTongyishuFileInfo, OutputTijianPdfFileInfo, OutputPhysicalExamItemInfo } from '../../api';
import {
  signInMedicalExamCenter,
  submitTongyishuSign,
  submitDaojiandanSign,
  editDaojiandanPrintStatus,
  submitAddItemBillSign,
  getTijianPdfFile,
  getTongyishuPdf,
  getDaojiandanPdf,
  getExamOptionalItemList,
  removeOptionalPackage,
  getExamOptionRecordList,
} from '../../api';
import type { SignaturePadHandle } from '../ui';
import { Button, SignaturePad } from '../ui';

// Polyfill for Promise.withResolvers
if (typeof (Promise as any).withResolvers === 'undefined') {
  (Promise as any).withResolvers = function <T>() {
    let resolve!: (value: T | PromiseLike<T>) => void;
    let reject!: (reason?: any) => void;
    const promise = new Promise<T>((res, rej) => {
      resolve = res;
      reject = rej;
    });
    return { promise, resolve, reject };
  };
}

// 配置 PDF.js worker
pdfjsLib.GlobalWorkerOptions.workerSrc = pdfjsWorker;

interface ExamSignPanelProps {
  examId?: number;
  onBusyChange?: (busy: boolean) => void;
}

export const ExamSignPanel = ({ examId, onBusyChange }: ExamSignPanelProps) => {
  const [idCardFile, setIdCardFile] = useState<File | null>(null);
  const [previewImage, setPreviewImage] = useState<string | null>(null);
  const [showImagePreview, setShowImagePreview] = useState(false);
  const [signLoading, setSignLoading] = useState(false);
  const [message, setMessage] = useState<string | null>(null);
  const fileInputRef = useRef<HTMLInputElement | null>(null);
  const [consentList, setConsentList] = useState<OutputTongyishuFileInfo[]>([]);
  const [consentLoading, setConsentLoading] = useState(false);
  const [previewPdf, setPreviewPdf] = useState<OutputTongyishuFileInfo | null>(null);
  const [showSignature, setShowSignature] = useState(false);
  const signaturePadRef = useRef<SignaturePadHandle | null>(null);
  const [submitLoading, setSubmitLoading] = useState(false);
  const [submitMessage, setSubmitMessage] = useState<string | null>(null);
  const [signedCombinationCodes, setSignedCombinationCodes] = useState<number[]>([]);
  const [pdfData, setPdfData] = useState<ArrayBuffer | null>(null);
  const [pdfReady, setPdfReady] = useState(false);
  const [pdfLoading, setPdfLoading] = useState(false);
  const [pdfBlobUrl, setPdfBlobUrl] = useState<string | null>(null);
  const canvasContainerRef = useRef<HTMLDivElement>(null);

  // 导检单相关状态
  const [daojiandanUrl, setDaojiandanUrl] = useState<string | null>(null);
  const [isDaojiandanSigned, setIsDaojiandanSigned] = useState(false); // 导检单是否已签名
  const [showDaojiandanSignature, setShowDaojiandanSignature] = useState(false);
  const daojiandanSignaturePadRef = useRef<SignaturePadHandle | null>(null);
  const [daojiandanSubmitLoading, setDaojiandanSubmitLoading] = useState(false);
  const [daojiandanSubmitMessage, setDaojiandanSubmitMessage] = useState<string | null>(null);
  const [showDaojiandanPreview, setShowDaojiandanPreview] = useState(false);
  const [daojiandanPdfData, setDaojiandanPdfData] = useState<ArrayBuffer | null>(null);
  const [daojiandanPdfLoading, setDaojiandanPdfLoading] = useState(false);
  const daojiandanCanvasContainerRef = useRef<HTMLDivElement>(null);
  const [showAddItemBillPreview, setShowAddItemBillPreview] = useState(false);
  const [showAddItemBillSignature, setShowAddItemBillSignature] = useState(false);
  const addItemBillSignaturePadRef = useRef<SignaturePadHandle | null>(null);
  const [addItemBillSubmitLoading, setAddItemBillSubmitLoading] = useState(false);
  const [addItemBillSubmitMessage, setAddItemBillSubmitMessage] = useState<string | null>(null);
  type AddItemBillItem = {
    pdf_sort: number;
    combinationCode: string;
    payment_status?: string | null;
    payment_status_name?: string | null;
    pdf_name: string;
    pdf_url: string;
    is_signed: boolean;
  };
  const [addItemBillList, setAddItemBillList] = useState<AddItemBillItem[]>([]);
  const [currentAddItemBill, setCurrentAddItemBill] = useState<AddItemBillItem | null>(null);
  const [addItemBillPdfData, setAddItemBillPdfData] = useState<ArrayBuffer | null>(null);
  const [addItemBillPdfLoading, setAddItemBillPdfLoading] = useState(false);
  const [batchPrintLoading, setBatchPrintLoading] = useState(false);
  const addItemBillCanvasContainerRef = useRef<HTMLDivElement>(null);

  // 可选项目列表相关状态
  const [optionalItemList, setOptionalItemList] = useState<OutputPhysicalExamItemInfo[]>([]);
  const [optionalItemLoading, setOptionalItemLoading] = useState(false);
  const [selectedOptionalItem, setSelectedOptionalItem] = useState<number | null>(null);
  // 是否已经确认过可选项目（如果后端已有记录，视为已确认）
  const [optionalConfirmed, setOptionalConfirmed] = useState(false);
  // 是否显示"请先确认体检项目，确认后不可修改"的提示
  const [showOptionalConfirmTip, setShowOptionalConfirmTip] = useState(false);
  // 跟踪当前 examId 是否已加载过导检单和知情同意书
  const pdfsLoadedForExamIdRef = useRef<number | null>(null);
  // 使用 ref 存储最新的可选项目状态，确保 refreshTijianPdfs 能读取到最新值
  const optionalItemListRef = useRef<OutputPhysicalExamItemInfo[]>([]);
  const optionalConfirmedRef = useRef<boolean>(false);

  const busy =
    signLoading ||
    submitLoading ||
    consentLoading ||
    pdfLoading ||
    daojiandanSubmitLoading ||
    addItemBillSubmitLoading ||
    batchPrintLoading ||
    optionalItemLoading;

  useEffect(() => {
    onBusyChange?.(busy);
    return () => onBusyChange?.(false);
  }, [busy, onBusyChange]);

  const refreshTijianPdfs = async (examIdValue: number, checkOptional: boolean = true) => {
    // 如果还有可选项目未确认，不执行接口请求（使用 ref 确保读取最新值）
    if (checkOptional && optionalItemListRef.current.length > 0 && !optionalConfirmedRef.current) {
      console.log('跳过 pdf-file-get 请求：可选项目未确认', { optionalItemListLength: optionalItemListRef.current.length, optionalConfirmed: optionalConfirmedRef.current });
      return;
    }

    setConsentLoading(true);

    try {
      const res = await getTijianPdfFile({ exam_id: examIdValue });
      const list: OutputTijianPdfFileInfo[] = res.Data || [];

      // 知情同意书列表（pdf_type = 2）
      const consentItems = list.filter((item) => item.pdf_type === 2);
      const mappedConsent: OutputTongyishuFileInfo[] = consentItems.map((item) => ({
        pdf_name: item.pdf_name || '',
        pdf_url: item.sign_pdf_url || item.pdf_url || '',
        combination_code: item.combination_code ?? null,
        is_signed: item.is_sign === 1,
      }));
      setConsentList(mappedConsent);

      // 已签名的组合码，用于一键打印等逻辑
      const signedCodes =
        consentItems
          .filter((item) => item.is_sign === 1 && item.combination_code !== null && item.combination_code !== undefined)
          .map((item) => Number(item.combination_code))
          .filter((n) => Number.isFinite(n)) || [];
      setSignedCombinationCodes(signedCodes);

      // 导检单（pdf_type = 1，取第一条）
      const daojiandan = list.find((item) => item.pdf_type === 1);
      if (daojiandan) {
        const url = daojiandan.sign_pdf_url || daojiandan.pdf_url || null;
        setDaojiandanUrl(url);
        setIsDaojiandanSigned(daojiandan.is_sign === 1);
      } else {
        // 如果 getTijianPdfFile 没有返回导检单，保留之前通过 getDaojiandanPdf 获取的URL（如果存在）
        // 不设置为 null，这样未签名的导检单也能显示"查看"按钮
        setDaojiandanUrl((prev) => (prev !== null ? prev : null));
        setIsDaojiandanSigned(false);
      }

      // 加项单（pdf_type = 3）：完全由新接口提供列表和签名状态（直接使用接口返回的字段）
      const addItemFromApi = list.filter((item) => item.pdf_type === 3);
      if (addItemFromApi.length > 0) {
        const addItemList: AddItemBillItem[] = addItemFromApi.map((item) => ({
          // 这里直接使用接口返回的 pdf_sort / combination_code / is_pay / is_pay_name
          pdf_sort: item.pdf_sort ?? 0,
          combinationCode: item.combination_code != null ? String(item.combination_code) : '',
          payment_status: item.is_pay != null ? String(item.is_pay) : null,
          payment_status_name: item.is_pay_name ?? null,
          pdf_name: item.pdf_name || '加项单',
          pdf_url: item.sign_pdf_url || item.pdf_url || '',
          is_signed: item.is_sign === 1,
        }));
        setAddItemBillList(addItemList);
        const unsigned = addItemList.find((bill) => bill.is_signed !== true);
        setCurrentAddItemBill(unsigned || addItemList[0] || null);
      } else {
        setAddItemBillList([]);
        setCurrentAddItemBill(null);
      }
    } catch (err) {
      console.error('获取体检PDF列表失败', err);
    } finally {
      setConsentLoading(false);
    }
  };

  // 加载可选项目列表 & 操作记录（优先使用记录，无记录时才调用可选项目接口）
  const loadOptionalItems = async () => {
    if (!examId) return;
    setOptionalItemLoading(true);
    try {
      // 先获取操作记录
      const recordRes = await getExamOptionRecordList({ exam_id: examId });


      console.log("操作记录请求", recordRes);
      // 若任意记录 is_abandon=1，则视为"已确定"（已做过弃选/确认动作），不可再确认
      let hasConfirmedRecord = false;
      let selectedFromRecord: number | null = null;
      let itemsFromRecord: OutputPhysicalExamItemInfo[] = [];

      if (recordRes.Status === 200 && recordRes.Data && recordRes.Data.length > 0) {
        hasConfirmedRecord = recordRes.Data.some((r) => r.is_abandon === 1);

        // 从记录中构建可选项目列表（只显示 is_abandon=0 的记录）
        itemsFromRecord = recordRes.Data
          .filter((r) => r.is_abandon === 0 && r.combination_code)
          .map((r) => {
            const codeNum = Number(r.combination_code);
            const packageNum = r.package_code ? Number(r.package_code) : null;
            if (!Number.isFinite(codeNum)) return null;
            return {
              combination_code: codeNum,
              combination_name: r.combination_name || '',
              package_code: Number.isFinite(packageNum) ? packageNum : null,
            } as OutputPhysicalExamItemInfo;
          })
          .filter((item): item is OutputPhysicalExamItemInfo => item !== null);

        // 预选：优先取 is_abandon=0 的组合码（若有）
        const selectedRecord = recordRes.Data.find(
          (r) => r.is_abandon === 0 && r.combination_code
        );
        if (selectedRecord?.combination_code) {
          const codeNum = Number(selectedRecord.combination_code);
          if (Number.isFinite(codeNum)) {
            selectedFromRecord = codeNum;
          }
        }
      }

      // 如果有记录，使用记录构建的列表；否则调用可选项目接口
      if (itemsFromRecord.length > 0) {
        // 根据 combination_code 去重，保留第一个出现的项目
        const uniqueItems = itemsFromRecord.filter((item, index, self) =>
          index === self.findIndex((t) => t.combination_code === item.combination_code)
        );
        setOptionalItemList(uniqueItems);
        optionalItemListRef.current = uniqueItems;

        if (selectedFromRecord != null && uniqueItems.some((i) => i.combination_code === selectedFromRecord)) {
          setSelectedOptionalItem(selectedFromRecord);
        } else {
          setSelectedOptionalItem(null);
        }
        // 只要存在可选项目：默认未确认；但若出现 is_abandon=1 记录，则视为已确定
        setOptionalConfirmed(hasConfirmedRecord);
        optionalConfirmedRef.current = hasConfirmedRecord;
        setShowOptionalConfirmTip(false);
      } else {
        // 没有记录，调用可选项目接口
        const listRes = await getExamOptionalItemList({ physical_exam_id: examId });

        if (listRes.Status === 200 && listRes.Data?.listOptionalItem) {
          const items = listRes.Data.listOptionalItem;
          // 根据 combination_code 去重，保留第一个出现的项目
          const uniqueItems = items.filter((item, index, self) =>
            index === self.findIndex((t) => t.combination_code === item.combination_code)
          );
          setOptionalItemList(uniqueItems);
          optionalItemListRef.current = uniqueItems;

          // 无历史记录，默认不选
          setSelectedOptionalItem(null);
          // 只要存在可选项目：默认未确认
          setOptionalConfirmed(false);
          optionalConfirmedRef.current = false;
          setShowOptionalConfirmTip(false);
        } else {
          setOptionalItemList([]);
          optionalItemListRef.current = [];
          setSelectedOptionalItem(null);
          setOptionalConfirmed(true);
          optionalConfirmedRef.current = true;
          setShowOptionalConfirmTip(false);
        }
      }
    } catch (err) {
      console.error('获取可选项目/记录失败', err);
      setOptionalItemList([]);
      optionalItemListRef.current = [];
      setSelectedOptionalItem(null);
      setOptionalConfirmed(true);
      optionalConfirmedRef.current = true;
      setShowOptionalConfirmTip(false);
    } finally {
      setOptionalItemLoading(false);
    }
  };

  // 加载 PDF 的逻辑（知情同意书、导检单）
  const loadPdfs = async (currentExamId: number) => {
    // 如果已经为当前 examId 加载过，不再重复加载
    if (pdfsLoadedForExamIdRef.current === currentExamId) {
      return;
    }

    // 使用 ref 确保读取最新值：如果没有可选项目，或者有可选项目但已确认，才加载导检单和知情同意书
    console.log('检查是否应该加载 PDF，ref 值：', {
      optionalItemListLength: optionalItemListRef.current.length,
      optionalConfirmed: optionalConfirmedRef.current
    });
    const shouldLoadPdfs = optionalItemListRef.current.length === 0 || optionalConfirmedRef.current;

    if (!shouldLoadPdfs) {
      console.log('跳过所有 PDF 接口请求：可选项目未确认', {
        optionalItemListLength: optionalItemListRef.current.length,
        optionalConfirmed: optionalConfirmedRef.current
      });
      return;
    }

    pdfsLoadedForExamIdRef.current = currentExamId;

    // 初始化时加载知情同意书
    const loadTongyishu = async () => {
      try {
        const res = await getTongyishuPdf({ exam_id: currentExamId });
        if (res.Status === 200 && res.Data?.list_pdf_url) {
          const list = res.Data.list_pdf_url;
          const mappedConsent: OutputTongyishuFileInfo[] = list.map((item) => ({
            pdf_name: item.pdf_name || '',
            pdf_url: item.pdf_url || '',
            combination_code: item.combination_code ?? null,
          }));
          setConsentList(mappedConsent);
        }
      } catch (err) {
        console.error('获取知情同意书失败', err);
      }
    };

    // 初始化时加载导检单（未签名版本也可以查看）
    const loadDaojiandan = async () => {
      try {
        console.log("未签名导检单请求");
        const res = await getDaojiandanPdf({ exam_id: currentExamId });
        if (res.Status === 200 && res.Data?.pdf_url) {
          setDaojiandanUrl((prev) => prev || res.Data?.pdf_url || null);
        }
      } catch (err) {
        console.error('获取导检单失败', err);
      }
    };

    // 加载 PDF
    loadTongyishu().then(() => {
      // 调用 refreshTijianPdfs 前再次检查可选项目状态（使用 ref 确保读取最新值）
      if (optionalItemListRef.current.length === 0 || optionalConfirmedRef.current) {
        refreshTijianPdfs(currentExamId, true);
      }
    });
    loadDaojiandan();
  };

  // 初始化：先检查可选项
  useEffect(() => {
    if (!examId) {
      setConsentList([]);
      setDaojiandanUrl(null);
      setIsDaojiandanSigned(false);
      optionalItemListRef.current = [];
      optionalConfirmedRef.current = true;
      pdfsLoadedForExamIdRef.current = null;
      setOptionalItemLoading(false);
      return;
    }

    // 先设置 loading 为 true
    setOptionalItemLoading(true);
    optionalItemListRef.current = [];
    optionalConfirmedRef.current = false;
    pdfsLoadedForExamIdRef.current = null;

    // 先检查可选项，选择完毕后才请求导检单接口
    loadOptionalItems().then(() => {
      // loadOptionalItems 完成后，ref 已经更新，直接调用加载 PDF 的逻辑
      console.log('loadOptionalItems 完成，ref 已更新', {
        optionalItemListLength: optionalItemListRef.current.length,
        optionalConfirmed: optionalConfirmedRef.current
      });
      // 直接调用加载 PDF 的逻辑，不依赖第二个 useEffect
      loadPdfs(examId);
    });
  }, [examId]);

  // 监听可选项目确认状态变化，确认后才加载导检单和知情同意书
  useEffect(() => {
    if (!examId) return;

    // 仅在可选项目状态从"未确认"变为"已确认"时，加载 PDF
    if (optionalConfirmed && optionalItemList.length > 0 && pdfsLoadedForExamIdRef.current !== examId) {
      console.log('可选项目已确认，开始加载 PDF');
      loadPdfs(examId);
    }
  }, [examId, optionalConfirmed]);

  const handlePickFile = () => {
    // 有可选项目但尚未确认时，禁止拍照并提示先确认项目
    if (optionalItemList.length > 0 && !optionalConfirmed) {
      setMessage('请先确认体检项目');
      setShowOptionalConfirmTip(true);
      return;
    }
    fileInputRef.current?.click();
  };

  const convertToJpg = async (file: File): Promise<File> => {
    return new Promise((resolve, reject) => {
      const reader = new FileReader();
      reader.onload = (event) => {
        const img = new Image();
        img.onload = () => {
          const canvas = document.createElement('canvas');
          canvas.width = img.width;
          canvas.height = img.height;
          const ctx = canvas.getContext('2d');
          if (!ctx) {
            reject(new Error('无法创建画布上下文'));
            return;
          }
          ctx.drawImage(img, 0, 0);
          canvas.toBlob(
            (blob) => {
              if (!blob) {
                reject(new Error('图片转换失败'));
                return;
              }
              const jpgFile = new File([blob], 'id_card.jpg', { type: 'image/jpeg' });
              resolve(jpgFile);
            },
            'image/jpeg',
            0.92
          );
        };
        img.onerror = () => reject(new Error('图片加载失败'));
        img.src = event.target?.result as string;
      };
      reader.onerror = () => reject(new Error('文件读取失败'));
      reader.readAsDataURL(file);
    });
  };

  const handleFileChange = async (e: React.ChangeEvent<HTMLInputElement>) => {
    const file = e.target.files?.[0];
    if (!file) return;

    setMessage(null);

    try {
      const jpgFile = await convertToJpg(file);
      setIdCardFile(jpgFile);

      const reader = new FileReader();
      reader.onload = (event) => {
        setPreviewImage(event.target?.result as string);
      };
      reader.readAsDataURL(jpgFile);
    } catch (err) {
      console.error('图片转换失败', err);
      setMessage('图片处理失败，请重试');
    }

    e.target.value = '';
  };

  const handleSign = async () => {
    if (!idCardFile) {
      setMessage('请先上传身份证照片');
      return;
    }
    if (!examId) {
      setMessage('缺少体检ID');
      return;
    }

    // 如果存在可选项目但尚未确认，则不允许直接签到
    if (optionalItemList.length > 0 && !optionalConfirmed) {
      setMessage('请先确认体检项目');
      setShowOptionalConfirmTip(true);
      return;
    }

    setSignLoading(true);
    setMessage(null);
    try {
      const res = await signInMedicalExamCenter({ id_no_pic: idCardFile });
      const ok = res.Status === 200 && res.Data?.is_success === 0;
      if (ok) {
        setMessage('签到成功');
      } else {
        setMessage(res.Message || '签到失败');
      }
    } catch (err) {
      console.error(err);
      // setMessage('签到请求失败，请稍后重试');
    } finally {
      setSignLoading(false);
    }
  };

  // 确认当前选择的可选项目：移除未选择的项目
  const handleConfirmOptionalSelection = async () => {
    if (!examId) {
      setMessage('缺少体检ID');
      return;
    }
    if (optionalItemList.length === 0) {
      setOptionalConfirmed(true);
      optionalConfirmedRef.current = true;
      setShowOptionalConfirmTip(false);
      return;
    }
    if (selectedOptionalItem == null) {
      setMessage('请选择一个可选项目');
      setShowOptionalConfirmTip(true);
      return;
    }

    const unselectedCodes = optionalItemList
      .map((item) => item.combination_code)
      .filter((code): code is number => code != null && code !== selectedOptionalItem);

    // 没有未选项目需要移除，直接标记为已确认
    if (unselectedCodes.length === 0) {
      setOptionalConfirmed(true);
      optionalConfirmedRef.current = true;
      setShowOptionalConfirmTip(false);
      setMessage('可选项目已确定');
      setTimeout(() => setMessage(null), 3000);
      return;
    }

    setOptionalItemLoading(true);
    try {
      const combinationCodeIds = unselectedCodes.join(',');
      const res = await removeOptionalPackage({
        physical_exam_id: examId,
        combination_code_ids: combinationCodeIds,
      });
      if (res.Status === 200 && res.Data?.is_success === 1) {
        setOptionalConfirmed(true);
        optionalConfirmedRef.current = true;
        setShowOptionalConfirmTip(false);
        // 刷新操作记录列表（不再调用 optional-item-list 接口，避免恢复已移除的项目）
        await loadOptionalItems();
        setMessage('可选项目已确定');
        setTimeout(() => setMessage(null), 3000);
      } else {
        setMessage('可选项目确定失败：' + (res.Message || '未知错误'));
        setTimeout(() => setMessage(null), 3000);
      }
    } catch (err) {
      console.error('可选项目确定失败', err);
      setMessage('可选项目确定失败，请稍后重试');
      setTimeout(() => setMessage(null), 3000);
    } finally {
      setOptionalItemLoading(false);
    }
  };

  const handleSubmitSign = async () => {
    // 有可选项目但尚未确认时，禁止签名并提示先确认项目
    if (optionalItemList.length > 0 && !optionalConfirmed) {
      setSubmitMessage('请先确认体检项目');
      setShowOptionalConfirmTip(true);
      return;
    }

    if (!examId || !previewPdf?.combination_code) {
      setSubmitMessage('缺少必要信息，无法提交签名');
      return;
    }

    const dataUrl = signaturePadRef.current?.toDataURL('image/png');
    if (!dataUrl) {
      setSubmitMessage('请先完成签名');
      return;
    }

    setSubmitLoading(true);
    setSubmitMessage(null);
    try {
      const blob = await fetch(dataUrl).then((r) => r.blob());

      const res = await submitTongyishuSign({
        exam_id: examId,
        combination_code: previewPdf.combination_code,
        sign_file: blob,
      });

      if (res.Status === 200) {
        setSubmitMessage('签名提交成功');
        // 更新本地已签名组合码（立刻刷新按钮状态）
        setSignedCombinationCodes((prev) => {
          const code = Number(previewPdf.combination_code);
          if (!Number.isFinite(code)) return prev || [];
          return Array.from(new Set([...(prev || []), code]));
        });
        setTimeout(() => {
          setShowSignature(false);
          setPreviewPdf(null);
          setSubmitMessage(null);
          signaturePadRef.current?.clear();

          // 更新签名状态（刷新统一 PDF 列表）
          // 如果还有可选项目未确认，不执行接口请求（使用 ref 确保读取最新值）
          if (examId && (optionalItemListRef.current.length === 0 || optionalConfirmedRef.current)) {
            refreshTijianPdfs(examId, true);
          } else if (examId) {
            console.log('跳过 pdf-file-get 请求：可选项目未确认（签名成功后）', {
              optionalItemListLength: optionalItemListRef.current.length,
              optionalConfirmed: optionalConfirmedRef.current
            });
          }
        }, 500);
      } else {
        setSubmitMessage(res.Message || '签名提交失败');
      }
    } catch (err) {
      console.error('提交签名失败', err);
      setSubmitMessage('签名提交失败，请稍后重试');
    } finally {
      setSubmitLoading(false);
    }
  };

  // 加载 PDF 数据
  useEffect(() => {
    if (!previewPdf?.pdf_url) {
      setPdfData(null);
      setPdfBlobUrl(null);
      setPdfReady(false);
      return;
    }

    let objectUrl: string | null = null;
    setPdfReady(false);
    setPdfLoading(true);
    setPdfData(null);

    fetch(previewPdf.pdf_url)
      .then((resp) => {
        if (!resp.ok) throw new Error('获取PDF文件失败');
        return resp.blob();
      })
      .then((blob) => {
        objectUrl = URL.createObjectURL(blob);
        setPdfBlobUrl(objectUrl);
        return blob.arrayBuffer();
      })
      .then((arrayBuffer) => {
        setPdfData(arrayBuffer);
        setPdfLoading(false);
      })
      .catch((err) => {
        console.error('PDF 拉取失败', err);
        setPdfLoading(false);
      });

    return () => {
      if (objectUrl) {
        URL.revokeObjectURL(objectUrl);
      }
    };
  }, [previewPdf?.pdf_url]);

  // 渲染 PDF
  useEffect(() => {
    if (!pdfData || !canvasContainerRef.current) return;

    setPdfReady(false);

    const renderAllPages = async () => {
      try {
        const pdf = await pdfjsLib.getDocument({ data: pdfData }).promise;

        if (!canvasContainerRef.current) return;

        // 清空容器
        canvasContainerRef.current.innerHTML = '';

        const scale = 3;

        for (let pageNum = 1; pageNum <= pdf.numPages; pageNum++) {
          const page = await pdf.getPage(pageNum);
          const viewport = page.getViewport({ scale });

          const canvas = document.createElement('canvas');
          const context = canvas.getContext('2d');

          if (!context) continue;

          canvas.height = viewport.height;
          canvas.width = viewport.width;
          canvas.style.display = 'block';
          canvas.style.marginBottom = '10px';
          canvas.style.maxWidth = '100%';
          canvas.style.height = 'auto';
          canvas.className = 'mx-auto border rounded-lg shadow-sm';

          canvasContainerRef.current.appendChild(canvas);

          const renderContext = {
            canvasContext: context,
            viewport: viewport,
          } as any;

          await page.render(renderContext).promise;
        }

        setPdfReady(true);
      } catch (err) {
        console.error('PDF 渲染失败', err);
        setPdfLoading(false);
      }
    };

    renderAllPages();
  }, [pdfData]);

  // 加载导检单 PDF 数据
  useEffect(() => {
    if (!showDaojiandanPreview || !daojiandanUrl) {
      setDaojiandanPdfData(null);
      return;
    }

    let objectUrl: string | null = null;
    setDaojiandanPdfLoading(true);
    setDaojiandanPdfData(null);

    fetch(daojiandanUrl)
      .then((resp) => {
        if (!resp.ok) throw new Error('获取PDF文件失败');
        return resp.blob();
      })
      .then((blob) => {
        objectUrl = URL.createObjectURL(blob);
        return blob.arrayBuffer();
      })
      .then((arrayBuffer) => {
        setDaojiandanPdfData(arrayBuffer);
        setDaojiandanPdfLoading(false);
      })
      .catch((err) => {
        console.error('导检单PDF 拉取失败', err);
      });

    return () => {
      if (objectUrl) {
        URL.revokeObjectURL(objectUrl);
      }
    };
  }, [showDaojiandanPreview, daojiandanUrl]);

  // 渲染导检单 PDF
  useEffect(() => {
    if (!daojiandanPdfData || !daojiandanCanvasContainerRef.current) return;

    const renderAllPages = async () => {
      try {
        const pdf = await pdfjsLib.getDocument({ data: daojiandanPdfData }).promise;

        if (!daojiandanCanvasContainerRef.current) return;

        // 清空容器
        daojiandanCanvasContainerRef.current.innerHTML = '';

        const scale = 3.0;

        for (let pageNum = 1; pageNum <= pdf.numPages; pageNum++) {
          const page = await pdf.getPage(pageNum);
          const viewport = page.getViewport({ scale });

          const canvas = document.createElement('canvas');
          const context = canvas.getContext('2d');

          if (!context) continue;

          canvas.height = viewport.height;
          canvas.width = viewport.width;
          canvas.style.display = 'block';
          canvas.style.marginBottom = '10px';
          canvas.style.maxWidth = '100%';
          canvas.style.height = 'auto';
          canvas.className = 'mx-auto border rounded-lg shadow-sm';

          daojiandanCanvasContainerRef.current.appendChild(canvas);

          const renderContext = {
            canvasContext: context,
            viewport: viewport,
          } as any;

          await page.render(renderContext).promise;
        }

      } catch (err) {
        console.error('导检单PDF 渲染失败', err);
      }
    };

    renderAllPages();
  }, [daojiandanPdfData]);

  // 加载加项单 PDF 数据（当前选中的加项单）
  useEffect(() => {
    if (!showAddItemBillPreview || !currentAddItemBill?.pdf_url) {
      setAddItemBillPdfData(null);
      setAddItemBillPdfLoading(false);
      return;
    }

    let objectUrl: string | null = null;
    setAddItemBillPdfLoading(true);
    setAddItemBillPdfData(null);

    fetch(currentAddItemBill.pdf_url)
      .then((resp) => {
        if (!resp.ok) throw new Error('获取PDF文件失败');
        return resp.blob();
      })
      .then((blob) => {
        objectUrl = URL.createObjectURL(blob);
        return blob.arrayBuffer();
      })
      .then((arrayBuffer) => {
        setAddItemBillPdfData(arrayBuffer);
        setAddItemBillPdfLoading(false);
      })
      .catch((err) => {
        console.error('加项单PDF 拉取失败', err);
        setAddItemBillPdfLoading(false);
      });

    return () => {
      if (objectUrl) {
        URL.revokeObjectURL(objectUrl);
      }
    };
  }, [showAddItemBillPreview, currentAddItemBill?.pdf_url]);

  // 导检单预览：使用 pdfjs 渲染到 canvas
  useEffect(() => {
    if (!showDaojiandanPreview || !daojiandanUrl || !daojiandanCanvasContainerRef.current) return;

    const container = daojiandanCanvasContainerRef.current;
    let cancelled = false;

    const renderDaojiandan = async () => {
      try {
        container.innerHTML = '';

        const resp = await fetch(daojiandanUrl);
        if (!resp.ok) throw new Error('获取PDF文件失败');
        const blob = await resp.blob();
        const arrayBuffer = await blob.arrayBuffer();

        const pdf = await pdfjsLib.getDocument({ data: arrayBuffer }).promise;
        const scale = 3.0;

        for (let pageNum = 1; pageNum <= pdf.numPages; pageNum++) {
          if (cancelled) return;

          const page = await pdf.getPage(pageNum);
          const viewport = page.getViewport({ scale });

          const canvas = document.createElement('canvas');
          const context = canvas.getContext('2d');
          if (!context) continue;

          canvas.height = viewport.height;
          canvas.width = viewport.width;
          canvas.style.display = 'block';
          canvas.style.marginBottom = '10px';
          canvas.style.maxWidth = '100%';
          canvas.style.height = 'auto';
          canvas.className = 'mx-auto border rounded-lg shadow-sm';

          container.appendChild(canvas);

          const renderContext = {
            canvasContext: context,
            viewport: viewport,
          } as any;

          await page.render(renderContext).promise;
        }
      } catch (err) {
        console.error('导检单PDF 渲染失败', err);
      } finally {
        if (!cancelled) {
        }
      }
    };

    renderDaojiandan();

    return () => {
      cancelled = true;
      container.innerHTML = '';
    };
  }, [showDaojiandanPreview, daojiandanUrl]);

  // 加项单预览：使用 pdfjs 渲染到 canvas（依赖加载好的 addItemBillPdfData）
  useEffect(() => {
    if (!showAddItemBillPreview || !addItemBillPdfData || !addItemBillCanvasContainerRef.current) return;

    const container = addItemBillCanvasContainerRef.current;
    container.innerHTML = '';

    const renderAddItemBill = async () => {
      try {
        const pdf = await pdfjsLib.getDocument({ data: addItemBillPdfData }).promise;
        const scale = 3.0;

        for (let pageNum = 1; pageNum <= pdf.numPages; pageNum++) {
          const page = await pdf.getPage(pageNum);
          const viewport = page.getViewport({ scale });

          const canvas = document.createElement('canvas');
          const context = canvas.getContext('2d');
          if (!context) continue;

          canvas.height = viewport.height;
          canvas.width = viewport.width;
          canvas.style.display = 'block';
          canvas.style.marginBottom = '10px';
          canvas.style.maxWidth = '100%';
          canvas.style.height = 'auto';
          canvas.className = 'mx-auto border rounded-lg shadow-sm';

          container.appendChild(canvas);

          const renderContext = {
            canvasContext: context,
            viewport: viewport,
          } as any;

          await page.render(renderContext).promise;
        }
      } catch (err) {
        console.error('加项单PDF 渲染失败', err);
      }
    };

    renderAddItemBill();

    return () => {
      container.innerHTML = '';
    };
  }, [showAddItemBillPreview, addItemBillPdfData]);

  const handlePrint = () => {
    if (!pdfBlobUrl || !pdfReady || !canvasContainerRef.current || !previewPdf) return;

    // 创建打印窗口
    const printWindow = window.open('', '_blank');
    if (!printWindow) return;

    // 获取所有的 canvas
    const canvases = canvasContainerRef.current.querySelectorAll('canvas');

    // 构建打印页面
    printWindow.document.write(`
      <!DOCTYPE html>
      <html>
        <head>
          <title>${previewPdf.pdf_name || '知情同意书打印'}</title>
          <style>
            @media print {
              body {
                margin: 0;
                padding: 0;
              }
              .print-button, .close-button {
                display: none;
              }
              img {
                max-width: 100%;
                page-break-after: always;
                page-break-inside: avoid;
              }
              img:last-child {
                page-break-after: auto;
              }
            }
            body {
              margin: 0;
              padding: 0;
            }
            .print-button, .close-button {
              padding: 4px 12px;
              border: none;
              border-radius: 4px;
              cursor: pointer;
              font-size: 14px;
              transition: background-color 0.2s;
            }
            .print-button {
              background-color: #2563eb;
              color: white;
            }
            .print-button:hover {
              background-color: #1d4ed8;
            }
            .close-button {
              background-color: transparent;
              color: #374151;
            }
            .close-button:hover {
              background-color: #e5e7eb;
            }
            .button-container {
              position: fixed;
              top: 20px;
              right: 20px;
              display: flex;
              align-items: center;
              gap: 8px;
              z-index: 1000;
            }
            img {
              display: block;
              width: 100%;
              height: auto;
            }
          </style>
        </head>
        <body>
          <div class="button-container">
            <button class="close-button" onclick="window.close()">关闭</button>
            <button class="print-button" onclick="window.print(); setTimeout(() => window.close(), 1000);">打印</button>
          </div>
    `);

    // 将每个 canvas 转换为图片并添加到打印窗口
    canvases.forEach((canvas) => {
      const imgData = (canvas as HTMLCanvasElement).toDataURL('image/png');
      printWindow.document.write(`<img src="${imgData}" />`);
    });

    printWindow.document.write(`
        </body>
      </html>
    `);

    printWindow.document.close();

    // 等待图片加载完成后执行打印
    printWindow.onload = () => {
      printWindow.focus();
      setTimeout(() => {
        printWindow.print();
      }, 1000);
    };
  };

  const handleDirectPrint = async (pdfItem: OutputTongyishuFileInfo) => {
    if (!pdfItem.pdf_url) return;

    try {
      // 加载PDF
      const response = await fetch(pdfItem.pdf_url);
      if (!response.ok) throw new Error('获取PDF文件失败');
      const blob = await response.blob();
      const arrayBuffer = await blob.arrayBuffer();

      // 渲染PDF到临时canvas
      const pdf = await pdfjsLib.getDocument({ data: arrayBuffer }).promise;
      const scale = 1.0;
      const canvasImages: string[] = [];

      for (let pageNum = 1; pageNum <= pdf.numPages; pageNum++) {
        const page = await pdf.getPage(pageNum);
        const viewport = page.getViewport({ scale });

        const canvas = document.createElement('canvas');
        const context = canvas.getContext('2d');
        if (!context) continue;

        canvas.height = viewport.height;
        canvas.width = viewport.width;

        const renderContext = {
          canvasContext: context,
          viewport: viewport,
        } as any;

        await page.render(renderContext).promise;
        canvasImages.push(canvas.toDataURL('image/png'));
      }

      // 创建打印窗口
      const printWindow = window.open('', '_blank');
      if (!printWindow) return;

      printWindow.document.write(`
        <!DOCTYPE html>
        <html>
          <head>
            <title>${pdfItem.pdf_name || '知情同意书打印'}</title>
            <style>
              @media print {
                body {
                  margin: 0;
                  padding: 0;
                }
                .print-button, .close-button {
                  display: none;
                }
                img {
                  max-width: 100%;
                  page-break-after: always;
                  page-break-inside: avoid;
                }
                img:last-child {
                  page-break-after: auto;
                }
              }
              body {
                margin: 0;
                padding: 0;
              }
              .print-button, .close-button {
                padding: 4px 12px;
                border: none;
                border-radius: 4px;
                cursor: pointer;
                font-size: 14px;
                transition: background-color 0.2s;
              }
              .print-button {
                background-color: #2563eb;
                color: white;
              }
              .print-button:hover {
                background-color: #1d4ed8;
              }
              .close-button {
                background-color: transparent;
                color: #374151;
              }
              .close-button:hover {
                background-color: #e5e7eb;
              }
              .button-container {
                position: fixed;
                top: 20px;
                right: 20px;
                display: flex;
                align-items: center;
                gap: 8px;
                z-index: 1000;
              }
              img {
                display: block;
                width: 100%;
                height: auto;
              }
            </style>
          </head>
          <body>
            <div class="button-container">
              <button class="close-button" onclick="window.close()">关闭</button>
              <button class="print-button" onclick="window.print(); setTimeout(() => window.close(), 1000);">打印</button>
            </div>
      `);

      canvasImages.forEach((imgData) => {
        printWindow.document.write(`<img src="${imgData}" />`);
      });

      printWindow.document.write(`
          </body>
        </html>
      `);

      printWindow.document.close();

      // 等待图片加载完成后执行打印
      printWindow.onload = () => {
        printWindow.focus();
        setTimeout(() => {
          printWindow.print();
        }, 1000);
      };
    } catch (err) {
      console.error('打印失败', err);
      alert('打印失败，请稍后重试');
    }
  };

  // 导检单签名提交
  const handleSubmitDaojiandanSign = async () => {
    // 有可选项目但尚未确认时，禁止签名并提示先确认项目
    if (optionalItemList.length > 0 && !optionalConfirmed) {
      setDaojiandanSubmitMessage('请先确认体检项目');
      setShowOptionalConfirmTip(true);
      return;
    }

    if (!examId) {
      setDaojiandanSubmitMessage('缺少必要信息，无法提交签名');
      return;
    }

    const dataUrl = daojiandanSignaturePadRef.current?.toDataURL('image/png');
    if (!dataUrl) {
      setDaojiandanSubmitMessage('请先完成签名');
      return;
    }

    setDaojiandanSubmitLoading(true);
    setDaojiandanSubmitMessage(null);
    try {
      const blob = await fetch(dataUrl).then((r) => r.blob());

      const res = await submitDaojiandanSign({
        exam_id: examId,
        sign_file: blob,
      });

      if (res.Status === 200 && res.Data?.pdf_url) {
        setDaojiandanSubmitMessage('签名提交成功');
        const pdfUrlValue = res.Data.pdf_url;
        setDaojiandanUrl(pdfUrlValue);
        setIsDaojiandanSigned(true); // 签名成功后标记为已签名

        // 更新导检单打印状态
        try {
          await editDaojiandanPrintStatus({ exam_id: examId });
        } catch (err) {
          console.error('更新导检单打印状态失败', err);
        }

        setTimeout(() => {
          setShowDaojiandanSignature(false);
          setDaojiandanSubmitMessage(null);
          daojiandanSignaturePadRef.current?.clear();
          setShowDaojiandanPreview(true);
        }, 500);
      } else {
        setDaojiandanSubmitMessage(res.Message || '签名提交失败');
      }
    } catch (err) {
      console.error('提交签名失败', err);
      setDaojiandanSubmitMessage('签名提交失败，请稍后重试');
    } finally {
      setDaojiandanSubmitLoading(false);
    }
  };

  // 加项单签名提交（针对当前选中的加项单）
  const handleSubmitAddItemBillSign = async () => {
    if (!examId) {
      setAddItemBillSubmitMessage('缺少必要信息，无法提交签名');
      return;
    }

    if (!currentAddItemBill) {
      setAddItemBillSubmitMessage('没有可签名的加项单');
      return;
    }

    const dataUrl = addItemBillSignaturePadRef.current?.toDataURL('image/png');
    if (!dataUrl) {
      setAddItemBillSubmitMessage('请先完成签名');
      return;
    }

    // 记录当前正在签名的加项单，用于签名成功后重新选中它
    const justSignedCombinationCode = currentAddItemBill.combinationCode;

    setAddItemBillSubmitLoading(true);
    setAddItemBillSubmitMessage(null);
    try {
      const blob = await fetch(dataUrl).then((r) => r.blob());

      const res = await submitAddItemBillSign({
        exam_id: examId,
        pdf_sort: currentAddItemBill.pdf_sort,
        combinationCode: currentAddItemBill.combinationCode,
        sign_file: blob,
      });

      if (res.Status === 200) {
        setAddItemBillSubmitMessage('签名提交成功');

        // 签名成功后刷新统一 PDF 列表，获取最新的加项单签名状态和地址
        // 如果还有可选项目未确认，不执行接口请求（使用 ref 确保读取最新值）
        if (examId && (optionalItemListRef.current.length === 0 || optionalConfirmedRef.current)) {
          try {
            const refreshRes = await getTijianPdfFile({ exam_id: examId as number });
            const list: OutputTijianPdfFileInfo[] = refreshRes.Data || [];
            const addItemFromApi = list.filter((item) => item.pdf_type === 3);
            if (addItemFromApi.length > 0) {
              const addItemList: AddItemBillItem[] = addItemFromApi.map((item) => ({
                // 同样直接使用接口返回的字段，保持与 refreshTijianPdfs 一致
                pdf_sort: item.pdf_sort ?? 0,
                combinationCode: item.combination_code != null ? String(item.combination_code) : '',
                payment_status: item.is_pay != null ? String(item.is_pay) : null,
                payment_status_name: item.is_pay_name ?? null,
                pdf_name: item.pdf_name || '加项单',
                pdf_url: item.sign_pdf_url || item.pdf_url || '',
                is_signed: item.is_sign === 1,
              }));
              setAddItemBillList(addItemList);

              // 优先选中刚刚签名的那一张，其次选未签名的，其次第一张
              const justSigned = addItemList.find(
                (bill) => bill.combinationCode === justSignedCombinationCode
              );
              const unsigned = addItemList.find((bill) => bill.is_signed !== true);
              setCurrentAddItemBill(justSigned || unsigned || addItemList[0] || null);
            } else {
              setAddItemBillList([]);
              setCurrentAddItemBill(null);
            }
          } catch (e) {
            console.error('刷新加项单列表失败', e);
          }
        }

        setTimeout(() => {
          setShowAddItemBillSignature(false);
          setAddItemBillSubmitMessage(null);
          addItemBillSignaturePadRef.current?.clear();
          setShowAddItemBillPreview(true);
        }, 500);
      } else {
        setAddItemBillSubmitMessage(res.Message || '签名提交失败');
      }
    } catch (err) {
      console.error('提交签名失败', err);
      setAddItemBillSubmitMessage('签名提交失败，请稍后重试');
    } finally {
      setAddItemBillSubmitLoading(false);
    }
  };

  // 加项单直接打印
  const handleAddItemBillDirectPrint = async (target: AddItemBillItem | null) => {
    if (!target?.pdf_url) return;

    try {
      const response = await fetch(target.pdf_url);
      if (!response.ok) throw new Error('获取PDF文件失败');
      const blob = await response.blob();
      const arrayBuffer = await blob.arrayBuffer();

      const pdf = await pdfjsLib.getDocument({ data: arrayBuffer }).promise;
      const scale = 3.0;
      const canvasImages: string[] = [];

      for (let pageNum = 1; pageNum <= pdf.numPages; pageNum++) {
        const page = await pdf.getPage(pageNum);
        const viewport = page.getViewport({ scale });

        const canvas = document.createElement('canvas');
        const context = canvas.getContext('2d');
        if (!context) continue;

        canvas.height = viewport.height;
        canvas.width = viewport.width;

        const renderContext = {
          canvasContext: context,
          viewport: viewport,
        } as any;

        await page.render(renderContext).promise;
        canvasImages.push(canvas.toDataURL('image/png'));
      }

      const printWindow = window.open('', '_blank');
      if (!printWindow) return;

      printWindow.document.write(`
        <!DOCTYPE html>
        <html>
          <head>
            <title>${target.pdf_name || '加项单打印'}</title>
            <style>
              @media print {
                body {
                  margin: 0;
                  padding: 0;
                }
                .print-button, .close-button {
                  display: none;
                }
                img {
                  max-width: 100%;
                  page-break-after: always;
                  page-break-inside: avoid;
                }
                img:last-child {
                  page-break-after: auto;
                }
              }
              body {
                margin: 0;
                padding: 0;
              }
              .print-button, .close-button {
                padding: 4px 12px;
                border: none;
                border-radius: 4px;
                cursor: pointer;
                font-size: 14px;
                transition: background-color 0.2s;
              }
              .print-button {
                background-color: #2563eb;
                color: white;
              }
              .print-button:hover {
                background-color: #1d4ed8;
              }
              .close-button {
                background-color: transparent;
                color: #374151;
              }
              .close-button:hover {
                background-color: #e5e7eb;
              }
              .button-container {
                position: fixed;
                top: 20px;
                right: 20px;
                display: flex;
                align-items: center;
                gap: 8px;
                z-index: 1000;
              }
              img {
                display: block;
                width: 100%;
                height: auto;
              }
            </style>
          </head>
          <body>
            <div class="button-container">
              <button class="close-button" onclick="window.close()">关闭</button>
              <button class="print-button" onclick="window.print(); setTimeout(() => window.close(), 1000);">打印</button>
            </div>
      `);

      canvasImages.forEach((imgData) => {
        printWindow.document.write(`<img src="${imgData}" />`);
      });

      printWindow.document.write(`
          </body>
        </html>
      `);

      printWindow.document.close();

      printWindow.onload = () => {
        printWindow.focus();
        setTimeout(() => {
          printWindow.print();
        }, 1000);
      };
    } catch (err) {
      console.error('打印失败', err);
      alert('打印失败，请稍后重试');
    }
  };

  // 导检单直接打印
  const handleDaojiandanDirectPrint = async () => {
    if (!daojiandanUrl) return;

    try {
      const response = await fetch(daojiandanUrl);
      if (!response.ok) throw new Error('获取PDF文件失败');
      const blob = await response.blob();
      const arrayBuffer = await blob.arrayBuffer();

      const pdf = await pdfjsLib.getDocument({ data: arrayBuffer }).promise;
      const scale = 3.0;
      const canvasImages: string[] = [];

      for (let pageNum = 1; pageNum <= pdf.numPages; pageNum++) {
        const page = await pdf.getPage(pageNum);
        const viewport = page.getViewport({ scale });

        const canvas = document.createElement('canvas');
        const context = canvas.getContext('2d');
        if (!context) continue;

        canvas.height = viewport.height;
        canvas.width = viewport.width;

        const renderContext = {
          canvasContext: context,
          viewport: viewport,
        } as any;

        await page.render(renderContext).promise;
        canvasImages.push(canvas.toDataURL('image/png'));
      }

      const printWindow = window.open('', '_blank');
      if (!printWindow) return;

      printWindow.document.write(`
        <!DOCTYPE html>
        <html>
          <head>
            <title>导检单打印</title>
            <style>
              @media print {
                body {
                  margin: 0;
                  padding: 0;
                }
                .print-button, .close-button {
                  display: none;
                }
                img {
                  max-width: 100%;
                  page-break-after: always;
                  page-break-inside: avoid;
                }
                img:last-child {
                  page-break-after: auto;
                }
              }
              body {
                margin: 0;
                padding: 0;
              }
              .print-button, .close-button {
                padding: 4px 12px;
                border: none;
                border-radius: 4px;
                cursor: pointer;
                font-size: 14px;
                transition: background-color 0.2s;
              }
              .print-button {
                background-color: #2563eb;
                color: white;
              }
              .print-button:hover {
                background-color: #1d4ed8;
              }
              .close-button {
                background-color: transparent;
                color: #374151;
              }
              .close-button:hover {
                background-color: #e5e7eb;
              }
              .button-container {
                position: fixed;
                top: 20px;
                right: 20px;
                display: flex;
                align-items: center;
                gap: 8px;
                z-index: 1000;
              }
              img {
                display: block;
                width: 100%;
                height: auto;
              }
            </style>
          </head>
          <body>
            <div class="button-container">
              <button class="close-button" onclick="window.close()">关闭</button>
              <button class="print-button" onclick="window.print(); setTimeout(() => window.close(), 1000);">打印</button>
            </div>
      `);

      canvasImages.forEach((imgData) => {
        printWindow.document.write(`<img src="${imgData}" />`);
      });

      printWindow.document.write(`
          </body>
        </html>
      `);

      // 在关闭文档前设置 onload 事件
      printWindow.onload = () => {
        printWindow.focus();
        setTimeout(() => {
          printWindow.print();
        }, 1000);
      };

      printWindow.document.close();

      // 更新导检单打印状态（不阻塞打印流程）
      if (examId) {
        editDaojiandanPrintStatus({ exam_id: examId }).catch((err) => {
          console.error('更新导检单打印状态失败', err);
        });
      }
    } catch (err) {
      console.error('打印失败', err);
      alert('打印失败，请稍后重试');
    }
  };

  // 检查所有文档是否都已签名
  const checkAllSigned = () => {
    // 检查所有知情同意书是否都已签名
    const allConsentsSigned = consentList.every((item) => {
      if (item.combination_code === undefined || item.combination_code === null) return true;
      return signedCombinationCodes.includes(Number(item.combination_code));
    });

    // 检查导检单是否已签名（只有 localStorage 中的或签名后的才是已签名的）
    const daojiandanSigned = isDaojiandanSigned;

    return allConsentsSigned && consentList.length > 0 && daojiandanSigned;
  };

  // 一键打印所有文档
  const handleBatchPrint = async () => {
    if (busy || batchPrintLoading) return;

    setBatchPrintLoading(true);
    try {
      const allImages: string[] = [];
      const scale = 3.0;

      // 处理所有已签名的知情同意书
      for (const item of consentList) {
        if (item.combination_code === undefined || item.combination_code === null) continue;
        if (!signedCombinationCodes.includes(Number(item.combination_code))) continue;
        const targetUrl = item.pdf_url;
        if (!targetUrl) continue;

        try {
          const response = await fetch(targetUrl);
          if (!response.ok) continue;
          const blob = await response.blob();
          const arrayBuffer = await blob.arrayBuffer();

          const pdf = await pdfjsLib.getDocument({ data: arrayBuffer }).promise;

          for (let pageNum = 1; pageNum <= pdf.numPages; pageNum++) {
            const page = await pdf.getPage(pageNum);
            const viewport = page.getViewport({ scale });

            const canvas = document.createElement('canvas');
            const context = canvas.getContext('2d');
            if (!context) continue;

            canvas.height = viewport.height;
            canvas.width = viewport.width;

            const renderContext = {
              canvasContext: context,
              viewport: viewport,
            } as any;

            await page.render(renderContext).promise;
            allImages.push(canvas.toDataURL('image/png'));
          }
        } catch (err) {
          console.error(`处理知情同意书 ${item.pdf_name} 失败`, err);
        }
      }

      // 处理导检单
      if (daojiandanUrl) {
        try {
          const response = await fetch(daojiandanUrl);
          if (response.ok) {
            const blob = await response.blob();
            const arrayBuffer = await blob.arrayBuffer();

            const pdf = await pdfjsLib.getDocument({ data: arrayBuffer }).promise;

            for (let pageNum = 1; pageNum <= pdf.numPages; pageNum++) {
              const page = await pdf.getPage(pageNum);
              const viewport = page.getViewport({ scale });

              const canvas = document.createElement('canvas');
              const context = canvas.getContext('2d');
              if (!context) continue;

              canvas.height = viewport.height;
              canvas.width = viewport.width;

              const renderContext = {
                canvasContext: context,
                viewport: viewport,
              } as any;

              await page.render(renderContext).promise;
              allImages.push(canvas.toDataURL('image/png'));
            }
          }
        } catch (err) {
          console.error('处理导检单失败', err);
        }
      }

      // 处理加项单（如果有且已签名）
      if (addItemBillList.length > 0) {
        try {
          for (const bill of addItemBillList) {
            if (!bill.pdf_url || bill.is_signed !== true) continue;
            const response = await fetch(bill.pdf_url);
            if (response.ok) {
              const blob = await response.blob();
              const arrayBuffer = await blob.arrayBuffer();

              const pdf = await pdfjsLib.getDocument({ data: arrayBuffer }).promise;

              for (let pageNum = 1; pageNum <= pdf.numPages; pageNum++) {
                const page = await pdf.getPage(pageNum);
                const viewport = page.getViewport({ scale });

                const canvas = document.createElement('canvas');
                const context = canvas.getContext('2d');
                if (!context) continue;

                canvas.height = viewport.height;
                canvas.width = viewport.width;

                const renderContext = {
                  canvasContext: context,
                  viewport: viewport,
                } as any;

                await page.render(renderContext).promise;
                allImages.push(canvas.toDataURL('image/png'));
              }
            }
          }
        } catch (err) {
          console.error('处理加项单失败', err);
        }
      }

      if (allImages.length === 0) {
        alert('没有可打印的内容');
        return;
      }

      // 创建打印窗口
      const printWindow = window.open('', '_blank');
      if (!printWindow) {
        alert('无法打开打印窗口，请检查浏览器弹窗设置');
        return;
      }

      printWindow.document.write(`
        <!DOCTYPE html>
        <html>
          <head>
            <title>一键打印</title>
            <style>
              @media print {
                body {
                  margin: 0;
                  padding: 0;
                }
                .print-button, .close-button {
                  display: none;
                }
                img {
                  max-width: 100%;
                  page-break-after: always;
                  page-break-inside: avoid;
                }
                img:last-child {
                  page-break-after: auto;
                }
              }
              body {
                margin: 0;
                padding: 0;
              }
              .print-button, .close-button {
                padding: 4px 12px;
                border: none;
                border-radius: 4px;
                cursor: pointer;
                font-size: 14px;
                transition: background-color 0.2s;
              }
              .print-button {
                background-color: #2563eb;
                color: white;
              }
              .print-button:hover {
                background-color: #1d4ed8;
              }
              .close-button {
                background-color: transparent;
                color: #374151;
              }
              .close-button:hover {
                background-color: #e5e7eb;
              }
              .button-container {
                position: fixed;
                top: 20px;
                right: 20px;
                display: flex;
                align-items: center;
                gap: 8px;
                z-index: 1000;
              }
              img {
                display: block;
                width: 100%;
                height: auto;
              }
            </style>
          </head>
          <body>
            <div class="button-container">
              <button class="close-button" onclick="window.close()">关闭</button>
              <button class="print-button" onclick="window.print(); setTimeout(() => window.close(), 1000);">打印</button>
            </div>
      `);

      allImages.forEach((imgData) => {
        printWindow.document.write(`<img src="${imgData}" />`);
      });

      printWindow.document.write(`
          </body>
        </html>
      `);

      printWindow.document.close();

      // 如果包含导检单，更新导检单打印状态
      if (examId && daojiandanUrl) {
        try {
          await editDaojiandanPrintStatus({ exam_id: examId });
        } catch (err) {
          console.error('更新导检单打印状态失败', err);
          // 不阻塞打印流程，仅记录错误
        }
      }

      // 等待图片加载完成后自动弹出打印窗口
      printWindow.onload = () => {
        printWindow.focus();
        setTimeout(() => {
          printWindow.print();
        }, 1000);
      };
    } catch (err) {
      console.error('一键打印失败', err);
      alert('一键打印失败，请稍后重试');
    } finally {
      setBatchPrintLoading(false);
    }
  };


  return (
    <div className='grid grid-cols-2 gap-4 text-sm'>
      <div className='p-4 rounded-2xl border bg-gray-50/60 flex flex-col gap-3'>
        <div className='font-medium'>身份证拍照与签到</div>
        <div className='text-xs text-gray-500'>拍照身份证后点击签到按钮完成签到。</div>
        <div className='flex items-center gap-3'>
          <Button className='py-1.5 px-3' onClick={handlePickFile} disabled={busy}>
            {idCardFile ? '重新拍照' : '拍照'}
          </Button>
          <input
            ref={fileInputRef}
            type='file'
            accept='image/*'
            capture='environment'
            className='hidden'
            onChange={handleFileChange}
          />
          {previewImage && (
            <div
              className='w-16 h-16 rounded-lg border-2 border-gray-300 overflow-hidden cursor-pointer hover:border-blue-500 transition-colors'
              onClick={() => setShowImagePreview(true)}
            >
              <img src={previewImage} alt='身份证预览' className='w-full h-full object-cover' />
            </div>
          )}
          <Button
            className='py-1.5 px-4 flex-1'
            onClick={handleSign}
            disabled={busy || !idCardFile || (optionalItemList.length > 0 && !optionalConfirmed)}
          >
            {signLoading ? '签到中...' : '签到'}
          </Button>
        </div>
        {message && (
          <div className={`text-xs ${message.includes('成功') ? 'text-green-600' : 'text-amber-600'}`}>{message}</div>
        )}
        {/* 可选项目列表 */}
        {optionalItemLoading ? (
          <div className='text-xs text-gray-500'>加载可选项目...</div>
        ) : optionalItemList.length > 0 ? (
          <div className='mt-2 space-y-2'>
            <div className='text-xs font-medium text-gray-700'>
              可选项目（必选其一）{optionalConfirmed ? '（已确定）' : ''}
            </div>
            <div className='max-h-32 overflow-y-auto custom-scroll space-y-1'>
              {optionalItemList.map((item) => {
                const combinationCode = item.combination_code;
                const isSelected =
                  combinationCode != null && combinationCode === selectedOptionalItem;
                return (
                  <label
                    key={combinationCode ?? `item-${item.package_code}`}
                    className='flex items-center gap-2 cursor-pointer text-xs'
                  >
                    <input
                      type='radio'
                      name='optional-item'
                      checked={isSelected}
                      onChange={() => {
                        if (combinationCode != null && !optionalConfirmed) {
                          setSelectedOptionalItem(combinationCode);
                        }
                      }}
                      disabled={busy || optionalConfirmed}
                      className='w-3 h-3'
                    />
                    <span className={isSelected ? 'text-blue-600 font-medium' : 'text-gray-700'}>
                      {item.combination_name || '未命名项目'}
                    </span>
                  </label>
                );
              })}
            </div>
            {!optionalConfirmed && (
              <div className='flex items-center gap-2'>
                <Button
                  className='py-1 px-3 text-xs bg-blue-600 hover:bg-blue-700 text-white'
                  onClick={handleConfirmOptionalSelection}
                  disabled={busy || selectedOptionalItem == null}
                >
                  确定选择
                </Button>
                {showOptionalConfirmTip && (
                  <span className='text-[11px] text-gray-500'>
                    请先确认体检项目，确认后不可修改
                  </span>
                )}
              </div>
            )}
          </div>
        ) : null}
      </div>
      {showImagePreview && previewImage && (
        <div className='fixed inset-0 z-[80] bg-black/90 flex items-center justify-center p-6' onClick={() => setShowImagePreview(false)}>
          <div className='relative max-w-full max-h-full'>
            <img src={previewImage} alt='身份证预览' className='max-w-full max-h-[90vh] object-contain' />
            <Button className='absolute top-4 right-4 bg-white/90 hover:bg-white' onClick={() => setShowImagePreview(false)}>
              关闭
            </Button>
          </div>
        </div>
      )}
      <div className='p-4 rounded-2xl border bg-gray-50/60 flex flex-col gap-3'>
        <div className='flex items-center justify-between'>
          <div className='font-medium'>体检知情同意书</div>
          {checkAllSigned() && (
            <Button
              className='py-1 px-3 bg-green-600 hover:bg-green-700 text-white text-xs'
              onClick={() => {
                // 有可选项目但尚未确认时，禁止打印并提示先确认项目
                if (optionalItemList.length > 0 && !optionalConfirmed) {
                  setMessage('请先确认体检项目');
                  setShowOptionalConfirmTip(true);
                  return;
                }
                handleBatchPrint();
              }}
              disabled={busy || batchPrintLoading}
            >
              {batchPrintLoading ? '加载中...' : '一键打印'}
            </Button>
          )}
        </div>
        {/* <div className='text-xs text-gray-500'>点击后弹出知情同意书全文及签名区域，签署完成后回到签到页面。</div> */}
        <div className='flex flex-col gap-2 max-h-96 overflow-y-auto custom-scroll'>
          {consentLoading && <div className='text-xs text-gray-500'>加载中...</div>}
          {/* {!consentLoading && consentMessage && <div className='text-xs text-amber-600'>{consentMessage}</div>} */}
          {!consentLoading && (consentList.length > 0 || true) && (
            <div className='space-y-2'>
              {consentList.map((item) => (
                <div
                  key={item.pdf_url || item.pdf_name}
                  className='flex items-center justify-between gap-3 p-2 rounded-xl border bg-white shadow-sm'
                >
                  <div className='text-sm text-gray-800 truncate flex items-center gap-2 relative pr-20'>
                    <span className='truncate'>{item.pdf_name.length > 10 ? item.pdf_name.slice(0, 10) + "..." : item.pdf_name}</span>
                    {item.combination_code !== undefined && signedCombinationCodes.includes(Number(item.combination_code)) && (
                      <img
                        src='/sign.png'
                        alt='已签名'
                        className='w-16 h-16 absolute right-2 top-1/2 -translate-y-1/2 pointer-events-none select-none'
                        loading='lazy'
                      />
                    )}
                  </div>
                  <div className='flex items-center gap-2'>
                    {item.combination_code !== undefined && signedCombinationCodes.includes(Number(item.combination_code)) && (
                      <Button
                        className='py-1.5 px-3 bg-blue-600 hover:bg-blue-700 text-white'
                        onClick={() => {
                          if (busy) return;
                          // 有可选项目但尚未确认时，禁止打印并提示先确认项目
                          if (optionalItemList.length > 0 && !optionalConfirmed) {
                            setMessage('请先确认体检项目');
                            setShowOptionalConfirmTip(true);
                            return;
                          }
                          handleDirectPrint(item);
                        }}
                        disabled={busy}
                      >
                        打印
                      </Button>
                    )}
                    <Button
                      className='py-1.5 px-3'
                      onClick={() => {
                        if (busy) return;
                        // 有可选项目但尚未确认时，禁止查看并提示先确认项目
                        if (optionalItemList.length > 0 && !optionalConfirmed) {
                          setMessage('请先确认体检项目');
                          setShowOptionalConfirmTip(true);
                          return;
                        }
                        setPreviewPdf(item);
                      }}
                      disabled={busy}
                    >
                      查看
                    </Button>
                  </div>
                </div>
              ))}
              {/* 只有在没有可选项目，或者有可选项目但已确认时，才显示导检单 */}
              {(optionalItemList.length === 0 || optionalConfirmed) && (
                <div className='flex items-center justify-between gap-3 p-2 rounded-xl border bg-white shadow-sm'>
                  <div className='text-sm text-gray-800 truncate flex items-center gap-2 relative pr-20'>
                    <span className='truncate'>导检单</span>
                    {isDaojiandanSigned && (
                      <img
                        src='/sign.png'
                        alt='已签名'
                        className='w-16 h-16 absolute right-2 top-1/2 -translate-y-1/2 pointer-events-none select-none'
                        loading='lazy'
                      />
                    )}
                  </div>
                  <div className='flex items-center gap-2'>
                    {isDaojiandanSigned ? (
                      // 已签名：显示打印和查看按钮
                      <>
                        <Button
                          className='py-1.5 px-3 bg-blue-600 hover:bg-blue-700 text-white'
                          onClick={() => {
                            if (busy) return;
                            // 有可选项目但尚未确认时，禁止打印并提示先确认项目
                            if (optionalItemList.length > 0 && !optionalConfirmed) {
                              setMessage('请先确认体检项目');
                              setShowOptionalConfirmTip(true);
                              return;
                            }
                            handleDaojiandanDirectPrint();
                          }}
                          disabled={busy}
                        >
                          打印
                        </Button>
                        <Button
                          className='py-1.5 px-3'
                          onClick={() => {
                            if (busy) return;
                            // 有可选项目但尚未确认时，禁止查看并提示先确认项目
                            if (optionalItemList.length > 0 && !optionalConfirmed) {
                              setMessage('请先确认体检项目');
                              setShowOptionalConfirmTip(true);
                              return;
                            }
                            setShowDaojiandanPreview(true);
                          }}
                          disabled={busy}
                        >
                          查看
                        </Button>
                      </>
                    ) : daojiandanUrl ? (
                      // 未签名但有导检单：显示查看和签名按钮
                      <>
                        <Button
                          className='py-1.5 px-3'
                          onClick={() => {
                            if (busy) return;
                            // 有可选项目但尚未确认时，禁止查看并提示先确认项目
                            if (optionalItemList.length > 0 && !optionalConfirmed) {
                              setMessage('请先确认体检项目');
                              setShowOptionalConfirmTip(true);
                              return;
                            }
                            setShowDaojiandanPreview(true);
                          }}
                          disabled={busy}
                        >
                          查看
                        </Button>
                        <Button
                          className='py-1.5 px-3'
                          onClick={() => {
                            if (busy) return;
                            // 有可选项目但尚未确认时，禁止签名并提示先确认项目
                            if (optionalItemList.length > 0 && !optionalConfirmed) {
                              setMessage('请先确认体检项目');
                              setShowOptionalConfirmTip(true);
                              return;
                            }
                            setShowDaojiandanSignature(true);
                          }}
                          disabled={busy}
                        >
                          签名
                        </Button>
                      </>
                    ) : (
                      // 没有导检单：只显示签名按钮
                      <Button
                        className='py-1.5 px-3'
                        onClick={() => {
                          if (busy) return;
                          // 有可选项目但尚未确认时，禁止签名并提示先确认项目
                          if (optionalItemList.length > 0 && !optionalConfirmed) {
                            setMessage('请先确认体检项目');
                            setShowOptionalConfirmTip(true);
                            return;
                          }
                          setShowDaojiandanSignature(true);
                        }}
                        disabled={busy}
                      >
                        签名
                      </Button>
                    )}
                  </div>
                </div>
              )}
              {/* 加项单列表（可能有多个） */}
              {addItemBillList.length > 0 &&
                addItemBillList.map((bill) => {
                  const isSigned = bill.is_signed === true;
                  const displayName =
                    bill.pdf_name && bill.pdf_name.length > 12 ? bill.pdf_name.slice(0, 12) + '...' : bill.pdf_name || '加项单';
                  return (
                    <div
                      key={bill.pdf_sort}
                      className='flex items-center justify-between gap-3 p-2 rounded-xl border bg-white shadow-sm'
                    >
                      <div className='text-sm text-gray-800 truncate flex items-center gap-2 relative pr-20'>
                        <span className='truncate'>
                          {displayName}
                          {typeof bill.pdf_sort === 'number' ? `` : ''}
                        </span>
                        {bill.payment_status_name && (
                          <span className='text-xs text-gray-500 whitespace-nowrap'>{bill.payment_status_name}</span>
                        )}
                        {isSigned && (
                          <img
                            src='/sign.png'
                            alt='已签名'
                            className='w-16 h-16 absolute right-2 top-1/2 -translate-y-1/2 pointer-events-none select-none'
                            loading='lazy'
                          />
                        )}
                      </div>
                      <div className='flex items-center gap-2'>
                        {isSigned && bill.pdf_url && (
                          <Button
                            className='py-1.5 px-3 bg-blue-600 hover:bg-blue-700 text-white'
                            onClick={() => {
                              if (busy) return;
                              handleAddItemBillDirectPrint(bill);
                            }}
                            disabled={busy}
                          >
                            打印
                          </Button>
                        )}
                        {bill.pdf_url && (
                          <Button
                            className='py-1.5 px-3'
                            onClick={() => {
                              if (busy) return;
                              setCurrentAddItemBill(bill);
                              setShowAddItemBillPreview(true);
                            }}
                            disabled={busy}
                          >
                            查看
                          </Button>
                        )}
                        {!isSigned && (
                          <Button
                            className='py-1.5 px-3'
                            onClick={() => {
                              if (busy) return;
                              setCurrentAddItemBill(bill);
                              setShowAddItemBillSignature(true);
                            }}
                            disabled={busy}
                          >
                            签名
                          </Button>
                        )}
                      </div>
                    </div>
                  );
                })}
            </div>
          )}
        </div>
      </div>
      {
        previewPdf && (
          <div className='fixed inset-0 z-[60] bg-black/75 flex flex-col'>
            <div className='flex items-center justify-between p-4 text-white bg-gray-900/80'>
              <div className='text-sm font-medium truncate pr-3'>{previewPdf.pdf_name}</div>
              <div className='flex items-center gap-2'>
                <Button
                  className='py-1 px-3 bg-blue-600 hover:bg-blue-700 text-white disabled:opacity-50 disabled:cursor-not-allowed'
                  onClick={() => {
                    // 有可选项目但尚未确认时，禁止打印并提示先确认项目
                    if (optionalItemList.length > 0 && !optionalConfirmed) {
                      setMessage('请先确认体检项目');
                      setShowOptionalConfirmTip(true);
                      return;
                    }
                    handlePrint();
                  }}
                  disabled={pdfLoading || !pdfReady || !pdfBlobUrl}
                >
                  打印
                </Button>
                <Button
                  className='py-1 px-3'
                  onClick={() => {
                    if (busy) return;
                    // 有可选项目但尚未确认时，禁止签名并提示先确认项目
                    if (optionalItemList.length > 0 && !optionalConfirmed) {
                      setMessage('请先确认体检项目');
                      setShowOptionalConfirmTip(true);
                      return;
                    }
                    setShowSignature(true);
                  }}
                  disabled={busy}
                >
                  签名
                </Button>
                <Button className='py-1 px-3' onClick={() => !busy && setPreviewPdf(null)} disabled={busy}>
                  关闭
                </Button>
              </div>
            </div>
            <div className='flex-1 bg-gray-100 overflow-auto'>
              {pdfLoading ? (
                <div className='flex items-center justify-center h-full text-white'>
                  <div>正在加载PDF...</div>
                </div>
              ) : pdfData ? (
                <div className='flex justify-center p-4'>
                  <div ref={canvasContainerRef} className='w-full' />
                </div>
              ) : (
                <div className='flex items-center justify-center h-full text-white'>
                  <div>PDF加载失败</div>
                </div>
              )}
            </div>
          </div>
        )
      }
      {
        showSignature && (
          <div className='fixed inset-0 z-[70] bg-black/80 flex items-center justify-center px-6'>
            <div className='bg-white rounded-2xl w-full max-w-3xl shadow-2xl p-4 flex flex-col gap-4'>
              <div className='flex items-center justify-between'>
                <div className='text-base font-semibold text-gray-900'>签署知情同意书</div>
                <div className='flex items-center gap-2'>
                  <Button className='py-1 px-3' onClick={() => setShowSignature(false)} disabled={busy}>
                    关闭
                  </Button>
                </div>
              </div>
              <div className='ui7-signature-wrapper border rounded-xl overflow-hidden bg-gray-50'>
                <SignaturePad
                  ref={signaturePadRef}
                  className='ui7-signature-canvas w-full h-72 bg-white touch-none'
                />
                <div className='flex items-center justify-between px-3 py-2 bg-gray-50 border-t'>
                  <div className='text-xs text-gray-500'>请在上方区域签名完成签到</div>
                  <Button className='ui7-clear-button py-1 px-3' onClick={() => signaturePadRef.current?.clear()} disabled={submitLoading}>
                    清除
                  </Button>
                </div>
              </div>
              {submitMessage && (
                <div className={`text-sm text-center ${submitMessage.includes('成功') ? 'text-green-600' : 'text-amber-600'}`}>{submitMessage}</div>
              )}
              <div className='flex items-center justify-end gap-3'>
                <Button
                  className='py-2 px-6'
                  onClick={() => {
                    setShowSignature(false);
                    setSubmitMessage(null);
                    signaturePadRef.current?.clear();
                  }}
                  disabled={submitLoading}
                >
                  取消
                </Button>
                <Button
                  className='py-2 px-6 bg-blue-600 text-white hover:bg-blue-700'
                  onClick={handleSubmitSign}
                  disabled={submitLoading}
                >
                  {submitLoading ? '提交中...' : '提交签名'}
                </Button>
              </div>
            </div>
          </div>
        )
      }
      {
        showDaojiandanSignature && (
          <div className='fixed inset-0 z-[70] bg-black/80 flex items-center justify-center px-6'>
            <div className='bg-white rounded-2xl w-full max-w-3xl shadow-2xl p-4 flex flex-col gap-4'>
              <div className='flex items-center justify-between'>
                <div className='text-base font-semibold text-gray-900'>签署导检单</div>
                <div className='flex items-center gap-2'>
                  <Button className='py-1 px-3' onClick={() => setShowDaojiandanSignature(false)} disabled={busy}>
                    关闭
                  </Button>
                </div>
              </div>
              <div className='ui7-signature-wrapper border rounded-xl overflow-hidden bg-gray-50'>
                <SignaturePad
                  ref={daojiandanSignaturePadRef}
                  className='ui7-signature-canvas w-full h-72 bg-white touch-none'
                />
                <div className='flex items-center justify-between px-3 py-2 bg-gray-50 border-t'>
                  <div className='text-xs text-gray-500'>请在上方区域签名</div>
                  <Button className='ui7-clear-button py-1 px-3' onClick={() => daojiandanSignaturePadRef.current?.clear()} disabled={daojiandanSubmitLoading}>
                    清除
                  </Button>
                </div>
              </div>
              {daojiandanSubmitMessage && (
                <div className={`text-sm text-center ${daojiandanSubmitMessage.includes('成功') ? 'text-green-600' : 'text-amber-600'}`}>{daojiandanSubmitMessage}</div>
              )}
              <div className='flex items-center justify-end gap-3'>
                <Button
                  className='py-2 px-6'
                  onClick={() => {
                    setShowDaojiandanSignature(false);
                    setDaojiandanSubmitMessage(null);
                    daojiandanSignaturePadRef.current?.clear();
                  }}
                  disabled={daojiandanSubmitLoading}
                >
                  取消
                </Button>
                <Button
                  className='py-2 px-6 bg-blue-600 text-white hover:bg-blue-700'
                  onClick={handleSubmitDaojiandanSign}
                  disabled={daojiandanSubmitLoading}
                >
                  {daojiandanSubmitLoading ? '提交中...' : '提交签名'}
                </Button>
              </div>
            </div>
          </div>
        )
      }
      {
        showDaojiandanPreview && daojiandanUrl && (
          <div className='fixed inset-0 z-[60] bg-black/75 flex flex-col'>
            <div className='flex items-center justify-between p-4 text-white bg-gray-900/80'>
              <div className='text-sm font-medium truncate pr-3'>导检单</div>
              <div className='flex items-center gap-2'>
                <Button
                  className='py-1 px-3 bg-blue-600 hover:bg-blue-700 text-white disabled:opacity-50 disabled:cursor-not-allowed'
                  onClick={() => {
                    // 有可选项目但尚未确认时，禁止打印并提示先确认项目
                    if (optionalItemList.length > 0 && !optionalConfirmed) {
                      setMessage('请先确认体检项目');
                      setShowOptionalConfirmTip(true);
                      return;
                    }
                    handleDaojiandanDirectPrint();
                  }}
                  disabled={busy}
                >
                  打印
                </Button>
                <Button
                  className='py-1 px-3 hover:bg-blue-700 text-white'
                  onClick={() => {
                    if (busy) return;
                    // 有可选项目但尚未确认时，禁止签名并提示先确认项目
                    if (optionalItemList.length > 0 && !optionalConfirmed) {
                      setMessage('请先确认体检项目');
                      setShowOptionalConfirmTip(true);
                      return;
                    }
                    setShowDaojiandanPreview(false);
                    setShowDaojiandanSignature(true);
                  }}
                  disabled={busy}
                >
                  签名
                </Button>
                <Button className='py-1 px-3' onClick={() => !busy && setShowDaojiandanPreview(false)} disabled={busy}>
                  关闭
                </Button>
              </div>
            </div>
            <div className='flex-1 bg-gray-100 overflow-auto'>
              {daojiandanPdfLoading ? (
                <div className='flex items-center justify-center h-full text-white'>
                  <div>正在加载PDF...</div>
                </div>
              ) : daojiandanPdfData ? (
                <div className='flex justify-center p-4'>
                  <div ref={daojiandanCanvasContainerRef} className='w-full' />
                </div>
              ) : (
                <div className='flex items-center justify-center h-full text-white'>
                  <div>PDF加载失败</div>
                </div>
              )}
            </div>
          </div>
        )
      }
      {
        showAddItemBillSignature && (
          <div className='fixed inset-0 z-[70] bg-black/80 flex items-center justify-center px-6'>
            <div className='bg-white rounded-2xl w-full max-w-3xl shadow-2xl p-4 flex flex-col gap-4'>
              <div className='flex items-center justify-between'>
                <div className='text-base font-semibold text-gray-900'>签署加项单</div>
                <div className='flex items-center gap-2'>
                  <Button className='py-1 px-3' onClick={() => setShowAddItemBillSignature(false)} disabled={busy}>
                    关闭
                  </Button>
                </div>
              </div>
              <div className='ui7-signature-wrapper border rounded-xl overflow-hidden bg-gray-50'>
                <SignaturePad
                  ref={addItemBillSignaturePadRef}
                  className='ui7-signature-canvas w-full h-72 bg-white touch-none'
                />
                <div className='flex items-center justify-between px-3 py-2 bg-gray-50 border-t'>
                  <div className='text-xs text-gray-500'>请在上方区域签名</div>
                  <Button className='ui7-clear-button py-1 px-3' onClick={() => addItemBillSignaturePadRef.current?.clear()} disabled={addItemBillSubmitLoading}>
                    清除
                  </Button>
                </div>
              </div>
              {addItemBillSubmitMessage && (
                <div className={`text-sm text-center ${addItemBillSubmitMessage.includes('成功') ? 'text-green-600' : 'text-amber-600'}`}>{addItemBillSubmitMessage}</div>
              )}
              <div className='flex items-center justify-end gap-3'>
                <Button
                  className='py-2 px-6'
                  onClick={() => {
                    setShowAddItemBillSignature(false);
                    setAddItemBillSubmitMessage(null);
                    addItemBillSignaturePadRef.current?.clear();
                  }}
                  disabled={addItemBillSubmitLoading}
                >
                  取消
                </Button>
                <Button
                  className='py-2 px-6 bg-blue-600 text-white hover:bg-blue-700'
                  onClick={handleSubmitAddItemBillSign}
                  disabled={addItemBillSubmitLoading}
                >
                  {addItemBillSubmitLoading ? '提交中...' : '提交签名'}
                </Button>
              </div>
            </div>
          </div>
        )
      }
      {
        showAddItemBillPreview && currentAddItemBill && currentAddItemBill.pdf_url && (
          <div className='fixed inset-0 z-[60] bg-black/75 flex flex-col'>
            <div className='flex items-center justify-between p-4 text-white bg-gray-900/80'>
              <div className='text-sm font-medium truncate pr-3'>{currentAddItemBill.pdf_name || '加项单'}</div>
              <div className='flex items-center gap-2'>
                {currentAddItemBill.is_signed && (
                  <Button
                    className='py-1 px-3 bg-blue-600 hover:bg-blue-700 text-white disabled:opacity-50 disabled:cursor-not-allowed'
                    onClick={() => handleAddItemBillDirectPrint(currentAddItemBill)}
                    disabled={busy}
                  >
                    打印
                  </Button>
                )}
                <Button
                  className='py-1 px-3 hover:bg-blue-700 text-white'
                  onClick={() => {
                    if (busy) return;
                    setShowAddItemBillPreview(false);
                    setShowAddItemBillSignature(true);
                  }}
                  disabled={busy}
                >
                  签名
                </Button>
                <Button className='py-1 px-3' onClick={() => !busy && setShowAddItemBillPreview(false)} disabled={busy}>
                  关闭
                </Button>
              </div>
            </div>
            <div className='flex-1 bg-gray-100 overflow-auto'>
              {addItemBillPdfLoading ? (
                <div className='flex items-center justify-center h-full text-white'>
                  <div>正在加载PDF...</div>
                </div>
              ) : addItemBillPdfData ? (
                <div className='flex justify-center p-4'>
                  <div ref={addItemBillCanvasContainerRef} className='w-full' />
                </div>
              ) : (
                <div className='flex items-center justify-center h-full text-white'>
                  <div>PDF加载失败</div>
                </div>
              )}
            </div>
          </div>
        )
      }
    </div >
  );
};