spreadjs_zh.js 84 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879
  1. /**
  2. * Spreadjs 通用方法集
  3. *
  4. * @author Mai
  5. * @date 2018/02/06
  6. * @version
  7. */
  8. // 定义画点线的方法
  9. const proto = window.CanvasRenderingContext2D && CanvasRenderingContext2D.prototype;
  10. proto.dottedLine = function (x1, y1, x2, y2, interval = 4) {
  11. const isHorizontal = x1 == x2 ? false : true;
  12. const dotLen = 1;
  13. let len = isHorizontal ? x2 - x1 : y2 - y1;
  14. this.moveTo(x1, y1);
  15. let progress = 0;
  16. while (len > progress) {
  17. if (progress > len) { progress = len; }
  18. if (isHorizontal) {
  19. this.moveTo(x1 + progress, y1);
  20. this.lineTo(x1 + progress + dotLen, y1);
  21. } else {
  22. this.moveTo(x1, y1 + progress);
  23. this.lineTo(x1, y1 + progress + dotLen);
  24. }
  25. progress += interval;
  26. }
  27. };
  28. // 简写Spread常量
  29. const spreadNS = GC.Spread.Sheets;
  30. // 授权码
  31. spreadNS.LicenseKey = "559432293813965#A0y3iTOzEDOzkjMyMDN9UTNiojIklkI1pjIEJCLi4TPB9mM5AFNTd4cvZ7SaJUVy3CWKtWYXx4VVhjMpp7dYNGdx2ia9sEVlZGOTh7NRlTUwkWR9wEV4gmbjBDZ4ElR8N7cGdHVvEWVBtCOwIGW0ZmeYVWVr3mI0IyUiwCMzETN8kzNzYTM0IicfJye&Qf35VfiEzRwEkI0IyQiwiIwEjL6ByUKBCZhVmcwNlI0IiTis7W0ICZyBlIsIyNyMzM5ADI5ADNwcTMwIjI0ICdyNkIsIibj9SbvNmL4N7bjRnch56ciojIz5GRiwiI8+Y9sWY9QmZ0Jyp96uL9v6L0wap9biY9qiq95q197Wr9g+89iojIh94Wiqi";
  32. // SpreadJs常用方法
  33. const SpreadJsObj = {
  34. initSpreadSettingEvents: function (setting, events) {
  35. const getEvent = function (eventName) {
  36. const names = eventName.split('.');
  37. let event = events;
  38. for (let name of names) {
  39. if (event[name]) {
  40. event = event[name];
  41. } else {
  42. return null;
  43. }
  44. }
  45. if (event && Object.prototype.toString.apply(event) !== "[object Function]") {
  46. return null;
  47. } else {
  48. return event;
  49. }
  50. };
  51. for (const col of setting.cols) {
  52. if (col.readOnly && Object.prototype.toString.apply(col.readOnly) === "[object String]") {
  53. col.readOnly = getEvent(col.readOnly);
  54. }
  55. if (col.getValue && Object.prototype.toString.apply(col.getValue) === "[object String]") {
  56. col.getValue = getEvent(col.getValue);
  57. }
  58. }
  59. },
  60. DataType: {
  61. Data: 'data',
  62. Tree: 'tree',
  63. },
  64. /**
  65. * 创建Spread(默认1张表,3行数据)
  66. * @param obj 用于创建spreadjs的Dom元素
  67. * @returns {GC.Spread.Sheets.Workbook}
  68. */
  69. createNewSpread: function (obj) {
  70. const spread = new spreadNS.Workbook(obj, {sheetCount: 1});
  71. spread.options.tabStripVisible = false;
  72. spread.options.scrollbarMaxAlign = true;
  73. spread.options.cutCopyIndicatorVisible = false;
  74. spread.options.allowCopyPasteExcelStyle = false;
  75. spread.options.allowUserDragDrop = false;
  76. spread.options.allowUserDragFill = false;
  77. spread.options.showDragFillSmartTag = false;
  78. spread.options.allowUserEditFormula = false;
  79. spread.options.allowExtendPasteRange = true;
  80. spread.options.copyPasteHeaderOptions = spreadNS.CopyPasteHeaderOptions.noHeaders;
  81. spread.getActiveSheet().options.clipBoardOptions = spreadNS.ClipboardPasteOptions.values;//设置粘贴时只粘贴值
  82. spread.getActiveSheet().setRowCount(3);
  83. return spread;
  84. },
  85. addCutEvents: function (spread, fun) {
  86. const cut = spreadNS.Commands.cut.execute;
  87. spreadNS.Commands.cut.execute = function (context, options, isUndo) {
  88. const sheet = context.getActiveSheet();
  89. const sels = sheet.getSelections();
  90. const sel = sels ? sels[0] : null;
  91. if (sel) {
  92. return fun(sheet, sel, function () {
  93. cut(context, options, isUndo);
  94. });
  95. }
  96. }
  97. },
  98. /**
  99. * 保护sheet(需设置保护后, 单元格的locked等属性方可生效)
  100. * @param {GC.Spread.Sheets.Worksheet} sheet
  101. */
  102. protectedSheet: function (sheet) {
  103. const option = {
  104. allowSelectLockedCells: true,
  105. allowSelectUnlockedCells: true,
  106. allowResizeRows: true,
  107. allowResizeColumns: true
  108. };
  109. const defaultStyle = sheet.getDefaultStyle();
  110. defaultStyle.locked = false;
  111. sheet.setDefaultStyle(defaultStyle);
  112. sheet.options.protectionOptions = option;
  113. sheet.options.isProtected = true;
  114. sheet.options.allowCellOverflow = false;
  115. },
  116. /**
  117. * sheet批量操作优化(sheet操作大批量数据时, 屏蔽数据刷新, 可优化大量时间)
  118. * @param {GC.Spread.Sheets.Worksheet} sheet
  119. * @param {function} operation
  120. */
  121. beginMassOperation: function (sheet) {
  122. sheet.suspendPaint();
  123. sheet.suspendEvent();
  124. },
  125. endMassOperation: function (sheet) {
  126. sheet.resumeEvent();
  127. sheet.resumePaint();
  128. },
  129. massOperationSheet: function (sheet, operation) {
  130. this.beginMassOperation(sheet);
  131. operation();
  132. this.endMassOperation(sheet);
  133. },
  134. /**
  135. * 获取Obj左顶点位置(部分功能需通过spreadjs左顶点位置计算)
  136. * @param obj
  137. * @returns {{x: number, y: number}}
  138. */
  139. getObjPos: function (obj) {
  140. if (!obj) return null;
  141. let target = obj;
  142. let pos = {x: obj.offsetLeft, y: obj.offsetTop};
  143. target = obj.offsetParent;
  144. while (target) {
  145. pos.x += target.offsetLeft;
  146. pos.y += target.offsetTop;
  147. target = target.offsetParent;
  148. }
  149. return pos;
  150. },
  151. /**
  152. * 以下四个方法来自Spread示例, 参见官网或文档
  153. */
  154. getHitTest: function (obj, e, sheet) {
  155. var offset = obj.offset(),
  156. x = e.pageX - offset.left,
  157. y = e.pageY - offset.top;
  158. return sheet.hitTest(x, y);
  159. },
  160. getTargetSelection: function (sheet, target) {
  161. if (target.hitTestType === spreadNS.SheetArea.colHeader) {
  162. return sheet.getRange(-1, target.col, sheet.getRowCount(), 1);
  163. } else if (target.hitTestType === spreadNS.SheetArea.rowHeader) {
  164. return sheet.getRange(target.row, -1, 1, sheet.getColumnCount());
  165. } else if (target.hitTestType === spreadNS.SheetArea.viewport) {
  166. return sheet.getRange(target.row, target.col, 1, 1);
  167. } else if (target.hitTestType === spreadNS.SheetArea.corner) {
  168. return sheet.getRange(-1, -1, sheet.getRowCount(), sheet.getColumnCount());
  169. };
  170. },
  171. getCellInSelections: function (selections, row, col) {
  172. const count = selections.length;
  173. let range;
  174. for (var i = 0; i < count; i++) {
  175. range = selections[i];
  176. if (range.contains(row, col)) {
  177. return range;
  178. }
  179. }
  180. return null;
  181. },
  182. checkTargetInSelection: function (selections, range) {
  183. var count = selections.length, sel;
  184. for (var i = 0; i < count; i++) {
  185. sel = selections[i];
  186. if (sel.containsRange(range)) {
  187. return true;
  188. }
  189. }
  190. return false;
  191. },
  192. /**
  193. * 获取 spread 在鼠标右键时, spread的选中区域
  194. * viewport, 选中鼠标点击单元格X, X不在原选中区域内, 则选中X
  195. * colHeader, 选中整列
  196. * rowHeader, 选中整行
  197. * corner, 全选
  198. * 该方法返回不符合需求时,可通过getHitTest/getTargetSelection/getCellInSelections/checkTargetInSelection来确定鼠标右键点击时,spread当前Sheet应选中的单元格
  199. * @param obj: 创建Spread的Dom元素(jquery-contextmenu.build方法的第一个变量可读取)
  200. * @param e: jquery-contextmenu.build方法的第二个变量
  201. * @param {GC.Spread.Sheets.Workbook} spread
  202. * @returns {*}
  203. */
  204. safeRightClickSelection: function (obj, e, spread) {
  205. const sheet = spread.getActiveSheet();
  206. const selections = sheet.getSelections(), target = this.getHitTest(obj, e, sheet), range = this.getTargetSelection(sheet, target);
  207. if (!this.checkTargetInSelection(selections, range)) {
  208. sheet.setSelection(range.row, range.col, range.rowCount, range.colCount);
  209. }
  210. return target;
  211. },
  212. /**
  213. * 禁用右键菜单
  214. * @param selector
  215. * @param spread
  216. */
  217. forbiddenSpreadContextMenu: function (selector, spread) {
  218. $.contextMenu({
  219. selector: selector,
  220. build: function ($trigger, e) {
  221. const target = SpreadJsObj.safeRightClickSelection($trigger, e, spread);
  222. return target.hitTestType === spreadNS.SheetArea.viewport || target.hitTestType === spreadNS.SheetArea.rowHeader;
  223. }
  224. });
  225. },
  226. /**
  227. * 获取写入sheet的数据序列
  228. * data:sheet.zh_data, tree: sheet.zh_tree.nodes
  229. * @param sheet
  230. * @returns {*}
  231. */
  232. getSortData: function (sheet) {
  233. if (sheet.zh_dataType) {
  234. if (sheet.zh_dataType === this.DataType.Data) {
  235. return sheet.zh_data;
  236. } else if (sheet.zh_dataType === this.DataType.Tree) {
  237. return sheet.zh_tree.nodes;
  238. } else {
  239. return null;
  240. }
  241. } else {
  242. return null;
  243. }
  244. },
  245. /**
  246. * sheet中 使用delete键,触发EndEdited事件
  247. * @param {GC.Spreads.Sheets.Workbook} spread
  248. * @param {function} fun
  249. */
  250. addDeleteBind: function (spread, fun) {
  251. spread.commandManager().register('deleteEvent', function () {
  252. fun(spread.getActiveSheet());
  253. });
  254. spread.commandManager().setShortcutKey(null, GC.Spread.Commands.Key.del, false, false, false, false);
  255. spread.commandManager().setShortcutKey('deleteEvent', GC.Spread.Commands.Key.del, false, false, false, false);
  256. },
  257. _initSheetDeafult: function (sheet) {
  258. if (sheet.zh_setting.headerFont) {
  259. const vStyle = new spreadNS.Style();
  260. vStyle.font = sheet.zh_setting.headerFont;
  261. vStyle.locked = false;
  262. sheet.setDefaultStyle(vStyle, spreadNS.SheetArea.colHeader);
  263. }
  264. if (sheet.zh_setting.font) {
  265. const vStyle = new spreadNS.Style();
  266. vStyle.font = sheet.zh_setting.font;
  267. vStyle.locked = false;
  268. sheet.setDefaultStyle(vStyle, spreadNS.SheetArea.viewport);
  269. }
  270. },
  271. /**
  272. * 根据sheet.zh_setting初始化sheet表头
  273. * @param {GC.Spread.Sheets.Worksheet} sheet
  274. */
  275. _initSheetHeader: function (sheet) {
  276. if (!sheet.zh_setting) { return; }
  277. sheet.setColumnCount(sheet.zh_setting.cols.length);
  278. sheet.setRowCount(sheet.zh_setting.headRows, spreadNS.SheetArea.colHeader);
  279. for (let iRow = 0; iRow < sheet.zh_setting.headRowHeight.length; iRow ++) {
  280. sheet.setRowHeight(iRow, sheet.zh_setting.headRowHeight[iRow], spreadNS.SheetArea.colHeader);
  281. }
  282. for (let iCol = 0; iCol < sheet.zh_setting.cols.length; iCol++) {
  283. const col = sheet.zh_setting.cols[iCol];
  284. const title = col.title.split('|');
  285. const colSpan = col.colSpan ? col.colSpan.split('|'): ['1'], rowSpan = col.rowSpan ? col.rowSpan.split('|'): ['1'];
  286. for (let i = 0; i < title.length; i++) {
  287. const cell = sheet.getCell(i, iCol, spreadNS.SheetArea.colHeader);
  288. cell.text(title[i]).wordWrap(true);
  289. if ((colSpan[i] !== '' && colSpan[i] !== '1') || (rowSpan[i] !== '' && rowSpan[i] !== '1')) {
  290. sheet.addSpan(i, iCol, parseInt(rowSpan[i]), parseInt(colSpan[i]), spreadNS.SheetArea.colHeader);
  291. }
  292. }
  293. sheet.setColumnWidth(iCol, col.width);
  294. if (col.visible !== undefined && col.visible !== null) {
  295. sheet.setColumnVisible(iCol, col.visible);
  296. }
  297. }
  298. sheet.rowOutlines.direction(spreadNS.Outlines.OutlineDirection.backward);
  299. sheet.showRowOutline(false);
  300. if (sheet.zh_setting.defaultRowHeight) {
  301. sheet.defaults.rowHeight = sheet.zh_setting.defaultRowHeight;
  302. }
  303. },
  304. /**
  305. * 初始化sheet, 设置sheet.zh_setting, 并初始化表头
  306. * @param {GC.Spread.Sheets.Worksheet} sheet
  307. * @param setting
  308. */
  309. initSheet: function (sheet, setting) {
  310. this.beginMassOperation(sheet);
  311. setting.pos = sheet.getParent().pos;
  312. sheet.zh_setting = setting;
  313. if (sheet.zh_setting.headColWidth) {
  314. for (const [i, w] of sheet.zh_setting.headColWidth.entries()) {
  315. sheet.setColumnWidth(i, w, spreadNS.SheetArea.rowHeader);
  316. }
  317. }
  318. this._initSheetDeafult(sheet);
  319. this._initSheetHeader(sheet);
  320. sheet.setRowCount(sheet.zh_setting.emptyRows);
  321. sheet.extendCellType = {};
  322. sheet.getRange(0, 0, sheet.getRowCount(), sheet.getColumnCount()).locked(setting.readOnly);
  323. this.endMassOperation(sheet);
  324. },
  325. reLoadSheetHeader: function (sheet) {
  326. if (sheet.zh_setting) {
  327. this.beginMassOperation(sheet);
  328. this._initSheetHeader(sheet);
  329. this.endMassOperation(sheet);
  330. }
  331. },
  332. _loadRowData: function (sheet, data, row) {
  333. // 单元格重新写入数据
  334. if (!data) { return }
  335. sheet.zh_setting.cols.forEach(function (col, j) {
  336. const cell = sheet.getCell(row, j);
  337. if (col.getValue && Object.prototype.toString.apply(col.getValue) === "[object Function]") {
  338. cell.value(col.getValue(data));
  339. } else if (col.field !== '' && data[col.field]) {
  340. cell.value(data[col.field]);
  341. }
  342. if (col.font) {
  343. cell.font(col.font);
  344. }
  345. if (col.foreColor) {
  346. if (Object.prototype.toString.apply(col.foreColor) === "[object Function]") {
  347. cell.foreColor(col.foreColor(data, sheet.getDefaultStyle().foreColor));
  348. } else {
  349. cell.foreColor(col.foreColor);
  350. }
  351. }
  352. if (col.readOnly && Object.prototype.toString.apply(col.readOnly) === "[object Function]") {
  353. cell.locked(col.readOnly(data) || sheet.zh_setting.readOnly || false).vAlign(1).hAlign(col.hAlign);
  354. } else {
  355. cell.locked(col.readOnly || sheet.zh_setting.readOnly || false).vAlign(1).hAlign(col.hAlign);
  356. }
  357. if (col.formatter) {
  358. cell.formatter(col.formatter);
  359. } else if (col.type === 'Number') {
  360. cell.formatter('0.######');
  361. }
  362. if (sheet.zh_setting.getColor && Object.prototype.toString.apply(sheet.zh_setting.getColor) === "[object Function]") {
  363. cell.backColor(sheet.zh_setting.getColor(sheet, data, col, sheet.getDefaultStyle().backColor));
  364. }
  365. });
  366. },
  367. _defineColCellType: function (sheet, col, colSetting) {
  368. sheet.AcitveComboRefresh = false;
  369. if(colSetting.cellType === 'ellipsis') {
  370. if (!sheet.extendCellType.ellipsis) {
  371. sheet.extendCellType.ellipsis = this.CellType.getEllipsisTextCellType();
  372. }
  373. sheet.getRange(-1, col, -1, 1).cellType(sheet.extendCellType.ellipsis);
  374. }
  375. if(colSetting.cellType === 'ellipsisAutoTip') {
  376. if (!sheet.extendCellType.ellipsisAutoTip) {
  377. sheet.extendCellType.ellipsisAutoTip = this.CellType.getEllipsisTextAutoTipCellType();
  378. }
  379. sheet.getRange(-1, col, -1, 1).cellType(sheet.extendCellType.ellipsisAutoTip);
  380. }
  381. if(colSetting.cellType === 'html') {
  382. if (!sheet.extendCellType.html) {
  383. sheet.extendCellType.html = this.CellType.getHtmlCellType();
  384. }
  385. sheet.getRange(-1, col, -1, 1).cellType(sheet.extendCellType.html);
  386. }
  387. if (colSetting.cellType === 'image') {
  388. if (!sheet.extendCellType.image) {
  389. sheet.extendCellType.image = this.CellType.getImageCellType();
  390. }
  391. sheet.getRange(-1, col, -1, 1).cellType(sheet.extendCellType.image);
  392. }
  393. if (colSetting.cellType === 'imageBtn') {
  394. if (!sheet.extendCellType.imageBtn) {
  395. sheet.extendCellType.imageBtn = this.CellType.getImageButtonCellType();
  396. }
  397. sheet.getRange(-1, col, -1, 1).cellType(sheet.extendCellType.imageBtn);
  398. }
  399. if (colSetting.cellType === 'activeImageBtn') {
  400. if (!sheet.extendCellType.activeImageBtn) {
  401. sheet.extendCellType.activeImageBtn = this.CellType.getActiveImageButtonCellType();
  402. }
  403. sheet.getRange(-1, col, -1, 1).cellType(sheet.extendCellType.activeImageBtn);
  404. }
  405. if (colSetting.cellType === 'tree') {
  406. if (!sheet.extendCellType.tree) {
  407. sheet.extendCellType.tree = this.CellType.getTreeNodeCellType();
  408. }
  409. sheet.getRange(-1, col, -1, 1).cellType(sheet.extendCellType.tree);
  410. }
  411. if (colSetting.cellType === 'tip') {
  412. if (!sheet.extendCellType.tip) {
  413. sheet.extendCellType.tip = this.CellType.getTipCellType();
  414. }
  415. sheet.getRange(-1, col, -1, 1).cellType(sheet.extendCellType.tip);
  416. }
  417. if (colSetting.cellType === 'autoTip') {
  418. if (!sheet.extendCellType.autoTip) {
  419. sheet.extendCellType.autoTip = this.CellType.getAutoTipCellType();
  420. }
  421. sheet.getRange(-1, col, -1, 1).cellType(sheet.extendCellType.autoTip);
  422. }
  423. if (colSetting.cellType === 'checkbox') {
  424. if (!sheet.extendCellType.checkbox) {
  425. sheet.extendCellType.checkbox = new spreadNS.CellTypes.CheckBox();
  426. }
  427. sheet.getRange(-1, col, -1, 1).cellType(sheet.extendCellType.checkbox);
  428. }
  429. if (colSetting.cellType === 'unit') {
  430. if (!sheet.extendCellType.unit) {
  431. sheet.extendCellType.unit = this.CellType.getUnitCellType();
  432. if (!sheet.AcitveComboRefresh) {
  433. sheet.bind(spreadNS.Events.LeaveCell, function (e, info) {
  434. const cellType = info.sheet.getCell(info.row, info.col).cellType();
  435. if (cellType === sheet.extendCellType.unit) {
  436. info.sheet.leaveCell = {row: info.row, col: info.col};
  437. } else {
  438. delete info.sheet.leaveCell;
  439. }
  440. });
  441. sheet.bind(spreadNS.Events.EnterCell, function (e, info) {
  442. if (info.sheet.leaveCell) {
  443. info.sheet.repaint(info.sheet.getCellRect(info.sheet.leaveCell.row, info.sheet.leaveCell.col));
  444. }
  445. });
  446. sheet.AcitveComboRefresh = true;
  447. }
  448. }
  449. sheet.getRange(-1, col, -1, 1).cellType(sheet.extendCellType.unit);
  450. }
  451. if (colSetting.cellType === 'customizeCombo') {
  452. const cellKey = colSetting.cellTypeKey ? 'customizeCombo-' + colSetting.cellTypeKey : 'customizeCombo';
  453. if (!sheet.extendCellType[cellKey]) {
  454. sheet.extendCellType[cellKey] = this.CellType.getCustomizeComboCellType(colSetting.comboItems);
  455. if (!sheet.AcitveComboRefresh) {
  456. sheet.bind(spreadNS.Events.LeaveCell, function (e, info) {
  457. const cellType = info.sheet.getCell(info.row, info.col).cellType();
  458. if (cellType === sheet.extendCellType[cellKey]) {
  459. info.sheet.leaveCell = {row: info.row, col: info.col};
  460. } else {
  461. delete info.sheet.leaveCell;
  462. }
  463. });
  464. sheet.bind(spreadNS.Events.EnterCell, function (e, info) {
  465. if (info.sheet.leaveCell) {
  466. info.sheet.repaint(info.sheet.getCellRect(info.sheet.leaveCell.row, info.sheet.leaveCell.col));
  467. }
  468. });
  469. sheet.AcitveComboRefresh = true;
  470. }
  471. }
  472. sheet.getRange(-1, col, -1, 1).cellType(sheet.extendCellType[cellKey]);
  473. }
  474. if (colSetting.formatter) {
  475. sheet.getRange(-1, col, -1, 1).formatter(colSetting.formatter);
  476. }
  477. },
  478. /**
  479. * 整个sheet重新加载数据
  480. * @param {GC.Spread.Sheets.Worksheet} sheet
  481. */
  482. reLoadSheetData: function (sheet) {
  483. const self = this;
  484. const sortData = sheet.zh_dataType === 'tree' ? sheet.zh_tree.nodes : sheet.zh_data;
  485. this.beginMassOperation(sheet);
  486. try {
  487. sheet.clear(0, 0, sheet.getRowCount(), sheet.getColumnCount(), spreadNS.SheetArea.viewport, spreadNS.StorageType.data);
  488. sheet.getRange(0, 0, sheet.getRowCount(), sheet.getColumnCount()).backColor(sheet.getDefaultStyle().backColor);
  489. // 设置总行数
  490. const totalRow = sortData.length + sheet.zh_setting.emptyRows;
  491. sheet.setRowCount(totalRow, spreadNS.SheetArea.viewport);
  492. // 控制空白行
  493. const emptyRows = sheet.getRange(sortData.length, -1, sheet.zh_setting.emptyRows, -1);
  494. emptyRows.locked(sheet.zh_dataType === 'tree');
  495. if (sortData) {
  496. // 单元格写入数据
  497. sortData.forEach(function (data, i) {
  498. self._loadRowData(sheet, data, i);
  499. sheet.setRowVisible(i, data.visible);
  500. });
  501. }
  502. // 设置列单元格格式
  503. sheet.zh_setting.cols.forEach(function (col, j) {
  504. //if (!col.cellType) { return; }
  505. self._defineColCellType(sheet, j, col);
  506. });
  507. this.endMassOperation(sheet);
  508. } catch (err) {
  509. this.endMassOperation(sheet);
  510. }
  511. },
  512. /**
  513. * 重新加载部分数据行
  514. * @param {GC.Spread.Sheets.Worksheet} sheet
  515. * @param {Number} row
  516. * @param {Number} count
  517. */
  518. reLoadRowData: function (sheet, row, count = 1) {
  519. if (row < 0) { return; }
  520. const self = this;
  521. const sortData = sheet.zh_dataType === 'tree' ? sheet.zh_tree.nodes : sheet.zh_data;
  522. this.beginMassOperation(sheet);
  523. try {
  524. // 清空原单元格数据
  525. sheet.clear(row, -1, count, -1, spreadNS.SheetArea.viewport, spreadNS.StorageType.data);
  526. sheet.getRange(row, -1, count, -1).backColor(sheet.getDefaultStyle().backColor);
  527. // 单元格重新写入数据
  528. for (let i = row; i < row + count; i++) {
  529. const data = sortData[i];
  530. if (!data) { continue; }
  531. this._loadRowData(sheet, data, i);
  532. sheet.setRowVisible(i, data.visible);
  533. }
  534. this.endMassOperation(sheet);
  535. } catch (err) {
  536. this.endMassOperation(sheet);
  537. }
  538. },
  539. /**
  540. * 重新加载部分行数据
  541. * @param {GC.Spread.Sheets.Worksheet} sheet
  542. * @param {Array} rows
  543. */
  544. reLoadRowsData: function (sheet, rows) {
  545. const self = this;
  546. const sortData = sheet.zh_dataType === 'tree' ? sheet.zh_tree.nodes : sheet.zh_data;
  547. this.beginMassOperation(sheet);
  548. try {
  549. for (const row of rows) {
  550. if (row < 0) { continue; }
  551. // 清空原单元格数据
  552. sheet.clear(row, -1, 1, -1, spreadNS.SheetArea.viewport, spreadNS.StorageType.data);
  553. sheet.getRange(row, -1, 1, -1).backColor(sheet.getDefaultStyle().backColor);
  554. const data = sortData[row];
  555. // 单元格重新写入数据
  556. this._loadRowData(sheet, data, row);
  557. sheet.setRowVisible(row, data.visible);
  558. };
  559. this.endMassOperation(sheet);
  560. } catch (err) {
  561. this.endMassOperation(sheet);
  562. }
  563. },
  564. /**
  565. * 重新加载部分列数据
  566. * @param {GC.Spread.Sheets.Worksheet} sheet
  567. * @param {Array} cols
  568. */
  569. reLoadColsData: function (sheet, cols) {
  570. const self = this;
  571. const sortData = sheet.zh_dataType === 'tree' ? sheet.zh_tree.nodes : sheet.zh_data;
  572. this.beginMassOperation(sheet);
  573. try {
  574. for (const iCol of cols) {
  575. // 清空原单元格数据
  576. sheet.clear(-1, iCol, -1, 1, spreadNS.SheetArea.viewport, spreadNS.StorageType.data);
  577. const col = sheet.zh_setting.cols[iCol];
  578. sortData.forEach(function (data, i) {
  579. // 设置值
  580. const cell = sheet.getCell(i, iCol);
  581. if (col.field !== '' && data[col.field]) {
  582. cell.value(data[col.field]).locked(col.readOnly || sheet.zh_setting.readOnly || false).vAlign(1).hAlign(col.hAlign);
  583. } else {
  584. cell.locked(col.readOnly || sheet.zh_setting.readOnly || false).vAlign(1).hAlign(col.hAlign);
  585. }
  586. // 设置单元格格式
  587. if (col.formatter) {
  588. cell.formatter(col.formatter);
  589. }
  590. });
  591. }
  592. this.endMassOperation(sheet);
  593. } catch (err) {
  594. this.endMassOperation(sheet);
  595. }
  596. },
  597. reLoadNodesData: function (sheet, nodes) {
  598. this.beginMassOperation(sheet);
  599. nodes = nodes instanceof Array ? nodes : [nodes];
  600. for (const node of nodes) {
  601. const sortData = sheet.zh_dataType === 'tree' ? sheet.zh_tree.nodes : sheet.zh_data;
  602. this._loadRowData(sheet, node, sortData.indexOf(node));
  603. }
  604. this.endMassOperation(sheet);
  605. },
  606. /**
  607. * 根据data加载sheet数据,合并了一般数据和树结构数据的加载
  608. * @param {GC.Spread.Sheets.Worksheet} sheet
  609. * @param {String} dataType - 1.'zh_data' 2.'zh_tree'
  610. * @param {Array|PathTree} data - 对dataType对应
  611. */
  612. loadSheetData: function (sheet, dataType, data){
  613. sheet.zh_dataType = dataType;
  614. if (dataType === 'tree') {
  615. sheet.zh_tree = data;
  616. } else {
  617. sheet.zh_data = data;
  618. }
  619. this.protectedSheet(sheet);
  620. this.reLoadSheetData(sheet);
  621. },
  622. /**
  623. * 获取复制数据HTML格式(过滤不可见单元格)
  624. * @param {GC.Spread.Sheets.Worksheet} sheet
  625. * @returns {string}
  626. */
  627. getFilterCopyHTML: function (sheet) {
  628. const sel = sheet.getSelections()[0];
  629. const html = [];
  630. html.push('<table>');
  631. for (let i = sel.row, iLen = sel.row + sel.rowCount; i < iLen; i++) {
  632. // 跳过隐藏行
  633. if (!sheet.getCell(i, -1).visible()) { continue; }
  634. const rowHtml = [];
  635. rowHtml.push('<tr>');
  636. for (let j = sel.col, jLen = sel.col + sel.colCount; j < jLen; j++) {
  637. const data = sheet.getText(i, j);
  638. rowHtml.push('<td>' + data + '</td>');
  639. }
  640. rowHtml.push('</tr>');
  641. html.push(rowHtml.join(''));
  642. }
  643. html.push('</table>');
  644. return html.join('');
  645. },
  646. /**
  647. * 获取复制数据Text格式(过滤不可见单元格)
  648. * @param {GC.Spread.Sheets.Worksheet} sheet
  649. * @returns {string}
  650. */
  651. getFilterCopyText: function (sheet) {
  652. const copyData = [];
  653. const sel = sheet.getSelections()[0];
  654. for(let i = sel.row, iLen = sel.row + sel.rowCount; i < iLen; i++) {
  655. // 跳过隐藏行
  656. if (!sheet.getCell(i, -1).visible()) { continue; }
  657. const rowText = [];
  658. for (let j = sel.col, jLen = sel.col + sel.colCount; j < jLen; j++) {
  659. const data = sheet.getText(i, j);
  660. rowText.push(data);
  661. }
  662. copyData.push(rowText.join('\t'));
  663. }
  664. return copyData.join('\n');
  665. },
  666. analysisPasteText: function (text) {
  667. const result = [];
  668. if (text === '') return result;
  669. const rows = text.split('\n');
  670. for (const r of rows) {
  671. const cols = r.split('\t');
  672. result.push(cols);
  673. }
  674. return result;
  675. },
  676. analysisPasteHtml: function (html) {
  677. const result = [];
  678. if (!html || html === '') return result;
  679. },
  680. /**
  681. * 树表结构,定位至指定的节点
  682. * @param {GC.Spread.Sheets.Worksheet} sheet - 需要定位的sheet
  683. * @param {Number} id - 定位节点的id
  684. */
  685. locateTreeNode: function (sheet, id, autoExpand = false) {
  686. const tree = sheet.zh_tree;
  687. if (!tree) { return }
  688. const node = tree.getItems(id);
  689. if (!node) { return }
  690. if (autoExpand && !node.visible) {
  691. const parents = tree.autoExpandNode(node);
  692. if (parents && parents.length > 0) {
  693. SpreadJsObj.reLoadNodesData(sheet, parents);
  694. SpreadJsObj.refreshTreeRowVisible(sheet);
  695. }
  696. }
  697. const index = tree.nodes.indexOf(node);
  698. const sels = sheet.getSelections();
  699. sheet.setSelection(index, sels[0].col, 1, 1);
  700. sheet.showRow(index, spreadNS.VerticalPosition.center);
  701. },
  702. saveTopAndSelect: function (sheet, cacheKey) {
  703. const sel = sheet.getSelections()[0];
  704. const top = sheet.getViewportTopRow(1);
  705. setLocalCache(cacheKey, JSON.stringify({top: top, sel: sel}));
  706. },
  707. loadTopAndSelect: function (sheet, cacheKey) {
  708. let ts = getLocalCache(cacheKey);
  709. if (ts !== '') {
  710. ts = JSON.parse(ts);
  711. if (ts === undefined || ts === null) return;
  712. if (ts.sel) {
  713. sheet.setSelection(ts.sel.row, ts.sel.col, ts.sel.rowCount, ts.sel.colCount);
  714. }
  715. if (ts.top) {
  716. sheet.showRow(ts.top, spreadNS.VerticalPosition.top);
  717. }
  718. }
  719. },
  720. resetTopAndSelect: function (sheet) {
  721. sheet.setSelection(0, 0, 1, 1);
  722. sheet.showRow(0, spreadNS.VerticalPosition.top);
  723. },
  724. /**
  725. * 获取当前选行的数据对象
  726. * @param {GC.Spread.Sheets.Worksheet} sheet
  727. * @returns {Object}
  728. */
  729. getSelectObject: function (sheet) {
  730. if (!sheet) {
  731. return null;
  732. } else if (sheet.zh_dataType) {
  733. const sel = sheet.getSelections()[0];
  734. if (!sel) {
  735. return null;
  736. }
  737. if (sheet.zh_dataType === this.DataType.Tree) {
  738. return sheet.zh_tree.nodes[sel.row];
  739. } else if (sheet.zh_dataType === this.DataType.Data) {
  740. return sheet.zh_data[sel.row];
  741. } else {
  742. return null;
  743. }
  744. }
  745. },
  746. /**
  747. * 刷新列显示
  748. * @param sheet
  749. */
  750. refreshColumnVisible: function (sheet) {
  751. if(sheet.zh_setting) {
  752. sheet.zh_setting.cols.forEach(function (col, index) {
  753. if (col.visible !== undefined && col.visible !== null) {
  754. sheet.setColumnVisible(index, col.visible);
  755. }
  756. });
  757. }
  758. },
  759. /**
  760. * 刷新行显示
  761. * @param sheet
  762. */
  763. refreshTreeRowVisible: function (sheet) {
  764. this.beginMassOperation(sheet);
  765. const sortData = sheet.zh_dataType === this.DataType.Data ? sheet.zh_data : sheet.zh_tree.nodes;
  766. for (const iRow in sortData) {
  767. const node = sortData[iRow];
  768. if (node.visible !== undefined && node.visible !== null) {
  769. sheet.setRowVisible(iRow, node.visible);
  770. } else {
  771. sheet.setRowVisible(iRow, true);
  772. }
  773. }
  774. // if (sheet.zh_tree) {
  775. // for (const iRow in sheet.zh_tree.nodes) {
  776. // const node = sheet.zh_tree.nodes[iRow];
  777. // if (node.visible !== undefined && node.visible !== null) {
  778. // sheet.setRowVisible(iRow, node.visible);
  779. // } else {
  780. // sheet.setRowVisible(iRow, true);
  781. // }
  782. // }
  783. // }
  784. this.endMassOperation(sheet);
  785. },
  786. refreshColumnAlign: function (sheet) {
  787. if (sheet.zh_setting) {
  788. for (const iCol in sheet.zh_setting.cols) {
  789. const col = sheet.zh_setting.cols[iCol];
  790. sheet.getRange(-1, iCol, -1, 1).hAlign(col.hAlign);
  791. }
  792. }
  793. },
  794. /**
  795. * 刷新列是否只读
  796. * @param sheet
  797. * @param field
  798. * @param readonly
  799. */
  800. resetFieldReadOnly: function (sheet, field, readonly) {
  801. const fields = field instanceof Array ? field : [field];
  802. if (sheet.zh_setting) {
  803. sheet.zh_setting.cols.forEach(function (col, i) {
  804. if (fields.indexOf(col.field) !== -1) {
  805. col.readOnly = readonly;
  806. for (let iRow = 0; iRow < sheet.getRowCount(); iRow++) {
  807. sheet.getCell(iRow, i).locked(col.readOnly || sheet.zh_setting.readOnly || false);
  808. }
  809. //sheet.getRange(-1, i, -1, 1, GC.Spread.Sheets.SheetArea.viewport).locked(col.readOnly || sheet.zh_setting.readOnly || false);
  810. }
  811. });
  812. }
  813. },
  814. CellType: {
  815. /**
  816. * 获取树结构CellType
  817. * 通过SpreadJsObj.loadSheetData(sheet, 'tree', tree)加载树结构数据
  818. * 要求tree类型为PathTree, 节点必须含有{id, pid, level, order, is_leaf}数据
  819. * @returns {TreeNodeCellType}
  820. */
  821. getTreeNodeCellType: function () {
  822. const xOffset = 2 + 5;
  823. const indent = 20;
  824. const levelIndent = -5;
  825. const halfBoxLength = 5;
  826. const halfExpandLength = 3;
  827. /**
  828. * 画一条点线段
  829. * @param canvas - 画布
  830. * @param x1 - 线段起点 x
  831. * @param y1 - 线段起点 y
  832. * @param x2 - 线段终点 x
  833. * @param y2 - 线段终点 y
  834. * @param color - 线段颜色
  835. */
  836. const drawDotLine = function (canvas, x1, y1, x2, y2, color) {
  837. canvas.save();
  838. // 设置偏移量
  839. canvas.translate(0.5, 0.5);
  840. canvas.beginPath();
  841. canvas.strokeStyle = color;
  842. canvas.dottedLine(x1, y1, x2, y2);
  843. canvas.stroke();
  844. canvas.restore();
  845. };
  846. /**
  847. * 画一条线段
  848. * @param canvas - 画布
  849. * @param x1 - 线段起点 x
  850. * @param y1 - 线段起点 y
  851. * @param x2 - 线段终点 x
  852. * @param y2 - 线段终点 y
  853. * @param color - 线段颜色
  854. */
  855. const drawLine = function (canvas, x1, y1, x2, y2, color) {
  856. canvas.save();
  857. // 设置偏移量
  858. canvas.translate(0.5, 0.5);
  859. canvas.beginPath();
  860. canvas.moveTo(x1, y1);
  861. canvas.lineTo(x2, y2);
  862. canvas.strokeStyle = color;
  863. canvas.stroke();
  864. canvas.restore();
  865. };
  866. /**
  867. * 画一个方框
  868. * @param {Object} canvas - 画布
  869. * @param {Object} rect - 方框区域
  870. * @param {String} lineColor - 画线颜色
  871. * @param {String} fillColor - 填充颜色
  872. */
  873. const drawBox = function (canvas, rect, lineColor, fillColor) {
  874. canvas.save();
  875. // 设置偏移量
  876. canvas.translate(0.5, 0.5);
  877. canvas.strokeStyle = lineColor;
  878. canvas.beginPath();
  879. canvas.moveTo(rect.left, rect.top);
  880. canvas.lineTo(rect.left, rect.bottom);
  881. canvas.lineTo(rect.right, rect.bottom);
  882. canvas.lineTo(rect.right, rect.top);
  883. canvas.lineTo(rect.left, rect.top);
  884. canvas.stroke();
  885. canvas.fillStyle = fillColor;
  886. canvas.fill();
  887. canvas.restore();
  888. };
  889. /**
  890. * 画树结构-展开收起按钮
  891. * @param {Object} canvas - 画布
  892. * @param {Number} x - 单元格左顶点坐标 x
  893. * @param {Number} y - 单元格左顶点坐标 y
  894. * @param {Number} w - 单元格宽度
  895. * @param {Number} h - 单元格高度
  896. * @param {Number} centerX - 按钮中央坐标
  897. * @param {Number} centerY - 按钮中央坐标
  898. * @param {Boolean} expanded - 当前节点展开收起状态
  899. */
  900. const drawExpandBox = function (canvas, x, y, w, h, centerX, centerY, expanded) {
  901. let rect = {
  902. top: centerY - halfBoxLength,
  903. bottom: centerY + halfBoxLength,
  904. left: centerX - halfBoxLength,
  905. right: centerX + halfBoxLength
  906. };
  907. let h1, h2, offset = 1;
  908. if (rect.left < x + w) {
  909. // 方框超出单元格宽度时,超出部分不画。
  910. rect.right = Math.min(rect.right, x + w);
  911. drawBox(canvas, rect, '#808080', 'white');
  912. // 画中心十字
  913. // 画十字横线
  914. h1 = centerX - halfExpandLength;
  915. h2 = Math.min(centerX + halfExpandLength, x + w);
  916. if (h2 > h1) {
  917. drawLine(canvas, h1, centerY, h2, centerY, '#808080');
  918. }
  919. // 画十字竖线
  920. if (!expanded && (centerX < x + w)) {
  921. drawLine(canvas, centerX, centerY - halfExpandLength, centerX, centerY + halfExpandLength, '#808080');
  922. }
  923. }
  924. };
  925. let TreeNodeCellType = function (){};
  926. TreeNodeCellType.prototype = new spreadNS.CellTypes.Text();
  927. const proto = TreeNodeCellType.prototype;
  928. /**
  929. * 绘制方法
  930. * @param {Object} canvas - 画布
  931. * @param value - cell.value
  932. * @param {Number} x - 单元格左顶点坐标 x
  933. * @param {Number} y - 单元格左顶点坐标 y
  934. * @param {Number} w - 单元格宽度
  935. * @param {Number} h - 单元格高度
  936. * @param {Object} style - cell.style
  937. * @param {Object} options
  938. */
  939. proto.paint = function (canvas, value, x, y, w, h, style, options) {
  940. // 清理 画布--单元格范围 旧数据
  941. if (style.backColor) {
  942. canvas.save();
  943. canvas.fillStyle = style.backColor;
  944. canvas.fillRect(x, y, w, h);
  945. canvas.restore();
  946. } else {
  947. canvas.clearRect(x, y, w, h);
  948. }
  949. const tree = options.sheet.zh_tree;
  950. // 使用TreeCellType前,需定义sheet.tree
  951. if (tree) {
  952. const node = options.row < tree.nodes.length ? tree.nodes[options.row] : null;
  953. if (node) {
  954. const showTreeLine = true;
  955. const centerX = Math.floor(x) + (node.level - 1) * indent + (node.level) * levelIndent + indent / 2 + xOffset;
  956. const centerY = Math.floor((y + (y + h)) / 2);
  957. // Draw Sibling Line
  958. if (showTreeLine) {
  959. // Draw Horizontal Line
  960. if (centerX < x + w) {
  961. const x1 = centerX + indent / 2;
  962. //drawLine(canvas, centerX, centerY, Math.min(x1, x + w), centerY, 'gray');
  963. drawDotLine(canvas, centerX, centerY, Math.min(x1, x + w), centerY, '#b8b8b8');
  964. }
  965. // Draw Vertical Line
  966. if (centerX < x + w) {
  967. const y1 = tree.isLastSibling(node) ? centerY : y + h;
  968. const parent = tree.getParent(node);
  969. const y2 = y1 - centerY;
  970. if (node.order === 1 && !parent) {
  971. //drawLine(canvas, centerX, centerY, centerX, y1, 'gray');
  972. drawDotLine(canvas, centerX, centerY, centerX, y1, '#b8b8b8');
  973. } else {
  974. //drawLine(canvas, centerX, y, centerX, y1, 'gray');
  975. drawDotLine(canvas, centerX, y, centerX, y1, '#b8b8b8');
  976. }
  977. }
  978. }
  979. // Draw Expand Box
  980. if (!node.is_leaf) {
  981. drawExpandBox(canvas, x, y, w, h, centerX, centerY, node.expanded);
  982. }
  983. // Draw Parent Line
  984. if (showTreeLine) {
  985. let parent = tree.getParent(node), parentCenterX = centerX - indent - levelIndent;
  986. while (parent) {
  987. if (!tree.isLastSibling(parent)) {
  988. if (parentCenterX < x + w) {
  989. //drawLine(canvas, parentCenterX, y, parentCenterX, y + h, 'gray');
  990. drawDotLine(canvas, parentCenterX, y, parentCenterX, y + h, '#b8b8b8');
  991. }
  992. }
  993. parent = tree.getParent(parent);
  994. parentCenterX -= (indent + levelIndent);
  995. }
  996. };
  997. // 重定位x
  998. const move = (node.level) * indent + (node.level) * levelIndent + xOffset;
  999. x = x + move;
  1000. w = w - move;
  1001. }
  1002. }
  1003. // Drawing Text
  1004. spreadNS.CellTypes.Text.prototype.paint.apply(this, [canvas, value, x, y, w, h, style, options]);
  1005. };
  1006. /**
  1007. * 获取点击信息
  1008. * @param {Number} x
  1009. * @param {Number} y
  1010. * @param {Object} cellStyle
  1011. * @param {Object} cellRect
  1012. * @param {Object} context
  1013. * @returns {{x: *, y: *, row: *, col: *|boolean|*[]|number|{}|UE.dom.dtd.col, cellStyle: *, cellRect: *, sheet: *|StyleSheet, sheetArea: *}}
  1014. */
  1015. proto.getHitInfo = function (x, y, cellStyle, cellRect, context) {
  1016. return {
  1017. x: x,
  1018. y: y,
  1019. row: context.row,
  1020. col: context.col,
  1021. cellStyle: cellStyle,
  1022. cellRect: cellRect,
  1023. sheet: context.sheet,
  1024. sheetArea: context.sheetArea
  1025. };
  1026. };
  1027. /**
  1028. * 鼠标点击 树结构按钮 响应展开收起(未加载子节点时,先加载子节点)
  1029. * @param {Object} hitinfo - 见getHitInfo
  1030. */
  1031. proto.processMouseDown = function (hitinfo) {
  1032. const offset = -1;
  1033. const tree = hitinfo.sheet.zh_tree;
  1034. if (!tree) { return; }
  1035. const node = tree.nodes[hitinfo.row];
  1036. if (!node) { return; }
  1037. let centerX = hitinfo.cellRect.x + offset + (node.level - 1) * indent + (node.level) * levelIndent + indent / 2 + xOffset;
  1038. let centerY = (hitinfo.cellRect.y + offset + (hitinfo.cellRect.y + offset + hitinfo.cellRect.height)) / 2;
  1039. // 点击展开节点时,如果已加载子项,则展开,反之这加载子项,展开
  1040. if (Math.abs(hitinfo.x - centerX) < halfBoxLength && Math.abs(hitinfo.y - centerY) < halfBoxLength) {
  1041. const children = tree.getChildren(node);
  1042. if (!node.expanded && !node.is_leaf && children.length === 0 && tree.loadChildren) {
  1043. tree.loadChildren(node, function () {
  1044. node.expanded = true;
  1045. const children = tree.getChildren(node);
  1046. hitinfo.sheet.addRows(hitinfo.row + 1, children.length);
  1047. SpreadJsObj.reLoadRowData(hitinfo.sheet, hitinfo.row + 1, children.length);
  1048. });
  1049. } else {
  1050. tree.setExpanded(node, !node.expanded);
  1051. SpreadJsObj.massOperationSheet(hitinfo.sheet, function () {
  1052. const posterity = tree.getPosterity(node);
  1053. for (const child of posterity) {
  1054. hitinfo.sheet.setRowVisible(tree.nodes.indexOf(child), child.visible, hitinfo.sheetArea);
  1055. }
  1056. });
  1057. hitinfo.sheet.repaint();
  1058. }
  1059. }
  1060. };
  1061. return new TreeNodeCellType();
  1062. },
  1063. /**
  1064. * 获取 带悬浮提示的CellType
  1065. * @returns {TipCellType}
  1066. */
  1067. getTipCellType: function () {
  1068. const maxHintWidth = 200, indent = 15, borderIndent = 10;
  1069. const TipCellType = function () {};
  1070. // 继承 SpreadJs定义的 普通的TextCellType
  1071. TipCellType.prototype = new spreadNS.CellTypes.Text();
  1072. const proto = TipCellType.prototype;
  1073. proto.getTextDisplayWidth = function(hitinfo, str, font) {
  1074. const xs = hitinfo.sheet.getParent().xs;
  1075. const ctx = xs.childNodes[0].getContext("2d");
  1076. if (font && font !== '') {
  1077. ctx.font = font;
  1078. } else {
  1079. ctx.font = hitinfo.cellStyle.font;
  1080. }
  1081. return ctx.measureText(str).width;
  1082. };
  1083. proto.showTip = function (hitinfo, text) {
  1084. return text && text !== '';
  1085. };
  1086. /**
  1087. * 获取点击信息
  1088. * @param {Number} x
  1089. * @param {Number} y
  1090. * @param {Object} cellStyle
  1091. * @param {Object} cellRect
  1092. * @param {Object} context
  1093. * @returns {{x: *, y: *, row: *, col: *|boolean|*[]|number|{}|UE.dom.dtd.col, cellStyle: *, cellRect: *, sheet: *|StyleSheet, sheetArea: *}}
  1094. */
  1095. proto.getHitInfo = function (x, y, cellStyle, cellRect, context) {
  1096. return {
  1097. x: x,
  1098. y: y,
  1099. row: context.row,
  1100. col: context.col,
  1101. cellStyle: cellStyle,
  1102. cellRect: cellRect,
  1103. sheet: context.sheet,
  1104. sheetArea: context.sheetArea,
  1105. ctx: context.sheet.getParent().xs,
  1106. };
  1107. };
  1108. /**
  1109. * 鼠标进入单元格事件 - 显示悬浮提示
  1110. * @param {Object} hitinfo - 见getHitInfo返回值
  1111. */
  1112. proto.processMouseEnter = function (hitinfo) {
  1113. let text = hitinfo.sheet.getText(hitinfo.row, hitinfo.col);
  1114. const col = hitinfo.sheet.zh_setting.cols[hitinfo.col];
  1115. if (col.getTip && Object.prototype.toString.apply(col.getTip) === "[object Function]") {
  1116. const sortData = SpreadJsObj.getSortData(hitinfo.sheet);
  1117. text = col.getTip(sortData[hitinfo.row]);
  1118. }
  1119. const pos = SpreadJsObj.getObjPos(hitinfo.sheet.getParent().qo);
  1120. if (pos && this.showTip(hitinfo, text)) {
  1121. if (!this._toolTipElement) {
  1122. let div = $('#autoTip')[0];
  1123. if (!div) {
  1124. div = document.createElement("div");
  1125. $(div).css("position", "absolute")
  1126. .css("border", "1px #C0C0C0 solid")
  1127. .css("box-shadow", "1px 2px 5px rgba(0,0,0,0.4)")
  1128. .css("font", "9pt Arial")
  1129. .css("background", "white")
  1130. .css("padding", 5)
  1131. .css("z-index", 999)
  1132. .css("max-width", maxHintWidth)
  1133. .css("word-wrap", "break-word")
  1134. .attr("id", 'autoTip');
  1135. document.body.insertBefore(div, null);
  1136. }
  1137. const validWidth = $(window).width() - (pos.x + hitinfo.x + indent) - borderIndent;
  1138. const textWidth = this.getTextDisplayWidth(hitinfo, text, "9pt Arial");
  1139. if (validWidth >= maxHintWidth || textWidth <= validWidth) {
  1140. $(div).text(text).css("top", pos.y + hitinfo.y + indent).css("left", pos.x + hitinfo.x + indent);
  1141. } else if (textWidth > maxHintWidth) {
  1142. $(div).text(text).css("top", pos.y + hitinfo.y + indent).css("left", pos.x + hitinfo.x - indent - maxHintWidth);
  1143. } else {
  1144. $(div).text(text).css("top", pos.y + hitinfo.y + indent).css("left", pos.x + hitinfo.x - indent - textWidth);
  1145. }
  1146. this._toolTipElement = div;
  1147. $(div).show("fast");
  1148. }
  1149. }
  1150. };
  1151. /**
  1152. * 鼠标移出单元格事件 - 隐藏悬浮提示
  1153. * @param {Object} hitinfo - 见getHitInfo返回值
  1154. */
  1155. proto.processMouseLeave = function (hitinfo) {
  1156. if (this._toolTipElement) {
  1157. $(this._toolTipElement).hide();
  1158. this._toolTipElement = null;
  1159. }
  1160. };
  1161. return new TipCellType();
  1162. },
  1163. getAutoTipCellType: function () {
  1164. const AutoTipCellType = function () {};
  1165. // 继承 TipCellType
  1166. AutoTipCellType.prototype = SpreadJsObj.CellType.getTipCellType();
  1167. const proto = AutoTipCellType.prototype
  1168. proto.showTip = function (hitinfo, text) {
  1169. return text && text !== '' && this.getTextDisplayWidth(hitinfo, text) > hitinfo.cellRect.widthidth;
  1170. };
  1171. return new AutoTipCellType();
  1172. },
  1173. /**
  1174. * 获取 带图片的cellType(图片需在document中定义好img,并写入col的img属性)
  1175. *
  1176. * img:
  1177. * 1. 整列固定,则传入img的select
  1178. * e.g. {title: '附件', field: 'attachment', cellType: 'image', img = '#attachment-img'}
  1179. *
  1180. * 2. 各单元格自定义,则
  1181. * e.g. {title: '附件', field: 'attachment', cellType: 'image', img = getAttachmentImage}
  1182. * function getAttachmentImage (data) {
  1183. * $('#attachment-img').url = data.attachmentImageUrl;
  1184. * return $('#attachment-img')[0];
  1185. * }
  1186. *
  1187. * @returns {ImageCellType}
  1188. */
  1189. getImageCellType: function () {
  1190. const ImageCellType = function (){};
  1191. ImageCellType.prototype = new spreadNS.CellTypes.Text();
  1192. const proto = ImageCellType.prototype;
  1193. proto.getImage = function (sheet, iRow, iCol) {
  1194. const col = sheet.zh_setting.cols[iCol];
  1195. let imgSource = col.img;
  1196. if (imgSource && Object.prototype.toString.apply(imgSource) === "[object Function]") {
  1197. const sortData = SpreadJsObj.getSortData(sheet);
  1198. const data = sortData ? sortData[iRow] : null;
  1199. return data ? imgSource(data) : null;
  1200. } else {
  1201. return $(imgSource)[0] ? $(imgSource)[0] : null;
  1202. }
  1203. };
  1204. proto.paint = function (canvas, value, x, y, w, h, style, options) {
  1205. const col = options.sheet.zh_setting.cols[options.col];
  1206. const img = this.getImage(options.sheet, options.row, options.col);
  1207. const indent = col.indent ? col.indent : 10;
  1208. if (img) {
  1209. if (style.backColor) {
  1210. canvas.save();
  1211. canvas.fillStyle = style.backColor;
  1212. canvas.fillRect(x, y, indent + img.width, h);
  1213. canvas.restore();
  1214. }
  1215. canvas.drawImage(img, x + indent, y + (h - img.height) / 2);
  1216. if (style.hAlign !== spreadNS.HorizontalAlign.left) {
  1217. style.hAlign = spreadNS.HorizontalAlign.left;
  1218. }
  1219. x = x + indent + img.width;
  1220. w = w - indent - img.width;
  1221. }
  1222. // Drawing Text
  1223. spreadNS.CellTypes.Text.prototype.paint.apply(this, [canvas, value, x, y, w, h, style, options]);
  1224. };
  1225. /**
  1226. * 获取点击信息
  1227. * @param {Number} x
  1228. * @param {Number} y
  1229. * @param {Object} cellStyle
  1230. * @param {Object} cellRect
  1231. * @param {Object} context
  1232. * @returns {{x: *, y: *, row: *, col: *|boolean|*[]|number|{}|UE.dom.dtd.col, cellStyle: *, cellRect: *, sheet: *|StyleSheet, sheetArea: *}}
  1233. */
  1234. proto.getHitInfo = function (x, y, cellStyle, cellRect, context) {
  1235. return {
  1236. x: x,
  1237. y: y,
  1238. row: context.row,
  1239. col: context.col,
  1240. cellStyle: cellStyle,
  1241. cellRect: cellRect,
  1242. sheet: context.sheet,
  1243. sheetArea: context.sheetArea
  1244. };
  1245. };
  1246. /**
  1247. * 鼠标点击
  1248. * @param {Object} hitinfo - 见getHitInfo
  1249. */
  1250. proto.processMouseDown = function (hitinfo) {
  1251. const img = this.getImage(hitinfo.sheet, hitinfo.row, hitinfo.col);
  1252. if (img) {
  1253. const halfX = img.width / 2, halfY = img.height / 2;
  1254. const centerX = hitinfo.cellRect.x + indent + halfX;
  1255. const centerY = hitinfo.cellRect.y + hitinfo.cellRect.height / 2;
  1256. // 点击展开节点时,如果已加载子项,则展开,反之这加载子项,展开
  1257. if (Math.abs(hitinfo.x - centerX) < halfX && Math.abs(hitinfo.y - centerY) < halfY) {
  1258. const imageClick = hitinfo.sheet.zh_setting ? hitinfo.sheet.zh_setting.imageClick : null;
  1259. if (imageClick && Object.prototype.toString.apply(imageClick) === "[object Function]") {
  1260. const sortData = SpreadJsObj.getSortData(hitinfo.sheet);
  1261. const data = sortData ? sortData[hitinfo.row] : null;
  1262. imageClick(data);
  1263. }
  1264. }
  1265. }
  1266. };
  1267. return new ImageCellType();
  1268. },
  1269. /**
  1270. *
  1271. * 获取 带normal-hover-active按钮的cellType(需定义三张图片,须在document中定义好img,并写入col的normalImg, hoverImg, activeImg属性)
  1272. * 其中:normalImg必需,向下套用(不存在activeImg则使用hoverImg,不存在hoverImg则使用normalImg)
  1273. * 三个img均可像getImageCellType一样动态获取,参见getImageCellType注释
  1274. *
  1275. * @returns {ImageCellType}
  1276. */
  1277. getImageButtonCellType: function () {
  1278. let hover = 1, active = 2;
  1279. const ImageCellType = function (){};
  1280. ImageCellType.prototype = new spreadNS.CellTypes.Text();
  1281. const proto = ImageCellType.prototype;
  1282. proto.getImage = function (sheet, iRow, iCol) {
  1283. const col = sheet.zh_setting.cols[iCol];
  1284. let imgSource = col.normalImg;
  1285. const cell = sheet.getCell(iRow, iCol), tag = cell.tag();
  1286. if (tag === active) {
  1287. imgSource = col.activeImg ? col.activeImg : (col.hoverImg ? col.hoverImg : col.normalImg);
  1288. } else if (tag === hover) {
  1289. imgSource = col.hoverImg ? col.hoverImg : col.normalImg;
  1290. }
  1291. if (imgSource && Object.prototype.toString.apply(imgSource) === "[object Function]") {
  1292. const sortData = SpreadJsObj.getSortData(sheet);
  1293. const data = sortData ? sortData[iRow] : null;
  1294. return data ? imgSource(data) : null;
  1295. } else {
  1296. return $(imgSource)[0] ? $(imgSource)[0] : null;
  1297. }
  1298. };
  1299. proto.paint = function (canvas, value, x, y, w, h, style, options) {
  1300. const col = options.sheet.zh_setting.cols[options.col];
  1301. const sortData = SpreadJsObj.getSortData(options.sheet);
  1302. const data = sortData ? sortData[options.row] : null;
  1303. let showImage = true;
  1304. if (col.showImage && Object.prototype.toString.apply(col.showImage) === "[object Function]") {
  1305. showImage = col.showImage(data);
  1306. }
  1307. const img = showImage ? this.getImage(options.sheet, options.row, options.col) : null;
  1308. const indent = col.indent ? col.indent : 10;
  1309. if (style.hAlign === spreadNS.HorizontalAlign.right) {
  1310. if (img) {
  1311. if (style.backColor) {
  1312. canvas.save();
  1313. canvas.fillStyle = style.backColor;
  1314. canvas.fillRect(x + w - indent - img.width, y, img.width, h);
  1315. canvas.restore();
  1316. }
  1317. canvas.drawImage(img, x + w - indent - img.width, y + (h - img.height) / 2);
  1318. w = w - indent - img.width;
  1319. }
  1320. // Drawing Text
  1321. spreadNS.CellTypes.Text.prototype.paint.apply(this, [canvas, value, x, y, w, h, style, options]);
  1322. } else {
  1323. if (img) {
  1324. if (style.backColor) {
  1325. canvas.save();
  1326. canvas.fillStyle = style.backColor;
  1327. canvas.fillRect(x, y, indent + img.width, h);
  1328. canvas.restore();
  1329. }
  1330. canvas.drawImage(img, x + 10, y + (h - img.height) / 2);
  1331. if (style.hAlign !== spreadNS.HorizontalAlign.left) {
  1332. style.hAlign = spreadNS.HorizontalAlign.left;
  1333. }
  1334. x = x + indent + img.width;
  1335. w = w - indent - img.width;
  1336. }
  1337. // Drawing Text
  1338. spreadNS.CellTypes.Text.prototype.paint.apply(this, [canvas, value, x, y, w, h, style, options]);
  1339. }
  1340. };
  1341. /**
  1342. * 获取点击信息
  1343. * @param {Number} x
  1344. * @param {Number} y
  1345. * @param {Object} cellStyle
  1346. * @param {Object} cellRect
  1347. * @param {Object} context
  1348. * @returns {{x: *, y: *, row: *, col: *|boolean|*[]|number|{}|UE.dom.dtd.col, cellStyle: *, cellRect: *, sheet: *|StyleSheet, sheetArea: *}}
  1349. */
  1350. proto.getHitInfo = function (x, y, cellStyle, cellRect, context) {
  1351. return {
  1352. x: x,
  1353. y: y,
  1354. row: context.row,
  1355. col: context.col,
  1356. cellStyle: cellStyle,
  1357. cellRect: cellRect,
  1358. sheet: context.sheet,
  1359. sheetArea: context.sheetArea
  1360. };
  1361. };
  1362. proto.processMouseEnter = function (hitinfo) {
  1363. const col = hitinfo.sheet.zh_setting.cols[hitinfo.col];
  1364. // Drawing Image
  1365. if (col.hoverImg) {
  1366. const cell = hitinfo.sheet.getCell(hitinfo.row, hitinfo.col);
  1367. cell.tag(hover);
  1368. hitinfo.sheet.repaint(hitinfo.cellRect);
  1369. }
  1370. };
  1371. proto.processMouseLeave = function (hitinfo) {
  1372. const col = hitinfo.sheet.zh_setting.cols[hitinfo.col];
  1373. // Drawing Image
  1374. const cell = hitinfo.sheet.getCell(hitinfo.row, hitinfo.col);
  1375. cell.tag(null);
  1376. hitinfo.sheet.repaint(hitinfo.cellRect);
  1377. };
  1378. // proto.processMouseDown = function (hitinfo) {
  1379. // const col = hitinfo.sheet.zh_setting.cols[hitinfo.col];
  1380. // if (col.activeImg) {
  1381. // const cell = hitinfo.sheet.getCell(hitinfo.row, hitinfo.col);
  1382. // cell.tag(active);
  1383. // hitinfo.sheet.repaint(hitinfo.cellRect);
  1384. // }
  1385. // };
  1386. // proto.processMouseUp = function (hitinfo) {
  1387. // const col = hitinfo.sheet.zh_setting.cols[hitinfo.col];
  1388. // const sortData = SpreadJsObj.getSortData(hitinfo.sheet);
  1389. // const data = sortData ? sortData[hitinfo.row] : null;
  1390. // if (col.showImage && Object.prototype.toString.apply(col.showImage) === "[object Function]") {
  1391. // if (!col.showImage(data)) {
  1392. // return;
  1393. // }
  1394. // }
  1395. // const imageClick = hitinfo.sheet.zh_setting ? hitinfo.sheet.zh_setting.imageClick : null;
  1396. // if (imageClick && Object.prototype.toString.apply(imageClick) === "[object Function]") {
  1397. // imageClick(data);
  1398. // const cell = hitinfo.sheet.getCell(hitinfo.row, hitinfo.col);
  1399. // cell.tag(null);
  1400. // hitinfo.sheet.repaint(hitinfo.cellRect);
  1401. // }
  1402. // };
  1403. /*
  1404. 注释部分以进入鼠标进入图片,点击图片为基准更新图片,鼠标快速移动时,可能失效
  1405. */
  1406. proto.processMouseDown = function (hitinfo) {
  1407. const col = hitinfo.sheet.zh_setting.cols[hitinfo.col];
  1408. const img = this.getImage(hitinfo.sheet, hitinfo.row, hitinfo.col);
  1409. const halfX = img.width / 2, halfY = img.height / 2;
  1410. const indent = col.indent ? col.indent : 10;
  1411. const centerX = hitinfo.cellStyle.hAlign === spreadNS.HorizontalAlign.right
  1412. ? hitinfo.cellRect.x + hitinfo.cellRect.width - indent -halfX
  1413. : hitinfo.cellRect.x + indent + halfX;
  1414. const centerY = hitinfo.cellRect.y + hitinfo.cellRect.height / 2;
  1415. if (Math.abs(hitinfo.x - centerX) < halfX && Math.abs(hitinfo.y - centerY) < halfY) {
  1416. const cell = hitinfo.sheet.getCell(hitinfo.row, hitinfo.col);
  1417. cell.tag(active);
  1418. hitinfo.sheet.repaint(hitinfo.cellRect);
  1419. }
  1420. };
  1421. proto.processMouseUp = function (hitinfo) {
  1422. const col = hitinfo.sheet.zh_setting.cols[hitinfo.col];
  1423. const img = this.getImage(hitinfo.sheet, hitinfo.row, hitinfo.col);
  1424. const halfX = img.width / 2, halfY = img.height / 2;
  1425. const indent = col.indent ? col.indent : 10;
  1426. const centerX = hitinfo.cellStyle.hAlign === spreadNS.HorizontalAlign.right
  1427. ? hitinfo.cellRect.x + hitinfo.cellRect.width - indent -halfX
  1428. : hitinfo.cellRect.x + indent + halfX;
  1429. const centerY = hitinfo.cellRect.y + hitinfo.cellRect.height / 2;
  1430. if (Math.abs(hitinfo.x - centerX) < halfX && Math.abs(hitinfo.y - centerY) < halfY) {
  1431. const imageClick = hitinfo.sheet.zh_setting ? hitinfo.sheet.zh_setting.imageClick : null;
  1432. if (imageClick && Object.prototype.toString.apply(imageClick) === "[object Function]") {
  1433. const sortData = SpreadJsObj.getSortData(hitinfo.sheet);
  1434. const data = sortData ? sortData[hitinfo.row] : null;
  1435. imageClick(data);
  1436. const cell = hitinfo.sheet.getCell(hitinfo.row, hitinfo.col);
  1437. cell.tag(null);
  1438. hitinfo.sheet.repaint(hitinfo.cellRect);
  1439. }
  1440. }
  1441. };
  1442. proto.processMouseMove = function (hitinfo) {
  1443. const col = hitinfo.sheet.zh_setting.cols[hitinfo.col];
  1444. const img = this.getImage(hitinfo.sheet, hitinfo.row, hitinfo.col);
  1445. const halfX = img.width / 2, halfY = img.height / 2;
  1446. const indent = col.indent ? col.indent : 10;
  1447. const centerX = hitinfo.cellStyle.hAlign === spreadNS.HorizontalAlign.right
  1448. ? hitinfo.cellRect.x + hitinfo.cellRect.width - indent -halfX
  1449. : hitinfo.cellRect.x + indent + halfX;
  1450. const centerY = hitinfo.cellRect.y + hitinfo.cellRect.height / 2;
  1451. const cell = hitinfo.sheet.getCell(hitinfo.row, hitinfo.col);
  1452. if (Math.abs(hitinfo.x - centerX) < halfX && Math.abs(hitinfo.y - centerY) < halfY) {
  1453. if (cell.tag() !== hover) {
  1454. cell.tag(hover);
  1455. hitinfo.sheet.repaint(hitinfo.cellRect);
  1456. }
  1457. } else {
  1458. if (cell.tag() === hover) {
  1459. cell.tag(null);
  1460. hitinfo.sheet.repaint(hitinfo.cellRect);
  1461. }
  1462. }
  1463. };
  1464. return new ImageCellType();
  1465. },
  1466. getActiveImageButtonCellType: function () {
  1467. let show = 1, hover = 2, active = 2;
  1468. const ImageCellType = function (){};
  1469. ImageCellType.prototype = new spreadNS.CellTypes.Text();
  1470. const proto = ImageCellType.prototype;
  1471. proto.getImage = function (sheet, iRow, iCol) {
  1472. const col = sheet.zh_setting.cols[iCol];
  1473. let imgSource = null;
  1474. const cell = sheet.getCell(iRow, iCol), tag = cell.tag();
  1475. if (tag === show) {
  1476. imgSource = col.normalImg;
  1477. } else if (tag === active) {
  1478. imgSource = col.activeImg ? col.activeImg : (col.hoverImg ? col.hoverImg : col.normalImg);
  1479. } else if (tag === hover) {
  1480. imgSource = col.hoverImg ? col.hoverImg : col.normalImg;
  1481. }
  1482. if (imgSource && Object.prototype.toString.apply(imgSource) === "[object Function]") {
  1483. const sortData = SpreadJsObj.getSortData(sheet);
  1484. const data = sortData ? sortData[iRow] : null;
  1485. return data ? imgSource(data) : null;
  1486. } else {
  1487. return $(imgSource)[0] ? $(imgSource)[0] : null;
  1488. }
  1489. };
  1490. proto.paint = function (canvas, value, x, y, w, h, style, options) {
  1491. const col = options.sheet.zh_setting.cols[options.col];
  1492. const sortData = SpreadJsObj.getSortData(options.sheet);
  1493. const data = sortData ? sortData[options.row] : null;
  1494. let showImage = true;
  1495. if (col.showImage && Object.prototype.toString.apply(col.showImage) === "[object Function]") {
  1496. showImage = col.showImage(data);
  1497. }
  1498. const img = showImage ? this.getImage(options.sheet, options.row, options.col) : null;
  1499. const indent = col.indent ? col.indent : 10;
  1500. if (style.hAlign === spreadNS.HorizontalAlign.right) {
  1501. if (img) {
  1502. if (style.backColor) {
  1503. canvas.save();
  1504. canvas.fillStyle = style.backColor;
  1505. canvas.fillRect(x + w - indent - img.width, y, img.width, h);
  1506. canvas.restore();
  1507. }
  1508. canvas.drawImage(img, x + w - indent - img.width, y + (h - img.height) / 2);
  1509. w = w - indent - img.width;
  1510. }
  1511. // Drawing Text
  1512. spreadNS.CellTypes.Text.prototype.paint.apply(this, [canvas, value, x, y, w, h, style, options]);
  1513. } else {
  1514. if (img) {
  1515. if (style.backColor) {
  1516. canvas.save();
  1517. canvas.fillStyle = style.backColor;
  1518. canvas.fillRect(x, y, indent + img.width, h);
  1519. canvas.restore();
  1520. }
  1521. canvas.drawImage(img, x + 10, y + (h - img.height) / 2);
  1522. if (style.hAlign !== spreadNS.HorizontalAlign.left) {
  1523. style.hAlign = spreadNS.HorizontalAlign.left;
  1524. }
  1525. x = x + indent + img.width;
  1526. w = w - indent - img.width;
  1527. }
  1528. // Drawing Text
  1529. spreadNS.CellTypes.Text.prototype.paint.apply(this, [canvas, value, x, y, w, h, style, options]);
  1530. }
  1531. };
  1532. /**
  1533. * 获取点击信息
  1534. * @param {Number} x
  1535. * @param {Number} y
  1536. * @param {Object} cellStyle
  1537. * @param {Object} cellRect
  1538. * @param {Object} context
  1539. * @returns {{x: *, y: *, row: *, col: *|boolean|*[]|number|{}|UE.dom.dtd.col, cellStyle: *, cellRect: *, sheet: *|StyleSheet, sheetArea: *}}
  1540. */
  1541. proto.getHitInfo = function (x, y, cellStyle, cellRect, context) {
  1542. return {
  1543. x: x,
  1544. y: y,
  1545. row: context.row,
  1546. col: context.col,
  1547. cellStyle: cellStyle,
  1548. cellRect: cellRect,
  1549. sheet: context.sheet,
  1550. sheetArea: context.sheetArea
  1551. };
  1552. };
  1553. proto.processMouseEnter = function (hitinfo) {
  1554. const col = hitinfo.sheet.zh_setting.cols[hitinfo.col];
  1555. // Drawing Image
  1556. if (col.normalImg) {
  1557. const cell = hitinfo.sheet.getCell(hitinfo.row, hitinfo.col);
  1558. cell.tag(show);
  1559. hitinfo.sheet.repaint(hitinfo.cellRect);
  1560. }
  1561. };
  1562. proto.processMouseLeave = function (hitinfo) {
  1563. const cell = hitinfo.sheet.getCell(hitinfo.row, hitinfo.col);
  1564. cell.tag(null);
  1565. hitinfo.sheet.repaint(hitinfo.cellRect);
  1566. };
  1567. // proto.processMouseDown = function (hitinfo) {
  1568. // const col = hitinfo.sheet.zh_setting.cols[hitinfo.col];
  1569. // if (col.activeImg) {
  1570. // const cell = hitinfo.sheet.getCell(hitinfo.row, hitinfo.col);
  1571. // cell.tag(active);
  1572. // hitinfo.sheet.repaint(hitinfo.cellRect);
  1573. // }
  1574. // };
  1575. // proto.processMouseUp = function (hitinfo) {
  1576. // const col = hitinfo.sheet.zh_setting.cols[hitinfo.col];
  1577. // const sortData = SpreadJsObj.getSortData(hitinfo.sheet);
  1578. // const data = sortData ? sortData[hitinfo.row] : null;
  1579. // if (col.showImage && Object.prototype.toString.apply(col.showImage) === "[object Function]") {
  1580. // if (!col.showImage(data)) {
  1581. // return;
  1582. // }
  1583. // }
  1584. // const imageClick = hitinfo.sheet.zh_setting ? hitinfo.sheet.zh_setting.imageClick : null;
  1585. // if (imageClick && Object.prototype.toString.apply(imageClick) === "[object Function]") {
  1586. // imageClick(data);
  1587. // const cell = hitinfo.sheet.getCell(hitinfo.row, hitinfo.col);
  1588. // cell.tag(null);
  1589. // hitinfo.sheet.repaint(hitinfo.cellRect);
  1590. // }
  1591. // };
  1592. /*
  1593. 注释部分以进入鼠标进入图片,点击图片为基准更新图片,鼠标快速移动时,可能失效
  1594. */
  1595. proto.processMouseDown = function (hitinfo) {
  1596. const col = hitinfo.sheet.zh_setting.cols[hitinfo.col];
  1597. const img = this.getImage(hitinfo.sheet, hitinfo.row, hitinfo.col);
  1598. const halfX = img.width / 2, halfY = img.height / 2;
  1599. const indent = col.indent ? col.indent : 10;
  1600. const centerX = hitinfo.cellStyle.hAlign === spreadNS.HorizontalAlign.right
  1601. ? hitinfo.cellRect.x + hitinfo.cellRect.width - indent -halfX
  1602. : hitinfo.cellRect.x + indent + halfX;
  1603. const centerY = hitinfo.cellRect.y + hitinfo.cellRect.height / 2;
  1604. if (Math.abs(hitinfo.x - centerX) < halfX && Math.abs(hitinfo.y - centerY) < halfY) {
  1605. const cell = hitinfo.sheet.getCell(hitinfo.row, hitinfo.col);
  1606. cell.tag(active);
  1607. hitinfo.sheet.repaint(hitinfo.cellRect);
  1608. }
  1609. };
  1610. proto.processMouseUp = function (hitinfo) {
  1611. const col = hitinfo.sheet.zh_setting.cols[hitinfo.col];
  1612. const img = this.getImage(hitinfo.sheet, hitinfo.row, hitinfo.col);
  1613. const halfX = img.width / 2, halfY = img.height / 2;
  1614. const indent = col.indent ? col.indent : 10;
  1615. const centerX = hitinfo.cellStyle.hAlign === spreadNS.HorizontalAlign.right
  1616. ? hitinfo.cellRect.x + hitinfo.cellRect.width - indent -halfX
  1617. : hitinfo.cellRect.x + indent + halfX;
  1618. const centerY = hitinfo.cellRect.y + hitinfo.cellRect.height / 2;
  1619. if (Math.abs(hitinfo.x - centerX) < halfX && Math.abs(hitinfo.y - centerY) < halfY) {
  1620. const imageClick = hitinfo.sheet.zh_setting ? hitinfo.sheet.zh_setting.imageClick : null;
  1621. if (imageClick && Object.prototype.toString.apply(imageClick) === "[object Function]") {
  1622. const sortData = SpreadJsObj.getSortData(hitinfo.sheet);
  1623. const data = sortData ? sortData[hitinfo.row] : null;
  1624. imageClick(data);
  1625. const cell = hitinfo.sheet.getCell(hitinfo.row, hitinfo.col);
  1626. cell.tag(hover);
  1627. hitinfo.sheet.repaint(hitinfo.cellRect);
  1628. }
  1629. }
  1630. };
  1631. proto.processMouseMove = function (hitinfo) {
  1632. const col = hitinfo.sheet.zh_setting.cols[hitinfo.col];
  1633. const img = this.getImage(hitinfo.sheet, hitinfo.row, hitinfo.col);
  1634. const halfX = img.width / 2, halfY = img.height / 2;
  1635. const indent = col.indent ? col.indent : 10;
  1636. const centerX = hitinfo.cellStyle.hAlign === spreadNS.HorizontalAlign.right
  1637. ? hitinfo.cellRect.x + hitinfo.cellRect.width - indent -halfX
  1638. : hitinfo.cellRect.x + indent + halfX;
  1639. const centerY = hitinfo.cellRect.y + hitinfo.cellRect.height / 2;
  1640. const cell = hitinfo.sheet.getCell(hitinfo.row, hitinfo.col);
  1641. if (Math.abs(hitinfo.x - centerX) < halfX && Math.abs(hitinfo.y - centerY) < halfY) {
  1642. if (cell.tag() !== hover) {
  1643. cell.tag(hover);
  1644. hitinfo.sheet.repaint(hitinfo.cellRect);
  1645. }
  1646. } else {
  1647. if (cell.tag() === hover) {
  1648. cell.tag(show);
  1649. hitinfo.sheet.repaint(hitinfo.cellRect);
  1650. }
  1651. }
  1652. };
  1653. return new ImageCellType();
  1654. },
  1655. /**
  1656. * 获取 嵌入Html的cellType
  1657. * @returns {HTMLCellType}
  1658. */
  1659. getHtmlCellType: function () {
  1660. const HTMLCellType = function (){};
  1661. HTMLCellType.prototype = new spreadNS.CellTypes.Text;
  1662. const proto = ImageCellType.prototype;
  1663. proto.paint = function (ctx, value, x, y, w, h, style, context) {
  1664. let DOMURL = window.URL || window.webkitURL || window;
  1665. let cell = context.sheet.getCell(context.row, context.col);
  1666. let img = cell.tag();
  1667. if (img) {
  1668. try {
  1669. ctx.save();
  1670. ctx.rect(x, y, w, h);
  1671. ctx.clip();
  1672. ctx.drawImage(img, x + 2, y + 2)
  1673. ctx.restore();
  1674. cell.tag(null);
  1675. return;
  1676. }
  1677. catch (err) {
  1678. GC.Spread.Sheets.CustomCellType.prototype.paint.apply(this, [ctx, "#HTMLError", x, y, w, h, style, context])
  1679. cell.tag(null);
  1680. return;
  1681. }
  1682. }
  1683. let svgPattern = '<svg xmlns="http://www.w3.org/2000/svg" width="{0}" height="{1}">' +
  1684. '<foreignObject width="100%" height="100%"><div xmlns="http://www.w3.org/1999/xhtml" style="font:{2}">{3}</div></foreignObject></svg>';
  1685. let data = svgPattern.replace("{0}", w).replace("{1}", h).replace("{2}", style.font).replace("{3}", value);
  1686. let doc = document.implementation.createHTMLDocument("");
  1687. doc.write(data);
  1688. // Get well-formed markup
  1689. data = (new XMLSerializer()).serializeToString(doc.body.children[0]);
  1690. img = new Image();
  1691. //var svg = new Blob([data], {type: 'image/svg+xml;charset=utf-8'});
  1692. //var url = DOMURL.createObjectURL(svg);
  1693. //img.src = url;
  1694. img.src = 'data:image/svg+xml;base64,' + window.btoa(data);
  1695. cell.tag(img);
  1696. img.onload = function () {
  1697. context.sheet.repaint(new GC.Spread.Sheets.Rect(x, y, w, h));
  1698. }
  1699. };
  1700. return new HTMLCellType();
  1701. },
  1702. /**
  1703. * 获取 字符超长缩略的cellType
  1704. * @returns {EllipsisTextCellType}
  1705. */
  1706. getEllipsisTextCellType: function () {
  1707. const EllipsisTextCellType = function (){};
  1708. EllipsisTextCellType.prototype = new spreadNS.CellTypes.Text;
  1709. const proto = EllipsisTextCellType.prototype;
  1710. proto.getEllipsisText = function(c, str, maxWidth) {
  1711. var width = c.measureText(str).width;
  1712. var ellipsis = '…';
  1713. var ellipsisWidth = c.measureText(ellipsis).width;
  1714. if (width <= maxWidth || width <= ellipsisWidth) {
  1715. return str;
  1716. } else {
  1717. var len = str.length;
  1718. while (width >= maxWidth - ellipsisWidth && len-- > 0) {
  1719. str = str.substring(0, len);
  1720. width = c.measureText(str).width;
  1721. }
  1722. return str + ellipsis;
  1723. }
  1724. };
  1725. proto.paint = function (ctx, value, x, y, w, h, style, context) {
  1726. ctx.font = style.font;
  1727. value = this.getEllipsisText(ctx, value, w - 2);
  1728. spreadNS.CellTypes.Text.prototype.paint.apply(this, [ctx, value, x, y, w, h, style, context]);
  1729. };
  1730. return new EllipsisTextCellType();
  1731. },
  1732. getEllipsisTextAutoTipCellType: function () {
  1733. const CellType = function () {};
  1734. // 继承 TipCellType
  1735. CellType.prototype = SpreadJsObj.CellType.getAutoTipCellType();
  1736. const proto = CellType.prototype;
  1737. const ellipsisTextCellType = SpreadJsObj.CellType.getEllipsisTextCellType();
  1738. proto.getEllipsisText = ellipsisTextCellType.getEllipsisText;
  1739. proto.paint = ellipsisTextCellType.paint;
  1740. return new CellType();
  1741. },
  1742. /**
  1743. * 获取 动态显示ComboBox的cellType
  1744. * @returns {ActiveComboCellType}
  1745. */
  1746. getActiveComboCellType: function () {
  1747. const ActiveComboCellType = function () {};
  1748. ActiveComboCellType.prototype = new spreadNS.CellTypes.ComboBox();
  1749. const proto = ActiveComboCellType.prototype;
  1750. proto.paintValue = function (ctx, value, x, y, w, h, style, options) {
  1751. const sheet = options.sheet;
  1752. if (options.row === sheet.getActiveRowIndex() && options.col === sheet.getActiveColumnIndex()
  1753. && !sheet.getCell(options.row, options.col).locked()) {
  1754. spreadNS.CellTypes.ComboBox.prototype.paintValue.apply(this, arguments);
  1755. } else {
  1756. spreadNS.CellTypes.Base.prototype.paintValue.apply(this, arguments);
  1757. }
  1758. };
  1759. proto.getHitInfo = function (x, y, cellStyle, cellRect, options) {
  1760. const sheet = options.sheet;
  1761. if (options.row === sheet.getActiveRowIndex() && options.col === sheet.getActiveColumnIndex()
  1762. && !sheet.getCell(options.row, options.col).locked()) {
  1763. return spreadNS.CellTypes.ComboBox.prototype.getHitInfo.apply(this, [x, y, cellStyle, cellRect, options]);
  1764. } else {
  1765. return {
  1766. x: x,
  1767. y: y,
  1768. row: options.row,
  1769. col: options.col,
  1770. cellStyle: cellStyle,
  1771. cellRect: cellRect,
  1772. sheetArea: options.sheetArea
  1773. };
  1774. }
  1775. };
  1776. return new ActiveComboCellType();
  1777. },
  1778. /**
  1779. * 获取 单位的CellType
  1780. * @returns {GC.Spread.Sheets.CellTypes.ComboBox}
  1781. */
  1782. getUnitCellType: function () {
  1783. let combo = this.getActiveComboCellType();
  1784. combo.itemHeight(10).items(['m', 'km', 'm2', 'm3', 'dm3', 'kg', 't', 'm3·km',
  1785. '总额', '月' ,'项', '处' ,'个', '根', '棵', '块', '台', '系统', '每一试桩',
  1786. '桥长米', '公路公里', '株', '组', '座', '元', '工日', '套', '台班', '艘班', '亩',
  1787. 'm/处', 'm/道', 'm/座', 'm2/m', 'm3/m', 'm3/处', '根/米', 'm3/m2']);
  1788. return combo;
  1789. },
  1790. /**
  1791. * 获取 自定义的CellType
  1792. * @returns {GC.Spread.Sheets.CellTypes.ComboBox}
  1793. */
  1794. getCustomizeComboCellType: function (items) {
  1795. let combo = this.getActiveComboCellType();
  1796. combo.itemHeight(10).editorValueType(spreadNS.CellTypes.EditorValueType.value).items(items);
  1797. return combo;
  1798. },
  1799. },
  1800. Clipboard: (function () {
  1801. let cText = '', cHtml;
  1802. const setCopyData = function (text, html) {
  1803. cText = text;
  1804. cHtml = html;
  1805. };
  1806. const getPasteData = function () {
  1807. return {text: cText, html: cHtml};
  1808. };
  1809. const clearData = function () {
  1810. cText = '';
  1811. cHtml = undefined;
  1812. };
  1813. const setSheetFilterCopyData = function (sheet) {
  1814. cText = SpreadJsObj.getFilterCopyText(sheet);
  1815. cHtml = SpreadJsObj.getFilterCopyHTML(sheet);
  1816. };
  1817. const getAnalysisPasteText = function () {
  1818. return SpreadJsObj.analysisPasteText(cText);
  1819. };
  1820. const getAnalysisPasteHtml = function () {
  1821. return SpreadJsObj.analysisPasteHtml(cHtml);
  1822. };
  1823. return {
  1824. setCopyData, getPasteData, clearData,
  1825. setSheetFilterCopyData,
  1826. getAnalysisPasteText, getAnalysisPasteHtml,
  1827. }
  1828. })(),
  1829. };