ssh-manager/.opencode/plans/2026-03-30-sftp-tab-cache-fix-plan.md

SFTP标签页状态保持修复实施计划

For agentic workers: REQUIRED: Use superpowers:subagent-driven-development (if subagents available) or superpowers:executing-plans to implement this plan. Steps use checkbox (- [ ]) syntax for tracking.

Goal: 修复SFTP标签页离开后再返回会刷新页面、丢失浏览状态的问题

Architecture: 为SftpView组件添加keep-alive缓存，仅缓存SFTP相关页面，最大缓存10个实例避免内存占用过高，每个路由实例通过fullPath作为唯一key区分

Tech Stack: Vue 3、Vue Router 4、Pinia

---

Task 1: 为SftpView组件添加名称标识

Files:

• Modify: frontend/src/views/SftpView.vue

• Step 1: 添加组件名称 在script setup开头添加：

defineOptions({ name: 'SftpView' })

---

Task 2: 修改MainLayout添加keep-alive缓存

Files:

• Modify: frontend/src/layouts/MainLayout.vue:193-195

• Step 1: 替换原RouterView代码 原代码：

<RouterView v-slot="{ Component }">
  <component :is="Component" v-if="!showTerminalWorkspace" />
</RouterView>

替换为：

<RouterView v-slot="{ Component }">
  <keep-alive :include="['SftpView']" :max="10">
    <component :is="Component" v-if="!showTerminalWorkspace" :key="$route.fullPath" />
  </keep-alive>
</RouterView>

---

Task 3: 验证修复效果

Files:

• Test: 手动验证 + 构建验证

• Step 1: 运行类型检查 Run: cd frontend && npm run build Expected: 构建成功，无类型错误

• Step 2: 手动测试功能

1. 启动开发服务，登录系统
2. 打开任意连接的SFTP标签
3. 浏览到任意子目录
4. 切换到其他页面（如连接列表、终端）
5. 切回SFTP标签，确认仍停留在之前浏览的子目录，状态未丢失
6. 打开多个不同连接的SFTP标签，切换时确认各自状态独立保存

---