npm - md2ui - Versions diffs - 1.0.18 → 1.0.19 - Mend

md2ui 1.0.18 → 1.0.19

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (74) hide show

package/src/composables/useExportPdf.js ADDED Viewed

@@ -0,0 +1,102 @@
+import { ref } from 'vue'
+/**
+ * PDF 导出 — 基于浏览器 window.print() 实现
+ * 通过创建独立的打印窗口，只包含文档内容，生成干净的 PDF
+ */
+export function useExportPdf() {
+  const exportingPdf = ref(false)
+  async function exportToPdf(title = '文档') {
+    exportingPdf.value = true
+    try {
+      const contentEl = document.querySelector('.markdown-content')
+      if (!contentEl) return
+      // 克隆内容，移除不需要打印的元素
+      const clone = contentEl.cloneNode(true)
+      clone.querySelectorAll('.code-block-actions').forEach(el => el.remove())
+      clone.querySelectorAll('.image-copy-btn, .mermaid-copy-btn').forEach(el => el.remove())
+      clone.querySelectorAll('.table-toolbar').forEach(el => el.remove())
+      // 收集页面中的样式
+      const styles = []
+      for (const sheet of document.styleSheets) {
+        try {
+          for (const rule of sheet.cssRules) {
+            styles.push(rule.cssText)
+          }
+        } catch {
+          // 跨域样式表忽略
+        }
+      }
+      // 创建打印窗口
+      const printWindow = window.open('', '_blank')
+      if (!printWindow) {
+        alert('请允许弹出窗口以导出 PDF')
+        return
+      }
+      const safeTitle = title.replace(/[<>&"]/g, c =>
+        ({ '<': '&lt;', '>': '&gt;', '&': '&amp;', '"': '&quot;' }[c]))
+      printWindow.document.write(`<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+  <meta charset="UTF-8">
+  <title>${safeTitle}</title>
+  <style>
+    ${styles.join('\n')}
+    body {
+      margin: 0;
+      padding: 20px 40px;
+      background: #fff;
+      color: #1a1e1b;
+      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif;
+      font-size: 14px;
+      line-height: 1.6;
+    }
+    .markdown-content {
+      max-width: 100%;
+      padding: 0;
+      margin: 0;
+    }
+    .code-block-wrapper { break-inside: avoid; border: 1px solid #ddd; }
+    .code-block-header { background: #f5f5f5; }
+    table { break-inside: avoid; }
+    .mermaid { break-inside: avoid; }
+    .heading-anchor { display: none !important; }
+    @media print {
+      a[href^="http"]::after {
+        content: " (" attr(href) ")";
+        font-size: 0.85em;
+        color: #666;
+        word-break: break-all;
+      }
+      a[data-doc-key]::after { content: none; }
+    }
+  </style>
+</head>
+<body>
+  <article class="markdown-content">${clone.innerHTML}</article>
+</body>
+</html>`)
+      printWindow.document.close()
+      // 等待加载完成后触发打印
+      printWindow.onload = () => {
+        setTimeout(() => {
+          printWindow.print()
+          printWindow.onafterprint = () => printWindow.close()
+        }, 500)
+      }
+    } catch (err) {
+      console.error('导出 PDF 失败:', err)
+    } finally {
+      exportingPdf.value = false
+    }
+  }
+  return { exportingPdf, exportToPdf }
+}

package/src/composables/useExportWord.js CHANGED Viewed

@@ -3,10 +3,26 @@ import {
   Document, Packer, Paragraph, TextRun, HeadingLevel,
   Table, TableRow, TableCell, WidthType, BorderStyle,
   ImageRun, AlignmentType, ShadingType,
-  ExternalHyperlink,
+  ExternalHyperlink, TableLayoutType,
   convertInchesToTwip
 } from 'docx'
-import { saveAs } from 'file-saver'
+// 使用原生方式下载文件，兼容 Chrome / Safari / Firefox
+// 使用原生方式下载文件，兼容 Chrome / Safari / Firefox
+function downloadBlob(blob, fileName) {
+  // 将 Blob 包装为 File 对象，Chrome 会从 File.name 获取文件名
+  const file = new File([blob], fileName, { type: blob.type })
+  const url = URL.createObjectURL(file)
+  const a = document.createElement('a')
+  a.href = url
+  a.download = fileName
+  a.style.display = 'none'
+  document.body.appendChild(a)
+  a.click()
+  setTimeout(() => {
+    document.body.removeChild(a)
+    URL.revokeObjectURL(url)
+  }, 200)
+}
 // ---- SVG 转 PNG ----
@@ -160,16 +176,35 @@ function extractTextRuns(node, inherited = {}) {
   return runs
 }
-// 解析表格
+// 解析表格（兼容 Office + WPS）
 function parseTable(tableEl) {
+  // A4 内容区宽度（缇），左右页边距各 1.2 英寸，纸宽 8.27 英寸
+  const TABLE_WIDTH_DXA = 9024
   const rows = []
   const allTr = tableEl.querySelectorAll('tr')
+  // 1. 扫描最大列数（考虑 colspan）
+  let maxCols = 0
+  for (const tr of allTr) {
+    let colCount = 0
+    for (const td of tr.querySelectorAll('th, td')) {
+      colCount += parseInt(td.getAttribute('colspan') || '1', 10)
+    }
+    maxCols = Math.max(maxCols, colCount)
+  }
+  if (maxCols === 0) return null
+  // 2. 每列均分宽度
+  const colWidth = Math.floor(TABLE_WIDTH_DXA / maxCols)
+  // 3. 构建行（处理 colspan）
   for (const tr of allTr) {
     const cells = []
     const tds = tr.querySelectorAll('th, td')
     const isHeader = tr.querySelector('th') !== null
     for (const td of tds) {
-      cells.push(new TableCell({
+      const colspan = parseInt(td.getAttribute('colspan') || '1', 10)
+      const cellOpts = {
         children: [new Paragraph({
           children: extractTextRuns(td, isHeader ? { bold: true } : {}),
           spacing: { before: 40, after: 40 },
@@ -177,17 +212,23 @@ function parseTable(tableEl) {
         shading: isHeader
           ? { type: ShadingType.CLEAR, fill: 'f0f0f0' }
           : undefined,
-        width: { size: 100 / tds.length, type: WidthType.PERCENTAGE },
-      }))
+        width: { size: colWidth * colspan, type: WidthType.DXA },
+      }
+      if (colspan > 1) cellOpts.columnSpan = colspan
+      cells.push(new TableCell(cellOpts))
     }
     if (cells.length > 0) {
       rows.push(new TableRow({ children: cells }))
     }
   }
   if (rows.length === 0) return null
+  // 4. FIXED 布局 + columnWidths（tblGrid），WPS 严格依赖这两项
   return new Table({
     rows,
-    width: { size: 100, type: WidthType.PERCENTAGE },
+    width: { size: TABLE_WIDTH_DXA, type: WidthType.DXA },
+    layout: TableLayoutType.FIXED,
+    columnWidths: Array(maxCols).fill(colWidth),
   })
 }
@@ -410,8 +451,8 @@ async function parseDomToDocx(contentEl) {
       continue
     }
-    // 表格（可能被 table-wrapper 包裹）
-    if (tag === 'TABLE' || node.classList?.contains('table-wrapper')) {
+    // 表格（可能被 table-outer 或 table-wrapper 包裹）
+    if (tag === 'TABLE' || node.classList?.contains('table-wrapper') || node.classList?.contains('table-outer')) {
       const tableEl = tag === 'TABLE' ? node : node.querySelector('table')
       if (tableEl) {
         const table = parseTable(tableEl)
@@ -601,6 +642,24 @@ export function useExportWord() {
                 alignment: AlignmentType.LEFT,
               },
             },
+            heading1: {
+              run: { font: 'Microsoft YaHei', size: 36, bold: true, color: '333333' },
+            },
+            heading2: {
+              run: { font: 'Microsoft YaHei', size: 32, bold: true, color: '333333' },
+            },
+            heading3: {
+              run: { font: 'Microsoft YaHei', size: 28, bold: true, color: '333333' },
+            },
+            heading4: {
+              run: { font: 'Microsoft YaHei', size: 26, bold: true, color: '333333' },
+            },
+            heading5: {
+              run: { font: 'Microsoft YaHei', size: 24, bold: true, color: '333333' },
+            },
+            heading6: {
+              run: { font: 'Microsoft YaHei', size: 22, bold: true, color: '333333' },
+            },
           },
         },
         sections: [{
@@ -619,8 +678,12 @@ export function useExportWord() {
       })
       const blob = await Packer.toBlob(doc)
+      // 确保 blob 的 MIME type 正确
+      const wordBlob = new Blob([blob], {
+        type: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document'
+      })
       const fileName = title.replace(/[\\/:*?"<>|]/g, '_') + '.docx'
-      saveAs(blob, fileName)
+      downloadBlob(wordBlob, fileName)
     } catch (err) {
       console.error('导出 Word 失败:', err)
     } finally {

package/src/composables/useFileWatcher.js ADDED Viewed

@@ -0,0 +1,45 @@
+import { ref, onMounted, onBeforeUnmount } from 'vue'
+import { pollDocsList, pollDocContent } from '../services/DocService.js'
+/**
+ * 轮询监听文件变更
+ * 通过 DocService 统一处理模式检测和 ETag，这里只管定时调用
+ */
+export function useFileWatcher({ getCurrentDocPath, onDocsListChange, onDocContentChange }) {
+  const watching = ref(false)
+  let timer = null
+  let polling = false
+  async function poll() {
+    if (polling) return
+    polling = true
+    try {
+      // 轮询文档列表
+      const newTree = await pollDocsList()
+      if (newTree) onDocsListChange?.(newTree)
+      // 轮询当前文档内容
+      const docPath = getCurrentDocPath?.()
+      const content = await pollDocContent(docPath)
+      if (content !== null) onDocContentChange?.(content)
+    } finally {
+      polling = false
+    }
+  }
+  function start() {
+    if (watching.value) return
+    watching.value = true
+    timer = setInterval(poll, 500)
+  }
+  function stop() {
+    watching.value = false
+    if (timer) { clearInterval(timer); timer = null }
+  }
+  onMounted(start)
+  onBeforeUnmount(stop)
+  return { watching, start, stop }
+}

package/src/composables/useFrontmatter.js CHANGED Viewed

@@ -4,7 +4,7 @@
 // 支持 title / description / order / hidden 字段
 export function parseFrontmatter(markdown) {
   const match = markdown.match(/^---\r?\n([\s\S]*?)\r?\n---\r?\n?/)
-  if (!match) return { data: {}, content: markdown }
+  if (!match) return { data: {}, content: markdown, rawYaml: '' }
   const yamlStr = match[1]
   const data = {}
   for (const line of yamlStr.split('\n')) {
@@ -20,7 +20,7 @@ export function parseFrontmatter(markdown) {
     else val = val.replace(/^['"]|['"]$/g, '')
     data[m[1]] = val
   }
-  return { data, content: markdown.slice(match[0].length) }
+  return { data, content: markdown.slice(match[0].length), rawYaml: yamlStr }
 }
 // 计算阅读时间（中文 400 字/分钟，英文 200 词/分钟）