Skip to content

Commit 02acdea

Browse files
New Feature/Improvement:
1. Improvements in basic pagination 2. Implement advanced pagination Bug Fixes: 1. CSV doesn't contain computed values #31 2. Export to Excel functionality is broken - file cannot be opened #28
1 parent 36eeb90 commit 02acdea

File tree

10 files changed

+774
-454
lines changed

10 files changed

+774
-454
lines changed

example/dist/index.js

Lines changed: 3 additions & 3 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

example/src/UserList.js

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,10 @@ class UserList extends Component {
3333
text: "Rating",
3434
className: "rating",
3535
align: "left",
36-
sortable: true
36+
sortable: true,
37+
cell: record => {
38+
return <span>{record.rating} {record.type_of_food}</span>
39+
}
3740
},
3841
{
3942
key: "type_of_food",
@@ -61,6 +64,7 @@ class UserList extends Component {
6164
<button className="btn btn-danger btn-sm" onClick={() => this.deleteUser(record)}>
6265
<i className="glyphicon glyphicon-trash fa fa-trash"></i>
6366
</button>
67+
6468
</Fragment>
6569
);
6670
}
@@ -74,6 +78,7 @@ class UserList extends Component {
7478
button: {
7579
excel: true,
7680
print: true,
81+
csv: true,
7782
extra: false,
7883
},
7984
language: {
@@ -87,6 +92,7 @@ class UserList extends Component {
8792
last: "Last"
8893
}
8994
},
95+
pagination: "basic",
9096
show_length_menu: true,
9197
show_filter: true,
9298
show_pagination: true,

lib/ADPagination.js

Lines changed: 122 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,122 @@
1+
"use strict";
2+
3+
Object.defineProperty(exports, "__esModule", {
4+
value: true
5+
});
6+
exports.default = ADPagination;
7+
8+
var _react = require("react");
9+
10+
var _react2 = _interopRequireDefault(_react);
11+
12+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
13+
14+
function ADPagination(props) {
15+
var size = props.pages;
16+
var page = props.page_number;
17+
var step = 2;
18+
var tags = [];
19+
20+
var Item = function Item(props) {
21+
var className = props.className || "";
22+
return _react2.default.createElement(
23+
"li",
24+
{ className: "page-item " + className },
25+
_react2.default.createElement(
26+
"a",
27+
{ href: "javascript:void(0);", className: "page-link", tabIndex: "-1",
28+
onClick: props.onClick },
29+
props.children
30+
)
31+
);
32+
};
33+
34+
var Add = function Add(s, f) {
35+
var _loop = function _loop(i) {
36+
console.log('i', i);
37+
tags.push(_react2.default.createElement(
38+
Item,
39+
{
40+
key: i,
41+
className: page == i ? "active" : "",
42+
onClick: function onClick(e) {
43+
return props.goToPage(e, i);
44+
} },
45+
i
46+
));
47+
};
48+
49+
for (var i = s; i < f; i++) {
50+
_loop(i);
51+
}
52+
};
53+
54+
var Last = function Last() {
55+
tags.push(_react2.default.createElement(
56+
Item,
57+
{ key: "l..." },
58+
"..."
59+
));
60+
tags.push(_react2.default.createElement(
61+
Item,
62+
{ key: size,
63+
className: page == size ? "active" : "",
64+
onClick: function onClick(e) {
65+
return props.goToPage(e, size);
66+
} },
67+
size
68+
));
69+
};
70+
71+
var First = function First() {
72+
tags.push(_react2.default.createElement(
73+
Item,
74+
{
75+
key: "1",
76+
className: page == 1 ? "active" : "",
77+
onClick: function onClick(e) {
78+
return props.goToPage(e, 1);
79+
} },
80+
"1"
81+
));
82+
tags.push(_react2.default.createElement(
83+
Item,
84+
{ key: "f..." },
85+
"..."
86+
));
87+
};
88+
89+
tags.push(_react2.default.createElement(
90+
Item,
91+
{
92+
key: "p0",
93+
className: props.isFirst ? "disabled " : "",
94+
onClick: props.previousPage },
95+
"\u25C4"
96+
));
97+
98+
if (size < step * 2 + 6) {
99+
Add(1, size + 1);
100+
} else if (page < step * 2 + 1) {
101+
Add(1, step * 2 + 4);
102+
Last();
103+
} else if (page > size - step * 2) {
104+
First();
105+
Add(size - step * 2 - 2, size + 1);
106+
} else {
107+
First();
108+
Add(page - step, page + step + 1);
109+
Last();
110+
}
111+
112+
tags.push(_react2.default.createElement(
113+
Item,
114+
{
115+
key: "n0",
116+
className: props.isLast ? "disabled " : "",
117+
onClick: props.nextPage },
118+
"\u25BA"
119+
));
120+
121+
return tags;
122+
}

lib/Pagination.js

Lines changed: 81 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,81 @@
1+
"use strict";
2+
3+
Object.defineProperty(exports, "__esModule", {
4+
value: true
5+
});
6+
exports.default = InitialPagination;
7+
8+
var _react = require("react");
9+
10+
var _react2 = _interopRequireDefault(_react);
11+
12+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
13+
14+
function InitialPagination(props) {
15+
return _react2.default.createElement(
16+
_react.Fragment,
17+
null,
18+
props.config.show_first ? _react2.default.createElement(
19+
"li",
20+
{ className: (props.isFirst ? "disabled " : "") + "page-item" },
21+
_react2.default.createElement(
22+
"a",
23+
{ href: "#", className: "page-link", tabIndex: "-1",
24+
onClick: props.firstPage },
25+
props.config.language.pagination.first
26+
)
27+
) : null,
28+
_react2.default.createElement(
29+
"li",
30+
{ className: (props.isFirst ? "disabled " : "") + "page-item" },
31+
_react2.default.createElement(
32+
"a",
33+
{ href: "#", className: "page-link", tabIndex: "-1",
34+
onClick: props.previousPage },
35+
props.config.language.pagination.previous
36+
)
37+
),
38+
_react2.default.createElement(
39+
"li",
40+
{ className: "page-item" },
41+
_react2.default.createElement(
42+
"a",
43+
{ className: "page-link" },
44+
_react2.default.createElement("input", { style: {
45+
border: 'none',
46+
padding: '0',
47+
maxWidth: '30px',
48+
textAlign: 'center',
49+
display: 'inline-block'
50+
},
51+
type: "text",
52+
value: props.is_temp_page ? props.temp_page_number : props.page_number,
53+
onChange: function onChange(e) {
54+
return props.onPageChange(e, true);
55+
},
56+
onBlur: props.onPageBlur,
57+
onKeyDown: props.onPageChange })
58+
)
59+
),
60+
_react2.default.createElement(
61+
"li",
62+
{ className: (props.isLast ? "disabled " : "") + "page-item" },
63+
_react2.default.createElement(
64+
"a",
65+
{ href: "#", className: "page-link",
66+
onClick: props.nextPage },
67+
props.config.language.pagination.next
68+
)
69+
),
70+
props.config.show_last ? _react2.default.createElement(
71+
"li",
72+
{ className: (props.isLast ? "disabled " : "") + "page-item" },
73+
_react2.default.createElement(
74+
"a",
75+
{ href: "#", className: "page-link", tabIndex: "-1",
76+
onClick: props.lastPage },
77+
props.config.language.pagination.last
78+
)
79+
) : null
80+
);
81+
}

0 commit comments

Comments
 (0)