'解决招标文件pdf无法加载问题'

zhangwei

2025-08-28 06e4c8c1bad514992186d94a65c0dc6250e34716

'解决招标文件pdf无法加载问题'

 src/views/system/component/pdfPreview.vue

@@ -31,8 +31,6 @@

  isLoading.value = false;
};
console.log(props.fileInfo, "props.fileInfo");

const pdfUrl = props.fileInfo.filePath;
// 用fetch获取文件流，强制转为预览格式
fetch(pdfUrl)

 src/views/system/dept/detail.vue

@@ -24,46 +24,13 @@
import IconParkSolidBack from "~icons/icon-park-solid/back";

const { openDialog } = useDept(ref({}));
const { openUploadDialog, state, changeDialog } = useDetail();
const { openUploadDialog, state, changeDialog, getDetailList } = useDetail();
defineOptions({
  name: "itemdetail"
});
const convertFujianToObjects = (fujianStr, fujianNameStr) => {
  // 分割字符串为数组并过滤空值
  const srcArray = fujianStr.split(",").filter(Boolean);
  const nameArray = fujianNameStr.split(",").filter(Boolean);

  // 提取文件后缀作为valu
  const getFileExtension = fileName => {
    const lastDotIndex = fileName.lastIndexOf(".");
    // 如果没有后缀或文件名以点结尾，返回空字符串
    if (lastDotIndex === -1 || lastDotIndex === fileName.length - 1) {
      return "";
    }
    return fileName.slice(lastDotIndex + 1).toLowerCase();
  };

  // 映射为目标对象数组
  return srcArray.map((src, index) => {
    // 确保名称数组有对应索引的元素
    const name = nameArray[index]?.trim() || `未知文件${index + 1}`;

    return {
      name: name,
      filePath: src.trim(),
      fileType: getFileExtension(name)
    };
  });
};
onMounted(async () => {
  let res = await getTenderOrderDetail({ id: props.nowID });
  state.nowInfo = res.result;
  if (state.nowInfo.fujian) {
    state.nowInfo.fujianList = convertFujianToObjects(
      state.nowInfo.fujian,
      state.nowInfo.fujianName
    );
  }
  getDetailList(props.nowID);
});
const backListPage = () => {
  emit("backListPage");
@@ -217,8 +184,8 @@
                        class="flex items-center cursor-pointer"
                        @click="
                          previewPdf({
                            name: state.nowInfo.zhaobiaowenjian,
                            filePath: state.nowInfo.zhaobiaowenjianName,
                            name: state.nowInfo.zhaobiaowenjianName,
                            filePath: state.nowInfo.zhaobiaowenjian,
                            fileType: 'pdf'
                          })
                        "

 src/views/system/dept/utils/detail.tsx

@@ -16,8 +16,44 @@
} from "@/api/item/index";

const formRef = ref();
const convertFujianToObjects = (fujianStr, fujianNameStr) => {
  // 分割字符串为数组并过滤空值
  const srcArray = fujianStr.split(",").filter(Boolean);
  const nameArray = fujianNameStr.split(",").filter(Boolean);

  // 提取文件后缀作为valu
  const getFileExtension = fileName => {
    const lastDotIndex = fileName.lastIndexOf(".");
    // 如果没有后缀或文件名以点结尾，返回空字符串
    if (lastDotIndex === -1 || lastDotIndex === fileName.length - 1) {
      return "";
    }
    return fileName.slice(lastDotIndex + 1).toLowerCase();
  };

  // 映射为目标对象数组
  return srcArray.map((src, index) => {
    // 确保名称数组有对应索引的元素
    const name = nameArray[index]?.trim() || `未知文件${index + 1}`;

    return {
      name: name,
      filePath: src.trim(),
      fileType: getFileExtension(name)
    };
  });
};
export function useDetail() {
  async function getDetailList(id) {
    const res = await getTenderOrderDetail({ id });
    state.nowInfo = res.result;
    if (state.nowInfo.fujian) {
      state.nowInfo.fujianList = convertFujianToObjects(
        state.nowInfo.fujian,
        state.nowInfo.fujianName
      );
    }
  }
  async function openUploadDialog(title = "上传", row?: TenderInfo) {
    const detail = await changeDetail({ id: row.id });
    if (detail.result) {
@@ -65,9 +101,10 @@
                console.log(options, index, button);
                cHangeDelete({ id: row?.id }).then(res => {
                  if (res.code == "200") {
                    getTenderOrderDetail({ id: row?.tenderId }).then(res => {
                      state.nowInfo = res.result;
                    });
                    getDetailList(row?.tenderId);
                    // getTenderOrderDetail({ id: row?.tenderId }).then(res => {
                    //   state.nowInfo = res.result;
                    // });
                    closeDialog(options, index); // 关闭弹框
                  } else {
                    // closeLoading();
@@ -96,9 +133,10 @@
            res = await changezhaobiao(curData);
          }
          if (res.code == "200") {
            getTenderOrderDetail({ id: row?.id }).then(res => {
              state.nowInfo = res.result;
            });
            getDetailList(row?.id);
            // getTenderOrderDetail({ id: row?.id }).then(res => {
            //   state.nowInfo = res.result;
            // });
            done(); // 关闭弹框
          } else {
            closeLoading();
@@ -245,14 +283,14 @@
    );
    // 拼接时间戳和随机数
    return (
      `${dirPath}${filename}${timestamp}_${randomNumber}` +
      filename.match(/\.[^.]+$/)
      `${dirPath}${timestamp}_${randomNumber}` + filename.match(/\.[^.]+$/)
    );
  }
  return {
    openUploadDialog,
    state,
    generateTimestampWithRandom,
    changeDialog
    changeDialog,
    getDetailList
  };
}