diff --git a/components/apolloTable/component/DragSorted.tsx b/components/apolloTable/component/DragSorted.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..0fd5bc16b4aeb40fad2b0923bd63f76d1d252cd1
--- /dev/null
+++ b/components/apolloTable/component/DragSorted.tsx
@@ -0,0 +1,28 @@
+import React, { useCallback } from 'react';
+import { Draggable } from 'react-beautiful-dnd';
+
+const DragSorted = (props) => {
+    // using useCallback is optional
+    const onBeforeCapture = useCallback(() => {}, []);
+    const onBeforeDragStart = useCallback(() => {}, []);
+    const onDragStart = useCallback(() => {
+        debugger;
+    }, []);
+    const onDragUpdate = useCallback(() => {}, []);
+    const onDragEnd = useCallback(() => {}, []);
+
+    return (
+        <Draggable draggableId="draggable-1" index={0}>
+            {(provided, snapshot) => (
+                <div
+                    ref={provided.innerRef}
+                    {...provided.draggableProps}
+                    {...provided.dragHandleProps}
+                >
+                    {props.children}
+                </div>
+            )}
+        </Draggable>
+    );
+};
+export default DragSorted;
diff --git a/components/apolloTable/component/Table.tsx b/components/apolloTable/component/Table.tsx
index 04a35b81d8cd39e15b1e3be32a71101a1eb27cf9..b2628d1ce791ce86c0e45fd268b0709a1d501289 100644
--- a/components/apolloTable/component/Table.tsx
+++ b/components/apolloTable/component/Table.tsx
@@ -2,6 +2,7 @@ import React, { Component } from 'react';
 import classNames from 'classnames';
 import memoizeOne from 'memoize-one';
 import { Empty, Spin } from 'antd';
+import { DragDropContext, Droppable } from 'react-beautiful-dnd';
 import { ScrollSync, Grid, AutoSizer } from 'react-virtualized';
 import { Resizable, ResizableBox } from 'react-resizable';
 import _ from 'lodash';
@@ -11,6 +12,7 @@ import { TableProps, TableState, ColumnProps, RowProps } from './interface';
 import Column from './Column';
 import Cell from './Cell';
 import LeftDragFixed from './DragFixed';
+import DragSorted from './DragSorted';
 import { getMergeClassName, getMergeStyle } from '../utils/utils';
 import { Consumer } from './context';
 
@@ -302,38 +304,40 @@ export default class AirTable extends Component<TableProps, TableState> {
         } = showColumns[columnIndex];
         return (
             <div className={styles.headerCell} key={key} style={style}>
-                <ResizableBox
-                    width={style.width}
-                    handle={
-                        <span
-                            className={styles.handleWidth}
-                            onClick={(e) => {
-                                e.stopPropagation();
-                            }}
+                <DragSorted>
+                    <ResizableBox
+                        width={style.width}
+                        handle={
+                            <span
+                                className={styles.handleWidth}
+                                onClick={(e) => {
+                                    e.stopPropagation();
+                                }}
+                            />
+                        }
+                        minConstraints={[100, 100]}
+                        onResize={this.onResizeWidth}
+                        onResizeStart={this.onResizeWidthStart}
+                        onResizeStop={this.onResizeWidthStop.bind(this, columnName)}
+                        draggableOpts={{ enableUserSelectHack: false }}
+                    >
+                        <Column
+                            columnType={String(columnType)}
+                            columnName={columnName}
+                            columnChsName={columnChsName}
+                            columnAttrObj={columnAttrObj}
+                            sortFlag={sortFlag}
+                            sortConfig={sortConfig}
+                            columnIndex={columnIndex}
+                            showIndex={position === 'right' ? false : showIndex}
+                            questionText={questionText}
+                            rowSelection={position === 'right' ? false : rowSelection}
+                            dataSource={dataSource}
+                            icon={icon}
+                            required={requiredFlag}
                         />
-                    }
-                    minConstraints={[100, 100]}
-                    onResize={this.onResizeWidth}
-                    onResizeStart={this.onResizeWidthStart}
-                    onResizeStop={this.onResizeWidthStop.bind(this, columnName)}
-                    draggableOpts={{ enableUserSelectHack: false }}
-                >
-                    <Column
-                        columnType={String(columnType)}
-                        columnName={columnName}
-                        columnChsName={columnChsName}
-                        columnAttrObj={columnAttrObj}
-                        sortFlag={sortFlag}
-                        sortConfig={sortConfig}
-                        columnIndex={columnIndex}
-                        showIndex={position === 'right' ? false : showIndex}
-                        questionText={questionText}
-                        rowSelection={position === 'right' ? false : rowSelection}
-                        dataSource={dataSource}
-                        icon={icon}
-                        required={requiredFlag}
-                    />
-                </ResizableBox>
+                    </ResizableBox>
+                </DragSorted>
             </div>
         );
     };
@@ -470,300 +474,344 @@ export default class AirTable extends Component<TableProps, TableState> {
                     <ScrollSync>
                         {({ onScroll, scrollLeft, scrollTop }: any) => {
                             return (
-                                <div
-                                    className={
-                                        this.props.onScroll
-                                            ? classNames(styles.tableContainer, styles.scroll)
-                                            : styles.tableContainer
-                                    }
-                                    style={{
-                                        paddingRight: this.props.onScroll ? paddingRight : 0,
-                                    }}
-                                    id="tableContainer"
-                                    ref={(dom) => {
-                                        this.tableContainer = dom;
-                                    }}
-                                >
-                                    {totalWidth > tableWidth && leftCount > 0 && (
-                                        <div
-                                            className={styles.leftSideContainer}
-                                            style={{
-                                                width: `${leftWidth}px`,
-                                                height: `${totalHeight - scrollbarWidth + headerHeight}px`,
-                                            }}
-                                        >
-                                            {
-                                                // 左侧表头
+                                <DragDropContext>
+                                    <Droppable droppableId="droppable-1" type="PERSON">
+                                        {(provided, snapshot) => (
+                                            <div
+                                                ref={provided.innerRef}
+                                                style={{ backgroundColor: snapshot.isDraggingOver ? 'blue' : 'grey' }}
+                                                {...provided.droppableProps}
+                                            >
                                                 <div
-                                                    className={styles.leftSideHeaderContainer}
+                                                    className={
+                                                        this.props.onScroll
+                                                            ? classNames(styles.tableContainer, styles.scroll)
+                                                            : styles.tableContainer
+                                                    }
                                                     style={{
-                                                        left: 0,
+                                                        paddingRight: this.props.onScroll ? paddingRight : 0,
                                                     }}
-                                                >
-                                                    <Grid
-                                                        ref={(dom: any) => {
-                                                            this.grid1 = dom;
-                                                        }}
-                                                        className={styles.headerGrid}
-                                                        columnWidth={this.getColumnWidth.bind(this, {
-                                                            columns: showColumns,
-                                                            showColumns: leftColumns,
-                                                        })}
-                                                        columnCount={leftCount}
-                                                        width={leftWidth}
-                                                        rowHeight={headerHeight}
-                                                        rowCount={1}
-                                                        height={headerHeight}
-                                                        cellRenderer={this.renderHeaderCell.bind(this, {
-                                                            showColumns: leftColumns,
-                                                        })}
-                                                    />
-                                                </div>
-                                            }
-                                            {
-                                                // 左侧固定列
-                                                <div
-                                                    className={styles.leftSideGridContainer}
-                                                    style={{
-                                                        left: 0,
-                                                        top: headerHeight,
+                                                    id="tableContainer"
+                                                    ref={(dom) => {
+                                                        this.tableContainer = dom;
                                                     }}
                                                 >
-                                                    <Grid
-                                                        ref={(dom: any) => {
-                                                            this.grid2 = dom;
-                                                        }}
-                                                        className={styles.sideGrid}
-                                                        overscanRowCount={overscanRowCount}
-                                                        cellRenderer={this.renderBodyCell.bind(this, {
-                                                            showColumns: leftColumns,
-                                                            showData: leftData,
-                                                            position: 'left',
-                                                        })}
-                                                        columnWidth={this.getColumnWidth.bind(this, {
-                                                            columns: showColumns,
-                                                            showColumns: leftColumns,
-                                                        })}
-                                                        onScroll={(...arg: Array<Object>) => {
-                                                            onScroll({ scrollTop: arg[0].scrollTop });
-                                                            this.onScroll(arg[0]);
-                                                        }}
-                                                        columnCount={leftCount}
-                                                        width={leftWidth + scrollbarWidth}
-                                                        rowHeight={rowHeight}
-                                                        rowCount={rowCount}
-                                                        height={totalHeight - scrollbarWidth}
-                                                        scrollTop={scrollTop}
-                                                    />
-                                                </div>
-                                            }
-                                        </div>
-                                    )}
-                                    {canFixed && (
-                                        <LeftDragFixed
-                                            initLeft={leftWidth}
-                                            initTop={headerHeight}
-                                            tableWidth={tableWidth}
-                                            showColumns={showColumns}
-                                            columnWidth={columnWidth}
-                                            columns={columns}
-                                            onResizeStart={this.onResizeStartLeftDragFixed}
-                                            onResizeStop={this.onResizeStopLeftDragFixed}
-                                        />
-                                    )}
-                                    <div className={styles.centerContainer}>
-                                        <AutoSizer onResize={this.onResize}>
-                                            {({ width, height }: any) => {
-                                                return (
-                                                    <div>
-                                                        {
-                                                            // 中部表头
-                                                            <div
-                                                                style={{
-                                                                    backgroundColor: 'rgba(246, 246, 246, 1)',
-                                                                    height: headerHeight,
-                                                                    width,
-                                                                }}
-                                                            >
-                                                                <Grid
-                                                                    ref={(dom: any) => {
-                                                                        this.grid3 = dom;
+                                                    {totalWidth > tableWidth && leftCount > 0 && (
+                                                        <div
+                                                            className={styles.leftSideContainer}
+                                                            style={{
+                                                                width: `${leftWidth}px`,
+                                                                height: `${totalHeight -
+                                                                    scrollbarWidth +
+                                                                    headerHeight}px`,
+                                                            }}
+                                                        >
+                                                            {
+                                                                // 左侧表头
+                                                                <div
+                                                                    className={styles.leftSideHeaderContainer}
+                                                                    style={{
+                                                                        left: 0,
+                                                                    }}
+                                                                >
+                                                                    <Grid
+                                                                        ref={(dom: any) => {
+                                                                            this.grid1 = dom;
+                                                                        }}
+                                                                        className={styles.headerGrid}
+                                                                        columnWidth={this.getColumnWidth.bind(this, {
+                                                                            columns: showColumns,
+                                                                            showColumns: leftColumns,
+                                                                        })}
+                                                                        columnCount={leftCount}
+                                                                        width={leftWidth}
+                                                                        rowHeight={headerHeight}
+                                                                        rowCount={1}
+                                                                        height={headerHeight}
+                                                                        cellRenderer={this.renderHeaderCell.bind(this, {
+                                                                            showColumns: leftColumns,
+                                                                        })}
+                                                                    />
+                                                                </div>
+                                                            }
+                                                            {
+                                                                // 左侧固定列
+                                                                <div
+                                                                    className={styles.leftSideGridContainer}
+                                                                    style={{
+                                                                        left: 0,
+                                                                        top: headerHeight,
                                                                     }}
-                                                                    className={styles.headerGrid}
-                                                                    overscanColumnCount={overscanColumnCount}
-                                                                    columnWidth={this.getColumnWidth.bind(this, {
-                                                                        columns: showColumns,
-                                                                        showColumns,
-                                                                    })}
-                                                                    columnCount={columnCount}
-                                                                    width={width}
-                                                                    rowHeight={headerHeight}
-                                                                    rowCount={1}
-                                                                    height={headerHeight}
-                                                                    scrollLeft={scrollLeft}
-                                                                    cellRenderer={this.renderHeaderCell.bind(this, {
-                                                                        showColumns,
-                                                                    })}
-                                                                />
-                                                            </div>
-                                                        }
-                                                        {
-                                                            // 中部内容
-                                                            <div
-                                                                style={{
-                                                                    height: totalHeight,
-                                                                    // height: height - headerHeight,
-                                                                    // minHeight:
-                                                                    //     !dataSource || dataSource.length === 0
-                                                                    //         ? '300px'
-                                                                    //         : 'auto',
-                                                                    width: tableWidth,
-                                                                }}
-                                                            >
-                                                                {rowCount > 0 ? (
+                                                                >
                                                                     <Grid
                                                                         ref={(dom: any) => {
-                                                                            this.grid4 = dom;
+                                                                            this.grid2 = dom;
                                                                         }}
-                                                                        className={styles.centerGrid}
-                                                                        overscanColumnCount={overscanColumnCount}
+                                                                        className={styles.sideGrid}
                                                                         overscanRowCount={overscanRowCount}
+                                                                        cellRenderer={this.renderBodyCell.bind(this, {
+                                                                            showColumns: leftColumns,
+                                                                            showData: leftData,
+                                                                            position: 'left',
+                                                                        })}
                                                                         columnWidth={this.getColumnWidth.bind(this, {
                                                                             columns: showColumns,
-                                                                            showColumns,
+                                                                            showColumns: leftColumns,
                                                                         })}
-                                                                        columnCount={columnCount}
-                                                                        width={realWidth}
-                                                                        rowHeight={rowHeight}
-                                                                        rowCount={rowCount}
                                                                         onScroll={(...arg: Array<Object>) => {
-                                                                            onScroll(...arg);
+                                                                            onScroll({ scrollTop: arg[0].scrollTop });
                                                                             this.onScroll(arg[0]);
                                                                         }}
+                                                                        columnCount={leftCount}
+                                                                        width={leftWidth + scrollbarWidth}
+                                                                        rowHeight={rowHeight}
+                                                                        rowCount={rowCount}
+                                                                        height={totalHeight - scrollbarWidth}
                                                                         scrollTop={scrollTop}
-                                                                        height={totalHeight}
+                                                                    />
+                                                                </div>
+                                                            }
+                                                        </div>
+                                                    )}
+                                                    {canFixed && (
+                                                        <LeftDragFixed
+                                                            initLeft={leftWidth}
+                                                            initTop={headerHeight}
+                                                            tableWidth={tableWidth}
+                                                            showColumns={showColumns}
+                                                            columnWidth={columnWidth}
+                                                            columns={columns}
+                                                            onResizeStart={this.onResizeStartLeftDragFixed}
+                                                            onResizeStop={this.onResizeStopLeftDragFixed}
+                                                        />
+                                                    )}
+                                                    <div className={styles.centerContainer}>
+                                                        <AutoSizer onResize={this.onResize}>
+                                                            {({ width, height }: any) => {
+                                                                return (
+                                                                    <div>
+                                                                        {
+                                                                            // 中部表头
+                                                                            <div
+                                                                                style={{
+                                                                                    backgroundColor:
+                                                                                        'rgba(246, 246, 246, 1)',
+                                                                                    height: headerHeight,
+                                                                                    width,
+                                                                                }}
+                                                                            >
+                                                                                <Grid
+                                                                                    ref={(dom: any) => {
+                                                                                        this.grid3 = dom;
+                                                                                    }}
+                                                                                    className={styles.headerGrid}
+                                                                                    overscanColumnCount={
+                                                                                        overscanColumnCount
+                                                                                    }
+                                                                                    columnWidth={this.getColumnWidth.bind(
+                                                                                        this,
+                                                                                        {
+                                                                                            columns: showColumns,
+                                                                                            showColumns,
+                                                                                        },
+                                                                                    )}
+                                                                                    columnCount={columnCount}
+                                                                                    width={width}
+                                                                                    rowHeight={headerHeight}
+                                                                                    rowCount={1}
+                                                                                    height={headerHeight}
+                                                                                    scrollLeft={scrollLeft}
+                                                                                    cellRenderer={this.renderHeaderCell.bind(
+                                                                                        this,
+                                                                                        {
+                                                                                            showColumns,
+                                                                                        },
+                                                                                    )}
+                                                                                />
+                                                                            </div>
+                                                                        }
+                                                                        {
+                                                                            // 中部内容
+                                                                            <div
+                                                                                style={{
+                                                                                    height: totalHeight,
+                                                                                    // height: height - headerHeight,
+                                                                                    // minHeight:
+                                                                                    //     !dataSource || dataSource.length === 0
+                                                                                    //         ? '300px'
+                                                                                    //         : 'auto',
+                                                                                    width: tableWidth,
+                                                                                }}
+                                                                            >
+                                                                                {rowCount > 0 ? (
+                                                                                    <Grid
+                                                                                        ref={(dom: any) => {
+                                                                                            this.grid4 = dom;
+                                                                                        }}
+                                                                                        className={styles.centerGrid}
+                                                                                        overscanColumnCount={
+                                                                                            overscanColumnCount
+                                                                                        }
+                                                                                        overscanRowCount={
+                                                                                            overscanRowCount
+                                                                                        }
+                                                                                        columnWidth={this.getColumnWidth.bind(
+                                                                                            this,
+                                                                                            {
+                                                                                                columns: showColumns,
+                                                                                                showColumns,
+                                                                                            },
+                                                                                        )}
+                                                                                        columnCount={columnCount}
+                                                                                        width={realWidth}
+                                                                                        rowHeight={rowHeight}
+                                                                                        rowCount={rowCount}
+                                                                                        onScroll={(
+                                                                                            ...arg: Array<Object>
+                                                                                        ) => {
+                                                                                            onScroll(...arg);
+                                                                                            this.onScroll(arg[0]);
+                                                                                        }}
+                                                                                        scrollTop={scrollTop}
+                                                                                        height={totalHeight}
+                                                                                        cellRenderer={this.renderBodyCell.bind(
+                                                                                            this,
+                                                                                            {
+                                                                                                showColumns,
+                                                                                                showData,
+                                                                                                position: 'center',
+                                                                                            },
+                                                                                        )}
+                                                                                    />
+                                                                                ) : (
+                                                                                    columnCount > 0 &&
+                                                                                    !loading && (
+                                                                                        <Empty
+                                                                                            className={
+                                                                                                styles.defaultEmpty
+                                                                                            }
+                                                                                            description={
+                                                                                                noDataPlaceholder ||
+                                                                                                locale.empty
+                                                                                            }
+                                                                                        />
+                                                                                    )
+                                                                                )}
+                                                                            </div>
+                                                                        }
+                                                                    </div>
+                                                                );
+                                                            }}
+                                                        </AutoSizer>
+                                                    </div>
+                                                    {totalWidth > tableWidth && rightCount > 0 && (
+                                                        <div
+                                                            className={styles.rightSideContainer}
+                                                            style={{
+                                                                width: `${rightWidth}px`,
+                                                                height: `${totalHeight -
+                                                                    scrollbarWidth +
+                                                                    headerHeight}px`,
+                                                            }}
+                                                        >
+                                                            {
+                                                                // 右侧表头
+                                                                <div
+                                                                    className={styles.rightSideHeaderContainer}
+                                                                    style={{
+                                                                        right: 0,
+                                                                    }}
+                                                                >
+                                                                    <Grid
+                                                                        ref={(dom: any) => {
+                                                                            this.grid5 = dom;
+                                                                        }}
+                                                                        className={styles.headerGrid}
+                                                                        columnWidth={this.getColumnWidth.bind(this, {
+                                                                            columns: showColumns,
+                                                                            showColumns: rightColumns,
+                                                                        })}
+                                                                        columnCount={rightCount}
+                                                                        width={rightWidth}
+                                                                        rowHeight={headerHeight}
+                                                                        rowCount={1}
+                                                                        height={headerHeight}
+                                                                        cellRenderer={this.renderHeaderCell.bind(this, {
+                                                                            showColumns: rightColumns,
+                                                                            position: 'right',
+                                                                        })}
+                                                                    />
+                                                                </div>
+                                                            }
+                                                            {
+                                                                // 右侧固定列
+                                                                <div
+                                                                    className={styles.rightSideGridContainer}
+                                                                    style={{
+                                                                        position: 'absolute',
+                                                                        right: 0,
+                                                                        top: headerHeight,
+                                                                        marginRight: -scrollbarWidth,
+                                                                    }}
+                                                                >
+                                                                    <Grid
+                                                                        ref={(dom: any) => {
+                                                                            this.grid6 = dom;
+                                                                        }}
+                                                                        className={styles.sideGrid}
+                                                                        overscanRowCount={overscanRowCount}
                                                                         cellRenderer={this.renderBodyCell.bind(this, {
-                                                                            showColumns,
-                                                                            showData,
-                                                                            position: 'center',
+                                                                            showColumns: rightColumns,
+                                                                            showData: rightData,
+                                                                            position: 'right',
+                                                                        })}
+                                                                        columnWidth={this.getColumnWidth.bind(this, {
+                                                                            columns: showColumns,
+                                                                            showColumns: rightColumns,
                                                                         })}
+                                                                        onScroll={(...arg: Array<Object>) => {
+                                                                            onScroll({ scrollTop: arg[0].scrollTop });
+                                                                            this.onScroll(arg[0]);
+                                                                        }}
+                                                                        columnCount={rightCount}
+                                                                        width={rightWidth + scrollbarWidth}
+                                                                        rowHeight={rowHeight}
+                                                                        rowCount={rowCount}
+                                                                        height={totalHeight - scrollbarWidth}
+                                                                        scrollTop={scrollTop}
                                                                     />
-                                                                ) : (
-                                                                    columnCount > 0 &&
-                                                                    !loading && (
-                                                                        <Empty
-                                                                            className={styles.defaultEmpty}
-                                                                            description={
-                                                                                noDataPlaceholder || locale.empty
-                                                                            }
-                                                                        />
-                                                                    )
-                                                                )}
-                                                            </div>
-                                                        }
+                                                                </div>
+                                                            }
+                                                        </div>
+                                                    )}
+                                                    <div className={styles.fillHandleWrapper} />
+                                                    <div
+                                                        className={styles.loading}
+                                                        style={{ top: `${totalHeight / 2}px` }}
+                                                    >
+                                                        {loading && (loadComp ? loadComp : <Spin />)}
                                                     </div>
-                                                );
-                                            }}
-                                        </AutoSizer>
-                                    </div>
-                                    {totalWidth > tableWidth && rightCount > 0 && (
-                                        <div
-                                            className={styles.rightSideContainer}
-                                            style={{
-                                                width: `${rightWidth}px`,
-                                                height: `${totalHeight - scrollbarWidth + headerHeight}px`,
-                                            }}
-                                        >
-                                            {
-                                                // 右侧表头
-                                                <div
-                                                    className={styles.rightSideHeaderContainer}
-                                                    style={{
-                                                        right: 0,
-                                                    }}
-                                                >
-                                                    <Grid
-                                                        ref={(dom: any) => {
-                                                            this.grid5 = dom;
+                                                    <div
+                                                        className={styles.widthHandleWrapper}
+                                                        id="dividerWrap"
+                                                        ref={(dom) => {
+                                                            this.widthHandleWrapper = dom;
                                                         }}
-                                                        className={styles.headerGrid}
-                                                        columnWidth={this.getColumnWidth.bind(this, {
-                                                            columns: showColumns,
-                                                            showColumns: rightColumns,
-                                                        })}
-                                                        columnCount={rightCount}
-                                                        width={rightWidth}
-                                                        rowHeight={headerHeight}
-                                                        rowCount={1}
-                                                        height={headerHeight}
-                                                        cellRenderer={this.renderHeaderCell.bind(this, {
-                                                            showColumns: rightColumns,
-                                                            position: 'right',
-                                                        })}
-                                                    />
-                                                </div>
-                                            }
-                                            {
-                                                // 右侧固定列
-                                                <div
-                                                    className={styles.rightSideGridContainer}
-                                                    style={{
-                                                        position: 'absolute',
-                                                        right: 0,
-                                                        top: headerHeight,
-                                                        marginRight: -scrollbarWidth,
-                                                    }}
-                                                >
-                                                    <Grid
-                                                        ref={(dom: any) => {
-                                                            this.grid6 = dom;
-                                                        }}
-                                                        className={styles.sideGrid}
-                                                        overscanRowCount={overscanRowCount}
-                                                        cellRenderer={this.renderBodyCell.bind(this, {
-                                                            showColumns: rightColumns,
-                                                            showData: rightData,
-                                                            position: 'right',
-                                                        })}
-                                                        columnWidth={this.getColumnWidth.bind(this, {
-                                                            columns: showColumns,
-                                                            showColumns: rightColumns,
-                                                        })}
-                                                        onScroll={(...arg: Array<Object>) => {
-                                                            onScroll({ scrollTop: arg[0].scrollTop });
-                                                            this.onScroll(arg[0]);
-                                                        }}
-                                                        columnCount={rightCount}
-                                                        width={rightWidth + scrollbarWidth}
-                                                        rowHeight={rowHeight}
-                                                        rowCount={rowCount}
-                                                        height={totalHeight - scrollbarWidth}
-                                                        scrollTop={scrollTop}
-                                                    />
+                                                    >
+                                                        <div
+                                                            className={styles.widthHandle}
+                                                            id="divider"
+                                                            ref={(dom) => {
+                                                                this.widthHandle = dom;
+                                                            }}
+                                                        />
+                                                    </div>
                                                 </div>
-                                            }
-                                        </div>
-                                    )}
-                                    <div className={styles.fillHandleWrapper} />
-                                    <div className={styles.loading} style={{ top: `${totalHeight / 2}px` }}>
-                                        {loading && (loadComp ? loadComp : <Spin />)}
-                                    </div>
-                                    <div
-                                        className={styles.widthHandleWrapper}
-                                        id="dividerWrap"
-                                        ref={(dom) => {
-                                            this.widthHandleWrapper = dom;
-                                        }}
-                                    >
-                                        <div
-                                            className={styles.widthHandle}
-                                            id="divider"
-                                            ref={(dom) => {
-                                                this.widthHandle = dom;
-                                            }}
-                                        />
-                                    </div>
-                                </div>
+                                                {provided.placeholder}
+                                            </div>
+                                        )}
+                                    </Droppable>
+                                </DragDropContext>
                             );
                         }}
                     </ScrollSync>