hookehuyr

feat: 添加Slot和Slots类型支持并优化PDF预览功能

在.eslintrc-auto-import.json中添加Slot和Slots类型支持,优化PdfPreview.vue组件,使其支持动态文件名,并在StudyDetailPage.vue中调整PDF预览逻辑以显示文件标题
......@@ -74,6 +74,8 @@
"watch": true,
"watchEffect": true,
"watchPostEffect": true,
"watchSyncEffect": true
"watchSyncEffect": true,
"Slot": true,
"Slots": true
}
}
......
......@@ -71,6 +71,6 @@ declare global {
// for type re-export
declare global {
// @ts-ignore
export type { Component, ComponentPublicInstance, ComputedRef, DirectiveBinding, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, MaybeRef, MaybeRefOrGetter, VNode, WritableComputedRef } from 'vue'
export type { Component, Slot, Slots, ComponentPublicInstance, ComputedRef, DirectiveBinding, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, MaybeRef, MaybeRefOrGetter, VNode, WritableComputedRef } from 'vue'
import('vue')
}
......
......@@ -21,7 +21,6 @@ declare module 'vue' {
LiveStreamCard: typeof import('./components/ui/LiveStreamCard.vue')['default']
MenuItem: typeof import('./components/ui/MenuItem.vue')['default']
PdfPreview: typeof import('./components/ui/PdfPreview.vue')['default']
PdfViewer: typeof import('./components/ui/PdfViewer.vue')['default']
ReviewPopup: typeof import('./components/courses/ReviewPopup.vue')['default']
RouterLink: typeof import('vue-router')['RouterLink']
RouterView: typeof import('vue-router')['RouterView']
......
......@@ -10,7 +10,7 @@
</template>
<script setup>
import { ref, nextTick, onMounted } from 'vue';
import { ref, nextTick, onMounted, computed } from 'vue';
import { initPdfView, configPdfApiOptions } from "@sunsetglow/vue-pdf-viewer";
import "@sunsetglow/vue-pdf-viewer/dist/style.css";
......@@ -22,6 +22,10 @@ const props = defineProps({
url: {
type: String,
default: ''
},
title: {
type: String,
default: ''
}
});
......@@ -60,7 +64,7 @@ const initPdfViewer = () => {
toolShow: true,
download: true,
clearScale: 1.5,
fileName: "preview.pdf",
fileName: props.title,
lang: "en",
print: false,
watermarkOptions: undefined
......
......@@ -54,7 +54,7 @@
<font-awesome-icon icon="file-alt" class="text-gray-400 text-lg flex-shrink-0" />
<h3 class="text-x font-medium text-gray-900 truncate">{{ item.title }}</h3>
</div>
<div class="text-x text-blue-600 hover:text-blue-800 hover:underline whitespace-nowrap" @click="showPdf(item.url)">查看文件</div>
<div class="text-x text-blue-600 hover:text-blue-800 hover:underline whitespace-nowrap" @click="showPdf(item)">查看文件</div>
</div>
</div>
</div>
......@@ -225,7 +225,7 @@
</van-popup>
<!-- PDF预览 -->
<PdfPreview v-model:show="pdfShow" :url="pdfUrl" />
<PdfPreview v-model:show="pdfShow" :url="pdfUrl" :title="pdfTitle" />
</div>
</template>
......@@ -356,9 +356,11 @@ const handleLessonClick = async (lesson) => {
};
const pdfShow = ref(false);
const pdfTitle = ref('');
const pdfUrl = ref('');
const showPdf = (url) => {
const showPdf = ({title, url}) => {
pdfTitle.value = title;
pdfUrl.value = url;
pdfShow.value = true;
};
......