gcs-ui-lib 1.2.34 → 1.2.35

package/src/utils/exportPageSnapshot.js

@@ -1,1037 +1,728 @@
-/**
- * 高保真页面 HTML 快照导出（Vue2 页面适用）
- *
- * 相比 gcs-ui-lib/exportPageSnapshot：
- * - 不做 CSS 裁剪，保留文档全部可访问样式
- * - 克隆节点后内联关键 computed 布局样式，提升离线还原度
- * - 内嵌图标字体（woff/woff2），跳过大体积宋体
- * - 默认不注入 PDF 专用覆盖样式，避免表格/字号被压扁
- * - 支持将生成的 HTML 快照转为 PDF（html2canvas + jsPDF）
- */
-
-export const PAGE_SNAPSHOT_BACKEND_PLACEHOLDER = '<!-- PAGE_SNAPSHOT_BACKEND_PLACEHOLDER -->'
-
-/** 页面内「导出快照」按钮 class，克隆时自动排除 */
-export const PAGE_SNAPSHOT_BTN_CLASS = 'page-snapshot-btn'
-
-const SNAPSHOT_FILENAME_PREFIX = 'page-snapshot'
-const SKIP_TAGS = new Set(['script', 'style', 'link', 'noscript', 'svg'])
-const SKIP_CLASSES = [
-  PAGE_SNAPSHOT_BTN_CLASS,
-  'page-button-shadow',
-  'detpl-form-operate-box',
-  'self-footer'
-]
-
-const SCROLL_UNWRAP_SELECTORS = [
-  '.el-table__body-wrapper',
-  '.el-table__fixed-body-wrapper',
-  '.el-scrollbar__wrap',
-  '.el-scrollbar__view',
-  '.vxe-table--body-wrapper',
-  '.vxe-table--body-inner-wrapper',
-  '.vxe-table--main-wrapper'
-]
-
-/** 内联 computed 样式时关注的属性（布局 + 常见视觉） */
-const INLINE_STYLE_PROPS = [
-  'display', 'flex', 'flex-direction', 'flex-wrap', 'flex-grow', 'flex-shrink', 'flex-basis',
-  'align-items', 'align-self', 'align-content', 'justify-content', 'justify-self', 'gap', 'row-gap', 'column-gap',
-  'grid-template-columns', 'grid-template-rows', 'grid-column', 'grid-row',
-  'position', 'top', 'right', 'bottom', 'left', 'z-index', 'float', 'clear',
-  'width', 'height', 'min-width', 'min-height', 'max-width', 'max-height',
-  'margin', 'margin-top', 'margin-right', 'margin-bottom', 'margin-left',
-  'padding', 'padding-top', 'padding-right', 'padding-bottom', 'padding-left',
-  'box-sizing', 'overflow', 'overflow-x', 'overflow-y',
-  'border', 'border-top', 'border-right', 'border-bottom', 'border-left',
-  'border-radius', 'border-collapse', 'table-layout',
-  'background', 'background-color', 'background-image', 'background-size', 'background-position',
-  'color', 'font-size', 'font-weight', 'font-style', 'line-height', 'letter-spacing',
-  'text-align', 'text-decoration', 'vertical-align', 'white-space', 'word-break', 'word-wrap',
-  'opacity', 'visibility', 'box-shadow', 'transform'
-]
-
-const SNAPSHOT_BASE_CSS = `
-html, body {
-  margin: 0;
-  padding: 8px;
-  background: #fff;
-  -webkit-print-color-adjust: exact;
-  print-color-adjust: exact;
-}
-
-n20-page,
-[class$="-wrap"],
-.n20-page-content,
-.page-content,
-.action-parse-form-container {
-  height: auto !important;
-  max-height: none !important;
-  overflow: visible !important;
-}
-
-.el-dialog__wrapper,
-.el-message,
-.el-message-box__wrapper,
-.el-notification,
-.el-loading-mask,
-.page-snapshot-btn,
-.page-button-shadow {
-  display: none !important;
-}
-
-/* 快照需展示全部表格行，解除 flex 布局下的可视区高度限制 */
-.table-wrap,
-.table-wrap .table-content {
-  flex: none !important;
-  position: relative !important;
-  height: auto !important;
-  min-height: 0 !important;
-  max-height: none !important;
-  overflow: visible !important;
-}
-.height-100 {
-  height: auto !important;
-}
-.el-table,
-.el-table__header-wrapper,
-.el-table__body-wrapper,
-.el-table__footer-wrapper,
-.vxe-table,
-.vxe-table--body-wrapper,
-.vxe-table--main-wrapper {
-  height: auto !important;
-  max-height: none !important;
-  overflow: visible !important;
-}
-
-/* 固定列浮层仅覆盖可视区，快照需移除并还原主表隐藏单元格 */
-.el-table__fixed,
-.el-table__fixed-right,
-.el-table__fixed-right-patch {
-  display: none !important;
-}
-.el-table__cell.is-hidden,
-.el-table__cell.is-hidden > * {
-  visibility: visible !important;
-}
-`
-
-const SNAPSHOT_PDF_CSS = `
-@page { size: A4 landscape; margin: 15mm; }
-html, body { font-family: SimSun, "Songti SC", "Microsoft YaHei", serif; font-size: 10px; line-height: 1.4; }
-td, th { white-space: normal !important; padding: 4px; font-size: 10px; vertical-align: top; }
-`
-
-function safeRun(fn, fallback, label) {
-  try {
-    return fn()
-  } catch (e) {
-    if (label) console.warn(`[exportPageHtml] ${label}`, e)
-    return fallback
-  }
-}
-
-function buildSnapshotFilename(ext = 'html') {
-  const ts = new Date().toISOString().replace(/[:.]/g, '-').slice(0, 19)
-  return `${SNAPSHOT_FILENAME_PREFIX}-${ts}.${ext}`
-}
-
-let pdfLibsPromise = null
-
-async function loadPdfLibraries() {
-  if (pdfLibsPromise) return pdfLibsPromise
-
-  pdfLibsPromise = Promise.all([
-    import(/* webpackChunkName: "html2canvas" */ 'html2canvas'),
-    import(/* webpackChunkName: "jspdf" */ 'jspdf')
-  ]).then(([html2canvasMod, jsPDFMod]) => ({
-    html2canvas: html2canvasMod.default || html2canvasMod,
-    jsPDF: jsPDFMod.jsPDF || jsPDFMod.default || jsPDFMod
-  })).catch((e) => {
-    pdfLibsPromise = null
-    throw e
-  })
-
-  return pdfLibsPromise
-}
-
-function mountHtmlIframe(html, captureWidth) {
-  const width = captureWidth > 0
-    ? captureWidth
-    : (document.documentElement.clientWidth || 1400)
-  return new Promise((resolve, reject) => {
-    const iframe = document.createElement('iframe')
-    iframe.setAttribute('aria-hidden', 'true')
-    iframe.style.cssText = `position:fixed;left:-10000px;top:0;border:0;width:${width}px;height:900px;visibility:hidden;`
-    document.body.appendChild(iframe)
-
-    iframe.onload = async () => {
-      try {
-        const doc = iframe.contentDocument
-        if (doc?.fonts?.ready) await doc.fonts.ready
-        resizeIframeToContent(iframe)
-        await new Promise((r) => setTimeout(r, 200))
-        resolve(iframe)
-      } catch (e) {
-        reject(e)
-      }
-    }
-    iframe.onerror = reject
-    iframe.srcdoc = html
-  })
-}
-
-function unmountHtmlIframe(iframe) {
-  if (iframe?.parentNode) iframe.parentNode.removeChild(iframe)
-}
-
-/**
- * 将 HTML 快照字符串转为 PDF Blob
- * @param {string} html
- * @param {{ orientation?: string, format?: string, margin?: number, scale?: number, quality?: number, captureWidth?: number }} [options]
- */
-export async function convertHtmlSnapshotToPdf(html, options = {}) {
-  const {
-    orientation = 'landscape',
-    format = 'a4',
-    margin = 15,
-    scale = 2,
-    quality = 0.92,
-    captureWidth = 0
-  } = options
-
-  let iframe
-  try {
-    const { html2canvas, jsPDF } = await loadPdfLibraries()
-    iframe = await mountHtmlIframe(html, captureWidth)
-    const body = iframe.contentDocument.body
-    resizeIframeToContent(iframe)
-    await new Promise((r) => setTimeout(r, 100))
-
-    const shotWidth = iframe.clientWidth || body.offsetWidth
-    const shotHeight = body.scrollHeight
-
-    const canvas = await html2canvas(body, {
-      scale,
-      useCORS: true,
-      logging: false,
-      backgroundColor: '#ffffff',
-      width: shotWidth,
-      height: shotHeight,
-      windowWidth: shotWidth,
-      windowHeight: shotHeight
-    })
-
-    const pdf = new jsPDF({ orientation, unit: 'mm', format })
-    const pageWidth = pdf.internal.pageSize.getWidth()
-    const pageHeight = pdf.internal.pageSize.getHeight()
-    const contentHeight = pageHeight - margin * 2
-    const imgWidth = pageWidth - margin * 2
-    const imgHeight = (canvas.height * imgWidth) / canvas.width
-    const imgData = canvas.toDataURL('image/jpeg', quality)
-
-    let heightLeft = imgHeight
-    let offsetY = margin
-
-    pdf.addImage(imgData, 'JPEG', margin, offsetY, imgWidth, imgHeight)
-    heightLeft -= contentHeight
-
-    while (heightLeft > 0) {
-      offsetY = margin - (imgHeight - heightLeft)
-      pdf.addPage(format, orientation)
-      pdf.addImage(imgData, 'JPEG', margin, offsetY, imgWidth, imgHeight)
-      heightLeft -= contentHeight
-    }
-
-    const blob = pdf.output('blob')
-    const filename = buildSnapshotFilename('pdf')
-    const file = new File([blob], filename, { type: 'application/pdf' })
-
-    return { ok: true, blob, file, filename }
-  } catch (e) {
-    console.warn('[exportPageHtml] HTML 转 PDF 失败', e)
-    return { ok: false, message: 'HTML 转 PDF 失败' }
-  } finally {
-    unmountHtmlIframe(iframe)
-  }
-}
-
-function shouldSkipElement(el) {
-  if (!el || el.nodeType !== Node.ELEMENT_NODE) return false
-  if (SKIP_TAGS.has(el.tagName.toLowerCase())) return true
-  return SKIP_CLASSES.some((cls) => el.classList?.contains(cls))
-}
-
-function clonePageNode(node) {
-  if (!node) return null
-
-  return safeRun(() => {
-    if (node.nodeType === Node.TEXT_NODE) return node.cloneNode(false)
-    if (node.nodeType !== Node.ELEMENT_NODE) return null
-    if (shouldSkipElement(node)) return null
-
-    const tag = node.tagName.toLowerCase()
-    const cloned = node.cloneNode(false)
-
-    Array.from(node.attributes || []).forEach((attr) => {
-      safeRun(() => cloned.setAttribute(attr.name, attr.value), undefined)
-    })
-
-    if (tag === 'input') {
-      cloned.setAttribute('value', node.value || '')
-      if (node.type === 'checkbox' || node.type === 'radio') {
-        if (node.checked) cloned.setAttribute('checked', 'checked')
-        else cloned.removeAttribute('checked')
-      }
-    }
-    if (tag === 'textarea') {
-      cloned.textContent = node.value || ''
-    }
-    if (tag === 'select') {
-      const idx = node.selectedIndex
-      Array.from(cloned.options || []).forEach((opt, i) => {
-        if (i === idx) opt.setAttribute('selected', 'selected')
-        else opt.removeAttribute('selected')
-      })
-    }
-
-    Array.from(node.childNodes).forEach((child) => {
-      const childClone = clonePageNode(child)
-      if (childClone) cloned.appendChild(childClone)
-    })
-    return cloned
-  }, null, '克隆节点失败')
-}
-
-function unwrapScrollContainers(root) {
-  if (!root?.querySelectorAll) return
-  SCROLL_UNWRAP_SELECTORS.forEach((sel) => {
-    root.querySelectorAll(sel).forEach((el) => {
-      el.style.setProperty('max-height', 'none', 'important')
-      el.style.setProperty('height', 'auto', 'important')
-      el.style.setProperty('overflow', 'visible', 'important')
-    })
-  })
-}
-
-const TABLE_EXPAND_SELECTORS = [
-  '.table-wrap',
-  '.table-content',
-  '.height-100',
-  '.el-table',
-  '.el-table__header-wrapper',
-  '.el-table__body-wrapper',
-  '.el-table__footer-wrapper',
-  '.vxe-table',
-  '.vxe-table--body-wrapper',
-  '.vxe-table--main-wrapper'
-]
-
-/** 克隆/iframe 内展开表格，避免只导出可视区行 */
-function expandTablesForSnapshot(root) {
-  if (!root?.querySelectorAll) return
-
-  unwrapScrollContainers(root)
-
-  TABLE_EXPAND_SELECTORS.forEach((sel) => {
-    root.querySelectorAll(sel).forEach((el) => {
-      el.style.setProperty('height', 'auto', 'important')
-      el.style.setProperty('max-height', 'none', 'important')
-      el.style.setProperty('overflow', 'visible', 'important')
-      el.style.setProperty('flex', 'none', 'important')
-    })
-  })
-
-  root.querySelectorAll('.table-wrap').forEach((wrap) => {
-    wrap.style.setProperty('position', 'relative', 'important')
-    wrap.style.setProperty('min-height', '0', 'important')
-  })
-
-  root.querySelectorAll('.table-content').forEach((content) => {
-    content.style.setProperty('position', 'relative', 'important')
-  })
-
-  root.querySelectorAll('.el-table').forEach((table) => {
-    table.removeAttribute('height')
-  })
-}
-
-/** Element UI 固定列：移除浮层克隆，显示主表中 is-hidden 的序号/复选框列 */
-function normalizeElTableFixedColumns(root) {
-  if (!root?.querySelectorAll) return
-
-  root.querySelectorAll(
-    '.el-table__fixed, .el-table__fixed-right, .el-table__fixed-right-patch'
-  ).forEach((el) => el.remove())
-
-  root.querySelectorAll('.el-table__cell.is-hidden').forEach((cell) => {
-    cell.classList.remove('is-hidden')
-    cell.style.setProperty('visibility', 'visible', 'important')
-    Array.from(cell.children).forEach((child) => {
-      child.style.setProperty('visibility', 'visible', 'important')
-    })
-  })
-}
-
-function expandAndNormalizeTables(root) {
-  expandTablesForSnapshot(root)
-  normalizeElTableFixedColumns(root)
-}
-
-function resizeIframeToContent(iframe) {
-  const body = iframe?.contentDocument?.body
-  if (!body) return
-  expandAndNormalizeTables(body)
-  const height = Math.max(body.scrollHeight, body.offsetHeight, 400)
-  iframe.style.height = `${height}px`
-}
-
-/**
- * 删除页面锚点导航 DOM（N20-anchor 右侧/左侧导航栏）
- * @param {HTMLElement} root
- */
-export function removeAnchorNav(root) {
-  if (!root?.querySelectorAll) return
-
-  root.querySelectorAll('.detpl-edit-form-container.flex-box').forEach((flexBox) => {
-    Array.from(flexBox.children).forEach((child) => {
-      if (child.classList.contains('flex-item')) return
-      if (child.querySelector('.n20-anchor2-nav')) {
-        child.remove()
-      }
-    })
-    flexBox.style?.removeProperty('padding-right')
-  })
-
-  root.querySelectorAll('.n20-anchor, .n20-anchor-left, .n20-anchor2-sidebar').forEach((el) => {
-    el.remove()
-  })
-
-  root.querySelectorAll('.n20-anchor2-nav').forEach((el) => {
-    if (!el.closest('.flex-item')) {
-      el.remove()
-    }
-  })
-}
-
-/** 底部固定提交/操作按钮组选择器 */
-const BOTTOM_OPERATE_SELECTORS = [
-  '.page-button-shadow',
-  '.detpl-form-operate-box',
-  '.self-footer',
-  '.page-footer-shadow'
-]
-
-/**
- * 删除底部固定提交按钮组 DOM
- * @param {HTMLElement} root
- */
-export function removeBottomOperateButtons(root) {
-  if (!root?.querySelectorAll) return
-
-  BOTTOM_OPERATE_SELECTORS.forEach((selector) => {
-    root.querySelectorAll(selector).forEach((el) => el.remove())
-  })
-}
-
-function mergeInlineStyle(el, extraCss) {
-  if (!extraCss) return
-  const prev = el.getAttribute('style') || ''
-  const merged = prev ? `${prev};${extraCss}` : extraCss
-  el.setAttribute('style', merged)
-}
-
-function buildComputedStyleText(el) {
-  const computed = window.getComputedStyle(el)
-  const chunks = []
-
-  INLINE_STYLE_PROPS.forEach((prop) => {
-    const val = computed.getPropertyValue(prop)
-    if (!val || val === 'initial' || val === 'auto' && prop !== 'height' && prop !== 'width') return
-    if (prop === 'background-image' && val === 'none') return
-    chunks.push(`${prop}:${val}`)
-  })
-  return chunks.join(';')
-}
-
-function inlineComputedStyles(sourceEl, cloneEl) {
-  if (!sourceEl || !cloneEl || sourceEl.nodeType !== Node.ELEMENT_NODE) return
-
-  mergeInlineStyle(cloneEl, buildComputedStyleText(sourceEl))
-
-  const srcChildren = sourceEl.children || []
-  const cloneChildren = cloneEl.children || []
-  const len = Math.min(srcChildren.length, cloneChildren.length)
-  for (let i = 0; i < len; i++) {
-    inlineComputedStyles(srcChildren[i], cloneChildren[i])
-  }
-}
-
-function normalizeCssChunk(text) {
-  return (text || '').replace(/\s+/g, ' ').trim()
-}
-
-function collectDocumentCss() {
-  const seen = new Set()
-  const rules = []
-  const processedStyleNodes = new Set()
-
-  const addRule = (cssText) => {
-    const chunk = normalizeCssChunk(cssText)
-    if (!chunk || seen.has(chunk)) return
-    seen.add(chunk)
-    rules.push(cssText.trim())
-  }
-
-  safeRun(() => {
-    Array.from(document.styleSheets || []).forEach((sheet) => {
-      safeRun(() => {
-        const sheetRules = sheet.cssRules || sheet.rules
-        if (sheet.ownerNode) processedStyleNodes.add(sheet.ownerNode)
-        if (!sheetRules) return
-        Array.from(sheetRules).forEach((rule) => {
-          safeRun(() => addRule(rule.cssText), undefined)
-        })
-      }, () => {
-        if (sheet.ownerNode?.tagName === 'STYLE') {
-          processedStyleNodes.add(sheet.ownerNode)
-          addRule(sheet.ownerNode.textContent || '')
-        }
-      })
-    })
-  }, undefined, '遍历样式表失败')
-
-  safeRun(() => {
-    document.querySelectorAll('style').forEach((el) => {
-      if (!processedStyleNodes.has(el)) addRule(el.textContent || '')
-    })
-  }, undefined, '收集 style 标签失败')
-
-  return rules.join('\n')
-}
-
-function captureRootCssVariables() {
-  return safeRun(() => {
-    const styles = getComputedStyle(document.documentElement)
-    const vars = []
-    for (let i = 0; i < styles.length; i++) {
-      const prop = styles[i]
-      if (prop.startsWith('--')) {
-        vars.push(`${prop}:${styles.getPropertyValue(prop)}`)
-      }
-    }
-    return vars.length ? `:root { ${vars.join(';')} }` : ''
-  }, '', '收集 CSS 变量失败')
-}
-
-function stripHeavyFontFaces(css) {
-  return (css || '').replace(/@font-face\s*\{[^}]*font-family\s*:\s*SUN[^}]*\}/gi, '')
-}
-
-function getAppStaticBase() {
-  const base = typeof process !== 'undefined' && process.env?.BASE_URL
-    ? process.env.BASE_URL
-    : '/lms/'
-  try {
-    return new URL(`static/`, new URL(base, window.location.origin)).href
-  } catch (e) {
-    return `${window.location.origin}/lms/static/`
-  }
-}
-
-function getStylesheetBaseUrls() {
-  const bases = new Set([getAppStaticBase(), `${window.location.origin}/`])
-
-  safeRun(() => {
-    document.querySelectorAll('link[rel="stylesheet"][href]').forEach((link) => {
-      bases.add(new URL('.', link.href).href)
-    })
-    Array.from(document.styleSheets || []).forEach((sheet) => {
-      if (!sheet.href) return
-      bases.add(new URL('.', sheet.href).href)
-    })
-  }, undefined)
-
-  return [...bases]
-}
-
-function getLoadedFontResourceUrls() {
-  return safeRun(() => {
-    return performance
-      .getEntriesByType('resource')
-      .filter((entry) => /\.(woff2?|ttf|otf)(\?|$)/i.test(entry.name))
-      .map((entry) => entry.name)
-  }, [], '读取已加载字体资源失败')
-}
-
-function toAbsoluteFontAssetUrl(assetUrl) {
-  if (!assetUrl) return ''
-  if (/^https?:\/\//i.test(assetUrl) || assetUrl.startsWith('data:')) return assetUrl
-  try {
-    return new URL(assetUrl, window.location.origin).href
-  } catch (e) {
-    return assetUrl
-  }
-}
-
-function safeRequireFont(modulePath) {
-  try {
-    return toAbsoluteFontAssetUrl(require(modulePath))
-  } catch (e) {
-    return ''
-  }
-}
-
-/** webpack 解析的图标字体 URL（/gdebit/static/fonts/...） */
-function getWebpackIconFontUrls() {
-  const paths = [
-    'element-ui/lib/theme-chalk/fonts/element-icons.woff',
-    'element-ui/lib/theme-chalk/fonts/element-icons.ttf',
-    'n20-common-lib/src/assets/iconFont2/iconfont.woff2',
-    'n20-common-lib/src/assets/iconFont2/iconfont.woff',
-    'n20-common-lib/src/assets/iconFont2/iconfont.ttf'
-  ]
-
-  return [...new Set(paths.map(safeRequireFont).filter(Boolean))]
-}
-
-const ICON_FONT_FAMILIES = [
-  'element-icons',
-  'core-lib-iconfont',
-  'iconfont',
-  'vxeiconfont'
-]
-
-function escapeRegExp(text) {
-  return text.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')
-}
-
-/** 导出前触发图标字体加载，便于 performance / document.fonts 拿到真实 URL */
-async function ensureIconFontsLoaded() {
-  const probe = document.createElement('div')
-  probe.style.cssText = 'position:absolute;left:-9999px;visibility:hidden;pointer-events:none'
-  probe.innerHTML = [
-    '<i class="el-icon-arrow-down"></i>',
-    '<i class="el-icon-date"></i>',
-    '<i class="n20-icon-yuefenqiehuan-zuoce"></i>',
-    '<i class="vxe-icon-caret-down"></i>'
-  ].join('')
-
-  document.body.appendChild(probe)
-
-  await safeRun(async () => {
-    if (!document.fonts?.load) return
-    const tasks = ICON_FONT_FAMILIES.map((family) => (
-      document.fonts.load(`16px ${family}`).catch(() => {})
-    ))
-    await Promise.all(tasks)
-    await document.fonts.ready
-  }, undefined)
-
-  await new Promise((resolve) => setTimeout(resolve, 120))
-  document.body.removeChild(probe)
-}
-
-function collectFontUrlsFromStyleSheets() {
-  const urls = new Set()
-
-  safeRun(() => {
-    Array.from(document.styleSheets || []).forEach((sheet) => {
-      let rules
-      try {
-        rules = sheet.cssRules
-      } catch (e) {
-        return
-      }
-      if (!rules) return
-
-      const base = sheet.href || window.location.href
-      Array.from(rules).forEach((rule) => {
-        if (rule.type !== CSSRule.FONT_FACE_RULE) return
-        const cssText = rule.cssText || ''
-        if (!/iconfont|element-icons|vxeicon/i.test(cssText)) return
-        for (const match of cssText.matchAll(/url\(\s*["']?([^"')]+)["']?\s*\)/g)) {
-          const raw = match[1].trim()
-          if (raw.startsWith('data:')) {
-            urls.add(raw)
-            continue
-          }
-          safeRun(() => urls.add(new URL(raw, base).href))
-        }
-      })
-    })
-  }, undefined)
-
-  return [...urls]
-}
-
-function getAllIconFontFetchUrls() {
-  const urls = new Set()
-
-  getWebpackIconFontUrls().forEach((url) => urls.add(url))
-  getLoadedFontResourceUrls().forEach((url) => {
-    if (/iconfont|element-icons|vxeicon|\.woff2?|\.ttf|\.otf/i.test(url)) {
-      urls.add(url)
-    }
-  })
-  collectFontUrlsFromStyleSheets().forEach((url) => urls.add(url))
-
-  return [...urls]
-}
-
-function getFilename(url) {
-  return (url || '').split('/').pop().split('?')[0]
-}
-
-function buildFontFetchCandidates(rawUrl) {
-  if (!rawUrl || rawUrl.startsWith('data:') || rawUrl.startsWith('blob:')) {
-    return rawUrl ? [rawUrl] : []
-  }
-
-  const candidates = new Set()
-  const filename = getFilename(rawUrl)
-
-  if (/^https?:\/\//i.test(rawUrl)) {
-    candidates.add(rawUrl)
-  }
-
-  safeRun(() => candidates.add(new URL(rawUrl, window.location.href).href))
-  getStylesheetBaseUrls().forEach((base) => {
-    safeRun(() => candidates.add(new URL(rawUrl, base).href))
-  })
-
-  getAllIconFontFetchUrls().forEach((knownUrl) => {
-    if (knownUrl.includes(filename)) {
-      candidates.add(knownUrl)
-    }
-  })
-
-  return [...candidates]
-}
-
-function isFontBinary(buffer) {
-  if (!buffer || buffer.byteLength < 4) return false
-  const bytes = new Uint8Array(buffer.slice(0, 4))
-  const signature = String.fromCharCode(bytes[0], bytes[1], bytes[2], bytes[3])
-  return (
-    signature === 'wOFF'
-    || signature === 'wOF2'
-    || signature === 'OTTO'
-    || (bytes[0] === 0x00 && bytes[1] === 0x01 && bytes[2] === 0x00 && bytes[3] === 0x00)
-  )
-}
-
-function isFontDataUrl(dataUrl) {
-  if (!dataUrl || typeof dataUrl !== 'string') return false
-  if (!dataUrl.startsWith('data:')) return false
-  if (/^data:text\/html/i.test(dataUrl)) return false
-  if (/^data:application\/json/i.test(dataUrl)) return false
-  if (/^data:image\//i.test(dataUrl)) return false
-  return /^data:font\//i.test(dataUrl) || /^data:application\//i.test(dataUrl)
-}
-
-async function fetchFontAsDataUrl(rawUrl) {
-  const candidates = buildFontFetchCandidates(rawUrl)
-
-  for (const candidate of candidates) {
-    if (candidate.startsWith('data:')) {
-      if (isFontDataUrl(candidate)) return candidate
-      continue
-    }
-
-    try {
-      const resp = await fetch(candidate)
-      if (!resp.ok) continue
-
-      const contentType = resp.headers.get('content-type') || ''
-      if (/text\/html|application\/json/i.test(contentType)) continue
-
-      const buffer = await resp.arrayBuffer()
-      if (!isFontBinary(buffer)) continue
-
-      const blob = new Blob([buffer], {
-        type: contentType || 'application/octet-stream'
-      })
-      const dataUrl = await new Promise((resolve, reject) => {
-        const reader = new FileReader()
-        reader.onload = () => resolve(reader.result)
-        reader.onerror = reject
-        reader.readAsDataURL(blob)
-      })
-
-      if (isFontDataUrl(dataUrl)) return dataUrl
-    } catch (e) {
-      // try next candidate
-    }
-  }
-
-  throw new Error(`font fetch failed: ${rawUrl}`)
-}
-
-function shouldEmbedFontUrl(url) {
-  if (!url || url.startsWith('data:')) return false
-  if (/SIMSUN|simsun/i.test(url)) return false
-  return /iconfont|element-icons|vxeicon|\.woff2?|\.ttf|\.otf/i.test(url)
-}
-
-async function embedIconFonts(css) {
-  await ensureIconFontsLoaded()
-
-  const filenameToData = new Map()
-
-  for (const knownUrl of getAllIconFontFetchUrls()) {
-    const filename = getFilename(knownUrl)
-    if (!filename || filenameToData.has(filename)) continue
-    if (knownUrl.startsWith('data:') && isFontDataUrl(knownUrl)) {
-      filenameToData.set(filename, knownUrl)
-      continue
-    }
-    try {
-      filenameToData.set(filename, await fetchFontAsDataUrl(knownUrl))
-    } catch (e) {
-      // try next source
-    }
-  }
-
-  const rawUrls = [...new Set(
-    [...(css || '').matchAll(/url\(\s*["']?([^"')]+)["']?\s*\)/g)].map((m) => m[1].trim())
-  )]
-
-  for (const rawUrl of rawUrls) {
-    if (!shouldEmbedFontUrl(rawUrl)) continue
-    const filename = getFilename(rawUrl)
-    if (filenameToData.has(filename)) continue
-    try {
-      filenameToData.set(filename, await fetchFontAsDataUrl(rawUrl))
-    } catch (e) {
-      console.warn('[exportPageHtml] 字体内嵌失败', rawUrl, e)
-    }
-  }
-
-  let result = css
-  filenameToData.forEach((dataUrl, filename) => {
-    const pattern = new RegExp(
-      `url\\(\\s*["']?[^"')]*${escapeRegExp(filename)}[^"')]*["']?\\s*\\)`,
-      'gi'
-    )
-    result = result.replace(pattern, `url("${dataUrl}")`)
-  })
-
-  result = result.replace(
-    /url\(\s*["']?data:text\/html[^"')]+["']?\s*\)/gi,
-    'url("")'
-  )
-
-  return result
-}
-
-function downloadBlob(blob, filename) {
-  safeRun(() => {
-    const url = URL.createObjectURL(blob)
-    const a = document.createElement('a')
-    a.href = url
-    a.download = filename
-    document.body.appendChild(a)
-    a.click()
-    document.body.removeChild(a)
-    URL.revokeObjectURL(url)
-  }, undefined, '下载失败')
-}
-
-function normalizeOptions(options) {
-  if (typeof options === 'boolean') {
-    return { autoDownload: options, inlineStyles: false, embedFonts: true, forPdf: false, toPdf: false, pdfOptions: {} }
-  }
-  const merged = {
-    autoDownload: false,
-    inlineStyles: false,
-    embedFonts: true,
-    forPdf: false,
-    toPdf: false,
-    pdfOptions: {},
-    ...(options || {})
-  }
-  if (merged.toPdf) merged.forPdf = true
-  return merged
-}
-
-/**
- * 构建高保真页面 HTML 快照
- * @param {HTMLElement} rootEl
- * @param {{ autoDownload?: boolean, inlineStyles?: boolean, embedFonts?: boolean, forPdf?: boolean, toPdf?: boolean, pdfOptions?: object }} [options]
- */
-export async function buildPageHtmlSnapshot(rootEl, options = {}) {
-  const { inlineStyles, embedFonts, forPdf } = normalizeOptions(options)
-
-  if (!rootEl || rootEl.nodeType !== Node.ELEMENT_NODE) {
-    return { ok: false, message: '未找到页面内容' }
-  }
-
-  try {
-    if (embedFonts) {
-      await ensureIconFontsLoaded()
-    }
-
-    const filename = buildSnapshotFilename()
-    const pageTitle = document.title || SNAPSHOT_FILENAME_PREFIX
-    const ts = filename.replace(`${SNAPSHOT_FILENAME_PREFIX}-`, '').replace('.html', '')
-
-    const pageClone = clonePageNode(rootEl)
-    if (!pageClone) return { ok: false, message: '克隆页面失败' }
-
-    unwrapScrollContainers(pageClone)
-    expandAndNormalizeTables(pageClone)
-    removeAnchorNav(pageClone)
-    removeBottomOperateButtons(pageClone)
-
-    const pageHtml = pageClone.outerHTML
-    if (!pageHtml) return { ok: false, message: '生成页面 HTML 失败' }
-
-    let css = [
-      captureRootCssVariables(),
-      stripHeavyFontFaces(collectDocumentCss()),
-      SNAPSHOT_BASE_CSS,
-      forPdf ? SNAPSHOT_PDF_CSS : ''
-    ].filter(Boolean).join('\n')
-
-    if (embedFonts) {
-      css = await embedIconFonts(css)
-    }
-
-    const html = `<!DOCTYPE html>
-<html lang="zh-CN">
-<head>
-<meta charset="UTF-8">
-<meta name="viewport" content="width=device-width, initial-scale=1.0">
-<title>${pageTitle} - ${ts}</title>
-<style>
-${css}
-</style>
-</head>
-<body>
-${pageHtml}
-${PAGE_SNAPSHOT_BACKEND_PLACEHOLDER}
-</body>
-</html>`
-
-    const blob = new Blob([html], { type: 'text/html;charset=utf-8' })
-    const file = new File([blob], filename, { type: blob.type })
-
-    return { ok: true, html, filename, blob, file, ts, pageTitle }
-  } catch (e) {
-    console.warn('[exportPageHtml] 构建页面快照失败', e)
-    return { ok: false, message: '构建页面快照失败' }
-  }
-}
-
-/**
- * @param {HTMLElement} rootEl
- * @param {boolean|object} [options]
- */
-export async function exportPageHtml(rootEl, options = false) {
-  const opts = normalizeOptions(options)
-  if (opts.toPdf) return exportPagePdf(rootEl, opts)
-
-  const { autoDownload, toPdf, pdfOptions, ...rest } = opts
-  const result = await buildPageHtmlSnapshot(rootEl, rest)
-
-  if (!result.ok) return result
-  if (autoDownload) downloadBlob(result.blob, result.filename)
-  return result
-}
-
-/**
- * 导出页面快照为 PDF（先构建 HTML，再转为 PDF）
- * @param {HTMLElement} rootEl
- * @param {boolean|object} [options]
- */
-export async function exportPagePdf(rootEl, options = false) {
-  const { autoDownload, pdfOptions, toPdf, ...rest } = normalizeOptions({
-    ...(typeof options === 'boolean' ? { autoDownload: options } : options),
-    forPdf: true,
-    toPdf: true
-  })
-
-  const htmlResult = await buildPageHtmlSnapshot(rootEl, rest)
-  if (!htmlResult.ok) return htmlResult
-
-  const captureWidth = Math.ceil(rootEl.getBoundingClientRect().width)
-    || document.documentElement.clientWidth
-    || 1400
-  const pdfResult = await convertHtmlSnapshotToPdf(htmlResult.html, {
-    ...pdfOptions,
-    captureWidth
-  })
-  if (!pdfResult.ok) return pdfResult
-
-  const result = {
-    ok: true,
-    html: htmlResult.html,
-    htmlFilename: htmlResult.filename,
-    htmlBlob: htmlResult.blob,
-    htmlFile: htmlResult.file,
-    filename: pdfResult.filename,
-    blob: pdfResult.blob,
-    file: pdfResult.file,
-    ts: htmlResult.ts,
-    pageTitle: htmlResult.pageTitle
-  }
-
-  if (autoDownload) downloadBlob(pdfResult.blob, pdfResult.filename)
-  return result
-}
-
-/**
- * 点击导出：生成 PDF 并触发浏览器下载
- * @param {HTMLElement} rootEl
- * @param {object} [options]
- */
-export async function downloadPageSnapshotPdf(rootEl, options = {}) {
-  return exportPagePdf(rootEl, { ...(options || {}), autoDownload: true })
-}
-
-/** @deprecated 兼容旧名，与 exportPageHtml 相同 */
-export const exportPageSnapshot = exportPageHtml
-
-/**
- * 上传用 FormData
- * @param {HTMLElement} rootEl
- * @param {object} [options]
- */
-export async function createPageHtmlFormData(rootEl, options = {}) {
-  const opts = normalizeOptions(options)
-  if (opts.toPdf) {
-    const built = await exportPagePdf(rootEl, { ...opts, autoDownload: false })
-    if (!built.ok) return built
-
-    return safeRun(() => {
-      const formData = new FormData()
-      formData.append('file', built.file, built.filename)
-      return {
-        ok: true,
-        formData,
-        file: built.file,
-        blob: built.blob,
-        filename: built.filename,
-        html: built.html
-      }
-    }, { ok: false, message: '构建上传数据失败' }, '构建 FormData 失败')
-  }
-
-  const built = await buildPageHtmlSnapshot(rootEl, opts)
-  if (!built.ok) return built
-
-  return safeRun(() => {
-    const formData = new FormData()
-    formData.append('file', built.file, built.filename)
-    return {
-      ok: true,
-      formData,
-      file: built.file,
-      blob: built.blob,
-      filename: built.filename,
-      html: built.html
-    }
-  }, { ok: false, message: '构建上传数据失败' }, '构建 FormData 失败')
-}
+/**
+ * 高保真页面 HTML 快照导出（Vue2 页面适用）
+ *
+ * 相比 gcs-ui-lib/exportPageSnapshot：
+ * - 不做 CSS 裁剪，保留文档全部可访问样式
+ * - 克隆节点后内联关键 computed 布局样式，提升离线还原度
+ * - 内嵌图标字体（woff/woff2），跳过大体积宋体
+ * - 默认不注入 PDF 专用覆盖样式，避免表格/字号被压扁
+ */
+
+export const PAGE_SNAPSHOT_BACKEND_PLACEHOLDER = '<!-- PAGE_SNAPSHOT_BACKEND_PLACEHOLDER -->'
+
+const SNAPSHOT_FILENAME_PREFIX = 'page-snapshot'
+const SKIP_TAGS = new Set(['script', 'style', 'link', 'noscript', 'svg'])
+const SKIP_CLASSES = [
+  'page-snapshot-btn',
+  'page-button-shadow',
+  'detpl-form-operate-box',
+  'self-footer'
+]
+
+const SCROLL_UNWRAP_SELECTORS = [
+  '.el-table__body-wrapper',
+  '.el-table__fixed-body-wrapper',
+  '.el-scrollbar__wrap',
+  '.el-scrollbar__view',
+  '.vxe-table--body-wrapper',
+  '.vxe-table--body-inner-wrapper',
+  '.vxe-table--main-wrapper'
+]
+
+/** 内联 computed 样式时关注的属性（布局 + 常见视觉） */
+const INLINE_STYLE_PROPS = [
+  'display', 'flex', 'flex-direction', 'flex-wrap', 'flex-grow', 'flex-shrink', 'flex-basis',
+  'align-items', 'align-self', 'align-content', 'justify-content', 'justify-self', 'gap', 'row-gap', 'column-gap',
+  'grid-template-columns', 'grid-template-rows', 'grid-column', 'grid-row',
+  'position', 'top', 'right', 'bottom', 'left', 'z-index', 'float', 'clear',
+  'width', 'height', 'min-width', 'min-height', 'max-width', 'max-height',
+  'margin', 'margin-top', 'margin-right', 'margin-bottom', 'margin-left',
+  'padding', 'padding-top', 'padding-right', 'padding-bottom', 'padding-left',
+  'box-sizing', 'overflow', 'overflow-x', 'overflow-y',
+  'border', 'border-top', 'border-right', 'border-bottom', 'border-left',
+  'border-radius', 'border-collapse', 'table-layout',
+  'background', 'background-color', 'background-image', 'background-size', 'background-position',
+  'color', 'font-size', 'font-weight', 'font-style', 'line-height', 'letter-spacing',
+  'text-align', 'text-decoration', 'vertical-align', 'white-space', 'word-break', 'word-wrap',
+  'opacity', 'visibility', 'box-shadow', 'transform'
+]
+
+const SNAPSHOT_BASE_CSS = `
+html, body {
+  margin: 0;
+  padding: 8px;
+  background: #fff;
+  -webkit-print-color-adjust: exact;
+  print-color-adjust: exact;
+}
+
+n20-page,
+[class$="-wrap"],
+.n20-page-content,
+.page-content,
+.action-parse-form-container {
+  height: auto !important;
+  max-height: none !important;
+  overflow: visible !important;
+}
+
+.el-dialog__wrapper,
+.el-message,
+.el-message-box__wrapper,
+.el-notification,
+.el-loading-mask,
+.page-snapshot-btn,
+.page-button-shadow {
+  display: none !important;
+}
+`
+
+const SNAPSHOT_PDF_CSS = `
+@page { size: A4 landscape; margin: 15mm; }
+html, body { font-family: SimSun, "Songti SC", "Microsoft YaHei", serif; font-size: 10px; line-height: 1.4; }
+td, th { white-space: normal !important; padding: 4px; font-size: 10px; vertical-align: top; }
+`
+
+function safeRun(fn, fallback, label) {
+  try {
+    return fn()
+  } catch (e) {
+    if (label) console.warn(`[exportPageHtml] ${label}`, e)
+    return fallback
+  }
+}
+
+function buildSnapshotFilename() {
+  const ts = new Date().toISOString().replace(/[:.]/g, '-').slice(0, 19)
+  return `${SNAPSHOT_FILENAME_PREFIX}-${ts}.html`
+}
+
+function shouldSkipElement(el) {
+  if (!el || el.nodeType !== Node.ELEMENT_NODE) return false
+  if (SKIP_TAGS.has(el.tagName.toLowerCase())) return true
+  return SKIP_CLASSES.some((cls) => el.classList?.contains(cls))
+}
+
+function clonePageNode(node) {
+  if (!node) return null
+
+  return safeRun(() => {
+    if (node.nodeType === Node.TEXT_NODE) return node.cloneNode(false)
+    if (node.nodeType !== Node.ELEMENT_NODE) return null
+    if (shouldSkipElement(node)) return null
+
+    const tag = node.tagName.toLowerCase()
+    const cloned = node.cloneNode(false)
+
+    Array.from(node.attributes || []).forEach((attr) => {
+      safeRun(() => cloned.setAttribute(attr.name, attr.value), undefined)
+    })
+
+    if (tag === 'input') {
+      cloned.setAttribute('value', node.value || '')
+      if (node.type === 'checkbox' || node.type === 'radio') {
+        if (node.checked) cloned.setAttribute('checked', 'checked')
+        else cloned.removeAttribute('checked')
+      }
+    }
+    if (tag === 'textarea') {
+      cloned.textContent = node.value || ''
+    }
+    if (tag === 'select') {
+      const idx = node.selectedIndex
+      Array.from(cloned.options || []).forEach((opt, i) => {
+        if (i === idx) opt.setAttribute('selected', 'selected')
+        else opt.removeAttribute('selected')
+      })
+    }
+
+    Array.from(node.childNodes).forEach((child) => {
+      const childClone = clonePageNode(child)
+      if (childClone) cloned.appendChild(childClone)
+    })
+    return cloned
+  }, null, '克隆节点失败')
+}
+
+function unwrapScrollContainers(root) {
+  if (!root?.querySelectorAll) return
+  SCROLL_UNWRAP_SELECTORS.forEach((sel) => {
+    root.querySelectorAll(sel).forEach((el) => {
+      el.style.maxHeight = 'none'
+      el.style.height = 'auto'
+      el.style.overflow = 'visible'
+    })
+  })
+}
+
+/**
+ * 删除页面锚点导航 DOM（N20-anchor 右侧/左侧导航栏）
+ * @param {HTMLElement} root
+ */
+export function removeAnchorNav(root) {
+  if (!root?.querySelectorAll) return
+
+  root.querySelectorAll('.detpl-edit-form-container.flex-box').forEach((flexBox) => {
+    Array.from(flexBox.children).forEach((child) => {
+      if (child.classList.contains('flex-item')) return
+      if (child.querySelector('.n20-anchor2-nav')) {
+        child.remove()
+      }
+    })
+    flexBox.style?.removeProperty('padding-right')
+  })
+
+  root.querySelectorAll('.n20-anchor, .n20-anchor-left, .n20-anchor2-sidebar').forEach((el) => {
+    el.remove()
+  })
+
+  root.querySelectorAll('.n20-anchor2-nav').forEach((el) => {
+    if (!el.closest('.flex-item')) {
+      el.remove()
+    }
+  })
+}
+
+/** 底部固定提交/操作按钮组选择器 */
+const BOTTOM_OPERATE_SELECTORS = [
+  '.page-button-shadow',
+  '.detpl-form-operate-box',
+  '.self-footer',
+  '.page-footer-shadow'
+]
+
+/**
+ * 删除底部固定提交按钮组 DOM
+ * @param {HTMLElement} root
+ */
+export function removeBottomOperateButtons(root) {
+  if (!root?.querySelectorAll) return
+
+  BOTTOM_OPERATE_SELECTORS.forEach((selector) => {
+    root.querySelectorAll(selector).forEach((el) => el.remove())
+  })
+}
+
+function mergeInlineStyle(el, extraCss) {
+  if (!extraCss) return
+  const prev = el.getAttribute('style') || ''
+  const merged = prev ? `${prev};${extraCss}` : extraCss
+  el.setAttribute('style', merged)
+}
+
+function buildComputedStyleText(el) {
+  const computed = window.getComputedStyle(el)
+  const chunks = []
+
+  INLINE_STYLE_PROPS.forEach((prop) => {
+    const val = computed.getPropertyValue(prop)
+    if (!val || val === 'initial' || val === 'auto' && prop !== 'height' && prop !== 'width') return
+    if (prop === 'background-image' && val === 'none') return
+    chunks.push(`${prop}:${val}`)
+  })
+  return chunks.join(';')
+}
+
+function inlineComputedStyles(sourceEl, cloneEl) {
+  if (!sourceEl || !cloneEl || sourceEl.nodeType !== Node.ELEMENT_NODE) return
+
+  mergeInlineStyle(cloneEl, buildComputedStyleText(sourceEl))
+
+  const srcChildren = sourceEl.children || []
+  const cloneChildren = cloneEl.children || []
+  const len = Math.min(srcChildren.length, cloneChildren.length)
+  for (let i = 0; i < len; i++) {
+    inlineComputedStyles(srcChildren[i], cloneChildren[i])
+  }
+}
+
+function normalizeCssChunk(text) {
+  return (text || '').replace(/\s+/g, ' ').trim()
+}
+
+function collectDocumentCss() {
+  const seen = new Set()
+  const rules = []
+  const processedStyleNodes = new Set()
+
+  const addRule = (cssText) => {
+    const chunk = normalizeCssChunk(cssText)
+    if (!chunk || seen.has(chunk)) return
+    seen.add(chunk)
+    rules.push(cssText.trim())
+  }
+
+  safeRun(() => {
+    Array.from(document.styleSheets || []).forEach((sheet) => {
+      safeRun(() => {
+        const sheetRules = sheet.cssRules || sheet.rules
+        if (sheet.ownerNode) processedStyleNodes.add(sheet.ownerNode)
+        if (!sheetRules) return
+        Array.from(sheetRules).forEach((rule) => {
+          safeRun(() => addRule(rule.cssText), undefined)
+        })
+      }, () => {
+        if (sheet.ownerNode?.tagName === 'STYLE') {
+          processedStyleNodes.add(sheet.ownerNode)
+          addRule(sheet.ownerNode.textContent || '')
+        }
+      })
+    })
+  }, undefined, '遍历样式表失败')
+
+  safeRun(() => {
+    document.querySelectorAll('style').forEach((el) => {
+      if (!processedStyleNodes.has(el)) addRule(el.textContent || '')
+    })
+  }, undefined, '收集 style 标签失败')
+
+  return rules.join('\n')
+}
+
+function captureRootCssVariables() {
+  return safeRun(() => {
+    const styles = getComputedStyle(document.documentElement)
+    const vars = []
+    for (let i = 0; i < styles.length; i++) {
+      const prop = styles[i]
+      if (prop.startsWith('--')) {
+        vars.push(`${prop}:${styles.getPropertyValue(prop)}`)
+      }
+    }
+    return vars.length ? `:root { ${vars.join(';')} }` : ''
+  }, '', '收集 CSS 变量失败')
+}
+
+function stripHeavyFontFaces(css) {
+  return (css || '').replace(/@font-face\s*\{[^}]*font-family\s*:\s*SUN[^}]*\}/gi, '')
+}
+
+function getAppStaticBase() {
+  const base = typeof process !== 'undefined' && process.env?.BASE_URL
+    ? process.env.BASE_URL
+    : '/gdebit/'
+  try {
+    return new URL(`static/`, new URL(base, window.location.origin)).href
+  } catch (e) {
+    return `${window.location.origin}/gdebit/static/`
+  }
+}
+
+function getStylesheetBaseUrls() {
+  const bases = new Set([getAppStaticBase(), `${window.location.origin}/`])
+
+  safeRun(() => {
+    document.querySelectorAll('link[rel="stylesheet"][href]').forEach((link) => {
+      bases.add(new URL('.', link.href).href)
+    })
+    Array.from(document.styleSheets || []).forEach((sheet) => {
+      if (!sheet.href) return
+      bases.add(new URL('.', sheet.href).href)
+    })
+  }, undefined)
+
+  return [...bases]
+}
+
+function getLoadedFontResourceUrls() {
+  return safeRun(() => {
+    return performance
+      .getEntriesByType('resource')
+      .filter((entry) => /\.(woff2?|ttf|otf)(\?|$)/i.test(entry.name))
+      .map((entry) => entry.name)
+  }, [], '读取已加载字体资源失败')
+}
+
+function toAbsoluteFontAssetUrl(assetUrl) {
+  if (!assetUrl) return ''
+  if (/^https?:\/\//i.test(assetUrl) || assetUrl.startsWith('data:')) return assetUrl
+  try {
+    return new URL(assetUrl, window.location.origin).href
+  } catch (e) {
+    return assetUrl
+  }
+}
+
+function safeRequireFont(modulePath) {
+  try {
+    return toAbsoluteFontAssetUrl(require(modulePath))
+  } catch (e) {
+    return ''
+  }
+}
+
+/** webpack 解析的图标字体 URL（/gdebit/static/fonts/...） */
+function getWebpackIconFontUrls() {
+  const paths = [
+    'element-ui/lib/theme-chalk/fonts/element-icons.woff',
+    'element-ui/lib/theme-chalk/fonts/element-icons.ttf',
+    'n20-common-lib/src/assets/iconFont2/iconfont.woff2',
+    'n20-common-lib/src/assets/iconFont2/iconfont.woff',
+    'n20-common-lib/src/assets/iconFont2/iconfont.ttf'
+  ]
+
+  return [...new Set(paths.map(safeRequireFont).filter(Boolean))]
+}
+
+const ICON_FONT_FAMILIES = [
+  'element-icons',
+  'core-lib-iconfont',
+  'iconfont',
+  'vxeiconfont'
+]
+
+function escapeRegExp(text) {
+  return text.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')
+}
+
+/** 导出前触发图标字体加载，便于 performance / document.fonts 拿到真实 URL */
+async function ensureIconFontsLoaded() {
+  const probe = document.createElement('div')
+  probe.style.cssText = 'position:absolute;left:-9999px;visibility:hidden;pointer-events:none'
+  probe.innerHTML = [
+    '<i class="el-icon-arrow-down"></i>',
+    '<i class="el-icon-date"></i>',
+    '<i class="n20-icon-yuefenqiehuan-zuoce"></i>',
+    '<i class="vxe-icon-caret-down"></i>'
+  ].join('')
+
+  document.body.appendChild(probe)
+
+  await safeRun(async () => {
+    if (!document.fonts?.load) return
+    const tasks = ICON_FONT_FAMILIES.map((family) => (
+      document.fonts.load(`16px ${family}`).catch(() => {})
+    ))
+    await Promise.all(tasks)
+    await document.fonts.ready
+  }, undefined)
+
+  await new Promise((resolve) => setTimeout(resolve, 120))
+  document.body.removeChild(probe)
+}
+
+function collectFontUrlsFromStyleSheets() {
+  const urls = new Set()
+
+  safeRun(() => {
+    Array.from(document.styleSheets || []).forEach((sheet) => {
+      let rules
+      try {
+        rules = sheet.cssRules
+      } catch (e) {
+        return
+      }
+      if (!rules) return
+
+      const base = sheet.href || window.location.href
+      Array.from(rules).forEach((rule) => {
+        if (rule.type !== CSSRule.FONT_FACE_RULE) return
+        const cssText = rule.cssText || ''
+        if (!/iconfont|element-icons|vxeicon/i.test(cssText)) return
+        for (const match of cssText.matchAll(/url\(\s*["']?([^"')]+)["']?\s*\)/g)) {
+          const raw = match[1].trim()
+          if (raw.startsWith('data:')) {
+            urls.add(raw)
+            continue
+          }
+          safeRun(() => urls.add(new URL(raw, base).href))
+        }
+      })
+    })
+  }, undefined)
+
+  return [...urls]
+}
+
+function getAllIconFontFetchUrls() {
+  const urls = new Set()
+
+  getWebpackIconFontUrls().forEach((url) => urls.add(url))
+  getLoadedFontResourceUrls().forEach((url) => {
+    if (/iconfont|element-icons|vxeicon|\.woff2?|\.ttf|\.otf/i.test(url)) {
+      urls.add(url)
+    }
+  })
+  collectFontUrlsFromStyleSheets().forEach((url) => urls.add(url))
+
+  return [...urls]
+}
+
+function getFilename(url) {
+  return (url || '').split('/').pop().split('?')[0]
+}
+
+function buildFontFetchCandidates(rawUrl) {
+  if (!rawUrl || rawUrl.startsWith('data:') || rawUrl.startsWith('blob:')) {
+    return rawUrl ? [rawUrl] : []
+  }
+
+  const candidates = new Set()
+  const filename = getFilename(rawUrl)
+
+  if (/^https?:\/\//i.test(rawUrl)) {
+    candidates.add(rawUrl)
+  }
+
+  safeRun(() => candidates.add(new URL(rawUrl, window.location.href).href))
+  getStylesheetBaseUrls().forEach((base) => {
+    safeRun(() => candidates.add(new URL(rawUrl, base).href))
+  })
+
+  getAllIconFontFetchUrls().forEach((knownUrl) => {
+    if (knownUrl.includes(filename)) {
+      candidates.add(knownUrl)
+    }
+  })
+
+  return [...candidates]
+}
+
+function isFontBinary(buffer) {
+  if (!buffer || buffer.byteLength < 4) return false
+  const bytes = new Uint8Array(buffer.slice(0, 4))
+  const signature = String.fromCharCode(bytes[0], bytes[1], bytes[2], bytes[3])
+  return (
+    signature === 'wOFF'
+    || signature === 'wOF2'
+    || signature === 'OTTO'
+    || (bytes[0] === 0x00 && bytes[1] === 0x01 && bytes[2] === 0x00 && bytes[3] === 0x00)
+  )
+}
+
+function isFontDataUrl(dataUrl) {
+  if (!dataUrl || typeof dataUrl !== 'string') return false
+  if (!dataUrl.startsWith('data:')) return false
+  if (/^data:text\/html/i.test(dataUrl)) return false
+  if (/^data:application\/json/i.test(dataUrl)) return false
+  if (/^data:image\//i.test(dataUrl)) return false
+  return /^data:font\//i.test(dataUrl) || /^data:application\//i.test(dataUrl)
+}
+
+async function fetchFontAsDataUrl(rawUrl) {
+  const candidates = buildFontFetchCandidates(rawUrl)
+
+  for (const candidate of candidates) {
+    if (candidate.startsWith('data:')) {
+      if (isFontDataUrl(candidate)) return candidate
+      continue
+    }
+
+    try {
+      const resp = await fetch(candidate)
+      if (!resp.ok) continue
+
+      const contentType = resp.headers.get('content-type') || ''
+      if (/text\/html|application\/json/i.test(contentType)) continue
+
+      const buffer = await resp.arrayBuffer()
+      if (!isFontBinary(buffer)) continue
+
+      const blob = new Blob([buffer], {
+        type: contentType || 'application/octet-stream'
+      })
+      const dataUrl = await new Promise((resolve, reject) => {
+        const reader = new FileReader()
+        reader.onload = () => resolve(reader.result)
+        reader.onerror = reject
+        reader.readAsDataURL(blob)
+      })
+
+      if (isFontDataUrl(dataUrl)) return dataUrl
+    } catch (e) {
+      // try next candidate
+    }
+  }
+
+  throw new Error(`font fetch failed: ${rawUrl}`)
+}
+
+function shouldEmbedFontUrl(url) {
+  if (!url || url.startsWith('data:')) return false
+  if (/SIMSUN|simsun/i.test(url)) return false
+  return /iconfont|element-icons|vxeicon|\.woff2?|\.ttf|\.otf/i.test(url)
+}
+
+async function embedIconFonts(css) {
+  await ensureIconFontsLoaded()
+
+  const filenameToData = new Map()
+
+  for (const knownUrl of getAllIconFontFetchUrls()) {
+    const filename = getFilename(knownUrl)
+    if (!filename || filenameToData.has(filename)) continue
+    if (knownUrl.startsWith('data:') && isFontDataUrl(knownUrl)) {
+      filenameToData.set(filename, knownUrl)
+      continue
+    }
+    try {
+      filenameToData.set(filename, await fetchFontAsDataUrl(knownUrl))
+    } catch (e) {
+      // try next source
+    }
+  }
+
+  const rawUrls = [...new Set(
+    [...(css || '').matchAll(/url\(\s*["']?([^"')]+)["']?\s*\)/g)].map((m) => m[1].trim())
+  )]
+
+  for (const rawUrl of rawUrls) {
+    if (!shouldEmbedFontUrl(rawUrl)) continue
+    const filename = getFilename(rawUrl)
+    if (filenameToData.has(filename)) continue
+    try {
+      filenameToData.set(filename, await fetchFontAsDataUrl(rawUrl))
+    } catch (e) {
+      console.warn('[exportPageHtml] 字体内嵌失败', rawUrl, e)
+    }
+  }
+
+  let result = css
+  filenameToData.forEach((dataUrl, filename) => {
+    const pattern = new RegExp(
+      `url\\(\\s*["']?[^"')]*${escapeRegExp(filename)}[^"')]*["']?\\s*\\)`,
+      'gi'
+    )
+    result = result.replace(pattern, `url("${dataUrl}")`)
+  })
+
+  result = result.replace(
+    /url\(\s*["']?data:text\/html[^"')]+["']?\s*\)/gi,
+    'url("")'
+  )
+
+  return result
+}
+
+function downloadBlob(blob, filename) {
+  safeRun(() => {
+    const url = URL.createObjectURL(blob)
+    const a = document.createElement('a')
+    a.href = url
+    a.download = filename
+    document.body.appendChild(a)
+    a.click()
+    document.body.removeChild(a)
+    URL.revokeObjectURL(url)
+  }, undefined, '下载失败')
+}
+
+function normalizeOptions(options) {
+  if (typeof options === 'boolean') {
+    return { autoDownload: options, inlineStyles: false, embedFonts: true, forPdf: false }
+  }
+  return {
+    autoDownload: false,
+    inlineStyles: false,
+    embedFonts: true,
+    forPdf: false,
+    ...(options || {})
+  }
+}
+
+/**
+ * 构建高保真页面 HTML 快照
+ * @param {HTMLElement} rootEl
+ * @param {{ autoDownload?: boolean, inlineStyles?: boolean, embedFonts?: boolean, forPdf?: boolean }} [options]
+ */
+export async function buildPageHtmlSnapshot(rootEl, options = {}) {
+  const { inlineStyles, embedFonts, forPdf } = normalizeOptions(options)
+
+  if (!rootEl || rootEl.nodeType !== Node.ELEMENT_NODE) {
+    return { ok: false, message: '未找到页面内容' }
+  }
+
+  try {
+    if (embedFonts) {
+      await ensureIconFontsLoaded()
+    }
+
+    const filename = buildSnapshotFilename()
+    const pageTitle = document.title || SNAPSHOT_FILENAME_PREFIX
+    const ts = filename.replace(`${SNAPSHOT_FILENAME_PREFIX}-`, '').replace('.html', '')
+
+    const pageClone = clonePageNode(rootEl)
+    if (!pageClone) return { ok: false, message: '克隆页面失败' }
+
+    unwrapScrollContainers(pageClone)
+    removeAnchorNav(pageClone)
+    removeBottomOperateButtons(pageClone)
+
+    const pageHtml = pageClone.outerHTML
+    if (!pageHtml) return { ok: false, message: '生成页面 HTML 失败' }
+
+    let css = [
+      captureRootCssVariables(),
+      stripHeavyFontFaces(collectDocumentCss()),
+      SNAPSHOT_BASE_CSS,
+      forPdf ? SNAPSHOT_PDF_CSS : ''
+    ].filter(Boolean).join('\n')
+
+    if (embedFonts) {
+      css = await embedIconFonts(css)
+    }
+
+    const html = `<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>${pageTitle} - ${ts}</title>
+<style>
+${css}
+</style>
+</head>
+<body>
+${pageHtml}
+${PAGE_SNAPSHOT_BACKEND_PLACEHOLDER}
+</body>
+</html>`
+
+    const blob = new Blob([html], { type: 'text/html;charset=utf-8' })
+    const file = new File([blob], filename, { type: blob.type })
+
+    return { ok: true, html, filename, blob, file, ts, pageTitle }
+  } catch (e) {
+    console.warn('[exportPageHtml] 构建页面快照失败', e)
+    return { ok: false, message: '构建页面快照失败' }
+  }
+}
+
+/**
+ * @param {HTMLElement} rootEl
+ * @param {boolean|object} [options]
+ */
+export async function exportPageHtml(rootEl, options = false) {
+  const { autoDownload, ...rest } = normalizeOptions(options)
+  const result = await buildPageHtmlSnapshot(rootEl, rest)
+
+  if (!result.ok) return result
+  if (autoDownload) downloadBlob(result.blob, result.filename)
+  return result
+}
+
+/** @deprecated 兼容旧名，与 exportPageHtml 相同 */
+export const exportPageSnapshot = exportPageHtml
+
+/**
+ * 上传用 FormData
+ * @param {HTMLElement} rootEl
+ * @param {object} [options]
+ */
+export async function createPageHtmlFormData(rootEl, options = {}) {
+  const built = await buildPageHtmlSnapshot(rootEl, options)
+  if (!built.ok) return built
+
+  return safeRun(() => {
+    const formData = new FormData()
+    formData.append('file', built.file, built.filename)
+    return {
+      ok: true,
+      formData,
+      file: built.file,
+      blob: built.blob,
+      filename: built.filename,
+      html: built.html
+    }
+  }, { ok: false, message: '构建上传数据失败' }, '构建 FormData 失败')
+}