devextreme-planit-treegrid-react 0.2.9 → 0.3.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (2) hide show
  1. package/dist/DxPlanitTreeGrid.js +357 -193
  2. package/package.json +2 -1
package/dist/DxPlanitTreeGrid.js CHANGED
@@ -1,43 +1,150 @@
1
- "use strict";
1
+ 'use strict';
2
2
 
3
- function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
3
+ function _typeof(obj) {
4
+ '@babel/helpers - typeof';
5
+ return (
6
+ (_typeof =
7
+ 'function' == typeof Symbol && 'symbol' == typeof Symbol.iterator
8
+ ? function (obj) {
9
+ return typeof obj;
10
+ }
11
+ : function (obj) {
12
+ return obj && 'function' == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? 'symbol' : typeof obj;
13
+ }),
14
+ _typeof(obj)
15
+ );
16
+ }
17
+ Object.defineProperty(exports, '__esModule', {
18
+ value: true,
6
19
  });
7
20
  exports.default = void 0;
8
- var _react = require("react");
9
- var _loadPanel = require("devextreme-react/load-panel");
10
- var _pivotGrid = _interopRequireWildcard(require("devextreme-react/pivot-grid"));
11
- var _dataGrid = require("devextreme-react/data-grid");
12
- var _excel_exporter = require("devextreme/excel_exporter");
13
- var _exceljs = require("exceljs");
14
- var _fileSaver = _interopRequireDefault(require("file-saver"));
15
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
16
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
17
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
18
- function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
19
- function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
20
- function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
21
- function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
22
- function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
23
- function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
24
- function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
25
- function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
26
- function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0) { ; } } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
27
- function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
28
- /**
29
- * devextreme pivotgrid Configrations 중 사용 불가 항목 : id, width, height, showColumnGrandTotals, showColumnTotals, showRowGrandTotals, FieldChooser
30
- * devextreme pivotgrid Configrations 중 사용 방법 변경 항목 : stateStoring, Export
31
- * onExported, onFileSaving 이벤트 사용하지 않음.
21
+ var _react = require('react');
22
+ var _loadPanel = require('devextreme-react/load-panel');
23
+ var _pivotGrid = _interopRequireWildcard(require('devextreme-react/pivot-grid'));
24
+ var _dataGrid = require('devextreme-react/data-grid');
25
+ var _excel_exporter = require('devextreme/excel_exporter');
26
+ var _exceljs = require('exceljs');
27
+ var _fileSaver = _interopRequireDefault(require('file-saver'));
28
+ function _interopRequireDefault(obj) {
29
+ return obj && obj.__esModule ? obj : { default: obj };
30
+ }
31
+ function _getRequireWildcardCache(nodeInterop) {
32
+ if (typeof WeakMap !== 'function') return null;
33
+ var cacheBabelInterop = new WeakMap();
34
+ var cacheNodeInterop = new WeakMap();
35
+ return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {
36
+ return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
37
+ })(nodeInterop);
38
+ }
39
+ function _interopRequireWildcard(obj, nodeInterop) {
40
+ if (!nodeInterop && obj && obj.__esModule) {
41
+ return obj;
42
+ }
43
+ if (obj === null || (_typeof(obj) !== 'object' && typeof obj !== 'function')) {
44
+ return { default: obj };
45
+ }
46
+ var cache = _getRequireWildcardCache(nodeInterop);
47
+ if (cache && cache.has(obj)) {
48
+ return cache.get(obj);
49
+ }
50
+ var newObj = {};
51
+ var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
52
+ for (var key in obj) {
53
+ if (key !== 'default' && Object.prototype.hasOwnProperty.call(obj, key)) {
54
+ var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
55
+ if (desc && (desc.get || desc.set)) {
56
+ Object.defineProperty(newObj, key, desc);
57
+ } else {
58
+ newObj[key] = obj[key];
59
+ }
60
+ }
61
+ }
62
+ newObj.default = obj;
63
+ if (cache) {
64
+ cache.set(obj, newObj);
65
+ }
66
+ return newObj;
67
+ }
68
+ function _toConsumableArray(arr) {
69
+ return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
70
+ }
71
+ function _nonIterableSpread() {
72
+ throw new TypeError(
73
+ 'Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.'
74
+ );
75
+ }
76
+ function _iterableToArray(iter) {
77
+ if ((typeof Symbol !== 'undefined' && iter[Symbol.iterator] != null) || iter['@@iterator'] != null) return Array.from(iter);
78
+ }
79
+ function _arrayWithoutHoles(arr) {
80
+ if (Array.isArray(arr)) return _arrayLikeToArray(arr);
81
+ }
82
+ function _slicedToArray(arr, i) {
83
+ return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
84
+ }
85
+ function _nonIterableRest() {
86
+ throw new TypeError(
87
+ 'Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.'
88
+ );
89
+ }
90
+ function _unsupportedIterableToArray(o, minLen) {
91
+ if (!o) return;
92
+ if (typeof o === 'string') return _arrayLikeToArray(o, minLen);
93
+ var n = Object.prototype.toString.call(o).slice(8, -1);
94
+ if (n === 'Object' && o.constructor) n = o.constructor.name;
95
+ if (n === 'Map' || n === 'Set') return Array.from(o);
96
+ if (n === 'Arguments' || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
97
+ }
98
+ function _arrayLikeToArray(arr, len) {
99
+ if (len == null || len > arr.length) len = arr.length;
100
+ for (var i = 0, arr2 = new Array(len); i < len; i++) {
101
+ arr2[i] = arr[i];
102
+ }
103
+ return arr2;
104
+ }
105
+ function _iterableToArrayLimit(arr, i) {
106
+ var _i = null == arr ? null : ('undefined' != typeof Symbol && arr[Symbol.iterator]) || arr['@@iterator'];
107
+ if (null != _i) {
108
+ var _s,
109
+ _e,
110
+ _x,
111
+ _r,
112
+ _arr = [],
113
+ _n = !0,
114
+ _d = !1;
115
+ try {
116
+ if (((_x = (_i = _i.call(arr)).next), 0 === i)) {
117
+ if (Object(_i) !== _i) return;
118
+ _n = !1;
119
+ } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0) {}
120
+ } catch (err) {
121
+ (_d = !0), (_e = err);
122
+ } finally {
123
+ try {
124
+ if (!_n && null != _i.return && ((_r = _i.return()), Object(_r) !== _r)) return;
125
+ } finally {
126
+ if (_d) throw _e;
127
+ }
128
+ }
129
+ return _arr;
130
+ }
131
+ }
132
+ function _arrayWithHoles(arr) {
133
+ if (Array.isArray(arr)) return arr;
134
+ }
135
+ /**
136
+ * devextreme pivotgrid Configrations 중 사용 불가 항목 : id, width, height, showColumnGrandTotals, showColumnTotals, showRowGrandTotals, FieldChooser
137
+ * devextreme pivotgrid Configrations 중 사용 방법 변경 항목 : stateStoring, Export
138
+ * onExported, onFileSaving 이벤트 사용하지 않음.
32
139
  */
33
- /**
34
- * todoList:
35
- * 2) columIndex 초기화 기능이 있어야 함(column 개수 변할 때)
36
- * 3) 헤더에 테이블 삽입되면서 그리드 크기가 늘어남. height에 그리드 크기 늘어난 만큼 반영되어야 함.
140
+ /**
141
+ * todoList:
142
+ * 2) columIndex 초기화 기능이 있어야 함(column 개수 변할 때)
143
+ * 3) 헤더에 테이블 삽입되면서 그리드 크기가 늘어남. height에 그리드 크기 늘어난 만큼 반영되어야 함.
37
144
  */
38
145
 
39
146
  var grandTotalCssNm = 'data-grand-total';
40
- var DxPlanitTreeGrid = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
147
+ var DxPlanitTreeGrid = /*#__PURE__*/ (0, _react.forwardRef)(function (props, ref) {
41
148
  var _props$id = props.id,
42
149
  id = _props$id === void 0 ? 'dx-planit-vera-pivotgrid-id' : _props$id,
43
150
  groupField = props.groupField,
@@ -112,39 +219,49 @@ var DxPlanitTreeGrid = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
112
219
  var excelBorder = {
113
220
  style: 'thin',
114
221
  color: {
115
- argb: 'FF7E7E7E'
116
- }
222
+ argb: 'FF7E7E7E',
223
+ },
117
224
  };
118
225
  (0, _react.useImperativeHandle)(ref, function () {
119
226
  return {
120
- exportToExcel: exportToExcel
227
+ exportToExcel: exportToExcel,
121
228
  };
122
229
  });
123
230
 
124
- /**
125
- * 그리드 사이즈 재조정
126
- * @returns 그리드 사이즈
231
+ /**
232
+ * 그리드 사이즈 재조정
233
+ * @returns 그리드 사이즈
127
234
  */
128
235
  var getGridSize = function getGridSize() {
129
236
  var _wrapper$clientWidth;
130
237
  var wrapper = document.querySelector('.diag-table-wrapper');
131
238
  var gap = 10;
132
- setWidth((_wrapper$clientWidth = wrapper === null || wrapper === void 0 ? void 0 : wrapper.clientWidth) !== null && _wrapper$clientWidth !== void 0 ? _wrapper$clientWidth : 0);
239
+ setWidth(
240
+ (_wrapper$clientWidth = wrapper === null || wrapper === void 0 ? void 0 : wrapper.clientWidth) !== null &&
241
+ _wrapper$clientWidth !== void 0
242
+ ? _wrapper$clientWidth
243
+ : 0
244
+ );
133
245
  setHeight(wrapper ? wrapper.clientHeight - gap : 0);
134
246
  window.addEventListener('resize', function () {
135
247
  var _wrapper$clientWidth2;
136
- setWidth((_wrapper$clientWidth2 = wrapper === null || wrapper === void 0 ? void 0 : wrapper.clientWidth) !== null && _wrapper$clientWidth2 !== void 0 ? _wrapper$clientWidth2 : 0);
248
+ setWidth(
249
+ (_wrapper$clientWidth2 = wrapper === null || wrapper === void 0 ? void 0 : wrapper.clientWidth) !== null &&
250
+ _wrapper$clientWidth2 !== void 0
251
+ ? _wrapper$clientWidth2
252
+ : 0
253
+ );
137
254
  setHeight(wrapper ? wrapper.clientHeight - gap : 0);
138
255
  });
139
256
  return {
140
257
  width: width,
141
- height: height
258
+ height: height,
142
259
  };
143
260
  };
144
261
 
145
- /**
146
- * 'Total' 을 한글로 변경
147
- * @param e devextreme CellPreparedEvent
262
+ /**
263
+ * 'Total' 을 한글로 변경
264
+ * @param e devextreme CellPreparedEvent
148
265
  */
149
266
  var changeTotalText = function changeTotalText(e) {
150
267
  var _e$cell;
@@ -154,13 +271,13 @@ var DxPlanitTreeGrid = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
154
271
  if (((_e$cell = e.cell) === null || _e$cell === void 0 ? void 0 : _e$cell.type) === 'T') {
155
272
  var _e$cell$text;
156
273
  var text = (_e$cell$text = e.cell.text) === null || _e$cell$text === void 0 ? void 0 : _e$cell$text.replace('Total', '합계');
157
- e.cellElement.innerHTML = "<span>".concat(text, "</span>");
274
+ e.cellElement.innerHTML = '<span>'.concat(text, '</span>');
158
275
  }
159
276
  };
160
277
 
161
- /**
162
- * null값을 하이픈으로 모두 변경
163
- * @param e devextreme CellPreparedEvent
278
+ /**
279
+ * null값을 하이픈으로 모두 변경
280
+ * @param e devextreme CellPreparedEvent
164
281
  */
165
282
  var changeNullToHipen = function changeNullToHipen(e) {
166
283
  var _e$cell2;
@@ -172,30 +289,36 @@ var DxPlanitTreeGrid = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
172
289
  }
173
290
  };
174
291
 
175
- /**
176
- * '0', '0.0%' 를 하이픈으로 모두 변경
177
- * @param e devextreme CellPreparedEvent
292
+ /**
293
+ * '0', '0.0%' 를 하이픈으로 모두 변경
294
+ * @param e devextreme CellPreparedEvent
178
295
  */
179
296
  var changeZeroToHipen = function changeZeroToHipen(e) {
180
297
  var _e$cell3, _e$cell4, _e$cell5;
181
298
  if (!convertZeroToHipen) {
182
299
  return;
183
300
  }
184
- if (e.area === 'data' && (((_e$cell3 = e.cell) === null || _e$cell3 === void 0 ? void 0 : _e$cell3.text) === '0' || ((_e$cell4 = e.cell) === null || _e$cell4 === void 0 ? void 0 : _e$cell4.text) === '0.0%' || ((_e$cell5 = e.cell) === null || _e$cell5 === void 0 ? void 0 : _e$cell5.text) === '') && e.cellElement) {
301
+ if (
302
+ e.area === 'data' &&
303
+ (((_e$cell3 = e.cell) === null || _e$cell3 === void 0 ? void 0 : _e$cell3.text) === '0' ||
304
+ ((_e$cell4 = e.cell) === null || _e$cell4 === void 0 ? void 0 : _e$cell4.text) === '0.0%' ||
305
+ ((_e$cell5 = e.cell) === null || _e$cell5 === void 0 ? void 0 : _e$cell5.text) === '') &&
306
+ e.cellElement
307
+ ) {
185
308
  e.cellElement.innerHTML = '<span class="text-color">-</span>';
186
309
  }
187
310
  };
188
311
 
189
- /**
190
- * 테이블 헤더에 colspan, rowspan 한 HTMLElement 정보 반환
191
- * @param groupField 사용자가 작성한 그룹 정보
192
- * @return
312
+ /**
313
+ * 테이블 헤더에 colspan, rowspan 한 HTMLElement 정보 반환
314
+ * @param groupField 사용자가 작성한 그룹 정보
315
+ * @return
193
316
  */
194
317
  var makeColspan = function makeColspan(group, index, isLast) {
195
318
  var td = document.createElement('td');
196
319
  var text = group.groupCaption;
197
320
  if (group.depth === 1) {
198
- text = "".concat(group.groupCaption);
321
+ text = ''.concat(group.groupCaption);
199
322
  }
200
323
  td.setAttribute('colspan', group.colspan.toString());
201
324
  td.setAttribute('class', 'dx-row-total dx-grand-total dx-planit-colspan');
@@ -206,31 +329,33 @@ var DxPlanitTreeGrid = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
206
329
  } else if (!isLast && index === 0) {
207
330
  td.setAttribute('style', 'border-bottom: 0');
208
331
  }
209
- td.innerHTML = "<div>".concat(text, "</div>");
332
+ td.innerHTML = '<div>'.concat(text, '</div>');
210
333
  return td;
211
334
  };
212
335
 
213
- /**
214
- * 그룹 필드 데이터 유효성 검증용 데이터 생성
215
- * @param groupField
216
- * @returns
336
+ /**
337
+ * 그룹 필드 데이터 유효성 검증용 데이터 생성
338
+ * @param groupField
339
+ * @returns
217
340
  */
218
341
  var makeCheckGroupData = function makeCheckGroupData(groupField) {
219
342
  var data = {};
220
- groupField === null || groupField === void 0 ? void 0 : groupField.forEach(function (group) {
221
- if (data[group.depth]) {
222
- data[group.depth] += group.colspan;
223
- } else {
224
- data[group.depth] = group.colspan;
225
- }
226
- });
343
+ groupField === null || groupField === void 0
344
+ ? void 0
345
+ : groupField.forEach(function (group) {
346
+ if (data[group.depth]) {
347
+ data[group.depth] += group.colspan;
348
+ } else {
349
+ data[group.depth] = group.colspan;
350
+ }
351
+ });
227
352
  return data;
228
353
  };
229
354
 
230
- /**
231
- * GroupField 데이터 검증
232
- * @param 사용자가 설정한 그룹 필드 정보
233
- * @returns 데이터 검증 결과
355
+ /**
356
+ * GroupField 데이터 검증
357
+ * @param 사용자가 설정한 그룹 필드 정보
358
+ * @returns 데이터 검증 결과
234
359
  */
235
360
  var isCheckGroupField = function isCheckGroupField(groupField) {
236
361
  var map = makeCheckGroupData(groupField);
@@ -243,21 +368,25 @@ var DxPlanitTreeGrid = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
243
368
  return true;
244
369
  };
245
370
 
246
- /**
247
- * Grand Total 셀 정보 저장
248
- * @param e
371
+ /**
372
+ * Grand Total 셀 정보 저장
373
+ * @param e
249
374
  */
250
375
  var setTotalElementInfo = function setTotalElementInfo(e) {
251
376
  var _e$cell6, _e$cell7, _e$cellElement;
252
- if (!(groupField !== null && groupField !== void 0 && groupField.length) || ((_e$cell6 = e.cell) === null || _e$cell6 === void 0 ? void 0 : _e$cell6.type) !== 'GT' || ((_e$cell7 = e.cell) === null || _e$cell7 === void 0 ? void 0 : _e$cell7.text) !== 'Grand Total') {
377
+ if (
378
+ !(groupField !== null && groupField !== void 0 && groupField.length) ||
379
+ ((_e$cell6 = e.cell) === null || _e$cell6 === void 0 ? void 0 : _e$cell6.type) !== 'GT' ||
380
+ ((_e$cell7 = e.cell) === null || _e$cell7 === void 0 ? void 0 : _e$cell7.text) !== 'Grand Total'
381
+ ) {
253
382
  return;
254
383
  }
255
384
  (_e$cellElement = e.cellElement) === null || _e$cellElement === void 0 ? void 0 : _e$cellElement.classList.add(grandTotalCssNm);
256
385
  };
257
386
 
258
- /**
259
- * cell의 columnIndex 최대값 저장
260
- * @param e
387
+ /**
388
+ * cell의 columnIndex 최대값 저장
389
+ * @param e
261
390
  */
262
391
  var setMaxColumIndex = function setMaxColumIndex(e) {
263
392
  if (!e.columnIndex) {
@@ -268,17 +397,19 @@ var DxPlanitTreeGrid = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
268
397
  }
269
398
  };
270
399
 
271
- /**
272
- * groupField depth의 유니크한 배열 구하기
273
- * @param group
274
- * @param arr
275
- * @returns
400
+ /**
401
+ * groupField depth의 유니크한 배열 구하기
402
+ * @param group
403
+ * @param arr
404
+ * @returns
276
405
  */
277
406
  var getGroupDepth = function getGroupDepth(group, arr) {
278
407
  var groupData = group.slice();
279
- var set = new Set(groupData.map(function (group) {
280
- return group.depth;
281
- }));
408
+ var set = new Set(
409
+ groupData.map(function (group) {
410
+ return group.depth;
411
+ })
412
+ );
282
413
  return Array.from(set).sort(function compare(a, b) {
283
414
  if (a > b) {
284
415
  return arr === 'asc' ? -1 : 1;
@@ -290,11 +421,11 @@ var DxPlanitTreeGrid = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
290
421
  });
291
422
  };
292
423
 
293
- /**
294
- * 현재 depth에 맞는 그룹 필드 정보 반환
295
- * @param group
296
- * @param depth
297
- * @returns
424
+ /**
425
+ * 현재 depth에 맞는 그룹 필드 정보 반환
426
+ * @param group
427
+ * @param depth
428
+ * @returns
298
429
  */
299
430
  var getCurrentGroup = function getCurrentGroup(group, depth) {
300
431
  return group.filter(function (gr) {
@@ -302,8 +433,8 @@ var DxPlanitTreeGrid = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
302
433
  });
303
434
  };
304
435
 
305
- /**
306
- * 테이블 헤더(DOM)에 colspan 적용된 테이블 삽입
436
+ /**
437
+ * 테이블 헤더(DOM)에 colspan 적용된 테이블 삽입
307
438
  */
308
439
  var insertRowHeaderGroup = function insertRowHeaderGroup() {
309
440
  var _thead$previousSiblin;
@@ -323,7 +454,10 @@ var DxPlanitTreeGrid = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
323
454
  }
324
455
  totalElement.innerHTML = '';
325
456
  totalElement.setAttribute('style', 'padding: 0; border: 0');
326
- var colgroup = (_thead$previousSiblin = thead.previousSibling) === null || _thead$previousSiblin === void 0 ? void 0 : _thead$previousSiblin.cloneNode(true);
457
+ var colgroup =
458
+ (_thead$previousSiblin = thead.previousSibling) === null || _thead$previousSiblin === void 0
459
+ ? void 0
460
+ : _thead$previousSiblin.cloneNode(true);
327
461
  var groupData = groupField.slice();
328
462
  var depth = getGroupDepth(groupData, 'asc');
329
463
  var table = document.createElement('table');
@@ -340,10 +474,10 @@ var DxPlanitTreeGrid = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
340
474
  totalElement.appendChild(table);
341
475
  };
342
476
 
343
- /**
344
- * Devextreme의 dateController columnInfo에 그룹 정보 삽입
345
- * @param group
346
- * @returns
477
+ /**
478
+ * Devextreme의 dateController columnInfo에 그룹 정보 삽입
479
+ * @param group
480
+ * @returns
347
481
  */
348
482
  var makeDataControllerColumnGroup = function makeDataControllerColumnGroup(group) {
349
483
  var groupData = group.slice();
@@ -354,21 +488,21 @@ var DxPlanitTreeGrid = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
354
488
  return {
355
489
  colspan: group.colspan,
356
490
  text: group.groupCaption,
357
- type: 'GT'
491
+ type: 'GT',
358
492
  };
359
493
  });
360
494
  });
361
495
  };
362
496
 
363
- /**
364
- * 사용자가 입력한 컬러 조건을 { standard: string; condition: string } 형식으로 변경 반환
365
- * @param condition 사용자 입력 컬러 조건식 ex) '>= 100'
366
- * @returns
497
+ /**
498
+ * 사용자가 입력한 컬러 조건을 { standard: string; condition: string } 형식으로 변경 반환
499
+ * @param condition 사용자 입력 컬러 조건식 ex) '>= 100'
500
+ * @returns
367
501
  */
368
502
  var makeSplitCondtion = function makeSplitCondtion(condition) {
369
503
  var newCondition = {
370
504
  standard: '',
371
- condition: ''
505
+ condition: '',
372
506
  };
373
507
  _toConsumableArray(condition).forEach(function (cond) {
374
508
  if (Number.isNaN(parseFloat(cond))) {
@@ -380,10 +514,10 @@ var DxPlanitTreeGrid = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
380
514
  return newCondition;
381
515
  };
382
516
 
383
- /**
384
- * 데이터에 색상 적용
385
- * @param e onCellPrepared 이벤트
386
- * @returns
517
+ /**
518
+ * 데이터에 색상 적용
519
+ * @param e onCellPrepared 이벤트
520
+ * @returns
387
521
  */
388
522
  var makeColorAtPercent = function makeColorAtPercent(e) {
389
523
  if (!dataColor || !e.cellElement) {
@@ -394,7 +528,14 @@ var DxPlanitTreeGrid = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
394
528
  if (e.cell.value === null) {
395
529
  return;
396
530
  }
397
- if (((_e$cell8 = e.cell) === null || _e$cell8 === void 0 ? void 0 : (_e$cell8$format = _e$cell8.format) === null || _e$cell8$format === void 0 ? void 0 : _e$cell8$format.type) === color.format && !Number.isNaN(e.cell.value)) {
531
+ if (
532
+ ((_e$cell8 = e.cell) === null || _e$cell8 === void 0
533
+ ? void 0
534
+ : (_e$cell8$format = _e$cell8.format) === null || _e$cell8$format === void 0
535
+ ? void 0
536
+ : _e$cell8$format.type) === color.format &&
537
+ !Number.isNaN(e.cell.value)
538
+ ) {
398
539
  var standardData = makeSplitCondtion(color.condition.replace(/(\s*)/g, ''));
399
540
  var rate = color.format === 'percent' ? 0.01 : 1;
400
541
  var condition = false;
@@ -419,9 +560,9 @@ var DxPlanitTreeGrid = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
419
560
  });
420
561
  };
421
562
 
422
- /**
423
- * 그리드 데이터 정합성 체크. 데이터 잘못되어 있으면 에러 발생
424
- * @param dataSource
563
+ /**
564
+ * 그리드 데이터 정합성 체크. 데이터 잘못되어 있으면 에러 발생
565
+ * @param dataSource
425
566
  */
426
567
  var checkDataSource = function checkDataSource(dataSource) {
427
568
  var isColumns = dataSource._fields.findIndex(function (field) {
@@ -441,28 +582,31 @@ var DxPlanitTreeGrid = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
441
582
  }
442
583
  };
443
584
 
444
- /**
445
- * 그리드 펼침 정보 세션스토리지 리셋
585
+ /**
586
+ * 그리드 펼침 정보 세션스토리지 리셋
446
587
  */
447
588
  var resetSession = function resetSession() {
448
589
  sessionStorage.removeItem('dx-vera-pivotgrid-storing');
449
590
  };
450
591
 
451
- /**
452
- * 엑셀 export 명령
453
- * @param fileName 저장하고자 하는 엑셀파일명
592
+ /**
593
+ * 엑셀 export 명령
594
+ * @param fileName 저장하고자 하는 엑셀파일명
454
595
  */
455
596
  var exportToExcel = function exportToExcel(fileName) {
456
597
  setTimeout(function () {
457
598
  var _$tableRef$current;
458
- return exportToExcelAction((_$tableRef$current = $tableRef.current) === null || _$tableRef$current === void 0 ? void 0 : _$tableRef$current.instance, fileName);
599
+ return exportToExcelAction(
600
+ (_$tableRef$current = $tableRef.current) === null || _$tableRef$current === void 0 ? void 0 : _$tableRef$current.instance,
601
+ fileName
602
+ );
459
603
  });
460
604
  };
461
605
 
462
- /**
463
- * devextreme component 정보의 dataController의 columnInfo에 사용자가 설정한 groupFIled 정보 병합
464
- * @param component devextreme component
465
- * @returns devextreme component
606
+ /**
607
+ * devextreme component 정보의 dataController의 columnInfo에 사용자가 설정한 groupFIled 정보 병합
608
+ * @param component devextreme component
609
+ * @returns devextreme component
466
610
  */
467
611
  var convertDataControllerColumnsInfo = function convertDataControllerColumnsInfo(component) {
468
612
  var arr = [];
@@ -478,9 +622,9 @@ var DxPlanitTreeGrid = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
478
622
  return component;
479
623
  };
480
624
 
481
- /**
482
- * 엑셀 export
483
- * @param e
625
+ /**
626
+ * 엑셀 export
627
+ * @param e
484
628
  */
485
629
  var exportToExcelAction = function exportToExcelAction(e, fileName) {
486
630
  var newComponent = convertDataControllerColumnsInfo(e);
@@ -496,22 +640,25 @@ var DxPlanitTreeGrid = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
496
640
  bottom: borderStyle,
497
641
  left: borderStyle,
498
642
  right: borderStyle,
499
- top: borderStyle
643
+ top: borderStyle,
500
644
  };
501
- }
645
+ },
502
646
  }).then(function () {
503
647
  workbook.xlsx.writeBuffer().then(function (buffer) {
504
- (0, _fileSaver.default)(new Blob([buffer], {
505
- type: 'application/octet-stream'
506
- }), fileName + '.xlsx');
648
+ (0, _fileSaver.default)(
649
+ new Blob([buffer], {
650
+ type: 'application/octet-stream',
651
+ }),
652
+ fileName + '.xlsx'
653
+ );
507
654
  });
508
655
  });
509
656
  e.cancel = true;
510
657
  };
511
658
 
512
- /**
513
- * devextreme CellPreparedEvent 이벤트 실행
514
- * @param e
659
+ /**
660
+ * devextreme CellPreparedEvent 이벤트 실행
661
+ * @param e
515
662
  */
516
663
  var onCellPreparedChild = function onCellPreparedChild(e) {
517
664
  makeColorAtPercent(e);
@@ -523,8 +670,8 @@ var DxPlanitTreeGrid = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
523
670
  return onCellPrepared ? onCellPrepared(e) : undefined;
524
671
  };
525
672
 
526
- /**
527
- * devextreme Raise Event
673
+ /**
674
+ * devextreme Raise Event
528
675
  */
529
676
  var onContentReadyChild = function onContentReadyChild(e) {
530
677
  setTimeout(function () {
@@ -551,60 +698,77 @@ var DxPlanitTreeGrid = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
551
698
  var onOptionChangedChild = function onOptionChangedChild(e) {
552
699
  return onOptionChanged ? onOptionChanged(e) : undefined;
553
700
  };
554
- (0, _react.useEffect)(function () {
555
- if (customExcelButton) {}
556
- }, [customExcelButton]);
557
- (0, _react.useEffect)(function () {
558
- setGridDataSource(dataSource);
559
- checkDataSource(dataSource);
560
- resetSession();
561
- }, [dataSource]);
562
- return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(_loadPanel.LoadPanel, {
563
- position: {
564
- of: id
565
- }
566
- }), /*#__PURE__*/React.createElement(_pivotGrid.default, {
567
- id: id,
568
- ref: $tableRef,
569
- dataSource: gridDataSource,
570
- showColumnTotals: false,
571
- showColumnGrandTotals: true,
572
- showRowGrandTotals: false,
573
- width: width,
574
- height: height,
575
- allowExpandAll: allowExpandAll,
576
- allowFiltering: allowFiltering,
577
- allowSorting: allowSorting,
578
- allowSortingBySummary: allowSortingBySummary,
579
- dataFieldArea: dataFieldArea,
580
- disabled: disabled,
581
- elementAttr: elementAttr,
582
- encodeHtml: encodeHtml,
583
- hideEmptySummaryCells: hideEmptySummaryCells,
584
- hint: hint,
585
- rowHeaderLayout: rowHeaderLayout,
586
- rtlEnabled: rtlEnabled,
587
- showBorders: showBorders,
588
- showRowTotals: showRowTotals,
589
- showTotalsPrior: showTotalsPrior,
590
- tabIndex: tabIndex,
591
- visible: visible,
592
- wordWrapEnabled: wordWrapEnabled,
593
- onCellClick: onCellClickChild,
594
- onContentReady: onContentReadyChild,
595
- onCellPrepared: onCellPreparedChild,
596
- onContextMenuPreparing: onContextMenuPreparingChild,
597
- onDisposing: onDisposingChild,
598
- onExporting: onExportingChild,
599
- onInitialized: onInitializedChild,
600
- onOptionChanged: onOptionChangedChild
601
- }, /*#__PURE__*/React.createElement(_dataGrid.StateStoring, {
602
- enabled: stateStoringKey === null || stateStoringKey === void 0 ? void 0 : stateStoringKey.length,
603
- type: "sessionStorage",
604
- storageKey: stateStoringKey
605
- }), /*#__PURE__*/React.createElement(_pivotGrid.FieldChooser, {
606
- enabled: false
607
- })));
701
+ (0, _react.useEffect)(
702
+ function () {
703
+ if (customExcelButton) {
704
+ }
705
+ },
706
+ [customExcelButton]
707
+ );
708
+ (0, _react.useEffect)(
709
+ function () {
710
+ setGridDataSource(dataSource);
711
+ checkDataSource(dataSource);
712
+ resetSession();
713
+ },
714
+ [dataSource]
715
+ );
716
+ return /*#__PURE__*/ _react.createElement(
717
+ 'div',
718
+ null,
719
+ /*#__PURE__*/ _react.createElement(_loadPanel.LoadPanel, {
720
+ position: {
721
+ of: id,
722
+ },
723
+ }),
724
+ /*#__PURE__*/ _react.createElement(
725
+ _pivotGrid.default,
726
+ {
727
+ id: id,
728
+ ref: $tableRef,
729
+ dataSource: gridDataSource,
730
+ showColumnTotals: false,
731
+ showColumnGrandTotals: true,
732
+ showRowGrandTotals: false,
733
+ width: width,
734
+ height: height,
735
+ allowExpandAll: allowExpandAll,
736
+ allowFiltering: allowFiltering,
737
+ allowSorting: allowSorting,
738
+ allowSortingBySummary: allowSortingBySummary,
739
+ dataFieldArea: dataFieldArea,
740
+ disabled: disabled,
741
+ elementAttr: elementAttr,
742
+ encodeHtml: encodeHtml,
743
+ hideEmptySummaryCells: hideEmptySummaryCells,
744
+ hint: hint,
745
+ rowHeaderLayout: rowHeaderLayout,
746
+ rtlEnabled: rtlEnabled,
747
+ showBorders: showBorders,
748
+ showRowTotals: showRowTotals,
749
+ showTotalsPrior: showTotalsPrior,
750
+ tabIndex: tabIndex,
751
+ visible: visible,
752
+ wordWrapEnabled: wordWrapEnabled,
753
+ onCellClick: onCellClickChild,
754
+ onContentReady: onContentReadyChild,
755
+ onCellPrepared: onCellPreparedChild,
756
+ onContextMenuPreparing: onContextMenuPreparingChild,
757
+ onDisposing: onDisposingChild,
758
+ onExporting: onExportingChild,
759
+ onInitialized: onInitializedChild,
760
+ onOptionChanged: onOptionChangedChild,
761
+ },
762
+ /*#__PURE__*/ _react.createElement(_dataGrid.StateStoring, {
763
+ enabled: stateStoringKey === null || stateStoringKey === void 0 ? void 0 : stateStoringKey.length,
764
+ type: 'sessionStorage',
765
+ storageKey: stateStoringKey,
766
+ }),
767
+ /*#__PURE__*/ _react.createElement(_pivotGrid.FieldChooser, {
768
+ enabled: false,
769
+ })
770
+ )
771
+ );
608
772
  });
609
773
  var _default = DxPlanitTreeGrid;
610
- exports.default = _default;
774
+ exports.default = _default;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "devextreme-planit-treegrid-react",
3
- "version": "0.2.9",
3
+ "version": "0.3.0",
4
4
  "description": "Devextreme의 DxPivotGrid를 Tree Grid처럼 보여주는 Wrapper입니다.",
5
5
  "main": "dist/index.js",
6
6
  "files": [
@@ -39,6 +39,7 @@
39
39
  ],
40
40
  "dependencies": {
41
41
  "devextreme": "^22.1.6",
42
+ "devextreme-planit-treegrid-react": "^0.2.9",
42
43
  "devextreme-react": "^22.1.6",
43
44
  "exceljs": "^4.3.0",
44
45
  "file-saver": "^2.0.5",