tree_sheet_helper.js 15 KB

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