namirasoft-site-react 1.3.280 → 1.3.282
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.
|
@@ -40,5 +40,6 @@ export declare class NSTable<RowType> extends Component<INSTableProps<RowType>,
|
|
|
40
40
|
hideModal(): void;
|
|
41
41
|
onPageChange: (page: number, size: number) => void;
|
|
42
42
|
toggleAllCheckboxes(): void;
|
|
43
|
+
handlePrint(): void;
|
|
43
44
|
render(): import("react/jsx-runtime").JSX.Element;
|
|
44
45
|
}
|
|
@@ -17,13 +17,19 @@ export class NSTable extends Component {
|
|
|
17
17
|
this.onPageChange = (page, size) => {
|
|
18
18
|
this.props.reload(page, size);
|
|
19
19
|
};
|
|
20
|
-
this.state = {
|
|
20
|
+
this.state = {
|
|
21
|
+
columns: props.columns,
|
|
22
|
+
rows: null,
|
|
23
|
+
model: { show: false },
|
|
24
|
+
headerCheckboxChecked: false
|
|
25
|
+
};
|
|
21
26
|
this.setColumns = this.setColumns.bind(this);
|
|
22
27
|
this.setRows = this.setRows.bind(this);
|
|
23
28
|
this.showModal = this.showModal.bind(this);
|
|
24
29
|
this.hideModal = this.hideModal.bind(this);
|
|
25
30
|
this.onPageChange = this.onPageChange.bind(this);
|
|
26
31
|
this.toggleAllCheckboxes = this.toggleAllCheckboxes.bind(this);
|
|
32
|
+
this.handlePrint = this.handlePrint.bind(this);
|
|
27
33
|
}
|
|
28
34
|
setColumns(columns) {
|
|
29
35
|
this.setState({ columns });
|
|
@@ -45,6 +51,20 @@ export class NSTable extends Component {
|
|
|
45
51
|
checkbox.checked = isChecked;
|
|
46
52
|
});
|
|
47
53
|
}
|
|
54
|
+
handlePrint() {
|
|
55
|
+
const printWindow = window.open('', '', 'height=500,width=800');
|
|
56
|
+
printWindow.document.write('<html><head><title>Print Table</title>');
|
|
57
|
+
printWindow.document.write('<style>table { width: 100%; border-collapse: collapse; } th, td { border: 1px solid black; padding: 8px; text-align: left; }</style>');
|
|
58
|
+
printWindow.document.write('</head><body>');
|
|
59
|
+
printWindow.document.write('<table>');
|
|
60
|
+
printWindow.document.write('<thead><tr>');
|
|
61
|
+
Object.keys(this.state.columns).forEach(column => {
|
|
62
|
+
printWindow.document.write('<th>' + this.state.columns[column] + '</th>');
|
|
63
|
+
});
|
|
64
|
+
printWindow.document.write('</tr></thead><tbody>');
|
|
65
|
+
printWindow.document.write('</tbody></table>');
|
|
66
|
+
printWindow.document.write('</body></html>');
|
|
67
|
+
}
|
|
48
68
|
render() {
|
|
49
69
|
var _a;
|
|
50
70
|
let column_keys = Object.keys(this.state.columns);
|
|
@@ -63,10 +83,6 @@ export class NSTable extends Component {
|
|
|
63
83
|
this.props.onRowClick(e, row, rowIndex);
|
|
64
84
|
};
|
|
65
85
|
let onCellClick = (e, row, column, rowIndex, columnIndex) => {
|
|
66
|
-
debugger;
|
|
67
|
-
if (column === "selected") {
|
|
68
|
-
return;
|
|
69
|
-
}
|
|
70
86
|
let overided = false;
|
|
71
87
|
if (this.props.onCellClick) {
|
|
72
88
|
let res = this.props.onCellClick(e, row, column, rowIndex, columnIndex);
|
|
@@ -89,9 +105,9 @@ export class NSTable extends Component {
|
|
|
89
105
|
content = (_jsx(NSNoData, { lable: 'No New Message' }));
|
|
90
106
|
}
|
|
91
107
|
else {
|
|
92
|
-
content = this.state.rows.map((row, rowIndex) =>
|
|
108
|
+
content = this.state.rows.map((row, rowIndex) => _jsxs("tr", { onClick: (e) => { onRowClick(e, row, rowIndex); }, children: [_jsx("td", { children: _jsx("input", { type: "checkbox" }) }), column_keys.map((column, columnIndex) => (_createElement("td", Object.assign({}, getColumnAttributes(column, columnIndex), { key: columnIndex, "data-label": `${this.state.columns[column]} : `, onClick: (e) => { onCellClick(e, row, column, rowIndex, columnIndex); } }), getCell(row, column, rowIndex, columnIndex))))] }, this.props.getRowKey(row, rowIndex)));
|
|
93
109
|
}
|
|
94
|
-
return (_jsxs("div", { id: this.props.id, className: `${Styles.ns_project_list_container} ${(_a = this.props.classList) === null || _a === void 0 ? void 0 : _a.join(" ")}`, style: this.props.style, children: [_jsx(NSSpace, { size: NSSpaceSizeType.SMALL }), _jsxs("table", { className: Styles.ns_table, children: [_jsx("thead", { className: Styles.ns_thead, children: _jsxs("tr", { children: [_jsx("th", { children: _jsx("input", { id: 'checkbox', type: 'checkbox', onChange: this.toggleAllCheckboxes, checked: this.state.headerCheckboxChecked }) }), column_keys.map(column_key => _jsx("th", { scope: "col", children: this.state.columns[column_key] }, column_key))] }) }), _jsx("tbody", { className: Styles.ns_tbody, children: content })] }), _jsx(NSSpace, { size: NSSpaceSizeType.MICRO }), _jsxs("section", { className: Styles.ns_pagination_button, children: [_jsx(NSPagination, { ref: this.NSPagination, totalItems: this.props.totalItems, onPageChange: this.onPageChange }), _jsx(NSSpace, { size: NSSpaceSizeType.SMALL }), _jsxs("div", { className: Styles.ns_button, children: [_jsx(NSButton, { title: 'Chart', icon: { src: "https://static.namirasoft.com/image/concept/chart/blue.svg" }, onClick: () => { }, style: { border: '1px solid rgba(255, 148, 50, 1)', width: "128px" } }), _jsx(NSButton, { title: 'Print', icon: { src: "https://static.namirasoft.com/image/concept/print/blue.svg" }, onClick:
|
|
110
|
+
return (_jsxs("div", { id: this.props.id, className: `${Styles.ns_project_list_container} ${(_a = this.props.classList) === null || _a === void 0 ? void 0 : _a.join(" ")}`, style: this.props.style, children: [_jsx(NSSpace, { size: NSSpaceSizeType.SMALL }), _jsxs("table", { className: Styles.ns_table, children: [_jsx("thead", { className: Styles.ns_thead, children: _jsxs("tr", { children: [_jsx("th", { children: _jsx("input", { id: 'checkbox', type: 'checkbox', onChange: this.toggleAllCheckboxes, checked: this.state.headerCheckboxChecked }) }), column_keys.map(column_key => _jsx("th", { scope: "col", children: this.state.columns[column_key] }, column_key))] }) }), _jsx("tbody", { className: Styles.ns_tbody, children: content })] }), _jsx(NSSpace, { size: NSSpaceSizeType.MICRO }), _jsxs("section", { className: Styles.ns_pagination_button, children: [_jsx(NSPagination, { ref: this.NSPagination, totalItems: this.props.totalItems, onPageChange: this.onPageChange }), _jsx(NSSpace, { size: NSSpaceSizeType.SMALL }), _jsxs("div", { className: Styles.ns_button, children: [_jsx(NSButton, { title: 'Chart', icon: { src: "https://static.namirasoft.com/image/concept/chart/blue.svg" }, onClick: () => { }, style: { border: '1px solid rgba(255, 148, 50, 1)', width: "128px" } }), _jsx(NSButton, { title: 'Print', icon: { src: "https://static.namirasoft.com/image/concept/print/blue.svg" }, onClick: this.handlePrint, style: { border: '1px solid rgba(255, 148, 50, 1)', width: "128px" } }), _jsx(NSButton, { title: 'Export', icon: { src: "https://static.namirasoft.com/image/concept/export/blue.svg" }, onClick: () => { }, style: { border: '1px solid rgba(255, 148, 50, 1)', width: "128px" } }), _jsx(NSButton, { title: 'Refresh', icon: { src: "https://static.namirasoft.com/image/concept/refresh/blue.svg" }, onClick: () => {
|
|
95
111
|
if (this.NSPagination.current)
|
|
96
112
|
this.props.reload(this.NSPagination.current.getCurrentPage(), this.NSPagination.current.getPageSize());
|
|
97
113
|
}, style: { border: '1px solid rgba(3, 119, 255, 1)', width: "128px" } })] })] }), _jsx(NSSpace, { size: NSSpaceSizeType.SMALL }), _jsx(NSModal, { show: this.state.model.show, description: this.state.model.description, onClose: () => { this.hideModal(); }, title: this.state.title })] }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NSTable.js","sourceRoot":"","sources":["../../src/components/NSTable.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;;AAEb,OAAO,QAAQ,MAAM,YAAY,CAAC;AAClC,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,eAAe,EAAE,MAAM,WAAW,CAAC;AACrD,OAAO,MAAM,MAAM,sBAAsB,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AA2BtC,MAAM,OAAO,OAAiB,SAAQ,SAAwD;
|
|
1
|
+
{"version":3,"file":"NSTable.js","sourceRoot":"","sources":["../../src/components/NSTable.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -36,40 +36,51 @@ export interface NSTableState<RowType>
|
|
|
36
36
|
headerCheckboxChecked: boolean;
|
|
37
37
|
}
|
|
38
38
|
|
|
39
|
-
export class NSTable<RowType> extends Component<INSTableProps<RowType>, NSTableState<RowType>>
|
|
40
|
-
{
|
|
39
|
+
export class NSTable<RowType> extends Component<INSTableProps<RowType>, NSTableState<RowType>> {
|
|
41
40
|
NSPagination = React.createRef<NSPagination>();
|
|
42
41
|
constructor(props: INSTableProps<RowType>)
|
|
43
42
|
{
|
|
44
43
|
super(props);
|
|
45
|
-
this.state = {
|
|
44
|
+
this.state = {
|
|
45
|
+
columns: props.columns,
|
|
46
|
+
rows: null,
|
|
47
|
+
model: { show: false },
|
|
48
|
+
headerCheckboxChecked: false
|
|
49
|
+
};
|
|
46
50
|
this.setColumns = this.setColumns.bind(this);
|
|
47
51
|
this.setRows = this.setRows.bind(this);
|
|
48
52
|
this.showModal = this.showModal.bind(this);
|
|
49
53
|
this.hideModal = this.hideModal.bind(this);
|
|
50
54
|
this.onPageChange = this.onPageChange.bind(this);
|
|
51
55
|
this.toggleAllCheckboxes = this.toggleAllCheckboxes.bind(this);
|
|
56
|
+
this.handlePrint = this.handlePrint.bind(this);
|
|
52
57
|
}
|
|
58
|
+
|
|
53
59
|
setColumns(columns: { [key: string]: string })
|
|
54
60
|
{
|
|
55
61
|
this.setState({ columns });
|
|
56
62
|
}
|
|
63
|
+
|
|
57
64
|
setRows(rows: RowType[] | null)
|
|
58
65
|
{
|
|
59
66
|
this.setState({ rows });
|
|
60
67
|
}
|
|
68
|
+
|
|
61
69
|
showModal(description: string, title?: string)
|
|
62
70
|
{
|
|
63
71
|
this.setState({ model: { show: true, description }, title });
|
|
64
72
|
}
|
|
73
|
+
|
|
65
74
|
hideModal()
|
|
66
75
|
{
|
|
67
76
|
this.setState({ model: { show: false } });
|
|
68
77
|
}
|
|
78
|
+
|
|
69
79
|
onPageChange = (page: number, size: number) =>
|
|
70
80
|
{
|
|
71
81
|
this.props.reload(page, size);
|
|
72
82
|
}
|
|
83
|
+
|
|
73
84
|
toggleAllCheckboxes()
|
|
74
85
|
{
|
|
75
86
|
const isChecked = !this.state.headerCheckboxChecked;
|
|
@@ -81,10 +92,45 @@ export class NSTable<RowType> extends Component<INSTableProps<RowType>, NSTableS
|
|
|
81
92
|
(checkbox as HTMLInputElement).checked = isChecked;
|
|
82
93
|
});
|
|
83
94
|
}
|
|
95
|
+
|
|
96
|
+
handlePrint()
|
|
97
|
+
{
|
|
98
|
+
const printWindow = window.open('', '', 'height=500,width=800');
|
|
99
|
+
printWindow!.document.write('<html><head><title>Print Table</title>');
|
|
100
|
+
printWindow!.document.write('<style>table { width: 100%; border-collapse: collapse; } th, td { border: 1px solid black; padding: 8px; text-align: left; }</style>');
|
|
101
|
+
printWindow!.document.write('</head><body>');
|
|
102
|
+
printWindow!.document.write('<table>');
|
|
103
|
+
printWindow!.document.write('<thead><tr>');
|
|
104
|
+
|
|
105
|
+
// Add table headers
|
|
106
|
+
Object.keys(this.state.columns).forEach(column =>
|
|
107
|
+
{
|
|
108
|
+
printWindow!.document.write('<th>' + this.state.columns[column] + '</th>');
|
|
109
|
+
});
|
|
110
|
+
|
|
111
|
+
printWindow!.document.write('</tr></thead><tbody>');
|
|
112
|
+
|
|
113
|
+
// Add table rows
|
|
114
|
+
// this.state.rows?.forEach(row =>
|
|
115
|
+
// {
|
|
116
|
+
// printWindow!.document.write('<tr>');
|
|
117
|
+
// Object.keys(this.state.columns).forEach(column =>
|
|
118
|
+
// {
|
|
119
|
+
// printWindow!.document.write('<td>' + (row as any)[column] + '</td>');
|
|
120
|
+
// });
|
|
121
|
+
// printWindow!.document.write('</tr>');
|
|
122
|
+
// });
|
|
123
|
+
|
|
124
|
+
printWindow!.document.write('</tbody></table>');
|
|
125
|
+
printWindow!.document.write('</body></html>');
|
|
126
|
+
// printWindow!.document.close();
|
|
127
|
+
// printWindow!.print();
|
|
128
|
+
}
|
|
129
|
+
|
|
84
130
|
override render()
|
|
85
131
|
{
|
|
86
132
|
let column_keys = Object.keys(this.state.columns);
|
|
87
|
-
let getColumnAttributes = (column: string, columnIndex: number) =>
|
|
133
|
+
let getColumnAttributes = (column: string, columnIndex: number) =>
|
|
88
134
|
{
|
|
89
135
|
if (this.props.getColumnAttributes)
|
|
90
136
|
return this.props.getColumnAttributes(column, columnIndex);
|
|
@@ -103,12 +149,6 @@ export class NSTable<RowType> extends Component<INSTableProps<RowType>, NSTableS
|
|
|
103
149
|
};
|
|
104
150
|
let onCellClick = (e: React.MouseEvent<HTMLTableDataCellElement, MouseEvent>, row: RowType, column: string, rowIndex: number, columnIndex: number) =>
|
|
105
151
|
{
|
|
106
|
-
debugger
|
|
107
|
-
if (column === "selected")
|
|
108
|
-
{
|
|
109
|
-
return;
|
|
110
|
-
}
|
|
111
|
-
|
|
112
152
|
let overided = false;
|
|
113
153
|
if (this.props.onCellClick)
|
|
114
154
|
{
|
|
@@ -143,10 +183,13 @@ export class NSTable<RowType> extends Component<INSTableProps<RowType>, NSTableS
|
|
|
143
183
|
{
|
|
144
184
|
content = this.state.rows.map((row, rowIndex) =>
|
|
145
185
|
<tr key={this.props.getRowKey(row, rowIndex)} onClick={(e) => { onRowClick(e, row, rowIndex); }}>
|
|
186
|
+
<td >
|
|
187
|
+
<input type="checkbox" />
|
|
188
|
+
</td>
|
|
146
189
|
{
|
|
147
190
|
column_keys.map((column, columnIndex) => (
|
|
148
191
|
<td {...getColumnAttributes(column, columnIndex)} key={columnIndex} data-label={`${this.state.columns[column]} : `} onClick={(e) => { onCellClick(e, row, column, rowIndex, columnIndex); }}>
|
|
149
|
-
{
|
|
192
|
+
{getCell(row, column, rowIndex, columnIndex)}
|
|
150
193
|
</td>
|
|
151
194
|
))
|
|
152
195
|
}
|
|
@@ -178,7 +221,7 @@ export class NSTable<RowType> extends Component<INSTableProps<RowType>, NSTableS
|
|
|
178
221
|
<NSSpace size={NSSpaceSizeType.SMALL} />
|
|
179
222
|
<div className={Styles.ns_button}>
|
|
180
223
|
<NSButton title='Chart' icon={{ src: "https://static.namirasoft.com/image/concept/chart/blue.svg" }} onClick={() => { }} style={{ border: '1px solid rgba(255, 148, 50, 1)', width: "128px" }} />
|
|
181
|
-
<NSButton title='Print' icon={{ src: "https://static.namirasoft.com/image/concept/print/blue.svg" }} onClick={
|
|
224
|
+
<NSButton title='Print' icon={{ src: "https://static.namirasoft.com/image/concept/print/blue.svg" }} onClick={this.handlePrint} style={{ border: '1px solid rgba(255, 148, 50, 1)', width: "128px" }} />
|
|
182
225
|
<NSButton title='Export' icon={{ src: "https://static.namirasoft.com/image/concept/export/blue.svg" }} onClick={() => { }} style={{ border: '1px solid rgba(255, 148, 50, 1)', width: "128px" }} />
|
|
183
226
|
<NSButton title='Refresh' icon={{ src: "https://static.namirasoft.com/image/concept/refresh/blue.svg" }} onClick={() =>
|
|
184
227
|
{
|