zjrs-jeecgBoot/jeecgboot-vue3/修改记录-见习人员模块改造.md

见习人员模块前端改造修改记录

修改日期：2026-06-04

修改说明

参照重点关注人员模块（focuspersonnel），对见习人员模块（internshippersonnel）的两个前端Vue组件进行改造。

---

文件1：InternshipPersonnelModal.vue

文件路径： src/views/internshippersonnel/components/InternshipPersonnelModal.vue

改造内容

1. 区分详情模式和编辑模式：新增 isDetailMode 和 currentRecord 状态变量
2. 详情模式显示 InternshipPersonnelDetail 组件：当 isDetailMode 为 true 时，展示详情组件
3. 编辑模式显示 InternshipPersonnelForm 组件：当 isDetailMode 为 false 时，展示表单组件
4. 导入 InternshipPersonnelDetail 组件
5. 新增 detail 方法：独立入口，设置详情模式并传递 record
6. 改造 add 方法：设置 isDetailMode = false，标题改为"新增见习人员"
7. 改造 edit 方法：设置 isDetailMode = false，标题改为"编辑见习人员"，通过 currentRecord 传递数据
8. 改造 handleOk 方法：详情模式下直接关闭弹窗
9. 改造 footer 模板：详情模式显示"关闭"按钮，编辑模式显示"取消"和"确认"按钮
10. defineExpose 增加 detail 方法暴露
11. 宽度从800调整为900，maxHeight从500px调整为700px

关键代码变更

• 模板中增加 v-if="isDetailMode" 条件渲染
• 新增 InternshipPersonnelDetail 组件导入
• 新增 isDetailMode、currentRecord 响应式变量
• 新增 detail(record) 方法

---

文件2：InternshipPersonnelList.vue

文件路径： src/views/internshippersonnel/InternshipPersonnelList.vue

改造内容

1. 新增导入

• useDict：从 /@/hooks/dictionary/useDict 导入，用于加载字典数据
• InternshipPersonnelServiceFollowList：服务跟进弹窗组件
• batchUpdateCustomTag：从 api 文件导入批量更新自定义标签接口
• computed、onMounted：从 vue 导入

2. 字典数据加载

• 使用 useDict(['internship_custom_tag']) 加载自定义标签字典
• customTagOptions 计算属性：提供标签下拉选项

3. 查询区域新增

• 新增"自定义标签"查询条件（使用字典下拉选项）

4. 操作栏改造

• getTableAction：增加"查看"按钮（调用 handleDetail），保留"编辑"按钮
• getDropDownAction：增加"服务跟进"按钮（调用 handleServiceFollow），保留"删除"按钮
• 操作列宽度从120调整为300

5. 新增功能方法

• handleDetail(record)：调用 registerModal.value?.detail(record) 打开详情弹窗
• handleServiceFollow(record)：打开服务跟进弹窗
• handleCustomTag()：批量添加自定义标签（需先选中数据）
• closeBatchTagModal()：关闭批量标签弹窗
• handleBatchTagSubmit()：提交批量标签

6. 新增状态变量

• batchTagVisible：批量标签弹窗可见性
• batchTagSaving：批量标签保存中状态
• batchTagChecked：批量标签选中项
• serviceFollowVisible：服务跟进弹窗可见性
• serviceFollowRecord：服务跟进当前记录

7. 模板新增

• bodyCell 插槽中增加 customTag 列的字典翻译显示（a-tag 标签展示）
• 批量添加自定义标签弹窗（a-modal）
• 服务跟进记录弹窗（InternshipPersonnelServiceFollowList）
• tableTitle 区域增加"自定义标签"按钮

8. 样式新增

• .batch-tag-modal：批量标签弹窗样式（与重点关注人员模块一致）

9. handleAdd/handleEdit/handleDetail 方法改造

• handleAdd：改为调用 registerModal.value?.add()（不再手动设置 disableSubmit）
• handleEdit：改为调用 registerModal.value?.edit(record)
• handleDetail：改为调用 registerModal.value?.detail(record)

10. handleSuccess 修复

• 原代码 (selectedRowKeys.value = []) && reload() 改为正确的 selectedRowKeys.value = []; reload();

---

依赖说明

需要的组件文件（尚未创建，需后续补充）

1. src/views/internshippersonnel/components/InternshipPersonnelDetail.vue - 见习人员详情组件
2. src/views/internshippersonnel/components/InternshipPersonnelServiceFollowList.vue - 服务跟进记录弹窗组件

API 文件已具备

src/views/intshippersonnel/InternshipPersonnel.api.ts 已包含：

• batchUpdateCustomTag - 批量更新自定义标签
• listCustomTags - 获取自定义标签列表
• queryDetailById - 查询详情
• listServiceFollow - 查询服务跟进记录
• addServiceFollow - 新增服务跟进
• editServiceFollow - 编辑服务跟进
• deleteServiceFollow - 删除服务跟进

字典依赖

• internship_custom_tag - 见习人员自定义标签字典（需在后端 DICTIONARY_ITEM 表中配置）

---

第二次修改日期：2026-06-04

修改说明

参照重点关注人员模块（FocusPersonnel），补齐见习人员管理模块的功能，包括列表新增列、查询条件、按钮、表单字段、详情字段、权限控制等。

---

文件1：InternshipPersonnel.data.ts

文件路径： src/views/internshippersonnel/InternshipPersonnel.data.ts

改造内容

1. 在"性别"列之后添加"年龄"列：dataIndex 为 age
2. 在"学历"列之后添加三个列：
   • "户口所在地"列：dataIndex 为 householdLocation
   • "现居住地"列：dataIndex 为 currentResidence
   • "求职人员类别"列：dataIndex 为 jobSeekerCategory
3. 在"联系电话"列之后添加"求职状态"列：dataIndex 为 jobSearchStatus
4. 在"自定义标签"列之前添加两个列：
   • "人员大类标签"列：dataIndex 为 majorTag
   • "人员小类标签"列：dataIndex 为 minorTag

---

文件2：InternshipPersonnelList.vue

文件路径： src/views/internshippersonnel/InternshipPersonnelList.vue

改造内容

1. 查询区域新增查询条件（在见习岗位之后、自定义标签之前）

• 性别：下拉选择（男性/女性）
• 学历：下拉选择（博士研究生/硕士研究生/大学本科/大学专科/中专/高中/初中及以下）
• 户口所在地：输入框
• 现居住地：输入框
• 年龄范围：两个数字输入框（ageBegin 和 ageEnd）
• 大类标签：下拉选择，使用 majorTagOptions（internship_major_tag 字典）
• 小类标签：下拉选择，使用 minorTagOptions（internship_minor_tag 字典）
• 就业状态：下拉选择（正在求职/暂不求职/已就业/已入职）

2. 顶部按钮区域新增

• "推送消息"按钮：在自定义标签按钮之后添加，点击调用 handleMessagePush

3. bodyCell 插槽新增字典翻译

• majorTag 列：使用 getDictText('internship_major_tag', text) 翻译
• minorTag 列：使用 getDictText('internship_minor_tag', text) 翻译

4. 操作栏新增

• "岗位推送"按钮：在查看按钮之后添加，点击调用 handleJobPush

5. useDict 字典加载扩展

• 从 useDict(['internship_custom_tag']) 改为 useDict(['internship_major_tag', 'internship_minor_tag', 'internship_custom_tag'])
• 新增 majorTagOptions 计算属性
• 新增 minorTagOptions 计算属性

6. 新增函数

• handleJobPush(record)：岗位推送占位函数，提示"岗位推送功能待开发"
• handleMessagePush()：推送消息占位函数，提示"推送消息功能待开发"

7. searchReset 方法修改

• 新增手动清空 queryParam.ageBegin 和 queryParam.ageEnd（年龄范围不在表单管控范围内）

---

文件3：InternshipPersonnelForm.vue

文件路径： src/views/internshippersonnel/components/InternshipPersonnelForm.vue

改造内容

1. 新增导入

• JDictSelectTag：从 /@/components/Form/src/jeecg/components/JDictSelectTag.vue 导入

2. 表单字段新增

• 人员大类标签：在"关联个人信息"之后、"关联见习岗位"之前，使用 JDictSelectTag 组件，dictCode 为 internship_major_tag
• 人员小类标签：在"人员大类标签"之后、"关联见习岗位"之前，使用 JDictSelectTag 组件，dictCode 为 internship_minor_tag
• 自定义标签：在"审核意见"之后，使用 a-input 输入框

3. formData 新增字段

• majorTag: ''
• minorTag: ''
• customTag: ''

---

文件4：InternshipPersonnelDetail.vue

文件路径： src/views/internshippersonnel/components/InternshipPersonnelDetail.vue

改造内容

1. header 标签区域新增

• majorTag 标签显示：使用 getDictText('internship_major_tag', detailData.majorTag) 翻译，蓝色标签
• minorTag 标签显示：使用 getDictText('internship_minor_tag', detailData.minorTag) 翻译，绿色标签

2. 个人信息区域新增字段

• 年龄：在"出生日期"之后，显示 detailData.age + '岁'
• 邮箱：在"联系电话"之后，dataIndex 为 email
• QQ号码：在"邮箱"之后，dataIndex 为 qqNumber
• 微信号：在"QQ号码"之后，dataIndex 为 wechatId

3. 标签信息区域新增

• 在个人信息区域和自定义标签区域之间新增"标签信息"区域
• 人员大类标签：使用 getDictText('internship_major_tag', detailData.majorTag) 翻译，a-tag 展示
• 人员小类标签：使用 getDictText('internship_minor_tag', detailData.minorTag) 翻译，a-tag 展示

4. useDict 字典加载扩展

• 从 useDict(['internship_custom_tag']) 改为 useDict(['internship_major_tag', 'internship_minor_tag', 'internship_custom_tag'])

---

文件5：InternshipPersonnelServiceFollowList.vue

文件路径： src/views/internshippersonnel/components/InternshipPersonnelServiceFollowList.vue

改造内容

1. "新增服务记录"按钮添加权限控制

• 按钮添加 v-if="hasServiceFollowAuth" 条件，仅拥有权限的用户可见

2. 新增导入

• computed：从 vue 导入
• usePermissionStore：从 /@/store/modules/permission 导入

3. 新增权限判断逻辑

• permissionStore：使用 usePermissionStore() 获取权限 store
• hasServiceFollowAuth：计算属性，判断权限列表中是否包含 internship_personnel:serviceFollow

---

新增字典依赖

• internship_major_tag - 见习人员大类标签字典（需在后端 DICTIONARY_ITEM 表中配置）
• internship_minor_tag - 见习人员小类标签字典（需在后端 DICTIONARY_ITEM 表中配置）

新增权限依赖

• internship_personnel:serviceFollow - 服务跟进新增权限（需在后端权限表中配置）