all

src/components/pdfPreview.vue

@@ -0,0 +1,54 @@
+<template>
+  <div class="pdf-preview">
+    <div class="pdf-wrap">
+<!--      <vue-pdf-embed :source="state.source" class="vue-pdf-embed" :page="state.pageNum" />-->
+    </div>
+  </div>
+</template>
+<!-- <script>-->
+<!--  <script setup  lang="ts">-->
+<!--import { reactive, onMounted, computed } from "vue";-->
+<!--import VuePdfEmbed from "vue-pdf-embed";-->
+<!--import { createLoadingTask } from "vue3-pdfjs";-->
+
+<!--const state = reactive({-->
+<!--  source: props.pdfUrl,-->
+<!--  pageNum: 1,-->
+<!--  scale: 1, // 缩放比例-->
+<!--  numPages: 0, // 总页数-->
+<!--});-->
+
+
+<!--const props = defineProps({-->
+<!--  pdfUrl: {-->
+<!--    type: String,-->
+<!--    required: true-->
+<!--  }-->
+<!--})-->
+
+<!--onMounted(() => {-->
+<!--  const loadingTask = createLoadingTask(state.source);-->
+<!--  loadingTask.promise.then((pdf:{numPages: number}) => {-->
+<!--    state.numPages = pdf.numPages;-->
+<!--  });-->
+<!--});-->
+
+<!--</script>-->
+<style lang="css" scoped>
+.pdf-preview {
+  position: relative;
+  height: 100vh;
+  padding: 20px 0;
+  box-sizing: border-box;
+  background: rgb(66, 66, 66);
+}
+
+.vue-pdf-embed {
+  text-align: center;
+  width: 515px;
+  border: 1px solid #e5e5e5;
+  margin: 0 auto;
+  box-sizing: border-box;
+}
+
+</style>