121 lines
5.3 KiB
Markdown
121 lines
5.3 KiB
Markdown
# 已修复缺陷与技术方案 (Fixed Issues)
|
||
|
||
本文件详细记录本次稳定化清扫中完成修复的具体代码改动、设计权衡与回归验证结果。
|
||
|
||
---
|
||
|
||
## 修复清单
|
||
|
||
### 1. 修复侧边栏空白路由与无可见子项目录渲染 (BUG-01 & BUG-02)
|
||
|
||
- **涉及文件**:
|
||
- `build_ui/src/router/index.js`
|
||
- `build_ui/src/layout/components/Sidebar/SidebarItem.vue`
|
||
- **代码改动**:
|
||
1. 在 `build_ui/src/router/index.js` 中,为 `/train` 顶层 Layout 路由显式指定 `hidden: true`:
|
||
```javascript
|
||
{
|
||
path: '/train',
|
||
component: Layout,
|
||
hidden: true,
|
||
redirect: '/train/auth',
|
||
children: [ ... ]
|
||
}
|
||
```
|
||
2. 在 `build_ui/src/layout/components/Sidebar/SidebarItem.vue` 中重构显示判定逻辑:
|
||
- 增加 `isMenuVisible(item)`:若目录的所有子项均为 `hidden` 且父级路由为纯 Layout 容器 (`component === 'Layout'` 或 `redirect === 'noRedirect'`),则直接隐藏该父级目录;
|
||
- 增加 `hasShowingChildren(children)`:严格检查子数组中是否存在未隐藏项目;
|
||
- 修改 `<el-submenu>` 渲染条件为 `v-else-if="hasShowingChildren(item.children) && item.meta && item.meta.title"`,并在 `template slot="title"` 中确保仅在存在有效标题时输出标题;
|
||
- 修改单项路由条件,避免子项全部隐藏时因 `alwaysShow: true` 强行展开空目录。
|
||
- **验证结果**:
|
||
- Admin 端:“首页”与“人员管理”之间的空白箭头彻底消除;“教学成果”不再渲染空折叠项。
|
||
- Teacher 端与 Student 端:侧边栏清爽规范,仅保留“首页”与各自对应的专属业务工作台。
|
||
|
||
---
|
||
|
||
### 2. 修复用户管理页面重置操作 TypeError 异常及右侧布局留白 (BUG-03)
|
||
|
||
- **涉及文件**:
|
||
- `build_ui/src/views/system/user/index.vue`
|
||
- **代码改动**:
|
||
1. 修复空指针:由于部门树 `<el-tree ref="tree">` 被前端注释保留,但在脚本中存在调用,因此对 `this.$refs.tree` 增加了安全判空:
|
||
```javascript
|
||
// watch.deptName
|
||
deptName(val) {
|
||
if (this.$refs.tree) {
|
||
this.$refs.tree.filter(val);
|
||
}
|
||
}
|
||
|
||
// methods.resetQuery
|
||
resetQuery() {
|
||
this.dateRange = [];
|
||
this.resetForm("queryForm");
|
||
this.queryParams.deptId = undefined;
|
||
if (this.$refs.tree) {
|
||
this.$refs.tree.setCurrentKey(null);
|
||
}
|
||
this.handleQuery();
|
||
}
|
||
```
|
||
2. 修复栅格间隙:将表格外层 `<el-col :span="20" :xs="24">` 调整为 `<el-col :span="24">`,使表格和检索栏铺满整个右侧视口,消除此前右侧 1/6 的空白不对称现象。
|
||
- **验证结果**:
|
||
- 在用户管理页面输入条件并点击“重置”按钮,控制台 0 异常,数据列表平滑刷新重置,表格填满 24 栅格宽度。
|
||
|
||
---
|
||
|
||
### 3. 规范学员/教师全链路性别代码转义展示 (BUG-04)
|
||
|
||
- **涉及文件**:
|
||
- `build_ui/src/views/train/student/index.vue`
|
||
- `build_ui/src/views/train/teacher/index.vue`
|
||
- `build_ui/src/views/train/me/student/index.vue`
|
||
- `build_ui/src/views/train/me/teacher/index.vue`
|
||
- **代码改动**:
|
||
统一编写并复用 `formatGender` 转义逻辑:
|
||
```javascript
|
||
formatGender(gender) {
|
||
if (gender === '0' || gender === 0 || gender === '男') return '男';
|
||
if (gender === '1' || gender === 1 || gender === '女') return '女';
|
||
return gender || '未知';
|
||
}
|
||
```
|
||
并将表格中的静态绑定 `<el-table-column prop="sGender" />` 替换为具名插槽模板渲染 `<template slot-scope="scope"><span>{{ formatGender(scope.row.sGender) }}</span></template>`。
|
||
- **验证结果**:
|
||
- `/person/student` 列表所有行性别规范显示为“男”或“女”;
|
||
- `/student` 学员中心基本资料性别显示为“女”;
|
||
- `/person/teacher` 与 `/teacher` 均完成空值与代码回退兼容。
|
||
|
||
---
|
||
|
||
### 4. 优化教师工作台任教培训班数据对齐与状态呈现 (BUG-05)
|
||
|
||
- **涉及文件**:
|
||
- `build_ui/src/views/train/me/teacher/index.vue`
|
||
- **代码改动**:
|
||
1. 状态列字段容错:`<el-tag size="mini" :type="formatPlanStatusType(scope.row.planStatus != null ? scope.row.planStatus : scope.row.status)">{{ formatPlanStatusText(scope.row.planStatus != null ? scope.row.planStatus : scope.row.status) }}</el-tag>`
|
||
2. 日期格式化:使用内置 `parseTime(scope.row.startDate || scope.row.startTime, '{y}-{m}-{d}')`;
|
||
3. 扩充状态字典:
|
||
```javascript
|
||
formatPlanStatusText(status) {
|
||
const map = {
|
||
0: '未开班', '0': '未开班',
|
||
1: '培训中', '1': '培训中',
|
||
2: '已结训', '2': '已结训',
|
||
3: '已取消', '3': '已取消'
|
||
};
|
||
return map[status] || '未知';
|
||
}
|
||
```
|
||
- **验证结果**:
|
||
- 教师工作台“我的培训班”列表中,各班级状态统一精准渲染为“未开班”绿色/灰色徽章,开班时间格式化为有效标准日期,彻底杜绝了“未知”状态。
|
||
|
||
---
|
||
|
||
### 5. 编译代理增强 (开发态验证工具)
|
||
|
||
- **涉及文件**:
|
||
- `build_ui/vue.config.js`
|
||
- **代码改动**:
|
||
在 `devServer.proxy` 的 `pathRewrite` 中增加对 `process.env.VUE_APP_BACKEND_PATH` 的支持,使得本地开发服务器在直连远程 Nginx 共享试用环境时,可灵活重写为 `/prod-api`,确保本地前后端联调测试真实生效。
|