Update WorkspaceView.vue

This commit is contained in:
Baobhan Sith
2025-05-03 20:44:19 +08:00
parent 1e746883b2
commit 2ab0d9752e
+14 -17
View File
@@ -1,33 +1,30 @@
<script setup lang="ts"> <script setup lang="ts">
import { onMounted, onBeforeUnmount, computed, ref } from 'vue'; import { onMounted, onBeforeUnmount, computed, ref } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { storeToRefs } from 'pinia'; // 导入 storeToRefs import { storeToRefs } from 'pinia';
import { useLayoutStore } from '../stores/layout.store'; // *** 重新导入 layoutStore *** import { useLayoutStore } from '../stores/layout.store';
import { useConnectionsStore, type ConnectionInfo } from '../stores/connections.store'; // +++ 导入 connectionsStore +++ import { useConnectionsStore, type ConnectionInfo } from '../stores/connections.store';
// 移除不再直接使用的组件导入
import AddConnectionFormComponent from '../components/AddConnectionForm.vue'; import AddConnectionFormComponent from '../components/AddConnectionForm.vue';
import TerminalTabBar from '../components/TerminalTabBar.vue'; import TerminalTabBar from '../components/TerminalTabBar.vue';
import LayoutRenderer from '../components/LayoutRenderer.vue'; // *** 导入布局渲染器 *** import LayoutRenderer from '../components/LayoutRenderer.vue';
import LayoutConfigurator from '../components/LayoutConfigurator.vue'; // *** 导入布局配置器 *** import LayoutConfigurator from '../components/LayoutConfigurator.vue';
import RemoteDesktopModal from '../components/RemoteDesktopModal.vue'; // +++ 导入 RDP 模态框 +++ import RemoteDesktopModal from '../components/RemoteDesktopModal.vue';
import { useSessionStore, type SessionTabInfoWithStatus, type SshTerminalInstance } from '../stores/session.store'; // 导入 session store import { useSessionStore, type SessionTabInfoWithStatus, type SshTerminalInstance } from '../stores/session.store';
import { useSettingsStore } from '../stores/settings.store'; import { useSettingsStore } from '../stores/settings.store';
import { useFileEditorStore, type FileTab } from '../stores/fileEditor.store'; // + Import FileTab type import { useFileEditorStore, type FileTab } from '../stores/fileEditor.store';
// import { useLayoutStore } from '../stores/layout.store'; // 重复导入,移除
import { useCommandHistoryStore } from '../stores/commandHistory.store'; import { useCommandHistoryStore } from '../stores/commandHistory.store';
// import type { ConnectionInfo } from '../stores/connections.store'; // 重复导入,移除 import type { Terminal } from 'xterm';
import type { Terminal } from 'xterm'; // *** 导入 Terminal 类型 *** import type { ISearchOptions } from '@xterm/addon-search';
import type { ISearchOptions } from '@xterm/addon-search'; // *** 导入搜索选项类型 ***
// --- Setup --- // --- Setup ---
const { t } = useI18n(); const { t } = useI18n();
const sessionStore = useSessionStore(); // 获取 session store 实例 const sessionStore = useSessionStore();
const settingsStore = useSettingsStore(); const settingsStore = useSettingsStore();
const fileEditorStore = useFileEditorStore(); const fileEditorStore = useFileEditorStore();
const layoutStore = useLayoutStore(); // *** 确保 layoutStore 实例存在 *** const layoutStore = useLayoutStore();
const commandHistoryStore = useCommandHistoryStore(); const commandHistoryStore = useCommandHistoryStore();
const connectionsStore = useConnectionsStore(); // +++ 获取 connectionsStore 实例 +++ const connectionsStore = useConnectionsStore();
const { isHeaderVisible } = storeToRefs(layoutStore); // *** 获取 isHeaderVisible 状态 *** const { isHeaderVisible } = storeToRefs(layoutStore);
// --- 从 Store 获取响应式状态和 Getters --- // --- 从 Store 获取响应式状态和 Getters ---
const { sessionTabsWithStatus, activeSessionId, activeSession, isRdpModalOpen, rdpConnectionInfo } = storeToRefs(sessionStore); // 使用 storeToRefs 获取 RDP 状态 const { sessionTabsWithStatus, activeSessionId, activeSession, isRdpModalOpen, rdpConnectionInfo } = storeToRefs(sessionStore); // 使用 storeToRefs 获取 RDP 状态