col_setting.js 20 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415
  1. /**
  2. * Created by Mai on 2017/8/14.
  3. */
  4. let ColSettingObj = {
  5. colSetting: null,
  6. DEFAULT_TITLE_STYLE: null,
  7. DEFAULT_DATA_STYLE: null,
  8. cellType: {
  9. getText: null,
  10. cellType: null,
  11. readOnly: null,
  12. checkBox: null
  13. },
  14. Rows: {data: 0, filedName: 0, getText: 1, wordWrap: 2, cellType: 3, width: 4, readOnly: 5, showHint: 6, visible: 7, customize: 8},
  15. columnValueChanged: function (e, info) {
  16. let that = ColSettingObj;
  17. info.colList.forEach(function (iCol) {
  18. info.sheet.setValue(that.colSetting.headRows + that.Rows.width, iCol, info.sheet.getColumnWidth(iCol), GC.Spread.Sheets.SheetArea.viewport);
  19. });
  20. },
  21. valueChanged: function (e, info) {
  22. let that = ColSettingObj;
  23. if (info.row === that.colSetting.headRows + that.Rows.width) {
  24. info.sheet.setColumnWidth(info.col, info.newValue, GC.Spread.Sheets.SheetArea.viewport);
  25. }
  26. },
  27. selectionChanged: function (e, info) {
  28. let that = ColSettingObj, sel = info.newSelections[0];
  29. if (sel.row <= that.colSetting.headRows) {
  30. $('.btn-toolbar').removeClass('disabled');
  31. $('#font').val(info.sheet.getCell(sel.row, sel.col, GC.Spread.Sheets.SheetArea.viewport).font());
  32. } else {
  33. $('.btn-toolbar').addClass('disabled');
  34. }
  35. },
  36. getCellStyle: function (font, hAlign, vAlign) {
  37. var style = new GC.Spread.Sheets.Style();
  38. style.font = font;
  39. style.hAlign = hAlign;
  40. style.vAlign = vAlign;
  41. style.wordWrap = true;
  42. return style;
  43. },
  44. getSettingItems: function (type, items) {
  45. let events = MainTreeCol[type];
  46. for (let prop in events) {
  47. if (typeof(events[prop]) === 'function') {
  48. items.push(type + '.' + prop);
  49. }
  50. }
  51. },
  52. initCellType: function () {
  53. this.cellType.readOnly = new GC.Spread.Sheets.CellTypes.ComboBox();
  54. let readOnlyItems = [true, false];
  55. this.getSettingItems('readOnly', readOnlyItems);
  56. this.cellType.readOnly.items(readOnlyItems);
  57. this.cellType.getText = new GC.Spread.Sheets.CellTypes.ComboBox();
  58. let getTextItems = [];
  59. this.getSettingItems('getText', getTextItems);
  60. this.cellType.getText.items(getTextItems);
  61. this.cellType.cellType = new GC.Spread.Sheets.CellTypes.ComboBox();
  62. let cellTypeItems = [];
  63. this.getSettingItems('cellType', cellTypeItems)
  64. this.cellType.cellType.items(cellTypeItems);
  65. this.cellType.checkBox = new GC.Spread.Sheets.CellTypes.CheckBox();
  66. },
  67. initSheet: function (sheet, setting) {
  68. let initColProperty = function (iRow, title) {
  69. sheet.setText(setting.headRows + iRow, 0, title, GC.Spread.Sheets.SheetArea.rowHeader);
  70. sheet.addSpan(setting.headRows + iRow, 0, 1, 2, GC.Spread.Sheets.SheetArea.rowHeader);
  71. };
  72. sheet.setColumnCount(2, GC.Spread.Sheets.SheetArea.rowHeader);
  73. sheet.setColumnWidth(0, 80, GC.Spread.Sheets.SheetArea.rowHeader);
  74. sheet.setColumnWidth(1, 70, GC.Spread.Sheets.SheetArea.rowHeader);
  75. sheet.setRowCount(setting.headRows + this.Rows.customize + 1);
  76. sheet.setText(setting.headRows + this.Rows.data, 0, 'Data', GC.Spread.Sheets.SheetArea.rowHeader);
  77. sheet.setStyle(setting.headRows + this.Rows.data, -1, this.DEFAULT_DATA_STYLE);
  78. sheet.addSpan(setting.headRows + this.Rows.data, 0, this.Rows.wordWrap + 1, 1, GC.Spread.Sheets.SheetArea.rowHeader);
  79. sheet.setText(setting.headRows + this.Rows.filedName, 1, 'FieldName', GC.Spread.Sheets.SheetArea.rowHeader);
  80. sheet.setText(setting.headRows + this.Rows.getText, 1, 'getText', GC.Spread.Sheets.SheetArea.rowHeader);
  81. sheet.setText(setting.headRows + this.Rows.wordWrap, 1, 'wordWrap', GC.Spread.Sheets.SheetArea.rowHeader);
  82. initColProperty(this.Rows.width, 'Width');
  83. initColProperty(this.Rows.readOnly, 'ReadOnly');
  84. initColProperty(this.Rows.showHint, 'ShowHint');
  85. initColProperty(this.Rows.visible, 'Visible');
  86. initColProperty(this.Rows.cellType, 'CellType');
  87. initColProperty(this.Rows.customize, 'Customize');
  88. },
  89. initColSetting: function (setting) {
  90. this.DEFAULT_TITLE_STYLE = this.getCellStyle('Arial', GC.Spread.Sheets.HorizontalAlign.center, GC.Spread.Sheets.VerticalAlign.center);
  91. this.DEFAULT_DATA_STYLE = this.getCellStyle('Arial', GC.Spread.Sheets.HorizontalAlign.left, GC.Spread.Sheets.VerticalAlign.center);
  92. this.initCellType();
  93. $('#empty-rows').val(setting.emptyRows);
  94. $('#col-count').val(setting.cols ? setting.cols.length : 0);
  95. $('#header-row-count').val(setting.headRows);
  96. colEditSpread = new GC.Spread.Sheets.Workbook($('#colEditSpread')[0], {sheetCount: 1});
  97. colEditSpread.getActiveSheet().setRowCount(0);
  98. colEditSpread.getActiveSheet().setColumnCount(0);
  99. colEditSpread.options.tabStripVisible = false;
  100. colEditSpread.bind(GC.Spread.Sheets.Events.ColumnWidthChanged, this.columnValueChanged);
  101. colEditSpread.bind(GC.Spread.Sheets.Events.ValueChanged, this.valueChanged);
  102. colEditSpread.bind(GC.Spread.Sheets.Events.SelectionChanged, this.selectionChanged);
  103. colEditSpread.getActiveSheet().suspendPaint();
  104. this.initSheet(colEditSpread.getActiveSheet(), setting);
  105. this.setColCount(this.colSetting.cols.length);
  106. this.setHeaderRowCount(this.colSetting.headRows);
  107. // headerHeight
  108. for (let iRow in this.colSetting.headRowHeight) {
  109. colEditSpread.getActiveSheet().setRowHeight(iRow, this.colSetting.headRowHeight[iRow], GC.Spread.Sheets.SheetArea.viewport);
  110. }
  111. if (setting.treeCol >= 0) {
  112. $('#is-tree')[0].checked = true;
  113. $('#tree-col-div').removeClass('hidden');
  114. $('#tree-col').val(setting.treeCol);
  115. } else {
  116. $('#is-tree')[0].checked = false;
  117. $('#tree-col-div').addClass('hidden');
  118. }
  119. if (setting.cols) {
  120. let sheet = colEditSpread.getActiveSheet(), iRow;
  121. for (let iCol = 0; iCol < setting.cols.length; iCol++) {
  122. let col = setting.cols[iCol], iRow = 0;
  123. // header
  124. for (let i in col.head.spanCols) {
  125. if (col.head.spanCols[i] !== 0) {
  126. let cell = sheet.getCell(iRow, iCol, GC.Spread.Sheets.SheetArea.viewport);
  127. cell.value(col.head.titleNames[i]).font(col.head.font[i]).hAlign(col.head.hAlign[i]).vAlign(col.head.vAlign[i]);
  128. }
  129. if (col.head.spanCols[i] > 1 || col.head.spanRows[i] > 1) {
  130. sheet.addSpan(iRow, iCol, col.head.spanRows[i], col.head.spanCols[i], GC.Spread.Sheets.SheetArea.viewport);
  131. }
  132. iRow += col.head.spanRows[i];
  133. };
  134. // data
  135. // field
  136. let cell = sheet.getCell(this.colSetting.headRows + this.Rows.data, iCol, GC.Spread.Sheets.SheetArea.viewport);
  137. cell.value(col.data.field).font(col.data.font).hAlign(col.data.hAlign).vAlign(col.data.vAlign);
  138. // getText
  139. cell = sheet.getCell(this.colSetting.headRows + this.Rows.getText, iCol, GC.Spread.Sheets.SheetArea.viewport);
  140. cell.cellType(this.cellType.getText).value(col.data.getText).hAlign(GC.Spread.Sheets.HorizontalAlign.right);
  141. // wordWrap
  142. cell = sheet.getCell(this.colSetting.headRows + this.Rows.wordWrap, iCol, GC.Spread.Sheets.SheetArea.viewport);
  143. cell.cellType(this.cellType.checkBox).value(col.data.wordWrap).hAlign(GC.Spread.Sheets.HorizontalAlign.center);
  144. // cellType
  145. cell = sheet.getCell(this.colSetting.headRows + this.Rows.cellType, iCol, GC.Spread.Sheets.SheetArea.viewport);
  146. cell.cellType(this.cellType.cellType).value(col.data.cellType).hAlign(GC.Spread.Sheets.HorizontalAlign.right);
  147. // 列宽
  148. sheet.setColumnWidth(iCol, col.width);
  149. sheet.setValue(this.colSetting.headRows + this.Rows.width, iCol, sheet.getColumnWidth(iCol), GC.Spread.Sheets.SheetArea.viewport);
  150. // readonly
  151. cell = sheet.getCell(this.colSetting.headRows + this.Rows.readOnly, iCol, GC.Spread.Sheets.SheetArea.viewport);
  152. cell.cellType(this.cellType.readOnly).value(col.readOnly).hAlign(GC.Spread.Sheets.HorizontalAlign.right);
  153. // showHint
  154. cell = sheet.getCell(this.colSetting.headRows + this.Rows.showHint, iCol, GC.Spread.Sheets.SheetArea.viewport);
  155. cell.cellType(this.cellType.checkBox).value(col.showHint).hAlign(GC.Spread.Sheets.HorizontalAlign.center);
  156. // visible
  157. cell = sheet.getCell(this.colSetting.headRows + this.Rows.visible, iCol, GC.Spread.Sheets.SheetArea.viewport);
  158. cell.cellType(this.cellType.checkBox).value(col.visible).hAlign(GC.Spread.Sheets.HorizontalAlign.center);
  159. // customize
  160. cell = sheet.getCell(this.colSetting.headRows + this.Rows.customize, iCol, GC.Spread.Sheets.SheetArea.viewport);
  161. cell.cellType(this.cellType.checkBox).value(col.customize).hAlign(GC.Spread.Sheets.HorizontalAlign.center);
  162. }
  163. }
  164. colEditSpread.getActiveSheet().resumePaint();
  165. let cell = colEditSpread.getActiveSheet().getCell(0, 0, GC.Spread.Sheets.SheetArea.viewport);
  166. if (cell) {
  167. $('#font').val(cell.font());
  168. }
  169. },
  170. setColCount: function (count) {
  171. let sheet = colEditSpread.getActiveSheet();
  172. let orgCount = sheet.getColumnCount();
  173. sheet.setColumnCount(count);
  174. for (let iCol = orgCount; iCol < count; iCol++) {
  175. for (let iRow = 0; iRow < this.colSetting.headRows; iRow ++) {
  176. sheet.setStyle(iRow, iCol, this.DEFAULT_TITLE_STYLE);
  177. }
  178. sheet.getCell(this.colSetting.headRows + this.Rows.getText, iCol).cellType(this.cellType.getText).hAlign(GC.Spread.Sheets.HorizontalAlign.right);
  179. sheet.getCell(this.colSetting.headRows + this.Rows.wordWrap, iCol).cellType(this.cellType.checkBox).hAlign(GC.Spread.Sheets.HorizontalAlign.center);
  180. sheet.getCell(this.colSetting.headRows + this.Rows.cellType, iCol).cellType(this.cellType.cellType).hAlign(GC.Spread.Sheets.HorizontalAlign.right);
  181. sheet.setValue(this.colSetting.headRows + this.Rows.width, iCol, sheet.getColumnWidth(iCol), GC.Spread.Sheets.SheetArea.viewport);
  182. sheet.getCell(this.colSetting.headRows + this.Rows.readOnly, iCol).cellType(this.cellType.readOnly).hAlign(GC.Spread.Sheets.HorizontalAlign.right);
  183. sheet.setValue(this.colSetting.headRows + this.Rows.readOnly, iCol, false, GC.Spread.Sheets.SheetArea.viewport);
  184. sheet.getCell(this.colSetting.headRows + this.Rows.showHint, iCol).cellType(this.cellType.checkBox).hAlign(GC.Spread.Sheets.HorizontalAlign.center);
  185. sheet.getCell(this.colSetting.headRows + this.Rows.visible, iCol).cellType(this.cellType.checkBox).hAlign(GC.Spread.Sheets.HorizontalAlign.center).value(true);
  186. sheet.getCell(this.colSetting.headRows + this.Rows.customize, iCol).cellType(this.cellType.checkBox).hAlign(GC.Spread.Sheets.HorizontalAlign.center).value(false);
  187. }
  188. },
  189. setHeaderRowCount: function (count) {
  190. let sheet = colEditSpread.getActiveSheet(), orgCount = this.colSetting.headRows;
  191. if (count < orgCount) {
  192. sheet.deleteRows(count, orgCount - count);
  193. } else if (count > orgCount) {
  194. sheet.addRows(orgCount, count - orgCount);
  195. sheet.addSpan(0, 0, count, 1, GC.Spread.Sheets.SheetArea.rowHeader);
  196. for (let iRow = orgCount; iRow < count; iRow++) {
  197. sheet.setStyle(iRow, -1, this.DEFAULT_TITLE_STYLE);
  198. }
  199. }
  200. },
  201. getActualCellRange: function (cellRange, rowCount, columnCount) {
  202. if (cellRange.row == -1 && cellRange.col == -1) {
  203. return new spreadNS.Range(0, 0, rowCount, columnCount);
  204. }
  205. else if (cellRange.row == -1) {
  206. return new spreadNS.Range(0, cellRange.col, rowCount, cellRange.colCount);
  207. }
  208. else if (cellRange.col == -1) {
  209. return new spreadNS.Range(cellRange.row, 0, cellRange.rowCount, columnCount);
  210. }
  211. return cellRange;
  212. },
  213. // 批量操作Spread选择的单元格
  214. controlSelectCells: function (spread, control) {
  215. let sheet = colEditSpread.getActiveSheet();
  216. let sel = sheet.getSelections(), i, j;
  217. sel = this.getActualCellRange(sel[sel.length - 1], sheet.getRowCount(), sheet.getColumnCount());
  218. for (i = 0; i < sel.rowCount; i++) {
  219. for (j = 0; j < sel.colCount; j++) {
  220. control(sheet.getCell(sel.row + i, sel.col + j));
  221. }
  222. }
  223. },
  224. generateColSetting: function () {
  225. let setting = {}, sheet = colEditSpread.getActiveSheet();
  226. setting.emptyRows = parseInt($('#empty-rows').val());
  227. setting.headRows = parseInt($('#header-row-count').val());
  228. if ($('#is-tree')[0].checked) {
  229. setting.treeCol = parseInt($('#tree-col').val());
  230. }
  231. setting.headRowHeight = [];
  232. for (let iRow = 0; iRow < setting.headRows; iRow++) {
  233. setting.headRowHeight.push(sheet.getRowHeight(iRow, GC.Spread.Sheets.SheetArea.viewport));
  234. };
  235. setting.cols = [];
  236. for (let iCol = 0; iCol < sheet.getColumnCount(); iCol++) {
  237. let col = {};
  238. col.width = sheet.getColumnWidth(iCol);
  239. col.readOnly = sheet.getValue(setting.headRows + this.Rows.readOnly, iCol) || false;
  240. if (sheet.getValue(setting.headRows + this.Rows.showHint, iCol)) {
  241. col.showHint = sheet.getValue(setting.headRows + this.Rows.showHint, iCol) || false;
  242. }
  243. col.visible = sheet.getValue(setting.headRows + this.Rows.visible, iCol) || false;
  244. col.customize = sheet.getValue(setting.headRows + this.Rows.customize, iCol) || false;
  245. col.head = {};
  246. col.head.titleNames = [];
  247. col.head.spanCols = [];
  248. col.head.spanRows = [];
  249. col.head.vAlign = [];
  250. col.head.hAlign = [];
  251. col.head.font = [];
  252. for (let iRow = 0; iRow < setting.headRows; iRow++) {
  253. let cell = sheet.getCell(iRow, iCol);
  254. col.head.titleNames.push(cell.text());
  255. let span = sheet.getSpan(iRow, iCol);
  256. if (span) {
  257. if (span.col === iCol && span.row === iRow) {
  258. col.head.spanCols.push(span.colCount);
  259. col.head.spanRows.push(span.rowCount);
  260. } else {
  261. col.head.spanCols.push(0);
  262. col.head.spanRows.push(1);
  263. }
  264. } else {
  265. col.head.spanCols.push(1);
  266. col.head.spanRows.push(1);
  267. }
  268. col.head.vAlign.push(cell.vAlign());
  269. col.head.hAlign.push(cell.hAlign());
  270. col.head.font.push(cell.font());
  271. }
  272. col.data = {};
  273. let cell = sheet.getCell(setting.headRows, iCol);
  274. col.data.field = cell.text();
  275. col.data.vAlign = cell.vAlign();
  276. col.data.hAlign = cell.hAlign();
  277. col.data.font = cell.font();
  278. // getText
  279. cell = sheet.getCell(setting.headRows + this.Rows.getText, iCol);
  280. if (cell.text() !== '') {
  281. col.data.getText = cell.text();
  282. }
  283. // wordWrap
  284. col.data.wordWrap = sheet.getValue(setting.headRows + this.Rows.wordWrap, iCol) || false;
  285. // cellType
  286. cell = sheet.getCell(setting.headRows + this.Rows.cellType, iCol);
  287. if (cell.text() !== '') {
  288. col.data.cellType = cell.text();
  289. }
  290. setting.cols.push(col);
  291. }
  292. return setting;
  293. }
  294. };
  295. $('#set-column').on('shown.bs.modal', function () {
  296. if (!colEditSpread) {
  297. ColSettingObj.colSetting = JSON.parse(mainTreeCol);
  298. ColSettingObj.initColSetting(ColSettingObj.colSetting);
  299. }
  300. });
  301. $('#col-count').change(function () {
  302. ColSettingObj.setColCount(parseInt($(this).val()));
  303. });
  304. $('#header-row-count').change(function () {
  305. ColSettingObj.setHeaderRowCount(parseInt($(this).val()));
  306. ColSettingObj.colSetting.headRows = parseInt($(this).val());
  307. });
  308. $('#is-tree').click(function () {
  309. if (this.checked) {
  310. $('#tree-col-div').removeClass('hidden');
  311. } else {
  312. $('#tree-col-div').addClass('hidden');
  313. }
  314. });
  315. $('#merge').click(function () {
  316. let sheet = colEditSpread.getActiveSheet();
  317. let sel = sheet.getSelections();
  318. if (sel.length > 0) {
  319. sel = ColSettingObj.getActualCellRange(sel[sel.length - 1], sheet.getRowCount(), sheet.getColumnCount());
  320. if (sel.row + sel.rowCount > ColSettingObj.colSetting.headRows) {
  321. alert('仅HeaderTitle部分可以合并单元格');
  322. } else {
  323. sheet.addSpan(sel.row, sel.col, sel.rowCount, sel.colCount);
  324. //sheet.setTag(sel.row, sel.col, 1);
  325. }
  326. }
  327. });
  328. $('#unmerge').click(function () {
  329. let sheet = colEditSpread.getActiveSheet();
  330. let sel = sheet.getSelections();
  331. if (sel.length > 0) {
  332. sel = ColSettingObj.getActualCellRange(sel[sel.length - 1], sheet.getRowCount(), sheet.getColumnCount());
  333. sheet.suspendPaint();
  334. for (var i = 0; i < sel.rowCount; i++) {
  335. for (var j = 0; j < sel.colCount; j++) {
  336. sheet.removeSpan(i + sel.row, j + sel.col);
  337. }
  338. }
  339. sheet.resumePaint();
  340. }
  341. });
  342. $('#save-col-setting').click(function () {
  343. ColSettingObj.colSetting = ColSettingObj.generateColSetting();
  344. mainTreeCol = JSON.stringify(ColSettingObj.colSetting);
  345. $('input:hidden[name="main_tree_col"]').val(mainTreeCol);
  346. $('#set-column').modal('hide');
  347. let billsTemplateTree = idTree.createNew({id: 'ID', pid: 'ParentID', nid: 'NextSiblingID', rootId: -1});
  348. billsTemplateTree.loadDatas(JSON.parse(billsTemplateData));
  349. TREE_SHEET_HELPER.loadSheetHeader(ColSettingObj.colSetting, colSpread.getActiveSheet());
  350. TREE_SHEET_HELPER.showTreeData(ColSettingObj.colSetting, colSpread.getActiveSheet(), billsTemplateTree);
  351. });
  352. $('#h-left').click(function () {
  353. ColSettingObj.controlSelectCells(colEditSpread, function (cell) {
  354. cell.hAlign(GC.Spread.Sheets.HorizontalAlign.left);
  355. });
  356. });
  357. $('#h-center').click(function () {
  358. ColSettingObj.controlSelectCells(colEditSpread, function (cell) {
  359. cell.hAlign(GC.Spread.Sheets.HorizontalAlign.center);
  360. });
  361. });
  362. $('#h-right').click(function () {
  363. ColSettingObj.controlSelectCells(colEditSpread, function (cell) {
  364. cell.hAlign(GC.Spread.Sheets.HorizontalAlign.right);
  365. });
  366. });
  367. $('#v-top').click(function () {
  368. ColSettingObj.controlSelectCells(colEditSpread, function (cell) {
  369. cell.vAlign(GC.Spread.Sheets.VerticalAlign.top);
  370. });
  371. });
  372. $('#v-center').click(function () {
  373. ColSettingObj.controlSelectCells(colEditSpread, function (cell) {
  374. cell.vAlign(GC.Spread.Sheets.VerticalAlign.center);
  375. });
  376. });
  377. $('#v-bottom').click(function () {
  378. ColSettingObj.controlSelectCells(colEditSpread, function (cell) {
  379. cell.vAlign(GC.Spread.Sheets.VerticalAlign.bottom);
  380. });
  381. });
  382. $('#set-font').click(function () {
  383. var sFont = $('#font').val();
  384. ColSettingObj.controlSelectCells(colEditSpread, function (cell) {
  385. cell.font(sFont);
  386. });
  387. });