@koi-br/ocr-web-sdk 1.0.16 → 1.0.18

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@koi-br/ocr-web-sdk",
-  "version": "1.0.16",
+  "version": "1.0.18",
   "description": "一个支持多种Office文件格式预览的Vue3组件SDK，包括PDF、Word、Excel、图片、OFD、TIF等格式",
   "main": "dist/index.js",
   "module": "dist/index.esm.js",

package/preview/ImagePreview.vue

@@ -151,7 +151,7 @@ const props = defineProps({
   }
 });
 
-const emit = defineEmits(['original', 'download']);
+const emit = defineEmits(['original', 'download', 'load']);
 
 const rotation = ref(0);
 const scale = ref(1);
@@ -219,6 +219,15 @@ const original = () => {
   emit('original');
 };
 
+// 图片加载完成处理
+const onImageLoad = (event) => {
+  const img = event.target;
+  emit('load', {
+    width: img.naturalWidth,
+    height: img.naturalHeight
+  });
+};
+
 defineExpose({
   reset
 });

package/preview/PdfPreview.vue

@@ -361,12 +361,14 @@ interface Props {
   blocksData?: BlockInfo[]; // PDF分块数据（从后端layout-parsing接口获取）
   showTocSidebar?: boolean; // 是否显示目录侧边栏（包括工具栏中的切换按钮），默认为 true
   isDownload?: boolean; // 是否显示下载按钮，默认为 false
+  enableMargin?: boolean; // 是否启用留白（自动缩放和适合页宽模式下），true=留白（左右各20px，共40px），false=不留白（只有左右5px padding），默认为 true
 }
 
 // 使用 withDefaults 显式设置默认值，确保未传递 prop 时使用默认值
 const props = withDefaults(defineProps<Props>(), {
   showTocSidebar: true, // 默认显示目录侧边栏
   isDownload: false, // 默认不显示下载按钮
+  enableMargin: true, // 默认启用留白
 });
 
 /**
@@ -1293,9 +1295,11 @@ const calculateScaleWithDimensions = (
   const canvasWidth = firstCanvas.width / pixelRatio;
   const canvasHeight = firstCanvas.height / pixelRatio;
 
-  // 预留较小的边距，让PDF占用更多宽度
+  // 根据配置决定是否留白
+  // enableMargin = true: 留白模式，左右总共预留 40px 边距（维持现状）
+  // enableMargin = false: 不留白模式，只有左右5px padding（.pdf-viewer 的 padding）
   // 注意：containerWidth 已经是 .pdf-viewer 的 clientWidth（已减去 padding）
-  const horizontalMargin = 40; // 左右总共预留 40px 边距
+  const horizontalMargin = props.enableMargin ? 40 : 10; // 留白模式：40px，不留白模式：10px
 
   // 计算可用宽度：直接使用容器宽度减去额外边距
   const availableWidth = containerWidth - horizontalMargin;

package/preview/docxPreview.vue

@@ -82,7 +82,7 @@ const props = defineProps({
   }
 });
 
-const emit = defineEmits(['download']);
+const emit = defineEmits(['download', 'load']);
 
 const containerRef = ref(null);
 const isLoading = ref(false);
@@ -180,6 +180,8 @@ const loadDocument = async () => {
     await nextTick();
     // 渲染文档
     await renderDocument(documentData);
+    // 文档加载完成，触发 load 事件
+    emit('load');
   } catch (err) {
     console.error('文档加载失败:', err);
     error.value = `加载文档失败: ${err.message}`;

package/preview/index.vue

@@ -30,6 +30,7 @@
       :is-download="props.isDownload"
       v-bind="props.pdfProps || {}"
       @download="handleDownload"
+      @pdf-loaded="handleFileLoaded"
     >
       <!-- 透传 left-top 插槽给 PdfPreview -->
       <template #left-top>
@@ -47,6 +48,7 @@
       v-bind="props.imageProps || {}"
       @original="handleOriginal"
       @download="handleDownload"
+      @load="handleFileLoaded"
     >
       <template #left-top>
         <slot name="left-top"></slot>
@@ -61,6 +63,7 @@
       :is-download="props.isDownload"
       v-bind="props.tifProps || {}"
       @download="handleDownload"
+      @load="handleFileLoaded"
     >
       <template #left-top>
         <slot name="left-top"></slot>
@@ -75,6 +78,7 @@
       :is-download="props.isDownload"
       v-bind="props.docxProps || {}"
       @download="handleDownload"
+      @load="handleFileLoaded"
     >
       <template #left-top>
         <slot name="left-top"></slot>
@@ -89,6 +93,7 @@
       :is-download="props.isDownload"
       v-bind="props.ofdProps || {}"
       @download="handleDownload"
+      @load="handleFileLoaded"
     >
     </OfdPreview>
 
@@ -100,6 +105,7 @@
       :is-download="props.isDownload"
       v-bind="props.xlsxProps || {}"
       @download="handleDownload"
+      @load="handleFileLoaded"
     >
       <template #left-top>
         <slot name="left-top"></slot>
@@ -130,6 +136,9 @@ import OfdPreview from './ofdPreview.vue';
 import DocxPreview from './docxPreview.vue';
 import XLSXPreview from './xlsxPreview.vue';
 
+// 定义 emits
+const emit = defineEmits(['load']);
+
 // 定义 props
 const props = defineProps({
   isDownload: {
@@ -187,6 +196,9 @@ const originalId = ref('');
 // 添加 AbortController 的引用
 const abortController = ref(null);
 
+// 文件加载完成的回调函数
+const onLoadCallback = ref(null);
+
 // 通过文件名判断类型
 const getFileType = (fileName = '') => {
   const ext = fileName.split('.').pop()?.toLowerCase();
@@ -299,6 +311,7 @@ const handleDownload = () => {
  * @param {string} fileName - 文件名（可选，用于判断文件类型）
  * @param {object} options - 可选配置
  * @param {Function} options.onProgress - 下载进度回调函数 (progress) => void
+ * @param {Function} options.onLoad - 文件加载完成回调函数 (fileInfo) => void
  * @param {string} options.originalId - 原图ID（用于图片预览）
  */
 const preview = async (file, fileName, options = {}) => {
@@ -307,7 +320,10 @@ const preview = async (file, fileName, options = {}) => {
     return;
   }
 
-  const { onProgress, originalId: originalFileId } = options;
+  const { onProgress, onLoad, originalId: originalFileId } = options;
+  
+  // 保存加载完成回调函数
+  onLoadCallback.value = onLoad || null;
   
   // 清除旧的预览
   clearPreview();
@@ -359,6 +375,24 @@ const handleOriginal = () => {
   }
 };
 
+// 处理文件加载完成事件
+const handleFileLoaded = (data) => {
+  const fileInfo = {
+    fileType: fileType.value,
+    fileName: currentFileName.value,
+    fileUrl: fileUrl.value,
+    ...(data || {})
+  };
+  
+  // 调用用户提供的加载完成回调函数（通过 options.onLoad）
+  if (onLoadCallback.value && typeof onLoadCallback.value === 'function') {
+    onLoadCallback.value(fileInfo);
+  }
+  
+  // 向外 emit load 事件（供父组件通过 @load 监听）
+  emit('load', fileInfo);
+};
+
 // 获取当前活动的预览组件引用
 const getCurrentPreviewRef = () => {
   switch (fileType.value) {

package/preview/xlsxPreview.vue

@@ -88,7 +88,7 @@ const props = defineProps({
   }
 });
 
-const emit = defineEmits(['download']);
+const emit = defineEmits(['download', 'load']);
 
 const excel = ref('');
 const loading = ref(false);
@@ -125,6 +125,7 @@ const resetZoom = () => {
 // 文件加载成功
 const onRendered = () => {
   loading.value = false;
+  emit('load');
 };
 
 // 文件加载失败