feat: 添加批量删除、最近活动、界面优化等功能

UI.md

@@ -0,0 +1,99 @@
+🎨 UI 设计风格分析
+kiro-unified-manager 的 UI 特点：
+
+现代简约风格 - 使用 Tailwind CSS，干净的卡片布局
+专业的管理后台风格 - 类似企业级 SaaS 产品
+优雅的动画效果 - 淡入淡出、滑动过渡
+响应式设计 - 适配不同屏幕尺寸
+直观的状态指示 - 颜色编码的状态标签
+丰富的交互反馈 - 悬停效果、加载状态
+📝 UI 提示词模板
+基础风格提示词
+请设计一个现代化的管理后台界面，具有以下特点：
+
+**整体风格：**
+- 使用简约现代的设计语言，类似 Tailwind CSS 风格
+- 采用卡片式布局，白色背景配合浅灰色边框
+- 整体配色以蓝色系为主色调（#3b82f6），搭配灰色系辅助色
+- 界面干净整洁，留白充足，视觉层次清晰
+
+**布局结构：**
+- 顶部导航栏：白色背景，包含 Logo、导航标签和用户信息
+- 主内容区域：浅灰色背景（#f9fafb），居中布局，最大宽度限制
+- 卡片容器：白色背景，圆角边框，轻微阴影效果
+
+**交互元素：**
+- 按钮：圆角设计，主要按钮使用蓝色，次要按钮使用灰色
+- 表格：斑马纹效果，悬停高亮
+- 表单：简洁的输入框，聚焦时蓝色边框
+- 状态标签：彩色圆角标签，不同状态使用不同颜色
+
+**动画效果：**
+- 页面切换使用淡入淡出效果
+- 按钮悬停有颜色过渡
+- 模态框弹出有缩放动画
+- 通知消息从右上角滑入
+
+**响应式设计：**
+- 移动端友好，自适应布局
+- 表格在小屏幕上可横向滚动
+- 导航在移动端可折叠
+具体组件提示词
+**导航栏设计：**
+创建一个顶部导航栏，白色背景，高度64px，包含：
+- 左侧：品牌 Logo + 图标，使用蓝色主题
+- 中间：水平导航标签，激活状态有蓝色下边框
+- 右侧：用户头像 + 下拉菜单
+
+**数据表格设计：**
+设计一个现代化数据表格：
+- 表头使用浅灰色背景
+- 行间隔使用斑马纹效果
+- 悬停行高亮显示
+- 状态列使用彩色圆角标签
+- 操作列包含彩色文字链接
+
+**模态框设计：**
+创建优雅的模态框：
+- 半透明黑色遮罩背景
+- 白色圆角内容区域
+- 顶部标题栏带关闭按钮
+- 底部操作按钮区域
+- 弹出时有缩放动画效果
+
+**通知消息设计：**
+设计右上角通知组件：
+- 固定定位在右上角
+- 彩色背景（成功绿色、错误红色、信息蓝色）
+- 白色文字，包含图标
+- 自动消失，滑入滑出动画
+
+**按钮系统：**
+- 主要按钮：蓝色背景，白色文字，悬停变深蓝
+- 次要按钮：灰色边框，灰色文字，悬停背景变浅灰
+- 危险按钮：红色背景，用于删除等操作
+- 禁用状态：50% 透明度，不可点击
+颜色系统提示词
+**配色方案：**
+- 主色调：蓝色系 (#3b82f6, #2563eb, #1d4ed8)
+- 成功色：绿色系 (#10b981, #059669)
+- 警告色：黄色系 (#f59e0b, #d97706)
+- 错误色：红色系 (#ef4444, #dc2626)
+- 中性色：灰色系 (#6b7280, #4b5563, #374151)
+- 背景色：浅灰色 (#f9fafb, #f3f4f6)
+- 文字色：深灰色 (#111827, #374151, #6b7280)
+动画效果提示词
+**动画系统：**
+- 页面过渡：300ms 淡入淡出效果
+- 按钮悬停：200ms 颜色过渡
+- 模态框：弹出时 0.3s 缩放动画，从 0.95 到 1.0
+- 通知消息：从右侧滑入，3秒后自动滑出
+- 加载状态：旋转动画的 spinner 图标
+- 表格行悬停：背景色平滑过渡
+🚀 使用建议
+当你要创建类似风格的网站时，可以这样使用提示词：
+
+基础搭建：先使用"基础风格提示词"建立整体框架
+组件细化：根据需要使用"具体组件提示词"
+样式调整：参考"颜色系统"和"动画效果"进行微调
+技术栈：建议使用 Tailwind CSS + Vue.js 或 React