From a65e7b236ddf3b6da3c130855bf59e60ed4a3172 Mon Sep 17 00:00:00 2001
From: xiongxiao <kevisual@xiongxiao.me>
Date: Thu, 19 Mar 2026 05:02:24 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=E9=A1=B9=E7=9B=AE?=
 =?UTF-8?q?=E5=88=9D=E5=A7=8B=E5=8C=96=E9=80=89=E6=8B=A9=E5=8A=9F=E8=83=BD?=
 =?UTF-8?q?=EF=BC=8C=E6=94=AF=E6=8C=81=E5=A4=9A=E9=A1=B9=E7=9B=AE=E9=80=89?=
 =?UTF-8?q?=E6=8B=A9=E5=92=8CURL=E7=8A=B6=E6=80=81=E5=90=8C=E6=AD=A5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../code-graph/components/ProjectDialog.tsx   | 774 ++++++++++--------
 .../code-graph/components/ProjectPanel.tsx    |  42 +-
 src/pages/code-graph/page.tsx                 |  13 -
 src/pages/code-graph/store/index.ts           |  28 +-
 4 files changed, 512 insertions(+), 345 deletions(-)

diff --git a/src/pages/code-graph/components/ProjectDialog.tsx b/src/pages/code-graph/components/ProjectDialog.tsx
index 3bd0202..a7ff737 100644
--- a/src/pages/code-graph/components/ProjectDialog.tsx
+++ b/src/pages/code-graph/components/ProjectDialog.tsx
@@ -1,4 +1,4 @@
-import { useState } from 'react';
+import { useState, useEffect } from 'react';
 import { useShallow } from 'zustand/react/shallow';
 import { FolderOpenIcon, PlusIcon, Trash2Icon, RefreshCwIcon, PlayCircleIcon, StopCircleIcon, FolderIcon, AlertCircleIcon, CircleOffIcon, DownloadIcon, ListTodoIcon, CheckSquareIcon } from 'lucide-react';
 import { toast } from 'sonner';
@@ -7,8 +7,189 @@ import { Button } from '@/components/ui/button';
 import { Input } from '@/components/ui/input';
 import { Label } from '@/components/ui/label';
 import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip';
+import { Checkbox } from '@/components/ui/checkbox';
+import { Card, CardContent } from '@/components/ui/card';
 import { useCodeGraphStore } from '../store';
 
+// 初始化项目弹窗组件
+function ProjectInitDialog({
+  open,
+  onOpenChange,
+}: {
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+}) {
+  const { initProject, fetchProjectFiles } = useCodeGraphStore(
+    useShallow((s) => ({
+      initProject: s.initProject,
+      fetchProjectFiles: s.fetchProjectFiles,
+    })),
+  );
+
+  const [loading, setLoading] = useState(false);
+  const [files, setFiles] = useState<string[]>([]);
+  const [selectedPaths, setSelectedPaths] = useState<string[]>([]);
+  const [rootPath, setRootPath] = useState('/workspace/projects');
+
+  // 加载文件列表
+  const loadFiles = async () => {
+    const data = await fetchProjectFiles(rootPath);
+    setFiles(data);
+  };
+
+  // 打开时加载数据
+  useEffect(() => {
+    if (open) {
+      loadFiles();
+    }
+  }, [open]);
+
+  // 切换选中状态
+  const toggleSelection = (path: string) => {
+    setSelectedPaths((prev) =>
+      prev.includes(path) ? prev.filter((p) => p !== path) : [...prev, path]
+    );
+  };
+
+  // 全选
+  const selectAll = () => setSelectedPaths([...files]);
+
+  // 取消全选
+  const deselectAll = () => setSelectedPaths([]);
+
+  // 确认初始化
+  const handleConfirm = async () => {
+    setLoading(true);
+    await initProject(selectedPaths.length > 0 ? selectedPaths : undefined);
+    setLoading(false);
+    setSelectedPaths([]);
+    onOpenChange(false);
+  };
+
+  // 取消
+  const handleCancel = () => {
+    setSelectedPaths([]);
+    onOpenChange(false);
+  };
+
+  const allSelected = files.length > 0 && selectedPaths.length === files.length;
+  const isIndeterminate = selectedPaths.length > 0 && selectedPaths.length < files.length;
+
+  return (
+    <Dialog open={open} onOpenChange={(open) => !open && handleCancel()}>
+      <DialogContent className='sm:max-w-2xl max-h-[80vh] flex flex-col bg-gradient-to-br from-slate-900 via-slate-800 to-slate-900 text-slate-100 border border-white/10 shadow-2xl'>
+        <DialogHeader className='text-center'>
+          <div className='flex justify-center mb-3'>
+            <div className='w-12 h-12 rounded-full flex items-center justify-center bg-indigo-500/20'>
+              <DownloadIcon className='w-6 h-6 text-indigo-400' />
+            </div>
+          </div>
+          <DialogTitle className='text-lg font-semibold'>
+            初始化项目
+          </DialogTitle>
+          <DialogDescription className='text-slate-400'>
+            选择要初始化的项目，选中后点击确认开始初始化
+          </DialogDescription>
+        </DialogHeader>
+
+        {/* 路径输入 */}
+        <div className='px-6'>
+          <div className='flex items-center gap-2'>
+            <div className='relative flex-1'>
+              <FolderIcon className='absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-slate-500' />
+              <Input
+                value={rootPath}
+                onChange={(e) => setRootPath(e.target.value)}
+                placeholder='项目根目录'
+                className='bg-slate-800/80 border-white/10 text-slate-100 placeholder:text-slate-500 h-9 text-sm pl-10 pr-4 focus:border-indigo-500/50 focus:ring-2 focus:ring-indigo-500/20 transition-all'
+              />
+            </div>
+            <Button
+              size='sm'
+              onClick={loadFiles}
+              className='bg-slate-700 hover:bg-slate-600 shrink-0'>
+              加载
+            </Button>
+          </div>
+        </div>
+
+        {/* 项目列表 */}
+        <div className='flex-1 overflow-hidden px-6 py-2'>
+          <Card className='bg-slate-800/50 border-white/10 h-full'>
+            <CardContent className='p-3 h-[280px] overflow-y-auto scrollbar'>
+              {files.length === 0 ? (
+                <div className='flex flex-col items-center justify-center h-full text-slate-500 text-sm gap-2'>
+                  <FolderIcon className='w-8 h-8 text-slate-600' />
+                  <span>暂无项目，点击加载获取项目列表</span>
+                </div>
+              ) : (
+                <div className='space-y-1'>
+                  {files.map((path) => (
+                    <div
+                      key={path}
+                      onClick={() => toggleSelection(path)}
+                      className={`flex items-center gap-3 rounded-lg px-3 py-2 cursor-pointer transition-all ${selectedPaths.includes(path)
+                          ? 'bg-indigo-500/20 border border-indigo-500/50'
+                          : 'hover:bg-white/5 border border-transparent'
+                        }`}>
+                      <Checkbox
+                        checked={selectedPaths.includes(path)}
+                        onCheckedChange={() => toggleSelection(path)}
+                        className='border-slate-500 data-[checked]:bg-indigo-500 data-[checked]:border-indigo-500'
+                      />
+                      <FolderIcon className='w-4 h-4 text-slate-400 shrink-0' />
+                      <span className='text-sm text-slate-200 truncate'>{path}</span>
+                    </div>
+                  ))}
+                </div>
+              )}
+            </CardContent>
+          </Card>
+        </div>
+
+        {/* 操作按钮 */}
+        <div className='flex items-center justify-between px-6 pb-4'>
+          <div className='flex items-center gap-3'>
+            <Button
+              size='sm'
+              variant='outline'
+              onClick={isIndeterminate ? selectAll : allSelected ? deselectAll : selectAll}
+              disabled={files.length === 0}
+              className='bg-transparent border-white/20 text-slate-300 hover:bg-white/10 hover:border-white/30'>
+              {allSelected ? '取消全选' : '全选'}
+            </Button>
+            <span className='text-xs text-slate-400'>
+              已选择 {selectedPaths.length}/{files.length}
+            </span>
+          </div>
+          <div className='flex gap-2'>
+            <Button
+              variant='outline'
+              onClick={handleCancel}
+              disabled={loading}
+              className='bg-transparent border-white/20 text-slate-300 hover:bg-white/10 hover:border-white/30'>
+              取消
+            </Button>
+            <Button
+              onClick={handleConfirm}
+              disabled={loading}
+              className='bg-indigo-600 hover:bg-indigo-500 text-white shadow-lg shadow-indigo-500/25 disabled:opacity-50'>
+              {loading ? (
+                <span className='flex items-center gap-2'>
+                  <span className='w-3 h-3 border-2 border-white/30 border-t-white rounded-full animate-spin' />
+                  初始化中…
+                </span>
+              ) : (
+                '确认初始化'
+              )}
+            </Button>
+          </div>
+        </div>
+      </DialogContent>
+    </Dialog>
+  );
+}
+
 export function ProjectDialog() {
   const {
     projectDialogOpen,
@@ -19,7 +200,6 @@ export function ProjectDialog() {
     addProject,
     removeProject,
     toggleProjectStatus,
-    initProject,
   } = useCodeGraphStore(
     useShallow((s) => ({
       projectDialogOpen: s.projectDialogOpen,
@@ -30,7 +210,6 @@ export function ProjectDialog() {
       addProject: s.addProject,
       removeProject: s.removeProject,
       toggleProjectStatus: s.toggleProjectStatus,
-      initProject: s.initProject,
     })),
   );
 
@@ -53,9 +232,8 @@ export function ProjectDialog() {
   const [deleteConfirmOpen, setDeleteConfirmOpen] = useState(false);
   const [pendingDeleteProject, setPendingDeleteProject] = useState<{ path: string; name?: string } | null>(null);
 
-  // 初始化确认弹窗
+  // 初始化弹窗
   const [initConfirmOpen, setInitConfirmOpen] = useState(false);
-  const [initLoading, setInitLoading] = useState(false);
 
   // 多选模式
   const [multiSelectMode, setMultiSelectMode] = useState(false);
@@ -175,19 +353,6 @@ export function ProjectDialog() {
     setPendingDeleteProject(null);
   };
 
-  // 确认初始化
-  const handleConfirmInit = async () => {
-    setInitLoading(true);
-    await initProject();
-    setInitLoading(false);
-    setInitConfirmOpen(false);
-  };
-
-  // 取消初始化
-  const handleCancelInit = () => {
-    setInitConfirmOpen(false);
-  };
-
   return (
     <Dialog open={projectDialogOpen} onOpenChange={handleOpenChange}>
       <DialogContent className='w-[calc(100%-2rem)] sm:max-w-lg max-h-[85vh] flex flex-col bg-gradient-to-br from-slate-900 via-slate-800 to-slate-900 text-slate-100 border border-white/10 shadow-2xl overflow-hidden'>
@@ -211,293 +376,290 @@ export function ProjectDialog() {
 
         {/* 内容区域 - 可滚动 */}
         <div className='flex-1 overflow-y-auto space-y-4 pr-1 scrollbar-thin scrollbar-thumb-slate-700 scrollbar-track-transparent -mx-2 px-2'>
-        {/* 新增项目 */}
-        {showAddProject && (
-        <div className='relative space-y-3 rounded-xl bg-white/5 p-4 border border-white/10 shadow-lg backdrop-blur-sm'>
-          <div className='flex items-center gap-2 mb-1'>
-            <div className='w-1 h-3 rounded-full bg-gradient-to-b from-indigo-400 to-purple-500' />
-            <p className='text-sm font-medium text-slate-200'>添加新项目</p>
-          </div>
-          <div className='space-y-2'>
-            {/* 类型选择 */}
-            <div className='flex gap-2 mb-2'>
-              <button
-                type='button'
-                onClick={() => {
-                  setProjectType('filepath');
-                  if (!newPath.trim()) {
-                    setNewPath('/workspace/projects');
-                  }
-                }}
-                className={`flex-1 text-xs py-1.5 px-3 rounded-lg border transition-all ${
-                  projectType === 'filepath'
-                    ? 'bg-indigo-500/20 border-indigo-500/50 text-indigo-400'
-                    : 'bg-transparent border-white/10 text-slate-400 hover:border-white/20'
-                }`}>
-                文件路径
-              </button>
-              <button
-                type='button'
-                onClick={() => {
-                  setProjectType('cnb-repo');
-                  setNewPath('');
-                }}
-                className={`flex-1 text-xs py-1.5 px-3 rounded-lg border transition-all ${
-                  projectType === 'cnb-repo'
-                    ? 'bg-indigo-500/20 border-indigo-500/50 text-indigo-400'
-                    : 'bg-transparent border-white/10 text-slate-400 hover:border-white/20'
-                }`}>
-                CNB 仓库
-              </button>
-            </div>
-            <div className='space-y-1.5'>
-              <Label className='text-xs text-slate-400 flex items-center gap-1'>
-                <span>{projectType === 'filepath' ? '项目路径' : 'CNB 仓库'}</span>
-                <span className='text-red-400'>*</span>
-              </Label>
-              <div className='relative'>
-                <FolderIcon className='absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-slate-500' />
-                <Input
-                  value={newPath}
-                  onChange={(e) => setNewPath(e.target.value)}
-                  placeholder={projectType === 'filepath' ? '/workspace/projects' : 'kevisual/cnb'}
-                  className='bg-slate-800/80 border-white/10 text-slate-100 placeholder:text-slate-500 h-9 text-sm pl-10 pr-4 focus:border-indigo-500/50 focus:ring-2 focus:ring-indigo-500/20 transition-all'
-                />
+          {/* 新增项目 */}
+          {showAddProject && (
+            <div className='relative space-y-3 rounded-xl bg-white/5 p-4 border border-white/10 shadow-lg backdrop-blur-sm'>
+              <div className='flex items-center gap-2 mb-1'>
+                <div className='w-1 h-3 rounded-full bg-gradient-to-b from-indigo-400 to-purple-500' />
+                <p className='text-sm font-medium text-slate-200'>添加新项目</p>
               </div>
-            </div>
-            <div className='space-y-1.5'>
-              <Label className='text-xs text-slate-400'>项目名称（可选）</Label>
-              <Input
-                value={newName}
-                onChange={(e) => setNewName(e.target.value)}
-                placeholder='My Project'
-                className='bg-slate-800/80 border-white/10 text-slate-100 placeholder:text-slate-500 h-9 text-sm focus:border-indigo-500/50 focus:ring-2 focus:ring-indigo-500/20 transition-all'
-              />
-            </div>
-          </div>
-          <Button
-            size='sm'
-            onClick={handleAdd}
-            disabled={addLoading || !newPath.trim()}
-            className='w-full bg-gradient-to-r from-indigo-600 to-purple-600 hover:from-indigo-500 hover:to-purple-500 text-white text-sm h-9 mt-2 shadow-lg shadow-indigo-500/25 disabled:opacity-50 disabled:cursor-not-allowed transition-all hover:shadow-indigo-500/40'>
-            <PlusIcon className='w-4 h-4 mr-1.5' />
-            {addLoading ? (
-              <span className='flex items-center gap-2'>
-                <span className='w-3 h-3 border-2 border-white/30 border-t-white rounded-full animate-spin' />
-                添加中…
-              </span>
-            ) : (
-              '添加项目'
-            )}
-          </Button>
-        </div>
-        )}
-
-        {/* 项目列表 */}
-        <div className='relative'>
-          <div className='flex items-center justify-between mb-3'>
-            <div className='flex items-center gap-2'>
-              <div className='w-1 h-3 rounded-full bg-gradient-to-b from-green-400 to-emerald-500' />
-              <p className='text-sm font-medium text-slate-200'>已注册项目</p>
-              <span className='text-xs text-slate-500 bg-slate-800/80 px-1.5 py-0.5 rounded-full'>
-                {projects.length}
-              </span>
-            </div>
-            <div className='flex items-center gap-1'>
-              <button
-                onClick={() => setShowAddProject(!showAddProject)}
-                className={`text-slate-500 hover:text-indigo-400 transition-colors p-1.5 rounded-lg hover:bg-white/5 ${showAddProject ? 'text-indigo-400 bg-white/5' : ''}`}
-                title={showAddProject ? '隐藏添加' : '添加项目'}>
-                <PlusIcon className={`w-4 h-4 ${showAddProject ? 'rotate-90' : ''} transition-transform`} />
-              </button>
-              <button
-                onClick={loadProjects}
-                disabled={projectsLoading}
-                className='text-slate-500 hover:text-indigo-400 transition-colors p-1.5 rounded-lg hover:bg-white/5'
-                title='刷新'>
-                <RefreshCwIcon className={`w-4 h-4 ${projectsLoading ? 'animate-spin' : ''}`} />
-              </button>
-              <Tooltip>
-                <TooltipTrigger>
-                  <div
-                    onClick={() => setInitConfirmOpen(true)}
-                    className='text-slate-500 hover:text-indigo-400 transition-colors p-1.5 rounded-lg hover:bg-white/5 disabled:opacity-50'>
-                    <DownloadIcon className={`w-4 h-4 ${initLoading ? 'animate-spin' : ''}`} />
+              <div className='space-y-2'>
+                {/* 类型选择 */}
+                <div className='flex gap-2 mb-2'>
+                  <button
+                    type='button'
+                    onClick={() => {
+                      setProjectType('filepath');
+                      if (!newPath.trim()) {
+                        setNewPath('/workspace/projects');
+                      }
+                    }}
+                    className={`flex-1 text-xs py-1.5 px-3 rounded-lg border transition-all ${projectType === 'filepath'
+                        ? 'bg-indigo-500/20 border-indigo-500/50 text-indigo-400'
+                        : 'bg-transparent border-white/10 text-slate-400 hover:border-white/20'
+                      }`}>
+                    文件路径
+                  </button>
+                  <button
+                    type='button'
+                    onClick={() => {
+                      setProjectType('cnb-repo');
+                      setNewPath('');
+                    }}
+                    className={`flex-1 text-xs py-1.5 px-3 rounded-lg border transition-all ${projectType === 'cnb-repo'
+                        ? 'bg-indigo-500/20 border-indigo-500/50 text-indigo-400'
+                        : 'bg-transparent border-white/10 text-slate-400 hover:border-white/20'
+                      }`}>
+                    CNB 仓库
+                  </button>
+                </div>
+                <div className='space-y-1.5'>
+                  <Label className='text-xs text-slate-400 flex items-center gap-1'>
+                    <span>{projectType === 'filepath' ? '项目路径' : 'CNB 仓库'}</span>
+                    <span className='text-red-400'>*</span>
+                  </Label>
+                  <div className='relative'>
+                    <FolderIcon className='absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-slate-500' />
+                    <Input
+                      value={newPath}
+                      onChange={(e) => setNewPath(e.target.value)}
+                      placeholder={projectType === 'filepath' ? '/workspace/projects' : 'kevisual/cnb'}
+                      className='bg-slate-800/80 border-white/10 text-slate-100 placeholder:text-slate-500 h-9 text-sm pl-10 pr-4 focus:border-indigo-500/50 focus:ring-2 focus:ring-indigo-500/20 transition-all'
+                    />
                   </div>
-                </TooltipTrigger>
-                <TooltipContent>
-                  <p>初始化 workspace/projects 仓库</p>
-                </TooltipContent>
-              </Tooltip>
-              {multiSelectMode ? (
-                <>
-                  <div className='w-px h-5 bg-white/20 mx-1' />
-                  <Tooltip>
-                    <TooltipTrigger>
-                      <div
-                        onClick={selectAll}
-                        className='text-slate-500 hover:text-indigo-400 transition-colors p-1.5 rounded-lg hover:bg-white/5'
-                        title='全选'>
-                        <CheckSquareIcon className='w-4 h-4' />
-                      </div>
-                    </TooltipTrigger>
-                    <TooltipContent>
-                      <p>全选</p>
-                    </TooltipContent>
-                  </Tooltip>
-                  <Tooltip>
-                    <TooltipTrigger>
-                      <div
-                        onClick={deselectAll}
-                        className='text-slate-500 hover:text-indigo-400 transition-colors p-1.5 rounded-lg hover:bg-white/5'
-                        title='取消全选'>
-                        <ListTodoIcon className='w-4 h-4' />
-                      </div>
-                    </TooltipTrigger>
-                    <TooltipContent>
-                      <p>取消全选</p>
-                    </TooltipContent>
-                  </Tooltip>
-                  <Tooltip>
-                    <TooltipTrigger>
-                      <button
-                        onClick={handleStartAll}
-                        disabled={selectedProjects.length === 0}
-                        className='text-slate-500 hover:text-green-400 transition-colors p-1.5 rounded-lg hover:bg-white/5 disabled:opacity-50'
-                        title='全部启动'>
-                        <PlayCircleIcon className='w-4 h-4' />
-                      </button>
-                    </TooltipTrigger>
-                    <TooltipContent>
-                      <p>全部启动 ({selectedProjects.length})</p>
-                    </TooltipContent>
-                  </Tooltip>
-                  <Tooltip>
-                    <TooltipTrigger>
-                      <button
-                        onClick={handleStopAll}
-                        disabled={selectedProjects.length === 0}
-                        className='text-slate-500 hover:text-red-400 transition-colors p-1.5 rounded-lg hover:bg-white/5 disabled:opacity-50'
-                        title='全部关闭'>
-                        <StopCircleIcon className='w-4 h-4' />
-                      </button>
-                    </TooltipTrigger>
-                    <TooltipContent>
-                      <p>全部关闭 ({selectedProjects.length})</p>
-                    </TooltipContent>
-                  </Tooltip>
+                </div>
+                <div className='space-y-1.5'>
+                  <Label className='text-xs text-slate-400'>项目名称（可选）</Label>
+                  <Input
+                    value={newName}
+                    onChange={(e) => setNewName(e.target.value)}
+                    placeholder='My Project'
+                    className='bg-slate-800/80 border-white/10 text-slate-100 placeholder:text-slate-500 h-9 text-sm focus:border-indigo-500/50 focus:ring-2 focus:ring-indigo-500/20 transition-all'
+                  />
+                </div>
+              </div>
+              <Button
+                size='sm'
+                onClick={handleAdd}
+                disabled={addLoading || !newPath.trim()}
+                className='w-full bg-gradient-to-r from-indigo-600 to-purple-600 hover:from-indigo-500 hover:to-purple-500 text-white text-sm h-9 mt-2 shadow-lg shadow-indigo-500/25 disabled:opacity-50 disabled:cursor-not-allowed transition-all hover:shadow-indigo-500/40'>
+                <PlusIcon className='w-4 h-4 mr-1.5' />
+                {addLoading ? (
+                  <span className='flex items-center gap-2'>
+                    <span className='w-3 h-3 border-2 border-white/30 border-t-white rounded-full animate-spin' />
+                    添加中…
+                  </span>
+                ) : (
+                  '添加项目'
+                )}
+              </Button>
+            </div>
+          )}
+
+          {/* 项目列表 */}
+          <div className='relative'>
+            <div className='flex items-center justify-between mb-3'>
+              <div className='flex items-center gap-2'>
+                <div className='w-1 h-3 rounded-full bg-gradient-to-b from-green-400 to-emerald-500' />
+                <p className='text-sm font-medium text-slate-200'>已注册项目</p>
+                <span className='text-xs text-slate-500 bg-slate-800/80 px-1.5 py-0.5 rounded-full'>
+                  {projects.length}
+                </span>
+              </div>
+              <div className='flex items-center gap-1'>
+                <button
+                  onClick={() => setShowAddProject(!showAddProject)}
+                  className={`text-slate-500 hover:text-indigo-400 transition-colors p-1.5 rounded-lg hover:bg-white/5 ${showAddProject ? 'text-indigo-400 bg-white/5' : ''}`}
+                  title={showAddProject ? '隐藏添加' : '添加项目'}>
+                  <PlusIcon className={`w-4 h-4 ${showAddProject ? 'rotate-90' : ''} transition-transform`} />
+                </button>
+                <button
+                  onClick={loadProjects}
+                  disabled={projectsLoading}
+                  className='text-slate-500 hover:text-indigo-400 transition-colors p-1.5 rounded-lg hover:bg-white/5'
+                  title='刷新'>
+                  <RefreshCwIcon className={`w-4 h-4 ${projectsLoading ? 'animate-spin' : ''}`} />
+                </button>
+                <Tooltip>
+                  <TooltipTrigger>
+                    <div
+                      onClick={() => setInitConfirmOpen(true)}
+                      className='text-slate-500 hover:text-indigo-400 transition-colors p-1.5 rounded-lg hover:bg-white/5 disabled:opacity-50'>
+                      <DownloadIcon className='w-4 h-4' />
+                    </div>
+                  </TooltipTrigger>
+                  <TooltipContent>
+                    <p>初始化 workspace/projects 仓库</p>
+                  </TooltipContent>
+                </Tooltip>
+                {multiSelectMode ? (
+                  <>
+                    <div className='w-px h-5 bg-white/20 mx-1' />
+                    <Tooltip>
+                      <TooltipTrigger>
+                        <div
+                          onClick={selectAll}
+                          className='text-slate-500 hover:text-indigo-400 transition-colors p-1.5 rounded-lg hover:bg-white/5'
+                          title='全选'>
+                          <CheckSquareIcon className='w-4 h-4' />
+                        </div>
+                      </TooltipTrigger>
+                      <TooltipContent>
+                        <p>全选</p>
+                      </TooltipContent>
+                    </Tooltip>
+                    <Tooltip>
+                      <TooltipTrigger>
+                        <div
+                          onClick={deselectAll}
+                          className='text-slate-500 hover:text-indigo-400 transition-colors p-1.5 rounded-lg hover:bg-white/5'
+                          title='取消全选'>
+                          <ListTodoIcon className='w-4 h-4' />
+                        </div>
+                      </TooltipTrigger>
+                      <TooltipContent>
+                        <p>取消全选</p>
+                      </TooltipContent>
+                    </Tooltip>
+                    <Tooltip>
+                      <TooltipTrigger>
+                        <button
+                          onClick={handleStartAll}
+                          disabled={selectedProjects.length === 0}
+                          className='text-slate-500 hover:text-green-400 transition-colors p-1.5 rounded-lg hover:bg-white/5 disabled:opacity-50'
+                          title='全部启动'>
+                          <PlayCircleIcon className='w-4 h-4' />
+                        </button>
+                      </TooltipTrigger>
+                      <TooltipContent>
+                        <p>全部启动 ({selectedProjects.length})</p>
+                      </TooltipContent>
+                    </Tooltip>
+                    <Tooltip>
+                      <TooltipTrigger>
+                        <button
+                          onClick={handleStopAll}
+                          disabled={selectedProjects.length === 0}
+                          className='text-slate-500 hover:text-red-400 transition-colors p-1.5 rounded-lg hover:bg-white/5 disabled:opacity-50'
+                          title='全部关闭'>
+                          <StopCircleIcon className='w-4 h-4' />
+                        </button>
+                      </TooltipTrigger>
+                      <TooltipContent>
+                        <p>全部关闭 ({selectedProjects.length})</p>
+                      </TooltipContent>
+                    </Tooltip>
+                    <Tooltip>
+                      <TooltipTrigger>
+                        <div
+                          onClick={toggleMultiSelectMode}
+                          className='text-slate-500 hover:text-indigo-400 transition-colors p-1.5 rounded-lg hover:bg-white/5'
+                          title='退出多选'>
+                          <CheckSquareIcon className='w-4 h-4' />
+                        </div>
+                      </TooltipTrigger>
+                      <TooltipContent>
+                        <p>退出多选</p>
+                      </TooltipContent>
+                    </Tooltip>
+                  </>
+                ) : (
                   <Tooltip>
                     <TooltipTrigger>
                       <div
                         onClick={toggleMultiSelectMode}
                         className='text-slate-500 hover:text-indigo-400 transition-colors p-1.5 rounded-lg hover:bg-white/5'
-                        title='退出多选'>
+                        title='多选'>
                         <CheckSquareIcon className='w-4 h-4' />
                       </div>
                     </TooltipTrigger>
                     <TooltipContent>
-                      <p>退出多选</p>
+                      <p>多选</p>
                     </TooltipContent>
                   </Tooltip>
-                </>
-              ) : (
-                <Tooltip>
-                  <TooltipTrigger>
-                    <div
-                      onClick={toggleMultiSelectMode}
-                      className='text-slate-500 hover:text-indigo-400 transition-colors p-1.5 rounded-lg hover:bg-white/5'
-                      title='多选'>
-                      <CheckSquareIcon className='w-4 h-4' />
+                )}
+              </div>
+            </div>
+
+            {projectsLoading ? (
+              <div className='flex items-center justify-center h-24 text-slate-500 text-sm bg-white/5 rounded-xl border border-white/5'>
+                <span className='flex items-center gap-2'>
+                  <span className='w-4 h-4 border-2 border-indigo-500/30 border-t-indigo-500 rounded-full animate-spin' />
+                  加载中…
+                </span>
+              </div>
+            ) : projects.length === 0 ? (
+              <div className='flex flex-col items-center justify-center h-24 text-slate-500 text-sm bg-white/5 rounded-xl border border-white/5 gap-2'>
+                <FolderIcon className='w-8 h-8 text-slate-600' />
+                <span>暂无项目</span>
+              </div>
+            ) : (
+              <ul className='space-y-2 max-h-72 overflow-y-auto pr-1 scrollbar-thin scrollbar-thumb-slate-700 scrollbar-track-transparent scrollbar'>
+                {projects.map((p) => (
+                  <li
+                    key={p.path}
+                    className={`group flex items-center gap-3 rounded-xl bg-white/5 px-4 py-3 border border-white/5 hover:bg-white/10 hover:border-white/10 transition-all duration-200 ${multiSelectMode && selectedProjects.includes(p.path) ? 'border-indigo-500/50 bg-indigo-500/10' : ''}`}>
+                    {/* 多选框 */}
+                    {multiSelectMode && (
+                      <button
+                        onClick={() => toggleProjectSelection(p.path)}
+                        className={`shrink-0 w-5 h-5 rounded border-2 flex items-center justify-center transition-colors ${selectedProjects.includes(p.path)
+                            ? 'bg-indigo-500 border-indigo-500 text-white'
+                            : 'border-slate-500 hover:border-indigo-400'
+                          }`}>
+                        {selectedProjects.includes(p.path) && <CheckSquareIcon className='w-3 h-3' />}
+                      </button>
+                    )}
+                    {/* 项目图标 */}
+                    <div className={`shrink-0 p-2 rounded-lg ${p.status === 'active' ? 'bg-green-500/20' : p.status === 'unlive' ? 'bg-orange-500/20' : 'bg-slate-700/50'}`}>
+                      <FolderIcon className={`w-4 h-4 ${p.status === 'active' ? 'text-green-400' : p.status === 'unlive' ? 'text-orange-400' : 'text-slate-400'}`} />
                     </div>
-                  </TooltipTrigger>
-                  <TooltipContent>
-                    <p>多选</p>
-                  </TooltipContent>
-                </Tooltip>
-              )}
-            </div>
-          </div>
 
-          {projectsLoading ? (
-            <div className='flex items-center justify-center h-24 text-slate-500 text-sm bg-white/5 rounded-xl border border-white/5'>
-              <span className='flex items-center gap-2'>
-                <span className='w-4 h-4 border-2 border-indigo-500/30 border-t-indigo-500 rounded-full animate-spin' />
-                加载中…
-              </span>
-            </div>
-          ) : projects.length === 0 ? (
-            <div className='flex flex-col items-center justify-center h-24 text-slate-500 text-sm bg-white/5 rounded-xl border border-white/5 gap-2'>
-              <FolderIcon className='w-8 h-8 text-slate-600' />
-              <span>暂无项目</span>
-            </div>
-          ) : (
-            <ul className='space-y-2 max-h-72 overflow-y-auto pr-1 scrollbar-thin scrollbar-thumb-slate-700 scrollbar-track-transparent scrollbar'>
-              {projects.map((p) => (
-                <li
-                  key={p.path}
-                  className={`group flex items-center gap-3 rounded-xl bg-white/5 px-4 py-3 border border-white/5 hover:bg-white/10 hover:border-white/10 transition-all duration-200 ${multiSelectMode && selectedProjects.includes(p.path) ? 'border-indigo-500/50 bg-indigo-500/10' : ''}`}>
-                  {/* 多选框 */}
-                  {multiSelectMode && (
-                    <button
-                      onClick={() => toggleProjectSelection(p.path)}
-                      className={`shrink-0 w-5 h-5 rounded border-2 flex items-center justify-center transition-colors ${
-                        selectedProjects.includes(p.path)
-                          ? 'bg-indigo-500 border-indigo-500 text-white'
-                          : 'border-slate-500 hover:border-indigo-400'
-                      }`}>
-                      {selectedProjects.includes(p.path) && <CheckSquareIcon className='w-3 h-3' />}
-                    </button>
-                  )}
-                  {/* 项目图标 */}
-                  <div className={`shrink-0 p-2 rounded-lg ${p.status === 'active' ? 'bg-green-500/20' : p.status === 'unlive' ? 'bg-orange-500/20' : 'bg-slate-700/50'}`}>
-                    <FolderIcon className={`w-4 h-4 ${p.status === 'active' ? 'text-green-400' : p.status === 'unlive' ? 'text-orange-400' : 'text-slate-400'}`} />
-                  </div>
+                    <div className='flex-1 min-w-0'>
+                      <p className='text-sm font-medium text-slate-200 truncate'>{p.name ?? p.path.split('/').pop()}</p>
+                      <p className='text-xs text-slate-500 truncate'>{p.path}</p>
+                    </div>
 
-                  <div className='flex-1 min-w-0'>
-                    <p className='text-sm font-medium text-slate-200 truncate'>{p.name ?? p.path.split('/').pop()}</p>
-                    <p className='text-xs text-slate-500 truncate'>{p.path}</p>
-                  </div>
-
-                  {/* 状态切换按钮 */}
-                  {p.status !== undefined && (
-                    <button
-                      onClick={() => openStatusConfirm(p)}
-                      className={`shrink-0 flex items-center gap-1.5 text-xs px-3 py-1.5 rounded-full transition-all duration-200 ${p.status === 'active'
+                    {/* 状态切换按钮 */}
+                    {p.status !== undefined && (
+                      <button
+                        onClick={() => openStatusConfirm(p)}
+                        className={`shrink-0 flex items-center gap-1.5 text-xs px-3 py-1.5 rounded-full transition-all duration-200 ${p.status === 'active'
                           ? 'bg-green-500/20 text-green-400 hover:bg-green-500/30 hover:scale-105'
                           : p.status === 'unlive'
                             ? 'bg-orange-500/20 text-orange-400 hover:bg-orange-500/30 hover:scale-105'
                             : 'bg-slate-700/50 text-slate-400 hover:bg-slate-600/50 hover:scale-105'
-                        }`}>
-                      {p.status === 'active' ? (
-                        <>
-                          <StopCircleIcon className='w-3 h-3' />
-                          <span>监听中</span>
-                        </>
-                      ) : p.status === 'unlive' ? (
-                        <>
-                          <CircleOffIcon className='w-3 h-3' />
-                          <span>未启动</span>
-                        </>
-                      ) : (
-                        <>
-                          <PlayCircleIcon className='w-3 h-3' />
-                          <span>已停止</span>
-                        </>
-                      )}
-                    </button>
-                  )}
+                          }`}>
+                        {p.status === 'active' ? (
+                          <>
+                            <StopCircleIcon className='w-3 h-3' />
+                            <span>监听中</span>
+                          </>
+                        ) : p.status === 'unlive' ? (
+                          <>
+                            <CircleOffIcon className='w-3 h-3' />
+                            <span>未启动</span>
+                          </>
+                        ) : (
+                          <>
+                            <PlayCircleIcon className='w-3 h-3' />
+                            <span>已停止</span>
+                          </>
+                        )}
+                      </button>
+                    )}
 
-                  {/* 删除按钮 */}
-                  <button
-                    onClick={() => openDeleteConfirm(p)}
-                    className='shrink-0 text-slate-600 hover:text-red-400 transition-all duration-200 p-1.5 rounded-lg hover:bg-red-500/10 opacity-0 group-hover:opacity-100'>
-                    <Trash2Icon className='w-4 h-4' />
-                  </button>
-                </li>
-              ))}
-            </ul>
-          )}
-        </div>
+                    {/* 删除按钮 */}
+                    <button
+                      onClick={() => openDeleteConfirm(p)}
+                      className='shrink-0 text-slate-600 hover:text-red-400 transition-all duration-200 p-1.5 rounded-lg hover:bg-red-500/10 opacity-0 group-hover:opacity-100'>
+                      <Trash2Icon className='w-4 h-4' />
+                    </button>
+                  </li>
+                ))}
+              </ul>
+            )}
+          </div>
         </div>
       </DialogContent>
 
@@ -531,8 +693,8 @@ export function ProjectDialog() {
             <Button
               onClick={handleConfirmStatusChange}
               className={`flex-1 ${pendingStatusProject?.status === 'active'
-                  ? 'bg-red-600 hover:bg-red-500 shadow-lg shadow-red-500/25'
-                  : 'bg-green-600 hover:bg-green-500 shadow-lg shadow-green-500/25'
+                ? 'bg-red-600 hover:bg-red-500 shadow-lg shadow-red-500/25'
+                : 'bg-green-600 hover:bg-green-500 shadow-lg shadow-green-500/25'
                 }`}>
               {pendingStatusProject?.status === 'active' ? '停止监听' : '开始监听'}
             </Button>
@@ -570,44 +732,8 @@ export function ProjectDialog() {
         </DialogContent>
       </Dialog>
 
-      {/* 初始化确认弹窗 */}
-      <Dialog open={initConfirmOpen} onOpenChange={(open) => !open && handleCancelInit()}>
-        <DialogContent className='sm:max-w-md bg-gradient-to-br from-slate-900 via-slate-800 to-slate-900 text-slate-100 border border-white/10 shadow-2xl'>
-          <DialogHeader>
-            <div className='w-12 h-12 rounded-full flex items-center justify-center mx-auto mb-3 bg-indigo-500/20'>
-              <DownloadIcon className='w-6 h-6 text-indigo-400' />
-            </div>
-            <DialogTitle className='text-center text-lg font-semibold'>
-              初始化项目
-            </DialogTitle>
-            <DialogDescription className='text-center text-slate-400'>
-              确定要初始化 workspace/projects 仓库吗？初始化过程可能需要一些时间。
-            </DialogDescription>
-          </DialogHeader>
-          <DialogFooter className='gap-2 sm:justify-center'>
-            <Button
-              variant='outline'
-              onClick={handleCancelInit}
-              disabled={initLoading}
-              className='bg-transparent border-white/20 text-slate-300 hover:bg-white/10 hover:border-white/30 flex-1'>
-              取消
-            </Button>
-            <Button
-              onClick={handleConfirmInit}
-              disabled={initLoading}
-              className='bg-indigo-600 hover:bg-indigo-500 text-white flex-1 shadow-lg shadow-indigo-500/25 disabled:opacity-50'>
-              {initLoading ? (
-                <span className='flex items-center gap-2'>
-                  <span className='w-3 h-3 border-2 border-white/30 border-t-white rounded-full animate-spin' />
-                  初始化中…
-                </span>
-              ) : (
-                '确认初始化'
-              )}
-            </Button>
-          </DialogFooter>
-        </DialogContent>
-      </Dialog>
+      {/* 初始化弹窗 */}
+      <ProjectInitDialog open={initConfirmOpen} onOpenChange={setInitConfirmOpen} />
     </Dialog>
   );
 }
diff --git a/src/pages/code-graph/components/ProjectPanel.tsx b/src/pages/code-graph/components/ProjectPanel.tsx
index 230eb0e..beb459b 100644
--- a/src/pages/code-graph/components/ProjectPanel.tsx
+++ b/src/pages/code-graph/components/ProjectPanel.tsx
@@ -8,17 +8,16 @@ import { useBotHelperStore } from '../store/bot-helper';
 
 interface ProjectPanelProps {
   onProjectClick?: (projectPath: string, files: FileProjectData[]) => void;
-  onOpenCodePod?: (projectPath: string) => void;
   onStopProject?: (projectPath: string) => void;
 }
 
 export function ProjectPanel({
   onProjectClick,
-  onOpenCodePod,
   onStopProject,
 }: ProjectPanelProps) {
   const [isDragging, setIsDragging] = useState(false);
   const [position, setPosition] = useState({ x: 20, y: 100 });
+  const [selectedProject, setSelectedProject] = useState<string | null>(null);
   const dragOffset = useRef({ x: 0, y: 0 });
   const panelRef = useRef<HTMLDivElement>(null);
 
@@ -83,16 +82,47 @@ export function ProjectPanel({
 
   const handleProjectClick = useCallback(
     (projectPath: string) => {
+      // 如果点击的是已选中的项目，则取消选中
+      if (selectedProject === projectPath) {
+        setSelectedProject(null);
+        window.location.hash = '';
+        useCodeGraphStore.getState().fetchProjects();
+        return;
+      }
+
+      // 从 projects 列表中查找对应项目的 repo
       const project = projects.find((p) => p.path === projectPath);
+      const repo = project?.repo;
+
+      if (repo) {
+        // 设置 hash 并刷新
+        window.location.hash = `repo=${repo}`;
+        useCodeGraphStore.getState().fetchProjects();
+      }
+
+      setSelectedProject(projectPath);
+
       if (project && onProjectClick) {
         onProjectClick(projectPath, files);
       }
     },
-    [projects, files, onProjectClick],
+    [projects, files, onProjectClick, selectedProject],
   );
 
   const [isLargeScreen, setIsLargeScreen] = useState(false);
 
+  // 初始化选中状态
+  useEffect(() => {
+    const hashParams = new URLSearchParams(window.location.hash.slice(1));
+    const repo = hashParams.get('repo');
+    if (repo && projects.length > 0) {
+      const projectItem = projects.find((p) => p.repo === repo);
+      if (projectItem) {
+        setSelectedProject(projectItem.path);
+      }
+    }
+  }, [projects]);
+
   useEffect(() => {
     const checkScreen = () => {
       setIsLargeScreen(window.innerWidth >= 1024);
@@ -143,7 +173,11 @@ export function ProjectPanel({
             return (
               <div
                 key={project.path}
-                className='flex items-center gap-2 px-3 py-2 text-left text-sm text-slate-300 hover:bg-white/5 hover:text-white transition-colors border-l-2 border-transparent hover:border-indigo-500 group'
+                className={`flex items-center gap-2 px-3 py-2 text-left text-sm transition-colors border-l-2 group ${
+                  selectedProject === project.path
+                    ? 'bg-indigo-500/20 text-white border-indigo-500'
+                    : 'text-slate-300 hover:bg-white/5 hover:text-white border-transparent hover:border-indigo-500'
+                }`}
               >
                 <button
                   onClick={() => handleProjectClick(project.path)}
diff --git a/src/pages/code-graph/page.tsx b/src/pages/code-graph/page.tsx
index b5b68db..2268ec1 100644
--- a/src/pages/code-graph/page.tsx
+++ b/src/pages/code-graph/page.tsx
@@ -97,19 +97,6 @@ export default function CodeGraphPage() {
             <Code3DGraph files={files} className='h-full' onProjectFocus={projectFocus ?? undefined} />
             <ProjectPanel
               onProjectClick={handleProjectClick}
-              onOpenCodePod={(projectPath) => {
-                setCodePodAttrs({
-                  label: projectPath.split('/').pop() || projectPath,
-                  size: 0,
-                  color: '',
-                  x: 0,
-                  y: 0,
-                  fullPath: projectPath,
-                  projectPath,
-                  kind: 'dir',
-                });
-                setCodePodOpen(true);
-              }}
               onStopProject={(projectPath) => toggleProjectStatus(projectPath)}
             />
           </>
diff --git a/src/pages/code-graph/store/index.ts b/src/pages/code-graph/store/index.ts
index 78078b2..9391796 100644
--- a/src/pages/code-graph/store/index.ts
+++ b/src/pages/code-graph/store/index.ts
@@ -53,7 +53,9 @@ type State = {
   addProject: (filepath: string, name?: string, type?: 'filepath' | 'cnb-repo') => Promise<boolean>;
   removeProject: (path: string) => Promise<void>;
   toggleProjectStatus: (path: string) => Promise<void>;
-  initProject: () => Promise<void>;
+  initProject: (projectPaths?: string[]) => Promise<void>;
+  // 获取项目文件列表
+  fetchProjectFiles: (rootPath?: string) => Promise<string[]>;
   // NodeInfo 弹窗
   nodeInfoOpen: boolean;
   setNodeInfoOpen: (open: boolean) => void;
@@ -69,6 +71,8 @@ type State = {
     q?: string; // 可选的搜索关键词
     projectPath?: string; // 项目路径，必填
     getContent?: boolean; // 是否获取文件内容，默认为 false
+    repo?: string; // 仓库地址
+    projects?: string[]
   }) => Promise<Result<{ list: FileProjectData[] }>>;
   createQuestion: (opts: { question: string, projectPath?: string, filePath?: string, engine?: 'openclaw' | 'opencode', sessionId?: string }) => any;
   saveFile: (filepath: string, content: string) => Promise<void>;
@@ -143,11 +147,11 @@ export const useCodeGraphStore = create<State>()((set, get) => ({
       return false;
     }
   },
-  initProject: async () => {
+  initProject: async (projectPaths) => {
     const loadingToast = toast.loading('初始化项目中...');
     try {
       const url = get().url || API_URL;
-      const res = await projectApi.project.init(undefined, { url });
+      const res = await projectApi.project.init({ projectPaths }, { url });
       toast.dismiss(loadingToast);
       if (res.code === 200) {
         toast.success('项目初始化成功');
@@ -160,6 +164,15 @@ export const useCodeGraphStore = create<State>()((set, get) => ({
       toast.error('项目初始化失败');
     }
   },
+  fetchProjectFiles: async (rootPath) => {
+    const url = get().url || API_URL;
+    const res = await projectApi['project']['project-files']({ rootPath }, { url });
+    if (res.code === 200) {
+      const data = res.data as { projectFiles?: string[]; list?: string[] };
+      return data?.projectFiles ?? data?.list ?? [];
+    }
+    return [];
+  },
   removeProject: async (path) => {
     const loadingToast = toast.loading('移除项目中...');
     try {
@@ -241,7 +254,12 @@ export const useCodeGraphStore = create<State>()((set, get) => ({
   },
   fetchProjects: async () => {
     get().loadProjects();
-    const res = await get().getFiles();
+    // 从hash中获取repo参数 (#repo=kevisual/cnb 格式)
+    const hashParams = new URLSearchParams(window.location.hash.slice(1));
+    const repo = hashParams.get('repo');
+    const res = await get().getFiles({
+      repo: repo || undefined,
+    });
     if (res.code === 200) {
       set({ files: res.data!.list });
     } else {
@@ -253,6 +271,8 @@ export const useCodeGraphStore = create<State>()((set, get) => ({
     q?: string; // 可选的搜索关键词
     projectPath?: string; // 项目路径，必填
     getContent?: boolean; // 是否获取文件内容，默认为 false
+    projects?: string[];
+    repo?: string; // 仓库地址
   }) => {
     const url = get().url
     const res = await projectApi["project-search"].files({