Releases: funnywwh/goproject
v0.5.0
v0.5.0 发布说明
发布日期: 2025年12月05日
版本概述
v0.5.0 版本主要包含需求和任务指派功能、Bug指派功能增强、个人工作台完善、权限控制增强、实体转换功能、详情组件封装、微信登录优化等多项功能更新,提升了系统的易用性和代码复用性。
主要更新
1. 需求和任务指派功能 🎯
- 指派接口:新增需求和任务指派接口,支持指派时添加备注和修改状态
- 自动状态修改:需求(draft/reviewing → active)、任务(wait → doing)
- 操作历史:完整记录指派人变更和状态变更
2. Bug指派功能增强 🐛
- 备注和状态:指派时可添加备注和修改状态
- 操作历史:备注和状态变更记录到历史记录
3. 个人工作台完善 🏠
- 个性化配置:支持卡片和Tab的显示/隐藏和排序
- 资源分配列表:展示工时统计和最近记录
- 工作报告列表:展示日报和周报
4. 权限控制增强 🔐
- 按钮级权限:添加
v-permission指令和PermissionButton组件 - 页面权限:在主要页面应用权限控制
5. 实体转换功能 🔄
- 相互转换:需求、任务、Bug之间支持相互转换
- 自动关联:转换后自动关联原实体
6. 详情组件封装 📋
- 组件复用:项目、需求、任务详情组件封装,减少代码重复
- 统一体验:保持一致的UI风格和交互体验
7. 负责人选择优化 👥
- 项目成员选择:需求、任务编辑使用项目成员选择组件
- 显示角色:下拉框显示成员角色信息
8. 资源分配列表 🕐
- 周期筛选:支持按本周、本月、全部筛选
- 多维度筛选:支持按用户、项目、日期范围筛选
9. 微信登录优化 🔐
- 用户名格式:使用
{OpenID后8位}_{YYYYMMDD}格式 - 权限控制:只有拥有
user:create权限的用户才能添加用户 - 安全性:微信登录不再自动创建用户
主要修复
- ✅ 修复Bug统计页面交互,支持快速跳转到筛选后的列表
- ✅ 修复需求、任务搜索条件的状态选项,与API定义保持一致
- ✅ 修复资源分配列表查询问题,优化权限过滤逻辑
- ✅ 优化详情弹窗标题显示格式
- ✅ 修复微信登录用户名生成逻辑,使用OpenID后8位+日期格式
- ✅ 新增需求和任务指派功能,支持备注和状态修改
升级说明
从 v0.4.13 升级
- 无需数据库迁移:本次更新不涉及数据库结构变更
- 前端更新:需要重新构建前端,更新相关组件
- 后端更新:需要重新编译后端,更新API处理逻辑
注意事项
- 需求和任务现在支持专门的指派功能,与Bug指派功能保持一致
- 指派时可手动选择状态,不选择则自动修改状态
- 指派时可添加备注信息,备注会记录到历史记录中
- 个人工作台支持个性化配置,可根据需要显示/隐藏卡片
- 权限控制已全面应用到各个页面,确保操作安全性
- 微信登录不再自动创建用户,用户必须先由管理员添加才能登录
版本号: v0.5.0
发布日期: 2025年12月05日
兼容性: 向后兼容 v0.4.13
v0.4.13
v0.4.13 发布说明
发布日期: 2025年12月02日
版本概述
v0.4.13 版本主要包含Bug功能优化、日志管理增强、Markdown预览改进等多项功能更新和问题修复。
主要更新
1. Bug功能优化 🐛
Bug解决自动指派
- 自动指派逻辑:工程师点击"解决"后,自动指派给Bug创建者
Bug编辑功能修复
- 修复清空关联需求/模块不生效的问题:现在可以正确清空并保存
- 修复字段更新冲突:解决了在更新实际工时时,关联需求、关联模块等字段的修改被覆盖的问题
- 完善历史记录显示:所有字段修改都正确记录,显示格式优化
界面优化
- 修复模态框层级问题:解决对话框不再被详情模态框遮挡(z-index优化)
- 修复下拉框显示问题:解决对话框中解决方案和版本下拉框不显示或被遮挡的问题
- 修复版本状态显示:版本编辑界面状态字段正确显示后端状态值(wait/normal/fail/terminate)
- 修复任务进度界面层级:更新任务进度对话框不再被任务详情遮挡
2. 日志管理功能 📋
日志输出到文件
- 文件日志支持:日志自动输出到文件,支持ZIP压缩
- 自动轮转:日志文件达到100MB时自动轮转,保留7天历史
- 前端控制:管理员可在前端控制日志级别和下载日志文件
3. Markdown预览增强 📸
图片预览功能
- 点击预览:Markdown中的图片支持点击预览,弹出全屏预览窗口
- 滚动缩放:在预览窗口中,鼠标滚轮可以放大/缩小图片(50%-500%)
- 预览标签页支持:编辑模式的预览标签页和只读模式都支持图片点击预览
4. 工作报告功能优化 📝
工作报告收集增强
- 统计完成的任务:工作报告收集功能现在会统计在指定日期范围内完成的任务(即使没有资源分配记录)
工作报告详情查看
- 点击列表项查看详情:日报和周报列表支持点击行查看完整详情,包括工作内容、审批状态、审批记录等信息
- 详情显示与预览一致:详情弹窗中的内容使用MarkdownEditor组件显示,与编辑时的预览完全一致,支持图片预览、代码高亮等功能
- 列表项点击效果:表格行支持鼠标悬停效果,显示指针样式和背景色变化
修复的问题
- ✅ 修复编辑Bug时清空关联需求/模块不生效的问题
- ✅ 修复更新实际工时时,关联需求/模块的修改被覆盖的问题
- ✅ 修复历史记录中某些字段变更未被记录的问题
- ✅ 修复解决对话框被详情模态框遮挡的问题
- ✅ 修复解决对话框下拉框不显示或被遮挡的问题(解决方案、版本下拉框)
- ✅ 修复TypeScript类型错误(requirement_id和module_id的空字符串比较)
- ✅ 修复版本编辑界面状态显示不正确的问题(状态值类型统一)
- ✅ 修复工作报告收集功能未统计完成任务的问题
- ✅ 修复任务详情遮挡更新任务进度界面的问题
升级说明
从 v0.4.12 升级
- 无需数据库迁移:本次更新不涉及数据库结构变更
- 前端更新:需要重新构建前端,更新相关组件
- 后端更新:需要重新编译后端,更新相关API处理逻辑
注意事项
- 历史记录显示格式已优化,旧的历史记录会以新格式显示
- 清空关联需求/模块的功能现在可以正常工作
- 所有字段的修改都会正确记录到历史记录中
版本号: v0.4.13
发布日期: 2025年12月02日
兼容性: 向后兼容 v0.4.12
v0.4.12
v0.4.12 发布说明
发布日期: 2025年12月01日
版本概述
v0.4.12 版本合并了 v0.4.10 和 v0.4.11 的所有更新,并新增了数据库自动备份功能。本次更新包括用户体验优化、安全修复和重要的数据安全保障功能。同时优化了首次登录修改密码界面,显示用户名和昵称信息,提升用户体验。
主要更新
1. 数据库自动备份功能 💾(新增)
功能特点
- 自动定时备份:支持设置每天固定时间自动备份数据库
- 手动触发备份:支持通过前端界面手动触发备份
- 数据一致性保障:使用 SQLite 的
VACUUM INTO命令确保备份时数据一致(不支持时自动回退到文件复制) - 自动压缩:备份文件自动压缩为
.gz格式,节省存储空间 - 自动清理:自动清理7天前的旧备份,避免占用过多存储空间
- 备份验证:自动验证备份文件完整性和有效性
- 权限控制:需要
system:settings权限才能访问备份设置
技术实现
- 使用
VACUUM INTO命令创建一致的数据库快照,支持在线备份 - 使用
time.AfterFunc精确调度,支持到秒级精度 - 使用互斥锁防止同时执行多个备份
- 配置变更后自动重新计算下次执行时间
- 备份文件完整性验证(SQLite 文件头检查)
- 详细的日志记录(开始时间、结束时间、耗时、压缩比例等)
涉及的模块
- ✅
backend/internal/utils/backup.go- 备份函数 - ✅
backend/internal/utils/scheduler.go- 定时任务调度器 - ✅
backend/internal/api/system.go- 系统设置API - ✅
frontend/src/views/system/BackupSettings.vue- 备份设置页面
2. 项目弹窗详情内容完善 🎯
完善了项目列表弹窗详情的内容,使其与非弹窗详情页面完全一致:
- 添加统计概览(总任务数、总Bug数、总需求数、项目成员数)
- 添加任务统计、Bug统计、需求统计,支持点击跳转
- 添加完整的历史记录时间线
- 添加项目成员列表
- 补充顶部操作按钮(需求管理、任务管理、Bug管理、看板、甘特图等)
3. 任务弹窗详情内容完善 📋
添加了依赖任务部分,支持点击跳转到依赖任务详情。
4. 版本弹窗详情样式优化 🎨
优化了关联需求和关联Bug的链接样式,统一使用 a-button type="link"。
5. 前端构建配置优化 🛠️
优化了代码分割策略,将大型库分离到独立的 chunk,减少主 chunk 大小,提升加载性能。
6. 修复登录密码修改检测绕过漏洞 🔒
修复内容
- 后端增强:在
GetUserInfoAPI 中添加is_first_login字段,基于LoginCount == 1 && Password != ""判断 - 前端状态管理:在 auth store 中添加
isFirstLogin状态 - 路由守卫增强:添加首次登录检查,强制跳转到修改密码页面
- 状态同步:修改密码成功后,清除
isFirstLogin状态,并更新后端LoginCount为 2
修复效果
- ✅ 首次登录用户必须完成密码修改才能访问系统其他功能
- ✅ 无法通过修改URL、刷新页面等方式跳过修改密码检测
- ✅ 微信登录用户不受影响,不会被误判
7. 修复其他相关问题 🔧
- 修复修改密码后状态不同步问题
- 修复
GetUserInfo判断逻辑不准确问题(微信用户不会被误判) - 修复路由守卫时序问题
- 修复 AppHeader 中修改密码未清除状态问题
8. 初始化修改密码界面优化 🎨
优化了首次登录修改密码界面的用户体验:
- 显示用户信息:在修改密码表单上方显示用户名和昵称
- 信息确认:用户可以在设置密码前确认当前账号信息
- 自动加载:如果用户信息未加载,自动从后端获取并显示
- 样式优化:使用描述列表组件展示用户信息,界面更清晰美观
更新内容
新增文件
后端:
backend/internal/utils/backup.go- 备份函数backend/internal/utils/scheduler.go- 定时任务调度器backend/internal/api/system.go- 系统设置API
前端:
frontend/src/api/system.ts- 备份配置API接口frontend/src/views/system/BackupSettings.vue- 备份设置页面
修改文件
后端:
backend/internal/utils/backup.go- 备份函数,支持 VACUUM INTO 和文件复制回退,添加备份验证backend/internal/utils/scheduler.go- 定时任务调度器,精确调度和配置重载backend/internal/utils/migrate.go- 添加系统设置权限backend/cmd/server/main.go- 启动定时任务、修改备份调用、添加路由backend/internal/api/system.go- 系统设置API,备份配置和手动触发backend/internal/api/auth.go- GetUserInfo 添加 is_first_login 字段,ChangePassword 更新 LoginCount
前端:
frontend/src/views/system/BackupSettings.vue- 备份设置页面,支持配置和手动触发frontend/src/api/system.ts- 备份配置API接口frontend/src/views/project/Project.vue- 完善弹窗详情内容frontend/src/views/task/Task.vue- 添加依赖任务部分frontend/src/views/version/Version.vue- 优化链接样式frontend/vite.config.ts- 优化代码分割策略frontend/src/types/user.ts- User 接口添加 is_first_login 字段frontend/src/stores/auth.ts- 添加 isFirstLogin 状态frontend/src/router/index.ts- 路由守卫增强,添加备份设置路由frontend/src/views/auth/*.vue- 登录和修改密码相关页面状态同步,修改密码界面显示用户信息frontend/src/components/AppHeader.vue- 修改密码状态清除frontend/src/config/menu.ts- 添加备份设置菜单项
升级指南
从 v0.4.9 升级
-
代码更新:
git pull origin main
-
后端编译:
cd backend go build -o server cmd/server/main.go -
前端构建:
cd frontend npm install npm run build -
数据库迁移:系统会自动迁移数据库,添加新的权限
-
配置备份:
- 访问系统管理 → 备份设置
- 配置备份时间和启用状态
- 建议在系统低峰期执行备份(如凌晨2点)
注意事项
- 此版本合并了 v0.4.10 和 v0.4.11 的所有更新
- 数据库自动备份功能需要配置备份时间和启用状态
- 备份文件保存在数据库文件所在目录的
backups文件夹中 - 备份文件自动压缩为
.gz格式,保留最近7天的备份 - 首次登录用户必须完成密码修改才能访问系统其他功能
- 微信登录用户不受影响,不会被强制修改密码
安全建议
- 建议用户设置强密码(包含大小写字母和数字)
- 建议定期检查备份文件是否正常生成
- 建议将备份文件同步到其他存储位置(如云存储)
- 建议在系统低峰期执行备份
下载地址: GitHub Releases
v0.4.9
v0.4.9 发布说明
发布日期: 2025年12月02日
版本概述
v0.4.9 版本是一个重要的用户体验优化和功能增强版本,将所有管理列表的详情页面改为弹窗显示,统一了交互方式,提升了操作效率。用户现在可以通过点击列表行直接打开详情弹窗,无需跳转到新页面,所有操作都可以在弹窗中完成。同时修复了测试单状态值不一致的问题,确保前后端状态值统一。此外,还新增了数据库备份、服务器重启、版本信息查看等实用功能,以及自动化发布和编译脚本,大大提升了系统的可维护性和部署效率。在用户菜单中添加了"关于"功能,方便用户查看系统版本信息。
主要更新
1. 详情弹窗统一化 🎯
功能描述
将所有管理列表(Bug、需求、任务、版本、项目、测试单)的详情页面改为弹窗显示,用户点击列表行即可打开详情弹窗,所有操作都可以在弹窗中完成,无需跳转到新页面。
功能特点
- 统一交互:所有列表统一使用点击行打开详情弹窗的方式
- 操作便捷:所有操作(编辑、删除、状态变更等)都可以在弹窗中完成
- 信息完整:弹窗中显示完整的详情信息,包括基本信息、描述、历史记录等
- 防止冒泡:操作按钮使用
@click.stop防止事件冒泡,避免误触发行点击 - 状态保持:编辑后自动刷新详情,保持数据同步
涉及的模块
- ✅ Bug管理 (
Bug.vue) - 详情弹窗包含基本信息、描述、历史记录、关联需求,支持编辑、指派、确认、解决、关闭、转换、删除、添加备注等操作 - ✅ 需求管理 (
Requirement.vue) - 详情弹窗包含基本信息、描述、历史记录,支持编辑、状态变更、转换Bug、删除、添加备注等操作 - ✅ 任务管理 (
Task.vue) - 详情弹窗包含基本信息、描述、历史记录,支持编辑、进度更新、状态变更、删除、添加备注等操作 - ✅ 版本管理 (
Version.vue) - 详情弹窗包含基本信息、描述,支持编辑、发布、状态变更、删除等操作 - ✅ 项目管理 (
Project.vue) - 详情弹窗包含基本信息、描述,支持编辑、成员管理、模块管理、删除等操作 - ✅ 测试单管理 (
TestCase.vue) - 详情弹窗包含基本信息、描述、测试步骤、关联Bug,支持编辑、状态变更、删除等操作
用户体验提升
- 操作效率:无需跳转页面,直接在弹窗中查看和操作,提升效率
- 交互统一:所有列表使用相同的交互方式,降低学习成本
- 信息完整:弹窗中显示完整的详情信息,包括历史记录
- 操作便捷:所有操作都可以在弹窗中完成,无需返回列表
技术实现
- 使用 Ant Design Vue 的
a-modal组件实现弹窗 - 添加
detailModalVisible、detailXXX、detailLoading等状态变量 - 实现
loadXXXDetail函数加载详情数据 - 实现
handleDetailXXX函数处理各种操作 - 使用
@click.stop防止操作按钮事件冒泡 - 添加
table-row-clickable样式类,提示行可点击
2. 移除详情操作按钮 🗑️
功能描述
移除所有列表中的"详情"操作按钮,统一使用点击行打开详情弹窗的方式,简化界面,提升交互一致性。
涉及的模块
- ✅ Bug管理 - 移除详情按钮,保留点击行打开详情
- ✅ 需求管理 - 移除详情按钮,保留点击行打开详情
- ✅ 任务管理 - 移除详情按钮,保留点击行打开详情
- ✅ 版本管理 - 移除详情按钮,保留点击行打开详情
- ✅ 项目管理 - 移除详情按钮,保留点击行打开详情
用户体验提升
- 界面简化:移除冗余的详情按钮,界面更简洁
- 交互统一:所有列表使用相同的交互方式
- 操作直观:点击行即可打开详情,更符合用户习惯
3. 数据库备份功能 💾
功能描述
为服务器添加了数据库备份功能,支持通过命令行参数自动备份 SQLite 数据库,并自动压缩备份文件,保留最近7天的备份。
功能特点
- 一键备份:使用
--backup参数即可完成数据库备份 - 自动压缩:备份文件自动压缩为
.gz格式,节省存储空间 - 时间戳命名:备份文件使用时间戳命名,便于管理
- 自动清理:自动清理7天前的旧备份,避免占用过多空间
- 备份统计:显示备份数量和总大小
使用方法
# 基本使用
./server --backup
# 或者
./server -backup
# 或者
./server backup备份文件位置
- 备份目录:
{数据库文件所在目录}/backups/ - 备份文件格式:
data_YYYYMMDD_HHMMSS.db.gz - 保留期限:最近7天
定时备份(使用 cron)
# 每天凌晨2点自动备份
0 2 * * * cd /path/to/backend && ./server --backup >> /var/log/db-backup.log 2>&14. 服务器停止功能 🛑
功能描述
为服务器添加了停止功能,支持通过命令行参数自动查找并停止运行中的服务器进程。
功能特点
- 智能查找:通过端口号自动查找运行中的服务器进程(支持
lsof、ss、netstat) - 优雅关闭:先发送
SIGTERM信号优雅关闭(等待最多10秒) - 强制终止:如果进程未退出,自动发送
SIGKILL强制终止 - 错误提示:如果服务器未运行,会返回明确的错误信息
使用方法
# 基本使用
./server --stop
# 或者
./server -stop
# 或者
./server stop工作原理
- 通过配置的端口号查找正在运行的服务器进程
- 发送
SIGTERM信号优雅关闭 - 等待进程退出(最多10秒)
- 如果未退出,发送
SIGKILL强制终止 - 显示停止结果
示例输出
2025/12/01 15:32:37 Stopping server on port 8080...
2025/12/01 15:32:37 Found server process: PID 2827595
2025/12/01 15:32:37 Sending SIGTERM to process 2827595...
2025/12/01 15:32:37 Waiting for process 2827595 to exit...
2025/12/01 15:32:37 Process 2827595 has exited
2025/12/01 15:32:37 Server stopped successfully
5. 服务器重启功能 🔄
功能描述
为服务器添加了重启功能,支持通过命令行参数自动查找并停止运行中的服务器进程,然后重新启动服务器。
功能特点
- 智能查找:通过端口号自动查找运行中的服务器进程(支持
lsof、ss、netstat) - 优雅关闭:先发送
SIGTERM信号优雅关闭(等待最多10秒) - 强制终止:如果进程未退出,自动发送
SIGKILL强制终止 - 自动重启:停止后自动在后台启动新的服务器进程
使用方法
# 基本使用
./server --restart
# 或者
./server -restart
# 或者
./server restart工作原理
- 通过配置的端口号查找正在运行的服务器进程
- 发送
SIGTERM信号优雅关闭 - 等待进程退出(最多10秒)
- 如果未退出,发送
SIGKILL强制终止 - 重新启动服务器(后台运行)
与 stop 的区别
--stop:只停止服务器,不重新启动--restart:停止服务器后自动重新启动
6. 版本信息功能 📋
功能描述
为服务器添加了版本信息查看功能,支持通过命令行参数显示版本号、构建时间和 Go 版本信息。
功能特点
- 版本号显示:显示当前版本号
- 构建信息:显示构建时间和 Git 提交哈希(如果通过构建时注入)
- Go 版本:显示编译时使用的 Go 版本
使用方法
# 基本使用
./server --version
# 或者
./server -version
# 或者
./server version
# 或者
./server -v
# 或者
./server -V示例输出
Project Management System
Version: v0.4.9
Go Version: go1.24.10
7. 发布和编译脚本 🛠️
功能描述
添加了自动化发布和编译脚本,简化版本发布和构建流程,支持多平台编译和版本信息注入。
发布脚本 (release.sh)
- 自动更新版本号:自动更新
backend/cmd/server/main.go中的版本号 - 提交和推送:自动提交更改并推送到远程仓库
- 创建/更新 Tag:自动创建或更新 Git tag
- 推送 Tag:自动推送 tag 到远程仓库
编译脚本 (build.sh)
- 多平台支持:支持 Linux、Windows、macOS 等多个平台
- 版本信息注入:自动注入版本号、构建时间、Git 提交哈希
- 前端构建:自动构建前端并复制到 embed 目录
- 统一输出:输出到
releases/<版本号>/目录
使用方法
# 发布版本
./scripts/release.sh v0.5.0 "新功能发布"
# 编译单个平台
./scripts/build.sh v0.5.0 linux
# 编译所有平台
./scripts/build.sh v0.5.0 all支持的平台
linux- Linux (静态编译, 仅支持MySQL)linux-sqlite- Linux (支持SQLite, 需要CGO)windows- Windowsmac- macOS (Intel)mac-arm- macOS (Apple Silicon)all- 构建所有平台
8. 命令行参数处理优化 🔧
功能描述
重构了命令行参数处理方式,使用 Go 标准库 flag 包替代字符串比较,使参数处理更加规范和易维护。
改进内容
- 标准化处理:使用 Go 标准库
flag包处理命令行参数 - 自动帮助:添加
--help/-h参数支持,自动显示帮助信息 - 参数验证:自动检测未知参数并提示错误
- 代码优化:参数定义集中管理,易于维护和扩展
使用方法
# 显示帮助信息
./server --help
# 或者
./server -h支持的参数
--backup/-backup- 备份数据库--stop/-stop- 停止服务器--restart/-restart- 重启服务器--version/-version/-v/-V- 显示版本信息--help/-h- 显示帮助信息
优势
- 标准化:符合 Go 语言惯例,使用标准库
- 易维护:参数定义集中,易于添加新参数
- 用户友好:自动支持帮助信息,提供清晰的使用说明
- 错误处理:自动检测未知参数并提示
9. 关于菜单功能 📱
功能描述
在用户菜单中添加了"关于"菜单项,点击后可以查看系统版本信息,包括版本号、构建时间、Git提交哈希和Go版本等详细信息。
功能特点
- 位置便捷:位于用户菜单中,"退出登录"前面
- 信息完整:显示系统名称、版本号、构建时间、Git提交、Go版本等
- 自动加载:点击"关于"时自动从后端获取最新版本信息
- 友好展示:使用描述列表组件清晰展示各项信息
- 容错处理:如果获取失败,显示默认版本信息
使用方法
- 点击右上角用户头像
- 在下拉菜单中点击"关于"
- 查看系统版本信息弹窗
显示内容
- 系统名称:项目管理系统
- 版本号:当前系统版本(如 v0.4.9)
- 构建时间:系统构建时间(如果可用)
- Git提交:Git提交哈希(如果可用)
- Go版本:编译时使用的Go版本
技术实现
- 后端提供
/api/version接口返回版本信息(无需认证) - 前端使用
getVersionInfoAPI 获取版本信息 - 使用 Ant Design Vue 的
a-descriptions组件展示信息 - 版本信息API与版本管理API共存于
frontend/src/api/version.ts文件中,通过不同的接口路径区分- 系统版本信息:
/api/version(GET) - 版本管理:
/api/versions(GET/POST/PUT/DELETE等)
- 系统版本信息:
10. 测试单状态值修复 🔧
问题描述
测试单的状态值在前端表单和操作按钮中使用的是 pending/running/passed/failed,但后端API只支持 wait/normal/blocked/investigate,导致状态更新失败。
修复内容
- 统一状态值:将前端所有状态值统一为后端支持的值
wait- 待评审normal- 正常blocked- 被阻塞investigate- 研究中
- 更新API接口:更新
CreateTestCaseRequest和UpdateTestCaseRequest的状态类型定义 - 更新表单选项:更新表单中的状态选项为正确的值
- 更新操作按钮:更新状态变更按钮的状态值为正确的值
- 移除状态映射:移除编辑时的状态值转换逻辑,直接使用后端返回的状态值
- 更新状态显示:更新状态颜色和文本映射,确保正确显示
修复效果
- ✅ 测试单状态更新功能正常
- ✅ 前后端状态值完全一致
- ✅ 状态显示正确
- ✅ 符合禅道测试单状态规范
问题修复详情
修复的问题
- ✅ 详情页面需要跳转,操作效率低
- ✅ 不同列表的交互方式不一致
- ✅ 详情按钮冗余,界面不够简洁
- ✅ 测试单状态值不一致,导致状态更新失败
- ✅ 项目详情显示不正确
- ✅ 版本列表页面空白
- ✅ 版本列表
useRouter和watch未导入错误 - ✅ 任务列表重复函数定义错误
- ✅ TypeScript 构建错误:未使用的
router变量 - ✅ TypeScript 类型错误:Action 接口缺少
status_changed和progress_updated类型定义
修复后的效果
- ✅ 所有列表统一使用弹窗显示详情,操作更便捷
- ✅ 点击行即可打开详情,交互更直观
- ✅ 所有操作都可以在弹窗中完成,无需跳转
- ✅ 测试单状态值统一,状态更新功能正常
- ✅ 前后端状态值完全一致
- ✅ 界面更简洁,交互更统一
- ✅ TypeScript 构建通过,无类型错误
- ✅ Action 类型定义完整,支持所有操作类型
技术实现
详情弹窗实现
实现方案
-
状态管理
const detailModalVisible = ref(false) const detailXXX = ref<XXX | null>(null) const detailLoading = ref(false) const shouldKeepDetailOpen = ref(false)
-
加载详情
const loadXXXDetail = async (id: number) => { detailLoading.value = true try { detailXXX.value = await getXXX(id) } finally { detailLoading.value = false } }
-
打开详情
const handleView = async (record: XXX) => { detailModalVisible.value = true await loadXXXDetail(record.id) }
-
表格行点击
<a-table :custom-row="(record) => ({ onClick: () => handleView(record), class: 'table-row-clickable' })" >
-
防止事件冒泡
<a-button @click.stop="handleEdit(record)">编辑</a-button>
测试单状态值修复
实现方案
-
更新API接口定义
export interface CreateTestCaseRequest { status?: 'wait' | 'normal' | 'blocked' | 'investigate' }
-
更新表单选项
<a-select-option value="wait">待评审</a-select-option> <a-select-option value="normal">正常</a-select-option> <a-select-option value="blocked">被阻塞</a-select-option> <a-select-option value="investigate">研究中</a-select-option>
-
更新状态映射
const getStatusText = (status: string) => { const texts: Record<string, string> = { wait: '待评审', normal: '正常', blocked: '被阻塞', investigate: '研究中' } return texts[status] || status }
测试验证
测试场景
- ✅ Bug列表点击行打开详情弹窗
- ✅ Bug详情弹窗中所有操作功能正常
- ✅ 需求列表点击行打开详情弹窗
- ✅ 需求详情弹窗中所有操作功能正常
- ✅ 任务列表点击行打开详情弹窗
- ✅ 任务详情弹窗中所有操作功能正常
- ✅ 版本列表点击行打开详情弹窗
- ✅ 版本详情弹窗中所有操作功能正常
- ✅ 项目列表点击行打开详情弹窗
- ✅ 项目详情弹窗中所有操作功能正常
- ✅ 测试单列表点击行打开详情弹窗
- ✅ 测试单详情弹窗中所有操作功能正常
- ✅ 操作按钮不会触发行点击事件
- ✅ 编辑后详情自动刷新
- ✅ 测试单状态值更新功能正常
- ✅ 测试单状态显示正确
- ✅ TypeScript 类型检查通过
- ✅ 前端构建成功,无编译错误
- ✅ Action 类型定义完整,支持所有操作类型
- ✅ 数据库备份功能正常
- ✅ 服务器停止功能正常
- ✅ 服务器重启功能正常
- ✅ 版本信息显示功能正常
- ✅ 发布脚本功能正常
- ✅ 编译脚本功能正常
- ✅ 命令行参数处理正常
- ✅ 帮助信息显示正常
- ✅ 关于菜单功能正常
- ✅ 版本信息显示正常
测试结果
- 所有测试场景通过
- 详情弹窗功能稳定可靠
- 状态值修复功能正常
- TypeScript 构建通过
- 用户体验显著提升
- 无回归问题
更新内容
修改文件
前端:
frontend/src/views/bug/Bug.vue- 详情改为弹窗显示,移除详情按钮frontend/src/views/requirement/Requirement.vue- 详情改为弹窗显示,移除详情按钮,修复未使用的router变量...
0.4.8
v0.4.8 发布说明
发布日期: 2025年12月01日
版本概述
v0.4.8 版本主要优化了项目选择下拉框的用户体验,为所有管理页面中的"选择项目"下拉框添加了输入过滤功能,使用户可以通过输入关键词快速筛选和查找项目,显著提升了在项目数量较多时的选择效率。同时,增强了Bug管理的表单验证,将"描述"、"优先级"、"指派给"三个字段设为必填,确保Bug信息的完整性。
主要更新
1. Bug管理表单必填验证增强 ✅
功能描述
在新增Bug界面中,将"描述"、"优先级"、"指派给"三个字段设为必填,确保Bug信息的完整性和可追溯性。
功能特点
- 必填验证:描述、优先级、指派给三个字段必须填写
- 实时验证:表单提交时进行验证,未填写时显示错误提示
- 自定义验证器:指派给字段使用自定义验证器,确保至少选择一个指派人
- 用户体验:清晰的错误提示,引导用户正确填写表单
涉及的字段
- ✅ 描述 (
description) - 必填,支持Markdown格式 - ✅ 优先级 (
priority) - 必填,必须选择优先级 - ✅ 指派给 (
assignee_ids) - 必填,至少选择一个指派人
用户体验提升
- 数据完整性:确保Bug信息完整,便于后续跟踪和处理
- 减少遗漏:必填验证防止重要信息遗漏
- 提升质量:强制填写关键信息,提升Bug报告质量
技术实现
- 在表单验证规则中添加必填验证
- 使用自定义验证器验证指派给字段(数组非空)
- 更新字段placeholder,移除"(可选)"提示
2. 项目选择下拉框输入过滤功能 🔍
功能描述
为所有管理页面中的"选择项目"下拉框添加了输入过滤功能,用户可以通过输入关键词快速筛选和查找项目,提升选择效率。
功能特点
- 实时过滤:输入关键词时实时过滤项目列表
- 多字段匹配:支持按项目名称和项目编码进行过滤
- 不区分大小写:过滤时自动忽略大小写,提升易用性
- 统一体验:所有页面的项目选择都支持过滤功能
涉及的页面
- ✅ 项目管理 (
Project.vue) - 搜索表单 - ✅ Bug管理 (
Bug.vue) - 搜索表单和编辑表单 - ✅ 需求管理 (
Requirement.vue) - 搜索表单和编辑表单 - ✅ 测试管理 (
TestCase.vue) - 搜索表单和编辑表单 - ✅ 任务管理 (
Task.vue) - 搜索表单和编辑表单 - ✅ 版本管理 (
Version.vue) - 搜索表单和编辑表单 - ✅ 构建管理 (
Build.vue) - 搜索表单和编辑表单 - ✅ 资源管理 (
Resource.vue) - 搜索表单、编辑表单和资源分配表单 - ✅ 资源日历 (
ResourceCalendar.vue) - 搜索表单 - ✅ 资源利用率 (
ResourceUtilization.vue) - 搜索表单 - ✅ 资源统计 (
ResourceStatistics.vue) - 搜索表单
用户体验提升
- 快速查找:在项目较多时,可以通过输入快速定位目标项目
- 减少滚动:过滤后列表更短,减少滚动操作
- 提升效率:特别是在项目数量较多的情况下,显著提升选择效率
技术实现
- 使用 Ant Design Vue 的
show-search属性启用搜索功能 - 自定义
filterProjectOption函数实现过滤逻辑 - 支持按项目名称和编码进行模糊匹配
技术实现
项目选择下拉框输入过滤功能
实现方案
-
启用搜索功能
<a-select v-model:value="formData.project_id" placeholder="选择项目" show-search :filter-option="filterProjectOption" >
-
过滤函数实现
const filterProjectOption = (input: string, option: any) => { const project = projects.value.find(p => p.id === option.value) if (!project) return false const searchText = input.toLowerCase() return ( project.name.toLowerCase().includes(searchText) || (project.code && project.code.toLowerCase().includes(searchText)) ) }
-
过滤逻辑
- 支持按项目名称过滤(不区分大小写)
- 支持按项目编码过滤(如果存在,不区分大小写)
- 使用
includes方法实现模糊匹配
问题修复详情
修复的问题
- ✅ 项目选择下拉框不支持过滤,项目较多时选择困难
- ✅ 需要滚动大量项目才能找到目标项目
- ✅ 项目选择效率低下,影响用户体验
- ✅ Bug创建时可能遗漏关键信息(描述、优先级、指派给)
- ✅ Bug信息不完整,影响后续跟踪和处理
修复后的效果
- ✅ 所有项目选择下拉框支持输入过滤,快速定位项目
- ✅ 通过输入关键词即可快速筛选,无需滚动
- ✅ 项目选择效率显著提升,用户体验改善
- ✅ Bug创建时强制填写关键信息,确保信息完整
- ✅ 必填验证防止遗漏,提升Bug报告质量
测试验证
测试场景
- ✅ 所有项目选择下拉框的过滤功能正常
- ✅ 项目名称过滤功能正常
- ✅ 项目编码过滤功能正常(如果项目有编码)
- ✅ 过滤不区分大小写
- ✅ 模糊匹配功能正常
- ✅ 过滤后选择项目功能正常
- ✅ 清空输入后显示所有项目
- ✅ Bug创建时描述字段必填验证正常
- ✅ Bug创建时优先级字段必填验证正常
- ✅ Bug创建时指派给字段必填验证正常
- ✅ 未填写必填字段时显示错误提示
- ✅ 必填验证阻止表单提交
测试结果
- 所有测试场景通过
- 过滤功能稳定可靠
- 表单验证功能正常
- 用户体验显著提升
- 无回归问题
更新内容
修改文件
前端:
frontend/src/views/project/Project.vue- 项目选择支持过滤frontend/src/views/bug/Bug.vue- 项目选择支持过滤,新增必填验证(描述、优先级、指派给)frontend/src/views/requirement/Requirement.vue- 项目选择支持过滤,新增 filterProjectOption 函数frontend/src/views/test/TestCase.vue- 项目选择支持过滤frontend/src/views/task/Task.vue- 项目选择支持过滤frontend/src/views/version/Version.vue- 项目选择支持过滤frontend/src/views/build/Build.vue- 项目选择支持过滤frontend/src/views/resource/Resource.vue- 项目选择支持过滤,新增 filterProjectOption 函数frontend/src/views/resource/ResourceCalendar.vue- 项目选择支持过滤,新增 filterProjectOption 函数frontend/src/views/resource/ResourceUtilization.vue- 项目选择支持过滤,新增 filterProjectOption 函数frontend/src/views/resource/ResourceStatistics.vue- 项目选择支持过滤,新增 filterProjectOption 函数
代码质量改进
用户体验
- 改进前:项目选择下拉框不支持过滤,项目较多时选择困难
- 改进后:所有项目选择下拉框支持输入过滤,快速定位项目
- 优势:项目选择更高效,特别是在项目数量较多的情况下
操作效率
- 改进前:需要滚动大量项目才能找到目标项目
- 改进后:通过输入关键词即可快速筛选
- 优势:减少滚动操作,提升选择效率
功能完善
- 改进前:部分页面支持过滤,部分不支持,体验不一致
- 改进后:所有页面的项目选择都支持过滤功能
- 优势:统一的交互体验,降低学习成本
已知问题
无
后续计划
- 考虑为其他下拉框(如用户选择、标签选择等)也添加过滤功能
- 继续优化其他交互体验
- 考虑添加更多批量操作功能
- 优化移动端响应式布局
升级指南
从 v0.4.7 升级
-
代码更新:拉取最新代码
git pull origin main
-
前端构建:重新构建前端代码
cd frontend npm install npm run build -
测试验证:
- 测试所有管理页面的项目选择过滤功能
- 验证项目名称和编码过滤功能
- 检查过滤功能在不同场景下的表现
注意事项
- 此版本主要进行用户体验优化
- 不影响现有功能,仅改善项目选择体验
- 所有页面的项目选择自动支持过滤功能
- 无需修改现有代码
开发体验改进
交互优化
- 统一的过滤模式,便于新页面开发
- 清晰的过滤逻辑,易于理解和维护
- 提升用户操作效率,改善用户体验
功能完善
- 项目选择功能更完善,支持快速查找
- 统一的交互模式,降低学习成本
- 提升系统整体易用性
致谢
感谢所有贡献者的支持和反馈!
下载地址: GitHub Releases
v0.4.7
v0.4.7 发布说明
发布日期: 2025年12月01日
版本概述
v0.4.7 版本主要优化了用户界面交互体验,为所有管理页面添加了搜索栏折叠功能,优化了Bug列表界面显示,并新增了用户管理中的修改密码功能,提升了系统的易用性和管理效率。
主要更新
1. 项目选择下拉框输入过滤功能 🔍
功能描述
为所有管理页面中的"选择项目"下拉框添加了输入过滤功能,用户可以通过输入关键词快速筛选和查找项目,提升选择效率。
功能特点
- 实时过滤:输入关键词时实时过滤项目列表
- 多字段匹配:支持按项目名称和项目编码进行过滤
- 不区分大小写:过滤时自动忽略大小写,提升易用性
- 统一体验:所有页面的项目选择都支持过滤功能
涉及的页面
- ✅ 项目管理 (
Project.vue) - 搜索表单 - ✅ Bug管理 (
Bug.vue) - 搜索表单和编辑表单 - ✅ 需求管理 (
Requirement.vue) - 搜索表单和编辑表单 - ✅ 测试管理 (
TestCase.vue) - 搜索表单和编辑表单 - ✅ 任务管理 (
Task.vue) - 搜索表单和编辑表单 - ✅ 版本管理 (
Version.vue) - 搜索表单和编辑表单 - ✅ 构建管理 (
Build.vue) - 搜索表单和编辑表单 - ✅ 资源管理 (
Resource.vue) - 搜索表单、编辑表单和资源分配表单 - ✅ 资源日历 (
ResourceCalendar.vue) - 搜索表单 - ✅ 资源利用率 (
ResourceUtilization.vue) - 搜索表单 - ✅ 资源统计 (
ResourceStatistics.vue) - 搜索表单
用户体验提升
- 快速查找:在项目较多时,可以通过输入快速定位目标项目
- 减少滚动:过滤后列表更短,减少滚动操作
- 提升效率:特别是在项目数量较多的情况下,显著提升选择效率
技术实现
- 使用 Ant Design Vue 的
show-search属性启用搜索功能 - 自定义
filterProjectOption函数实现过滤逻辑 - 支持按项目名称和编码进行模糊匹配
2. 搜索栏折叠功能 ✨
功能描述
为所有管理列表页面添加了搜索栏折叠/展开功能,用户可以根据需要控制搜索栏的显示状态,节省页面空间。
功能特点
- 折叠/展开切换:点击搜索栏标题旁的按钮可以折叠或展开搜索栏
- 默认折叠:搜索栏默认处于折叠状态,节省页面空间
- 图标指示:使用向上/向下箭头图标清晰指示当前状态
- 平滑过渡:折叠和展开过程平滑自然
涉及的页面
- ✅ 项目管理 (
Project.vue) - ✅ Bug管理 (
Bug.vue) - ✅ 需求管理 (
Requirement.vue) - ✅ 测试管理 (
TestCase.vue) - ✅ 任务管理 (
Task.vue) - ✅ 测试报告 (
TestReport.vue) - ✅ 版本管理 (
Version.vue) - ✅ 用户管理 (
User.vue) - ✅ 部门管理 (
Department.vue) - ✅ 产品管理 (
Product.vue) - ✅ 构建管理 (
Build.vue) - ✅ 资源管理 (
Resource.vue) - ✅ 报表 (
Report.vue)
用户体验提升
- 节省空间:默认折叠状态让列表区域更大,显示更多内容
- 按需展开:需要搜索时再展开,不影响正常浏览
- 操作便捷:一键切换,操作简单直观
3. Bug列表界面优化 🎨
优化内容
行高限制
- 限制表格行高,避免内容过长导致行高过大
- 提升列表的紧凑性和可读性
分页位置调整
- 优化分页组件的位置和布局
- 使分页控件更易于访问和操作
间距优化
- 缩小页面元素之间的间距
- 提升页面空间利用率
移除 page-header
- 移除多余的 page-header 组件
- 简化页面结构,减少视觉干扰
默认每页20条
- 将默认每页显示数量从10条调整为20条
- 减少翻页次数,提升浏览效率
优化效果
- 更紧凑的布局:页面空间利用更高效
- 更好的可读性:行高适中,内容清晰
- 更快的浏览:默认显示更多内容,减少翻页
- 更简洁的界面:移除冗余元素,界面更清爽
4. 用户管理:修改密码功能 🔐
功能描述
在用户管理列表的操作列中,为每个用户添加了"修改密码"功能,管理员可以直接修改任意用户的密码。
功能特点
- 便捷操作:在用户列表的操作列中直接点击"修改密码"按钮
- 密码强度验证:新密码必须满足强度要求(至少6位,包含大写字母、小写字母和数字)
- 确认密码:需要输入两次密码进行确认,避免输入错误
- 安全可靠:密码加密存储,符合安全规范
使用场景
- 用户忘记密码,管理员代为重置
- 新用户首次登录需要设置密码
- 定期更换用户密码,提升安全性
- 批量用户密码管理
界面设计
- 按钮位置:位于"编辑"按钮旁边,操作便捷
- 对话框设计:清晰的表单布局,包含用户名显示、新密码输入、确认密码输入
- 密码提示:显示密码强度要求,帮助用户设置符合要求的密码
- 验证反馈:实时验证密码格式和一致性,提供清晰的错误提示
技术实现
- 使用现有的
updateUserAPI,传递nickname和password字段 - 前端表单验证确保密码强度和一致性
- 后端验证密码强度并加密存储
技术实现
项目选择下拉框输入过滤功能
实现方案
-
启用搜索功能
<a-select v-model:value="formData.project_id" placeholder="选择项目" show-search :filter-option="filterProjectOption" >
-
过滤函数实现
const filterProjectOption = (input: string, option: any) => { const project = projects.value.find(p => p.id === option.value) if (!project) return false const searchText = input.toLowerCase() return ( project.name.toLowerCase().includes(searchText) || (project.code && project.code.toLowerCase().includes(searchText)) ) }
-
过滤逻辑
- 支持按项目名称过滤(不区分大小写)
- 支持按项目编码过滤(如果存在,不区分大小写)
- 使用
includes方法实现模糊匹配
搜索栏折叠功能
实现方案
-
状态管理
const searchFormVisible = ref(false) // 默认折叠
-
切换函数
const toggleSearchForm = () => { searchFormVisible.value = !searchFormVisible.value }
-
模板实现
<a-form v-show="searchFormVisible" layout="inline" :model="searchForm"> <!-- 搜索表单内容 --> </a-form>
-
图标切换
<UpOutlined v-if="searchFormVisible" /> <DownOutlined v-else />
Bug列表界面优化
样式调整
- 行高限制:使用 CSS 限制表格行高
- 间距优化:调整 margin 和 padding 值
- 分页布局:优化分页组件的位置和样式
- 移除冗余:删除 page-header 相关代码
修改密码功能
前端实现
-
表单数据
const changePasswordFormData = reactive({ id: 0, username: '', nickname: '', password: '', confirmPassword: '' })
-
验证规则
- 密码强度验证:至少6位,包含大小写字母和数字
- 确认密码验证:两次输入必须一致
-
API调用
await updateUser(changePasswordFormData.id, { nickname: changePasswordFormData.nickname, password: changePasswordFormData.password })
问题修复详情
修复的问题
- ✅ 项目选择下拉框不支持过滤,项目较多时选择困难
- ✅ 搜索栏占用过多页面空间
- ✅ Bug列表界面不够紧凑,行高过大
- ✅ 用户密码管理不便,需要编辑整个用户信息
- ✅ 默认每页显示数量较少,需要频繁翻页
修复后的效果
- ✅ 所有项目选择下拉框支持输入过滤,快速定位项目
- ✅ 搜索栏可以折叠,节省页面空间
- ✅ Bug列表界面更紧凑,显示更高效
- ✅ 可以直接修改用户密码,操作更便捷
- ✅ 默认显示更多内容,减少翻页操作
测试验证
测试场景
- ✅ 所有项目选择下拉框的过滤功能正常
- ✅ 项目名称和编码过滤功能正常
- ✅ 所有管理页面的搜索栏折叠/展开功能正常
- ✅ Bug列表界面显示优化效果符合预期
- ✅ 用户管理修改密码功能正常
- ✅ 密码强度验证正常工作
- ✅ 确认密码验证正常工作
- ✅ 修改密码后可以正常登录
- ✅ 默认每页20条显示正常
- ✅ 分页功能正常
测试结果
- 所有测试场景通过
- 界面交互体验显著提升
- 功能稳定可靠
- 无回归问题
更新内容
修改文件
前端:
frontend/src/views/project/Project.vue- 添加搜索栏折叠功能,项目选择支持过滤frontend/src/views/bug/Bug.vue- 添加搜索栏折叠功能,优化界面显示,项目选择支持过滤frontend/src/views/requirement/Requirement.vue- 添加搜索栏折叠功能,项目选择支持过滤frontend/src/views/test/TestCase.vue- 添加搜索栏折叠功能,项目选择支持过滤frontend/src/views/task/Task.vue- 添加搜索栏折叠功能,项目选择支持过滤frontend/src/views/test/TestReport.vue- 添加搜索栏折叠功能frontend/src/views/version/Version.vue- 添加搜索栏折叠功能,项目选择支持过滤frontend/src/views/user/User.vue- 添加搜索栏折叠功能,添加修改密码功能frontend/src/views/department/Department.vue- 添加搜索栏折叠功能frontend/src/views/product/Product.vue- 添加搜索栏折叠功能frontend/src/views/build/Build.vue- 添加搜索栏折叠功能,项目选择支持过滤frontend/src/views/resource/Resource.vue- 添加搜索栏折叠功能,项目选择支持过滤frontend/src/views/resource/ResourceCalendar.vue- 项目选择支持过滤frontend/src/views/resource/ResourceUtilization.vue- 项目选择支持过滤frontend/src/views/resource/ResourceStatistics.vue- 项目选择支持过滤frontend/src/views/report/Report.vue- 添加搜索栏折叠功能
代码质量改进
用户体验
- 改进前:项目选择下拉框不支持过滤,项目较多时选择困难;搜索栏始终显示,占用页面空间
- 改进后:项目选择支持输入过滤,快速定位;搜索栏可折叠,按需显示
- 优势:项目选择更高效,页面空间利用更高效,界面更清爽
操作效率
- 改进前:修改用户密码需要编辑整个用户信息
- 改进后:可以直接修改密码,操作更便捷
- 优势:减少操作步骤,提升管理效率
界面优化
- 改进前:Bug列表界面不够紧凑,默认显示数量少
- 改进后:界面更紧凑,默认显示更多内容
- 优势:信息密度更高,浏览效率提升
已知问题
无
后续计划
- 继续优化其他页面的用户体验
- 考虑添加更多批量操作功能
- 优化移动端响应式布局
- 考虑添加密码策略配置功能
升级指南
从 v0.4.6 升级
-
代码更新:拉取最新代码
git pull origin main
-
前端构建:重新构建前端代码
cd frontend npm install npm run build -
测试验证:
- 测试所有管理页面的搜索栏折叠功能
- 验证Bug列表界面优化效果
- 测试用户管理修改密码功能
- 检查密码强度验证是否正常
注意事项
- 此版本主要进行界面优化和功能增强
- 不影响现有功能,仅改善用户体验
- 所有页面自动应用新的搜索栏折叠功能
- 修改密码功能需要管理员权限
开发体验改进
界面交互
- 统一的搜索栏折叠模式,便于新页面开发
- 清晰的交互逻辑,易于理解和维护
- 减少界面冗余,提升用户体验
功能完善
- 用户管理功能更完善,支持密码管理
- 界面优化提升操作效率
- 统一的交互模式,降低学习成本
致谢
感谢所有贡献者的支持和反馈!
下载地址: GitHub Releases
v0.4.6
v0.4.6 发布说明
发布日期: 2025年1月XX日
版本概述
v0.4.6 版本主要修复了测试管理列表页面控件显示问题,统一了所有管理列表页面的样式风格,并将所有工作区改为可滚动,提升了用户体验和界面一致性。
主要更新
1. 修复测试管理列表页面显示问题 🐛
问题描述
- 问题:测试管理列表页面的控件看不见
- 原因:缺少白色背景和内边距样式,导致控件与背景色相同无法显示
修复方案
- 为
.content添加灰色背景#f0f2f5 - 为
.content-inner添加白色背景、内边距24px和圆角4px - 与项目管理列表页面样式保持一致
2. 统一所有管理列表页面样式 🎨
样式统一
为所有管理列表页面统一添加了以下样式:
.content:灰色背景#f0f2f5,提供统一的页面背景.content-inner:白色背景、内边距24px、圆角4px,提供统一的内容区域样式
涉及的页面
- ✅ 项目管理 (
Project.vue) - ✅ Bug管理 (
Bug.vue) - ✅ 需求管理 (
Requirement.vue) - ✅ 测试管理 (
TestCase.vue) - ✅ 任务管理 (
Task.vue) - ✅ 测试报告 (
TestReport.vue) - ✅ 版本管理 (
Version.vue) - ✅ 用户管理 (
User.vue) - ✅ 部门管理 (
Department.vue) - ✅ 产品管理 (
Product.vue) - ✅ 构建管理 (
Build.vue) - ✅ 资源管理 (
Resource.vue) - ✅ 报表 (
Report.vue) - ✅ 甘特图 (
Gantt.vue) - ✅ 看板 (
Board.vue) - ✅ 看板列表 (
BoardList.vue) - ✅ 进度 (
Progress.vue) - ✅ 资源利用率 (
ResourceUtilization.vue) - ✅ 资源日历 (
ResourceCalendar.vue) - ✅ 仪表板 (
Dashboard.vue)
3. 所有工作区支持滚动 ✨
功能改进
- 将所有管理列表页面的
.content-inner样式从overflow: hidden改为overflow-y: auto - 当内容超出可视区域时,工作区可以垂直滚动
- 提升了长内容页面的用户体验
优势
- 更好的内容访问:用户可以滚动查看所有内容,不会因为内容过长而无法访问
- 统一的交互体验:所有页面都支持滚动,交互方式一致
- 响应式适配:适配不同屏幕尺寸和内容长度
技术实现
样式统一方案
-
统一背景色
.content { padding: 24px; background: #f0f2f5; flex: 1; height: 0; display: flex; flex-direction: column; overflow: hidden; }
-
统一内容区域
.content-inner { background: white; padding: 24px; border-radius: 4px; max-width: 100%; margin: 0 auto; width: 100%; flex: 1; display: flex; flex-direction: column; overflow-y: auto; height: 0; }
-
滚动支持
- 使用
overflow-y: auto实现垂直滚动 - 保持
flex布局和height: 0确保正确的布局计算 - 不影响表格内部的滚动功能
- 使用
前端修改
修复的页面
-
测试管理页面 (
frontend/src/views/test/TestCase.vue)- 添加
.content灰色背景 - 添加
.content-inner白色背景、内边距、圆角
- 添加
-
Bug管理页面 (
frontend/src/views/bug/Bug.vue)- 添加
.content-inner白色背景、内边距、圆角 - 修改
overflow: hidden为overflow-y: auto
- 添加
-
需求管理页面 (
frontend/src/views/requirement/Requirement.vue)- 添加
.content-inner白色背景、内边距、圆角 - 修改
overflow: hidden为overflow-y: auto
- 添加
统一修改的页面
所有其他管理列表页面都进行了相同的样式统一和滚动支持修改。
问题修复详情
修复前的问题
- 测试管理列表页面控件看不见
- 不同页面的样式不一致
- 内容过长时无法滚动查看
修复后的效果
- 所有页面控件正常显示
- 统一的视觉风格,界面更专业
- 所有工作区支持滚动,内容可完整访问
测试验证
测试场景
- ✅ 测试管理列表页面控件正常显示
- ✅ Bug管理列表页面样式统一
- ✅ 需求管理列表页面样式统一
- ✅ 所有页面工作区可以滚动
- ✅ 长内容页面可以完整查看
- ✅ 表格内部滚动功能正常
测试结果
- 所有测试场景通过
- 界面一致性显著提升
- 用户体验改善
- 无回归问题
更新内容
修改文件
前端:
frontend/src/views/test/TestCase.vue- 修复显示问题,添加样式frontend/src/views/bug/Bug.vue- 统一样式,添加滚动支持frontend/src/views/requirement/Requirement.vue- 统一样式,添加滚动支持frontend/src/views/task/Task.vue- 统一样式,添加滚动支持frontend/src/views/test/TestReport.vue- 统一样式,添加滚动支持frontend/src/views/version/Version.vue- 统一样式,添加滚动支持frontend/src/views/user/User.vue- 添加滚动支持frontend/src/views/department/Department.vue- 统一样式,添加滚动支持frontend/src/views/product/Product.vue- 统一样式,添加滚动支持frontend/src/views/build/Build.vue- 统一样式,添加滚动支持frontend/src/views/resource/Resource.vue- 统一样式,添加滚动支持frontend/src/views/report/Report.vue- 统一样式,添加滚动支持frontend/src/views/gantt/Gantt.vue- 添加滚动支持frontend/src/views/board/Board.vue- 统一样式,添加滚动支持frontend/src/views/board/BoardList.vue- 统一样式,添加滚动支持frontend/src/views/progress/Progress.vue- 统一样式,添加滚动支持frontend/src/views/resource/ResourceUtilization.vue- 添加滚动支持frontend/src/views/resource/ResourceCalendar.vue- 添加滚动支持frontend/src/views/dashboard/Dashboard.vue- 统一样式,添加滚动支持frontend/src/views/project/Project.vue- 添加滚动支持
代码质量改进
样式一致性
- 改进前:不同页面样式不统一,部分页面控件看不见
- 改进后:所有页面使用统一的样式规范
- 优势:界面更专业,用户体验更一致
可维护性
- 改进前:样式分散,修改需要逐个页面处理
- 改进后:统一的样式模式,易于维护
- 优势:后续修改更容易,减少重复工作
用户体验
- 改进前:内容过长时无法查看完整内容
- 改进后:所有工作区支持滚动
- 优势:用户可以访问所有内容,不会遗漏信息
已知问题
无
后续计划
- 继续优化其他页面的样式一致性
- 考虑提取公共样式到全局样式文件
- 优化移动端响应式布局
升级指南
从 v0.4.5 升级
- 代码更新:拉取最新代码
- 前端构建:重新构建前端代码
- 测试验证:
- 测试所有管理列表页面的样式显示
- 验证工作区滚动功能
- 检查长内容页面的滚动体验
注意事项
- 此版本主要进行样式统一和滚动功能改进
- 不影响现有功能,仅改善用户体验
- 所有页面自动应用新的样式和滚动功能
- 无需修改现有代码
开发体验改进
样式规范
- 统一的样式模式,便于新页面开发
- 清晰的样式结构,易于理解和维护
- 减少样式相关的 Bug
用户体验提升
- 界面更专业,视觉一致性更好
- 滚动功能让内容访问更方便
- 适配不同内容长度的场景
致谢
感谢所有贡献者的支持和反馈!
下载地址: GitHub Releases
Full Changelog: v0.4.5...v0.4.6
v0.4.5
v0.4.5 发布说明
发布日期: 2025年1月XX日
版本概述
v0.4.5 版本主要修复了 Bug 管理页面中"指派给我"功能的显示问题,改进了 ProjectMemberSelect 组件的内部状态管理机制,确保在异步加载成员列表的场景下能够正确显示选中值。
主要更新
1. 修复"指派给我"功能显示问题 🐛
问题描述
- 问题:在 Bug 管理页面勾选"指派给我"复选框后,"指派给"下拉框没有显示当前用户
- 原因:
ProjectMemberSelect组件在成员列表异步加载完成前就设置了值,导致a-select无法正确显示选中项
修复方案
- 添加
displayValue计算属性,仅在成员列表加载完成且值在列表中时才返回modelValue - 使用
internalDisplayValue内部状态管理,通过v-model:value绑定到a-select - 添加 watch 监听
displayValue变化,同步到内部状态 - 使用
selectKey机制,在成员列表加载完成且值已设置时强制更新组件
技术细节
-
计算属性
displayValue- 检查
modelValue是否在成员列表中 - 仅在成员列表加载完成且值存在时返回
modelValue - 避免在成员列表未加载时设置值导致显示异常
- 检查
-
内部状态管理
internalDisplayValue- 使用
v-model:value双向绑定到a-select - 通过 watch 监听
displayValue变化并同步 - 确保
a-select能够正确响应值的变化
- 使用
-
强制更新机制
selectKey- 当成员列表加载完成且
modelValue已设置时,更新selectKey - 触发
a-select重新渲染,确保选中值正确显示
- 当成员列表加载完成且
2. 优化 ProjectMemberSelect 组件 🔧
改进内容
- 移除不可靠的延迟机制:移除了
setTimeout等时间延迟方案 - 使用属性传递:通过计算属性和 watch 确保值正确传递
- 改进时序控制:确保在成员列表加载完成后再显示选中值
优势
- 更可靠的显示机制,不依赖时间延迟
- 更好的响应式更新,自动处理异步加载场景
- 代码更清晰,逻辑更易维护
3. 改进用户体验 ✨
功能改进
- 即时反馈:勾选"指派给我"后,下拉框立即显示当前用户
- 错误提示:如果当前用户不是项目成员,显示友好提示
- 状态同步:取消勾选时,自动清空下拉框选择
技术实现
核心改进
-
计算属性设计
const displayValue = computed(() => { if (props.modelValue === undefined) return undefined if (members.value.length === 0) return undefined const valueExists = Array.isArray(props.modelValue) ? props.modelValue.every(v => members.value.some(m => m.user_id === v)) : members.value.some(m => m.user_id === props.modelValue) return valueExists ? props.modelValue : undefined })
-
内部状态同步
const internalDisplayValue = ref<number | number[] | undefined>(undefined) watch(displayValue, (newValue) => { if (newValue !== internalDisplayValue.value) { internalDisplayValue.value = newValue } }, { immediate: true })
-
强制更新机制
watch(() => members.value, (newMembers) => { if (newMembers.length > 0 && props.modelValue !== undefined && !loading.value) { const valueExists = /* 检查值是否在列表中 */ if (valueExists) { nextTick(() => { selectKey.value++ }) } } })
前端修改
-
ProjectMemberSelect 组件(
frontend/src/components/ProjectMemberSelect.vue)- 添加
displayValue计算属性 - 添加
internalDisplayValue内部状态 - 添加
selectKey强制更新机制 - 添加 watch 监听
displayValue和成员列表变化 - 使用
v-model:value绑定到a-select
- 添加
-
Bug 管理页面(
frontend/src/views/bug/Bug.vue)- 优化
handleAssignToMeChange函数 - 移除不必要的延迟逻辑
- 改进错误处理和用户提示
- 优化
问题修复详情
修复前的问题
- 勾选"指派给我"后,下拉框显示为空
- 即使
assignee_id已正确设置,UI 上无法看到选中状态 - 用户体验不佳,需要手动在下拉框中选择
修复后的效果
- 勾选"指派给我"后,下拉框立即显示当前用户
- 选中状态正确同步到 UI
- 取消勾选时,下拉框自动清空
- 如果用户不是项目成员,显示友好提示
测试验证
测试场景
- ✅ 勾选"指派给我"后,下拉框显示当前用户
- ✅ 取消勾选"指派给我"后,下拉框清空
- ✅ 当前用户不是项目成员时,显示提示并取消勾选
- ✅ 未选择项目时,提示先选择项目
- ✅ 成员列表异步加载完成后,值正确显示
测试结果
- 所有测试场景通过
- 用户体验显著改善
- 无回归问题
更新内容
修改文件
前端:
frontend/src/components/ProjectMemberSelect.vue- 改进内部状态管理机制frontend/src/views/bug/Bug.vue- 优化"指派给我"功能处理逻辑
代码质量改进
可靠性提升
- 改进前:依赖时间延迟,不可靠
- 改进后:使用计算属性和 watch,响应式更新
- 优势:更可靠,不依赖时间因素
代码清晰度
- 改进前:使用
setTimeout等延迟机制,逻辑不清晰 - 改进后:使用 Vue 响应式机制,逻辑清晰
- 优势:代码更易理解和维护
性能优化
- 移除了不必要的延迟等待
- 使用计算属性缓存计算结果
- 仅在必要时触发组件更新
已知问题
无
后续计划
- 在其他使用
ProjectMemberSelect组件的场景中验证类似问题 - 继续优化组件的性能和用户体验
- 考虑添加更多测试用例确保稳定性
升级指南
从 v0.4.4 升级
- 代码更新:拉取最新代码
- 前端构建:重新构建前端代码
- 测试验证:
- 测试 Bug 管理页面的"指派给我"功能
- 验证下拉框正确显示选中值
- 测试各种边界情况
注意事项
- 此版本主要修复显示问题,不影响现有功能
- 所有使用
ProjectMemberSelect组件的场景都会受益于此修复 - 无需修改现有代码,自动生效
开发体验改进
问题排查改进
- 添加了详细的日志输出(开发环境)
- 更容易定位异步加载相关的问题
- 代码逻辑更清晰,便于调试
组件稳定性
- 更好的处理异步加载场景
- 更可靠的响应式更新机制
- 减少因时序问题导致的显示异常
致谢
感谢所有贡献者的支持和反馈!
下载地址: GitHub Releases
v0.4.0
发布日期: 2025年11月27日
主要功能
-
历史记录功能
- 为项目、需求、任务、Bug、版本详情页面添加操作历史记录
- 自动记录操作(创建、编辑、分配、解决等)
- 字段变更追踪(旧值 → 新值)
- 支持手动添加备注
- 历史记录可折叠展开
-
编辑模态框优化
- 详情页面“编辑”按钮直接弹出编辑模态框
- 无需跳转页面即可编辑
- 支持 Markdown 编辑器中的图片上传
- 编辑完成后自动刷新
-
滚动问题修复
- 修复所有详情页面的滚动问题
- 统一滚动样式和布局
- 适配不同屏幕尺寸
技术实现
后端:
- 新增
Action和History数据模型 - 历史记录工具函数(
action.go) - 新增历史记录 API 接口
前端:
- 使用时间线组件展示历史记录
- 统一的编辑模态框组件
- 滚动样式优化
使用指南
- 查看历史记录:进入详情页面,在底部查看“历史记录”卡片
- 添加备注:点击历史记录卡片标题右侧的“添加备注”按钮
- 编辑详情:点击页面顶部的“编辑”按钮,在弹出的模态框中编辑
升级指南
从 v0.3.0 升级:
- 数据库会自动创建
actions和histories表 - 需要重新构建前端并部署
- 无破坏性变更,所有现有功能保持不变