😎增加文件预览等待条Loading显示
This commit is contained in:
parent
c4ea5296cb
commit
c4c0ebba0f
@ -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>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user