Add AC/BC RTCP programs and 3D machine manager

web/react/src/TrtGeometryPanel.tsx

@@ -1,11 +1,13 @@
 import { useEffect, useMemo, useRef, useState } from "react";
 import { readTrtGeometry, writeTrtGeometry, TRT_GEOMETRY_KEYS } from "../../workspace/trt-geometry.mjs";
+import { DraggableDialog } from "./DraggableDialog";
 import { axisIcon } from "./sourceAssets";
 
 type Bundle = { entrypoint: string; files: Record<string, string>; source_ini?: string };
 type Props = { bundle: Bundle | null; disabled: boolean; busy: boolean; onApply: (bundle: Bundle) => Promise<void>; onReload: () => Promise<void> };
 
 export function TrtGeometryPanel({ bundle, disabled, busy, onApply, onReload }: Props) {
+  const [open, setOpen] = useState(false);
   const [values, setValues] = useState<Record<string, string>>({});
   const [message, setMessage] = useState("");
   const [pending, setPending] = useState(false);
@@ -47,6 +49,8 @@ export function TrtGeometryPanel({ bundle, disabled, busy, onApply, onReload }:
   };
   const tool = (id: string, label: string, asset: string, action: () => void, off = locked) => <button type="button" data-axis-control={`geometry-${id}`} aria-label={label} title={label} disabled={off} onClick={action}><img src={axisIcon(asset)} alt="" /></button>;
   return <section className="trt-geometry" aria-label="机床几何参数" aria-busy={pending || busy} data-dirty={dirty}>
+    <div className="trt-geometry-toolbar"><button type="button" data-axis-control="geometry-settings" aria-haspopup="dialog" onClick={() => setOpen(true)}>机床参数</button></div>
+    <DraggableDialog open={open} title="机床几何参数" className="geometry-dialog" onClose={() => setOpen(false)}>
     <header><strong>{bundle?.entrypoint.split("/").at(-1) ?? "INI"}</strong><span>mm</span><output>{dirty ? "待应用" : "已生效"}</output></header>
     <div className="trt-geometry-fields">{["旋转中心", "轴间偏置"].map((title, index) => <fieldset key={title}><legend>{title}</legend>{TRT_GEOMETRY_KEYS.slice(index * 3, index * 3 + 3).map((key: string) => <label key={key} title={key === geometry?.unsupported ? "此机型原生运动学不使用该偏置" : key.replaceAll("_", "-")}><span>{key.replaceAll("_", "-")}</span><input aria-label={key.replaceAll("_", "-")} type="number" step="any" disabled={locked || key === geometry?.unsupported} value={values[key] ?? "0"} onChange={(e) => setValues({ ...values, [key]: e.target.value })} /></label>)}</fieldset>)}</div>
     <footer>
@@ -65,5 +69,6 @@ export function TrtGeometryPanel({ bundle, disabled, busy, onApply, onReload }:
         setValues(Object.fromEntries(TRT_GEOMETRY_KEYS.map((key: string) => [key, String(imported.offsets[key])])));
       }, "INI 参数已导入，待应用");
     }} />
+    </DraggableDialog>
   </section>;
 }