接口对接

zhouwx

2025-03-17 ef9f19192df89a5ec2dea8425d0fac0fd7eff6e6

 src/views/signProject/components/viewPdf.vue

@@ -2,13 +2,20 @@
  <div class="notice">
    <el-dialog
        v-model="dialogVisible"
        title="流转记录"
        width="500px"
        width="50%"
        title="文件预览"
        :before-close="handleClose"
        :close-on-press-escape="false"
        :close-on-click-modal="false"
    >
      <iframe :src="state.pdfUrl" width="100%" height="600px" sandbox="allow-scripts"></iframe>
      <div style="width: 100%;height: auto;">
        <iframe
            :src="state.iframeSrc"
            width="100%"
            height="750px"
            class="custom-iframe"
        ></iframe>
      </div>
    </el-dialog>
  </div>
</template>
@@ -20,13 +27,12 @@
const emit = defineEmits(["getList"]);

const state = reactive({
  pdfUrl: ''
  iframeSrc: ''
})


const openDialog = async (value) => {
  state.pdfUrl =  import.meta.env.VITE_APP_BASE_API  +value.itemFile
  console.log('11',state.pdfUrl)
  state.iframeSrc =  import.meta.env.VITE_APP_BASE_API  + value.itemFile
  dialogVisible.value = true;
}

@@ -36,7 +42,7 @@
  emit("getList")
}
const reset = () => {
state.pdfUrl = ''
state.iframeSrc = ''
}

defineExpose({
@@ -47,20 +53,10 @@

<style scoped lang="scss">
.notice{
  /* 针对 iframe 的滚动条 */
  iframe::-webkit-scrollbar {
    width: 12px; /* 滚动条宽度 */
  }
  iframe::-webkit-scrollbar-track {
    background: #f1f1f1; /* 滚动条轨道背景 */
    border-radius: 10px;
  }
  iframe::-webkit-scrollbar-thumb {
    background: #888; /* 滚动条滑块颜色 */
    border-radius: 10px;
  }
  iframe::-webkit-scrollbar-thumb:hover {
    background: #555; /* 鼠标悬停时滑块颜色 */
  .custom-iframe {
    border: 1px solid #9b9999;
    /* 隐藏原生滚动条 */
    overflow: hidden;
  }
}
</style>