src/components/HeaderMenu.vue | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
src/components/pdf/PdfViewerFull.vue | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
src/global.d.ts | 补丁 | 查看 | 原始文档 | blame | 历史 | |
src/pages/pdf/PdfPreview.vue | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
tsconfig.json | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 |
src/components/HeaderMenu.vue
@@ -5,31 +5,15 @@ <img src="@/assets/logo/logo.png" alt="云游四方" class="logo" /> <span class="text-xl font-bold">云游四方</span> </a> <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" <!-- <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> --> <button class="navbar-toggler btn-sm" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="导航菜单" ref="navbarToggler"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarNav"> <!-- <ul class="navbar-nav"> <li class="nav-item"> <a class="nav-link active" aria-current="page" href="#" @click.prevent="navigateTo('/')" >首页</a > </li> <li class="nav-item"> <a class="nav-link" href="#" @click.prevent="navigateTo('/product')" >产品中心</a > </li> <li class="nav-item"> <a class="nav-link" href="#" @click.prevent="navigateTo('/about#third-other')" >关于我们</a> </li> </ul> --> <ul class="navbar-nav"> <li v-for="item in navItems" :key="item.label" class="nav-item"> <a class="nav-link" href="#" :class="{ active: isActive(item.path) }" @@ -48,6 +32,7 @@ </template> <script setup> import { ref } from 'vue'; import { useRouter, useRoute } from "vue-router"; const router = useRouter(); @@ -68,6 +53,9 @@ // 可根据需要改为更精确的匹配逻辑 return route.fullPath === targetPath || route.path === targetPath.split('#')[0]; }; // navbarToggler 引用,用于手动触发点击事件 const navbarToggler = ref(null); const navigateTo = (path) => { if (path.includes('#')) { const [basePath, hash] = path.split('#'); @@ -75,8 +63,15 @@ } else { router.push(path); } if (navbarToggler.value) { navbarToggler.value.click(); } }; </script> <style scoped> src/components/pdf/PdfViewerFull.vue
@@ -1,7 +1,7 @@ <template> <div class="pdf-full-view"> <div v-for="(item, index) in canvases" :key="index" class="pdf-page"> <canvas :ref="el => canvasRefs[index] = el"></canvas> <canvas :ref="el => canvasRefs[index] = el" style="width: 100%;"></canvas> </div> </div> </template> @@ -50,9 +50,11 @@ <style scoped> .pdf-full-view { text-align: center; width: 100%; } .pdf-page { margin-bottom: 20px; width: 100%; } </style> src/global.d.ts
src/pages/pdf/PdfPreview.vue
@@ -43,12 +43,14 @@ <h1 class="fw-bold">{{ projectInfo.name }}</h1> <div class="d-flex justify-content-center align-items-center d-none d-md-flex" > <!-- 动态加载组件 --> <PdfViewerFull v-if="pdfUrl" class="" :src="pdfUrl" :scale="1.0" /> <PdfViewerFull v-if="pdfUrl" style="width: 60%;" :src="pdfUrl" :scale="1.0" /> </div> <div class="w-100 d-flex justify-content-center align-items-center d-block d-md-none" > <div class="w-100 d-flex justify-content-center align-items-center d-block d-md-none main-layout" > <!-- <PdfViewerFull v-if="pdfUrl" style="width: 100%;" :src="pdfUrl" :scale="1.0" /> --> <PdfViewer v-if="pdfUrl" :src="pdfUrl" :scale="0.8" /> <!-- <PdfViewer v-if="pdfUrl" :src="pdfUrl" :scale="0.8" /> --> <PdfViewerFull v-if="pdfUrl" style="width: 90%; ":src="pdfUrl" :scale="1.0" /> </div> </div> tsconfig.json
@@ -1,5 +1,6 @@ { "compilerOptions": { "types": ["vite/client", "webpack-env"], "target": "esnext", "module": "esnext", "moduleResolution": "node",