From a18fde7abf366eeb2b035fa2223d7e4446d9b647 Mon Sep 17 00:00:00 2001
From: zhangwenshuai <zhangwenshuai@mttop.cn>
Date: Mon, 10 Aug 2020 19:26:23 +0800
Subject: [PATCH] update

---
 .../apolloTable/component/DragSorted.tsx      | 32 ++++++++++++-------
 components/apolloTable/component/Table.less   |  2 ++
 components/apolloTable/component/Table.tsx    |  1 +
 3 files changed, 24 insertions(+), 11 deletions(-)

diff --git a/components/apolloTable/component/DragSorted.tsx b/components/apolloTable/component/DragSorted.tsx
index 6805674..3471395 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 <div className={s.sortedWrap}>{props.children}</div>;
@@ -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 086dbe3..5923b09 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 e600431..ba719ef 100644
--- a/components/apolloTable/component/Table.tsx
+++ b/components/apolloTable/component/Table.tsx
@@ -274,6 +274,7 @@ export default class AirTable extends Component<TableProps, TableState> {
             >
                 <DragSorted
                     columnName={columnName}
+                    columnChsName={columnChsName}
                     orderNo={orderNo}
                     canSorted={canSorted}
                     onDragSorted={onDragSorted}
-- 
2.21.0