spreadjs_zh.js 83 KB

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