Browse Source

pdf预览测试

ZaiZai 1 year ago
parent
commit
7ca6716be5
4 changed files with 21 additions and 26 deletions
  1. 1 1
      public/version.json
  2. 6 6
      src/router/modules/base.js
  3. 1 5
      src/utils/btn-auth.js
  4. 13 14
      src/views/home/pdf.vue

+ 1 - 1
public/version.json

@@ -1,3 +1,3 @@
 {
-  "value": "20240102171931"
+  "value": "20240119151856"
 }

+ 6 - 6
src/router/modules/base.js

@@ -24,6 +24,12 @@ export default [
         meta: { title: '授权登录' },
         component: () => import('~src/views/home/auth.vue'),
     },
+    {
+        path: '/pdf',
+        name: 'pdf',
+        meta: { title: 'pdf文件预览' },
+        component: () => import('~src/views/home/pdf.vue'),
+    },
     {
         path: '/home',
         name: 'home',
@@ -37,12 +43,6 @@ export default [
                 meta: { title: '数据看板' },
                 component: () => import('~src/views/home/index.vue'),
             },
-            {
-                path: '/pdf',
-                name: 'pdf',
-                meta: { title: 'pdf文件预览' },
-                component: () => import('~src/views/home/pdf.vue'),
-            },
         ],
     },
     {

+ 1 - 5
src/utils/btn-auth.js

@@ -1,5 +1,4 @@
 import pinia from '~src/store/init'
-import router from '~src/router/index'
 import { useAppStore } from '~src/store'
 import { decode, encode } from 'js-base64'
 import { getObjVal, isNullES } from 'js-fast-way'
@@ -23,10 +22,7 @@ export const toPdfPage = (url) => {
         window.$message.warning('pdf地址为空')
         return
     }
-    router.push({
-        name: 'pdf',
-        query: { code: encode(url) },
-    })
+    window.open('/#/pdf?code=' + encode(url), '_blank')
 }
 
 export { encode, decode }

+ 13 - 14
src/views/home/pdf.vue

@@ -1,21 +1,14 @@
 <template>
-    <hc-new-card>
-        <template #extra>
-            <el-button type="primary" @click="goBack">
-                <HcIcon name="close" />
-                关闭
-            </el-button>
-        </template>
+    <div class="hc-pdf-page-box">
         <hc-pdf :src="pdfUrl" :download="isDownload" :print="isPrint" />
-    </hc-new-card>
+    </div>
 </template>
 
 <script setup>
 import { isNullES } from 'js-fast-way'
-import { onActivated, ref } from 'vue'
+import { onMounted, ref } from 'vue'
 import { useRoute } from 'vue-router'
 import { btnAuth, decode } from '~uti/btn-auth'
-import router from '~src/router/index'
 
 //初始变量
 const useRoutes = useRoute()
@@ -28,7 +21,7 @@ defineOptions({
 
 //渲染完成
 const pdfUrl = ref('')
-onActivated(() => {
+onMounted(() => {
     const { url, code } = useRoutes.query
     //如果url和code都为空,不做处理
     if (isNullES(url) && isNullES(code)) {
@@ -47,7 +40,13 @@ onActivated(() => {
     //两个都有的情况下,以code为准
     pdfUrl.value = decode(code ?? '')
 })
-const goBack = ()=>{
-    router.back()
-}
 </script>
+
+<style scoped>
+.hc-pdf-page-box {
+    position: relative;
+    height: 100%;
+    width: 100%;
+    overflow: hidden;
+}
+</style>