公告信息页面

zhangwei

8 天以前 3324a54fa4d0840f8a5dc8adb21753180ecd3f3c

 src/views/system/component/pdfPreview.vue

@@ -6,7 +6,6 @@
  >
    <iframe
      id="printIframe"
      :src="pdfSrc"
      frameborder="0"
      style="width: 100%; height: 100%"
      @load="iframeLoaded"
@@ -15,14 +14,46 @@
</template>

<script setup lang="ts">
import { ref } from "vue";
import pdfSrc from "./四川招标投标交易服务平台用户操作手册（代理机构）.pdf";
import { ref, defineProps } from "vue";
const props = defineProps({
  // fileInfo: {
  //   type: String,
  //   default: ""
  // }
  fileInfo: {
    type: Object,
    required: true
  }
});
let isLoading = ref(true);
const iframeLoaded = () => {
  console.log("jjjjjj");

  isLoading.value = false;
};
const pdfUrl = props.fileInfo.filePath;
// 用fetch获取文件流，强制转为预览格式
fetch(pdfUrl)
  .then(response => {
    // 检查响应是否成功
    if (!response.ok) throw new Error("文件获取失败");
    // 强制获取Blob对象（指定PDF类型）
    return response.blob();
  })
  .then(blob => {
    // 生成临时预览URL（浏览器本地临时链接，无下载触发）
    const blobUrl = URL.createObjectURL(
      new Blob([blob], { type: "application/pdf" }) // 明确指定PDF类型
    );
    // 赋值给iframe并显示
    const iframe = document.getElementById("printIframe");
    iframe.src = blobUrl;
    iframe.style.display = "block";
    document.getElementById("loading").style.display = "none";
  })
  .catch(error => {
    // document.getElementById("loading").innerText = `加载失败：${error.message}`;
  });
</script>
<style>
.pdf-container {