135 lines
4.1 KiB
Markdown
135 lines
4.1 KiB
Markdown
|
# 企业岗位图片功能完整验证报告
|
|||
|
|
|
|||
|
|
## ✅ 已修复的5个关键数据路径
|
|||
|
|
|
|||
|
|
### 路径1：未投递岗位 → 岗位详情
|
|||
|
|
**数据流**：`companyJobsNew.json` → `transformCompanyJobs` → `companyPositions` → `JobList` → `JobInfoModal`
|
|||
|
|
|
|||
|
|
**修改点**：
|
|||
|
|
1. ✅ `src/data/mockData.js` - transformCompanyJobs函数（第165-166行）
|
|||
|
|
2. ✅ `src/pages/CompanyJobsPage/components/JobInfoModal/index.jsx` - UI组件
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
### 路径2：面试状态岗位 → 数据转换
|
|||
|
|
**数据流**：`interviewStatus.json` → `transformInterviewStatus` → `interviewStatus` → ...
|
|||
|
|
|
|||
|
|
**修改点**：
|
|||
|
|
1. ✅ `src/data/mockData.js` - transformInterviewStatus函数（第50-52行，第101行）
|
|||
|
|
```javascript
|
|||
|
|
const positionName = status["查询岗位名称"];
|
|||
|
|
const companyImages = companyImagesMap[positionName] || [];
|
|||
|
|
|
|||
|
|
job: {
|
|||
|
|
...
|
|||
|
|
companyImages: companyImages
|
|||
|
|
}
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
### 路径3：面试状态岗位 → 岗位列表显示
|
|||
|
|
**数据流**：`interviewStatus` → `CompanyJobsPage.deliveredJobs` → `JobList`
|
|||
|
|
|
|||
|
|
**修改点**：
|
|||
|
|
1. ✅ `src/pages/CompanyJobsPage/index.jsx` - deliveredJobs映射（第89行）
|
|||
|
|
```javascript
|
|||
|
|
companyImages: jobData.companyImages || []
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
### 路径4：面试状态岗位 → 列表点击详情
|
|||
|
|
**数据流**：`deliveredJobs` → `JobList.handleJobClick` → `JobInfoModal`
|
|||
|
|
|
|||
|
|
**修改点**：
|
|||
|
|
1. ✅ `src/pages/CompanyJobsPage/components/JobList/index.jsx` - handleJobClick函数（第41行）
|
|||
|
|
```javascript
|
|||
|
|
details: {
|
|||
|
|
...
|
|||
|
|
companyImages: item.companyImages || []
|
|||
|
|
}
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
### 路径5：面试状态板块 → 卡片点击详情 ⭐ **最新修复**
|
|||
|
|
**数据流**：`interviews` → `InterviewStatusDropdown` → `CompanyJobsPage.handleJobCardClick` → `JobInfoModal`
|
|||
|
|
|
|||
|
|
**修改点**：
|
|||
|
|
1. ✅ `src/pages/CompanyJobsPage/index.jsx` - handleJobCardClick函数（第247行）
|
|||
|
|
```javascript
|
|||
|
|
details: {
|
|||
|
|
description: item.job.description || "",
|
|||
|
|
requirementsText: item.job.requirements || "",
|
|||
|
|
companyInfo: item.job.companyInfo || "",
|
|||
|
|
companyImages: item.job.companyImages || [] // 新增
|
|||
|
|
}
|
|||
|
|
```
|
|||
|
|
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
## 📊 完整修改文件列表
|
|||
|
|
|
|||
|
|
| 文件 | 修改次数 | 说明 |
|
|||
|
|
|------|---------|------|
|
|||
|
|
| src/data/mockData.js | 3处 | 导入图片数据、transformCompanyJobs、transformInterviewStatus |
|
|||
|
|
| src/pages/CompanyJobsPage/index.jsx | 2处 | deliveredJobs映射、handleJobCardClick |
|
|||
|
|
| src/pages/CompanyJobsPage/components/JobList/index.jsx | 1处 | handleJobClick函数 |
|
|||
|
|
| src/pages/CompanyJobsPage/components/JobInfoModal/index.jsx | 多处 | UI组件和图片预览 |
|
|||
|
|
| src/pages/CompanyJobsPage/components/JobInfoModal/index.css | 多处 | 图片网格和预览样式 |
|
|||
|
|
|
|||
|
|
## 🎯 覆盖的所有场景
|
|||
|
|
|
|||
|
|
### 场景1：未投递岗位
|
|||
|
|
- ✅ 点击岗位卡片查看详情
|
|||
|
|
- ✅ 点击"立即投递"查看详情
|
|||
|
|
- ✅ 企业图片正常显示
|
|||
|
|
|
|||
|
|
### 场景2：已投递岗位（在岗位列表中）
|
|||
|
|
- ✅ 点击岗位卡片查看详情
|
|||
|
|
- ✅ 企业图片正常显示
|
|||
|
|
|
|||
|
|
### 场景3：面试状态板块
|
|||
|
|
- ✅ 点击面试状态卡片查看详情 ⭐ **最新修复**
|
|||
|
|
- ✅ 企业图片正常显示
|
|||
|
|
|
|||
|
|
### 场景4：图片预览
|
|||
|
|
- ✅ 点击图片全屏预览
|
|||
|
|
- ✅ 左右切换图片
|
|||
|
|
- ✅ 显示图片计数
|
|||
|
|
- ✅ 关闭预览
|
|||
|
|
|
|||
|
|
## 📈 数据统计
|
|||
|
|
|
|||
|
|
- **总岗位数**：35个
|
|||
|
|
- **有图片岗位**：24个（100%支持显示）
|
|||
|
|
- 未投递岗位中：17个有图片
|
|||
|
|
- 面试状态岗位中：7个有图片
|
|||
|
|
- **无图片岗位**：11个（数据源中本就没有）
|
|||
|
|
|
|||
|
|
## ✨ 验证方法
|
|||
|
|
|
|||
|
|
### 验证未投递岗位
|
|||
|
|
1. 打开企业内推岗位页面
|
|||
|
|
2. 点击"PLC控制工程师"（6张图片）
|
|||
|
|
3. 滚动到公司介绍，查看图片网格
|
|||
|
|
4. 点击任意图片，验证全屏预览
|
|||
|
|
|
|||
|
|
### 验证面试状态岗位
|
|||
|
|
1. 查看右侧"岗位面试状态"板块
|
|||
|
|
2. 点击"Rhino建模师"卡片（6张图片）
|
|||
|
|
3. 在弹窗中滚动到公司介绍
|
|||
|
|
4. 验证图片显示和预览功能
|
|||
|
|
|
|||
|
|
### 验证已投递岗位（在列表中）
|
|||
|
|
1. 岗位列表中有"已投递"标签的岗位
|
|||
|
|
2. 点击查看详情
|
|||
|
|
3. 验证图片显示
|
|||
|
|
|
|||
|
|
## 🎉 最终状态
|
|||
|
|
|
|||
|
|
**所有5个数据路径已全部打通！**
|
|||
|
|
|
|||
|
|
所有24个有图片数据的岗位，无论从哪个入口点击，都能正确显示企业图片。
|