'commit'

dsLightRag/XingJun/move.html

@@ -54,9 +54,19 @@
         <div class="menu-item" data-point="top-right"><span class="check-mark"></span>右上角</div>
         <div class="menu-item" data-point="bottom-left"><span class="check-mark"></span>左下角</div>
         <div class="menu-item" data-point="bottom-right"><span class="check-mark"></span>右下角</div>
+        <!-- 添加偏移量输入框 -->
+        <div class="menu-separator"></div>
+        <div class="menu-item input-item">
+            <label for="stop-distance">偏移量:</label>
+            <input type="number" id="stop-distance" min="0" max="100" value="20" style="width:60px;margin-left:5px;">
+        </div>
     </div>
 
     <script>
+        // 添加常量定义
+        const ARROW_WIDTH = 155;
+        const ARROW_HEIGHT = 173;
+        const STOP_DISTANCE = 50;
         // 修复核心：整理所有JS代码到单个script标签内
         document.addEventListener('DOMContentLoaded', function() {
             const backgroundContainer = document.querySelector('.background-container');
@@ -321,12 +331,46 @@
                     const currentPoint = selectedArrow.dataset.referencePoint || 'top-left';
                     document.querySelectorAll('.menu-item').forEach(item => {
                         const checkMark = item.querySelector('.check-mark');
+                        if (!checkMark) return; // Add null check
                         if (item.dataset.point === currentPoint) {
                             checkMark.textContent = '✓';
                         } else {
                             checkMark.textContent = '';
                         }
                     });
+                    // 添加偏移量保存逻辑
+                    const stopDistanceInput = document.getElementById('stop-distance');
+                    // 设置输入框当前值
+                    stopDistanceInput.value = selectedArrow.dataset.stopDistance || 20;
+                    // 点击空白处保存偏移量
+                    contextMenu.addEventListener('click', function(e) {
+                        e.stopPropagation(); // 阻止事件冒泡到document
+                    });
+                    
+                    // 修改输入框事件处理，添加失去焦点时保存
+                    // Single declaration at the top
+                    //const stopDistanceInput = document.getElementById('stop-distance');
+                    
+                    // Later in your code (no redeclaration)
+                    stopDistanceInput.addEventListener('blur', function() {
+                        if (selectedArrow) {
+                            selectedArrow.dataset.stopDistance = this.value;
+                            console.log(`[设置] 停止半径: ${this.value}px`);
+                            saveAllElements(); // 立即保存
+                        }
+                    });
+                    
+                    // 修改原有点击保存逻辑，仅在点击菜单外部时触发
+                    function saveStopDistance(e) {
+                        if (!contextMenu.contains(e.target)) {
+                            if (selectedArrow) {
+                                selectedArrow.dataset.stopDistance = stopDistanceInput.value;
+                                console.log(`[设置] 停止半径: ${stopDistanceInput.value}px`);
+                            }
+                            document.removeEventListener('click', saveStopDistance);
+                            contextMenu.style.display = 'none';
+                        }
+                    }
                 });
 
                 // 拖拽功能
@@ -388,7 +432,8 @@
                         left: left + centerOffsetX,
                         top: top + centerOffsetY,
                         text: arrow.dataset.text || '',
-                        referencePoint: arrow.dataset.referencePoint || 'top-left' // 默认左上角
+                        referencePoint: arrow.dataset.referencePoint || 'top-left', // 默认左上角
+                        stopDistance: arrow.dataset.stopDistance || 20 // 添加此行保存偏移量
                     });
                 });
 
@@ -427,6 +472,10 @@
                             left: item.left - centerOffsetX,
                             top: item.top - centerOffsetY
                         }, item.text);
+                        // 添加停止距离加载
+                        const arrows = backgroundContainer.querySelectorAll('.arrow-container');
+                        const lastArrow = arrows[arrows.length - 1];
+                        lastArrow.dataset.stopDistance = item.stopDistance || 20;
                     } else if (item.type === 'center') {
                         // 创建中心点
                         centerDot = document.createElement('div');
@@ -435,13 +484,41 @@
                         centerDot.style.top = item.top;
                         backgroundContainer.appendChild(centerDot);
                         console.log('[加载] 已恢复中心点:', item);
-                        centerDotExists = true; // 添加此行
+                        centerDotExists = true; // 添加变量声明
                         saveAllElements(); // 添加此行
                     }
                 });
             }
         }); // DOMContentLoaded回调结束
             // 确保这里没有残留的startAnimation函数定义
+            function animateArrow(arrow) {
+                // 获取自定义停止半径
+                const stopDistance = parseFloat(arrow.dataset.stopDistance) || 20;
+                const centerX = parseFloat(centerDot.style.left) || 0;
+                const centerY = parseFloat(centerDot.style.top) || 0;
+                
+                // 获取箭头当前位置和参照点
+                let currentX = parseFloat(arrow.style.left);
+                let currentY = parseFloat(arrow.style.top);
+                const referencePoint = arrow.dataset.referencePoint || 'top-left';
+                
+                // 根据参照点计算实际位置
+                if (referencePoint === 'top-right') currentX += 155;
+                if (referencePoint === 'bottom-left') currentY += 173;
+                if (referencePoint === 'bottom-right') { currentX += 155; currentY += 173; }
+                
+                // 计算距离
+                const dx = centerX - currentX;
+                const dy = centerY - currentY;
+                const distance = Math.sqrt(dx * dx + dy * dy);
+                
+                // 判断是否到达停止距离
+                if (distance > stopDistance) {
+                    // 移动逻辑...
+                } else {
+                    return true; // 已停止
+                }
+            }
     </script>
 </body>
 </html>