pdf预览修改

package.json

@@ -71,6 +71,7 @@
     "json5": "2.2.3",
     "naive-ui": "2.44.1",
     "nprogress": "0.2.0",
+    "pdf-vue3": "^2.0.1",
     "pinia": "3.0.4",
     "pinyin-pro": "3.28.0",
     "print-js": "1.6.0",

pnpm-lock.yaml

@@ -92,6 +92,9 @@ importers:
       nprogress:
         specifier: 0.2.0
         version: 0.2.0
+      pdf-vue3:
+        specifier: ^2.0.1
+        version: 2.0.1
       pinia:
         specifier: 3.0.4
         version: 3.0.4(typescript@6.0.3)(vue@3.5.34(typescript@6.0.3))
@@ -4734,6 +4737,9 @@ packages:
     resolution: {integrity: sha512-XDF38WCH3z5OV/OVa8GKUNtLAyneuzbCisx7QUCF8Q6Nutx0WnJrQe5O+kOtBlLfRNUws98Y58Lblp+NJG5T4Q==}
     hasBin: true
 
+  pdf-vue3@2.0.1:
+    resolution: {integrity: sha512-1hH48DEmJhSsHo27IFVp0aj97gkI1oe1Fvk6Xz1i8hNNkT6e2QrZ9fCmiVsL+I6bDCWL/e3LvskRTPRlflH5tw==}
+
   pdfast@0.2.0:
     resolution: {integrity: sha512-cq6TTu6qKSFUHwEahi68k/kqN2mfepjkGrG9Un70cgdRRKLKY6Rf8P8uvP2NvZktaQZNF3YE7agEkLj0vGK9bA==}
 
@@ -10737,6 +10743,8 @@ snapshots:
       ieee754: 1.2.1
       resolve-protobuf-schema: 2.1.0
 
+  pdf-vue3@2.0.1: {}
+
   pdfast@0.2.0: {}
 
   pdfjs-dist@4.10.38:

src/views/my/initiateChange/modules/changeApply.vue

@@ -10,7 +10,7 @@ import { AiError, aiTypeJudge, aiLevelScore } from "@/service/api/ai";
 import { uploadFileApi, deleteFileApi } from "@/service/api/file";
 import Footer from './footer.vue'
 
-import VuePdfEmbed from 'vue-pdf-embed';
+import PDF from 'pdf-vue3'
 import { VueOfficeDocx, VueOfficeExcel } from 'vue3-office-preview'
 import 'vue3-office-preview/lib/style.css'
 
@@ -720,7 +720,7 @@ defineExpose({form})
   :show="previewFile !== null"
   preset="card"
   :auto-focus="false"
-  :style="{ width: '1000px', height: 'auto' }"
+  :style="{ width: '1100px', height: 'auto' }"
   :segmented="{ content: true, footer: true }"
   @update:show="(v) => !v && (previewFile = null)"
 >
@@ -736,10 +736,12 @@ defineExpose({form})
         <span>上传时间：{{ previewFile?.created_at }}</span>
         <span v-if="previewFile?.version">{{ `版本：${previewFile?.version}（受控）` }}</span>
       </div>
-      <div v-if="previewFile" class="flex max-h-[70vh] overflow-x-auto items-center justify-center rounded-lg border py-2">
+      <div v-if="previewFile" class="max-h-[70vh] overflow-x-auto rounded-lg border">
         <!-- 图片预览 -->
         <template v-if="handleFileType(previewFile?.file_type) === 'image'">
+          <div class="flex items-center justify-center py-2">
             <NImage :src="previewFile?.file_url" />
+          </div>
         </template>
         <!-- Word 预览 -->
         <template v-if="handleFileType(previewFile?.file_type) === 'word'">
@@ -751,7 +753,9 @@ defineExpose({form})
         </template>
         <!-- PDF 预览 -->
         <template v-if="handleFileType(previewFile?.file_type) === 'pdf'">
-          <VuePdfEmbed :source="previewFile?.file_url" annotation-layer text-layer class="w-full" />
+          <div class="h-[68vh]">
+            <PDF :src="previewFile?.file_url" class="w-full h-full" />
+          </div>
         </template>
       </div>
     </div>
@@ -772,7 +776,7 @@ defineExpose({form})
   align-items: center;
 }
 .scroll {
-  height: calc(100vh - 393px);
+  height: calc(100vh - 395px);
   overflow-y: auto;
 }
 </style>