/** * Spreadjs 通用方法集 * * @author Mai * @date 2018/02/06 * @version */ const spreadNS = GC.Spread.Sheets; const SpreadJsObj = { DataType: { Data: 'data', Tree: 'tree', }, /** * 创建Spread(默认1张表,3行数据) * @param obj 用于创建spreadjs的Dom元素 * @returns {GC.Spread.Sheets.Workbook} */ createNewSpread: function (obj) { const spread = new spreadNS.Workbook(obj, {sheetCount: 1}); spread.options.tabStripVisible = false; spread.options.scrollbarMaxAlign = true; spread.options.cutCopyIndicatorVisible = false; spread.options.allowCopyPasteExcelStyle = false; spread.options.allowUserDragDrop = false; spread.options.allowUserEditFormula = false; spread.getActiveSheet().options.clipBoardOptions = GC.Spread.Sheets.ClipboardPasteOptions.values;//设置粘贴时只粘贴值 spread.getActiveSheet().setRowCount(3); return spread; }, /** * 保护sheet(需设置保护后, 单元格的locked等属性方可生效) * @param {GC.Spread.Sheets.Worksheet} sheet */ protectedSheet: function (sheet) { const option = { allowSelectLockedCells: true, allowSelectUnlockedCells: true, allowResizeRows: true, allowResizeColumns: true }; sheet.options.protectionOptions = option; sheet.options.isProtected = true; sheet.options.allowCellOverflow = false; }, /** * sheet批量操作优化(sheet操作大批量数据时, 屏蔽数据刷新, 可优化大量时间) * @param {GC.Spread.Sheets.Worksheet} sheet * @param {function} operation */ beginMassOperation: function (sheet) { sheet.suspendPaint(); sheet.suspendEvent(); }, endMassOperation: function (sheet) { sheet.resumeEvent(); sheet.resumePaint(); }, massOperationSheet: function (sheet, operation) { this.beginMassOperation(sheet); operation(); this.endMassOperation(sheet); }, /** * 获取Obj左顶点位置(部分功能需通过spreadjs左顶点位置计算) * @param obj * @returns {{x: number, y: number}} */ getObjPos: function (obj) { let target = obj; let pos = {x: obj.offsetLeft, y: obj.offsetTop}; target = obj.offsetParent; while (target) { pos.x += target.offsetLeft; pos.y += target.offsetTop; target = target.offsetParent; } return pos; }, /** * 以下四个方法来自Spread示例, 参见官网或文档 */ getHitTest: function (obj, e, sheet) { var offset = obj.offset(), x = e.pageX - offset.left, y = e.pageY - offset.top; return sheet.hitTest(x, y); }, getTargetSelection: function (sheet, target) { if (target.hitTestType === spreadNS.SheetArea.colHeader) { return sheet.getRange(-1, target.col, sheet.getRowCount(), 1); } else if (target.hitTestType === spreadNS.SheetArea.rowHeader) { return sheet.getRange(target.row, -1, 1, sheet.getColumnCount()); } else if (target.hitTestType === spreadNS.SheetArea.viewport) { return sheet.getRange(target.row, target.col, 1, 1); } else if (target.hitTestType === spreadNS.SheetArea.corner) { return sheet.getRange(-1, -1, sheet.getRowCount(), sheet.getColumnCount()); }; }, getCellInSelections: function (selections, row, col) { const count = selections.length; let range; for (var i = 0; i < count; i++) { range = selections[i]; if (range.contains(row, col)) { return range; } } return null; }, checkTargetInSelection: function (selections, range) { var count = selections.length, sel; for (var i = 0; i < count; i++) { sel = selections[i]; if (sel.containsRange(range)) { return true; } } return false; }, /** * 获取 spread 在鼠标右键时, spread的选中区域 * viewport, 选中鼠标点击单元格X, X不在原选中区域内, 则选中X * colHeader, 选中整列 * rowHeader, 选中整行 * corner, 全选 * 该方法返回不符合需求时,可通过getHitTest/getTargetSelection/getCellInSelections/checkTargetInSelection来确定鼠标右键点击时,spread当前Sheet应选中的单元格 * @param obj: 创建Spread的Dom元素(jquery-contextmenu.build方法的第一个变量可读取) * @param e: jquery-contextmenu.build方法的第二个变量 * @param {GC.Spread.Sheets.Workbook} spread * @returns {*} */ safeRightClickSelection: function (obj, e, spread) { const sheet = spread.getActiveSheet(); const selections = sheet.getSelections(), target = this.getHitTest(obj, e, sheet), range = this.getTargetSelection(sheet, target); if (!this.checkTargetInSelection(selections, range)) { sheet.setSelection(range.row, range.col, range.rowCount, range.colCount); } return target; }, /** * sheet中 使用delete键,触发EndEdited事件 * @param {GC.Spreads.Sheets.Workbook} spread * @param {function} fun */ addDeleteBind: function (spread, fun) { spread.commandManager().register('deleteEvent', function () { fun(spread.getActiveSheet()); }); spread.commandManager().setShortcutKey(null, GC.Spread.Commands.Key.del, false, false, false, false); spread.commandManager().setShortcutKey('deleteEvent', GC.Spread.Commands.Key.del, false, false, false, false); }, /** * 根据sheet.zh_setting初始化sheet表头 * @param {GC.Spread.Sheets.Worksheet} sheet */ _initSheetHeader: function (sheet) { if (!sheet.zh_setting) { return; } sheet.setColumnCount(sheet.zh_setting.cols.length); sheet.setRowCount(sheet.zh_setting.headRows, spreadNS.SheetArea.colHeader); for (let iRow = 0; iRow < sheet.zh_setting.headRowHeight.length; iRow ++) { sheet.setRowHeight(iRow, sheet.zh_setting.headRowHeight[iRow], spreadNS.SheetArea.colHeader); } for (let iCol = 0; iCol < sheet.zh_setting.cols.length; iCol++) { const col = sheet.zh_setting.cols[iCol]; const title = col.title.split('|'); const colSpan = col.colSpan ? col.colSpan.split('|'): ['1'], rowSpan = col.rowSpan ? col.rowSpan.split('|'): ['1']; for (let i = 0; i < title.length; i++) { const cell = sheet.getCell(i, iCol, spreadNS.SheetArea.colHeader); cell.text(title[i]).wordWrap(true); if ((colSpan[i] !== '' && colSpan[i] !== '1') || (rowSpan[i] !== '' && rowSpan[i] !== '1')) { sheet.addSpan(i, iCol, parseInt(rowSpan[i]), parseInt(colSpan[i]), spreadNS.SheetArea.colHeader); } } sheet.setColumnWidth(iCol, col.width); if (col.visible !== undefined && col.visible !== null) { sheet.setColumnVisible(iCol, col.visible); } } sheet.rowOutlines.direction(spreadNS.Outlines.OutlineDirection.backward); sheet.showRowOutline(false); if (sheet.zh_setting.defaultRowHeight) { sheet.defaults.rowHeight = sheet.zh_setting.defaultRowHeight; } }, /** * 初始化sheet, 设置sheet.zh_setting, 并初始化表头 * @param {GC.Spread.Sheets.Worksheet} sheet * @param setting */ initSheet: function (sheet, setting) { this.beginMassOperation(sheet); sheet.zh_setting = setting; this._initSheetHeader(sheet); sheet.setRowCount(sheet.zh_setting.emptyRows); sheet.extendCellType = {}; sheet.getRange(0, 0, sheet.getRowCount(), sheet.getColumnCount()).locked(setting.readOnly); this.endMassOperation(sheet); }, /** * 整个sheet重新加载数据 * @param {GC.Spread.Sheets.Worksheet} sheet */ reLoadSheetData: function (sheet) { const self = this; const sortData = sheet.zh_dataType === 'tree' ? sheet.zh_tree.nodes : sheet.zh_data; this.beginMassOperation(sheet); try { sheet.clear(0, 0, sheet.getRowCount(), sheet.getColumnCount(), spreadNS.SheetArea.viewport, spreadNS.StorageType.data) // 设置总行数 const totalRow = sortData.length + sheet.zh_setting.emptyRows; sheet.setRowCount(totalRow, spreadNS.SheetArea.viewport); // 控制空白行 const emptyRows = sheet.getRange(sortData.length, -1, sheet.zh_setting.emptyRows, -1); emptyRows.locked(sheet.zh_dataType === 'tree'); // 单元格写入数据 sortData.forEach(function (data, i) { sheet.zh_setting.cols.forEach(function (col, j) { const cell = sheet.getCell(i, j); if (col.field !== '' && data[col.field]) { cell.value(data[col.field]).locked(col.readOnly || sheet.zh_setting.readOnly || false).vAlign(1).hAlign(col.hAlign); } else { cell.locked(col.readOnly || sheet.zh_setting.readOnly || false).vAlign(1).hAlign(col.hAlign); } }); }); // 设置列单元格格式 sheet.zh_setting.cols.forEach(function (col, j) { //if (!col.cellType) { return; } if (col.cellType === 'tree') { if (!sheet.extendCellType.tree) { sheet.extendCellType.tree = self.CellType.getTreeNodeCellType(); } sheet.getRange(-1, j, -1, 1).cellType(sheet.extendCellType.tree); } else if (col.cellType === 'tip') { if (!sheet.extendCellType.tip) { sheet.extendCellType.tip = self.CellType.getTipCellType(); } sheet.getRange(-1, j, -1, 1).cellType(sheet.extendCellType.tip); } else if (col.cellType === 'checkbox') { if (!sheet.extendCellType.checkbox) { sheet.extendCellType.checkbox = new spreadNS.CellTypes.CheckBox(); } sheet.getRange(-1, j, -1, 1).cellType(sheet.extendCellType.checkbox); } if (col.formatter) { sheet.getRange(-1, j, -1, 1).formatter(col.formatter); } }); this.endMassOperation(sheet); } catch (err) { this.endMassOperation(sheet); } }, _loadRowData: function (sheet, data, row) { // 单元格重新写入数据 if (!data) { return } sheet.zh_setting.cols.forEach(function (col, j) { const cell = sheet.getCell(row, j); if (col.field !== '' && data[col.field]) { cell.value(data[col.field]).locked(col.readOnly || sheet.zh_setting.readOnly || false).vAlign(1).hAlign(col.hAlign); } else { cell.locked(col.readOnly || sheet.zh_setting.readOnly || false).vAlign(1).hAlign(col.hAlign); } if (col.formatter) { cell.formatter(col.formatter); } }); }, /** * 重新加载部分数据行 * @param {GC.Spread.Sheets.Worksheet} sheet * @param {Number} row * @param {Number} count */ reLoadRowData: function (sheet, row, count) { const self = this; const sortData = sheet.zh_dataType === 'tree' ? sheet.zh_tree.nodes : sheet.zh_data; this.beginMassOperation(sheet); try { // 清空原单元格数据 sheet.clear(row, -1, count, -1, spreadNS.SheetArea.viewport, spreadNS.StorageType.data); // 单元格重新写入数据 for (let i = row; i < row + count; i++) { const data = sortData[i]; if (!data) { continue; } sheet.zh_setting.cols.forEach(function (col, j) { const cell = sheet.getCell(i, j); if (col.field !== '' && data[col.field]) { cell.value(data[col.field]).locked(col.readOnly || sheet.zh_setting.readOnly || false).vAlign(1).hAlign(col.hAlign); } else { cell.locked(col.readOnly || sheet.zh_setting.readOnly || false).vAlign(1).hAlign(col.hAlign); } if (col.formatter) { cell.formatter(col.formatter); } }); } this.endMassOperation(sheet); } catch (err) { this.endMassOperation(sheet); } }, /** * 重新加载部分行数据 * @param {GC.Spread.Sheets.Worksheet} sheet * @param {Array} rows */ reLoadRowsData: function (sheet, rows) { const self = this; const sortData = sheet.zh_dataType === 'tree' ? sheet.zh_tree.nodes : sheet.zh_data; this.beginMassOperation(sheet); try { for (const row of rows) { // 清空原单元格数据 sheet.clear(row, -1, 1, -1, spreadNS.SheetArea.viewport, spreadNS.StorageType.data); const data = sortData[row]; // 单元格重新写入数据 sheet.zh_setting.cols.forEach(function (col, j) { // 设置值 const cell = sheet.getCell(row, j); if (col.field !== '' && data[col.field]) { cell.value(data[col.field]).locked(col.readOnly || sheet.zh_setting.readOnly || false).vAlign(1).hAlign(col.hAlign); } else { cell.locked(col.readOnly || sheet.zh_setting.readOnly || false).vAlign(1).hAlign(col.hAlign); } // 设置单元格格式 if (col.formatter) { cell.formatter(col.formatter); } }); }; this.endMassOperation(sheet); } catch (err) { this.endMassOperation(sheet); } }, reLoadNodesData: function (sheet, nodes) { this.beginMassOperation(sheet); nodes = nodes instanceof Array ? nodes : [nodes]; for (const node of nodes) { const sortData = sheet.zh_dataType === 'tree' ? sheet.zh_tree.nodes : sheet.zh_data; this._loadRowData(sheet, node, sortData.indexOf(node)); } this.endMassOperation(sheet); }, /** * 根据data加载sheet数据,合并了一般数据和树结构数据的加载 * @param {GC.Spread.Sheets.Worksheet} sheet * @param {String} dataType - 1.'zh_data' 2.'zh_tree' * @param {Array|PathTree} data - 对dataType对应 */ loadSheetData: function (sheet, dataType, data){ sheet.zh_dataType = dataType; if (dataType === 'tree') { sheet.zh_tree = data; } else { sheet.zh_data = data; } this.protectedSheet(sheet); this.reLoadSheetData(sheet); }, /** * 获取复制数据HTML格式(过滤不可见单元格) * @param {GC.Spread.Sheets.Worksheet} sheet * @returns {string} */ getFilterCopyHTML: function (sheet) { const sel = sheet.getSelections()[0]; const html = []; html.push('
' + data + ' | '); } rowHtml.push('