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

; } function TreeNode({ part, node, selected, onSelect, onDrop, extra, query, expansion, locked }: { 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; query: string; expansion: { all: boolean; serial: number }; locked: boolean }) { const key = `${part.id}:${node.path}`; const row = useRef(null); useEffect(() => { if (selected === key) { const frame = requestAnimationFrame(() => row.current?.querySelector(".machine-tree-row")?.scrollIntoView({ block: "nearest", inline: "nearest" })); return () => cancelAnimationFrame(frame); } }, [selected, key]); const [expanded, setExpanded] = useState(node.path === "scene"); useEffect(() => { if (expansion.serial) setExpanded(expansion.all); }, [expansion]); useEffect(() => { if (selected.startsWith(`${key}/`)) setExpanded(true); }, [selected, key]); const matches = (item: MachineTreeNode): boolean => item.name.toLowerCase().includes(query.toLowerCase()) || Boolean(part.nodeJoints?.[item.path]?.axis.toLowerCase().includes(query.toLowerCase())) || item.children.some(matches); const shown = !query || matches(node) || Boolean(extra); const isExpanded = Boolean(query) || expanded; 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 ; } export function MachineManagerPanel({ coordinates: controllerCoordinates, disabled, onApply, snapshot }: Props) { const [open, setOpen] = useState(false), [pending, setPending] = useState(false), [message, setMessage] = useState(""); const { history, draft, edit, undo, redo } = useMachineDraft(controllerCoordinates); const { coordinates, parts, cOriginMm, tiltOffsetMm, physicalZero } = draft; const setParts = (change: (current: MachinePartDraft[]) => MachinePartDraft[]) => edit((current) => ({ ...current, parts: change(current.parts) })); const setCOriginMm = (value: Vec3) => edit((current) => ({ ...current, cOriginMm: value })); const setTiltOffsetMm = (value: Vec3) => edit((current) => ({ ...current, tiltOffsetMm: value })); const setPhysicalZero = (value: PhysicalZero) => edit((current) => ({ ...current, physicalZero: value })); const file = useRef(null); const [selectedId, setSelectedId] = useState(null), [selectedNodePath, setSelectedNodePath] = useState("scene"); const [tab, setTab] = useState("structure"), [query, setQuery] = useState(""); const [expansion, setExpansion] = useState({ all: false, serial: 0 }); const [command, setCommand] = useState({ action: "fit", serial: 0 }); const [jogStep, setJogStep] = useState(1); const [applied, setApplied] = useState(""), [exported, setExported] = useState(""); const [invalidFields, setInvalidFields] = useState([]); const validity = useCallback((field: string, valid: boolean) => setInvalidFields((current) => valid ? current.includes(field) ? current.filter((id) => id !== field) : current : current.includes(field) ? current : [...current, field]), []); const signature = coordinates + draftFingerprint(draft); const retainedScenes = useRef(new Set()); // Retain only assets reachable from the bounded undo/redo history. useEffect(() => { const keep = new Set([...history.past, history.current, ...history.future].flatMap((d) => d.parts.map((part) => part.scene))); for (const scene of retainedScenes.current) if (!keep.has(scene as THREE.Group)) disposeMachineScene(scene); retainedScenes.current = keep; }, [history]); useEffect(() => () => { retainedScenes.current.forEach(disposeMachineScene); }, []); const [testPose, setTestPose] = useState({ x: 0, y: 0, z: 0, a: 0, b: 0, c: 0 }); const [motionState, setMotionState] = useState>({}); const motionStateHash = useRef(""); useEffect(() => { setTestPose({ x: 0, y: 0, z: 0, a: 0, b: 0, c: 0 }); setFollowLive(false); }, [coordinates]); useEffect(() => { if (selectedId && !parts.some((part) => part.id === selectedId)) { setSelectedId(parts[0]?.id ?? null); setSelectedNodePath("scene"); } }, [parts, selectedId]); 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 parentAllowed = (id: string, parentId: string | null) => { let cursor = parentId; const visited = new Set([id]); while (cursor) { if (visited.has(cursor)) return false; visited.add(cursor); cursor = parts.find((part) => part.id === cursor)?.parentId ?? null; } return true; }; const update = (id: string, values: Partial) => { if (pending || followLive) return; if (values.parentId && !parentAllowed(id, values.parentId)) { setMessage("不能将部件挂到自身或后代节点"); return; } setParts((current) => current.map((part) => part.id === id ? { ...part, ...values } : part)); setMessage(""); }; const vectorInput = (label: string, value: Vec3, set: (value: Vec3) => void, unit: string) =>

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

; const importFiles = async (list: FileList | File[] | null) => { if (!list?.length || pending || followLive) return; setPending(true); setMessage("正在读取 GLB 部件…"); try { const results = await Promise.allSettled([...list].map(async (item) => { if (!item.name.toLowerCase().endsWith(".glb") || item.size > 32 * 1024 * 1024) throw new Error(`${item.name}：请选择不超过 32 MiB 的 GLB`); try { return await loadMachinePart(await item.arrayBuffer(), item.name); } catch { throw new Error(`${item.name}：模型无法读取，请检查是否为完整的自包含 GLB，或配置是否与模型层级一致`); } })); const loaded = results.flatMap((result) => result.status === "fulfilled" ? [result.value] : []); const failure = results.find((result) => result.status === "rejected"); if (failure?.status === "rejected") { loaded.forEach((source) => disposeMachineScene(source.scene)); throw failure.reason; } const restoredSources = loaded.filter((source) => source.restoredModel); const restored = restoredSources[0]?.restoredModel; // A saved machine is opened as one document, not appended to another // machine. Raw component imports continue to append to this draft. if (restored && loaded.length !== 1) { loaded.forEach((source) => disposeMachineScene(source.scene)); throw new Error("完整机床 GLB 请单独打开；普通部件可批量导入"); } edit((draft) => { const next = restored ? [] : [...draft.parts]; 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 { ...draft, parts: next, ...(restored ? { coordinates: restored.coordinates, cOriginMm: restored.calibration.cOriginMm, tiltOffsetMm: restored.calibration.tiltOffsetMm, physicalZero: restored.calibration.physicalZero as PhysicalZero } : {}) }; }); setTab("structure"); setQuery(""); 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) => { if (pending || followLive) return; setParts((current) => current.filter((item) => item.id !== part.id).map((item) => item.parentId === part.id ? { ...item, parentId: null } : item)); setMessage(`已删除 ${part.filename}，可撤销恢复`); 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 (pending || followLive) return; 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 || pending || followLive || blockingReason) return; setPending(true); setMessage("正在生成机床层级和 URDF…"); let machine: ImportedMachine | null = null; try { machine = await buildManagedMachine({ coordinates, parts, cOriginMm, tiltOffsetMm, physicalZero }); await onApply(machine); setApplied(signature); setMessage("三维机床已应用；请重新回零后运行程序"); } catch (error) { if (machine) disposeMachineScene(machine.scene); setMessage(error instanceof Error ? error.message : String(error)); } finally { setPending(false); } }; const exportGlb = async () => { if (pending || followLive || blockingReason) return; 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 }); if (!(bytes instanceof ArrayBuffer) || bytes.byteLength > MAX_MACHINE_BYTES) throw new Error("保存文件超过控制面板支持的 32 MiB，请减小模型后重试"); const saved = inspectMachineGlb(bytes); if (saved.structure.coordinates !== coordinates) throw new Error("保存模型的机型与当前配置不一致"); 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); setExported(signature); setMessage(`已保存 managed-${coordinates.toLowerCase()}.glb，可在控制面板“导入机床模型”中加载，自动识别 ${coordinates} 和轴配置`); } 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 || pending || followLive) 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.joints.every(Number.isFinite) && visual.authoritative && visual.machineModel?.coordinate_system === coordinates; const heldLivePose = useRef(testPose); 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]])) } : followLive ? heldLivePose.current : testPose; if (followLive && liveReady) heldLivePose.current = effectivePose; const validation = useMemo(() => { try { if (Math.abs(tiltOffsetMm[coordinates === "XYZAC" ? 0 : 1]) > 1e-9) throw new Error(coordinates === "XYZAC" ? "AC 机床的 A→C 偏置 X 必须为 0" : "BC 机床的 B→C 偏置 Y 必须为 0"); 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 blockingReason = invalidFields.length ? "请修正标红的数值输入" : validation.error; const bindings = useMemo(() => parts.flatMap((part) => Object.entries(part.nodeJoints ?? {}).map(([path, dof]) => ({ part, path, dof, name: findTreeNode(trees.get(part.id), path)?.name ?? part.filename }))), [parts, trees]); const moveToBinding = (axis: string) => { const binding = bindings.find((b) => b.dof.axis === axis); setTab("structure"); setQuery(""); if (binding) selectTreeNode(binding.part.id, binding.path); else { setMessage(`在层级树中选择 ${axis} 轴关节，再设置唯一自由度`); } }; const changeHistory = (direction: "undo" | "redo") => { if (pending || followLive) return; if (direction === "undo") undo(); else redo(); setMessage(direction === "undo" ? "已撤销配置修改" : "已重做配置修改"); }; const exportJson = () => { if (!validation.model || pending || invalidFields.length) 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); setMessage("关节 JSON 已导出；恢复完整模型请使用“保存机床模型 GLB”"); }; const poseInput = (axis: keyof TestPose, unit: string) => {axis.toUpperCase()} b.dof.axis.toLowerCase() === axis)} value={effectivePose[axis]} onChange={(value) => setTestPose((pose) => ({ ...pose, [axis]: 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)}>

1 · 机床类型

2 · 结构与关节 → 3 · 验证与标定 → 4 · 保存 GLB{coordinates === "XYZAC" ? "A 绕 X 倾转，C 绕 Z 回转" : "B 绕 Y 倾转，C 绕 Z 回转"} · 控制面板当前 {controllerCoordinates}{coordinates !== controllerCoordinates ? "；应用或导入模型时切换" : ""}

{parts.length} 个模型 · {bindings.filter((b) => coordinates.includes(b.dof.axis)).length}/5 轴已绑定{!parts.length ? "新建机床" : applied === signature ? "已应用当前配置" : exported === signature ? "已导出 · 尚未应用" : "配置尚未应用"}

{[...coordinates].map((axis) => { const binding = bindings.find((b) => b.dof.axis === axis); return ; })}

{([ ["fit", "整机适配"], ["selected", "定位选中"], ["front", "正视"], ["top", "俯视"] ] as const).map(([action, label]) => )}Z ↑ · X 红 / Y 绿 / Z 蓝

{open && } {!parts.length &&

建立机床的数字装配

选择机床类型 → 导入 GLB → 绑定关节 → 保存机床模型

支持完整层级 · 单文件不超过 32 MiB

}

左键旋转 · 滚轮缩放 · 右键平移 · 选中关节显示局部坐标系

{([ ["structure", "结构与关节"], ["motion", "运动验证"], ["calibration", "机床标定"] ] as const).map(([id, label], index) => )}

部件与层级

{validation.model?.nodes.length ?? 0} 节点

setQuery(event.target.value)} />

{parts.length ?

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

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

}

{selected &&

{selectedTreeNode?.name ?? selected.filename}{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 && <>父级运动方向正负方向} 节点结构角色{selectedNodePath === "scene" ? 模型装配父级 :

内部节点父级由层级树拖放管理

}

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()]: value })); }} /> {selectedDof &&

步长{([-1, 1] as const).map((direction) => )}

}

} {!selected &&

选择层级节点，配置其唯一自由度。

}

{blockingReason ? `配置检查：${blockingReason}` : "配置检查通过 · 五轴绑定完整"}{disabled && !blockingReason && " · 关机且程序空闲后可应用"}{followLive && " · 实时跟随中，配置编辑已锁定"}{invalidFields.length > 0 && }

{ 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;