feat: 添加自定义对话模态框

packages/frontend/src/views/CommandHistoryView.vue

@@ -92,8 +92,10 @@ import { useWorkspaceEventEmitter } from '../composables/workspaceEvents';
 import { useSessionStore } from '../stores/session.store'; 
 import type { SessionState } from '../stores/session/types'; 
 import { useConnectionsStore } from '../stores/connections.store';
+import { useConfirmDialog } from '../composables/useConfirmDialog';
 
 const commandHistoryStore = useCommandHistoryStore();
+const { showConfirmDialog } = useConfirmDialog();
 const uiNotificationsStore = useUiNotificationsStore();
 const { t } = useI18n();
 const focusSwitcherStore = useFocusSwitcherStore(); // +++ 实例化焦点切换 Store +++
@@ -208,8 +210,11 @@ const handleSearchInputBlur = () => {
 };
 
 // 确认清空所有历史记录
-const confirmClearAll = () => {
-  if (window.confirm(t('commandHistory.confirmClear', '确定要清空所有历史记录吗？'))) {
+const confirmClearAll = async () => { // 注意 async
+  const confirmed = await showConfirmDialog({
+    message: t('commandHistory.confirmClear', '确定要清空所有历史记录吗？')
+  });
+  if (confirmed) {
     commandHistoryStore.clearAllHistory();
   }
 };

packages/frontend/src/views/ConnectionsView.vue

@@ -10,13 +10,14 @@ import type { SortField, SortOrder } from '../stores/settings.store';
 import { useI18n } from 'vue-i18n';
 import { useRouter } from 'vue-router';
 import type { ConnectionInfo } from '../stores/connections.store';
+import { useConfirmDialog } from '../composables/useConfirmDialog';
 import { storeToRefs } from 'pinia';
 import { formatDistanceToNow } from 'date-fns';
 import { zhCN, enUS, ja } from 'date-fns/locale';
 import type { Locale } from 'date-fns';
 
 const { t, locale } = useI18n();
-const router = useRouter();
+const { showConfirmDialog } = useConfirmDialog();
 const connectionsStore = useConnectionsStore();
 const sessionStore = useSessionStore();
 const tagsStore = useTagsStore();
@@ -282,7 +283,11 @@ const handleBatchDeleteConnections = async () => {
     `您确定要删除选中的 ${selectedConnectionIdsForBatch.value.size} 个连接吗？此操作无法撤销。`
   );
 
-  if (window.confirm(confirmMessage)) {
+
+  const confirmed = await showConfirmDialog({
+    message: confirmMessage
+  });
+  if (confirmed) {
     isDeletingSelectedConnections.value = true;
     try {
       const idsToDelete = Array.from(selectedConnectionIdsForBatch.value);
@@ -293,7 +298,7 @@ const handleBatchDeleteConnections = async () => {
 
       selectedConnectionIdsForBatch.value.clear();
 
-      await connectionsStore.fetchConnections(); 
+      await connectionsStore.fetchConnections();
     } catch (error: any) {
       console.error("Batch delete connections error:", error);
       alert(t('connections.batchEdit.errorMessage', `批量删除连接失败: ${error.message || '未知错误'}`));

packages/frontend/src/views/QuickCommandsView.vue

@@ -233,6 +233,7 @@ import { useQuickCommandsStore, type QuickCommandFE, type QuickCommandSortByType
 import { useQuickCommandTagsStore } from '../stores/quickCommandTags.store'; 
 import { useUiNotificationsStore } from '../stores/uiNotifications.store';
 import { useI18n } from 'vue-i18n';
+import { useConfirmDialog } from '../composables/useConfirmDialog';
 import AddEditQuickCommandForm from '../components/AddEditQuickCommandForm.vue';
 import { useFocusSwitcherStore } from '../stores/focusSwitcher.store'; 
 import { useSettingsStore } from '../stores/settings.store';
@@ -245,6 +246,7 @@ const quickCommandsStore = useQuickCommandsStore();
 const quickCommandTagsStore = useQuickCommandTagsStore(); 
 const uiNotificationsStore = useUiNotificationsStore();
 const { t } = useI18n();
+const { showConfirmDialog } = useConfirmDialog();
 const focusSwitcherStore = useFocusSwitcherStore();
 const settingsStore = useSettingsStore();
 const emitWorkspaceEvent = useWorkspaceEventEmitter();
@@ -510,8 +512,11 @@ const closeForm = () => {
   commandToEdit.value = null;
 };
 
-const confirmDelete = (command: QuickCommandFE) => {
-  if (window.confirm(t('quickCommands.confirmDelete', { name: command.name || command.command }))) {
+const confirmDelete = async (command: QuickCommandFE) => {
+  const confirmed = await showConfirmDialog({
+    message: t('quickCommands.confirmDelete', { name: command.name || command.command })
+  });
+  if (confirmed) {
     quickCommandsStore.deleteQuickCommand(command.id);
   }
 };