diff --git a/components/apolloTable/component/DragSorted.tsx b/components/apolloTable/component/DragSorted.tsx
index 6805674e018a31c636e1eb60213670b134ec46bb..34713955220f0788e5d28a0c0145df4a0b01584b 100644
--- a/components/apolloTable/component/DragSorted.tsx
+++ b/components/apolloTable/component/DragSorted.tsx
@@ -15,6 +15,7 @@ const DragSorted = (props: any) => {
columns,
cachedFeAttr,
position,
+ columnChsName,
} = props;
if (!canSorted || position === 'left' || position === 'right') {
return
{props.children}
;
@@ -100,7 +101,7 @@ const DragSorted = (props: any) => {
}
timerInterval.current = setInterval(() => {
onDragSortedMove(dir, step);
- }, 350);
+ }, 150);
} else {
// 需要停止,清除已有计时器
// eslint-disable-next-line no-lonely-if
@@ -147,8 +148,10 @@ const DragSorted = (props: any) => {
}
// 拖动回调
const newColumns: any[] = [];
- columns.map((item: any) => {
- if (Number(dragColumnOrder) > Number(dropColumnOrder)) {
+ // 从右往左拖
+ if (Number(dragColumnOrder) > Number(dropColumnOrder)) {
+ // columns已排序
+ columns.map((item: any, i: number) => {
if (item.orderNo >= Number(dropColumnOrder) && item.orderNo <= Number(dragColumnOrder)) {
if (item.columnName === dragColumn) {
newColumns.push({
@@ -158,28 +161,34 @@ const DragSorted = (props: any) => {
} else {
newColumns.push({
...item,
- orderNo: item.orderNo + 1,
+ orderNo: columns[i + 1].orderNo,
});
}
} else {
newColumns.push(item);
}
- } else {
+ });
+ } else {
+ // 从左往右拖
+ const index = columns.findIndex((item: any) => {
+ return item.columnName === dropColumn;
+ });
+ columns.map((item: any, i: number) => {
if (item.columnName === dragColumn) {
newColumns.push({
...item,
- orderNo: Number(dropColumnOrder) - 1,
+ orderNo: columns[index - 1].orderNo,
});
- } else if (item.orderNo >= Number(dragColumnOrder) && item.orderNo <= Number(dropColumnOrder)) {
+ } else if (item.orderNo > Number(dragColumnOrder) && item.orderNo < Number(dropColumnOrder)) {
newColumns.push({
...item,
- orderNo: item.orderNo - 1,
+ orderNo: columns[i - 1].orderNo,
});
} else {
newColumns.push(item);
}
- }
- });
+ });
+ }
if (cachedFeAttr) {
const cachedCols = getCache({ tableId });
if (cachedCols) {
@@ -219,6 +228,7 @@ const DragSorted = (props: any) => {
columnCopyDiv.style.left = `${targetRect.x - originLeft}px`;
// 影子div宽度=拖动列宽度
columnCopyDiv.style.width = `${targetRect.width}px`;
+ columnCopyDiv.innerText = columnChsName;
// 鼠标x点与拖动列x点之间的距离(记录下来方便后续使用)
const detaX = curX - targetRect.x;
columnCopyDiv.setAttribute('data-deta-x', String(detaX));
@@ -237,7 +247,7 @@ const DragSorted = (props: any) => {
// 阻止默认行为
e.preventDefault();
},
- [columnName, orderNo],
+ [columnName, orderNo, onMouseMove, onMouseUp],
);
return (
diff --git a/components/apolloTable/component/Table.less b/components/apolloTable/component/Table.less
index 086dbe336a918d8f4f6b66484019c37b63a27fed..5923b09bced3b4c241da83abb71b06ab6ead951f 100644
--- a/components/apolloTable/component/Table.less
+++ b/components/apolloTable/component/Table.less
@@ -109,4 +109,6 @@
background: rgba(0, 0, 0, 0.3);
display: none;
cursor: grab;
+ text-align: center;
+ padding-top: @paddingSmX;
}
diff --git a/components/apolloTable/component/Table.tsx b/components/apolloTable/component/Table.tsx
index e600431d1dc6c369c14bf5a74275b105b9d5cfa4..ba719efa11f8af41ee9cdcc5d8736ef00b4ddb71 100644
--- a/components/apolloTable/component/Table.tsx
+++ b/components/apolloTable/component/Table.tsx
@@ -274,6 +274,7 @@ export default class AirTable extends Component {
>