From cb66b65c5fa4e70632625e8393dd00831507d2c0 Mon Sep 17 00:00:00 2001
From: gaoluyang <2820782392@qq.com>
Date: 星期四, 06 八月 2026 17:09:53 +0800
Subject: [PATCH] 银川 1.添加全局预览附件功能
---
src/components/upload/file-upload.vue | 35 +++++++++++++++++++++++++++++++++--
1 files changed, 33 insertions(+), 2 deletions(-)
diff --git a/src/components/upload/file-upload.vue b/src/components/upload/file-upload.vue
index fb2f1dd..15eb640 100644
--- a/src/components/upload/file-upload.vue
+++ b/src/components/upload/file-upload.vue
@@ -10,9 +10,12 @@
import { IconifyIcon } from '@vben/icons';
import { $t } from '@vben/locales';
-import { checkFileType, isFunction, isObject, isString } from '@vben/utils';
+import { checkFileType, isFunction, isImage, isObject, isString } from '@vben/utils';
import { Button, message, Upload } from 'ant-design-vue';
+
+import { requestClient } from '#/api/request';
+import { FilePreviewModal, useFilePreview } from '#/components/file-preview';
import { UploadResultStatus } from './typing';
import { useUpload, useUploadType } from './use-upload';
@@ -139,8 +142,31 @@
}
}
+const { openPreview, previewState } = useFilePreview();
+const previewLoading = ref(false);
+
/** 澶勭悊鏂囦欢棰勮 */
-function handlePreview(file: UploadFile) {
+async function handlePreview(file: UploadFile) {
+ const url = (file as any)?.url || (file as any)?.response?.url || (file as any)?.response;
+ if (!url) {
+ message.warning('鏂囦欢鍦板潃涓嶅瓨鍦紝鏃犳硶棰勮');
+ return;
+ }
+ const name = file.name || (file as any)?.fileName || '';
+ if (isImage(name || url)) {
+ window.open(url, '_blank');
+ return;
+ }
+ previewLoading.value = true;
+ try {
+ const blob = await requestClient.get(url, { responseType: 'blob' }) as unknown as Blob;
+ const blobUrl = URL.createObjectURL(blob);
+ openPreview(blobUrl, name);
+ } catch {
+ message.error('鏂囦欢鍔犺浇澶辫触锛岃灏濊瘯涓嬭浇鍚庢煡鐪�');
+ } finally {
+ previewLoading.value = false;
+ }
emit('preview', file);
}
@@ -319,6 +345,11 @@
鏍煎紡鏂囦欢
</div>
</Upload>
+ <FilePreviewModal
+ v-model:visible="previewState.visible.value"
+ :file-url="previewState.fileUrl.value"
+ :file-name="previewState.fileName.value"
+ />
</div>
</template>
--
Gitblit v1.9.3