1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324 |
- /**
- * Spreadjs 通用方法集
- *
- * @author Mai
- * @date 2018/02/06
- * @version
- */
- // 定义画点线的方法
- const proto = window.CanvasRenderingContext2D && CanvasRenderingContext2D.prototype;
- proto.dottedLine = function (x1, y1, x2, y2, interval = 4) {
- const isHorizontal = x1 == x2 ? false : true;
- const dotLen = 1;
- let len = isHorizontal ? x2 - x1 : y2 - y1;
- this.moveTo(x1, y1);
- let progress = 0;
- while (len > progress) {
- if (progress > len) { progress = len; }
- if (isHorizontal) {
- this.moveTo(x1 + progress, y1);
- this.lineTo(x1 + progress + dotLen, y1);
- } else {
- this.moveTo(x1, y1 + progress);
- this.lineTo(x1, y1 + progress + dotLen);
- }
- progress += interval;
- }
- };
- // 简写Spread常量
- const spreadNS = GC.Spread.Sheets;
- // SpreadJs常用方法
- const SpreadJsObj = {
- initSpreadSettingEvents: function (setting, events) {
- const getEvent = function (eventName) {
- const names = eventName.split('.');
- let event = events;
- for (let name of names) {
- if (event[name]) {
- event = event[name];
- } else {
- return null;
- }
- }
- if (event && Object.prototype.toString.apply(event) !== "[object Function]") {
- return null;
- } else {
- return event;
- }
- };
- for (const col of setting.cols) {
- if (col.readOnly && Object.prototype.toString.apply(col.readOnly) === "[object String]") {
- col.readOnly = getEvent(col.readOnly);
- }
- if (col.getValue && Object.prototype.toString.apply(col.getValue) === "[object String]") {
- col.getValue = getEvent(col.getValue);
- }
- }
- },
- 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的数据序列
- * data:sheet.zh_data, tree: sheet.zh_tree.nodes
- * @param sheet
- * @returns {*}
- */
- getSortData: function (sheet) {
- if (sheet.zh_dataType) {
- if (sheet.zh_dataType === this.DataType.Data) {
- return sheet.zh_data;
- } else if (sheet.zh_dataType === this.DataType.Tree) {
- return sheet.zh_tree.nodes;
- } else {
- return null;
- }
- } else {
- return null;
- }
- },
- /**
- * 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);
- },
- _initSheetDeafult: function (sheet) {
- if (sheet.zh_setting.headerFont) {
- const vStyle = new spreadNS.Style();
- vStyle.font = sheet.zh_setting.headerFont;
- sheet.setDefaultStyle(vStyle, spreadNS.SheetArea.colHeader);
- }
- if (sheet.zh_setting.font) {
- const vStyle = new spreadNS.Style();
- vStyle.font = sheet.zh_setting.font;
- sheet.setDefaultStyle(vStyle, spreadNS.SheetArea.viewport);
- }
- },
- /**
- * 根据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._initSheetDeafult(sheet);
- 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);
- },
- _loadRowData: function (sheet, data, row) {
- // 单元格重新写入数据
- if (!data) { return }
- sheet.zh_setting.cols.forEach(function (col, j) {
- const cell = sheet.getCell(row, j);
- if (col.getValue && Object.prototype.toString.apply(col.getValue) === "[object Function]") {
- cell.value(col.getValue(data));
- } else if (col.field !== '' && data[col.field]) {
- cell.value(data[col.field]);
- }
- if (col.font) {
- cell.font(col.font);
- }
- if (col.foreColor) {
- cell.foreColor(col.foreColor);
- }
- if (col.readOnly && Object.prototype.toString.apply(col.readOnly) === "[object Function]") {
- cell.locked(col.readOnly(data) || 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);
- }
- if (sheet.zh_setting.getColor && Object.prototype.toString.apply(sheet.zh_setting.getColor) === "[object Function]") {
- cell.backColor(sheet.zh_setting.getColor(data, col, sheet.getDefaultStyle().backColor));
- }
- });
- },
- _defineColCellType: function (sheet, col, colSetting) {
- if(colSetting.cellType === 'ellipsis') {
- if (!sheet.extendCellType.ellipsis) {
- sheet.extendCellType.ellipsis = this.CellType.getEllipsisTextCellType();
- }
- sheet.getRange(-1, col, -1, 1).cellType(sheet.extendCellType.ellipsis);
- }
- if(colSetting.cellType === 'html') {
- if (!sheet.extendCellType.html) {
- sheet.extendCellType.html = this.CellType.getHtmlCellType();
- }
- sheet.getRange(-1, col, -1, 1).cellType(sheet.extendCellType.html);
- }
- if (colSetting.cellType === 'image') {
- if (!sheet.extendCellType.image) {
- sheet.extendCellType.image = this.CellType.getImageCellType();
- }
- sheet.getRange(-1, col, -1, 1).cellType(sheet.extendCellType.image);
- }
- if (colSetting.cellType === 'imageBtn') {
- if (!sheet.extendCellType.image) {
- sheet.extendCellType.imageBtn = this.CellType.getImageButtonCellType();
- }
- sheet.getRange(-1, col, -1, 1).cellType(sheet.extendCellType.imageBtn);
- }
- if (colSetting.cellType === 'tree') {
- if (!sheet.extendCellType.tree) {
- sheet.extendCellType.tree = this.CellType.getTreeNodeCellType();
- }
- sheet.getRange(-1, col, -1, 1).cellType(sheet.extendCellType.tree);
- }
- if (colSetting.cellType === 'tip') {
- if (!sheet.extendCellType.tip) {
- sheet.extendCellType.tip = this.CellType.getTipCellType();
- }
- sheet.getRange(-1, col, -1, 1).cellType(sheet.extendCellType.tip);
- }
- if (colSetting.cellType === 'checkbox') {
- if (!sheet.extendCellType.checkbox) {
- sheet.extendCellType.checkbox = new spreadNS.CellTypes.CheckBox();
- }
- sheet.getRange(-1, col, -1, 1).cellType(sheet.extendCellType.checkbox);
- }
- if (colSetting.formatter) {
- sheet.getRange(-1, col, -1, 1).formatter(colSetting.formatter);
- }
- },
- /**
- * 整个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) {
- self._loadRowData(sheet, data, i);
- sheet.setRowVisible(i, data.visible);
- });
- // 设置列单元格格式
- sheet.zh_setting.cols.forEach(function (col, j) {
- //if (!col.cellType) { return; }
- self._defineColCellType(sheet, j, col);
- });
- this.endMassOperation(sheet);
- } catch (err) {
- this.endMassOperation(sheet);
- }
- },
- /**
- * 重新加载部分数据行
- * @param {GC.Spread.Sheets.Worksheet} sheet
- * @param {Number} row
- * @param {Number} count
- */
- reLoadRowData: function (sheet, row, count = 1) {
- //if (row < 0) { return; }
- 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; }
- this._loadRowData(sheet, data, i);
- }
- 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) {
- if (row < 0) { continue; }
- // 清空原单元格数据
- sheet.clear(row, -1, 1, -1, spreadNS.SheetArea.viewport, spreadNS.StorageType.data);
- const data = sortData[row];
- // 单元格重新写入数据
- this._loadRowData(sheet, data, row);
- };
- this.endMassOperation(sheet);
- } catch (err) {
- this.endMassOperation(sheet);
- }
- },
- /**
- * 重新加载部分列数据
- * @param {GC.Spread.Sheets.Worksheet} sheet
- * @param {Array} cols
- */
- reLoadColsData: function (sheet, cols) {
- const self = this;
- const sortData = sheet.zh_dataType === 'tree' ? sheet.zh_tree.nodes : sheet.zh_data;
- this.beginMassOperation(sheet);
- try {
- for (const iCol of cols) {
- // 清空原单元格数据
- sheet.clear(-1, iCol, -1, 1, spreadNS.SheetArea.viewport, spreadNS.StorageType.data);
- const col = sheet.zh_setting.cols[iCol];
- sortData.forEach(function (data, i) {
- // 设置值
- const cell = sheet.getCell(i, iCol);
- 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('<table>');
- for (let i = sel.row, iLen = sel.row + sel.rowCount; i < iLen; i++) {
- // 跳过隐藏行
- if (!sheet.getCell(i, -1).visible()) { continue; }
- const rowHtml = [];
- rowHtml.push('<tr>');
- for (let j = sel.col, jLen = sel.col + sel.colCount; j < jLen; j++) {
- const data = sheet.getText(i, j);
- rowHtml.push('<td>' + data + '</td>');
- }
- rowHtml.push('</tr>');
- html.push(rowHtml.join(''));
- }
- html.push('</table>');
- return html.join('');
- },
- /**
- * 获取复制数据Text格式(过滤不可见单元格)
- * @param {GC.Spread.Sheets.Worksheet} sheet
- * @returns {string}
- */
- getFilterCopyText: function (sheet) {
- const copyData = [];
- const sel = sheet.getSelections()[0];
- for(let i = sel.row, iLen = sel.row + sel.rowCount; i < iLen; i++) {
- // 跳过隐藏行
- if (!sheet.getCell(i, -1).visible()) { continue; }
- const rowText = [];
- for (let j = sel.col, jLen = sel.col + sel.colCount; j < jLen; j++) {
- const data = sheet.getText(i, j);
- rowText.push(data);
- }
- copyData.push(rowText.join('\t'));
- }
- return copyData.join('\n');
- },
- /**
- * 树表结构,定位至指定的节点
- * @param {GC.Spread.Sheets.Worksheet} sheet - 需要定位的sheet
- * @param {Number} id - 定位节点的id
- */
- locateTreeNode: function (sheet, id) {
- const tree = sheet.zh_tree;
- if (!tree) { return }
- const node = tree.getItems(id);
- if (!node) { return }
- const index = tree.nodes.indexOf(node);
- const sels = sheet.getSelections();
- sheet.setSelection(index, sels[0].col, 1, 1);
- sheet.showRow(index, spreadNS.VerticalPosition.center);
- },
- /**
- * 获取当前选行的数据对象
- * @param {GC.Spread.Sheets.Worksheet} sheet
- * @returns {Object}
- */
- getSelectObject: function (sheet) {
- if (!sheet) {
- return null;
- } else if (sheet.zh_dataType) {
- const sel = sheet.getSelections()[0];
- if (sheet.zh_dataType === this.DataType.Tree) {
- return sheet.zh_tree.nodes[sel.row];
- } else if (sheet.zh_dataType === this.DataType.Data) {
- return sheet.zh_data[sel.row];
- } else {
- return null;
- }
- }
- },
- /**
- * 刷新列显示
- * @param sheet
- */
- refreshColumnVisible: function (sheet) {
- if(sheet.zh_setting) {
- sheet.zh_setting.cols.forEach(function (col, index) {
- if (col.visible !== undefined && col.visible !== null) {
- sheet.setColumnVisible(index, col.visible);
- }
- });
- }
- },
- /**
- * 刷新行显示
- * @param sheet
- */
- refreshTreeRowVisible: function (sheet) {
- this.beginMassOperation(sheet);
- if (sheet.zh_tree) {
- for (const iRow in sheet.zh_tree.nodes) {
- const node = sheet.zh_tree.nodes[iRow];
- if (node.visible !== undefined && node.visible !== null) {
- sheet.setRowVisible(iRow, node.visible);
- } else {
- sheet.setRowVisible(iRow, true);
- }
- }
- }
- this.endMassOperation(sheet);
- },
- /**
- * 刷新列是否只读
- * @param sheet
- * @param field
- * @param readonly
- */
- resetFieldReadOnly: function (sheet, field, readonly) {
- const fields = field instanceof Array ? field : [field];
- if (sheet.zh_setting) {
- sheet.zh_setting.cols.forEach(function (col, i) {
- if (fields.indexOf(col.field) !== -1) {
- col.readOnly = readonly;
- sheet.getRange(-1, i, -1, 1).locked(col.readOnly || sheet.zh_setting.readOnly || false);
- }
- });
- }
- },
- CellType: {
- /**
- * 获取树结构CellType
- * 通过SpreadJsObj.loadSheetData(sheet, 'tree', tree)加载树结构数据
- * 要求tree类型为PathTree, 节点必须含有{id, pid, level, order, is_leaf}数据
- * @returns {TreeNodeCellType}
- */
- getTreeNodeCellType: function () {
- const indent = 20;
- const levelIndent = -5;
- const halfBoxLength = 5;
- const halfExpandLength = 3;
- /**
- * 画一条点线段
- * @param canvas - 画布
- * @param x1 - 线段起点 x
- * @param y1 - 线段起点 y
- * @param x2 - 线段终点 x
- * @param y2 - 线段终点 y
- * @param color - 线段颜色
- */
- const drawDotLine = function (canvas, x1, y1, x2, y2, color) {
- canvas.save();
- // 设置偏移量
- canvas.translate(0.5, 0.5);
- canvas.beginPath();
- canvas.strokeStyle = color;
- canvas.dottedLine(x1, y1, x2, y2);
- canvas.stroke();
- canvas.restore();
- };
- /**
- * 画一条线段
- * @param canvas - 画布
- * @param x1 - 线段起点 x
- * @param y1 - 线段起点 y
- * @param x2 - 线段终点 x
- * @param y2 - 线段终点 y
- * @param color - 线段颜色
- */
- const drawLine = function (canvas, x1, y1, x2, y2, color) {
- canvas.save();
- // 设置偏移量
- canvas.translate(0.5, 0.5);
- canvas.beginPath();
- canvas.moveTo(x1, y1);
- canvas.lineTo(x2, y2);
- canvas.strokeStyle = color;
- canvas.stroke();
- canvas.restore();
- };
- /**
- * 画一个方框
- * @param {Object} canvas - 画布
- * @param {Object} rect - 方框区域
- * @param {String} lineColor - 画线颜色
- * @param {String} fillColor - 填充颜色
- */
- const drawBox = function (canvas, rect, lineColor, fillColor) {
- canvas.save();
- // 设置偏移量
- canvas.translate(0.5, 0.5);
- canvas.strokeStyle = lineColor;
- canvas.beginPath();
- canvas.moveTo(rect.left, rect.top);
- canvas.lineTo(rect.left, rect.bottom);
- canvas.lineTo(rect.right, rect.bottom);
- canvas.lineTo(rect.right, rect.top);
- canvas.lineTo(rect.left, rect.top);
- canvas.stroke();
- canvas.fillStyle = fillColor;
- canvas.fill();
- canvas.restore();
- };
- /**
- * 画树结构-展开收起按钮
- * @param {Object} canvas - 画布
- * @param {Number} x - 单元格左顶点坐标 x
- * @param {Number} y - 单元格左顶点坐标 y
- * @param {Number} w - 单元格宽度
- * @param {Number} h - 单元格高度
- * @param {Number} centerX - 按钮中央坐标
- * @param {Number} centerY - 按钮中央坐标
- * @param {Boolean} expanded - 当前节点展开收起状态
- */
- const drawExpandBox = function (canvas, x, y, w, h, centerX, centerY, expanded) {
- let rect = {
- top: centerY - halfBoxLength,
- bottom: centerY + halfBoxLength,
- left: centerX - halfBoxLength,
- right: centerX + halfBoxLength
- };
- let h1, h2, offset = 1;
- if (rect.left < x + w) {
- // 方框超出单元格宽度时,超出部分不画。
- rect.right = Math.min(rect.right, x + w);
- drawBox(canvas, rect, '#808080', 'white');
- // 画中心十字
- // 画十字横线
- h1 = centerX - halfExpandLength;
- h2 = Math.min(centerX + halfExpandLength, x + w);
- if (h2 > h1) {
- drawLine(canvas, h1, centerY, h2, centerY, '#808080');
- }
- // 画十字竖线
- if (!expanded && (centerX < x + w)) {
- drawLine(canvas, centerX, centerY - halfExpandLength, centerX, centerY + halfExpandLength, '#808080');
- }
- }
- };
- let TreeNodeCellType = function (){};
- TreeNodeCellType.prototype = new spreadNS.CellTypes.Text();
- const proto = TreeNodeCellType.prototype;
- /**
- * 绘制方法
- * @param {Object} canvas - 画布
- * @param value - cell.value
- * @param {Number} x - 单元格左顶点坐标 x
- * @param {Number} y - 单元格左顶点坐标 y
- * @param {Number} w - 单元格宽度
- * @param {Number} h - 单元格高度
- * @param {Object} style - cell.style
- * @param {Object} options
- */
- proto.paint = function (canvas, value, x, y, w, h, style, options) {
- // 清理 画布--单元格范围 旧数据
- if (style.backColor) {
- canvas.save();
- canvas.fillStyle = style.backColor;
- canvas.fillRect(x, y, w, h);
- canvas.restore();
- } else {
- canvas.clearRect(x, y, w, h);
- }
- const tree = options.sheet.zh_tree;
- // 使用TreeCellType前,需定义sheet.tree
- if (tree) {
- const node = options.row < tree.nodes.length ? tree.nodes[options.row] : null;
- if (node) {
- const showTreeLine = true;
- const centerX = Math.floor(x) + (node.level) * indent + (node.level) * levelIndent + indent / 2;
- const centerY = Math.floor((y + (y + h)) / 2);
- // Draw Sibling Line
- if (showTreeLine) {
- // Draw Horizontal Line
- if (centerX < x + w) {
- const x1 = centerX + indent / 2;
- //drawLine(canvas, centerX, centerY, Math.min(x1, x + w), centerY, 'gray');
- drawDotLine(canvas, centerX, centerY, Math.min(x1, x + w), centerY, '#b8b8b8');
- }
- // Draw Vertical Line
- if (centerX < x + w) {
- const y1 = tree.isLastSibling(node) ? centerY : y + h;
- const parent = tree.getParent(node);
- const y2 = y1 - centerY;
- if (node.order === 1 && !parent) {
- //drawLine(canvas, centerX, centerY, centerX, y1, 'gray');
- drawDotLine(canvas, centerX, centerY, centerX, y1, '#b8b8b8');
- } else {
- //drawLine(canvas, centerX, y, centerX, y1, 'gray');
- drawDotLine(canvas, centerX, y, centerX, y1, '#b8b8b8');
- }
- }
- }
- // Draw Expand Box
- if (!node.is_leaf) {
- drawExpandBox(canvas, x, y, w, h, centerX, centerY, node.expanded);
- }
- // Draw Parent Line
- if (showTreeLine) {
- let parent = tree.getParent(node), parentCenterX = centerX - indent - levelIndent;
- while (parent) {
- if (!tree.isLastSibling(parent)) {
- if (parentCenterX < x + w) {
- //drawLine(canvas, parentCenterX, y, parentCenterX, y + h, 'gray');
- drawDotLine(canvas, parentCenterX, y, parentCenterX, y + h, '#b8b8b8');
- }
- }
- parent = tree.getParent(parent);
- parentCenterX -= (indent + levelIndent);
- }
- };
- // 重定位x
- const move = (node.level + 1) * indent + (node.level) * levelIndent;
- x = x + move;
- w = w - move;
- }
- }
- // Drawing Text
- spreadNS.CellTypes.Text.prototype.paint.apply(this, [canvas, value, x, y, w, h, style, options]);
- };
- /**
- * 获取点击信息
- * @param {Number} x
- * @param {Number} y
- * @param {Object} cellStyle
- * @param {Object} cellRect
- * @param {Object} context
- * @returns {{x: *, y: *, row: *, col: *|boolean|*[]|number|{}|UE.dom.dtd.col, cellStyle: *, cellRect: *, sheet: *|StyleSheet, sheetArea: *}}
- */
- proto.getHitInfo = function (x, y, cellStyle, cellRect, context) {
- return {
- x: x,
- y: y,
- row: context.row,
- col: context.col,
- cellStyle: cellStyle,
- cellRect: cellRect,
- sheet: context.sheet,
- sheetArea: context.sheetArea
- };
- };
- /**
- * 鼠标点击 树结构按钮 响应展开收起(未加载子节点时,先加载子节点)
- * @param {Object} hitinfo - 见getHitInfo
- */
- proto.processMouseDown = function (hitinfo) {
- const offset = -1;
- const tree = hitinfo.sheet.zh_tree;
- if (!tree) { return; }
- const node = tree.nodes[hitinfo.row];
- if (!node) { return; }
- let centerX = hitinfo.cellRect.x + offset + (node.level) * indent + (node.level) * levelIndent + indent / 2;
- let centerY = (hitinfo.cellRect.y + offset + (hitinfo.cellRect.y + offset + hitinfo.cellRect.height)) / 2;
- // 点击展开节点时,如果已加载子项,则展开,反之这加载子项,展开
- if (Math.abs(hitinfo.x - centerX) < halfBoxLength && Math.abs(hitinfo.y - centerY) < halfBoxLength) {
- const children = tree.getChildren(node);
- if (!node.expanded && !node.is_leaf && children.length === 0 && tree.loadChildren) {
- tree.loadChildren(node, function () {
- node.expanded = true;
- const children = tree.getChildren(node);
- hitinfo.sheet.addRows(hitinfo.row + 1, children.length);
- SpreadJsObj.reLoadRowData(hitinfo.sheet, hitinfo.row + 1, children.length);
- });
- } else {
- tree.setExpanded(node, !node.expanded);
- SpreadJsObj.massOperationSheet(hitinfo.sheet, function () {
- const posterity = tree.getPosterity(node);
- for (const child of posterity) {
- hitinfo.sheet.setRowVisible(tree.nodes.indexOf(child), child.visible, hitinfo.sheetArea);
- }
- });
- hitinfo.sheet.repaint();
- }
- }
- };
- return new TreeNodeCellType();
- },
- /**
- * 获取 带悬浮提示的CellType
- * @returns {TipCellType}
- */
- getTipCellType: function () {
- const TipCellType = function () {};
- // 继承 SpreadJs定义的 普通的TextCellType
- TipCellType.prototype = new spreadNS.CellTypes.Text();
- const proto = TipCellType.prototype;
- /**
- * 获取点击信息
- * @param {Number} x
- * @param {Number} y
- * @param {Object} cellStyle
- * @param {Object} cellRect
- * @param {Object} context
- * @returns {{x: *, y: *, row: *, col: *|boolean|*[]|number|{}|UE.dom.dtd.col, cellStyle: *, cellRect: *, sheet: *|StyleSheet, sheetArea: *}}
- */
- proto.getHitInfo = function (x, y, cellStyle, cellRect, context) {
- return {
- x: x,
- y: y,
- row: context.row,
- col: context.col,
- cellStyle: cellStyle,
- cellRect: cellRect,
- sheet: context.sheet,
- sheetArea: context.sheetArea
- };
- };
- /**
- * 鼠标进入单元格事件 - 显示悬浮提示
- * @param {Object} hitinfo - 见getHitInfo返回值
- */
- proto.processMouseEnter = function (hitinfo) {
- const text = hitinfo.sheet.getText(hitinfo.row, hitinfo.col);
- const setting = hitinfo.sheet.setting;
- if (setting.pos && text && text !== '') {
- if (!this._toolTipElement) {
- let div = $('#autoTip')[0];
- if (!div) {
- div = document.createElement("div");
- $(div).css("position", "absolute")
- .css("border", "1px #C0C0C0 solid")
- .css("box-shadow", "1px 2px 5px rgba(0,0,0,0.4)")
- .css("font", "9pt Arial")
- .css("background", "white")
- .css("padding", 5)
- .attr("id", 'autoTip');
- $(div).hide();
- document.body.insertBefore(div, null);
- }
- this._toolTipElement = div;
- $(this._toolTipElement).text(text).css("top", setting.pos.y + hitinfo.y + 15).css("left", setting.pos.x + hitinfo.x + 15);
- $(this._toolTipElement).show("fast");
- }
- }
- };
- /**
- * 鼠标移出单元格事件 - 隐藏悬浮提示
- * @param {Object} hitinfo - 见getHitInfo返回值
- */
- proto.processMouseLeave = function (hitinfo) {
- if (this._toolTipElement) {
- $(this._toolTipElement).hide();
- this._toolTipElement = null;
- }
- };
- return new TipCellType();
- },
- /**
- * 获取 带图片的cellType(图片需在document中定义好img,并写入col的img属性)
- *
- * img:
- * 1. 整列固定,则传入img的select
- * e.g. {title: '附件', field: 'attachment', cellType: 'image', img = '#attachment-img'}
- *
- * 2. 各单元格自定义,则
- * e.g. {title: '附件', field: 'attachment', cellType: 'image', img = getAttachmentImage}
- * function getAttachmentImage (data) {
- * $('#attachment-img').url = data.attachmentImageUrl;
- * return $('#attachment-img')[0];
- * }
- *
- * @returns {ImageCellType}
- */
- getImageCellType: function () {
- const indent = 10;
- const ImageCellType = function (){};
- ImageCellType.prototype = new spreadNS.CellTypes.Text();
- const proto = ImageCellType.prototype;
- proto.getImage = function (sheet, iRow, iCol) {
- const col = sheet.zh_setting.cols[iCol];
- let imgSource = col.img;
- if (imgSource && Object.prototype.toString.apply(imgSource) === "[object Function]") {
- const sortData = SpreadJsObj.getSortData(sheet);
- const data = sortData ? sortData[iRow] : null;
- return data ? imgSource(data) : null;
- } else {
- return $(imgSource)[0] ? $(imgSource)[0] : null;
- }
- };
- proto.paint = function (canvas, value, x, y, w, h, style, options) {
- const img = this.getImage(options.sheet, options.row, options.col);
- if (img) {
- if (style.backColor) {
- canvas.save();
- canvas.fillStyle = style.backColor;
- canvas.fillRect(x, y, indent + img.width, h);
- canvas.restore();
- }
- canvas.drawImage(img, x + 10, y + (h - img.height) / 2);
- if (style.hAlign !== spreadNS.HorizontalAlign.left) {
- style.hAlign = spreadNS.HorizontalAlign.left;
- }
- x = x + indent + img.width;
- w = w - indent - img.width;
- }
- // Drawing Text
- spreadNS.CellTypes.Text.prototype.paint.apply(this, [canvas, value, x, y, w, h, style, options]);
- };
- /**
- * 获取点击信息
- * @param {Number} x
- * @param {Number} y
- * @param {Object} cellStyle
- * @param {Object} cellRect
- * @param {Object} context
- * @returns {{x: *, y: *, row: *, col: *|boolean|*[]|number|{}|UE.dom.dtd.col, cellStyle: *, cellRect: *, sheet: *|StyleSheet, sheetArea: *}}
- */
- proto.getHitInfo = function (x, y, cellStyle, cellRect, context) {
- return {
- x: x,
- y: y,
- row: context.row,
- col: context.col,
- cellStyle: cellStyle,
- cellRect: cellRect,
- sheet: context.sheet,
- sheetArea: context.sheetArea
- };
- };
- /**
- * 鼠标点击
- * @param {Object} hitinfo - 见getHitInfo
- */
- proto.processMouseDown = function (hitinfo) {
- const img = this.getImage(hitinfo.sheet, hitinfo.row, hitinfo.col);
- if (img) {
- const halfX = img.width / 2, halfY = img.height / 2;
- const centerX = hitinfo.cellRect.x + indent + halfX;
- const centerY = hitinfo.cellRect.y + hitinfo.cellRect.height / 2;
- // 点击展开节点时,如果已加载子项,则展开,反之这加载子项,展开
- if (Math.abs(hitinfo.x - centerX) < halfX && Math.abs(hitinfo.y - centerY) < halfY) {
- const imageClick = hitinfo.sheet.zh_setting ? hitinfo.sheet.zh_setting.imageClick : null;
- if (imageClick && Object.prototype.toString.apply(imageClick) === "[object Function]") {
- const sortData = SpreadJsObj.getSortData(hitinfo.sheet);
- const data = sortData ? sortData[hitinfo.row] : null;
- imageClick(data);
- }
- }
- }
- };
- return new ImageCellType();
- },
- /**
- *
- * 获取 带normal-hover-active按钮的cellType(需定义三张图片,须在document中定义好img,并写入col的normalImg, hoverImg, activeImg属性)
- * 其中:normalImg必需,向下套用(不存在activeImg则使用hoverImg,不存在hoverImg则使用normalImg)
- * 三个img均可像getImageCellType一样动态获取,参见getImageCellType注释
- *
- * @returns {ImageCellType}
- */
- getImageButtonCellType: function () {
- let hover = 1, active = 2;
- const ImageCellType = function (){};
- ImageCellType.prototype = new spreadNS.CellTypes.Text();
- const proto = ImageCellType.prototype;
- proto.getImage = function (sheet, iRow, iCol) {
- const col = sheet.zh_setting.cols[iCol];
- let imgSource = col.normalImg;
- const cell = sheet.getCell(iRow, iCol), tag = cell.tag();
- if (tag === active) {
- imgSource = col.activeImg ? col.activeImg : (col.hoverImg ? col.hoverImg : col.normalImg);
- } else if (tag === hover) {
- imgSource = col.hoverImg ? col.hoverImg : col.normalImg;
- }
- if (imgSource && Object.prototype.toString.apply(imgSource) === "[object Function]") {
- const sortData = SpreadJsObj.getSortData(sheet);
- const data = sortData ? sortData[iRow] : null;
- return data ? imgSource(data) : null;
- } else {
- return $(imgSource)[0] ? $(imgSource)[0] : null;
- }
- };
- proto.paint = function (canvas, value, x, y, w, h, style, options) {
- const img = this.getImage(options.sheet, options.row, options.col);
- const col = options.sheet.zh_setting.cols[options.col];
- const indent = col.indent ? col.indent : 10;
- if (style.hAlign === spreadNS.HorizontalAlign.right) {
- if (img) {
- if (style.backColor) {
- canvas.save();
- canvas.fillStyle = style.backColor;
- canvas.fillRect(x + w - indent - img.width, y, img.width, h);
- canvas.restore();
- }
- canvas.drawImage(img, x + w - indent - img.width, y + (h - img.height) / 2);
- w = w - indent - img.width;
- }
- // Drawing Text
- spreadNS.CellTypes.Text.prototype.paint.apply(this, [canvas, value, x, y, w, h, style, options]);
- } else {
- if (img) {
- if (style.backColor) {
- canvas.save();
- canvas.fillStyle = style.backColor;
- canvas.fillRect(x, y, indent + img.width, h);
- canvas.restore();
- }
- canvas.drawImage(img, x + 10, y + (h - img.height) / 2);
- if (style.hAlign !== spreadNS.HorizontalAlign.left) {
- style.hAlign = spreadNS.HorizontalAlign.left;
- }
- x = x + indent + img.width;
- w = w - indent - img.width;
- }
- // Drawing Text
- spreadNS.CellTypes.Text.prototype.paint.apply(this, [canvas, value, x, y, w, h, style, options]);
- }
- };
- /**
- * 获取点击信息
- * @param {Number} x
- * @param {Number} y
- * @param {Object} cellStyle
- * @param {Object} cellRect
- * @param {Object} context
- * @returns {{x: *, y: *, row: *, col: *|boolean|*[]|number|{}|UE.dom.dtd.col, cellStyle: *, cellRect: *, sheet: *|StyleSheet, sheetArea: *}}
- */
- proto.getHitInfo = function (x, y, cellStyle, cellRect, context) {
- return {
- x: x,
- y: y,
- row: context.row,
- col: context.col,
- cellStyle: cellStyle,
- cellRect: cellRect,
- sheet: context.sheet,
- sheetArea: context.sheetArea
- };
- };
- /**
- * 鼠标点击
- * @param {Object} hitinfo - 见getHitInfo
- */
- proto.processMouseEnter = function (hitinfo) {
- const col = hitinfo.sheet.zh_setting.cols[hitinfo.col];
- // Drawing Image
- if (col.hoverImg) {
- const cell = hitinfo.sheet.getCell(hitinfo.row, hitinfo.col);
- cell.tag(hover);
- hitinfo.sheet.repaint(hitinfo.cellRect);
- }
- };
- proto.processMouseLeave = function (hitinfo) {
- const col = hitinfo.sheet.zh_setting.cols[hitinfo.col];
- // Drawing Image
- if (col.hoverImg) {
- const cell = hitinfo.sheet.getCell(hitinfo.row, hitinfo.col);
- cell.tag(null);
- hitinfo.sheet.repaint(hitinfo.cellRect);
- }
- };
- proto.processMouseDown = function (hitinfo) {
- const col = hitinfo.sheet.zh_setting.cols[hitinfo.col];
- if (col.activeImg) {
- const cell = hitinfo.sheet.getCell(hitinfo.row, hitinfo.col);
- cell.tag(active);
- hitinfo.sheet.repaint(hitinfo.cellRect);
- }
- };
- proto.processMouseUp = function (hitinfo) {
- const imageClick = hitinfo.sheet.zh_setting ? hitinfo.sheet.zh_setting.imageClick : null;
- if (imageClick && Object.prototype.toString.apply(imageClick) === "[object Function]") {
- const sortData = SpreadJsObj.getSortData(hitinfo.sheet);
- const data = sortData ? sortData[hitinfo.row] : null;
- imageClick(data);
- const cell = hitinfo.sheet.getCell(hitinfo.row, hitinfo.col);
- cell.tag(null);
- hitinfo.sheet.repaint(hitinfo.cellRect);
- }
- };
- /*
- 注释部分以进入鼠标进入图片,点击图片为基准更新图片,鼠标快速移动时,可能失效
- */
- // proto.processMouseDown = function (hitinfo) {
- // const img = this.getImage(hitinfo.sheet, hitinfo.row, hitinfo.col);
- // const halfX = img.width / 2, halfY = img.height / 2;
- // const centerX = hitinfo.cellRect.x + indent + halfX;
- // const centerY = hitinfo.cellRect.y + hitinfo.cellRect.height / 2;
- //
- // if (Math.abs(hitinfo.x - centerX) < halfX && Math.abs(hitinfo.y - centerY) < halfY) {
- // const cell = hitinfo.sheet.getCell(hitinfo.row, hitinfo.col);
- // cell.tag(down);
- // hitinfo.sheet.repaint(hitinfo.cellRect);
- // }
- // };
- // proto.processMouseUp = function (hitinfo) {
- // const img = this.getImage(hitinfo.sheet, hitinfo.row, hitinfo.col);
- // const halfX = img.width / 2, halfY = img.height / 2;
- // const centerX = hitinfo.cellRect.x + indent + halfX;
- // const centerY = hitinfo.cellRect.y + hitinfo.cellRect.height / 2;
- //
- // // 点击展开节点时,如果已加载子项,则展开,反之这加载子项,展开
- // if (Math.abs(hitinfo.x - centerX) < halfX && Math.abs(hitinfo.y - centerY) < halfY) {
- // const imageClick = hitinfo.sheet.zh_setting ? hitinfo.sheet.zh_setting.imageClick : null;
- // if (imageClick && Object.prototype.toString.apply(imageClick) === "[object Function]") {
- // const sortData = SpreadJsObj.getSortData(hitinfo.sheet);
- // const data = sortData ? sortData[hitinfo.row] : null;
- // imageClick(data);
- // const cell = hitinfo.sheet.getCell(hitinfo.row, hitinfo.col);
- // cell.tag(null);
- // hitinfo.sheet.repaint(hitinfo.cellRect);
- // }
- // }
- // };
- // proto.processMouseMove = function (hitinfo) {
- // const img = this.getImage(hitinfo.sheet, hitinfo.row, hitinfo.col);
- // const halfX = img.width / 2, halfY = img.height / 2;
- // const centerX = hitinfo.cellRect.x + indent + halfX;
- // const centerY = hitinfo.cellRect.y + hitinfo.cellRect.height / 2;
- // const cell = hitinfo.sheet.getCell(hitinfo.row, hitinfo.col);
- // if (Math.abs(hitinfo.x - centerX) < halfX && Math.abs(hitinfo.y - centerY) < halfY) {
- // if (cell.tag() !== hover) {
- // cell.tag(hover);
- // hitinfo.sheet.repaint(hitinfo.cellRect);
- // }
- // } else {
- // if (cell.tag() === hover) {
- // cell.tag(null);
- // hitinfo.sheet.repaint(hitinfo.cellRect);
- // }
- // }
- // };
- return new ImageCellType();
- },
- /**
- * 获取 嵌入Html的cellType
- * @returns {HTMLCellType}
- */
- getHtmlCellType: function () {
- const HTMLCellType = function (){};
- HTMLCellType.prototype = new spreadNS.CellTypes.Text;
- const proto = ImageCellType.prototype;
- proto.paint = function (ctx, value, x, y, w, h, style, context) {
- let DOMURL = window.URL || window.webkitURL || window;
- let cell = context.sheet.getCell(context.row, context.col);
- let img = cell.tag();
- if (img) {
- try {
- ctx.save();
- ctx.rect(x, y, w, h);
- ctx.clip();
- ctx.drawImage(img, x + 2, y + 2)
- ctx.restore();
- cell.tag(null);
- return;
- }
- catch (err) {
- GC.Spread.Sheets.CustomCellType.prototype.paint.apply(this, [ctx, "#HTMLError", x, y, w, h, style, context])
- cell.tag(null);
- return;
- }
- }
- let svgPattern = '<svg xmlns="http://www.w3.org/2000/svg" width="{0}" height="{1}">' +
- '<foreignObject width="100%" height="100%"><div xmlns="http://www.w3.org/1999/xhtml" style="font:{2}">{3}</div></foreignObject></svg>';
- let data = svgPattern.replace("{0}", w).replace("{1}", h).replace("{2}", style.font).replace("{3}", value);
- let doc = document.implementation.createHTMLDocument("");
- doc.write(data);
- // Get well-formed markup
- data = (new XMLSerializer()).serializeToString(doc.body.children[0]);
- img = new Image();
- //var svg = new Blob([data], {type: 'image/svg+xml;charset=utf-8'});
- //var url = DOMURL.createObjectURL(svg);
- //img.src = url;
- img.src = 'data:image/svg+xml;base64,' + window.btoa(data);
- cell.tag(img);
- img.onload = function () {
- context.sheet.repaint(new GC.Spread.Sheets.Rect(x, y, w, h));
- }
- };
- return new HTMLCellType();
- },
- /**
- * 获取 字符超长缩略的cellType
- * @returns {EllipsisTextCellType}
- */
- getEllipsisTextCellType: function () {
- const EllipsisTextCellType = function (){};
- EllipsisTextCellType.prototype = new spreadNS.CellTypes.Text;
- const proto = EllipsisTextCellType.prototype;
- const getEllipsisText = function(c, str, maxWidth) {
- var width = c.measureText(str).width;
- var ellipsis = '…';
- var ellipsisWidth = c.measureText(ellipsis).width;
- if (width <= maxWidth || width <= ellipsisWidth) {
- return str;
- } else {
- var len = str.length;
- while (width >= maxWidth - ellipsisWidth && len-- > 0) {
- str = str.substring(0, len);
- width = c.measureText(str).width;
- }
- return str + ellipsis;
- }
- };
- proto.paint = function (ctx, value, x, y, w, h, style, context) {
- ctx.font = style.font;
- value = getEllipsisText(ctx, value, w - 2);
- spreadNS.CellTypes.Text.prototype.paint.apply(this, [ctx, value, x, y, w, h, style, context]);
- };
- return new EllipsisTextCellType();
- },
- }
- };
|