From c4c0ebba0f4f5586878eb8575e2feb834dbf55df Mon Sep 17 00:00:00 2001
From: zuohuaijun <zuohuaijun@163.com>
Date: Sun, 26 Jan 2025 02:37:44 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=98=8E=E5=A2=9E=E5=8A=A0=E6=96=87?=
 =?UTF-8?q?=E4=BB=B6=E9=A2=84=E8=A7=88=E7=AD=89=E5=BE=85=E6=9D=A1Loading?=
 =?UTF-8?q?=E6=98=BE=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 Web/src/views/system/file/index.vue | 18 +++++++++++++-----
 1 file changed, 13 insertions(+), 5 deletions(-)

diff --git a/Web/src/views/system/file/index.vue b/Web/src/views/system/file/index.vue
index ea73a141..e80d2285 100644
--- a/Web/src/views/system/file/index.vue
+++ b/Web/src/views/system/file/index.vue
@@ -124,13 +124,13 @@
 		</splitpanes>
 
 		<el-drawer :title="state.fileName" v-model="state.docxVisible" size="70%" destroy-on-close>
-			<vue-office-docx :src="state.docxUrl" style="height: calc(100vh - 37px)" @rendered="handleRendered" @error="handleError" />
+			<vue-office-docx v-loading="state.loading" :src="state.docxUrl" style="height: calc(100vh - 37px)" @rendered="handleRendered" @error="handleError" />
 		</el-drawer>
 		<el-drawer :title="state.fileName" v-model="state.xlsxVisible" size="70%" destroy-on-close>
-			<vue-office-excel :src="state.excelUrl" style="height: calc(100vh - 37px)" @rendered="handleRendered" @error="handleError" />
+			<vue-office-excel v-loading="state.loading" :src="state.excelUrl" style="height: calc(100vh - 37px)" @rendered="handleRendered" @error="handleError" />
 		</el-drawer>
 		<el-drawer :title="state.fileName" v-model="state.pdfVisible" size="70%" destroy-on-close>
-			<vue-office-pdf :src="state.pdfUrl" style="height: calc(100vh - 37px)" @rendered="handleRendered" @error="handleError" />
+			<vue-office-pdf v-loading="state.loading" :src="state.pdfUrl" style="height: calc(100vh - 37px)" @rendered="handleRendered" @error="handleError" />
 		</el-drawer>
 		<el-image-viewer v-if="state.showViewer" :url-list="state.previewList" :hideOnClickModal="true" @close="state.showViewer = false"></el-image-viewer>
 		<EditFile ref="editRef" title="编辑文件" @handleQuery="handleQuery" />
@@ -169,6 +169,7 @@ const editRef = ref<InstanceType<typeof EditFile>>();
 const fileTreeRef = ref<InstanceType<typeof FileTree>>();
 
 const state = reactive({
+	loading: false,
 	queryParams: {
 		fileName: undefined,
 		filePath: undefined,
@@ -330,6 +331,7 @@ const handleNodeChange = async (node: any) => {
 
 // 打开Pdf预览页面
 const showPreviewDialog = async (row: any) => {
+	state.loading = true;
 	if (row.suffix == '.pdf') {
 		state.fileName = `【${row.fileName}${row.suffix}】`;
 		state.pdfUrl = fetchFileUrl(row);
@@ -365,8 +367,14 @@ const handleEdit = (row: any) => {
 };
 
 // 文件渲染完成
-const handleRendered = () => {};
+const handleRendered = () => {
+	state.loading = false;
+};
 
 // 文件渲染失败
-const handleError = () => {};
+const handleError = () => {
+	ElMessage.error('预览失败');
+	state.loading = false;
+	state.docxVisible = false;
+};
 </script>