@koi-br/ocr-web-sdk 1.0.47 → 1.0.49

package/package.json

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

package/preview/ImagePreview.vue

@@ -360,11 +360,6 @@ const props = defineProps({
     type: Boolean,
     default: true, // 默认不显示，保持向后兼容（isDownload 的默认值）
   },
-  // 是否启用文本块的 hover 效果（高亮和显示批注按钮）
-  enableBlockHover: {
-    type: Boolean,
-    default: true,
-  },
 });
 
 const emit = defineEmits<{
@@ -381,6 +376,7 @@ const emit = defineEmits<{
   "annotation-add": [annotation: AnnotationInfo]; // 添加批注事件
   "annotation-update": [annotation: AnnotationInfo]; // 更新批注事件
   "annotation-delete": [annotationId: string]; // 删除批注事件
+  "highlight-clear": []; // 高亮清除事件（用于清除连接线）
 }>();
 
 // 图片URL数组和当前页码
@@ -873,12 +869,18 @@ const switchToPage = (page: number) => {
   showAnnotationPopup.value = false;
   currentAnnotationBlock.value = null;
   annotationInput.value = "";
+  const hadHighlight = isHighlighted.value && activeBlockDiv.value !== null;
   activeBlockDiv.value = null;
   isHighlighted.value = false;
 
   // 更新页码
   currentPage.value = page;
 
+  // 如果之前有高亮，触发高亮清除事件
+  if (hadHighlight) {
+    emit("highlight-clear");
+  }
+
   // 触发页码变化事件
   emit("page-change", page, totalPages.value);
 
@@ -922,9 +924,15 @@ const reset = () => {
   showAnnotationPopup.value = false;
   currentAnnotationBlock.value = null;
   annotationInput.value = "";
+  const hadHighlight = isHighlighted.value && activeBlockDiv.value !== null;
   activeBlockDiv.value = null;
   isHighlighted.value = false;
   
+  // 如果之前有高亮，触发高亮清除事件
+  if (hadHighlight) {
+    emit("highlight-clear");
+  }
+  
   // 清除已渲染页面集合
   renderedPages.value.clear();
 };
@@ -1282,11 +1290,6 @@ const renderTextLayer = (pageNum?: number) => {
 
       // Hover 和点击事件
       blockDiv.addEventListener("mouseenter", (e) => {
-        // 如果禁用了 hover 效果，不执行相关逻辑
-        if (!props.enableBlockHover) {
-          return;
-        }
-
         // 取消之前的隐藏定时器
         if (hideTimer) {
           clearTimeout(hideTimer);
@@ -1332,10 +1335,6 @@ const renderTextLayer = (pageNum?: number) => {
       });
 
       blockDiv.addEventListener("mouseleave", () => {
-        // 如果禁用了 hover 效果，不执行隐藏逻辑
-        if (!props.enableBlockHover) {
-          return;
-        }
         // 延迟隐藏，给用户时间移动到批注按钮
         hideAnnotationButton();
       });
@@ -1950,7 +1949,8 @@ const saveAnnotation = () => {
 
   const annotation: AnnotationInfo = {
     id:
-      existingAnnotation?.id || "",
+      existingAnnotation?.id ||
+      `annotation_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`,
     blockBbox: bbox,
     blockContent: content,
     blockPage: currentPage.value,
@@ -1965,7 +1965,7 @@ const saveAnnotation = () => {
   } else {
     // 添加新批注
     emit("annotation-add", annotation);
-    // Message.success("批注已添加");
+    Message.success("批注已添加");
   }
 
   // 关闭输入框
@@ -2157,6 +2157,7 @@ const highlightPosition = (
   highlightStyle?: HighlightStyle
 ): boolean => {
   // 清除之前的高亮
+  const hadHighlight = activeBlockDiv.value !== null && isHighlighted.value;
   if (activeBlockDiv.value) {
     activeBlockDiv.value.style.backgroundColor = "transparent";
     activeBlockDiv.value.style.boxShadow = "none";
@@ -2164,6 +2165,11 @@ const highlightPosition = (
     activeBlockDiv.value = null;
   }
   isHighlighted.value = false;
+  
+  // 如果之前有高亮，触发高亮清除事件
+  if (hadHighlight) {
+    emit("highlight-clear");
+  }
 
   // 如果页码不在有效范围内，返回 false
   if (pageNum < 1 || pageNum > totalPages.value) {
@@ -2270,6 +2276,8 @@ const highlightPosition = (
       elementRef.style.border = "none";
       activeBlockDiv.value = null;
       isHighlighted.value = false;
+      // 触发高亮清除事件，用于清除连接线
+      emit("highlight-clear");
     }
   }, 5000);
 
@@ -2584,6 +2592,34 @@ onBeforeUnmount(() => {
   window.removeEventListener('resize', handleContainerResize);
 });
 
+// 获取当前高亮位置信息（用于连接线功能）
+const getCurrentPosition = () => {
+  if (!activeBlockDiv.value || !containerRef.value) {
+    return null;
+  }
+
+  const bboxStr = activeBlockDiv.value.dataset.bbox;
+  if (!bboxStr) {
+    return null;
+  }
+
+  try {
+    const bbox = JSON.parse(bboxStr) as [number, number, number, number];
+    const pageStr = activeBlockDiv.value.dataset.page;
+    const pageNum = pageStr ? parseInt(pageStr, 10) : currentPage.value;
+
+    return {
+      pageNum,
+      bbox,
+      element: activeBlockDiv.value,
+      container: containerRef.value,
+    };
+  } catch (error) {
+    console.error("解析 bbox 失败:", error);
+    return null;
+  }
+};
+
 defineExpose({
   reset,
   jumpToPosition, // 暴露定位方法给父组件
@@ -2591,6 +2627,7 @@ defineExpose({
   getCurrentPage: () => currentPage.value, // 获取当前页码
   getTotalPages: () => totalPages.value, // 获取总页数
   getContainer: () => containerRef.value, // 暴露容器引用，用于同步滚动
+  getCurrentPosition, // 获取当前高亮位置信息（用于连接线功能）
 });
 </script>
 

package/preview/index.vue

@@ -53,6 +53,7 @@
       @annotation-add="handleAnnotationAdd"
       @annotation-update="handleAnnotationUpdate"
       @annotation-delete="handleAnnotationDelete"
+      @highlight-clear="$emit('highlight-clear')"
     >
       <template #left-top>
         <slot name="left-top"></slot>
@@ -141,7 +142,7 @@ import DocxPreview from './docxPreview.vue';
 import XLSXPreview from './xlsxPreview.vue';
 
 // 定义 emits
-const emit = defineEmits(['load', 'annotation-add', 'annotation-update', 'annotation-delete']);
+const emit = defineEmits(['load', 'annotation-add', 'annotation-update', 'annotation-delete', 'highlight-clear']);
 
 // 定义 props
 const props = defineProps({