ALL-teach_sys/frontend_交通物流/隐藏投递按钮和剩余量验证.md

隐藏投递按钮和岗位剩余量显示逻辑修复

需求

将已过期、已投递岗位和岗位面试状态中所有岗位的岗位详情页面的岗位剩余招聘量和"立即投递"按钮都不展示。

修改内容

1. JobInfoModal 组件 (已完成)

文件: src/pages/CompanyJobsPage/components/JobInfoModal/index.jsx

岗位剩余量显示逻辑 (第299-309行)：

{/* 岗位剩余量 - 仅未投递、未过期且非面试状态岗位显示 */}
{!data?.isDelivered &&
 !data?.isExpired &&
 data?.status !== 'expired' &&
 !hideDeliverButton &&
 data?.remainingPositions && (
  <span className="job-remaining-positions">
    <i className="warning-icon">!</i>
    岗位招聘数量仅剩{data?.remainingPositions}名
  </span>
)}

立即投递按钮显示逻辑 (第400-412行)：

{/* 立即投递按钮 - 仅未投递、未过期且非面试状态岗位显示 */}
{!data?.isDelivered &&
 !data?.isExpired &&
 data?.status !== 'expired' &&
 !hideDeliverButton && (
  <div
    className="job-info-modal-btn"
    onClick={handleClickDeliverBtn}
  >
    <i />
    <span>立即投递</span>
  </div>
)}

2. JobList 组件 (本次修改)

文件: src/pages/CompanyJobsPage/components/JobList/index.jsx

备份: index.jsx.backup_[timestamp]

修改1: 未投递岗位点击处理 (第50-78行)

修改前：

const fullJobData = getJobByPosition(item.position);
if (fullJobData) {
  setJobInfoData(fullJobData);  // 没有传递过期状态
}

修改后：

const fullJobData = getJobByPosition(item.position);
if (fullJobData) {
  // 传递岗位数据时，保留原始item中的过期状态
  setJobInfoData({
    ...fullJobData,
    isExpired: item.isExpired,
    status: item.status
  });
}

修改2: 投递按钮点击处理 (第86-123行)

修改前：

const fullJobData = getJobByPosition(item.position);
if (fullJobData) {
  setJobInfoData(fullJobData);  // 没有传递过期状态
}

修改后：

const fullJobData = getJobByPosition(item.position);
if (fullJobData) {
  // 传递岗位数据时，保留原始item中的过期状态
  setJobInfoData({
    ...fullJobData,
    isExpired: item.isExpired,
    status: item.status
  });
}

已投递岗位点击处理 (第17-49行)

此部分已正确传递 isDelivered: true，无需修改。

3. CompanyJobsPage 组件 (已完成)

文件: src/pages/CompanyJobsPage/index.jsx

岗位面试状态点击处理 (第266-293行)：

if (item.job) {
  const jobData = {
    // ... 其他字段
  };
  setSelectedJob(jobData);
  setIsFromInterview(true); // 标记为从面试状态点击
  setJobDetailVisible(true);
}

传递给 Modal (第179行)：

<JobInfoModal
  visible={jobDetailVisible}
  onClose={() => {...}}
  data={selectedJob}
  directToResume={false}
  hideDeliverButton={isFromInterview} // 面试状态岗位隐藏投递按钮
/>

显示逻辑总结

岗位剩余量和投递按钮显示条件

显示条件 (必须同时满足所有条件)：

1. !data?.isDelivered - 不是已投递岗位
2. !data?.isExpired - 不是已过期岗位
3. data?.status !== 'expired' - 状态不是过期
4. !hideDeliverButton - 不是从面试状态点击的岗位
5. (岗位剩余量) data?.remainingPositions - 存在剩余岗位数

不同场景的数据标识

场景	isDelivered	isExpired	status	hideDeliverButton	是否显示
企业内推岗位库 - 正常岗位	false	false	-	false	✅ 显示
企业内推岗位库 - 已投递岗位	true	false	-	false	❌ 隐藏
企业内推岗位库 - 已过期岗位	false	true	'expired'	false	❌ 隐藏
岗位面试状态 - 所有岗位	-	-	-	true	❌ 隐藏

数据流追踪

1. 企业内推岗位库 - 正常岗位

用户点击 → JobList.handleJobClick →
getJobByPosition(position) + {isExpired, status} →
JobInfoModal(hideDeliverButton=false) →
检查条件 → ✅ 显示投递按钮和剩余量

2. 企业内推岗位库 - 已投递岗位

用户点击 → JobList.handleJobClick →
构造数据 {isDelivered: true} →
JobInfoModal(hideDeliverButton=false) →
检查条件 (!isDelivered = false) → ❌ 隐藏

3. 企业内推岗位库 - 已过期岗位

用户点击 → JobList.handleJobClick →
getJobByPosition(position) + {isExpired: true, status: 'expired'} →
JobInfoModal(hideDeliverButton=false) →
检查条件 (!isExpired = false) → ❌ 隐藏

4. 岗位面试状态 - 所有岗位

用户点击 → CompanyJobsPage.handleJobCardClick →
构造数据 {job: {...}} + setIsFromInterview(true) →
JobInfoModal(hideDeliverButton=true) →
检查条件 (!hideDeliverButton = false) → ❌ 隐藏

验证测试场景

测试场景1: 企业内推岗位库 - 正常岗位

• 点击正常岗位
• 岗位详情弹窗显示"岗位招聘数量仅剩X名"
• 岗位详情弹窗显示"立即投递"按钮

测试场景2: 企业内推岗位库 - 已投递岗位

• 点击已投递岗位（标记"已投递"）
• 岗位详情弹窗不显示"岗位招聘数量仅剩X名"
• 岗位详情弹窗不显示"立即投递"按钮

测试场景3: 企业内推岗位库 - 已过期岗位

• 点击已过期岗位（标记"已过期"）
• 岗位详情弹窗不显示"岗位招聘数量仅剩X名"
• 岗位详情弹窗不显示"立即投递"按钮

测试场景4: 岗位面试状态 - 所有岗位

• 点击任意面试状态岗位
• 岗位详情弹窗不显示"岗位招聘数量仅剩X名"
• 岗位详情弹窗不显示"立即投递"按钮

测试场景5: 投递按钮点击

• 点击正常岗位的"投递"按钮
• 打开岗位详情弹窗
• 岗位详情弹窗显示"岗位招聘数量仅剩X名"
• 岗位详情弹窗显示"立即投递"按钮

代码质量

✅ ESLint 检查通过（仅1个未使用变量警告） ✅ 语法正确 ✅ 逻辑完整

修复完成时间

2025年10月10日

影响范围

• 企业内推岗位页面 → 企业内推岗位库板块 → 岗位详情弹窗
• 企业内推岗位页面 → 岗位面试状态板块 → 岗位详情弹窗