统一组件图标布局并完善选择吸附交互

frontend/src/componentSymbols/pneumatic.tsx

@@ -8,85 +8,87 @@ import {
 
 const PNEUMATIC_STROKE_WIDTH = 1.7;
 const PNVO001_STROKE = "#8b134f";
+const ORIFICE_CONTENT_SCALE = 0.6;
+const ORIFICE_CONTENT_CENTER = { x: 32, y: 24 } as const;
+const ORIFICE_CONTENT_TRANSFORM = `translate(${ORIFICE_CONTENT_CENTER.x} ${ORIFICE_CONTENT_CENTER.y}) scale(${ORIFICE_CONTENT_SCALE}) translate(${-ORIFICE_CONTENT_CENTER.x} ${-ORIFICE_CONTENT_CENTER.y})`;
 
-function OrificeBody({
-  centerY = 25,
-  leftPortY = centerY,
-}: {
-  centerY?: number;
-  leftPortY?: number;
-}) {
-  const top = centerY - 10;
-  const bottom = centerY + 10;
-  const leftConnector =
-    leftPortY === centerY
-      ? `M2 ${centerY}h18`
-      : `M2 ${leftPortY}h14L20 ${centerY}`;
-
-  return (
-    <>
-      <path
-        d={`${leftConnector}M44 ${centerY}h18M20 ${centerY}h24`}
-        stroke={SYMBOL_STROKE}
-        strokeLinecap="round"
-        strokeWidth={PNEUMATIC_STROKE_WIDTH}
-      />
-      <path
-        d={`M20 ${top}c5 6 9 7 12 7s7-1 12-7M20 ${bottom}c5-6 9-7 12-7s7 1 12 7`}
-        stroke={SYMBOL_STROKE}
-        strokeLinecap="round"
-        strokeWidth={PNEUMATIC_STROKE_WIDTH}
-      />
-    </>
-  );
+function scaledOrificePoint(x: number, y: number) {
+  return {
+    x:
+      ORIFICE_CONTENT_CENTER.x +
+      (x - ORIFICE_CONTENT_CENTER.x) * ORIFICE_CONTENT_SCALE,
+    y:
+      ORIFICE_CONTENT_CENTER.y +
+      (y - ORIFICE_CONTENT_CENTER.y) * ORIFICE_CONTENT_SCALE,
+  };
 }
 
-/** Constant-coefficient pneumatic orifice (AMESim PNOR001). */
-export function AmesimPnor001Symbol() {
-  return (
-    <SymbolSvg className="component-symbol-amesim-pnor001-svg" domain="pneumatic">
-      <OrificeBody centerY={24} />
-    </SymbolSvg>
-  );
-}
+export const PNVO001_PORT_ANCHORS = {
+  physicalLeft: scaledOrificePoint(0, 24),
+  physicalRight: scaledOrificePoint(64, 24),
+  signal: scaledOrificePoint(24.25, 56),
+} as const;
 
-function Pnvo001Body({
-  signalControlled = false,
-}: {
-  signalControlled?: boolean;
-}) {
+type OrificeControl = "none" | "fixed" | "signal";
+
+function Pnvo001Body({ control }: { control: OrificeControl }) {
   return (
-    <>
+    <g
+      data-orifice-control={control}
+      data-orifice-family="pnvo001"
+      transform={ORIFICE_CONTENT_TRANSFORM}
+    >
       <path
-        d="M0 24.5h64"
+        d="M0 24H64"
+        data-orifice-part="flow-path"
         stroke={PNVO001_STROKE}
         strokeLinecap="butt"
-        strokeWidth="2.1"
+        strokeWidth="1.5"
       />
       <path
-        d="M15.5 14.4Q33.4 27 51.2 14.4M15.5 34.8Q33.2 22.4 51.2 34.8"
+        d="M14.4 11Q31.7 27.5 48.7 11M14.4 38Q31.7 18.2 48.7 38"
+        data-orifice-part="curves"
         stroke={PNVO001_STROKE}
         strokeLinecap="round"
         strokeLinejoin="round"
-        strokeWidth="3.1"
+        strokeWidth="2.5"
       />
-      <path
-        d="M19 46.7 44.5 10"
-        stroke={PNVO001_STROKE}
-        strokeLinecap="butt"
-        strokeWidth="2.6"
-      />
-      {signalControlled ? (
+      {control === "none" ? null : (
+        <>
+          <path
+            d="M16.5 54.5 42 3.5"
+            data-orifice-part="opening-arrow"
+            stroke={PNVO001_STROKE}
+            strokeLinecap="butt"
+            strokeWidth="1.5"
+          />
+          <path
+            d="M48 -8 45.8 7.9 37 2.4Z"
+            data-orifice-part="opening-arrow-head"
+            fill={PNVO001_STROKE}
+          />
+        </>
+      )}
+      {control === "signal" ? (
         <path
-          d="M26 48V36.6l7.2 10.1"
+          d="M24.25 56V39L32 54.5"
+          data-orifice-part="signal-control"
           stroke={PNVO001_STROKE}
           strokeLinecap="butt"
           strokeLinejoin="round"
-          strokeWidth="2.3"
+          strokeWidth="1.5"
         />
       ) : null}
-      <path d="M50.6 0 38.6 8.2 48 12.3Z" fill={PNVO001_STROKE} />
-    </>
+    </g>
+  );
+}
+
+/** 定系数气动孔口（AMESim PNOR001）。 */
+export function AmesimPnor001Symbol() {
+  return (
+    <SymbolSvg className="component-symbol-amesim-pnor001-svg" domain="pneumatic">
+      <Pnvo001Body control="none" />
+    </SymbolSvg>
   );
 }
 
@@ -97,7 +99,7 @@ export function AmesimPnvo001FixedSymbol() {
       className="component-symbol-amesim-pnvo001-fixed-svg"
       domain="pneumatic"
     >
-      <Pnvo001Body />
+      <Pnvo001Body control="fixed" />
     </SymbolSvg>
   );
 }
@@ -109,7 +111,7 @@ export function AmesimPnvo001SignalSymbol() {
       className="component-symbol-amesim-pnvo001-signal-svg"
       domain="pneumatic"
     >
-      <Pnvo001Body signalControlled />
+      <Pnvo001Body control="signal" />
     </SymbolSvg>
   );
 }