You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
haoliang-net/docs/02-功能清单/管理后台/06-员工管理/06-02-员工详情页面.md

5.4 KiB

员工详情页面

最后更新2026-04-25 状态:已设计


1. 基本信息

路由 /worker/:id
权限 admin
入口 员工管理列表点击工人姓名 / 仪表盘工人排行点击工人姓名
面包屑 首页 / 员工管理 / {工人姓名}

2. 界面布局

┌──────────────────────────────────────────────────────────┐ │ [面包屑] 首页 / 员工管理 / 张三 │ ├──────────────────────────────────────────────────────────┤ │ [基本信息区] │ │ < 返回 工人详情:张三 │ │ 工号W001 姓名:张三 │ │ 状态:启用 绑定机床数2 │ ├──────────────────────────────────────────────────────────┤ │ [绑定机床区] │ │ 机床名称 | device_code | 车间 | 品牌 | 在线状态 | 当前程序 │ │ 西-1.8 | fanake_1.8 | A栋 | FANUC| 在线 | 1566.NC │ │ 西-2.0 | fanake_2.0 | A栋 | FANUC| 离线 | - │ ├──────────────────────────────────────────────────────────┤ │ [今日产量区] │ │ 机床名称 | 程序名 | 产量 | 运行时间 | 切削时间 │ │ 西-1.8 | 1566.NC | 580 | 4h20m | 3h50m │ │ 西-2.0 | - | - | - | - │ ├──────────────────────────────────────────────────────────┤ │ [近7天产量趋势折线图] │ │ [============图表区域============] │ └──────────────────────────────────────────────────────────┘

3. 数据区块

区块 展示字段 控件类型 刷新策略
基本信息 工号、姓名、状态、绑定机床数 文本展示 页面加载时请求一次
绑定机床 机床名称、device_code、车间、品牌、在线状态、当前程序 el-table 页面加载时请求一次
今日产量 机床名称、程序名、产量、运行时间、切削时间 el-table 页面加载时请求一次
近7天趋势 日期、产量 折线图 页面加载时请求一次

4. 操作按钮

名称 位置 显示条件 点击行为
返回 页头左侧 始终 router.back()
机床名称 行内链接 始终 跳转机床详情页(/machine/:id)

5. 交互流程

  • 加载请求工人详情API+绑定机床API+今日产量API+7天趋势API->渲染
  • 点击机床名称router.push到机床详情页
  • 返回router.back()

6. 空状态

  • 绑定机床无数据el-empty 该工人暂无绑定机床
  • 今日产量无数据el-empty 今日尚无产量数据

8. Mock数据

GET /api/admin/worker/1 工人详情:

{ "code": 0, "data": { "id": 1, "code": "W001", "name": "张三", "isEnabled": 1, "machineCount": 2 }}

GET /api/admin/worker/1/machines 绑定机床:

{ "code": 0, "data": { "items": [
  { "machineId": 1, "machineName": "西-1.8", "deviceCode": "fanake_1.8", "workshopName": "A栋", "brandName": "FANUC", "isOnline": 1, "programName": "1566.NC" },
  { "machineId": 2, "machineName": "西-2.0", "deviceCode": "fanake_2.0", "workshopName": "A栋", "brandName": "FANUC", "isOnline": 0, "programName": null }
]}}

GET /api/admin/worker/1/production/today 今日产量:

{ "code": 0, "data": { "items": [
  { "machineName": "西-1.8", "programName": "1566.NC", "quantity": 580, "runTime": "4h20m", "cuttingTime": "3h50m" },
  { "machineName": "西-2.0", "programName": "-", "quantity": null, "runTime": "-", "cuttingTime": "-" }
]}}

GET /api/admin/worker/1/production/trend 7天趋势

{ "code": 0, "data": { "items": [
  { "date": "2026-04-19", "quantity": 980 }, { "date": "2026-04-20", "quantity": 920 },
  { "date": "2026-04-21", "quantity": 1100 }, { "date": "2026-04-22", "quantity": 1050 },
  { "date": "2026-04-23", "quantity": 990 }, { "date": "2026-04-24", "quantity": 1080 },
  { "date": "2026-04-25", "quantity": 580 }
]}}

### 7. 数据需求

> 以下为本页面需要的数据,数据库设计定稿时需覆盖。参考 `01-数据库设计.md` 草案。

| 数据需求 | 草案对应 | 说明 |
|---------|---------|------|
| 工人基本信息 | cnc_worker | 主表 |
| 绑定机床列表 | cnc_worker_machine + cnc_machine | 按worker_id查关联机床 |
| 今日产量(按机床+程序) | cnc_daily_production + cnc_machine | 按worker绑定的machine_id查询 |
| 7天趋势 | cnc_worker_daily_summary | 按worker_id+近7天查询 |