adtec-core-package 3.1.7 → 3.1.9

package/src/components/upload/PdfJsViewer.vue

@@ -43,7 +43,7 @@ import {
 import * as pdfjsLib from 'pdfjs-dist/legacy/build/pdf.mjs'
 import pdfWorker from 'pdfjs-dist/legacy/build/pdf.worker.mjs?url'
 import { searchPdfDocument, type PdfSearchMatch } from '../../utils/pdfSearchUtil'
-import { computePdfDefaultFitScale } from '../../utils/officePreviewUtil.ts'
+import { computePdfDefaultFitScale, buildPdfJsLoadOptions } from '../../utils/officePreviewUtil.ts'
 
 pdfjsLib.GlobalWorkerOptions.workerSrc = pdfWorker
 
@@ -667,7 +667,7 @@ const loadPdf = async (src: Blob | ArrayBuffer) => {
     const data = await toArrayBuffer(src)
     if (token !== loadToken) return
 
-    const loadingTask = pdfjsLib.getDocument({ data })
+    const loadingTask = pdfjsLib.getDocument(buildPdfJsLoadOptions(data))
     activeTask = loadingTask
     const doc = await loadingTask.promise
     if (token !== loadToken) return

package/src/utils/excelPreviewUtil.ts

@@ -1,4 +1,21 @@
 import * as XLSX from 'xlsx-js-style'
+import { unzipSync } from 'fflate'
+
+export interface ExcelPreviewCellStyle {
+  backgroundColor?: string
+  color?: string
+  fontWeight?: string
+  fontStyle?: string
+  textDecoration?: string
+  textAlign?: 'left' | 'center' | 'right' | 'justify'
+  verticalAlign?: 'top' | 'middle' | 'bottom'
+  borderTop?: string
+  borderRight?: string
+  borderBottom?: string
+  borderLeft?: string
+  fontSize?: string
+  whiteSpace?: string
+}
 
 export interface ExcelPreviewCell {
   value: string
@@ -6,11 +23,16 @@ export interface ExcelPreviewCell {
   col: number
   rowSpan?: number
   colSpan?: number
+  style?: ExcelPreviewCellStyle
+  width?: number
 }
 
 export interface ExcelPreviewSheet {
   name: string
   rows: ExcelPreviewCell[][]
+  startCol: number
+  endCol: number
+  colWidths: Record<number, number>
 }
 
 export interface ExcelSearchMatch {
@@ -20,6 +42,326 @@ export interface ExcelSearchMatch {
   text: string
 }
 
+type ColorStyle = { rgb?: string; theme?: number; tint?: number; indexed?: number }
+
+type WorkbookStyles = {
+  Fonts?: Array<Record<string, unknown>>
+  Fills?: Array<Record<string, unknown>>
+  Borders?: Array<Record<string, unknown>>
+  CellXf?: Array<Record<string, unknown>>
+}
+
+/** Excel 默认主题色（Office 2013+，含 accent / hyperlink） */
+const EXCEL_THEME_COLORS: Record<number, string> = {
+  0: '#FFFFFF',
+  1: '#000000',
+  2: '#E7E6E6',
+  3: '#44546A',
+  4: '#4472C4',
+  5: '#ED7D31',
+  6: '#A5A5A5',
+  7: '#FFC000',
+  8: '#5B9BD5',
+  9: '#70AD47',
+  10: '#0563C1',
+  11: '#954F72',
+}
+
+/** Excel 标准 indexed 色板（常用前 16 色） */
+const INDEXED_COLORS: Record<number, string> = {
+  0: '#000000',
+  1: '#FFFFFF',
+  2: '#FF0000',
+  3: '#00FF00',
+  4: '#0000FF',
+  5: '#FFFF00',
+  6: '#FF00FF',
+  7: '#00FFFF',
+  8: '#000000',
+  9: '#FFFFFF',
+  10: '#FF0000',
+  11: '#00FF00',
+  12: '#0000FF',
+  13: '#FFFF00',
+  14: '#FF00FF',
+  15: '#00FFFF',
+  16: '#800000',
+  17: '#008000',
+  18: '#000080',
+  19: '#808000',
+  20: '#800080',
+  21: '#008080',
+  22: '#C0C0C0',
+  23: '#808080',
+  24: '#9999FF',
+  25: '#993366',
+  26: '#FFFFCC',
+  27: '#CCFFFF',
+  28: '#660066',
+  29: '#FF8080',
+  30: '#0066CC',
+  31: '#CCCCFF',
+  40: '#00CCFF',
+  41: '#CCFFFF',
+  42: '#CCFFCC',
+  43: '#FFFF99',
+  44: '#99CCFF',
+  45: '#FF99CC',
+  46: '#CC99FF',
+  47: '#FFCC99',
+  48: '#3366FF',
+  49: '#33CCCC',
+  50: '#99CC00',
+  51: '#FFCC00',
+  52: '#FF9900',
+  53: '#FF6600',
+  54: '#666699',
+  55: '#969696',
+  56: '#003366',
+  57: '#339966',
+  58: '#003300',
+  59: '#333300',
+  60: '#993300',
+  61: '#993366',
+  62: '#333399',
+  63: '#333333',
+}
+
+const BORDER_WIDTH: Record<string, string> = {
+  hair: '1px',
+  thin: '1px',
+  medium: '2px',
+  thick: '3px',
+  dashed: '1px',
+  dotted: '1px',
+  double: '3px',
+}
+
+const DEFAULT_COL_WIDTH = 72
+
+const isOleXls = (buffer: ArrayBuffer) => {
+  const sig = new Uint8Array(buffer, 0, 4)
+  return sig[0] === 0xd0 && sig[1] === 0xcf && sig[2] === 0x11 && sig[3] === 0xe0
+}
+
+const isZipXlsx = (buffer: ArrayBuffer) => {
+  const sig = new Uint8Array(buffer, 0, 2)
+  return sig[0] === 0x50 && sig[1] === 0x4b
+}
+
+const hexToRgb = (hex: string) => {
+  const normalized = hex.replace('#', '')
+  const value =
+    normalized.length === 8 ? normalized.slice(2) : normalized.length === 6 ? normalized : ''
+  if (value.length !== 6) return null
+  return {
+    r: parseInt(value.slice(0, 2), 16),
+    g: parseInt(value.slice(2, 4), 16),
+    b: parseInt(value.slice(4, 6), 16),
+  }
+}
+
+const rgbToHex = (r: number, g: number, b: number) =>
+  `#${[r, g, b]
+    .map((v) => Math.min(255, Math.max(0, Math.round(v))).toString(16).padStart(2, '0'))
+    .join('')}`
+
+const applyTint = (hex: string, tint: number) => {
+  const rgb = hexToRgb(hex)
+  if (!rgb) return hex
+  const mix = tint < 0 ? { r: 0, g: 0, b: 0 } : { r: 255, g: 255, b: 255 }
+  const ratio = Math.abs(tint)
+  return rgbToHex(
+    rgb.r + (mix.r - rgb.r) * ratio,
+    rgb.g + (mix.g - rgb.g) * ratio,
+    rgb.b + (mix.b - rgb.b) * ratio,
+  )
+}
+
+const resolveColor = (color?: ColorStyle): string | undefined => {
+  if (!color) return undefined
+  if (color.rgb) {
+    const raw = color.rgb.replace(/[^0-9a-f]/gi, '')
+    if (raw.length === 8) return `#${raw.slice(2)}`
+    if (raw.length === 6) return `#${raw}`
+    return undefined
+  }
+  if (color.indexed != null) return INDEXED_COLORS[color.indexed]
+  if (color.theme != null) {
+    const base = EXCEL_THEME_COLORS[color.theme] ?? '#000000'
+    return color.tint ? applyTint(base, color.tint) : base
+  }
+  return undefined
+}
+
+const resolveBorderSide = (side?: { style?: string; color?: ColorStyle }) => {
+  if (!side?.style || side.style === 'none') return undefined
+  const width = BORDER_WIDTH[side.style] ?? '1px'
+  const color = resolveColor(side.color) ?? '#000000'
+  const lineStyle = side.style === 'dashed' ? 'dashed' : side.style === 'dotted' ? 'dotted' : 'solid'
+  return `${width} ${lineStyle} ${color}`
+}
+
+const toNumber = (value: unknown, fallback = 0) => {
+  const num = Number(value)
+  return Number.isFinite(num) ? num : fallback
+}
+
+const isTruthy = (value: unknown) => value === true || value === 1 || value === '1'
+
+const styleFromParts = (parts: {
+  font?: Record<string, unknown>
+  fill?: Record<string, unknown>
+  border?: Record<string, unknown>
+  alignment?: Record<string, unknown>
+}): ExcelPreviewCellStyle | undefined => {
+  const css: ExcelPreviewCellStyle = {}
+
+  const fill = parts.fill
+  if (fill && fill.patternType !== 'none') {
+    const fg = fill.fgColor as ColorStyle | undefined
+    const bg = fill.bgColor as ColorStyle | undefined
+    const background = resolveColor(fg) || resolveColor(bg)
+    if (background) css.backgroundColor = background
+  }
+
+  const font = parts.font
+  if (font) {
+    if (isTruthy(font.bold)) css.fontWeight = 'bold'
+    if (isTruthy(font.italic)) css.fontStyle = 'italic'
+    if (font.underline) css.textDecoration = 'underline'
+    if (font.sz) css.fontSize = `${font.sz}pt`
+    const color = resolveColor(font.color as ColorStyle | undefined)
+    if (color) css.color = color
+  }
+
+  const alignment = parts.alignment
+  if (alignment) {
+    const horizontal = alignment.horizontal as string | undefined
+    if (horizontal && horizontal !== 'general') {
+      css.textAlign = horizontal as ExcelPreviewCellStyle['textAlign']
+    }
+    const vertical = alignment.vertical as string | undefined
+    if (vertical) {
+      css.verticalAlign =
+        vertical === 'center' ? 'middle' : (vertical as ExcelPreviewCellStyle['verticalAlign'])
+    }
+    if (isTruthy(alignment.wrapText)) css.whiteSpace = 'pre-wrap'
+  }
+
+  const border = parts.border
+  if (border) {
+    const top = resolveBorderSide(border.top as { style?: string; color?: ColorStyle })
+    const right = resolveBorderSide(border.right as { style?: string; color?: ColorStyle })
+    const bottom = resolveBorderSide(border.bottom as { style?: string; color?: ColorStyle })
+    const left = resolveBorderSide(border.left as { style?: string; color?: ColorStyle })
+    if (top) css.borderTop = top
+    if (right) css.borderRight = right
+    if (bottom) css.borderBottom = bottom
+    if (left) css.borderLeft = left
+  }
+
+  return Object.keys(css).length > 0 ? css : undefined
+}
+
+const resolveXfStyle = (
+  styles: WorkbookStyles | undefined,
+  xfIndex: number,
+): ExcelPreviewCellStyle | undefined => {
+  if (!styles?.CellXf?.length || xfIndex < 0) return undefined
+  const xf = styles.CellXf[xfIndex]
+  if (!xf) return undefined
+
+  const fontId = toNumber(xf.fontId ?? xf.fontid, 0)
+  const fillId = toNumber(xf.fillId ?? xf.fillid, 0)
+  const borderId = toNumber(xf.borderId ?? xf.borderid, 0)
+
+  return styleFromParts({
+    font: styles.Fonts?.[fontId] as Record<string, unknown> | undefined,
+    fill: styles.Fills?.[fillId] as Record<string, unknown> | undefined,
+    border: styles.Borders?.[borderId] as Record<string, unknown> | undefined,
+    alignment: xf.alignment as Record<string, unknown> | undefined,
+  })
+}
+
+/** xlsx-js-style 读入后 cell.s 往往只有 fill，字体/边框需用 XML 中的 s 索引关联 CellXf */
+const parseXlsxStyleIndexMaps = (buffer: ArrayBuffer, sheetCount: number) => {
+  if (!isZipXlsx(buffer) || sheetCount <= 0) return [] as Map<string, number>[]
+
+  try {
+    const files = unzipSync(new Uint8Array(buffer))
+    const decoder = new TextDecoder('utf-8')
+    const maps: Map<string, number>[] = []
+
+    for (let i = 0; i < sheetCount; i++) {
+      const path = `xl/worksheets/sheet${i + 1}.xml`
+      const xmlBytes = files[path]
+      const map = new Map<string, number>()
+      if (xmlBytes) {
+        const xml = decoder.decode(xmlBytes)
+        const cellTagRe = /<c\b([^>/]*)(?:\/>|>)/g
+        let match: RegExpExecArray | null
+        while ((match = cellTagRe.exec(xml))) {
+          const attrs = match[1]
+          const addr = attrs.match(/\br="([^"]+)"/)?.[1]
+          const styleIndex = attrs.match(/\bs="(\d+)"/)?.[1]
+          if (addr && styleIndex != null) {
+            map.set(addr, Number(styleIndex))
+          }
+        }
+      }
+      maps.push(map)
+    }
+    return maps
+  } catch {
+    return Array.from({ length: sheetCount }, () => new Map<string, number>())
+  }
+}
+
+const extractCellStyle = (
+  cell?: XLSX.CellObject,
+  styles?: WorkbookStyles,
+  xfIndex?: number,
+): ExcelPreviewCellStyle | undefined => {
+  if (styles && xfIndex != null && xfIndex >= 0) {
+    const resolved = resolveXfStyle(styles, xfIndex)
+    if (resolved) return resolved
+  }
+
+  if (typeof cell?.s === 'number' && styles) {
+    return resolveXfStyle(styles, cell.s)
+  }
+
+  const rawStyle = cell?.s
+  if (!rawStyle || typeof rawStyle !== 'object') return undefined
+
+  // cell.s 对象通常仅含 fill，作为兜底
+  return styleFromParts({
+    fill: rawStyle as Record<string, unknown>,
+  })
+}
+
+export const cellStyleToCss = (style?: ExcelPreviewCellStyle): Record<string, string> => {
+  if (!style) return {}
+  const css: Record<string, string> = {}
+  if (style.backgroundColor) css.backgroundColor = style.backgroundColor
+  if (style.color) css.color = style.color
+  if (style.fontWeight) css.fontWeight = style.fontWeight
+  if (style.fontStyle) css.fontStyle = style.fontStyle
+  if (style.textDecoration) css.textDecoration = style.textDecoration
+  if (style.textAlign) css.textAlign = style.textAlign
+  if (style.verticalAlign) css.verticalAlign = style.verticalAlign
+  if (style.borderTop) css.borderTop = style.borderTop
+  if (style.borderRight) css.borderRight = style.borderRight
+  if (style.borderBottom) css.borderBottom = style.borderBottom
+  if (style.borderLeft) css.borderLeft = style.borderLeft
+  if (style.fontSize) css.fontSize = style.fontSize
+  if (style.whiteSpace) css.whiteSpace = style.whiteSpace
+  return css
+}
+
+export const toExcelColumnLabel = (colIndex: number) => XLSX.utils.encode_col(colIndex)
+
 const formatCellValue = (cell?: XLSX.CellObject) => {
   if (!cell) return ''
   if (cell.w != null && cell.w !== '') return String(cell.w)
@@ -31,18 +373,52 @@ const formatCellValue = (cell?: XLSX.CellObject) => {
   return String(cell.v)
 }
 
+const parseColWidths = (sheet: XLSX.WorkSheet, startCol: number, endCol: number) => {
+  const cols = sheet['!cols'] || []
+  const widths: Record<number, number> = {}
+  for (let c = startCol; c <= endCol; c++) {
+    const col = cols[c]
+    if (col?.wpx) widths[c] = col.wpx
+    else if (col?.wch) widths[c] = Math.max(48, col.wch * 7)
+    else widths[c] = DEFAULT_COL_WIDTH
+  }
+  return widths
+}
+
 export const parseExcelWorkbook = async (src: Blob | ArrayBuffer): Promise<ExcelPreviewSheet[]> => {
   const buffer = src instanceof Blob ? await src.arrayBuffer() : src
-  const workbook = XLSX.read(buffer, { type: 'array', cellDates: true })
-  return workbook.SheetNames.map((name) => ({
-    name,
-    rows: buildSheetRows(workbook.Sheets[name]),
-  }))
+  const workbook = XLSX.read(buffer, {
+    type: 'array',
+    cellDates: true,
+    cellStyles: true,
+    ...(isOleXls(buffer) ? {} : {}),
+  })
+  const styles = workbook.Styles as WorkbookStyles | undefined
+  const styleIndexMaps = isZipXlsx(buffer)
+    ? parseXlsxStyleIndexMaps(buffer, workbook.SheetNames.length)
+    : []
+
+  return workbook.SheetNames.map((name, sheetIndex) => {
+    const sheet = workbook.Sheets[name]
+    const range = sheet?.['!ref'] ? XLSX.utils.decode_range(sheet['!ref']) : null
+    return {
+      name,
+      rows: buildSheetRows(sheet, styles, styleIndexMaps[sheetIndex]),
+      startCol: range?.s.c ?? 0,
+      endCol: range?.e.c ?? 0,
+      colWidths: range ? parseColWidths(sheet, range.s.c, range.e.c) : {},
+    }
+  })
 }
 
-const buildSheetRows = (sheet?: XLSX.WorkSheet): ExcelPreviewCell[][] => {
+const buildSheetRows = (
+  sheet?: XLSX.WorkSheet,
+  styles?: WorkbookStyles,
+  styleIndexMap?: Map<string, number>,
+): ExcelPreviewCell[][] => {
   if (!sheet || !sheet['!ref']) return []
   const range = XLSX.utils.decode_range(sheet['!ref'])
+  const colWidths = parseColWidths(sheet, range.s.c, range.e.c)
   const mergeStarts = new Map<string, { rowSpan: number; colSpan: number }>()
   const covered = new Set<string>()
 
@@ -63,13 +439,17 @@ const buildSheetRows = (sheet?: XLSX.WorkSheet): ExcelPreviewCell[][] => {
     for (let c = range.s.c; c <= range.e.c; c++) {
       if (covered.has(`${r},${c}`)) continue
       const addr = XLSX.utils.encode_cell({ r, c })
+      const cellObj = sheet[addr]
       const merge = mergeStarts.get(`${r},${c}`)
+      const xfIndex = styleIndexMap?.get(addr)
       row.push({
-        value: formatCellValue(sheet[addr]),
+        value: formatCellValue(cellObj),
         row: r,
         col: c,
         rowSpan: merge?.rowSpan,
         colSpan: merge?.colSpan,
+        style: extractCellStyle(cellObj, styles, xfIndex),
+        width: colWidths[c],
       })
     }
     if (row.length > 0) rows.push(row)

package/src/utils/officePreviewUtil.ts

@@ -120,3 +120,20 @@ export const isLegacyDocFile = (type?: string, name?: string, fileUrl?: string)
 /** 弹层等场景：使用 OfficePreview 内置标题栏（PDF / Word / Excel） */
 export const isHeaderPreviewFile = (type?: string, name?: string, fileUrl?: string) =>
   HEADER_PREVIEW_TYPES.has(toOfficePreviewType(type, name, fileUrl))
+
+const pdfAssetBase = () => {
+  const base = import.meta.env.BASE_URL || '/'
+  return base.endsWith('/') ? base : `${base}/`
+}
+
+/** pdf.js 加载参数：CJK 预览需 cMap；缺嵌入字体时尝试系统字体 */
+export const buildPdfJsLoadOptions = (data: ArrayBuffer) => {
+  const assetBase = pdfAssetBase()
+  return {
+    data,
+    useSystemFonts: true,
+    cMapUrl: `${assetBase}pdfjs/cmaps/`,
+    cMapPacked: true,
+    standardFontDataUrl: `${assetBase}pdfjs/standard_fonts/`,
+  }
+}