// export default {
//   bind(el) {
//     let startPosition = { x: 0, y: 0 };
//     let dialogPosition = { x: 0, y: 0 };
//     let dragging = false;
 
//     const handleMouseDown = (e) => {
//       startPosition.x = e.clientX;
//       startPosition.y = e.clientY;
//       dialogPosition.x = parseInt(el.style.left, 10) || 0;
//       dialogPosition.y = parseInt(el.style.top, 10) || 0;
 
//       document.addEventListener('mousemove', handleMouseMove);
//       document.addEventListener('mouseup', handleMouseUp);
 
//       dragging = true;
 
//       e.stopPropagation();
//       e.preventDefault();
//     };
 
//     const handleMouseMove = (e) => {
//       if (dragging) {
//         const offsetX = e.clientX - startPosition.x;
//         const offsetY = e.clientY - startPosition.y;
//         el.style.left = `${dialogPosition.x + offsetX}px`;
//         el.style.top = `${dialogPosition.y + offsetY}px`;
//       }
//     };
 
//     const handleMouseUp = () => {
//       document.removeEventListener('mousemove', handleMouseMove);
//       document.removeEventListener('mouseup', handleMouseUp);
//       dragging = false;
//     };
 
//     el.addEventListener('mousedown', handleMouseDown);
//   },
// }

export default {
  bind(el, binding) {
    let startPosition = { x: 0, y: 0 };
    let dialogPosition = { x: 0, y: 0 };
    let dragging = false;
 
    const handleMouseDown = (e) => {
      startPosition.x = e.clientX;
      startPosition.y = e.clientY;
      dialogPosition.x = parseInt(el.style.left, 10) || 0;
      dialogPosition.y = parseInt(el.style.top, 10) || 0;
 
      document.addEventListener('mousemove', handleMouseMove);
      document.addEventListener('mouseup', handleMouseUp);
 
      dragging = true;
 
      e.stopPropagation();
      e.preventDefault();
    };
 
    const handleMouseMove = (e) => {
      if (dragging) {
        const offsetX = e.clientX - startPosition.x;
        const offsetY = e.clientY - startPosition.y;
        el.style.left = `${dialogPosition.x + offsetX}px`;
        el.style.top = `${dialogPosition.y + offsetY}px`;
        
        // 如果有拖动回调函数，则调用
        if (binding.value && typeof binding.value === 'object' && binding.value.onDrag) {
          binding.value.onDrag({
            x: dialogPosition.x + offsetX,
            y: dialogPosition.y + offsetY
          });
        }
      }
    };
 
    const handleMouseUp = () => {
      document.removeEventListener('mousemove', handleMouseMove);
      document.removeEventListener('mouseup', handleMouseUp);
      dragging = false;
      
      // 获取最终位置
      const finalLeft = parseInt(el.style.left, 10) || 0;
      const finalTop = parseInt(el.style.top, 10) || 0;
      
      // 如果有拖动结束回调函数，则调用
      if (binding.value && typeof binding.value === 'object' && binding.value.onStop) {
        binding.value.onStop({
          x: finalLeft,
          y: finalTop
        });
      }
    };
 
    el.addEventListener('mousedown', handleMouseDown);
  },
  
  unbind(el) {
    // 清理事件监听器
    const oldMouseDownHandler = el._mousedownHandler;
    if (oldMouseDownHandler) {
      el.removeEventListener('mousedown', oldMouseDownHandler);
      delete el._mousedownHandler;
    }
  }
}