| 38 | * modal.show('证书文件名'); |
| 39 | */ |
| 40 | export function createModal(modalId: string): ModalController { |
| 41 | // 找到页面上的模态框元素 |
| 42 | const modal = document.getElementById(modalId); |
| 43 | if (!modal) { |
| 44 | console.error('找不到模态框元素:', modalId); |
| 45 | // 返回空函数，避免后续调用报错 |
| 46 | return { |
| 47 | show: () => {}, |
| 48 | hide: () => {}, |
| 49 | onConfirm: () => {}, |
| 50 | }; |
| 51 | } |
| 52 | |
| 53 | // TypeScript 窄化：此时 modal 一定非 null |
| 54 | const modalEl = modal; |
| 55 | |
| 56 | const confirmMessage = document.getElementById('confirmMessage'); |
| 57 | const confirmDeleteButton = document.getElementById('confirmDelete'); |
| 58 | const cancelDeleteButton = document.getElementById('cancelDelete'); |
| 59 | |
| 60 | // 内部状态：当前要删除的文件名和确认后的回调函数 |
| 61 | let currentFileName: string | null = null; |
| 62 | let confirmCallback: ConfirmCallback | null = null; |
| 63 | |
| 64 | /** |
| 65 | * 显示模态框 |
| 66 | */ |
| 67 | function show(fileName: string): void { |
| 68 | currentFileName = fileName; |
| 69 | modalEl.style.display = 'block'; |
| 70 | if (confirmMessage) { |
| 71 | confirmMessage.textContent = t('confirmDeleteCert', fileName); |
| 72 | } |
| 73 | } |
| 74 | |
| 75 | /** |
| 76 | * 隐藏模态框 |
| 77 | */ |
| 78 | function hide(): void { |
| 79 | modalEl.style.display = 'none'; |
| 80 | currentFileName = null; |
| 81 | } |
| 82 | |
| 83 | /** |
| 84 | * 注册确认后的回调函数 |
| 85 | */ |
| 86 | function onConfirm(callback: ConfirmCallback): void { |
| 87 | confirmCallback = callback; |
| 88 | } |
| 89 | |
| 90 | // 绑定确认按钮的点击事件 |
| 91 | if (confirmDeleteButton) { |
| 92 | confirmDeleteButton.onclick = () => { |
| 93 | // 只有当前有目标文件且注册了回调时才执行 |
| 94 | if (currentFileName && confirmCallback) { |
| 95 | confirmCallback(currentFileName); |
| 96 | } |
| 97 | hide(); |