diff --git a/src/components/ShowFile/ShowFile.vue b/src/components/ShowFile/ShowFile.vue index 8472341..7d8d184 100644 --- a/src/components/ShowFile/ShowFile.vue +++ b/src/components/ShowFile/ShowFile.vue @@ -658,10 +658,11 @@ :file="videoPreviewRow" :status.sync="videoPreviewVisible" > - + @@ -835,7 +836,7 @@ import '@/utils/directives.js' import fileConfig from '@/utils/file-config' import EditElement from '@/views/markdown/EditElement' -import OfficePreview from '@/components/preview/OfficePreview' +import IframePreview from '@/components/preview/IframePreview.vue' import ShareDialog from '@/components/ShareDialog/index.vue' import Clipboard from 'clipboard' import TagDialog from '@/components/TagDialog/index.vue' @@ -847,7 +848,7 @@ export default { FileDetails, TagDialog, ShareDialog, - OfficePreview, + IframePreview, EditElement, MessageDialog, AudioPreview, @@ -1107,9 +1108,21 @@ export default { imagePreviewVisible: false, videoPreviewRow: {}, videoPreviewVisible: false, - officePreviewRow: {}, - officePreviewVisible: false, + iframePreviewRow: {}, + fileHandler: {}, + iframePreviewVisible: false, audioPreviewRow: {}, + fileHandlers: { + "pdf": { + "PDF.js": "https://alist-org.github.io/pdf.js/web/viewer.html?file=$e_url", + }, + "epub": { + "EPUB.js": "https://alist-org.github.io/static/epub.js/viewer.html?url=$e_url", + }, + "dwg": { + "kkPreview": "http://192.168.0.233:8012/onlinePreview?url=$eb_url", + } + }, audioPreviewVisible: false, drawer: false, rowStyleExecuting: false, @@ -2519,8 +2532,8 @@ export default { case 'docx': case 'xlsx': case 'pptx': - this.officePreviewRow = res.data - this.officePreviewVisible = true + this.iframePreviewRow = res.data + this.iframePreviewVisible = true break } const that = this @@ -4234,6 +4247,14 @@ export default { this.$emit('selectedFile', selectFile) return } + const fileHandler = this.hasIframePreview(row.suffix, this.fileHandlers) + if (fileHandler !== null) { + // iframe 预览 + this.iframePreviewVisible = true + this.iframePreviewRow = row + this.fileHandler = {} + return + } if (row.contentType.startsWith('image')) { // 图片 this.imagePreviewVisible = true @@ -4265,13 +4286,11 @@ export default { this.openCompressionVisible = true return } - if ( - row.contentType.indexOf('office') > -1 || - ['pdf', 'csv', 'drawio', 'mind', 'glb', 'gltf', 'glTF'].includes(row.suffix) - ) { - // office文件 - this.officePreviewVisible = true - this.officePreviewRow = row + if (row.contentType.indexOf('office') > -1 || ['pdf', 'csv', 'drawio', 'mind', 'glb', 'gltf'].includes(row.suffix)) { + // iframe 预览 + this.iframePreviewVisible = true + this.iframePreviewRow = row + this.fileHandler = {} return } if (row.contentType.indexOf('utf-8') > -1) { @@ -4283,6 +4302,15 @@ export default { this.notPreviewDialogVisible = true } }, + hasIframePreview(suffix, fileHandlers) { + for (let key in fileHandlers) { + const extensions = key.split(',') + if (extensions.includes(suffix)) { + return fileHandlers[key] + } + } + return null + }, determineDownload(file) { this.download(file) this.notPreviewDialogVisible = false diff --git a/src/components/office/OnlyOfficeEditor.vue b/src/components/office/OnlyOfficeEditor.vue index 59f0a3e..8e38057 100644 --- a/src/components/office/OnlyOfficeEditor.vue +++ b/src/components/office/OnlyOfficeEditor.vue @@ -103,10 +103,18 @@ export default { if (!id) { return } - settingApi.getOfficeConfig().then(res => { - this.officeServerConfig = res.data - this.loadOfficeApi() - }) + + if (window.shareId) { + settingApi.getPublicOfficeConfig({shareId: window.shareId, shareToken: this.$store.getters.shareToken}).then(res => { + this.officeServerConfig = res.data + this.loadOfficeApi() + }) + } else { + settingApi.getOfficeConfig().then(res => { + this.officeServerConfig = res.data + this.loadOfficeApi() + }) + } }, immediate: true, }, diff --git a/src/components/preview/IframeContentPreview.vue b/src/components/preview/IframeContentPreview.vue new file mode 100644 index 0000000..11f01ef --- /dev/null +++ b/src/components/preview/IframeContentPreview.vue @@ -0,0 +1,169 @@ + + + + diff --git a/src/components/preview/OfficePreview.vue b/src/components/preview/IframePreview.vue similarity index 88% rename from src/components/preview/OfficePreview.vue rename to src/components/preview/IframePreview.vue index 4110bbd..1ae816c 100644 --- a/src/components/preview/OfficePreview.vue +++ b/src/components/preview/IframePreview.vue @@ -16,11 +16,13 @@
+
{{fileType}}
- + +
@@ -32,14 +34,15 @@ import ModelPreview from '@/components/office/ModelPreview.vue' import OnlyOfficeEditor from "@/components/office/OnlyOfficeEditor"; import MessageDialog from "@/components/message/MessageDialog"; +import IframeContentPreview from '@/components/preview/IframeContentPreview.vue' import fileConfig from "@/utils/file-config"; import PdfPreview from "@/components/office/PdfPreview"; import Drawio from "@/components/office/Drawio"; import MyMindEditor from "@/components/Minder/minder" export default { - name: 'OfficePreview', - components: { ModelPreview, Drawio, PdfPreview, MessageDialog, OnlyOfficeEditor, MyMindEditor}, + name: 'IframePreview', + components: { IframeContentPreview, ModelPreview, Drawio, PdfPreview, MessageDialog, OnlyOfficeEditor, MyMindEditor}, props: { id: { type: String, @@ -53,6 +56,10 @@ export default { return {} } }, + fileHandler: { + type: Object, + default: undefined + }, shareId: { type: String, default: undefined @@ -120,6 +127,12 @@ export default { } }, getType(suffix) { + if (this.fileHandler.length > 0) { + return 'other' + } + if (this.file.contentType.indexOf('office') > -1) { + return 'office' + } switch (suffix) { case 'drawio': return 'drawio' @@ -130,8 +143,11 @@ export default { case 'gltf': case 'glb': return 'glTF/GLB' - default: + case 'office': + case 'csv': return 'office' + default: + return 'other' } }, /** diff --git a/src/styles/home-index.scss b/src/styles/home-index.scss index feee703..5841c3b 100644 --- a/src/styles/home-index.scss +++ b/src/styles/home-index.scss @@ -285,7 +285,7 @@ } >>> .van-grid { - padding: 0; + padding-left: 10px; } >>> .van-grid-item__content .svg-icon{ diff --git a/src/views/home/mobile/index.vue b/src/views/home/mobile/index.vue index 901c751..3bb70b8 100644 --- a/src/views/home/mobile/index.vue +++ b/src/views/home/mobile/index.vue @@ -268,7 +268,7 @@ - +