feat: 本地记忆连接列表的分组折叠状态
This commit is contained in:
@@ -37,8 +37,30 @@ const contextMenuVisible = ref(false);
|
|||||||
const contextMenuPosition = ref({ x: 0, y: 0 });
|
const contextMenuPosition = ref({ x: 0, y: 0 });
|
||||||
const contextTargetConnection = ref<ConnectionInfo | null>(null);
|
const contextTargetConnection = ref<ConnectionInfo | null>(null);
|
||||||
|
|
||||||
// 分组展开状态
|
// +++ 本地存储键名 +++
|
||||||
const expandedGroups = ref<Record<string, boolean>>({}); // 使用 Record<string, boolean>
|
const EXPANDED_GROUPS_STORAGE_KEY = 'workspaceConnectionListExpandedGroups';
|
||||||
|
|
||||||
|
// +++ 加载初始分组展开状态 +++
|
||||||
|
const loadInitialExpandedGroups = (): Record<string, boolean> => {
|
||||||
|
try {
|
||||||
|
const storedState = localStorage.getItem(EXPANDED_GROUPS_STORAGE_KEY);
|
||||||
|
if (storedState) {
|
||||||
|
const parsedState = JSON.parse(storedState);
|
||||||
|
// 简单验证一下是否是对象
|
||||||
|
if (typeof parsedState === 'object' && parsedState !== null) {
|
||||||
|
return parsedState;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
console.error('Failed to load or parse expanded groups state from localStorage:', e);
|
||||||
|
localStorage.removeItem(EXPANDED_GROUPS_STORAGE_KEY); // 清除无效状态
|
||||||
|
}
|
||||||
|
// 默认返回空对象,让 computed 属性处理默认展开
|
||||||
|
return {};
|
||||||
|
};
|
||||||
|
|
||||||
|
// 分组展开状态 - 从 localStorage 初始化
|
||||||
|
const expandedGroups = ref<Record<string, boolean>>(loadInitialExpandedGroups());
|
||||||
|
|
||||||
// --- 移除 RDP 模态框状态 ---
|
// --- 移除 RDP 模态框状态 ---
|
||||||
// const showRdpModal = ref(false);
|
// const showRdpModal = ref(false);
|
||||||
@@ -96,8 +118,9 @@ const filteredAndGroupedConnections = computed(() => {
|
|||||||
const groupName = tag.name;
|
const groupName = tag.name;
|
||||||
if (!groups[groupName]) {
|
if (!groups[groupName]) {
|
||||||
groups[groupName] = [];
|
groups[groupName] = [];
|
||||||
|
// +++ 如果状态未定义,则明确设为 true (展开) +++
|
||||||
if (expandedGroups.value[groupName] === undefined) {
|
if (expandedGroups.value[groupName] === undefined) {
|
||||||
expandedGroups.value[groupName] = true; // 默认展开
|
expandedGroups.value[groupName] = true;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
// 避免重复添加(如果一个连接有多个标签)
|
// 避免重复添加(如果一个连接有多个标签)
|
||||||
@@ -130,32 +153,42 @@ const filteredAndGroupedConnections = computed(() => {
|
|||||||
|
|
||||||
if (untagged.length > 0) {
|
if (untagged.length > 0) {
|
||||||
const untaggedGroupName = t('workspaceConnectionList.untagged');
|
const untaggedGroupName = t('workspaceConnectionList.untagged');
|
||||||
|
// +++ 如果状态未定义,则明确设为 true (展开) +++
|
||||||
if (expandedGroups.value[untaggedGroupName] === undefined) {
|
if (expandedGroups.value[untaggedGroupName] === undefined) {
|
||||||
expandedGroups.value[untaggedGroupName] = true; // 默认展开
|
expandedGroups.value[untaggedGroupName] = true;
|
||||||
}
|
}
|
||||||
result.push({ groupName: untaggedGroupName, connections: untagged });
|
result.push({ groupName: untaggedGroupName, connections: untagged });
|
||||||
}
|
}
|
||||||
|
|
||||||
return result;
|
return result;
|
||||||
});
|
});
|
||||||
|
|
||||||
|
// +++ 监听分组状态变化并保存到 localStorage +++
|
||||||
|
watch(expandedGroups, (newState) => {
|
||||||
|
try {
|
||||||
|
localStorage.setItem(EXPANDED_GROUPS_STORAGE_KEY, JSON.stringify(newState));
|
||||||
|
} catch (e) {
|
||||||
|
console.error('Failed to save expanded groups state to localStorage:', e);
|
||||||
|
}
|
||||||
|
}, { deep: true });
|
||||||
|
|
||||||
// 监听搜索词变化,重置高亮索引
|
// 监听搜索词变化,重置高亮索引
|
||||||
watch(searchTerm, () => {
|
watch(searchTerm, () => {
|
||||||
highlightedIndex.value = -1;
|
highlightedIndex.value = -1;
|
||||||
});
|
});
|
||||||
|
|
||||||
// 监听分组展开状态变化,重置高亮索引
|
// 监听分组展开状态变化,重置高亮索引 (这个 watch 保留,用于重置高亮)
|
||||||
watch(expandedGroups, () => {
|
watch(expandedGroups, () => {
|
||||||
highlightedIndex.value = -1;
|
highlightedIndex.value = -1;
|
||||||
}, { deep: true });
|
}, { deep: true });
|
||||||
|
|
||||||
|
|
||||||
// 切换分组展开/折叠
|
// 切换分组展开/折叠
|
||||||
const toggleGroup = (groupName: string) => {
|
const toggleGroup = (groupName: string) => {
|
||||||
expandedGroups.value[groupName] = !expandedGroups.value[groupName];
|
// 状态现在总是 boolean,直接切换
|
||||||
};
|
expandedGroups.value[groupName] = !expandedGroups.value[groupName];
|
||||||
|
};
|
||||||
// 处理单击连接 (左键/Enter) - 使用 session store 处理连接请求
|
|
||||||
|
// 处理单击连接 (左键/Enter) - 使用 session store 处理连接请求
|
||||||
const handleConnect = (connectionId: number, event?: MouseEvent | KeyboardEvent) => {
|
const handleConnect = (connectionId: number, event?: MouseEvent | KeyboardEvent) => {
|
||||||
if (event instanceof MouseEvent && event.button !== 0) {
|
if (event instanceof MouseEvent && event.button !== 0) {
|
||||||
console.log(`[WkspConnList] DEBUG: handleConnect called with non-left click (button: ${event.button}). Ignoring.`);
|
console.log(`[WkspConnList] DEBUG: handleConnect called with non-left click (button: ${event.button}). Ignoring.`);
|
||||||
|
|||||||
Reference in New Issue
Block a user