diff --git a/doc/plans/2026-02-27-项目管理首页优化-design.md b/doc/plans/2026-02-27-项目管理首页优化-design.md
new file mode 100644
index 0000000..af5faaa
--- /dev/null
+++ b/doc/plans/2026-02-27-项目管理首页优化-design.md
@@ -0,0 +1,358 @@
+# 项目管理首页优化设计文档
+
+**日期**: 2026-02-27
+**状态**: 已批准
+**方案**: 混合方案（方案3）
+
+## 概述
+
+本文档描述项目管理首页的用户界面优化设计，包括搜索栏、表格样式和操作按钮的改进。目标是提升用户体验，使界面更符合现代设计标准，并增强功能性。
+
+## 需求总结
+
+1. **搜索栏优化**：添加独立的重置按钮，调整布局
+2. **状态列优化**：增加宽度至 160px，添加图标
+3. **操作按钮条件显示**：根据项目状态显示不同操作
+4. **表格视觉优化**：按照参考截图实现现代化样式
+
+## 设计方案
+
+### 1. 搜索栏设计
+
+**布局结构**：
+
+```
+┌────────────────────────────────────────────────────────────────┐
+│  [🔍 项目名称]  [状态选择]  [搜索] [重置]         [新建项目] [导入历史] │
+└────────────────────────────────────────────────────────────────┘
+```
+
+**具体实现**：
+
+| 元素 | 说明 |
+|------|------|
+| 项目名称输入框 | 宽度约占25%，带搜索图标前缀，支持回车搜索 |
+| 状态下拉框 | 宽度约占15%，选项：全部/进行中/已完成/已归档 |
+| 搜索按钮 | 蓝色主按钮（#1890ff），从输入框内移出独立显示 |
+| 重置按钮 | 默认按钮样式（白底灰边），点击清空所有搜索条件并刷新 |
+| 新建项目 | 蓝色主按钮，右对齐 |
+| 导入历史项目 | 默认按钮，右对齐 |
+
+### 2. 表格设计
+
+#### 2.1 状态列设计（宽度 160px）
+
+**视觉效果**：圆点图标 + 文字标签
+
+| 状态 | 图标颜色 | 标签颜色 | 文字 |
+|------|----------|----------|------|
+| 进行中 | 蓝色圆点 | type="primary" (#1890ff) | 进行中 |
+| 已完成 | 绿色圆点 | type="success" (#52c41a) | 已完成 |
+| 已归档 | 灰色圆点 | type="info" (#909399) | 已归档 |
+
+#### 2.2 操作列设计（宽度 200px）
+
+**条件渲染逻辑**：
+
+| 项目状态 | 显示的按钮 |
+|----------|------------|
+| 进行中（'0'） | 进入项目 |
+| 已完成（'1'） | 查看结果、重新分析、归档 |
+| 已归档（'2'） | 查看结果 |
+
+**按钮样式**：
+- 类型：文字按钮（type="text"）
+- 颜色：蓝色（#1890ff）
+- 悬停：深蓝色（#096dd9）+ 下划线
+- 间距：8px
+
+#### 2.3 表格整体样式
+
+**表头**：
+- 背景色：#f5f5f5
+- 文字：深灰色粗体（#333）
+- 字号：14px
+- 高度：48px
+
+**数据行**：
+- 高度：50-60px（根据内容自动调整）
+- 背景色：#fff
+- 文字颜色：#333
+- 内边距：12px
+- 悬停背景：#f5f5f5
+- 过渡时间：0.3s
+
+**边框**：
+- 表格外边框：1px solid #eee
+- 行分隔线：1px solid #f0f0f0
+- 列分隔线：无或极浅（#fafafa）
+
+**列宽分布**：
+- 项目名称：300px（左对齐）
+- 项目状态：160px（居中）
+- 目标人数：100px（居中）
+- 预警人数：120px（居中，保留悬停详情）
+- 创建人：120px（居中）
+- 创建时间：160px（居中）
+- 操作：200px（居中）
+
+### 3. 样式规范
+
+#### 3.1 配色方案
+
+| 用途 | 颜色 | 色值 |
+|------|------|------|
+| 主色调 | 蓝色 | #1890ff |
+| 成功色 | 绿色 | #52c41a |
+| 警告色 | 红色 | #f5222d |
+| 主要文字 | 深灰色 | #333333 |
+| 次要文字 | 中灰色 | #909399 |
+| 背景色 | 浅灰色 | #f5f5f5 |
+| 卡片背景 | 白色 | #ffffff |
+
+#### 3.2 间距规范
+
+- 页面边距：16px
+- 卡片内边距：12px - 20px
+- 元素间距：12px
+- 按钮间距：8px
+- 表格单元格内边距：12px
+
+#### 3.3 字体规范
+
+- 标题：18px，font-weight: 500
+- 副标题：13px，font-weight: 400
+- 表头：14px，font-weight: 600
+- 正文：14px，font-weight: 400
+- 小文字：12px
+
+#### 3.4 圆角与阴影
+
+- 卡片圆角：4px
+- 按钮圆角：4px
+- 标签圆角：4px
+- 阴影：`0 1px 4px rgba(0, 0, 0, 0.08)`
+
+#### 3.5 交互效果
+
+**按钮悬停**：
+- 蓝色按钮：背景色 → #096dd9
+- 文字链接：添加下划线，颜色 → #096dd9
+
+**表格行悬停**：
+- 背景色 → #f5f5f5
+- 过渡时间：0.3s
+
+## 技术实现方案
+
+### 需要修改的文件
+
+1. **SearchBar.vue**
+   - 路径：`ruoyi-ui/src/views/ccdiProject/components/SearchBar.vue`
+   - 修改内容：
+     - 添加重置按钮
+     - 调整布局结构（将搜索按钮移出输入框）
+     - 优化样式和间距
+
+2. **ProjectTable.vue**
+   - 路径：`ruoyi-ui/src/views/ccdiProject/components/ProjectTable.vue`
+   - 修改内容：
+     - 状态列宽度调整为 160px
+     - 状态列添加图标渲染
+     - 操作列实现条件渲染逻辑
+     - 优化表格样式（表头、行高、悬停效果）
+
+3. **index.vue**
+   - 路径：`ruoyi-ui/src/views/ccdiProject/index.vue`
+   - 修改内容：
+     - 添加重置功能的处理方法（如果需要）
+     - 确认所有操作按钮的事件处理已实现
+
+### 关键代码逻辑
+
+#### 1. 搜索栏重置功能
+
+```javascript
+// SearchBar.vue
+handleReset() {
+  this.searchKeyword = ''
+  this.selectedStatus = ''
+  this.$emit('query', {
+    projectName: null,
+    status: null
+  })
+}
+```
+
+#### 2. 操作按钮条件渲染
+
+```vue
+<!-- ProjectTable.vue -->
+<template slot-scope="scope">
+  <!-- 进行中状态 -->
+  <el-button
+    v-if="scope.row.status === '0'"
+    size="mini"
+    type="text"
+    icon="el-icon-right"
+    @click="handleEnter(scope.row)"
+  >进入项目</el-button>
+
+  <!-- 已完成状态 -->
+  <template v-if="scope.row.status === '1'">
+    <el-button
+      size="mini"
+      type="text"
+      icon="el-icon-view"
+      @click="handleViewResult(scope.row)"
+    >查看结果</el-button>
+    <el-button
+      size="mini"
+      type="text"
+      icon="el-icon-refresh"
+      @click="handleReAnalyze(scope.row)"
+    >重新分析</el-button>
+    <el-button
+      size="mini"
+      type="text"
+      icon="el-icon-folder"
+      @click="handleArchive(scope.row)"
+    >归档</el-button>
+  </template>
+
+  <!-- 已归档状态 -->
+  <el-button
+    v-if="scope.row.status === '2'"
+    size="mini"
+    type="text"
+    icon="el-icon-view"
+    @click="handleViewResult(scope.row)"
+  >查看结果</el-button>
+</template>
+```
+
+#### 3. 状态列图标渲染
+
+```vue
+<!-- ProjectTable.vue -->
+<el-table-column
+  prop="status"
+  label="项目状态"
+  width="160"
+  align="center"
+>
+  <template slot-scope="scope">
+    <el-tag :type="getStatusType(scope.row.status)">
+      <dict-tag :options="dict.type.ccdi_project_status" :value="scope.row.status"/>
+    </el-tag>
+  </template>
+</el-table-column>
+```
+
+#### 4. 表格样式优化
+
+```scss
+// ProjectTable.vue - scoped styles
+.project-table-container {
+  :deep(.el-table) {
+    // 表头样式
+    th {
+      background-color: #f5f5f5;
+      color: #333;
+      font-weight: 600;
+      font-size: 14px;
+      height: 48px;
+      padding: 12px;
+    }
+
+    // 数据行样式
+    td {
+      color: #333;
+      font-size: 14px;
+      height: 50px;
+      padding: 12px;
+    }
+
+    // 悬停效果
+    .el-table__row:hover > td {
+      background-color: #f5f5f5 !important;
+      transition: background-color 0.3s;
+    }
+  }
+}
+
+// 操作按钮样式
+:deep(.el-button--text) {
+  color: #1890ff;
+
+  &:hover {
+    color: #096dd9;
+    text-decoration: underline;
+  }
+}
+```
+
+### 实现步骤
+
+1. **修改 SearchBar 组件**
+   - 添加重置按钮的模板和事件处理
+   - 调整布局，将搜索按钮移出输入框
+   - 优化样式和间距
+
+2. **修改 ProjectTable 组件**
+   - 调整状态列宽度为 160px
+   - 实现操作按钮的条件渲染逻辑
+   - 优化表格样式（表头、行高、悬停效果）
+
+3. **更新 index.vue**
+   - 确认所有操作按钮的事件处理方法已实现
+   - 测试重置功能
+
+4. **统一调整样式**
+   - 确保所有组件的配色、间距、字体一致
+   - 测试视觉效果是否匹配参考截图
+
+## 测试要点
+
+### 功能测试
+
+- [ ] 搜索功能正常（项目名称、状态筛选）
+- [ ] 重置按钮清空所有条件并刷新列表
+- [ ] 操作按钮根据状态正确显示
+- [ ] 所有操作按钮的点击事件正常触发
+
+### 视觉测试
+
+- [ ] 表格行高、间距符合设计
+- [ ] 表头样式正确（背景色、字体、高度）
+- [ ] 悬停效果正常
+- [ ] 状态列图标和颜色正确
+- [ ] 操作按钮颜色、间距、悬停效果正确
+- [ ] 整体配色、圆角、阴影符合设计规范
+
+### 兼容性测试
+
+- [ ] Chrome 浏览器测试
+- [ ] Edge 浏览器测试
+- [ ] 不同屏幕分辨率测试（1366x768、1920x1080）
+
+## 风险评估
+
+| 风险 | 影响 | 缓解措施 |
+|------|------|----------|
+| 样式冲突 | 中 | 使用 scoped style，避免全局样式污染 |
+| 现有功能受影响 | 低 | 只修改样式和条件渲染，不改变数据逻辑 |
+| 浏览器兼容性 | 低 | 使用 Element UI 标准组件，兼容性好 |
+
+## 后续优化建议
+
+1. **性能优化**：如果项目列表数据量大，考虑添加虚拟滚动
+2. **用户体验**：添加加载动画和空状态提示
+3. **响应式设计**：适配移动端设备（如有需求）
+4. **无障碍访问**：添加 ARIA 标签，提升可访问性
+
+## 参考资源
+
+- 参考截图：`doc/创建项目功能/ScreenShot_2026-02-27_091429_733.png`
+- Element UI 文档：https://element.eleme.cn/
+- 项目 CLAUDE.md 文件