扩展实现插入粘贴功能

收藏

本帖最后由 ClarkPan 于 2020-5-31 23:22 编辑

背景：    Excel中操作复制粘贴的时候有一个很方便的功能就是插入粘贴，插入粘贴就是将复制的内容在粘贴区域插入对应的空行后在空行上进行粘贴，这样粘贴的内容相当于追加，不会破坏既有数据。这样的功能在日常Excel操作中应用非常广泛。而SpreadJS中默认没有提供类似的功能，但可以通过接口的一些扩展来完成。下面的示例我们就将讲解SpreadJS中如何通过扩展实现插入粘贴功能。
原理：
   在粘贴之前插入对应的空白行后再粘贴
分析：
   SpreadJS的复制粘贴操作有两种实现方法，一个是Ctrl+C Ctrl+V这种键盘操作，一种是鼠标右键通过右键菜单进行操作。所以在扩展的时候需要对这两个操作分别进行处理。在处理时，既然我们要插入对应的空白行，所以我们必须知道复制的区域，以便通过区域来获取复制的行数。这样我们就需要分别对ctrl+c键盘操作以及右键的复制功能进行重写。
重写ctrl+c：
   通过setShortcutKey重写ctrl+c,在ctrl+c按下后获取选择区域，由于注册了新的方法但有没有注销以前的ctrl+c，这样新旧ctrl+c的逻辑将同时生效。

//重写Ctrl+C复制
spread.commandManager().register('mycopy',function(){
copySelection = sheet.getSelections()[0];
});
spread.commandManager().setShortcutKey('mycopy', GC.Spread.Commands.Key.c, true, false, false, false);

复制代码

重写右键复制：
通过自定义右键菜单的功能，重写右键菜单的复制按钮。

//重写右键菜单复制
function myContextMenuCopy(){
copySelection = sheet.getSelections()[0];
spread.commandManager().execute({cmd:"gc.spread.contextMenu.copy",sheetName:sheet.name()});
}
for(var i=0;i<spread.contextMenu.menuData.length;i++){
if(spread.contextMenu.menuData[i].name == "gc.spread.copy"){
spread.contextMenu.menuData[i].command = myContextMenuCopy
}
}

复制代码

新增右键插入粘贴功能：
还有通过自定义右键菜单的功能来新增一个插入粘贴的功能，在功能中新增对应行数后通过clipboardPaste命令来进行粘贴。这里注意插入行的位置与复制行的位置不同有不同的逻辑(此处代码逻辑较为复杂，其中有一个小算法逻辑，需要慢慢理解）

var insertPaste = {
canUndo: true,
execute: function (context, options, isUndo) {
var Commands = GC.Spread.Sheets.Commands;
options.cmd = "insertPaste";
if (isUndo) {
Commands.undoTransaction(context, options);
return true;
} else {
Commands.startTransaction(context, options);
var selection = sheet.getSelections()[0];
var row = selection.row;
var rowCount = copySelection.rowCount;
var copyRow = copySelection.row;
var copyRowCount = copySelection.rowCount;
if(row<=copyRow){
var fromRange = [new GC.Spread.Sheets.Range(copySelection.row+rowCount, copySelection.col, copySelection.rowCount, copySelection.colCount)];
sheet.addRows(row,rowCount);
var toRange = [new GC.Spread.Sheets.Range(row, copySelection.col, rowCount, copySelection.colCount)];
spread.commandManager().execute({cmd: "clipboardPaste", sheetName: sheet.name(), fromSheet: sheet, fromRanges: fromRange, pastedRanges: toRange, isCutting: false, clipboardText: "", pasteOption: GC.Spread.Sheets.ClipboardPasteOptions.all});
}
if(row>copyRow+copyRowCount-1){
var fromRange = [new GC.Spread.Sheets.Range(copySelection.row, copySelection.col, copySelection.rowCount, copySelection.colCount)];
sheet.addRows(row,rowCount);
var toRange = [new GC.Spread.Sheets.Range(row, copySelection.col, rowCount, copySelection.colCount)];
spread.commandManager().execute({cmd: "clipboardPaste", sheetName: sheet.name(), fromSheet: sheet, fromRanges: fromRange, pastedRanges: toRange, isCutting: false, clipboardText: "", pasteOption: GC.Spread.Sheets.ClipboardPasteOptions.all});
}
if(row>copyRow && row<=copyRow+copyRowCount-1){
var firstRowCount = row-copyRow;
var firstFromRange = [new GC.Spread.Sheets.Range(copySelection.row, copySelection.col, firstRowCount, copySelection.colCount)];
sheet.addRows(row,rowCount);
var firstToRange = [new GC.Spread.Sheets.Range(row, copySelection.col, firstRowCount, copySelection.colCount)];
spread.commandManager().execute({cmd: "clipboardPaste", sheetName: sheet.name(), fromSheet: sheet, fromRanges: firstFromRange, pastedRanges: firstToRange, isCutting: false, clipboardText: "", pasteOption: GC.Spread.Sheets.ClipboardPasteOptions.all});
var secondRowCount = rowCount - firstRowCount;
var secondFromRange = [new GC.Spread.Sheets.Range(row+rowCount, copySelection.col, secondRowCount, copySelection.colCount)];
var secondToRange = [new GC.Spread.Sheets.Range(row+firstRowCount, copySelection.col, firstRowCount, copySelection.colCount)];
spread.commandManager().execute({cmd: "clipboardPaste", sheetName: sheet.name(), fromSheet: sheet, fromRanges: secondFromRange,pastedRanges: secondToRange, isCutting: false, clipboardText: "", pasteOption: GC.Spread.Sheets.ClipboardPasteOptions.all});
}
Commands.endTransaction(context, options);
return true;
}
}
};
spread.commandManager().register("insertPaste", insertPaste);
var openDialog = {
text: '插入粘贴',
name: 'openDialog',
command: "insertPaste",
workArea: 'rowHeader'
};
spread.contextMenu.menuData.push(openDialog);