nillud-data-table 1.0.3 → 1.0.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +12 -8
- package/dist/index.js +254 -11
- package/package.json +8 -11
- package/dist/ExportSection-ZYOK6KMB.js +0 -247
package/README.md
CHANGED
@@ -434,19 +434,23 @@ excelCustomColumns={[
|
|
434
434
|
|
435
435
|
Для использования модуля Excel необходимо установить библиотеку [exceljs](https://www.npmjs.com/package/exceljs)
|
436
436
|
|
437
|
-
|
438
|
-
|
439
|
-
|
440
|
-
|
437
|
+
```bash
|
438
|
+
npm i exceljs
|
439
|
+
-или-
|
440
|
+
yarn add exceljs
|
441
|
+
```
|
441
442
|
|
442
443
|
### wordBtn
|
443
444
|
|
444
445
|
Необязательный параметр. Тип **boolean**, по умолчанию **false**. При значении **true** над таблицей с правой стороны появляется кнопка экспорта Word, которая по умолчанию принимает в себя исходный массив **tableData**
|
445
446
|
|
446
|
-
Для использования модуля
|
447
|
-
|
448
|
-
|
449
|
-
|
447
|
+
Для использования модуля Word необходимо установить библиотеки [docx](https://www.npmjs.com/package/docx) и [file-saver](https://www.npmjs.com/package/file-saver)
|
448
|
+
|
449
|
+
```bash
|
450
|
+
npm i docx file-saver
|
451
|
+
-или-
|
452
|
+
yarn add docx file-saver
|
453
|
+
```
|
450
454
|
|
451
455
|
### wordOptions
|
452
456
|
|
package/dist/index.js
CHANGED
@@ -1,5 +1,5 @@
|
|
1
1
|
// components/DataTable.tsx
|
2
|
-
import
|
2
|
+
import { useImperativeHandle, useEffect as useEffect2, useState, useCallback, useMemo as useMemo2, forwardRef } from "react";
|
3
3
|
|
4
4
|
// components/TableHeader.tsx
|
5
5
|
import React from "react";
|
@@ -393,9 +393,252 @@ function useDebouncedEffect(callback, deps, delay) {
|
|
393
393
|
}, [...deps, delay]);
|
394
394
|
}
|
395
395
|
|
396
|
+
// utils/exportUtils/ExportHelpers.ts
|
397
|
+
function prepareExportRows(columns, data) {
|
398
|
+
return data.map(
|
399
|
+
(row) => columns.map((col) => {
|
400
|
+
const value = row[col.field];
|
401
|
+
return typeof col.exportCustomCell !== "undefined" ? col.exportCustomCell(String(value), row) : String(value != null ? value : "");
|
402
|
+
})
|
403
|
+
);
|
404
|
+
}
|
405
|
+
function prepareExportHeaders(columns) {
|
406
|
+
return columns.map((col) => col.title);
|
407
|
+
}
|
408
|
+
|
409
|
+
// components/export/WordExport.tsx
|
410
|
+
import { jsx as jsx13 } from "react/jsx-runtime";
|
411
|
+
var WordExport = ({
|
412
|
+
wordData,
|
413
|
+
columns,
|
414
|
+
title,
|
415
|
+
options = {
|
416
|
+
fontSize: 20,
|
417
|
+
boldHeaders: false,
|
418
|
+
autoLandscape: false,
|
419
|
+
maxColumnsBeforeLandscape: 5
|
420
|
+
}
|
421
|
+
// exportCustomColumns
|
422
|
+
}) => {
|
423
|
+
const createNewWord = async () => {
|
424
|
+
const {
|
425
|
+
AlignmentType,
|
426
|
+
Document,
|
427
|
+
Packer,
|
428
|
+
PageOrientation,
|
429
|
+
// PageOrientation,
|
430
|
+
Paragraph,
|
431
|
+
Table,
|
432
|
+
TableCell,
|
433
|
+
TableRow,
|
434
|
+
TextRun,
|
435
|
+
VerticalAlign,
|
436
|
+
WidthType
|
437
|
+
} = await import("docx");
|
438
|
+
const { saveAs } = await import("file-saver");
|
439
|
+
const {
|
440
|
+
fontSize = 0,
|
441
|
+
boldHeaders = true,
|
442
|
+
autoLandscape = true,
|
443
|
+
maxColumnsBeforeLandscape = 5
|
444
|
+
} = options;
|
445
|
+
const isLandscape = autoLandscape && columns.length > maxColumnsBeforeLandscape;
|
446
|
+
const headerCells = prepareExportHeaders(columns).map((header) => new TableCell({
|
447
|
+
children: [new Paragraph({
|
448
|
+
children: [new TextRun({
|
449
|
+
text: header,
|
450
|
+
size: fontSize,
|
451
|
+
bold: boldHeaders
|
452
|
+
})],
|
453
|
+
alignment: AlignmentType.CENTER
|
454
|
+
})],
|
455
|
+
verticalAlign: VerticalAlign.CENTER
|
456
|
+
}));
|
457
|
+
const tableHeaderRow = new TableRow({ children: headerCells });
|
458
|
+
const rows = prepareExportRows(columns, wordData).map((cells) => {
|
459
|
+
const rowCells = cells.map(
|
460
|
+
(value) => new TableCell({
|
461
|
+
children: [new Paragraph({
|
462
|
+
children: [new TextRun({
|
463
|
+
text: value,
|
464
|
+
size: fontSize
|
465
|
+
})],
|
466
|
+
alignment: AlignmentType.CENTER
|
467
|
+
})],
|
468
|
+
verticalAlign: VerticalAlign.CENTER
|
469
|
+
})
|
470
|
+
);
|
471
|
+
return new TableRow({ children: rowCells });
|
472
|
+
});
|
473
|
+
const table = new Table({
|
474
|
+
rows: [tableHeaderRow, ...rows],
|
475
|
+
width: { size: 11e3, type: WidthType.DXA },
|
476
|
+
indent: { size: -1e3, type: WidthType.DXA }
|
477
|
+
});
|
478
|
+
const doc = new Document({
|
479
|
+
sections: [{
|
480
|
+
children: [table, new Paragraph({ text: "" })],
|
481
|
+
properties: isLandscape ? { page: { size: { orientation: PageOrientation.LANDSCAPE } } } : {}
|
482
|
+
}]
|
483
|
+
});
|
484
|
+
Packer.toBlob(doc).then((blob) => {
|
485
|
+
saveAs(blob, `${title}.docx`);
|
486
|
+
});
|
487
|
+
};
|
488
|
+
return /* @__PURE__ */ jsx13("button", { className: `ndt-buttonExport ndt-Word}`, onClick: createNewWord, children: "\u0421\u043A\u0430\u0447\u0430\u0442\u044C Word" });
|
489
|
+
};
|
490
|
+
var WordExport_default = WordExport;
|
491
|
+
|
492
|
+
// utils/exportUtils/exportUtils.ts
|
493
|
+
var generateExcelColumns = (columns, exportCustomColumns) => {
|
494
|
+
let excelColumns = columns.map((column) => ({
|
495
|
+
header: column.title,
|
496
|
+
key: column.field,
|
497
|
+
width: 20
|
498
|
+
}));
|
499
|
+
if (exportCustomColumns) {
|
500
|
+
exportCustomColumns.forEach((custom) => {
|
501
|
+
excelColumns = excelColumns.map(
|
502
|
+
(col) => col.key === custom.key ? { ...col, ...custom } : col
|
503
|
+
);
|
504
|
+
});
|
505
|
+
}
|
506
|
+
return excelColumns;
|
507
|
+
};
|
508
|
+
var applyHeaderStyles = (row, columnCount) => {
|
509
|
+
row.height = 40;
|
510
|
+
row.font = { size: 12, bold: true };
|
511
|
+
row.alignment = { vertical: "middle", horizontal: "center" };
|
512
|
+
for (let i = 1; i <= columnCount; i++) {
|
513
|
+
const cell = row.getCell(i);
|
514
|
+
cell.alignment = { wrapText: true, vertical: "middle", horizontal: "center" };
|
515
|
+
cell.border = {
|
516
|
+
top: { style: "thin" },
|
517
|
+
left: { style: "thin" },
|
518
|
+
bottom: { style: "thin" },
|
519
|
+
right: { style: "thin" }
|
520
|
+
};
|
521
|
+
}
|
522
|
+
};
|
523
|
+
var applyRowStyles = (row, columnCount) => {
|
524
|
+
row.height = 40;
|
525
|
+
row.font = { size: 12 };
|
526
|
+
row.alignment = { vertical: "middle", horizontal: "center" };
|
527
|
+
for (let i = 1; i <= columnCount; i++) {
|
528
|
+
const cell = row.getCell(i);
|
529
|
+
cell.alignment = { wrapText: true, vertical: "middle", horizontal: "center" };
|
530
|
+
cell.border = {
|
531
|
+
top: { style: "thin" },
|
532
|
+
left: { style: "thin" },
|
533
|
+
bottom: { style: "thin" },
|
534
|
+
right: { style: "thin" }
|
535
|
+
};
|
536
|
+
}
|
537
|
+
};
|
538
|
+
var generateExcelDataRows = (columns, data) => {
|
539
|
+
return data.map((element) => {
|
540
|
+
const rowData = {};
|
541
|
+
columns.forEach((col) => {
|
542
|
+
const value = element[col.field];
|
543
|
+
rowData[col.field] = typeof col.exportCustomCell !== "undefined" ? col.exportCustomCell(String(value), element) : value != null ? value : "";
|
544
|
+
});
|
545
|
+
return rowData;
|
546
|
+
});
|
547
|
+
};
|
548
|
+
var setColumnAutoWidths = (sheet) => {
|
549
|
+
var _a;
|
550
|
+
(_a = sheet.columns) == null ? void 0 : _a.forEach((column) => {
|
551
|
+
var _a2;
|
552
|
+
let maxLength = 10;
|
553
|
+
(_a2 = column.eachCell) == null ? void 0 : _a2.call(column, { includeEmpty: true }, (cell) => {
|
554
|
+
const cellValue = cell.value ? String(cell.value) : "";
|
555
|
+
maxLength = Math.max(maxLength, cellValue.length + 5);
|
556
|
+
});
|
557
|
+
column.width = maxLength;
|
558
|
+
});
|
559
|
+
};
|
560
|
+
|
561
|
+
// components/export/ExportExcel.tsx
|
562
|
+
import { jsx as jsx14 } from "react/jsx-runtime";
|
563
|
+
var ExportExcel = ({ columns, excelData, title, exportCustomColumns }) => {
|
564
|
+
const exportExcel = async () => {
|
565
|
+
const ExcelJS = await import("exceljs");
|
566
|
+
const workbook = new ExcelJS.Workbook();
|
567
|
+
const sheet = workbook.addWorksheet(title, {
|
568
|
+
pageSetup: {
|
569
|
+
fitToPage: true,
|
570
|
+
fitToHeight: 2,
|
571
|
+
fitToWidth: 1,
|
572
|
+
orientation: "landscape"
|
573
|
+
},
|
574
|
+
headerFooter: {
|
575
|
+
oddFooter: "\u0421\u0442\u0440\u0430\u043D\u0438\u0446\u0430 &P \u0438\u0437 &N",
|
576
|
+
evenFooter: "\u0421\u0442\u0440\u0430\u043D\u0438\u0446\u0430 &P \u0438\u0437 &N"
|
577
|
+
}
|
578
|
+
});
|
579
|
+
const excelColumns = generateExcelColumns(columns, exportCustomColumns);
|
580
|
+
sheet.columns = excelColumns;
|
581
|
+
const headerRow = sheet.getRow(1);
|
582
|
+
applyHeaderStyles(headerRow, sheet.columns.length);
|
583
|
+
const dataRows = generateExcelDataRows(columns, excelData);
|
584
|
+
dataRows.forEach((data) => {
|
585
|
+
const row = sheet.addRow(data);
|
586
|
+
applyRowStyles(row, sheet.columns.length);
|
587
|
+
});
|
588
|
+
setColumnAutoWidths(sheet);
|
589
|
+
if (excelData.length > 15) {
|
590
|
+
sheet.pageSetup.fitToHeight = Math.floor(excelData.length / 15);
|
591
|
+
} else {
|
592
|
+
sheet.pageSetup.fitToHeight = 1;
|
593
|
+
}
|
594
|
+
workbook.xlsx.writeBuffer().then((data) => {
|
595
|
+
const blob = new Blob([data], {
|
596
|
+
type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
|
597
|
+
});
|
598
|
+
const url = window.URL.createObjectURL(blob);
|
599
|
+
const anchor = document.createElement("a");
|
600
|
+
anchor.href = url;
|
601
|
+
anchor.download = `${title}.xlsx`;
|
602
|
+
anchor.click();
|
603
|
+
window.URL.revokeObjectURL(url);
|
604
|
+
});
|
605
|
+
};
|
606
|
+
return /* @__PURE__ */ jsx14("button", { className: `ndt-buttonExport ndt-Excel`, onClick: exportExcel, children: "\u0421\u043A\u0430\u0447\u0430\u0442\u044C Excel" });
|
607
|
+
};
|
608
|
+
var ExportExcel_default = ExportExcel;
|
609
|
+
|
610
|
+
// components/ExportSection.tsx
|
611
|
+
import { Fragment as Fragment2, jsx as jsx15, jsxs as jsxs5 } from "react/jsx-runtime";
|
612
|
+
var ExportSection = ({ wordBtn, excelBtn, downloadSectionLeftSideContent, tableData, columns, tableName, exportCustomColumns, wordOptions }) => {
|
613
|
+
return /* @__PURE__ */ jsx15(Fragment2, { children: /* @__PURE__ */ jsxs5("div", { className: "ndt-download-section", children: [
|
614
|
+
/* @__PURE__ */ jsx15("div", { className: "ndt-download-content", children: (wordBtn || excelBtn) && downloadSectionLeftSideContent !== null && downloadSectionLeftSideContent }),
|
615
|
+
/* @__PURE__ */ jsxs5("div", { className: "ndt-download-buttons", children: [
|
616
|
+
wordBtn && /* @__PURE__ */ jsx15(
|
617
|
+
WordExport_default,
|
618
|
+
{
|
619
|
+
wordData: tableData,
|
620
|
+
columns,
|
621
|
+
title: tableName,
|
622
|
+
exportCustomColumns,
|
623
|
+
options: wordOptions
|
624
|
+
}
|
625
|
+
),
|
626
|
+
excelBtn && /* @__PURE__ */ jsx15(
|
627
|
+
ExportExcel_default,
|
628
|
+
{
|
629
|
+
excelData: tableData,
|
630
|
+
columns,
|
631
|
+
title: tableName,
|
632
|
+
exportCustomColumns
|
633
|
+
}
|
634
|
+
)
|
635
|
+
] })
|
636
|
+
] }) });
|
637
|
+
};
|
638
|
+
var ExportSection_default = ExportSection;
|
639
|
+
|
396
640
|
// components/DataTable.tsx
|
397
|
-
import { jsx as
|
398
|
-
var ExportSection = React3.lazy(() => import("./ExportSection-ZYOK6KMB.js"));
|
641
|
+
import { jsx as jsx16, jsxs as jsxs6 } from "react/jsx-runtime";
|
399
642
|
var DataTable = forwardRef(({
|
400
643
|
tableData,
|
401
644
|
columns,
|
@@ -489,9 +732,9 @@ var DataTable = forwardRef(({
|
|
489
732
|
getData: () => processedData,
|
490
733
|
getCurrentData: () => displayData
|
491
734
|
}), [processedData, displayData]);
|
492
|
-
return /* @__PURE__ */
|
493
|
-
|
494
|
-
|
735
|
+
return /* @__PURE__ */ jsxs6("div", { className: "ndt-table-container", children: [
|
736
|
+
(wordBtn || excelBtn) && /* @__PURE__ */ jsx16(
|
737
|
+
ExportSection_default,
|
495
738
|
{
|
496
739
|
wordBtn,
|
497
740
|
excelBtn,
|
@@ -502,9 +745,9 @@ var DataTable = forwardRef(({
|
|
502
745
|
exportCustomColumns,
|
503
746
|
wordOptions
|
504
747
|
}
|
505
|
-
)
|
506
|
-
/* @__PURE__ */
|
507
|
-
/* @__PURE__ */
|
748
|
+
),
|
749
|
+
/* @__PURE__ */ jsxs6("div", { className: "ndt-table", children: [
|
750
|
+
/* @__PURE__ */ jsx16(
|
508
751
|
TableHeader_default,
|
509
752
|
{
|
510
753
|
columns,
|
@@ -516,7 +759,7 @@ var DataTable = forwardRef(({
|
|
516
759
|
headerGroup
|
517
760
|
}
|
518
761
|
),
|
519
|
-
loading ? loadingElement !== null ? loadingElement : /* @__PURE__ */
|
762
|
+
loading ? loadingElement !== null ? loadingElement : /* @__PURE__ */ jsx16("span", { style: { marginLeft: 10, fontWeight: "bold" }, children: "\u0417\u0430\u0433\u0440\u0443\u0437\u043A\u0430 \u0434\u0430\u043D\u043D\u044B\u0445..." }) : /* @__PURE__ */ jsx16(
|
520
763
|
TableBody_default,
|
521
764
|
{
|
522
765
|
tableData: displayData,
|
@@ -530,7 +773,7 @@ var DataTable = forwardRef(({
|
|
530
773
|
isTitles
|
531
774
|
}
|
532
775
|
),
|
533
|
-
isFooter && /* @__PURE__ */
|
776
|
+
isFooter && /* @__PURE__ */ jsx16(
|
534
777
|
TableFooter_default,
|
535
778
|
{
|
536
779
|
paginationCounts,
|
package/package.json
CHANGED
@@ -1,33 +1,30 @@
|
|
1
1
|
{
|
2
2
|
"name": "nillud-data-table",
|
3
|
-
"version": "1.0.
|
3
|
+
"version": "1.0.5",
|
4
4
|
"type": "module",
|
5
5
|
"main": "./dist/index.cjs",
|
6
6
|
"module": "./dist/index.js",
|
7
7
|
"types": "./dist/index.d.ts",
|
8
8
|
"style": "./dist/styles.css",
|
9
|
-
"files": [
|
9
|
+
"files": [
|
10
|
+
"dist"
|
11
|
+
],
|
10
12
|
"exports": {
|
11
13
|
".": {
|
12
14
|
"import": "./dist/index.js"
|
13
15
|
},
|
14
|
-
"./export-excel": {
|
15
|
-
"import": "./dist/export-excel.js"
|
16
|
-
},
|
17
|
-
"./export-word": {
|
18
|
-
"import": "./dist/export-word.js"
|
19
|
-
},
|
20
16
|
"./types": "./dist/index.d.ts",
|
21
17
|
"./styles.css": "./dist/styles.css"
|
22
18
|
},
|
23
19
|
"peerDependencies": {
|
24
|
-
"react": "^17.0.0 || ^18.0.0 || ^19.0.0",
|
25
|
-
"react-dom": "^17.0.0 || ^18.0.0 || ^19.0.0",
|
26
20
|
"docx": "^8.1.2",
|
27
21
|
"exceljs": "^4.3.0",
|
28
|
-
"file-saver": "^2.0.5"
|
22
|
+
"file-saver": "^2.0.5",
|
23
|
+
"react": "^17.0.0 || ^18.0.0 || ^19.0.0",
|
24
|
+
"react-dom": "^17.0.0 || ^18.0.0 || ^19.0.0"
|
29
25
|
},
|
30
26
|
"devDependencies": {
|
27
|
+
"@types/file-saver": "^2.0.7",
|
31
28
|
"@types/react": "^19.1.3",
|
32
29
|
"@types/react-dom": "^19.1.3",
|
33
30
|
"sass": "^1.87.0",
|
@@ -1,247 +0,0 @@
|
|
1
|
-
// components/export/WordExport.tsx
|
2
|
-
import {
|
3
|
-
AlignmentType,
|
4
|
-
Document,
|
5
|
-
Packer,
|
6
|
-
PageOrientation,
|
7
|
-
Paragraph,
|
8
|
-
Table,
|
9
|
-
TableCell,
|
10
|
-
TableRow,
|
11
|
-
TextRun,
|
12
|
-
VerticalAlign,
|
13
|
-
WidthType
|
14
|
-
} from "docx";
|
15
|
-
import saveAs from "file-saver";
|
16
|
-
|
17
|
-
// utils/exportUtils/ExportHelpers.ts
|
18
|
-
function prepareExportRows(columns, data) {
|
19
|
-
return data.map(
|
20
|
-
(row) => columns.map((col) => {
|
21
|
-
const value = row[col.field];
|
22
|
-
return typeof col.exportCustomCell !== "undefined" ? col.exportCustomCell(String(value), row) : String(value != null ? value : "");
|
23
|
-
})
|
24
|
-
);
|
25
|
-
}
|
26
|
-
function prepareExportHeaders(columns) {
|
27
|
-
return columns.map((col) => col.title);
|
28
|
-
}
|
29
|
-
|
30
|
-
// components/export/WordExport.tsx
|
31
|
-
import { jsx } from "react/jsx-runtime";
|
32
|
-
var WordExport = ({
|
33
|
-
wordData,
|
34
|
-
columns,
|
35
|
-
title,
|
36
|
-
options = {
|
37
|
-
fontSize: 20,
|
38
|
-
boldHeaders: false,
|
39
|
-
autoLandscape: false,
|
40
|
-
maxColumnsBeforeLandscape: 5
|
41
|
-
}
|
42
|
-
// exportCustomColumns
|
43
|
-
}) => {
|
44
|
-
const createNewWord = async () => {
|
45
|
-
const {
|
46
|
-
fontSize = 0,
|
47
|
-
boldHeaders = true,
|
48
|
-
autoLandscape = true,
|
49
|
-
maxColumnsBeforeLandscape = 5
|
50
|
-
} = options;
|
51
|
-
const isLandscape = autoLandscape && columns.length > maxColumnsBeforeLandscape;
|
52
|
-
const headerCells = prepareExportHeaders(columns).map((header) => new TableCell({
|
53
|
-
children: [new Paragraph({
|
54
|
-
children: [new TextRun({
|
55
|
-
text: header,
|
56
|
-
size: fontSize,
|
57
|
-
bold: boldHeaders
|
58
|
-
})],
|
59
|
-
alignment: AlignmentType.CENTER
|
60
|
-
})],
|
61
|
-
verticalAlign: VerticalAlign.CENTER
|
62
|
-
}));
|
63
|
-
const tableHeaderRow = new TableRow({ children: headerCells });
|
64
|
-
const rows = prepareExportRows(columns, wordData).map((cells) => {
|
65
|
-
const rowCells = cells.map(
|
66
|
-
(value) => new TableCell({
|
67
|
-
children: [new Paragraph({
|
68
|
-
children: [new TextRun({
|
69
|
-
text: value,
|
70
|
-
size: fontSize
|
71
|
-
})],
|
72
|
-
alignment: AlignmentType.CENTER
|
73
|
-
})],
|
74
|
-
verticalAlign: VerticalAlign.CENTER
|
75
|
-
})
|
76
|
-
);
|
77
|
-
return new TableRow({ children: rowCells });
|
78
|
-
});
|
79
|
-
const table = new Table({
|
80
|
-
rows: [tableHeaderRow, ...rows],
|
81
|
-
width: { size: 11e3, type: WidthType.DXA },
|
82
|
-
indent: { size: -1e3, type: WidthType.DXA }
|
83
|
-
});
|
84
|
-
const doc = new Document({
|
85
|
-
sections: [{
|
86
|
-
children: [table, new Paragraph({ text: "" })],
|
87
|
-
properties: isLandscape ? { page: { size: { orientation: PageOrientation.LANDSCAPE } } } : {}
|
88
|
-
}]
|
89
|
-
});
|
90
|
-
Packer.toBlob(doc).then((blob) => {
|
91
|
-
saveAs(blob, `${title}.docx`);
|
92
|
-
});
|
93
|
-
};
|
94
|
-
return /* @__PURE__ */ jsx("button", { className: `ndt-buttonExport ndt-Word}`, onClick: createNewWord, children: "\u0421\u043A\u0430\u0447\u0430\u0442\u044C Word" });
|
95
|
-
};
|
96
|
-
var WordExport_default = WordExport;
|
97
|
-
|
98
|
-
// utils/exportUtils/exportUtils.ts
|
99
|
-
var generateExcelColumns = (columns, exportCustomColumns) => {
|
100
|
-
let excelColumns = columns.map((column) => ({
|
101
|
-
header: column.title,
|
102
|
-
key: column.field,
|
103
|
-
width: 20
|
104
|
-
}));
|
105
|
-
if (exportCustomColumns) {
|
106
|
-
exportCustomColumns.forEach((custom) => {
|
107
|
-
excelColumns = excelColumns.map(
|
108
|
-
(col) => col.key === custom.key ? { ...col, ...custom } : col
|
109
|
-
);
|
110
|
-
});
|
111
|
-
}
|
112
|
-
return excelColumns;
|
113
|
-
};
|
114
|
-
var applyHeaderStyles = (row, columnCount) => {
|
115
|
-
row.height = 40;
|
116
|
-
row.font = { size: 12, bold: true };
|
117
|
-
row.alignment = { vertical: "middle", horizontal: "center" };
|
118
|
-
for (let i = 1; i <= columnCount; i++) {
|
119
|
-
const cell = row.getCell(i);
|
120
|
-
cell.alignment = { wrapText: true, vertical: "middle", horizontal: "center" };
|
121
|
-
cell.border = {
|
122
|
-
top: { style: "thin" },
|
123
|
-
left: { style: "thin" },
|
124
|
-
bottom: { style: "thin" },
|
125
|
-
right: { style: "thin" }
|
126
|
-
};
|
127
|
-
}
|
128
|
-
};
|
129
|
-
var applyRowStyles = (row, columnCount) => {
|
130
|
-
row.height = 40;
|
131
|
-
row.font = { size: 12 };
|
132
|
-
row.alignment = { vertical: "middle", horizontal: "center" };
|
133
|
-
for (let i = 1; i <= columnCount; i++) {
|
134
|
-
const cell = row.getCell(i);
|
135
|
-
cell.alignment = { wrapText: true, vertical: "middle", horizontal: "center" };
|
136
|
-
cell.border = {
|
137
|
-
top: { style: "thin" },
|
138
|
-
left: { style: "thin" },
|
139
|
-
bottom: { style: "thin" },
|
140
|
-
right: { style: "thin" }
|
141
|
-
};
|
142
|
-
}
|
143
|
-
};
|
144
|
-
var generateExcelDataRows = (columns, data) => {
|
145
|
-
return data.map((element) => {
|
146
|
-
const rowData = {};
|
147
|
-
columns.forEach((col) => {
|
148
|
-
const value = element[col.field];
|
149
|
-
rowData[col.field] = typeof col.exportCustomCell !== "undefined" ? col.exportCustomCell(String(value), element) : value != null ? value : "";
|
150
|
-
});
|
151
|
-
return rowData;
|
152
|
-
});
|
153
|
-
};
|
154
|
-
var setColumnAutoWidths = (sheet) => {
|
155
|
-
var _a;
|
156
|
-
(_a = sheet.columns) == null ? void 0 : _a.forEach((column) => {
|
157
|
-
var _a2;
|
158
|
-
let maxLength = 10;
|
159
|
-
(_a2 = column.eachCell) == null ? void 0 : _a2.call(column, { includeEmpty: true }, (cell) => {
|
160
|
-
const cellValue = cell.value ? String(cell.value) : "";
|
161
|
-
maxLength = Math.max(maxLength, cellValue.length + 5);
|
162
|
-
});
|
163
|
-
column.width = maxLength;
|
164
|
-
});
|
165
|
-
};
|
166
|
-
|
167
|
-
// components/export/ExportExcel.tsx
|
168
|
-
import ExcelJS from "exceljs";
|
169
|
-
import { jsx as jsx2 } from "react/jsx-runtime";
|
170
|
-
var ExportExcel = ({ columns, excelData, title, exportCustomColumns }) => {
|
171
|
-
const exportExcel = () => {
|
172
|
-
const workbook = new ExcelJS.Workbook();
|
173
|
-
const sheet = workbook.addWorksheet(title, {
|
174
|
-
pageSetup: {
|
175
|
-
fitToPage: true,
|
176
|
-
fitToHeight: 2,
|
177
|
-
fitToWidth: 1,
|
178
|
-
orientation: "landscape"
|
179
|
-
},
|
180
|
-
headerFooter: {
|
181
|
-
oddFooter: "\u0421\u0442\u0440\u0430\u043D\u0438\u0446\u0430 &P \u0438\u0437 &N",
|
182
|
-
evenFooter: "\u0421\u0442\u0440\u0430\u043D\u0438\u0446\u0430 &P \u0438\u0437 &N"
|
183
|
-
}
|
184
|
-
});
|
185
|
-
const excelColumns = generateExcelColumns(columns, exportCustomColumns);
|
186
|
-
sheet.columns = excelColumns;
|
187
|
-
const headerRow = sheet.getRow(1);
|
188
|
-
applyHeaderStyles(headerRow, sheet.columns.length);
|
189
|
-
const dataRows = generateExcelDataRows(columns, excelData);
|
190
|
-
dataRows.forEach((data) => {
|
191
|
-
const row = sheet.addRow(data);
|
192
|
-
applyRowStyles(row, sheet.columns.length);
|
193
|
-
});
|
194
|
-
setColumnAutoWidths(sheet);
|
195
|
-
if (excelData.length > 15) {
|
196
|
-
sheet.pageSetup.fitToHeight = Math.floor(excelData.length / 15);
|
197
|
-
} else {
|
198
|
-
sheet.pageSetup.fitToHeight = 1;
|
199
|
-
}
|
200
|
-
workbook.xlsx.writeBuffer().then((data) => {
|
201
|
-
const blob = new Blob([data], {
|
202
|
-
type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
|
203
|
-
});
|
204
|
-
const url = window.URL.createObjectURL(blob);
|
205
|
-
const anchor = document.createElement("a");
|
206
|
-
anchor.href = url;
|
207
|
-
anchor.download = `${title}.xlsx`;
|
208
|
-
anchor.click();
|
209
|
-
window.URL.revokeObjectURL(url);
|
210
|
-
});
|
211
|
-
};
|
212
|
-
return /* @__PURE__ */ jsx2("button", { className: `ndt-buttonExport ndt-Excel`, onClick: exportExcel, children: "\u0421\u043A\u0430\u0447\u0430\u0442\u044C Excel" });
|
213
|
-
};
|
214
|
-
var ExportExcel_default = ExportExcel;
|
215
|
-
|
216
|
-
// components/ExportSection.tsx
|
217
|
-
import { Fragment, jsx as jsx3, jsxs } from "react/jsx-runtime";
|
218
|
-
var ExportSection = ({ wordBtn, excelBtn, downloadSectionLeftSideContent, tableData, columns, tableName, exportCustomColumns, wordOptions }) => {
|
219
|
-
return /* @__PURE__ */ jsx3(Fragment, { children: /* @__PURE__ */ jsxs("div", { className: "ndt-download-section", children: [
|
220
|
-
/* @__PURE__ */ jsx3("div", { className: "ndt-download-content", children: (wordBtn || excelBtn) && downloadSectionLeftSideContent !== null && downloadSectionLeftSideContent }),
|
221
|
-
/* @__PURE__ */ jsxs("div", { className: "ndt-download-buttons", children: [
|
222
|
-
wordBtn && /* @__PURE__ */ jsx3(
|
223
|
-
WordExport_default,
|
224
|
-
{
|
225
|
-
wordData: tableData,
|
226
|
-
columns,
|
227
|
-
title: tableName,
|
228
|
-
exportCustomColumns,
|
229
|
-
options: wordOptions
|
230
|
-
}
|
231
|
-
),
|
232
|
-
excelBtn && /* @__PURE__ */ jsx3(
|
233
|
-
ExportExcel_default,
|
234
|
-
{
|
235
|
-
excelData: tableData,
|
236
|
-
columns,
|
237
|
-
title: tableName,
|
238
|
-
exportCustomColumns
|
239
|
-
}
|
240
|
-
)
|
241
|
-
] })
|
242
|
-
] }) });
|
243
|
-
};
|
244
|
-
var ExportSection_default = ExportSection;
|
245
|
-
export {
|
246
|
-
ExportSection_default as default
|
247
|
-
};
|