# 5 轴数控系统 Web 仿真编写过程接续文档

生成时间：2026-06-20 CST

## 1. 当前结论

已确定：

- Web 前端界面可实现；
- 首选界面风格为 `gmoccapy_5_axis.png`；
- 前端不使用 React/Vue 等框架，采用原生 HTML/CSS + TypeScript/JavaScript ES modules；
- 3D 使用 Three.js；
- LinuxCNC Python GUI 只做界面参考；
- LinuxCNC C/C++/WASM/source-derived boundary 才能作为 CNC 语义和五轴运动学依据。

当前准备文档已完成：

```text
README.md
docs/implementation-plan.md
docs/technical-roadmap.md
docs/program-implementation-guide.md
docs/development-continuation.md
docs/traceability-matrix.md
docs/linuxcnc-python-gui-reference.md
docs/linuxcnc-gui-reference-gallery.md
```

## 2. 下一轮直接开工任务

下一轮不再继续扩展方案，直接进入实现。

第一批任务：

```text
M1-web-shell-gmoccapy
```

状态：

```text
completed_with_build_gate
```

目标：

- 创建 `app/`；
- 创建原生 HTML/CSS/TS 项目；
- 实现 gmoccapy 风格静态 shell；
- 复制必要的参考图路径到 docs；
- 加 browser smoke 验证页面区域存在。

已补齐 M1 工程化验收：

- `app/tsconfig.json` 已创建；
- `npm run build` 已可输出静态产物；
- build 产物目录 `app/dist/` 已加入 `.gitignore`；
- browser smoke 已检查无 React/Vue/Angular/Svelte 依赖和 DOM 标记。

## 3. M1 任务拆分

### M1.1 初始化 app

创建：

```text
app/index.html
app/package.json
app/tsconfig.json
app/src/main.ts
app/src/styles/gmoccapy.css
```

要求：

- 不安装 React/Vue；
- 可使用 Vite；
- `npm run dev` 能启动；
- `npm run build` 能输出静态产物。

### M1.2 静态 shell

创建：

```text
app/src/ui/gmoccapy-shell.ts
```

渲染区域：

```text
titlebar
preview
dro
gcode
status-sidebar
info-tabs
override
spindle-coolant
bottom-controls
```

### M1.3 CSS layout

目标：

- 视觉接近 `gmoccapy_5_axis.png`；
- 黑底 preview；
- 绿色 DRO；
- 灰色面板；
- 橙色 override；
- 右侧竖向大按钮；
- 底部大按钮栏。

### M1.4 smoke

创建：

```text
tests/browser/gmoccapy_shell_smoke.html
tests/browser/verify_gmoccapy_shell_browser.sh
```

检查：

- 页面加载；
- 关键 `data-region` 存在；
- DRO 文本非空；
- G-code rows 存在；
- preview 容器非空；
- 无 React/Vue 依赖标记。

当前 gate：

```text
gmoccapy_static_build=ok
gmoccapy_shell_smoke=ok
```

## 4. M2 任务

```text
M2-state-and-controls
```

状态：

```text
completed_with_rtcp_frame_and_control_wiring
```

目标：

- 实现 store；
- 实现 Run/Stop/Pause/Step action；
- G-code active line；
- DRO state update；
- Node smoke。

本轮追加 RTCP 最小可验证链路：

- 新增 `xyzac-trt` profile source reference；
- 新增 `web-rtcp-5axis-motion-frame`；
- store 输出 `axisPose`、`jointPose`、`tcpPose`、`toolAxisVector`、`rtcpFrame`；
- 右侧 TCP/IDENTITY 按钮可切换 `rtcpState=on/off`；
- DRO 和 info tabs 显示 TCP pose、tool axis vector、RTCP frame readiness；
- browser smoke 验证 RTCP DOM 和状态同步；
- node smoke 验证 frame/store 行为。

本轮继续补齐 M2 控件接线：

- preview X/Y/Z/Fit/Clear 按钮接入 store；
- Rapid Override / Feed Rate 加减按钮接入 store；
- Spindle override 加减按钮接入 store；
- Flood / Mist 冷却按钮接入 store；
- Reload / Home / Full 底部按钮接入 store；
- `operatorMessage` 记录最近一次仿真操作；
- Node smoke 和 browser smoke 覆盖上述控制链路。

边界说明：

```text
sourceMode=fixture-ui-only
semanticBoundary=fixture_frame_ui_plumbing_not_linuxcnc_kinematics_proof
linuxCncKinematicsReady=false
promotionAllowed=false
```

也就是说，Web 仿真界面现在已经具备 RTCP 状态链路和显示链路，但尚未把 LinuxCNC/source-derived 五轴运动学 WASM 接入为最终语义源。

## 5. M3 任务

```text
M3-threejs-preview
```

状态：

```text
completed_with_canvas_smoke
```

目标：

- Three.js canvas；
- 基础五轴机床；
- tool marker；
- simple path；
- canvas nonblank browser smoke。

M3 需要消费 M2 的 `rtcpFrame`：

- Three.js tool marker 使用 `tcpPose`；
- 刀轴显示使用 `toolAxisVector`；
- RTCP on/off 需要在预览中产生可见姿态差异；
- canvas smoke 需要检查 frame 与预览数据同步。

已完成：

- 新增 `app/src/vendor/three/three.module.js` 和 `three.core.js`；
- 新增 `app/src/visualization/five-axis-scene.js`；
- gmoccapy preview 区域由真实 WebGL canvas 渲染；
- 预览显示基础五轴工作区、工作台、刀具/TCP marker、刀轴和刀路；
- Three.js canvas 消费 `tcpPose`、`toolAxisVector`、`rtcpState`、`rtcpFrame`；
- browser smoke 验证 canvas nonblank、scene objects、path points、RTCP on/off 同步和 STEP 后 TCP pose 更新。

当前 gate：

```text
gmoccapy_static_build=ok
rtcp_store_smoke=ok
gmoccapy_shell_smoke=ok
```

## 6. M4 任务

```text
M4-profile-and-linuxcnc-boundary
```

状态：

```text
completed_with_profile_boundary_smoke
```

目标：

- `xyzac-trt` profile；
- source reference map；
- PyVCP/HAL panel schema；
- LinuxCNC adapter 接入点；
- traceability update。

已完成：

- 扩展 `app/src/profiles/xyzac-trt.js`，记录 INI、PyVCP XML、postgui HAL、generated HAL、tool table、remap、switchkins type、HAL pins、offsets、sample programs；
- 进一步按 LinuxCNC `xyzac-trt.ini`/`xyzac-trt_cmds.hal`/`*.tbl`/`428-430remap.ngc` 整理 machine name、DISPLAY/RS274NGC/TRAJ、axis/joint limits、HALCMD nets、HALUI MDI commands、tool table 条目；
- 新增 `app/src/profiles/source-reference-map.js`，建立 `xyzac-trt` source/config/reference map；
- 新增 `app/src/panel-schema/xyzac-trt-pyvcp.js`，把 `xyzac-trt.xml` 与 `switchkins_postgui.hal` 的 SWITCHKINS 控件整理为 Web panel schema；
- 新增 `app/src/runtime/linuxcnc-boundary-adapter.js`，作为后续 LinuxCNC interpreter/kinematics WASM 的接入点；
- store 输出 `linuxCncBoundaryAdapter` 和 `linuxCncBoundaryReadiness`；
- info tabs 显示 adapter、panel schema、source map 和 boundary readiness；
- 新增 `tests/node/verify_profile_boundary.mjs`，并接入 `npm run smoke:node`；
- browser smoke 验证 LinuxCNC boundary adapter/schema/readiness DOM 状态。

边界说明：

```text
sourceMapBoundary=profile_source_map_only_not_runtime_proof
panelSchemaBoundary=pyvcp_hal_schema_reference_only
adapterBoundary=adapter_entrypoint_only_runtime_not_connected
linuxCncKinematicsReady=false
promotionAllowed=false
```

说明：

```text
M4 现在可视为在 profile/source-map/panel-schema/adapter 层面完全满足；
但这不等于 LinuxCNC interpreter/kinematics runtime 已接入。
```

## 7. M5 任务

```text
M5-operator-program-workflow
```

状态：

```text
completed_with_operator_program_smoke
```

目标：

- 上电、急停、自动、手动、JOG、MDI、复位等操作；
- 加载 G-code 文件；
- 刀具预览；
- 执行程序并显示执行的当前行。

已完成：

- store 新增 `machine.powerOn`、`machine.estopActive`、`machine.mode`、JOG/MDI/reset 状态；
- 右侧按钮栏新增 POWER、E-STOP、RESET、AUTO、MANUAL、JOG、MDI；
- 底部控制栏新增本地 G-code 文件输入、JOG X/Y、MDI run；
- `LOAD_PROGRAM` 可从浏览器 FileReader 或 public dispatch 加载 operator G-code 文本；
- G-code 面板显示程序来源、当前执行行，并按当前行高亮；
- Three.js 预览区域新增刀具预览卡，显示 T 号、直径、长度和 holder；
- RUN/STEP 会在上电且非急停状态下推进当前行，未上电时明确 blocked；
- node/browser smoke 覆盖上电、加载程序、运行、高亮当前行、JOG、MDI、复位和急停。

边界说明：

```text
operatorWorkflowBoundary=browser_ui_runtime_fixture
gcodeLoadBoundary=file_text_staging_only
programExecutionBoundary=fixture_line_playback_not_linuxcnc_interpreter
linuxCncKinematicsReady=false
promotionAllowed=false
```

## 8. 每批完成后必须更新

每批完成后更新：

- 本文件的“当前状态”；
- `docs/traceability-matrix.md`；
- 如果新增 UI 或 runtime 约束，更新 `docs/program-implementation-guide.md`；
- 如果新增参考来源，更新 `docs/linuxcnc-python-gui-reference.md` 或 `docs/linuxcnc-gui-reference-gallery.md`。

## 9. 当前状态

```text
status=M6_linuxcnc_kinematics_frame_proof_complete
active_style=gmoccapy_5_axis
frontend_framework=none
ui_stack=html_css_typescript_es_modules
preview_stack=threejs
semantic_boundary=linuxcnc_owned
latest_batch=M6-linuxcnc-kinematics-frame-proof
latest_gate=linuxcnc_kinematics_runtime_smoke=ok,profile_boundary_smoke=ok,rtcp_store_smoke=ok,gmoccapy_shell_smoke=ok,gmoccapy_static_build=ok
rtcp_ui_state=implemented_fixture_fallback_and_node_kinematics_wasm_frame
control_wiring=power_estop_reset_auto_manual_jog_mdi_run_stop_pause_step_overrides_coolant_spindle_preview_home_reload_full
gcode_loading=implemented_browser_file_text_staging
program_current_line=implemented_fixture_line_playback_and_highlight
tool_preview=implemented_tool_card_and_threejs_marker
threejs_preview=implemented_basic_canvas_scene
profile_source_map=implemented_xyzac_trt
pyvcp_hal_schema=implemented_xyzac_trt_switchkins
linuxcnc_boundary_adapter=kinematics_runtime_connected_node_interpreter_remap_missing
linuxcnc_kinematics_wasm=node_proof_ready_xyzac_trt
browser_kinematics_wasm=not_connected_fixture_fallback
full_program_execution=not_promoted_fixture_line_playback
next_batch=browser_kinematics_wasm_asset_worker_or_interpreter_execution_source
```