/* * @Author: LiZhiWei * @Date: 2025-04-09 08:10:23 * @LastEditors: LiZhiWei * @LastEditTime: 2025-04-15 14:47:12 * @Description: */ import { defaultOptions, renderAsync } from "docx-preview" import renderPdf from "./vendors/pdf" import renderImage from "./vendors/image" import renderText from "./vendors/text" import renderPptx from "./vendors/pptx" import renderSheet from "./vendors/xlsx" // 假装构造一个vue的包装,让上层统一处理销毁和替换节点 const VueWrapper = (el) => ({ $el: el, $destroy() { // 什么也不需要 nothing to do }, }) const handlers = [ // 使用docxjs支持,目前效果最好的渲染器 { accepts: ["docx"], handler: async (buffer, target) => { const docxOptions = { ...defaultOptions, ...{ debug: true, experimental: true, }, } await renderAsync(buffer, target, null, docxOptions) return VueWrapper(target) }, }, // 使用pptx2html,已通过默认值更替 { accepts: ["pptx"], handler: async (buffer, target) => { return renderPptx(buffer, target) }, }, // 使用sheetjs + handsontable,无样式 { accepts: ["xlsx"], handler: async (buffer, target) => { return renderSheet(buffer, target) }, }, // 使用pdfjs,渲染pdf,效果最好 { accepts: ["pdf"], handler: async (buffer, target) => { return renderPdf(buffer, target) }, }, // 图片过滤器 { accepts: ["gif", "jpg", "jpeg", "bmp", "tiff", "tif", "png", "svg"], handler: async (buffer, target) => { return renderImage(buffer, target) }, }, // 纯文本预览 { accepts: [ "txt", "json", "js", "css", "java", "py", "html", "jsx", "ts", "tsx", "xml", "md", "log", ], handler: async (buffer, target) => { return renderText(buffer, target) }, }, // 错误处理 { accepts: ["error"], handler: async (buffer, target, type) => { target.innerHTML = `
不支持.${type}格式的在线预览,请下载后预览或转换为支持的格式
支持docx, xlsx, pptx, pdf, 以及纯文本格式和各种图片格式的在线预览
` return VueWrapper(target) }, }, ] // 匹配 export default handlers.reduce((result, { accepts, handler }) => { accepts.forEach((type) => (result[type] = handler)) return result }, {})