Files
ks-app-employment-service/docs/企业我的页面功能说明.md
2025-10-24 11:34:11 +08:00

3.4 KiB
Raw Blame History

企业我的页面功能说明

功能概述

本功能为企业用户提供了专门的"我的"页面和企业信息展示页面,实现了根据用户类型显示不同内容的功能。

页面结构

1. 企业我的页面 (pages/mine/company-mine.vue)

  • 功能: 企业用户的个人中心页面
  • 特点:
    • 显示企业头像、名称和信息完整度
    • 包含服务专区(实名认证、通知与提醒)
    • 提供退出登录功能
    • 点击头像区域可跳转到企业信息页面

2. 企业信息展示页面 (pages/mine/company-info.vue)

  • 功能: 显示详细的企业信息
  • 特点:
    • 显示企业头像编辑功能
    • 展示完整的企业信息(名称、统一社会代码、注册地点等)
    • 支持编辑各项企业信息
    • 包含企业联系人和法人信息

3. 修改后的我的页面 (pages/mine/mine.vue)

  • 功能: 根据用户类型显示不同的内容
  • 特点:
    • 企业用户显示企业信息卡片
    • 求职者用户显示个人简历信息
    • 自动根据 userInfo.isCompanyUser 字段判断用户类型

用户类型判断

系统通过 userInfo.isCompanyUser 字段来判断用户类型:

  • 0 = 企业用户
  • 1 = 求职者
  • 2 = 网格员
  • 3 = 政府人员

页面跳转逻辑

从我的页面跳转

  • 企业用户: 点击头像区域 → 跳转到企业信息页面 (/pages/mine/company-info)
  • 求职者用户: 点击头像区域 → 跳转到简历页面 (/packageA/pages/myResume/myResume)

企业信息页面功能

  • 点击头像 → 编辑头像(调用相册选择图片)
  • 点击各项信息 → 跳转到对应的编辑页面(需要后续开发)

路由配置

新增的路由配置:

{
    "path": "pages/mine/company-mine",
    "style": {
        "navigationBarTitleText": "我的",
        "navigationStyle": "custom"
    }
},
{
    "path": "pages/mine/company-info",
    "style": {
        "navigationBarTitleText": "企业信息",
        "navigationStyle": "custom"
    }
}

测试页面

创建了测试页面 pages/test/company-mine-test.vue 用于测试功能:

  • 用户类型切换测试
  • 页面跳转测试
  • 用户信息显示

样式特点

企业信息卡片

  • 白色背景,圆角设计
  • 阴影效果现代化UI
  • 头像圆形显示
  • 信息完整度显示

企业信息页面

  • 清晰的信息层级
  • 可点击的编辑区域
  • 统一的视觉风格

数据流

  1. 用户登录时设置 userInfo.isCompanyUser 字段
  2. 我的页面根据此字段判断显示内容
  3. 企业用户点击头像跳转到企业信息页面
  4. 企业信息页面展示详细的企业数据

后续开发建议

  1. 编辑功能: 为每个信息项创建对应的编辑页面
  2. 数据接口: 连接真实的企业信息API
  3. 头像上传: 完善头像上传功能
  4. 表单验证: 添加企业信息编辑的表单验证
  5. 权限控制: 根据用户权限控制可编辑的字段

使用方法

  1. 在测试页面切换用户类型为企业用户
  2. 访问我的页面,查看企业信息卡片
  3. 点击头像区域跳转到企业信息页面
  4. 在企业信息页面查看详细的企业信息

注意事项

  • 确保用户类型字段正确设置
  • 企业信息数据需要从后端API获取
  • 头像上传功能需要配置服务器接口
  • 编辑页面需要根据实际需求进行开发