feat: 增加标靶数量上限至10个，并更新颜色映射以支持更多线条

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

@@ -53,7 +53,7 @@ const CameraView = ({
    const minScale = 0.2;
    const maxScale = 4.0;
    const scaleStep = 0.1;
-   const maxRectangles = 5;
+   const maxRectangles = 10;
    let streamUrl = `http://${window.location.hostname}:2240/video_flow`;
    // 摄像头流地址
    if (window.env && window.env.FS_FLAG === "localdev") {
@@ -173,7 +173,7 @@ const CameraView = ({
                setDrawing(true);
                setCurrentDrawingRect(null);
             } else {
-               message.warning("已达到标靶数量上限（5个）！");
+               message.warning(`已达到标靶数量上限（${maxRectangles}个）！`);
             }
          }
          e.preventDefault();

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

@@ -46,16 +46,19 @@ const RealtimeCharts = ({ tableData, lastUpdateTime, onDataExport,exportCount =
 
    // 固定的设备颜色映射，确保颜色一致性 - 使用数组下标作为颜色选取依据
    const getDeviceColor = (index) => {
-      // 预定义5种颜色，足够应对最多5条线的需求
+   // 预定义10种颜色，足够应对最多10条线的需求
    const colors = [
       "#52c41a", // 绿色
       "#faad14", // 橙色
       "#f5222d", // 红色
       "#722ed1", // 紫色
       "#13c2c2", // 青色
+      "#eb2f96", // 粉色
+      "#2f54eb", // 靛蓝
+      "#a0d911", // 黄绿
+      "#fa541c", // 火山橙
+      "#8c8c8c", // 灰色
    ];
-
-      // 直接使用传入的数组下标
    return colors[index % colors.length];
    };
 
@@ -94,7 +97,7 @@ const RealtimeCharts = ({ tableData, lastUpdateTime, onDataExport,exportCount =
          // 获取所有设备ID
          const deviceIds = [
             ...new Set(data.map((item) => item?.deviceId).filter(Boolean)),
-         ].sort();
+         ].sort((a, b) => Number(a) - Number(b)); // 数字升序
 
          // 生成时间标签
          const labels = sortedTimes.map((timeKey) => {

package.json

@@ -1,6 +1,6 @@
 {
    "name": "wuyuanbiaoba-web",
-   "version": "1.1.0",
+   "version": "1.1.1",
    "main": "index.html",
    "scripts": {
       "test": "echo \"Error: no test specified\" && exit 1",

server/tcpProxy/index.js

@@ -89,7 +89,17 @@ function setupTcpProxy(conf) {
 
          // console.log('缓冲区剩余数据:', tcpDataBuffer.length, '字节');
       });
-
+      function compactJson(str) {
+         try {
+            // 如果是 JSON 字符串，解析后再 stringify（无换行/缩进）
+            if (typeof str === 'string') return JSON.stringify(JSON.parse(str));
+            // 如果是对象/Buffer等，统一转成无格式 JSON 字符串
+            return JSON.stringify(str);
+         } catch {
+            // 非 JSON 的情况，去掉所有换行，避免触发 \n\n 分隔
+            return String(str).replace(/\r?\n/g, ' ');
+         }
+      }
       // WebSocket接收数据，转发到TCP
       ws.on('message', (data) => {
          // 处理可能的Buffer数据，转换为字符串
@@ -97,29 +107,24 @@ function setupTcpProxy(conf) {
 
          if (Buffer.isBuffer(data)) {
             messageStr = data.toString('utf8');
-            // console.log('WebSocket数据(Buffer转字符串):', messageStr);
          } else if (typeof data === 'string') {
             messageStr = data;
-            // console.log('WebSocket数据(字符串):', messageStr);
          } else {
-            // console.warn('收到未知类型数据，已忽略:', typeof data);
             return;
          }
-
+         messageStr = compactJson(messageStr);
          // 转发字符串数据到TCP服务器
          if (tcpClient.writable) {
             console.log('发送数据到TCP服务器:', messageStr);
 
             // 检查数据大小
-            const dataSize = Buffer.byteLength(messageStr, 'utf8');
+            // const dataSize = Buffer.byteLength(messageStr, 'utf8');
             // console.log(`数据大小: ${dataSize} bytes`);
 
             // 直接发送完整数据
             tcpClient.write(messageStr + '\n\n', (err) => {
                if (err) {
                   console.error(`[${new Date().toLocaleString()}] TCP发送数据错误:`, err);
-               } else {
-                  // console.log('数据已发送到TCP服务器');
                }
             });
          } else {