隐藏身份激活和问卷页面按钮.md 9.0 KB

隐藏身份激活和问卷页面按钮

修改时间:2025年11月2日
状态:✅ 已完成


🎯 修改目标

临时隐藏以下页面中的导航按钮:

1. 身份激活页面 (profile-activation)

  • ❌ "进入工作台" 按钮(2 个位置)
  • ❌ "稍后填写,先进入工作台" 按钮

2. 问卷页面 (profile-survey)

  • ❌ "返回首页" 按钮

📝 修改内容

修改 1: profile-activation.component.html(第一处)

文件位置src/modules/profile/pages/profile-activation/profile-activation.component.html
行号:143-154

修改内容:隐藏"已激活"视图中的按钮区域

<!-- 修改前 -->
<div class="card-footer">
  @if (surveyCompleted) {
    <button class="btn-primary" (click)="goToDashboard()">
      进入工作台
    </button>
  } @else {
    <button class="btn-text" (click)="goToDashboard()">
      稍后填写,先进入工作台
    </button>
  }
</div>

<!-- 修改后 ✅ -->
<!-- 临时隐藏:进入工作台按钮 -->
<!-- <div class="card-footer">
  @if (surveyCompleted) {
    <button class="btn-primary" (click)="goToDashboard()">
      进入工作台
    </button>
  } @else {
    <button class="btn-text" (click)="goToDashboard()">
      稍后填写,先进入工作台
    </button>
  }
</div> -->

效果

  • ✅ 隐藏了"进入工作台"主按钮
  • ✅ 隐藏了"稍后填写,先进入工作台"文本按钮

修改 2: profile-activation.component.html(第二处)

文件位置src/modules/profile/pages/profile-activation/profile-activation.component.html
行号:224-229

修改内容:隐藏"问卷结果"视图中的按钮

<!-- 修改前 -->
<div class="card-footer">
  <button class="btn-primary" (click)="goToDashboard()">
    进入工作台
  </button>
</div>

<!-- 修改后 ✅ -->
<!-- 临时隐藏:进入工作台按钮 -->
<!-- <div class="card-footer">
  <button class="btn-primary" (click)="goToDashboard()">
    进入工作台
  </button>
</div> -->

效果

  • ✅ 隐藏了问卷结果页面的"进入工作台"按钮

修改 3: profile-survey.component.html

文件位置src/modules/profile/pages/profile-survey/profile-survey.component.html
行号:385-391

修改内容:隐藏问卷完成后的"返回首页"按钮

<!-- 修改前 -->
<button class="btn-primary" (click)="goHome()">
  <span>返回首页</span>
  <svg class="icon" viewBox="0 0 512 512">
    <path fill="currentColor" d="M280.37 148.26L96 300.11V464a16 16 0 0016 16l112.06-.29a16 16 0 0015.92-16V368a16 16 0 0116-16h64a16 16 0 0116 16v95.64a16 16 0 0016 16.05L464 480a16 16 0 0016-16V300L295.67 148.26a12.19 12.19 0 00-15.3 0zM571.6 251.47L488 182.56V44.05a12 12 0 00-12-12h-56a12 12 0 00-12 12v72.61L318.47 43a48 48 0 00-61 0L4.34 251.47a12 12 0 00-1.6 16.9l25.5 31A12 12 0 0045.15 301l235.22-193.74a12.19 12.19 0 0115.3 0L530.9 301a12 12 0 0016.9-1.6l25.5-31a12 12 0 00-1.7-16.93z"/>
  </svg>
</button>

<!-- 修改后 ✅ -->
<!-- 临时隐藏:返回首页按钮 -->
<!-- <button class="btn-primary" (click)="goHome()">
  <span>返回首页</span>
  <svg class="icon" viewBox="0 0 512 512">
    <path fill="currentColor" d="M280.37 148.26L96 300.11V464a16 16 0 0016 16l112.06-.29a16 16 0 0015.92-16V368a16 16 0 0116-16h64a16 16 0 0116 16v95.64a16 16 0 0016 16.05L464 480a16 16 0 0016-16V300L295.67 148.26a12.19 12.19 0 00-15.3 0zM571.6 251.47L488 182.56V44.05a12 12 0 00-12-12h-56a12 12 0 00-12 12v72.61L318.47 43a48 48 0 00-61 0L4.34 251.47a12 12 0 00-1.6 16.9l25.5 31A12 12 0 0045.15 301l235.22-193.74a12.19 12.19 0 0115.3 0L530.9 301a12 12 0 0016.9-1.6l25.5-31a12 12 0 00-1.7-16.93z"/>
  </svg>
</button> -->

效果

  • ✅ 隐藏了问卷完成页面的"返回首页"按钮
  • ⚠️ "重新填写"按钮仍然保留显示

📊 修改总结

修改的文件

文件 修改位置 隐藏的按钮
profile-activation.component.html 第 143-154 行 "进入工作台" / "稍后填写,先进入工作台"
profile-activation.component.html 第 224-229 行 "进入工作台"
profile-survey.component.html 第 385-391 行 "返回首页"

隐藏的按钮总数

  • 3 个按钮区域被隐藏
  • 0 个 Linter 错误

🎯 隐藏方式

使用 HTML 注释 的方式隐藏按钮:

优点

  • ✅ 简单快捷
  • ✅ 不需要修改逻辑代码
  • ✅ 易于恢复(取消注释即可)
  • ✅ 不影响其他功能
  • ✅ 保留了原始代码结构

恢复方法

如果需要恢复这些按钮,只需:

  1. 找到注释标记 <!-- 临时隐藏:xxx按钮 -->
  2. 删除开始和结束的 <!---->
  3. 保存文件即可

🔍 页面流程变化

身份激活页面流程

修改前 ❌

1. 身份确认 → [确认身份] 按钮
2. 已激活视图 → [进入工作台] 或 [稍后填写,先进入工作台] 按钮
3. 问卷结果视图 → [进入工作台] 按钮

修改后 ✅

1. 身份确认 → [确认身份] 按钮 ✅ 保留
2. 已激活视图 → [开始填写问卷] 按钮 ✅ 保留
   - ❌ 隐藏了导航按钮(进入工作台)
3. 问卷结果视图 → [刷新状态] 按钮 ✅ 保留
   - ❌ 隐藏了导航按钮(进入工作台)

影响

  • ✅ 用户仍可以进行身份确认
  • ✅ 用户仍可以开始填写问卷
  • ✅ 用户仍可以刷新问卷状态
  • ⚠️ 用户无法直接从此页面进入工作台(需要其他入口)

问卷页面流程

修改前 ❌

1. 填写问卷 → [提交] 按钮
2. 问卷完成 → [重新填写] 和 [返回首页] 按钮

修改后 ✅

1. 填写问卷 → [提交] 按钮 ✅ 保留
2. 问卷完成 → [重新填写] 按钮 ✅ 保留
   - ❌ 隐藏了 [返回首页] 按钮

影响

  • ✅ 用户仍可以填写和提交问卷
  • ✅ 用户仍可以重新填写问卷
  • ⚠️ 用户无法直接从此页面返回首页(需要其他入口)

📱 用户体验影响

正面影响 ✅

  • 减少导航干扰,用户更专注于当前任务
  • 简化界面,减少按钮数量
  • 防止用户过早离开流程

需要注意 ⚠️

  • 确保用户有其他方式返回首页或进入工作台
  • 可能需要在其他位置提供导航入口
  • 用户可能会感到"被困"在当前页面

建议 💡

  1. 提供浏览器返回功能:用户可以使用浏览器的后退按钮
  2. 提供顶部导航栏:添加面包屑或返回按钮
  3. 在适当时机恢复按钮:根据业务需求决定何时取消隐藏

🔄 如何恢复按钮

方法 1: 取消注释(推荐)

profile-activation.component.html(第一处)

<!-- 删除这两行 -->
<!-- 临时隐藏:进入工作台按钮 -->
<!-- 

<!-- 和 -->

<!-- 在最后删除这一行 -->
</div> -->

profile-activation.component.html(第二处)

同上

profile-survey.component.html

同上

方法 2: 使用版本控制

# 恢复所有修改
git checkout src/modules/profile/pages/profile-activation/profile-activation.component.html
git checkout src/modules/profile/pages/profile-survey/profile-survey.component.html

🧪 测试清单

测试步骤

1️⃣ 身份激活页面

  • 访问 /wxwork/:cid/activation
  • 确认"确认身份"按钮正常显示
  • 点击"确认身份"后,确认没有"进入工作台"按钮
  • 确认"开始填写问卷"按钮正常显示

2️⃣ 问卷填写页面

  • 访问 /wxwork/:cid/survey/profile
  • 填写并提交问卷
  • 在完成页面确认没有"返回首页"按钮
  • 确认"重新填写"按钮正常显示

3️⃣ 问卷结果视图

  • 在身份激活页面查看问卷结果
  • 确认没有"进入工作台"按钮
  • 确认"刷新状态"按钮正常显示

📝 相关文件

修改的文件

  • src/modules/profile/pages/profile-activation/profile-activation.component.html
  • src/modules/profile/pages/profile-survey/profile-survey.component.html

未修改的文件

  • profile-activation.component.ts - 逻辑代码保持不变
  • profile-activation.component.scss - 样式保持不变
  • profile-survey.component.ts - 逻辑代码保持不变
  • profile-survey.component.scss - 样式保持不变

🎉 总结

已完成的工作 ✅

  • ✅ 隐藏了 2 个"进入工作台"按钮(身份激活页面)
  • ✅ 隐藏了 1 个"返回首页"按钮(问卷页面)
  • ✅ 使用注释方式,易于恢复
  • ✅ 不影响其他功能和逻辑
  • ✅ 无 Linter 错误

保留的功能 ✅

  • ✅ 身份确认功能
  • ✅ 问卷填写功能
  • ✅ 问卷提交功能
  • ✅ 状态刷新功能
  • ✅ 重新填写功能

下一步建议 💡

  • 💡 测试用户流程,确保体验流畅
  • 💡 如需提供导航,考虑添加顶部返回按钮
  • 💡 根据业务需求决定是否永久移除或恢复这些按钮

修改完成! ✅ 所有按钮已成功隐藏。