# 员工信息维护与招聘信息管理正式化外壳实施记录

## 变更日期

- 2026-04-29

## 变更范围

- 前端：`ruoyi-ui/src/views/ccdiBaseStaff/index.vue`
- 前端：`ruoyi-ui/src/views/ccdiStaffRecruitment/index.vue`
- 单测：`ruoyi-ui/tests/unit/base-staff-formal-shell-layout.test.js`
- 单测：`ruoyi-ui/tests/unit/staff-recruitment-formal-shell-layout.test.js`

## 实施内容

### 1. 页面外壳调整

- 复用 `app-container`、`query-form`、`mb8` 等现有结构，只补最少样式。
- 为 `ccdiBaseStaff` 与 `ccdiStaffRecruitment` 的查询区增加正式化外壳视觉，包括浅底、边框、留白和输入框边线统一。
- 保持搜索、重置、新增、导入、失败记录等按钮原有顺序不变。
- 为两个页面新增 `formal-table-shell`，将表格和分页收口到同一视觉区域内。

### 2. 弹窗外壳调整

- 复用员工页已有 `employee-edit-dialog`、`employee-detail-dialog` class，只调整弹窗圆角、标题分隔线和弹窗正文背景。
- 复用招聘页现有弹窗结构，只补统一的弹窗标题区和正文背景样式。
- 未改动员工资产、历史工作经历等内部功能块结构。

### 3. 验证情况

- 单测通过：
  - `node tests/unit/base-staff-formal-shell-layout.test.js`
  - `node tests/unit/staff-recruitment-formal-shell-layout.test.js`
  - `node tests/unit/staff-recruitment-import-toolbar.test.js`
- 现有单测异常：
  - `node tests/unit/employee-asset-maintenance-layout.test.js`
  - 失败原因为当前仓库源码不满足既有字符串断言 `createEmptyAssetRow(defaultPersonId = "")`，与本次外壳样式改动无关。
- 浏览器验证：
  - 已使用 `browser-use` 打开 `http://localhost/prototype/staff-recruitment`，确认招聘信息管理页查询区、工具条、表格区已切换为正式化外壳，按钮仍保持原位。
  - 尝试打开 `http://localhost/ccdiBaseStaff` 时，当前本地前端路由返回 404 页面，因此未能在浏览器内完成员工信息维护页真实页面验证。