tree_sheet_helper.js 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365
  1. /**
  2. * Created by Mai on 2017/4/1.
  3. */
  4. var TREE_SHEET_HELPER = {
  5. getObjPos: function (obj) {
  6. let target = obj;
  7. let pos = {x: obj.offsetLeft, y: obj.offsetTop};
  8. target = obj.offsetParent;
  9. while (target) {
  10. pos.x += target.offsetLeft;
  11. pos.y += target.offsetTop;
  12. target = target.offsetParent;
  13. }
  14. return pos;
  15. },
  16. /**
  17. * 初始化setting,需要提示单元格text时,必须先初始化setting
  18. * @param obj
  19. * @param setting
  20. */
  21. initSetting: function (obj, setting) {
  22. setting.pos = this.getObjPos(obj);
  23. },
  24. createNewSpread: function (obj) {
  25. var spread = new GC.Spread.Sheets.Workbook(obj, {sheetCount: 1});
  26. spread.options.tabStripVisible = false;
  27. spread.options.scrollbarMaxAlign = true;
  28. spread.options.cutCopyIndicatorVisible = false;
  29. spread.options.allowCopyPasteExcelStyle = false;
  30. spread.options.allowUserDragDrop = false;
  31. spread.getActiveSheet().setRowCount(3);
  32. return spread;
  33. },
  34. getSheetCellStyle: function (setting) {
  35. var style = new GC.Spread.Sheets.Style();
  36. //style.locked = setting.readOnly ? true : false;
  37. style.name = setting.id;
  38. style.font = setting.data.font;
  39. style.hAlign = setting.data.hAlign;
  40. style.vAlign = setting.data.vAlign;
  41. style.wordWrap = setting.data.wordWrap;
  42. if (setting.data.formatter) {
  43. style.formatter = setting.data.formatter;
  44. }
  45. return style;
  46. },
  47. loadSheetHeader: function (setting, sheet) {
  48. if (setting.frozenCols) {
  49. sheet.frozenColumnCount(setting.frozenCols);
  50. }
  51. sheet.setColumnCount(setting.cols.length);
  52. sheet.setRowCount(setting.headRows, GC.Spread.Sheets.SheetArea.colHeader);
  53. setting.headRowHeight.forEach(function (rowHeight, index) {
  54. sheet.setRowHeight(index, rowHeight, GC.Spread.Sheets.SheetArea.colHeader);
  55. });
  56. setting.cols.forEach(function (col, index) {
  57. var i, iRow = 0, cell;
  58. for (i = 0; i < col.head.spanCols.length; i++) {
  59. if (col.head.spanCols[i] !== 0) {
  60. cell = sheet.getCell(iRow, index, GC.Spread.Sheets.SheetArea.colHeader);
  61. cell.value(col.head.titleNames[i]).font(col.head.font).hAlign(col.head.hAlign[i]).vAlign(col.head.vAlign[i]).wordWrap(true);
  62. }
  63. if (col.head.spanCols[i] > 1 || col.head.spanRows[i] > 1) {
  64. sheet.addSpan(iRow, index, col.head.spanRows[i], col.head.spanCols[i], GC.Spread.Sheets.SheetArea.colHeader);
  65. }
  66. iRow += col.head.spanRows[i];
  67. };
  68. sheet.setColumnWidth(index, col.width);
  69. sheet.setColumnVisible(index, col.visible && true);
  70. });
  71. },
  72. protectdSheet: function (sheet) {
  73. var option = {
  74. allowSelectLockedCells: true,
  75. allowSelectUnlockedCells: true,
  76. allowResizeRows: true,
  77. allowResizeColumns: true
  78. };
  79. sheet.options.protectionOptions = option;
  80. sheet.options.isProtected = true;
  81. },
  82. massOperationSheet: function (sheet, Operation) {
  83. sheet.suspendPaint();
  84. sheet.suspendEvent();
  85. Operation();
  86. sheet.resumeEvent();
  87. sheet.resumePaint();
  88. },
  89. refreshNodesVisible: function (nodes, sheet, recursive) {
  90. nodes.forEach(function (node) {
  91. var iRow;
  92. iRow = node.serialNo();
  93. sheet.setRowVisible(iRow, node.visible, GC.Spread.Sheets.SheetArea.viewport);
  94. if (recursive) {
  95. TREE_SHEET_HELPER.refreshNodesVisible(node.children, sheet, recursive);
  96. }
  97. })
  98. },
  99. refreshTreeNodeData: function (setting, sheet, nodes, recursive) {
  100. nodes.forEach(function (node) {
  101. setting.cols.forEach(function (colSetting, iCol) {
  102. var iRow = node.serialNo();
  103. var cell = sheet.getCell(iRow, iCol, GC.Spread.Sheets.SheetArea.viewport);
  104. // var getFieldText = function () {
  105. // var fields = colSetting.data.field.split('.');
  106. // var validField = fields.reduce(function (field1, field2) {
  107. // if (eval('node.data.' + field1)) {
  108. // return field1 + '.' + field2
  109. // } else {
  110. // return field1;
  111. // }
  112. // });
  113. // if (eval('node.data.' + validField)) {
  114. // return eval('node.data.' + validField);
  115. // } else {
  116. // return '';
  117. // }
  118. // };
  119. var getFieldText2 = function () {
  120. var fields = colSetting.data.field.split('.'), iField, data = node.data;
  121. for (iField = 0; iField < fields.length; iField++) {
  122. if (data[fields[iField]]) {
  123. data = data[fields[iField]];
  124. } else {
  125. return '';
  126. }
  127. }
  128. return data;
  129. };
  130. if (colSetting.data.getText && Object.prototype.toString.apply(colSetting.data.getText) === "[object Function]") {
  131. cell.value(colSetting.data.getText(node));
  132. } else {
  133. cell.value(getFieldText2());
  134. }
  135. if (colSetting.data.cellType && Object.prototype.toString.apply(colSetting.data.cellType) !== "[object String]") {
  136. cell.cellType(colSetting.data.cellType);
  137. }
  138. if (colSetting.readOnly) {
  139. if (Object.prototype.toString.apply(colSetting.readOnly) === "[object Function]") {
  140. cell.locked(colSetting.readOnly(node));
  141. } else {
  142. cell.locked(true);
  143. }
  144. } else {
  145. cell.locked(false);
  146. }
  147. });
  148. sheet.autoFitRow(node.serialNo());
  149. if (recursive) {
  150. TREE_SHEET_HELPER.refreshTreeNodeData(setting, sheet, node.children, recursive);
  151. }
  152. });
  153. },
  154. showTreeData: function (setting, sheet, tree) {
  155. var indent = 20;
  156. var halfBoxLength = 5;
  157. var halfExpandLength = 3;
  158. var TreeNodeCellType = function () {
  159. };
  160. TreeNodeCellType.prototype = new GC.Spread.Sheets.CellTypes.Text();
  161. TreeNodeCellType.prototype.paint = function (ctx, value, x, y, w, h, style, options) {
  162. if (style.backColor) {
  163. ctx.save();
  164. ctx.fillStyle = style.backColor;
  165. ctx.fillRect(x, y, w, h);
  166. ctx.restore();
  167. } else {
  168. ctx.clearRect(x, y, w, h);
  169. }
  170. // ������(x1, y1)���(��, ��), (x2, y2)�յ�(��, ��), ��ɫ
  171. var drawLine = function (canvas, x1, y1, x2, y2, color) {
  172. ctx.save();
  173. // ����ƫ����
  174. ctx.translate(0.5, 0.5);
  175. ctx.beginPath();
  176. ctx.moveTo(x1, y1);
  177. ctx.lineTo(x2, y2);
  178. ctx.strokeStyle = color;
  179. ctx.stroke();
  180. ctx.restore();
  181. };
  182. var drawExpandBox = function (ctx, x, y, w, h, centerX, centerY, expanded) {
  183. var rect = {}, h1, h2, offset = 1;
  184. rect.top = centerY - halfBoxLength;
  185. rect.bottom = centerY + halfBoxLength;
  186. rect.left = centerX - halfBoxLength;
  187. rect.right = centerX + halfBoxLength;
  188. if (rect.left < x + w) {
  189. rect.right = Math.min(rect.right, x + w);
  190. ctx.save();
  191. // ����ƫ����
  192. ctx.translate(0.5, 0.5);
  193. ctx.strokeStyle = 'black';
  194. ctx.beginPath();
  195. ctx.moveTo(rect.left, rect.top);
  196. ctx.lineTo(rect.left, rect.bottom);
  197. ctx.lineTo(rect.right, rect.bottom);
  198. ctx.lineTo(rect.right, rect.top);
  199. ctx.lineTo(rect.left, rect.top);
  200. ctx.stroke();
  201. ctx.fillStyle = 'white';
  202. ctx.fill();
  203. ctx.restore();
  204. // Draw Horizontal Line
  205. h1 = centerX - halfExpandLength;
  206. h2 = Math.min(centerX + halfExpandLength, x + w);
  207. if (h2 > h1) {
  208. drawLine(ctx, h1, centerY, h2, centerY, 'black');
  209. }
  210. // Draw Vertical Line
  211. if (!expanded && (centerX < x + w)) {
  212. drawLine(ctx, centerX, centerY - halfExpandLength, centerX, centerY + halfExpandLength, 'black');
  213. }
  214. }
  215. }
  216. var node = tree.items[options.row];
  217. var showTreeLine = true;
  218. if (!node) { return; }
  219. var iLevel = node.depth();
  220. var centerX = Math.floor(x) + node.depth() * indent + indent / 2;
  221. var x1 = centerX + indent / 2;
  222. var centerY = Math.floor((y + (y + h)) / 2);
  223. var y1;
  224. // Draw Sibling Line
  225. if (showTreeLine) {
  226. // Draw Horizontal Line
  227. if (centerX < x + w) {
  228. drawLine(ctx, centerX, centerY, Math.min(x1, x + w), centerY, 'gray');
  229. }
  230. // Draw Vertical Line
  231. if (centerX < x + w) {
  232. y1 = node.isLast() ? centerY : y + h;
  233. if (node.isFirst() && !node.parent) {
  234. drawLine(ctx, centerX, centerY, centerX, y1, 'gray');
  235. } else {
  236. drawLine(ctx, centerX, y, centerX, y1, 'gray');
  237. }
  238. }
  239. }
  240. // Draw Expand Box
  241. if (node.children.length > 0) {
  242. drawExpandBox(ctx, x, y, w, h, centerX, centerY, node.expanded);
  243. }
  244. // Draw Parent Line
  245. if (showTreeLine) {
  246. var parent = node.parent, parentCenterX = centerX - indent;
  247. while (parent) {
  248. if (!parent.isLast()) {
  249. if (parentCenterX < x + w) {
  250. drawLine(ctx, parentCenterX, y, parentCenterX, y + h, 'gray');
  251. }
  252. }
  253. parent = parent.parent;
  254. parentCenterX -= indent;
  255. }
  256. };
  257. // Draw Text
  258. x = x + (node.depth() + 1) * indent;
  259. GC.Spread.Sheets.CellTypes.Text.prototype.paint.apply(this, arguments);
  260. };
  261. TreeNodeCellType.prototype.getHitInfo = function (x, y, cellStyle, cellRect, context) {
  262. return {
  263. x: x,
  264. y: y,
  265. row: context.row,
  266. col: context.col,
  267. cellStyle: cellStyle,
  268. cellRect: cellRect,
  269. sheetArea: context.sheetArea
  270. };
  271. };
  272. TreeNodeCellType.prototype.processMouseDown = function (hitinfo) {
  273. var offset = -1;
  274. var node = tree.items[hitinfo.row];
  275. tree.selected = node;
  276. if (!node || node.children.length === 0) { return; }
  277. var centerX = hitinfo.cellRect.x + offset + node.depth() * indent + indent / 2;
  278. var centerY = (hitinfo.cellRect.y + offset + (hitinfo.cellRect.y + offset + hitinfo.cellRect.height)) / 2;
  279. if (hitinfo.x > centerX - halfBoxLength && hitinfo.x < centerX + halfBoxLength && hitinfo.y > centerY - halfBoxLength && hitinfo.y < centerY + halfBoxLength) {
  280. node.setExpanded(!node.expanded);
  281. TREE_SHEET_HELPER.massOperationSheet(hitinfo.sheet, function () {
  282. var iCount = node.posterityCount(), i, child;
  283. for (i = 0; i < iCount; i++) {
  284. child = tree.items[hitinfo.row + i + 1];
  285. hitinfo.sheet.setRowVisible(hitinfo.row + i + 1, child.visible, hitinfo.sheetArea);
  286. //hitinfo.sheet.setRowVisible(hitinfo.row + i + 1, child.vis(), hitinfo.sheetArea);
  287. }
  288. hitinfo.sheet.invalidateLayout();
  289. });
  290. hitinfo.sheet.repaint();
  291. }
  292. };
  293. let TipCellType = function () {};
  294. TipCellType.prototype = new GC.Spread.Sheets.CellTypes.Text();
  295. TipCellType.prototype.getHitInfo = function (x, y, cellStyle, cellRect, context) {
  296. return {
  297. x: x,
  298. y: y,
  299. row: context.row,
  300. col: context.col,
  301. cellStyle: cellStyle,
  302. cellRect: cellRect,
  303. sheet: context.sheet,
  304. sheetArea: context.sheetArea
  305. };
  306. };
  307. TipCellType.prototype.processMouseEnter = function (hitinfo) {
  308. let text = hitinfo.sheet.getText(hitinfo.row, hitinfo.col);
  309. if (setting.pos && text && text !== '') {
  310. if (!this._toolTipElement) {
  311. var div = document.createElement("div");
  312. $(div).css("position", "absolute")
  313. .css("border", "1px #C0C0C0 solid")
  314. .css("box-shadow", "1px 2px 5px rgba(0,0,0,0.4)")
  315. .css("font", "9pt Arial")
  316. .css("background", "white")
  317. .css("padding", 5);
  318. this._toolTipElement = div;
  319. }
  320. $(this._toolTipElement).text(text).css("top", setting.pos.y + hitinfo.y + 15).css("left", setting.pos.x + hitinfo.x + 15);
  321. $(this._toolTipElement).hide();
  322. document.body.insertBefore(this._toolTipElement, null);
  323. $(this._toolTipElement).show("fast");
  324. }
  325. };
  326. TipCellType.prototype.processMouseLeave = function (hininfo) {
  327. if (this._toolTipElement) {
  328. document.body.removeChild(this._toolTipElement);
  329. this._toolTipElement = null;
  330. }
  331. }
  332. TREE_SHEET_HELPER.protectdSheet(sheet);
  333. TREE_SHEET_HELPER.massOperationSheet(sheet, function () {
  334. sheet.rowOutlines.direction(GC.Spread.Sheets.Outlines.OutlineDirection.backward);
  335. sheet.showRowOutline(false);
  336. if (setting.defaultRowHeight) {
  337. sheet.defaults.rowHeight = setting.defaultRowHeight;
  338. }
  339. sheet.setRowCount(tree.count() + setting.emptyRows, GC.Spread.Sheets.SheetArea.viewport);
  340. setting.cols.forEach(function (colSetting, iCol) {
  341. sheet.setStyle(-1, iCol, TREE_SHEET_HELPER.getSheetCellStyle(colSetting));
  342. if (colSetting.showHint) {
  343. sheet.getRange(-1, iCol, -1, 1).cellType(new TipCellType());
  344. }
  345. });
  346. sheet.getRange(-1, setting.treeCol, -1, 1).cellType(new TreeNodeCellType());
  347. TREE_SHEET_HELPER.refreshTreeNodeData(setting, sheet, tree.roots, true);
  348. TREE_SHEET_HELPER.refreshNodesVisible(tree.roots, sheet, true);
  349. });
  350. }
  351. };