<template>
  <div class="preview">
    <div class="content">
      <!-- 左側(cè)：PDF預(yù)覽區(qū)域 -->
      <div class="left">
        <PDFPreview 
          :pdfUrl="pdfComputedUrl"
          :loading="renderComputedProgress.renderPdfLoading"
          :progress="renderComputedProgress"
        />
      </div>
      
      <!-- 右側(cè)：打印配置面板 -->
      <div class="right">
        <PrintConfigPanel 
          :form="state.form"
          @config-change="handleConfigChange"
        />
      </div>
    </div>
  </div>
</template>

const _renderPdfDoc = async () => {
  // 1. 重置狀態(tài)
  state.pdfUrl = null;
  state.renderProgress = { startTime: Date.now() };
  
  // 2. 獲取紙張配置
  const paper = state.papers?.find(one => one.value === state.form.paperFormat);
  
  if (paper && paper.width && paper.height) {
    try {
      // 3. 加載源PDF
      if (!sourcePdf.value) {
        sourcePdf.value = await fetch(paramsPdfUrl.value.pdfUrl)
          .then(res => res?.arrayBuffer());
      }
      
      // 4. 創(chuàng)建新PDF文檔
      const newPdfDoc = await PDFDocument.create();
      const pdfDoc = await PDFDocument.load(sourcePdf.value, {
        parseSpeed: Infinity,
      });
      
      // 5. 逐頁處理
      const pageCount = pdfDoc.getPageCount();
      for (let j = 0; j < pageCount; j++) {
        // 更新進(jìn)度
        state.renderProgress = {
          ...state.renderProgress,
          page: j + 1,
          totalPages: pageCount,
          updateTime: Date.now(),
        };
        
        // 添加頁面并應(yīng)用配置
        const page = newPdfDoc.addPage([newPaperWidth, newPaperHeight]);
        const [embeddedPage] = await newPdfDoc.embedPdf(sourcePdf.value, [j]);
        
        // 應(yīng)用縮放和旋轉(zhuǎn)配置
        applyPageTransform(page, embeddedPage, paper, state.form);
      }
      
      // 6. 生成預(yù)覽URL
      const pdfBytes = await newPdfDoc.save();
      const blob = new Blob([pdfBytes], { type: "application/pdf" });
      state.pdfUrl = URL.createObjectURL(blob);
      
    } catch (err) {
      console.error(err);
      state.pdfUrl = paramsPdfUrl.value.pdfUrl; // 降級到原始PDF
    }
  }
};

const applyPageTransform = (page, embeddedPage, paper, config) => {
  const { width, height } = embeddedPage.size();
  const [oldPageWidth, oldPageHeight] = [width, height];
  
  // 計算縮放比例
  const scale_x = paper.width / oldPageWidth;
  const scale_y = paper.height / oldPageHeight;
  let zoom = Math.min(scale_x, scale_y);
  
  // 橫向模式處理
  if (config.landscape) {
    const scale_x = paper.width / oldPageHeight;
    const scale_y = paper.height / oldPageWidth;
    zoom = Math.min(scale_x, scale_y);
  }
  
  // ?? 關(guān)鍵：根據(jù)縮放模式調(diào)整（與Chrome打印預(yù)覽邏輯一致）
  if (config.scaleMode === "shrink" && zoom > 1) {
    zoom = 1; // shrink模式不放大，保持原始大小
  }
  
  // 計算居中位置
  const x = paper.width / 2 - (oldPageWidth * zoom) / 2;
  const y = paper.height / 2 - (oldPageHeight * zoom) / 2;
  
  // 應(yīng)用變換
  page.drawPage(embeddedPage, {
    x,
    y,
    xScale: zoom,
    yScale: zoom,
    rotate: config.landscape ? degrees(-90) : undefined,
  });
};

// 財務(wù)報表：使用shrink模式，確保內(nèi)容完整
const financialReport = {
  scaleMode: 'shrink',
  paperFormat: 'A4',
  landscape: false
};

// 照片打印：使用fit模式，最大化利用紙張
const photoPrint = {
  scaleMode: 'fit',
  paperFormat: '6x4',
  landscape: true
};

// 技術(shù)圖紙：使用noscale模式，保持精確尺寸
const technicalDrawing = {
  scaleMode: 'noscale',
  paperFormat: 'A3',
  landscape: true
};

const renderComputedProgress = computed(() => {
  const { page = 1, totalPages = 1 } = state.renderProgress;
  const isFinish = page === totalPages;
  const wasteTime = (state.renderProgress.updateTime - state.renderProgress.startTime) / 1000;
  
  // 智能顯示進(jìn)度條：超過2秒才顯示
  const showTopProgress = !isFinish && wasteTime > 2;
  
  return {
    progressText: isEnglish.value
      ? `Loading progress ${page}/${totalPages}`
      : `加載進(jìn)度 ${page}/${totalPages}`,
    percent: ((page / totalPages) * 100).toFixed(0),
    showTopProgress,
    renderPdfLoading: state.renderPdfLoading && !showTopProgress,
  };
});

const getPapers = async (printerName) => {
  try {
    state.paperLoading = true;
    const papers = await getPrinterPaper({ printerName });
    state.papers = papers.map(paper => ({
      label: paper.name,
      value: paper.name,
      width: paper.width,
      height: paper.height,
    }));
  } finally {
    state.paperLoading = false;
  }
};

const scaleModeOptions = computed(() => [
  {
    label: "將頁面縮小至可打印區(qū)域 (如果需要) (默認(rèn))",
    value: "shrink",
  },
  {
    label: "使用原始頁面大小",
    value: "noscale",
  },
  {
    label: "調(diào)整頁面至可打印區(qū)域",
    value: "fit",
  },
]);

const pageRangesNormalized = computed(() => {
  let pageRanges = null;
  if (+state.pageRangeType === 1) {
    // 全部頁面
  } else if (+state.pageRangeType === 2) {
    // 自定義頁面范圍
    pageRanges = state.pageRangesInputs?.filter(item => item.from && item.to);
  }
  return { pageRanges, pageRangesLength: pageRanges?.length };
});

const handlePrint = async () => {
  const printOptions = {
    ...(props.pdfParams?.printOptions || {}),
    ...JSON.parse(JSON.stringify(state.form)),
  };
  
  state.printLoading = true;
  try {
    await printPreviewFile({
      pdfFilePath: props.pdfParams.pdfFilePath,
      printOptions,
    });
    message.success("打印成功！");
  } catch (err) {
    message.error(err?.message || "打印失敗");
  } finally {
    state.printLoading = false;
  }
};

// 監(jiān)聽配置變化，自動重新渲染PDF
watch(
  () => JSON.stringify(pageRangesNormalized.value.pageRanges),
  (v1, v2) => {
    if (v1 !== v2) {
      state.form.pageRanges = pageRangesNormalized.value.pageRanges;
      renderPdfDoc(); // 重新渲染PDF
    }
  }
);

// 監(jiān)聽其他配置變化
watch(
  () => [
    state.form.paperFormat,
    state.form.scaleMode,
    state.form.landscape,
    state.form.colorful,
  ],
  () => renderPdfDoc(),
  { deep: true }
);

const getPageHeight = debounce(() => {
  const height = +getComputedStyle(
    document.getElementById("_printPreview")
  )?.height?.replace("px", "");
  state.clientHeight = height - 20 + "px";
}, 500);

onMounted(() => {
  getPageHeight();
  window.addEventListener("resize", getPageHeight);
});

const _renderPdfDoc = async () => {
  const currentRenderPdfDocTimestamp = state.renderPdfDocTimestamp;
  
  // 檢查是否被中斷
  const checkIsBreak = () => {
    return currentRenderPdfDocTimestamp !== state.renderPdfDocTimestamp;
  };
  
  // 在關(guān)鍵節(jié)點檢查中斷
  if (checkIsBreak()) return;
  
  // ... 渲染邏輯
};

onUnmounted(() => {
  window.removeEventListener("resize", getPageHeight);
  
  // 釋放PDF URL
  if (state.pdfUrl && state.pdfUrl.startsWith('blob:')) {
    URL.revokeObjectURL(state.pdfUrl);
  }
});

// 財務(wù)報表預(yù)覽打印
const financialReportPreview = {
  paperFormat: 'A4',
  scaleMode: 'fit',
  landscape: false,
  copies: 2,
  duplexMode: 'duplex',
  pageRanges: [{ from: 1, to: 10 }]
};

// 訂單詳情預(yù)覽打印
const orderPrintPreview = {
  paperFormat: 'A5',
  scaleMode: 'shrink',
  landscape: false,
  copies: 1,
  colorful: false, // 黑白打印節(jié)省成本
};

// 教學(xué)資料預(yù)覽打印
const educationPrintPreview = {
  paperFormat: 'A4',
  scaleMode: 'fit',
  landscape: true, // 橫向打印
  copies: 30,
  duplexMode: 'duplexlong',
};