代码调整记录 - 2025-01-01 - system

2025-01-01 23:xx:xx - 学生信息管理表单只读字段优化

变更内容

优化学生信息新增/编辑表单中自动填充字段的显示效果，将从班级信息自动填充的字段设置为只读状态。

修改文件

web/src/views/studentMsg/studentMsg/index.vue

具体修改

班级信息相关字段设置为disabled状态：
- 班级名称 (className) - 改为disabled
- 学院名称 (collegeName) - 改为disabled
- 专业名称 (majorName) - 改为disabled
- 班主任姓名 (classTeacherName) - 改为disabled
学籍信息相关字段设置为disabled状态：
- 学历层次 (academicLevel) - 改为disabled
- 年级 (grade) - 改为disabled
- 入学年份 (enrollmentYear) - 改为disabled
- 学制 (schoolSystem) - 改为disabled

变更原因

这些字段在新增学生时从选中的班级信息自动填充
设置为disabled状态可以明确告知用户这些字段是自动填充的
防止用户误操作导致数据不一致
提供更好的用户体验，明确区分可编辑和不可编辑字段

技术影响

提升表单的用户体验
确保数据一致性
视觉上明确区分自动填充字段和手动输入字段

测试要点

新增学生时，从班级树选择班级后，相关字段应正确填充且显示为disabled状态
编辑学生时，这些字段应保持可编辑状态（因为可能需要修正数据）

📋 变更概览

日期: 2025-01-01
操作员: system
变更类型: 功能优化
影响模块: 学工管理-学生信息管理

🎯 本次变更

2025-01-01 12:30:00 - 学生信息管理页面新增按钮条件显示

变更文件:

web/src/views/studentMsg/studentMsg/index.vue

变更内容:

新增响应式变量:
- 添加 currentSelectedNode 用于存储当前选中的部门节点信息
新增计算属性:
- 添加 showAddButton 计算属性，判断是否显示新增按钮
- 判断逻辑：只有当 deptCategory 以 "bj-" 开头时才显示新增按钮
修改节点点击事件:
- 在 handleNodeClick 方法中保存当前选中的节点信息到 currentSelectedNode
修改新增按钮显示:
- 在新增按钮的 el-col 组件上添加 v-if="showAddButton" 条件
修改重置操作:
- 在 resetQuery 方法中清空 currentSelectedNode 以隐藏新增按钮

技术实现:

// 1. 导入 computed 函数
import { getCurrentInstance, ref, reactive, toRefs, watchEffect, onMounted, computed } from 'vue';

// 2. 新增变量和计算属性
const currentSelectedNode = ref<any>(null);
const showAddButton = computed(() => {
  if (!currentSelectedNode.value) {
    return false;
  }
  return currentSelectedNode.value.deptCategory && currentSelectedNode.value.deptCategory.startsWith('bj-');
});

// 3. 修改模板
<el-col :span="1.5" v-if="showAddButton">
  <el-button type="primary" plain icon="Plus" @click="handleAdd()">新增</el-button>
</el-col>

业务价值:

🎯 权限控制: 确保只有在班级节点才能新增学生，符合业务逻辑
🔒 数据安全: 防止在错误的组织层级下创建学生数据
👥 用户体验: 清晰的界面提示，避免用户在非班级节点进行无效操作
📊 数据完整性: 确保学生数据与正确的班级关联

测试建议:

点击非班级节点，确认新增按钮隐藏
点击班级节点（deptCategory 以 bj- 开头），确认新增按钮显示
执行重置操作，确认新增按钮隐藏
测试新增学生功能正常

📝 技术规范遵循

✅ 前端开发规范: 遵循 Vue 3 Composition API 规范
✅ 响应式设计: 使用 computed 实现响应式显示逻辑
✅ 代码清洁: 添加详细注释说明业务逻辑
✅ 用户体验: 条件显示提升界面友好性

🔗 相关文档

前端开发规范: .cursor/cursorrules-frontend.md
学生信息管理API: docs/开发文档/API/学生信息管理API.md
项目规范总览: .cursor/rules.md

4.1 KiB Raw Blame History Unescape Escape