devextreme-planit-treegrid-react 1.1.3 → 1.1.4

Sign up to get free protection for your applications and to get access to all the features.
Files changed (4) hide show
  1. package/dist/DxPlanitTreeGrid.js +189 -349
  2. package/dist/index.d.ts +38 -38
  3. package/package.json +4 -2
  4. package/dist/type.js +0 -5
package/dist/DxPlanitTreeGrid.js CHANGED
@@ -1,150 +1,43 @@
1
- 'use strict';
1
+ "use strict";
2
2
 
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,
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
19
6
  });
20
7
  exports.default = void 0;
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 이벤트 사용하지 않음.
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 이벤트 사용하지 않음.
139
32
  */
140
- /**
141
- * todoList:
142
- * 2) columIndex 초기화 기능이 있어야 함(column 개수 변할 때)
143
- * 3) 헤더에 테이블 삽입되면서 그리드 크기가 늘어남. height에 그리드 크기 늘어난 만큼 반영되어야 함.
33
+ /**
34
+ * todoList:
35
+ * 2) columIndex 초기화 기능이 있어야 함(column 개수 변할 때)
36
+ * 3) 헤더에 테이블 삽입되면서 그리드 크기가 늘어남. height에 그리드 크기 늘어난 만큼 반영되어야 함.
144
37
  */
145
38
 
146
39
  var grandTotalCssNm = 'data-grand-total';
147
- var DxPlanitTreeGrid = /*#__PURE__*/ (0, _react.forwardRef)(function (props, ref) {
40
+ var DxPlanitTreeGrid = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
148
41
  var _props$id = props.id,
149
42
  id = _props$id === void 0 ? 'dx-planit-vera-pivotgrid-id' : _props$id,
150
43
  groupField = props.groupField,
@@ -219,49 +112,39 @@ var DxPlanitTreeGrid = /*#__PURE__*/ (0, _react.forwardRef)(function (props, ref
219
112
  var excelBorder = {
220
113
  style: 'thin',
221
114
  color: {
222
- argb: 'FF7E7E7E',
223
- },
115
+ argb: 'FF7E7E7E'
116
+ }
224
117
  };
225
118
  (0, _react.useImperativeHandle)(ref, function () {
226
119
  return {
227
- exportToExcel: exportToExcel,
120
+ exportToExcel: exportToExcel
228
121
  };
229
122
  });
230
123
 
231
- /**
232
- * 그리드 사이즈 재조정
233
- * @returns 그리드 사이즈
124
+ /**
125
+ * 그리드 사이즈 재조정
126
+ * @returns 그리드 사이즈
234
127
  */
235
128
  var getGridSize = function getGridSize() {
236
129
  var _wrapper$clientWidth;
237
130
  var wrapper = document.querySelector('.diag-table-wrapper');
238
131
  var gap = 10;
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
- );
132
+ setWidth((_wrapper$clientWidth = wrapper === null || wrapper === void 0 ? void 0 : wrapper.clientWidth) !== null && _wrapper$clientWidth !== void 0 ? _wrapper$clientWidth : 0);
245
133
  setHeight(wrapper ? wrapper.clientHeight - gap : 0);
246
134
  window.addEventListener('resize', function () {
247
135
  var _wrapper$clientWidth2;
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
- );
136
+ setWidth((_wrapper$clientWidth2 = wrapper === null || wrapper === void 0 ? void 0 : wrapper.clientWidth) !== null && _wrapper$clientWidth2 !== void 0 ? _wrapper$clientWidth2 : 0);
254
137
  setHeight(wrapper ? wrapper.clientHeight - gap : 0);
255
138
  });
256
139
  return {
257
140
  width: width,
258
- height: height,
141
+ height: height
259
142
  };
260
143
  };
261
144
 
262
- /**
263
- * 'Total' 을 한글로 변경
264
- * @param e devextreme CellPreparedEvent
145
+ /**
146
+ * 'Total' 을 한글로 변경
147
+ * @param e devextreme CellPreparedEvent
265
148
  */
266
149
  var changeTotalText = function changeTotalText(e) {
267
150
  var _e$cell;
@@ -271,13 +154,13 @@ var DxPlanitTreeGrid = /*#__PURE__*/ (0, _react.forwardRef)(function (props, ref
271
154
  if (((_e$cell = e.cell) === null || _e$cell === void 0 ? void 0 : _e$cell.type) === 'T') {
272
155
  var _e$cell$text;
273
156
  var text = (_e$cell$text = e.cell.text) === null || _e$cell$text === void 0 ? void 0 : _e$cell$text.replace('Total', '합계');
274
- e.cellElement.innerHTML = '<span>'.concat(text, '</span>');
157
+ e.cellElement.innerHTML = "<span>".concat(text, "</span>");
275
158
  }
276
159
  };
277
160
 
278
- /**
279
- * null값을 하이픈으로 모두 변경
280
- * @param e devextreme CellPreparedEvent
161
+ /**
162
+ * null값을 하이픈으로 모두 변경
163
+ * @param e devextreme CellPreparedEvent
281
164
  */
282
165
  var changeNullToHipen = function changeNullToHipen(e) {
283
166
  var _e$cell2;
@@ -289,30 +172,24 @@ var DxPlanitTreeGrid = /*#__PURE__*/ (0, _react.forwardRef)(function (props, ref
289
172
  }
290
173
  };
291
174
 
292
- /**
293
- * '0', '0.0%' 를 하이픈으로 모두 변경
294
- * @param e devextreme CellPreparedEvent
175
+ /**
176
+ * '0', '0.0%' 를 하이픈으로 모두 변경
177
+ * @param e devextreme CellPreparedEvent
295
178
  */
296
179
  var changeZeroToHipen = function changeZeroToHipen(e) {
297
180
  var _e$cell3, _e$cell4, _e$cell5;
298
181
  if (!convertZeroToHipen) {
299
182
  return;
300
183
  }
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
- ) {
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) {
308
185
  e.cellElement.innerHTML = '<span class="text-color">-</span>';
309
186
  }
310
187
  };
311
188
 
312
- /**
313
- * 테이블 헤더에 colspan, rowspan 한 HTMLElement 정보 반환
314
- * @param groupField 사용자가 작성한 그룹 정보
315
- * @return
189
+ /**
190
+ * 테이블 헤더에 colspan, rowspan 한 HTMLElement 정보 반환
191
+ * @param groupField 사용자가 작성한 그룹 정보
192
+ * @return
316
193
  */
317
194
  var makeColspan = function makeColspan(group, index, isLast) {
318
195
  var _group$html;
@@ -327,33 +204,31 @@ var DxPlanitTreeGrid = /*#__PURE__*/ (0, _react.forwardRef)(function (props, ref
327
204
  } else if (!isLast && index === 0) {
328
205
  td.setAttribute('style', 'border-bottom: 0');
329
206
  }
330
- td.innerHTML = '<span>'.concat(text, '</span>');
207
+ td.innerHTML = "<span>".concat(text, "</span>");
331
208
  return td;
332
209
  };
333
210
 
334
- /**
335
- * 그룹 필드 데이터 유효성 검증용 데이터 생성
336
- * @param groupField
337
- * @returns
211
+ /**
212
+ * 그룹 필드 데이터 유효성 검증용 데이터 생성
213
+ * @param groupField
214
+ * @returns
338
215
  */
339
216
  var makeCheckGroupData = function makeCheckGroupData(groupField) {
340
217
  var data = {};
341
- groupField === null || groupField === void 0
342
- ? void 0
343
- : groupField.forEach(function (group) {
344
- if (data[group.depth]) {
345
- data[group.depth] += group.colspan;
346
- } else {
347
- data[group.depth] = group.colspan;
348
- }
349
- });
218
+ groupField === null || groupField === void 0 ? void 0 : groupField.forEach(function (group) {
219
+ if (data[group.depth]) {
220
+ data[group.depth] += group.colspan;
221
+ } else {
222
+ data[group.depth] = group.colspan;
223
+ }
224
+ });
350
225
  return data;
351
226
  };
352
227
 
353
- /**
354
- * GroupField 데이터 검증
355
- * @param 사용자가 설정한 그룹 필드 정보
356
- * @returns 데이터 검증 결과
228
+ /**
229
+ * GroupField 데이터 검증
230
+ * @param 사용자가 설정한 그룹 필드 정보
231
+ * @returns 데이터 검증 결과
357
232
  */
358
233
  var isCheckGroupField = function isCheckGroupField(groupField) {
359
234
  var map = makeCheckGroupData(groupField);
@@ -366,25 +241,21 @@ var DxPlanitTreeGrid = /*#__PURE__*/ (0, _react.forwardRef)(function (props, ref
366
241
  return true;
367
242
  };
368
243
 
369
- /**
370
- * Grand Total 셀 정보 저장
371
- * @param e
244
+ /**
245
+ * Grand Total 셀 정보 저장
246
+ * @param e
372
247
  */
373
248
  var setTotalElementInfo = function setTotalElementInfo(e) {
374
249
  var _e$cell6, _e$cell7, _e$cellElement;
375
- if (
376
- !(groupField !== null && groupField !== void 0 && groupField.length) ||
377
- ((_e$cell6 = e.cell) === null || _e$cell6 === void 0 ? void 0 : _e$cell6.type) !== 'GT' ||
378
- ((_e$cell7 = e.cell) === null || _e$cell7 === void 0 ? void 0 : _e$cell7.text) !== 'Grand Total'
379
- ) {
250
+ 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') {
380
251
  return;
381
252
  }
382
253
  (_e$cellElement = e.cellElement) === null || _e$cellElement === void 0 ? void 0 : _e$cellElement.classList.add(grandTotalCssNm);
383
254
  };
384
255
 
385
- /**
386
- * cell의 columnIndex 최대값 저장
387
- * @param e
256
+ /**
257
+ * cell의 columnIndex 최대값 저장
258
+ * @param e
388
259
  */
389
260
  var setMaxColumIndex = function setMaxColumIndex(e) {
390
261
  if (!e.columnIndex) {
@@ -395,19 +266,17 @@ var DxPlanitTreeGrid = /*#__PURE__*/ (0, _react.forwardRef)(function (props, ref
395
266
  }
396
267
  };
397
268
 
398
- /**
399
- * groupField depth의 유니크한 배열 구하기
400
- * @param group
401
- * @param arr
402
- * @returns
269
+ /**
270
+ * groupField depth의 유니크한 배열 구하기
271
+ * @param group
272
+ * @param arr
273
+ * @returns
403
274
  */
404
275
  var getGroupDepth = function getGroupDepth(group, arr) {
405
276
  var groupData = group.slice();
406
- var set = new Set(
407
- groupData.map(function (group) {
408
- return group.depth;
409
- })
410
- );
277
+ var set = new Set(groupData.map(function (group) {
278
+ return group.depth;
279
+ }));
411
280
  return Array.from(set).sort(function compare(a, b) {
412
281
  if (a > b) {
413
282
  return arr === 'asc' ? -1 : 1;
@@ -419,11 +288,11 @@ var DxPlanitTreeGrid = /*#__PURE__*/ (0, _react.forwardRef)(function (props, ref
419
288
  });
420
289
  };
421
290
 
422
- /**
423
- * 현재 depth에 맞는 그룹 필드 정보 반환
424
- * @param group
425
- * @param depth
426
- * @returns
291
+ /**
292
+ * 현재 depth에 맞는 그룹 필드 정보 반환
293
+ * @param group
294
+ * @param depth
295
+ * @returns
427
296
  */
428
297
  var getCurrentGroup = function getCurrentGroup(group, depth) {
429
298
  return group.filter(function (gr) {
@@ -431,8 +300,8 @@ var DxPlanitTreeGrid = /*#__PURE__*/ (0, _react.forwardRef)(function (props, ref
431
300
  });
432
301
  };
433
302
 
434
- /**
435
- * 테이블 헤더(DOM)에 colspan 적용된 테이블 삽입
303
+ /**
304
+ * 테이블 헤더(DOM)에 colspan 적용된 테이블 삽입
436
305
  */
437
306
  var insertRowHeaderGroup = function insertRowHeaderGroup() {
438
307
  var _thead$previousSiblin;
@@ -452,10 +321,7 @@ var DxPlanitTreeGrid = /*#__PURE__*/ (0, _react.forwardRef)(function (props, ref
452
321
  }
453
322
  totalElement.innerHTML = '';
454
323
  totalElement.setAttribute('style', 'padding: 0; border: 0');
455
- var colgroup =
456
- (_thead$previousSiblin = thead.previousSibling) === null || _thead$previousSiblin === void 0
457
- ? void 0
458
- : _thead$previousSiblin.cloneNode(true);
324
+ var colgroup = (_thead$previousSiblin = thead.previousSibling) === null || _thead$previousSiblin === void 0 ? void 0 : _thead$previousSiblin.cloneNode(true);
459
325
  var groupData = groupField.slice();
460
326
  var depth = getGroupDepth(groupData, 'asc');
461
327
  var table = document.createElement('table');
@@ -472,10 +338,10 @@ var DxPlanitTreeGrid = /*#__PURE__*/ (0, _react.forwardRef)(function (props, ref
472
338
  totalElement.appendChild(table);
473
339
  };
474
340
 
475
- /**
476
- * Devextreme의 dateController columnInfo에 그룹 정보 삽입
477
- * @param group
478
- * @returns
341
+ /**
342
+ * Devextreme의 dateController columnInfo에 그룹 정보 삽입
343
+ * @param group
344
+ * @returns
479
345
  */
480
346
  var makeDataControllerColumnGroup = function makeDataControllerColumnGroup(group) {
481
347
  var groupData = group.slice();
@@ -486,21 +352,21 @@ var DxPlanitTreeGrid = /*#__PURE__*/ (0, _react.forwardRef)(function (props, ref
486
352
  return {
487
353
  colspan: group.colspan,
488
354
  text: group.groupCaption,
489
- type: 'GT',
355
+ type: 'GT'
490
356
  };
491
357
  });
492
358
  });
493
359
  };
494
360
 
495
- /**
496
- * 사용자가 입력한 컬러 조건을 { standard: string; condition: string } 형식으로 변경 반환
497
- * @param condition 사용자 입력 컬러 조건식 ex) '>= 100'
498
- * @returns
361
+ /**
362
+ * 사용자가 입력한 컬러 조건을 { standard: string; condition: string } 형식으로 변경 반환
363
+ * @param condition 사용자 입력 컬러 조건식 ex) '>= 100'
364
+ * @returns
499
365
  */
500
366
  var makeSplitCondtion = function makeSplitCondtion(condition) {
501
367
  var newCondition = {
502
368
  standard: '',
503
- condition: '',
369
+ condition: ''
504
370
  };
505
371
  _toConsumableArray(condition).forEach(function (cond) {
506
372
  if (Number.isNaN(parseFloat(cond))) {
@@ -512,10 +378,10 @@ var DxPlanitTreeGrid = /*#__PURE__*/ (0, _react.forwardRef)(function (props, ref
512
378
  return newCondition;
513
379
  };
514
380
 
515
- /**
516
- * 데이터에 색상 적용
517
- * @param e onCellPrepared 이벤트
518
- * @returns
381
+ /**
382
+ * 데이터에 색상 적용
383
+ * @param e onCellPrepared 이벤트
384
+ * @returns
519
385
  */
520
386
  var makeColorAtPercent = function makeColorAtPercent(e) {
521
387
  if (!dataColor || !e.cellElement) {
@@ -526,14 +392,7 @@ var DxPlanitTreeGrid = /*#__PURE__*/ (0, _react.forwardRef)(function (props, ref
526
392
  if (e.cell.value === null) {
527
393
  return;
528
394
  }
529
- if (
530
- ((_e$cell8 = e.cell) === null || _e$cell8 === void 0
531
- ? void 0
532
- : (_e$cell8$format = _e$cell8.format) === null || _e$cell8$format === void 0
533
- ? void 0
534
- : _e$cell8$format.type) === color.format &&
535
- !Number.isNaN(e.cell.value)
536
- ) {
395
+ 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)) {
537
396
  var standardData = makeSplitCondtion(color.condition.replace(/(\s*)/g, ''));
538
397
  var rate = color.format === 'percent' ? 0.01 : 1;
539
398
  var condition = false;
@@ -558,9 +417,9 @@ var DxPlanitTreeGrid = /*#__PURE__*/ (0, _react.forwardRef)(function (props, ref
558
417
  });
559
418
  };
560
419
 
561
- /**
562
- * 그리드 데이터 정합성 체크. 데이터 잘못되어 있으면 에러 발생
563
- * @param dataSource
420
+ /**
421
+ * 그리드 데이터 정합성 체크. 데이터 잘못되어 있으면 에러 발생
422
+ * @param dataSource
564
423
  */
565
424
  var checkDataSource = function checkDataSource(dataSource) {
566
425
  var isColumns = dataSource._fields.findIndex(function (field) {
@@ -580,31 +439,28 @@ var DxPlanitTreeGrid = /*#__PURE__*/ (0, _react.forwardRef)(function (props, ref
580
439
  }
581
440
  };
582
441
 
583
- /**
584
- * 그리드 펼침 정보 세션스토리지 리셋
442
+ /**
443
+ * 그리드 펼침 정보 세션스토리지 리셋
585
444
  */
586
445
  var resetSession = function resetSession() {
587
446
  sessionStorage.removeItem('dx-vera-pivotgrid-storing');
588
447
  };
589
448
 
590
- /**
591
- * 엑셀 export 명령
592
- * @param fileName 저장하고자 하는 엑셀파일명
449
+ /**
450
+ * 엑셀 export 명령
451
+ * @param fileName 저장하고자 하는 엑셀파일명
593
452
  */
594
453
  var exportToExcel = function exportToExcel(fileName) {
595
454
  setTimeout(function () {
596
455
  var _$tableRef$current;
597
- return exportToExcelAction(
598
- (_$tableRef$current = $tableRef.current) === null || _$tableRef$current === void 0 ? void 0 : _$tableRef$current.instance,
599
- fileName
600
- );
456
+ return exportToExcelAction((_$tableRef$current = $tableRef.current) === null || _$tableRef$current === void 0 ? void 0 : _$tableRef$current.instance, fileName);
601
457
  });
602
458
  };
603
459
 
604
- /**
605
- * devextreme component 정보의 dataController의 columnInfo에 사용자가 설정한 groupFIled 정보 병합
606
- * @param component devextreme component
607
- * @returns devextreme component
460
+ /**
461
+ * devextreme component 정보의 dataController의 columnInfo에 사용자가 설정한 groupFIled 정보 병합
462
+ * @param component devextreme component
463
+ * @returns devextreme component
608
464
  */
609
465
  var convertDataControllerColumnsInfo = function convertDataControllerColumnsInfo(component) {
610
466
  var arr = [];
@@ -620,9 +476,9 @@ var DxPlanitTreeGrid = /*#__PURE__*/ (0, _react.forwardRef)(function (props, ref
620
476
  return component;
621
477
  };
622
478
 
623
- /**
624
- * 엑셀 export
625
- * @param e
479
+ /**
480
+ * 엑셀 export
481
+ * @param e
626
482
  */
627
483
  var exportToExcelAction = function exportToExcelAction(e, fileName) {
628
484
  var newComponent = convertDataControllerColumnsInfo(e);
@@ -638,25 +494,22 @@ var DxPlanitTreeGrid = /*#__PURE__*/ (0, _react.forwardRef)(function (props, ref
638
494
  bottom: borderStyle,
639
495
  left: borderStyle,
640
496
  right: borderStyle,
641
- top: borderStyle,
497
+ top: borderStyle
642
498
  };
643
- },
499
+ }
644
500
  }).then(function () {
645
501
  workbook.xlsx.writeBuffer().then(function (buffer) {
646
- (0, _fileSaver.default)(
647
- new Blob([buffer], {
648
- type: 'application/octet-stream',
649
- }),
650
- fileName + '.xlsx'
651
- );
502
+ (0, _fileSaver.default)(new Blob([buffer], {
503
+ type: 'application/octet-stream'
504
+ }), fileName + '.xlsx');
652
505
  });
653
506
  });
654
507
  e.cancel = true;
655
508
  };
656
509
 
657
- /**
658
- * devextreme CellPreparedEvent 이벤트 실행
659
- * @param e
510
+ /**
511
+ * devextreme CellPreparedEvent 이벤트 실행
512
+ * @param e
660
513
  */
661
514
  var onCellPreparedChild = function onCellPreparedChild(e) {
662
515
  makeColorAtPercent(e);
@@ -668,8 +521,8 @@ var DxPlanitTreeGrid = /*#__PURE__*/ (0, _react.forwardRef)(function (props, ref
668
521
  return onCellPrepared ? onCellPrepared(e) : undefined;
669
522
  };
670
523
 
671
- /**
672
- * devextreme Raise Event
524
+ /**
525
+ * devextreme Raise Event
673
526
  */
674
527
  var onContentReadyChild = function onContentReadyChild(e) {
675
528
  setTimeout(function () {
@@ -696,70 +549,57 @@ var DxPlanitTreeGrid = /*#__PURE__*/ (0, _react.forwardRef)(function (props, ref
696
549
  var onOptionChangedChild = function onOptionChangedChild(e) {
697
550
  return onOptionChanged ? onOptionChanged(e) : undefined;
698
551
  };
699
- (0, _react.useEffect)(
700
- function () {
701
- setGridDataSource(dataSource);
702
- checkDataSource(dataSource);
703
- resetSession();
704
- },
705
- [dataSource]
706
- );
707
- return /*#__PURE__*/ _react.createElement(
708
- 'div',
709
- null,
710
- /*#__PURE__*/ _react.createElement(_loadPanel.LoadPanel, {
711
- position: {
712
- of: id,
713
- },
714
- }),
715
- /*#__PURE__*/ _react.createElement(
716
- _pivotGrid.default,
717
- {
718
- id: id,
719
- ref: $tableRef,
720
- dataSource: gridDataSource,
721
- showColumnTotals: false,
722
- showColumnGrandTotals: true,
723
- showRowGrandTotals: false,
724
- width: width,
725
- height: height,
726
- allowExpandAll: allowExpandAll,
727
- allowFiltering: allowFiltering,
728
- allowSorting: allowSorting,
729
- allowSortingBySummary: allowSortingBySummary,
730
- dataFieldArea: dataFieldArea,
731
- disabled: disabled,
732
- elementAttr: elementAttr,
733
- encodeHtml: encodeHtml,
734
- hideEmptySummaryCells: hideEmptySummaryCells,
735
- hint: hint,
736
- rowHeaderLayout: rowHeaderLayout,
737
- rtlEnabled: rtlEnabled,
738
- showBorders: showBorders,
739
- showRowTotals: showRowTotals,
740
- showTotalsPrior: showTotalsPrior,
741
- tabIndex: tabIndex,
742
- visible: visible,
743
- wordWrapEnabled: wordWrapEnabled,
744
- onCellClick: onCellClickChild,
745
- onContentReady: onContentReadyChild,
746
- onCellPrepared: onCellPreparedChild,
747
- onContextMenuPreparing: onContextMenuPreparingChild,
748
- onDisposing: onDisposingChild,
749
- onExporting: onExportingChild,
750
- onInitialized: onInitializedChild,
751
- onOptionChanged: onOptionChangedChild,
752
- },
753
- /*#__PURE__*/ _react.createElement(_dataGrid.StateStoring, {
754
- enabled: stateStoringKey === null || stateStoringKey === void 0 ? void 0 : stateStoringKey.length,
755
- type: 'sessionStorage',
756
- storageKey: stateStoringKey,
757
- }),
758
- /*#__PURE__*/ _react.createElement(_pivotGrid.FieldChooser, {
759
- enabled: false,
760
- })
761
- )
762
- );
552
+ (0, _react.useEffect)(function () {
553
+ setGridDataSource(dataSource);
554
+ checkDataSource(dataSource);
555
+ resetSession();
556
+ }, [dataSource]);
557
+ return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(_loadPanel.LoadPanel, {
558
+ position: {
559
+ of: id
560
+ }
561
+ }), /*#__PURE__*/React.createElement(_pivotGrid.default, {
562
+ id: id,
563
+ ref: $tableRef,
564
+ dataSource: gridDataSource,
565
+ showColumnTotals: false,
566
+ showColumnGrandTotals: true,
567
+ showRowGrandTotals: false,
568
+ width: width,
569
+ height: height,
570
+ allowExpandAll: allowExpandAll,
571
+ allowFiltering: allowFiltering,
572
+ allowSorting: allowSorting,
573
+ allowSortingBySummary: allowSortingBySummary,
574
+ dataFieldArea: dataFieldArea,
575
+ disabled: disabled,
576
+ elementAttr: elementAttr,
577
+ encodeHtml: encodeHtml,
578
+ hideEmptySummaryCells: hideEmptySummaryCells,
579
+ hint: hint,
580
+ rowHeaderLayout: rowHeaderLayout,
581
+ rtlEnabled: rtlEnabled,
582
+ showBorders: showBorders,
583
+ showRowTotals: showRowTotals,
584
+ showTotalsPrior: showTotalsPrior,
585
+ tabIndex: tabIndex,
586
+ visible: visible,
587
+ wordWrapEnabled: wordWrapEnabled,
588
+ onCellClick: onCellClickChild,
589
+ onContentReady: onContentReadyChild,
590
+ onCellPrepared: onCellPreparedChild,
591
+ onContextMenuPreparing: onContextMenuPreparingChild,
592
+ onDisposing: onDisposingChild,
593
+ onExporting: onExportingChild,
594
+ onInitialized: onInitializedChild,
595
+ onOptionChanged: onOptionChangedChild
596
+ }, /*#__PURE__*/React.createElement(_dataGrid.StateStoring, {
597
+ enabled: stateStoringKey === null || stateStoringKey === void 0 ? void 0 : stateStoringKey.length,
598
+ type: "sessionStorage",
599
+ storageKey: stateStoringKey
600
+ }), /*#__PURE__*/React.createElement(_pivotGrid.FieldChooser, {
601
+ enabled: false
602
+ })));
763
603
  });
764
604
  var _default = DxPlanitTreeGrid;
765
- exports.default = _default;
605
+ exports.default = _default;
package/dist/index.d.ts CHANGED
@@ -1,38 +1,38 @@
1
- import DevExpress from 'devextreme';
2
- import { Format } from 'devextreme/localization';
3
-
4
- export declare const DxPlanitTreeGrid;
5
- export default DxPlanitTreeGrid;
6
-
7
- export declare module TypeDxPlanit {
8
- export interface IGroupField {
9
- groupCaption: string;
10
- groupName?: string;
11
- html?: string;
12
- depth: number;
13
- colspan: number;
14
- }
15
-
16
- export interface ColumnField {
17
- colspan: number;
18
- text: string;
19
- type: string;
20
- }
21
-
22
- export interface IColorInfo {
23
- format: Format;
24
- color: string;
25
- condition: string;
26
- }
27
-
28
- export interface Props extends DevExpress.ui.dxPivotGrid.Properties {
29
- id?: string;
30
- dataSource?: any;
31
- groupField?: IGroupField[];
32
- dataColor?: IColorInfo[];
33
- convertNullToHipen?: boolean;
34
- convertZeroToHipen?: boolean;
35
- stateStoringKey?: string;
36
- customExcelButton?: boolean;
37
- }
38
- }
1
+ import DevExpress from 'devextreme';
2
+ import { Format } from 'devextreme/localization';
3
+
4
+ export declare const DxPlanitTreeGrid;
5
+ export default DxPlanitTreeGrid;
6
+
7
+ export declare module TypeDxPlanit {
8
+ export interface IGroupField {
9
+ groupCaption: string;
10
+ groupName?: string;
11
+ html?: string;
12
+ depth: number;
13
+ colspan: number;
14
+ }
15
+
16
+ export interface ColumnField {
17
+ colspan: number;
18
+ text: string;
19
+ type: string;
20
+ }
21
+
22
+ export interface IColorInfo {
23
+ format: Format;
24
+ color: string;
25
+ condition: string;
26
+ }
27
+
28
+ export interface Props extends DevExpress.ui.dxPivotGrid.Properties {
29
+ id?: string;
30
+ dataSource?: any;
31
+ groupField?: IGroupField[];
32
+ dataColor?: IColorInfo[];
33
+ convertNullToHipen?: boolean;
34
+ convertZeroToHipen?: boolean;
35
+ stateStoringKey?: string;
36
+ customExcelButton?: boolean;
37
+ }
38
+ }
package/package.json CHANGED
@@ -1,11 +1,13 @@
1
1
  {
2
2
  "name": "devextreme-planit-treegrid-react",
3
- "version": "1.1.3",
3
+ "version": "1.1.4",
4
4
  "description": "Devextreme의 DxPivotGrid를 Tree Grid처럼 보여주는 Wrapper입니다.",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",
7
7
  "files": [
8
- "dist",
8
+ "dist/DxPlanitTreeGrid.js",
9
+ "dist/index.d.ts",
10
+ "dist/index.js",
9
11
  "README.md"
10
12
  ],
11
13
  "repository": "https://github.com/hsquare-analytics/ui-tree-grid.git",
package/dist/type.js DELETED
@@ -1,5 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });