diff --git a/components/apolloTable/component/DragFixed.tsx b/components/apolloTable/component/DragFixed.tsx index e5c7f2ff742bb0e89b27ed089d620da2f602d24c..ec6f5fa399dbfd2b0974c5a99223aabe4c17c983 100644 --- a/components/apolloTable/component/DragFixed.tsx +++ b/components/apolloTable/component/DragFixed.tsx @@ -36,6 +36,10 @@ const DragFixed = (props: any) => { const onMouseMoveWrap = (e: any) => { // 滑块位置跟随鼠标上下移动 + const handleWrapRect = handleWrap.getBoundingClientRect(); + if (e.clientY < handleWrapRect.y) { + return; + } handle.style.top = `${e.clientY}px`; }; @@ -51,7 +55,7 @@ const DragFixed = (props: any) => { onResizeStart(); } const originLeft = container.getBoundingClientRect().x || 0; - handleWrap.style.top = 0; + // handleWrap.style.top = 0; handleWrap.style.left = `${e.x - originLeft}px`; }; @@ -95,7 +99,7 @@ const DragFixed = (props: any) => { dividerWrap.style.display = 'none'; // 滑块wrap移除hovered样式 handleWrap.classList.remove(styles.hovered); - handleWrap.style.top = `${initTop}px`; + // handleWrap.style.top = `${initTop}px`; handleWrap.style.left = fixedWidth; // 滑块隐藏 handle.style.opacity = 0; diff --git a/components/apolloTable/component/DragResized.less b/components/apolloTable/component/DragResized.less index 773456f0693999064d3cc0f377bf33fa420fd346..11007cea2ab12954f438c536173026520a8906d5 100644 --- a/components/apolloTable/component/DragResized.less +++ b/components/apolloTable/component/DragResized.less @@ -5,10 +5,13 @@ width: 2px; height: 100%; bottom: 0; - right: -1px; + right: 0px; cursor: ew-resize; z-index: 1; background: #ececec; + &.right{ + left: 0px; + } &:hover { background-color: rgb(33, 150, 243); } diff --git a/components/apolloTable/component/DragResized.tsx b/components/apolloTable/component/DragResized.tsx index 102e0803a66297e3f957621c0d49021a2173e6d4..2005fde3e1b4616876151f518307f98a2e9f98a2 100644 --- a/components/apolloTable/component/DragResized.tsx +++ b/components/apolloTable/component/DragResized.tsx @@ -1,10 +1,21 @@ import React from 'react'; +import classNames from 'classnames'; import { ResizableBox } from 'react-resizable'; import { getCache, saveCache } from '../utils/cache'; import styles from './DragResized.less'; const DragResized = (props: any) => { - const { style, columnName, tableId, canResized, onDragResized, onDragResizedCb, cachedFeAttr, columns } = props; + const { + style, + columnName, + tableId, + canResized, + onDragResized, + onDragResizedCb, + cachedFeAttr, + columns, + position, + } = props; if (!canResized) { return