tdesign-vue-next/es/drawer/hooks/index.mjs.map

TDesign Component for vue-next

{"version":3,"file":"index.mjs","sources":["../../../../common/js/drawer/utils.ts","../../../../components/drawer/hooks/index.ts"],"sourcesContent":["type Placement = 'left' | 'right' | 'top' | 'bottom';\n\ninterface SizeDragLimit {\n  max: number;\n  min: number;\n}\n\nexport function getSizeDraggable(sizeDraggable: boolean | SizeDragLimit, limit: { max: number; min: number }) {\n  if (typeof sizeDraggable === 'boolean') {\n    return {\n      allowSizeDraggable: sizeDraggable,\n      max: limit.max,\n      min: limit.min,\n    };\n  }\n\n  return {\n    allowSizeDraggable: true,\n    max: sizeDraggable.max,\n    min: sizeDraggable.min,\n  };\n}\n\ntype IOptions = {\n  x: number;\n  y: number;\n  maxWidth: number;\n  maxHeight: number;\n  min: number;\n  max: number;\n};\n\n// > min && < max\nfunction calcSizeRange(size: number, min: number, max: number) {\n  return Math.min(Math.max(size, min), max);\n}\n\nexport function calcMoveSize(placement: Placement, opts: IOptions) {\n  const { x, y, max, min, maxWidth, maxHeight } = opts;\n  let moveSize: number | undefined;\n  switch (placement) {\n    case 'right':\n      // |<---  x  --->|      |\n      // |     maxWidth       |\n      //               | size |  > min && < max\n      moveSize = calcSizeRange(maxWidth - x, min, max);\n      break;\n    case 'left':\n      // |<--  x -->|  |\n      // x > min && < max\n      moveSize = calcSizeRange(x, min, max);\n      break;\n    case 'top':\n      // - - - - - - - -\n      // |     y        |\n      // |              |\n      // - - - - - - - -\n      //  > min && < max\n      // moveSize = Math.min(Math.max(y, min), max);\n      moveSize = calcSizeRange(y, min, max);\n      break;\n    case 'bottom':\n      // - - - - - - - -\n      // |     y        |\n      // |              |  maxHeight\n      // - - - - - - - -\n      // |    size      |\n      //  > min && < max\n      moveSize = calcSizeRange(maxHeight - y, min, max);\n      break;\n    default:\n      // 参数缺失直接返回\n      return moveSize;\n  }\n  return moveSize;\n}\n","import { computed, ref } from 'vue';\nimport { Styles } from '../../common';\nimport { getSizeDraggable, calcMoveSize } from '@tdesign/common-js/drawer/utils';\nimport type { TdDrawerProps } from '../type';\n\nexport const useDrag = (props: TdDrawerProps) => {\n  // 以下为拖拽改变抽屉大小相关 可以抽成hooks\n  const isSizeDragging = ref(false);\n  const draggedSizeValue = ref<string>(null);\n\n  // 获取当前内容容器的实际尺寸\n  const getCurrentWrapperSize = (e: MouseEvent): string => {\n    const target = e.target as HTMLElement;\n    const wrapper = target?.parentElement as HTMLElement;\n\n    if (!wrapper) return null;\n\n    const isHorizontal = ['right', 'left'].includes(props.placement);\n    const size = isHorizontal ? wrapper.offsetWidth : wrapper.offsetHeight;\n\n    // 计算限制条件\n    const maxHeight = document.documentElement.clientHeight;\n    const maxWidth = document.documentElement.clientWidth;\n    const offsetHeight = 8;\n    const offsetWidth = 8;\n    const max = isHorizontal ? maxWidth : maxHeight;\n    const min = isHorizontal ? offsetWidth : offsetHeight;\n    const { max: limitMax, min: limitMin } = getSizeDraggable(props.sizeDraggable, { max, min });\n\n    // 应用限制条件\n    const limitedSize = Math.max(limitMin, Math.min(limitMax, size));\n    return `${limitedSize}px`;\n  };\n\n  const enableDrag = (e: MouseEvent) => {\n    e.stopPropagation(); // 阻止事件冒泡\n    // 在开始拖拽前，先根据当前容器宽高和限制条件计算出最新的值\n    const currentSize = getCurrentWrapperSize(e);\n    if (currentSize) {\n      draggedSizeValue.value = currentSize;\n    }\n    // mousedown绑定mousemove和mouseup事件\n    document.addEventListener('mouseup', handleMouseup, true);\n    document.addEventListener('mousemove', handleMousemove, true);\n    isSizeDragging.value = true;\n  };\n\n  const handleMouseup = () => {\n    document.removeEventListener('mouseup', handleMouseup, true);\n    document.removeEventListener('mousemove', handleMousemove, true);\n    isSizeDragging.value = false;\n  };\n\n  const handleMousemove = (e: MouseEvent) => {\n    // 鼠标移动时计算draggedSizeValue的值\n    const { x, y } = e;\n    const maxHeight = document.documentElement.clientHeight;\n    const maxWidth = document.documentElement.clientWidth;\n    const offsetHeight = 8;\n    const offsetWidth = 8;\n    // x 轴方向使用最大宽度，y轴方向使用最大高度\n    const max = props.placement === 'left' || props.placement === 'right' ? maxWidth : maxHeight;\n    // x 轴方向使用默认最小宽度，y轴方向使用默认最小高度\n    const min = props.placement === 'left' || props.placement === 'right' ? offsetWidth : offsetHeight;\n    const { allowSizeDraggable, max: limitMax, min: limitMin } = getSizeDraggable(props.sizeDraggable, { max, min });\n\n    // 不支持拖拽就直接返回\n    if (!allowSizeDraggable || !isSizeDragging.value) return;\n\n    const moveSize = calcMoveSize(props.placement, {\n      x,\n      y,\n      maxWidth,\n      maxHeight,\n      max: limitMax,\n      min: limitMin,\n    });\n\n    if (typeof moveSize === 'undefined') return;\n\n    draggedSizeValue.value = `${moveSize}px`;\n    props.onSizeDragEnd?.({\n      e,\n      size: moveSize,\n    });\n  };\n\n  const draggableLineStyles = computed(() => {\n    // 设置拖拽control的样式\n    const isHorizontal = ['right', 'left'].includes(props.placement);\n    const oppositeMap = {\n      left: 'right',\n      right: 'left',\n      top: 'bottom',\n      bottom: 'top',\n    };\n    return {\n      zIndex: 1,\n      position: 'absolute',\n      background: 'transparent',\n      [oppositeMap[props.placement]]: 0,\n      width: isHorizontal ? '16px' : '100%',\n      height: isHorizontal ? '100%' : '16px',\n      cursor: isHorizontal ? 'col-resize' : 'row-resize',\n    } as Styles;\n  });\n\n  const draggingStyles = computed<Styles>(() => (isSizeDragging.value ? { userSelect: 'none' } : {}));\n\n  return {\n    draggedSizeValue,\n    enableDrag,\n    draggableLineStyles,\n    draggingStyles,\n  };\n};\n"],"names":["getSizeDraggable","sizeDraggable","limit","allowSizeDraggable","max","min","calcSizeRange","size","Math","calcMoveSize","placement","opts","x","y","maxWidth","maxHeight","moveSize","useDrag","props","isSizeDragging","ref","draggedSizeValue","getCurrentWrapperSize","e","target","wrapper","parentElement","isHorizontal","includes","offsetWidth","offsetHeight","document","documentElement","clientHeight","clientWidth","_getSizeDraggable","limitMax","limitMin","limitedSize","concat","enableDrag","stopPropagation","currentSize","value","addEventListener","handleMouseup","handleMousemove","removeEventListener","_props$onSizeDragEnd","_getSizeDraggable2","onSizeDragEnd","call","draggableLineStyles","computed","oppositeMap","left","right","top","bottom","_defineProperty","zIndex","position","background","draggingStyles","userSelect"],"mappings":"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"}