part.showOrigin).length} aria-label="三维机床装配预览，机床 Z 轴朝上" />{fault && {fault}}

; } function TreeNode({ part, node, selected, onSelect, onDrop, extra }: { part: MachinePartDraft; node: MachineTreeNode; selected: string; onSelect: (partId: string, path: string) => void; onDrop: (source: { partId: string; path: string }, target: { partId: string; path: string }) => void; extra?: React.ReactNode }) { const key = `${part.id}:${node.path}`; const [expanded, setExpanded] = useState(node.path === "scene"); const hasChildren = node.children.length > 0 || Boolean(extra); const binding = part.nodeJoints?.[node.path]?.axis ?? (node.path === "scene" ? part.role : part.nodeRoles?.[node.path]); return

{hasChildren && }

; } export function MachineManagerPanel({ coordinates, disabled, onApply, snapshot }: Props) { const [open, setOpen] = useState(false), [pending, setPending] = useState(false), [message, setMessage] = useState(""); const [parts, setParts] = useState([]); const partsRef = useRef(parts); partsRef.current = parts; const [selectedId, setSelectedId] = useState(null); const [selectedNodePath, setSelectedNodePath] = useState("scene"); const [cOriginMm, setCOriginMm] = useState([0, 0, 0]); const [tiltOffsetMm, setTiltOffsetMm] = useState([0, 0, 0]); const [physicalZero, setPhysicalZero] = useState({ x: 0, y: 0, z: 0, a: 0, b: 0, c: 0 }); const file = useRef(null); const [testPose, setTestPose] = useState({ x: 0, y: 0, z: 0, a: 0, b: 0, c: 0 }); const [motionState, setMotionState] = useState>({}); const motionStateHash = useRef(""); useEffect(() => () => { for (const part of partsRef.current) disposeMachineScene(part.scene); }, []); useEffect(() => { setMessage(""); setCOriginMm([0, 0, 0]); setTiltOffsetMm([0, 0, 0]); setPhysicalZero({ x: 0, y: 0, z: 0, a: 0, b: 0, c: 0 }); }, [coordinates]); const selected = parts.find((part) => part.id === selectedId) ?? null; const trees = useMemo(() => new Map(parts.map((part) => [part.id, machinePartTree(part)])), [parts]); const findTreeNode = (node: MachineTreeNode | undefined, path: string): MachineTreeNode | null => node ? node.path === path ? node : node.children.map((child) => findTreeNode(child, path)).find(Boolean) ?? null : null; const selectedTreeNode = selected ? findTreeNode(trees.get(selected.id), selectedNodePath) : null; const update = (id: string, values: Partial) => setParts((current) => current.map((part) => part.id === id ? { ...part, ...values } : part)); const vectorInput = (label: string, value: Vec3, set: (value: Vec3) => void, unit: string, control?: string) =>

{label} ({unit}){["X", "Y", "Z"].map((axis, index) => {axis} { const next = [...value] as Vec3; next[index] = number(event.target.value); set(next); }} />)}

; const importFiles = async (list: FileList | File[] | null) => { if (!list?.length) return; setPending(true); setMessage("正在读取 GLB 部件…"); try { const loaded = await Promise.all([...list].map(async (item) => loadMachinePart(await item.arrayBuffer(), item.name))); if (loaded.some((source) => source.restoredModel && source.restoredModel.coordinates !== coordinates)) { loaded.forEach((source) => disposeMachineScene(source.scene)); throw new Error(`导入机型不同，请先切换到 ${loaded.find((source) => source.restoredModel?.coordinates !== coordinates && source.restoredModel)?.restoredModel?.coordinates}`); } setParts((current) => { const next = [...current]; for (const source of loaded) { const role = MACHINE_PART_ROLES.find((candidate) => !next.some((part) => part.role === candidate)) ?? ""; const parentRole = role ? expectedParentRole(role) : null; const parentId = parentRole ? next.find((part) => part.role === parentRole)?.id ?? null : null; next.push({ ...source, role, parentId, visible: true, showOrigin: true, originMm: zero3(), translationMm: zero3(), rotationDeg: zero3(), nodeParents: {}, nodeTransforms: {}, nodeJoints: source.restoredJoints ?? {}, nodeRoles: source.restoredRoles ?? {} }); } return next; }); const restored = loaded.find((source) => source.restoredModel)?.restoredModel; if (restored) { setCOriginMm(restored.calibration.cOriginMm); setTiltOffsetMm(restored.calibration.tiltOffsetMm); setPhysicalZero(restored.calibration.physicalZero as PhysicalZero); setMessage(`已恢复 ${restored.coordinates} 单自由度配置`); } setSelectedId(loaded[0].id); setSelectedNodePath("scene"); setMessage(restored ? `已恢复 ${restored.coordinates} 关节配置和物理零点` : `已导入 ${loaded.length} 个部件`); } catch (error) { setMessage(error instanceof Error ? error.message : String(error)); } finally { setPending(false); } }; const remove = (part: MachinePartDraft) => { setParts((current) => current.filter((item) => item.id !== part.id).map((item) => item.parentId === part.id ? { ...item, parentId: null } : item)); requestAnimationFrame(() => disposeMachineScene(part.scene)); if (selectedId === part.id) { setSelectedId(null); setSelectedNodePath("scene"); } }; const selectTreeNode = (partId: string, path: string) => { setSelectedId(partId); setSelectedNodePath(path); }; const reparentTreeNode = (source: { partId: string; path: string }, target: { partId: string; path: string }) => { if (source.partId === target.partId && source.path === target.path) return; if (source.path === "scene") { if (target.path !== "scene") { setMessage("整机/部件根节点只能拖到另一个 GLB 根节点"); return; } let cursor: string | null = target.partId; while (cursor) { if (cursor === source.partId) { setMessage("部件层级不能形成循环"); return; } cursor = parts.find((part) => part.id === cursor)?.parentId ?? null; } update(source.partId, { parentId: target.partId }); setMessage("部件装配层级已更新"); return; } if (source.partId !== target.partId) { setMessage("GLB 内部节点只能在同一 GLB 层级树内拖动"); return; } const part = parts.find((item) => item.id === source.partId)!; try { const changes = reparentMachineNode(part, source.path, target.path); machinePartTree({ ...part, ...changes }); update(part.id, changes); setSelectedId(part.id); setSelectedNodePath(source.path); setMessage("GLB 内部层级已更新，保留当前装配姿态"); } catch (error) { setMessage(error instanceof Error ? error.message : String(error)); } }; const apply = async () => { if (disabled) return; setPending(true); setMessage("正在生成机床层级和 URDF…"); let machine: ImportedMachine | null = null; try { machine = await buildManagedMachine({ coordinates, parts, cOriginMm, tiltOffsetMm, physicalZero }); await onApply(machine); setMessage("三维机床已应用；请重新回零后运行程序"); } catch (error) { if (machine) disposeMachineScene(machine.scene); setMessage(error instanceof Error ? error.message : String(error)); } finally { setPending(false); } }; const exportGlb = async () => { setPending(true); setMessage("正在生成包含 userData 的组合 GLB…"); let machine: ImportedMachine | null = null; try { machine = await buildManagedMachine({ coordinates, parts, cOriginMm, tiltOffsetMm, physicalZero }); const exportScene = new THREE.Scene(); exportScene.name = machine.scene.name; exportScene.userData = machine.scene.userData; for (const child of machine.scene.children) exportScene.add(child.clone(true)); const bytes = await new GLTFExporter().parseAsync(exportScene, { binary: true, trs: true, onlyVisible: false }); const url = URL.createObjectURL(new Blob([bytes as ArrayBuffer], { type: "model/gltf-binary" })); const link = document.createElement("a"); link.href = url; link.download = machine.filename; link.click(); setTimeout(() => URL.revokeObjectURL(url), 1000); setMessage("组合 GLB 已导出，底座和整机场景包含机床标定 userData"); } catch (error) { setMessage(error instanceof Error ? error.message : String(error)); } finally { if (machine) disposeMachineScene(machine.scene); setPending(false); } }; const roleChange = (part: MachinePartDraft, role: MachinePartRole | "") => { if (selectedNodePath !== "scene") { update(part.id, { nodeRoles: { ...part.nodeRoles, [selectedNodePath]: role } }); return; } const parentRole = role ? expectedParentRole(role) : null; update(part.id, { role, parentId: parentRole ? parts.find((item) => item.role === parentRole)?.id ?? null : null }); }; const selectedDof = selected ? draftNodeDof(selected, selectedNodePath, coordinates) : null; const setDof = (dof: JointDof | null) => { if (!selected) return; if (dof && parts.some((part) => Object.entries(part.nodeJoints ?? {}).some(([path, existing]) => existing.axis === dof.axis && (part.id !== selected.id || path !== selectedNodePath)))) { setMessage(`${dof.axis} 轴已绑定其他节点，请先取消该绑定`); return; } setParts((current) => current.map((part) => { if (part.id !== selected.id) return part; const nodeJoints = { ...(part.nodeJoints ?? {}) }; if (dof) nodeJoints[selectedNodePath] = dof; else delete nodeJoints[selectedNodePath]; return { ...part, nodeJoints }; })); setMessage(""); }; const [followLive, setFollowLive] = useState(false); const visual = useMemo(() => projectXyzacVisual(snapshot), [snapshot]); const liveReady = visual.authoritative && visual.machineModel?.coordinate_system === coordinates; const effectivePose: TestPose = followLive && liveReady ? { x: 0, y: 0, z: 0, a: 0, b: 0, c: 0, ...Object.fromEntries([...coordinates].map((axis, i) => [axis.toLowerCase(), visual.joints[i] - physicalZero[axis.toLowerCase() as keyof PhysicalZero]])) } : testPose; const validation = useMemo(() => { try { const { model } = makeJointAssembly({ coordinates, parts, cOriginMm, tiltOffsetMm, physicalZero }); const missing = [...coordinates].filter((axis) => !model.axisMap[axis as CncAxis]); return { model, error: missing.length ? `请绑定 ${missing.join("、")} 轴` : "" }; } catch (error) { return { model: null, error: error instanceof Error ? error.message : String(error) }; } }, [coordinates, parts, cOriginMm, tiltOffsetMm, physicalZero]); const exportJson = () => { if (!validation.model) return; const url = URL.createObjectURL(new Blob([JSON.stringify(validation.model, null, 2)], { type: "application/json" })); const a = document.createElement("a"); a.href = url; a.download = `machine-joints-${coordinates.toLowerCase()}.json`; a.click(); setTimeout(() => URL.revokeObjectURL(url), 1000); }; const poseInput = (axis: keyof TestPose, unit: string) => {axis.toUpperCase()} Object.values(part.nodeJoints ?? {}).some((joint) => joint.axis.toLowerCase() === axis))} value={effectivePose[axis]} onChange={(event) => setTestPose({ ...testPose, [axis]: number(event.target.value) })} />{unit}; const receiveMotionState = (state: Record) => { const hash = JSON.stringify(state); if (hash !== motionStateHash.current) { motionStateHash.current = hash; setMotionState(state); } }; const selectedDriven = motionState.selected ?? null; const selectedTransform = selectedNodePath === "scene" ? selected : selected?.nodeTransforms?.[selectedNodePath] ?? (selectedTreeNode ? { translationMm: selectedTreeNode.originMm, rotationDeg: selectedTreeNode.rotationDeg } : null); const renderPartTree = (part: MachinePartDraft): React.ReactNode => child.parentId === part.id).map(renderPartTree)} />; return

setOpen(false)}>

{parts.length} 个导入模型 · 每个运动节点一个自由度

{open && }

部件与层级

{parts.length ?

{parts.filter((part) => !part.parentId).map(renderPartTree)} :

导入机床或部件后显示 GLB 内部层级。

}

{selected &&

{selected.filename}

{selectedTreeNode &&

{selectedTreeNode.name}节点自身局部原点X 0.000　Y 0.000　Z 0.000装配位置（相对父节点，mm）X {selectedTransform!.translationMm[0].toFixed(3)}　Y {selectedTransform!.translationMm[1].toFixed(3)}　Z {selectedTransform!.translationMm[2].toFixed(3)}装配姿态（相对父节点，deg）RX {selectedTransform!.rotationDeg[0].toFixed(3)}　RY {selectedTransform!.rotationDeg[1].toFixed(3)}　RZ {selectedTransform!.rotationDeg[2].toFixed(3)}{selectedDriven && <>当前世界原点（mm）X {(selectedDriven.world[0] * 1000).toFixed(3)}　Y {(selectedDriven.world[1] * 1000).toFixed(3)}　Z {(selectedDriven.world[2] * 1000).toFixed(3)}}

}唯一自由度 {selectedDof && <>父级运动方向正负方向} 节点结构角色模型装配父级

update(selected.id, { visible: event.target.checked })} />显示模型 update(selected.id, { showOrigin: event.target.checked })} />显示坐标原点

当前节点：{selectedTreeNode?.name}。{selectedDof ? `仅允许 ${selectedDof.axis} ${isLinear(selectedDof.axis) ? "平移" : "旋转"}，沿父级 ${selectedDof.direction.toUpperCase()} 方向；以导入装配姿态为零位。` : "固定节点随父级运动；请先配置唯一自由度。"}

{selectedDof ? `${selectedDof.axis} ${isLinear(selectedDof.axis) ? "位移 (mm)" : "转角 (deg)"}` : "关节值"} { if (selectedDof) setTestPose((pose) => ({ ...pose, [selectedDof.axis.toLowerCase()]: number(event.target.value) })); }} />

}

setFollowLive(event.target.checked)} />跟随数控系统实时关节位置{followLive ? liveReady ? `WASM tick ${visual.tick}` : "等待有效机床数据" : "手动验证（相对物理零点）"}

层级运动测试

{(["x", "y", "z"] as const).map((axis) => poseInput(axis, "mm"))}{poseInput(coordinates === "XYZBC" ? "b" : "a", "deg")}{poseInput("c", "deg")}

{JSON.stringify(effectivePose)}

机床标定

{vectorInput("C 轴原点", cOriginMm, setCOriginMm, "mm")}{vectorInput(`${coordinates === "XYZBC" ? "B" : "A"} 到 C 轴偏置`, tiltOffsetMm, setTiltOffsetMm, "mm")}

机床物理零点 (XYZ mm / ABC deg){["x", "y", "z", coordinates === "XYZBC" ? "b" : "a", "c"].map((axis) => {axis.toUpperCase()} setPhysicalZero({ ...physicalZero, [axis]: number(event.target.value) })} />)}

{ const files = event.target.files ? [...event.target.files] : []; event.target.value = ""; void importFiles(files); }} />

; } // Named wrapper keeps the recursive panel JSX readable while retaining one preview implementation. const MachineManagerPanelPreview = ManagerPreview;