feat: 标靶数量限制放大到20，修复标靶命名bug

client/src/sections/wuyuanbiaoba/components/CameraView.jsx

@@ -3,6 +3,31 @@ import { useWebSocket } from "../actions/websocket.jsx";
 import { message } from "antd";
 // import { useTargetStorage } from "../hooks/useTargetStorage.js";
 
+const MAX_RECTANGLES = 20;
+
+const getNextTargetNameIndex = (rectangles) => {
+   return rectangles.reduce((maxIndex, rectangle) => {
+      const match = /^T_(\d+)$/i.exec(String(rectangle?.name || ""));
+      return match ? Math.max(maxIndex, Number(match[1])) : maxIndex;
+   }, 0) + 1;
+};
+
+const getNextTargetId = (rectangles) => {
+   const usedIds = new Set(
+      rectangles
+         .map((rectangle) => rectangle?.id ?? rectangle?.key)
+         .filter((id) => id !== undefined && id !== null && id !== "")
+         .map((id) => String(id))
+   );
+
+   let sequence = 1;
+   while (usedIds.has(`10${sequence}`)) {
+      sequence += 1;
+   }
+
+   return `10${sequence}`;
+};
+
 const CameraView = ({
    selectedTargetId,
    onClearSelection,
@@ -73,7 +98,7 @@ const CameraView = ({
    const minScale = 0.2;
    const maxScale = 4.0;
    const scaleStep = 0.1;
-   const maxRectangles = 10;
+   const maxRectangles = MAX_RECTANGLES;
    let streamUrl = `http://${window.location.hostname}:2240/video_flow`;
    // 摄像头流地址
    if (window.env && window.env.FS_FLAG === "localdev") {
@@ -350,15 +375,14 @@ const CameraView = ({
 
       const videoRect = screenToVideoCoordinates(x, y, w, h);
       if (videoRect && rectangles.length < maxRectangles) {
-         const nextIndex = Number(rectangles[rectangles.length - 1]?.id)
-            ? Number(rectangles[rectangles.length - 1]?.id) - 100 + 1
-            : 1;
-         const fixedId = `10${nextIndex}`;
+         // 名称序号与设备协议 ID 分开计算，避免第 10 个以后发生拼接错误。
+         const nextNameIndex = getNextTargetNameIndex(rectangles);
+         const fixedId = getNextTargetId(rectangles);
          // 根据选中的模板预设参数
          const templateParams = selectedTemplate
             ? {
                // 从模板中获取参数
-                 name: `T_${nextIndex}` || selectedTemplate.name,
+               name: `T_${nextNameIndex}`,
                radius: selectedTemplate.physicalRadius || 40.0,
                isReferencePoint: selectedTemplate.isBaseline || false,
                gradientThreshold: selectedTemplate.gradientThresholdValue,
@@ -369,7 +393,7 @@ const CameraView = ({
             }
             : {
                // 默认参数
-                 name: `T_${nextIndex}`,
+               name: `T_${nextNameIndex}`,
                radius: 40.0,
                isReferencePoint: false,
                gradientThreshold: 100,