import { asBlob } from 'html-docx-js-typescript'
import { saveAs } from 'file-saver'
import $ from 'jquery'

/**
 * 将图片 URL 转为 base64 Data URI
 * 优先使用 fetch，失败后尝试 Image + Canvas 方式
 */
async function imgToBase64(src) {
  // 方式1：fetch
  try {
    const res = await fetch(src)
    if (res.ok) {
      const blob = await res.blob()
      return await blobToDataUri(blob)
    }
  } catch (e) {
    console.warn('fetch 图片失败，尝试 canvas 方式:', src, e)
  }

  // 方式2：Image + Canvas（可绕过部分限制）
  try {
    return await loadImageAsBase64(src)
  } catch (e) {
    console.warn('canvas 转换图片失败:', src, e)
  }

  return null
}

function blobToDataUri(blob) {
  return new Promise((resolve, reject) => {
    const reader = new FileReader()
    reader.onloadend = () => resolve(reader.result)
    reader.onerror = reject
    reader.readAsDataURL(blob)
  })
}

function loadImageAsBase64(src) {
  return new Promise((resolve, reject) => {
    const img = new Image()
    img.crossOrigin = 'anonymous'
    img.onload = () => {
      try {
        const canvas = document.createElement('canvas')
        canvas.width = img.naturalWidth
        canvas.height = img.naturalHeight
        const ctx = canvas.getContext('2d')
        ctx.drawImage(img, 0, 0)
        resolve(canvas.toDataURL('image/png'))
      } catch (e) {
        reject(e)
      }
    }
    img.onerror = reject
    img.src = src
  })
}

/**
 * 将 DOM 中所有 img 的 src 替换为 base64 Data URI
 */
async function convertImagesToBase64(docEl) {
  const imgs = docEl.querySelectorAll('img')
  const tasks = Array.from(imgs).map(async (img) => {
    const src = img.getAttribute('src')
    if (!src || src.startsWith('data:')) return

    // 处理相对路径和协议相对路径
    let absoluteSrc = src
    if (src.startsWith('//')) {
      absoluteSrc = window.location.protocol + src
    } else if (src.startsWith('/')) {
      absoluteSrc = window.location.origin + src
    } else if (!src.startsWith('http')) {
      absoluteSrc = new URL(src, window.location.href).href
    }

    const dataUri = await imgToBase64(absoluteSrc)
    if (dataUri) {
      img.setAttribute('src', dataUri)
    } else {
      console.warn('图片转 base64 失败，已跳过:', absoluteSrc)
      img.remove()
    }
  })
  await Promise.all(tasks)
}

/**
 * 使用 html-docx-js-typescript 将 HTML 内容导出为 Word 文档（.docx）
 * 图片会自动转为 base64 内嵌到文档中
 * @param {string} name - 文件名（不含扩展名）
 * @param {string} htmlString - 原始 HTML 字符串
 * @param {string[]} removeSelectors - 需要移除的 CSS 选择器列表
 */
export async function exportHtmlToWord(name, htmlString, removeSelectors = []) {
  const parser = new DOMParser()
  const doc = parser.parseFromString(htmlString, 'text/html')

  if (removeSelectors.length) {
    $(doc.body).find(removeSelectors.join(', ')).remove()
  }

  // 将所有图片转为 base64 内嵌
  await convertImagesToBase64(doc.body)

  // 使用原生 innerHTML 避免 jQuery 序列化可能编码 base64 特殊字符
  const htmlContent = doc.body.innerHTML
  const fullHtml = `<!DOCTYPE html><html><head><meta charset="utf-8"><style>
    @page { size: A4; margin: 2cm; }
    body { font-family: SimSun, serif; font-size: 14px; line-height: 1.6; }
    table { border-collapse: collapse; width: 100%; }
    td, th { border: 1px solid #000; padding: 5px; }
    img { max-width: 100%; }
  </style></head><body>${htmlContent}</body></html>`

  const blob = await asBlob(fullHtml, { orientation: 'portrait' })
  saveAs(blob, `${name}.docx`)
}
