Skip to content

Commit 2fce539

Browse files
author
wangjing
committed
feat: add option dragSortRow
1 parent 22af4ef commit 2fce539

File tree

9 files changed

+60
-15
lines changed

9 files changed

+60
-15
lines changed

‎docs/assets/option/en/common/option-secondary.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -189,6 +189,10 @@ The switch of dragging the header to move the position. After selecting a cell,
189189
- 'column' Only the column header can be swapped
190190
- 'row' Only the row header can be swapped
191191

192+
#${prefix} dragSortRow(boolean) = false
193+
194+
Whether to enable row drag sorting.
195+
192196
#${prefix} hover(Object)
193197

194198
Hover interaction configuration, specific configuration items as follows:

‎docs/assets/option/zh/common/option-secondary.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -187,6 +187,11 @@ export interface SelectAllOnCtrlAOption {
187187
- 'column' 只有换列表头可换位
188188
- 'row' 只有换行表头可换位
189189

190+
191+
#${prefix} dragSortRow(boolean) = false
192+
193+
控制拖拽行移动位置的开关。点击某个单元格后，鼠标拖拽该单元格可触发移动。
194+
190195
#${prefix} hover(Object)
191196

192197
hover 交互配置，具体配置项如下：

‎packages/vtable/examples/list/list-rowSeriesNumber.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -207,6 +207,7 @@ export function createTable() {
207207
// perPageCount: 20,
208208
// currentPage: 1
209209
// },
210+
dragSortRow: true,
210211
rowSeriesNumber: {
211212
title: '',
212213
// field: 'sex',
@@ -228,7 +229,7 @@ export function createTable() {
228229
};
229230
const tableInstance = new VTable.ListTable(option);
230231
tableInstance.on('change_header_position', args => {
231-
console.log('change_header_position');
232+
console.log('change_header_position', args);
232233
});
233234
window.tableInstance = tableInstance;
234235
bindDebugTool(tableInstance.scenegraph.stage, { customGrapicKeys: ['col', 'row'] });

‎packages/vtable/src/event/listener/table-group.ts

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -474,6 +474,17 @@ export function bindTableGroupListener(eventManager: EventManager) {
474474
// 如果没有正常退出编辑状态 则不执行下面的逻辑 如选择其他单元格的逻辑
475475
return;
476476
}
477+
if (table.options.dragSortRow === true) {
478+
stateManager.startMoveCol(
479+
eventArgsSet.eventArgs.col,
480+
eventArgsSet.eventArgs.row,
481+
eventArgsSet.abstractPos.x,
482+
eventArgsSet.abstractPos.y,
483+
eventArgsSet.eventArgs?.event?.nativeEvent
484+
);
485+
stateManager.updateInteractionState(InteractionState.grabing);
486+
return;
487+
}
477488

478489
const hitIcon = (eventArgsSet?.eventArgs?.target as any)?.role?.startsWith('icon')
479490
? eventArgsSet.eventArgs.target

‎packages/vtable/src/layout/pivot-header-layout.ts

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2492,14 +2492,22 @@ export class PivotHeaderLayoutMap implements LayoutMapAPI {
24922492
}
24932493
return undefined;
24942494
}
2495+
2496+
/**
2497+
* 判断表格行是否可拖拽
2498+
* dragSortRow === true 表格行可拖拽
2499+
*/
2500+
canDragSortRow(col: number, row: number): boolean {
2501+
return this._table.options.dragSortRow || this.isSeriesNumberInBody(col, row);
2502+
}
24952503
/**
24962504
* 判断从source地址是否可以移动到target地址
24972505
* @param source
24982506
* @param target
24992507
* @returns boolean 是否可以移动
25002508
*/
25012509
canMoveHeaderPosition(source: CellAddress, target: CellAddress): boolean {
2502-
if (this.isSeriesNumberInHeader(target.col, target.row) || this.isSeriesNumberInHeader(source.col, source.row)) {
2510+
if (this.canDragSortRow(target.col, target.row) || this.canDragSortRow(source.col, source.row)) {
25032511
return false;
25042512
}
25052513
if (this.isCornerHeader(target.col, target.row)) {
@@ -2508,7 +2516,7 @@ export class PivotHeaderLayoutMap implements LayoutMapAPI {
25082516
if (source.col < 0 || source.row < 0 || target.col < 0 || target.row < 0) {
25092517
return false;
25102518
}
2511-
if (this.isSeriesNumberInBody(target.col, target.row) && this.isSeriesNumberInBody(source.col, source.row)) {
2519+
if (this.canDragSortRow(target.col, target.row) && this.canDragSortRow(source.col, source.row)) {
25122520
// 如果是子节点之间相互换位置 则匹配表头最后一级
25132521
// if (
25142522
// this.getColumnDefine(source.col + this.leftRowSeriesNumberColumnCount, source.row).isChildNode &&

‎packages/vtable/src/layout/simple-header-layout.ts

Lines changed: 16 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1081,13 +1081,21 @@ export class SimpleHeaderLayoutMap implements LayoutMapAPI {
10811081
if (this.isColumnHeader(col, row)) {
10821082
return this.getCellId(col, row - 1);
10831083
} else if (this.isRowHeader(col, row)) {
1084-
if (this.isSeriesNumberInBody(col - 1, row)) {
1084+
if (this.canDragSortRow(col - 1, row)) {
10851085
return undefined;
10861086
}
10871087
return this.getCellId(col - 1, row);
10881088
}
10891089
return undefined;
10901090
}
1091+
1092+
/**
1093+
* 判断表格行是否可拖拽
1094+
* dragSortRow === true 表格行可拖拽
1095+
*/
1096+
canDragSortRow(col: number, row: number): boolean {
1097+
return this._table.options.dragSortRow || this.isSeriesNumberInBody(col, row);
1098+
}
10911099
/**
10921100
* 判断从source地址是否可以移动到target地址
10931101
* @param source
@@ -1099,8 +1107,8 @@ export class SimpleHeaderLayoutMap implements LayoutMapAPI {
10991107
return false;
11001108
} else if (
11011109
!this.transpose &&
1102-
this.isSeriesNumberInBody(target.col, target.row) &&
1103-
this.isSeriesNumberInBody(source.col, source.row)
1110+
this.canDragSortRow(target.col, target.row) &&
1111+
this.canDragSortRow(source.col, source.row)
11041112
) {
11051113
// return true;
11061114
const sourceIndex = this.getRecordShowIndexByCell(0, source.row);
@@ -1109,8 +1117,8 @@ export class SimpleHeaderLayoutMap implements LayoutMapAPI {
11091117
return canMove;
11101118
} else if (
11111119
this.transpose &&
1112-
this.isSeriesNumberInBody(target.col, target.row) &&
1113-
this.isSeriesNumberInBody(source.col, source.row)
1120+
this.canDragSortRow(target.col, target.row) &&
1121+
this.canDragSortRow(source.col, source.row)
11141122
) {
11151123
// 如果是子节点之间相互换位置 则匹配表头最后一级
11161124
if (
@@ -1220,9 +1228,9 @@ export class SimpleHeaderLayoutMap implements LayoutMapAPI {
12201228
};
12211229
} else if (
12221230
this.isRowHeader(source.col, source.row) ||
1223-
(this.isSeriesNumberInBody(source.col, source.row) && this.transpose)
1231+
(this.canDragSortRow(source.col, source.row) && this.transpose)
12241232
) {
1225-
if (this.isSeriesNumberInBody(source.col, source.row)) {
1233+
if (this.canDragSortRow(source.col, source.row)) {
12261234
sourceCellRange = this.getCellRange(source.col + this.leftRowSeriesNumberColumnCount, source.row); // 把拖拽转移到拖拽表头节点
12271235
}
12281236
// source单元格包含的列数
@@ -1268,7 +1276,7 @@ export class SimpleHeaderLayoutMap implements LayoutMapAPI {
12681276
targetSize: targetCellRange.end.row - targetCellRange.start.row + 1,
12691277
moveType: 'row'
12701278
};
1271-
} else if (this.isSeriesNumberInBody(source.col, source.row)) {
1279+
} else if (this.canDragSortRow(source.col, source.row)) {
12721280
return {
12731281
sourceIndex: source.row,
12741282
targetIndex: target.row,

‎packages/vtable/src/scenegraph/component/cell-mover.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -94,7 +94,7 @@ export class CellMover {
9494
linePoints.push({ x: 0, y: this.table.tableNoFrameHeight });
9595
} else if (
9696
cellLocation === 'rowHeader' ||
97-
(this.table.internalProps.layoutMap as SimpleHeaderLayoutMap).isSeriesNumberInBody(col, row)
97+
(this.table.internalProps.layoutMap as SimpleHeaderLayoutMap).canDragSortRow(col, row)
9898
) {
9999
rectY = this.table.getRowsHeight(0, row - 1) - this.table.stateManager.scroll.verticalBarPos;
100100
rectX = this.table.getColsWidth(0, this.table.frozenColCount - 1);

‎packages/vtable/src/state/cell-move/index.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@ export function startMoveCol(col: number, row: number, x: number, y: number, sta
2222
cellLocation === 'columnHeader'
2323
? state.columnMove.x
2424
: cellLocation === 'rowHeader' ||
25-
(state.table.internalProps.layoutMap as SimpleHeaderLayoutMap).isSeriesNumberInBody(col, row)
25+
(state.table.internalProps.layoutMap as SimpleHeaderLayoutMap).canDragSortRow(col, row)
2626
? state.columnMove.y
2727
: 0;
2828

@@ -83,7 +83,7 @@ export function updateMoveCol(col: number, row: number, x: number, y: number, st
8383
}
8484
} else if (
8585
cellLocation === 'rowHeader' ||
86-
(state.table.internalProps.layoutMap as SimpleHeaderLayoutMap).isSeriesNumberInBody(col, row)
86+
(state.table.internalProps.layoutMap as SimpleHeaderLayoutMap).canDragSortRow(col, row)
8787
) {
8888
backY = state.columnMove.y;
8989
if (state.table.isFrozenRow(row)) {
@@ -171,7 +171,7 @@ export function endMoveCol(state: StateManager): boolean {
171171
}
172172
if (
173173
!(state.table as ListTable).transpose &&
174-
(state.table.internalProps.layoutMap as SimpleHeaderLayoutMap).isSeriesNumberInBody(
174+
(state.table.internalProps.layoutMap as SimpleHeaderLayoutMap).canDragSortRow(
175175
state.columnMove.colSource,
176176
state.columnMove.rowSource
177177
)

‎packages/vtable/src/ts-types/base-table.ts

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -136,6 +136,8 @@ export interface IBaseTableProtected {
136136
rowResizeType?: 'row' | 'indicator' | 'all' | 'indicatorGroup';
137137
/** 控制拖拽表头移动位置顺序开关 */
138138
dragHeaderMode?: 'all' | 'none' | 'column' | 'row';
139+
/** 拖拽表格行调整顺序*/
140+
dragSortRow?: boolean;
139141
/** 拖拽表头移动位置 针对冻结部分的规则
140142
* "disabled"（禁止调整冻结列位置）：不允许其他列的表头移入冻结列，也不允许冻结列移出，冻结列保持不变。
141143
* "adjustFrozenCount"（根据交互结果调整冻结数量）：允许其他列的表头移入冻结列，及冻结列移出，并根据拖拽的动作调整冻结列的数量。当其他列的表头被拖拽进入冻结列位置时，冻结列数量增加；当其他列的表头被拖拽移出冻结列位置时，冻结列数量减少。
@@ -227,6 +229,10 @@ export interface IBaseTableProtected {
227229
//重新思考逻辑：如果为false，行高按设置的rowHeight；如果设置为true，则按lineHeight及是否自动换行综合计算行高 2021.11.19 by：lff
228230

229231
autoWrapText?: boolean;
232+
233+
// 支持拖拽排序
234+
dragSort?: boolean | 'row' | 'col';
235+
230236
enableLineBreak?: boolean;
231237

232238
menuHandler: MenuHandler;
@@ -328,6 +334,8 @@ export interface BaseTableConstructorOptions {
328334
rowResizeMode?: 'all' | 'none' | 'header' | 'body';
329335
/** 控制拖拽表头移动位置顺序开关 */
330336
dragHeaderMode?: 'all' | 'none' | 'column' | 'row';
337+
/** 拖拽表格行调整顺序*/
338+
dragSortRow?: boolean;
331339

332340
/**
333341
* 是否显示固定列图钉 基本表格生效

0 commit comments

Comments
 (0)