import syssocket from '@/common/syssocket'; import { reactive, h } from 'vue'; import { ElNotification } from 'element-plus'; import MachineFileUploadProgress from './MachineFileUploadProgress.vue'; // 文件上传进度通知映射表(key: uploadId, value: 通知实例) const fileUploadNotifyMap: Map = new Map(); /** * 构建机器文件上传进度组件属性 */ const buildMachineFileUploadProgressProps = (): any => { return { progress: reactive({ authCertName: '', // 授权凭证名 path: '', // 文件路径 filename: '', uploadedSize: 0, totalSize: 0, timestamp: 0, status: '', // '' | 'success' | 'exception' }), }; }; /** * 注册机器文件上传进度消息处理 */ export async function registerMachineFileUploadProgress() { await syssocket.registerMsgHandler('machineFileUploadProgress', function (message: any) { const content = message.params; const uploadId = content.uploadId; // 上传完成或失败,关闭通知 if (content.status === 'complete' || content.status === 'error') { const notify = fileUploadNotifyMap.get(uploadId); if (notify && notify.notification) { // 更新最终状态 notify.props.progress.status = content.status === 'complete' ? 'success' : 'exception'; notify.props.progress.percent = content.status === 'complete' ? 100 : notify.props.progress.percent; // 强制更新 VNode try { if (notify.notification.state) { notify.notification.state.message = h(MachineFileUploadProgress, notify.props); } else if (notify.notification.vm) { notify.notification.vm.exposed?.message?.(h(MachineFileUploadProgress, notify.props)); } } catch (e) { console.warn('[MachineFileUpload] Failed to update notification VNode:', e); } // 1秒后关闭通知 setTimeout(() => { if (notify.notification) { notify.notification.close(); } fileUploadNotifyMap.delete(uploadId); }, 1000); } return; } // 获取或创建通知 let notify = fileUploadNotifyMap.get(uploadId); if (!notify) { notify = { props: buildMachineFileUploadProgressProps(), notification: undefined, }; fileUploadNotifyMap.set(uploadId, notify); } // 更新进度 notify.props.progress.authCertName = content.authCertName || ''; notify.props.progress.path = content.path || ''; notify.props.progress.filename = content.filename || notify.props.progress.filename; notify.props.progress.uploadedSize = content.uploadedSize || 0; notify.props.progress.totalSize = content.totalSize || 0; notify.props.progress.timestamp = content.timestamp || 0; notify.props.progress.status = 'uploading'; // 首次创建通知 if (!notify.notification) { notify.notification = ElNotification({ duration: 0, title: message.title || '机器文件上传', message: h(MachineFileUploadProgress, notify.props), showClose: true, offset: 60, customClass: 'machine-file-upload-notification', }); } else { // 已存在通知,强制更新 message try { if (notify.notification.state) { notify.notification.state.message = h(MachineFileUploadProgress, notify.props); } else if (notify.notification.vm) { notify.notification.vm.exposed?.message?.(h(MachineFileUploadProgress, notify.props)); } } catch (e) { console.warn('[MachineFileUpload] Failed to update notification VNode:', e); } } }); }