react-admin-base-bootstrap 0.7.4 → 0.7.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.
|
@@ -8,7 +8,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
|
|
|
8
8
|
});
|
|
9
9
|
};
|
|
10
10
|
import React, { useCallback, useContext, useEffect, useRef, useState } from 'react';
|
|
11
|
-
import { DataContextProvider, useAuth, useDataTable } from 'react-admin-base';
|
|
11
|
+
import { DataContextProvider, RefreshScope, useAuth, useDataTable } from 'react-admin-base';
|
|
12
12
|
import { FormattedMessage, useIntl } from "react-intl";
|
|
13
13
|
import { Link } from 'react-router-dom';
|
|
14
14
|
import { Alert, Button, Card, CardFooter, CardHeader, Col, Input, Row, Table } from 'reactstrap';
|
|
@@ -80,7 +80,7 @@ export function Column(props) {
|
|
|
80
80
|
export default function BootstrapTable({ url, bordered, noStrip, defaultParams, add, children, innerRef, body }) {
|
|
81
81
|
var state = useState(Object.assign({ sort: 'id' }, defaultParams));
|
|
82
82
|
const [params, setParams] = state;
|
|
83
|
-
const [page, lastPage, setPage, data, itemPerPage, setItemPerPage] = useDataTable(url, params, body);
|
|
83
|
+
const [page, lastPage, setPage, data, itemPerPage, setItemPerPage, update] = useDataTable(url, params, body);
|
|
84
84
|
const intl = useIntl();
|
|
85
85
|
const [api] = useAuth();
|
|
86
86
|
var ref = useRef(defaultParams);
|
|
@@ -111,31 +111,32 @@ export default function BootstrapTable({ url, bordered, noStrip, defaultParams,
|
|
|
111
111
|
return React.createElement(Card, null,
|
|
112
112
|
React.createElement(DataTableContext.Provider, { value: state },
|
|
113
113
|
React.createElement(DataContextProvider, { value: fetchData },
|
|
114
|
-
React.createElement(
|
|
115
|
-
React.createElement(
|
|
116
|
-
|
|
117
|
-
React.createElement(
|
|
118
|
-
React.createElement(
|
|
119
|
-
|
|
120
|
-
React.createElement(
|
|
121
|
-
React.createElement(
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
React.createElement(
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
React.createElement(
|
|
140
|
-
React.createElement(
|
|
114
|
+
React.createElement(RefreshScope, { update: update },
|
|
115
|
+
React.createElement(CardHeader, null,
|
|
116
|
+
React.createElement(Row, null,
|
|
117
|
+
add && React.createElement(Col, { xs: "12", md: "2" },
|
|
118
|
+
React.createElement(Link, { to: add, className: "btn btn-primary font-xl d-block" },
|
|
119
|
+
React.createElement("i", { className: "fa fa-plus" }))),
|
|
120
|
+
React.createElement(Col, { md: "2" },
|
|
121
|
+
React.createElement(Input, { type: "select", value: itemPerPage.toString(), onChange: a => setItemPerPage(+a.currentTarget.value) },
|
|
122
|
+
React.createElement("option", { value: "1" }, "1"),
|
|
123
|
+
React.createElement("option", { value: "20" }, "20"),
|
|
124
|
+
React.createElement("option", { value: "50" }, "50"),
|
|
125
|
+
React.createElement("option", { value: "100" }, "100"),
|
|
126
|
+
React.createElement("option", { value: "150" }, "150"),
|
|
127
|
+
React.createElement("option", { value: "200" }, "200"),
|
|
128
|
+
React.createElement("option", { value: "-1" }, intl.formatMessage({ id: "ALL" })))),
|
|
129
|
+
children[2],
|
|
130
|
+
React.createElement(Col, { md: "3", className: "ms-auto" },
|
|
131
|
+
React.createElement(Input, { placeholder: intl.formatMessage({ id: "SEARCH" }), type: "text", value: params.query || '', onChange: e => setParams(Object.assign(Object.assign({}, params), { query: e.currentTarget.value })) })))),
|
|
132
|
+
data === null ? React.createElement(Alert, { className: "text-center mb-0 mx-3 ", color: "warning" },
|
|
133
|
+
React.createElement("i", { className: "fas fa-spinner fa-spin" })) : !data.length ? React.createElement(Alert, { className: "text-center mx-3", color: "danger" },
|
|
134
|
+
React.createElement("i", { className: "far fa-times-circle" }),
|
|
135
|
+
" ",
|
|
136
|
+
React.createElement(FormattedMessage, { id: "NO_DATA_IS_AVAILABLE" })) : React.createElement(Table, { hover: true, bordered: bordered, striped: !noStrip, responsive: true, size: "md", className: "mb-0 dataTable" },
|
|
137
|
+
children[0],
|
|
138
|
+
React.createElement("tbody", null, data && data.map(children[1].props.children))),
|
|
139
|
+
lastPage > 1 && React.createElement(CardFooter, null,
|
|
140
|
+
React.createElement("nav", null,
|
|
141
|
+
React.createElement(BootstrapPagination, { currentPage: page, pageCount: lastPage, onPageChange: index => setPage(index) })))))));
|
|
141
142
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-admin-base-bootstrap",
|
|
3
|
-
"version": "0.7.
|
|
3
|
+
"version": "0.7.5",
|
|
4
4
|
"description": "",
|
|
5
5
|
"scripts": {
|
|
6
6
|
"test": "echo \"Error: no test specified\" && exit 1",
|
|
@@ -37,7 +37,7 @@
|
|
|
37
37
|
"modal-cropper": "^1.2.3",
|
|
38
38
|
"nprogress": "^0.2.0",
|
|
39
39
|
"prettysize": "^2.0.0",
|
|
40
|
-
"react-admin-base": "^0.7.
|
|
40
|
+
"react-admin-base": "^0.7.2",
|
|
41
41
|
"react-responsive": "^8.2.0",
|
|
42
42
|
"react-select": "^5.2.2",
|
|
43
43
|
"reactstrap": "^9.0.1",
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React, { useCallback, useContext, useEffect, useRef, useState } from 'react';
|
|
2
|
-
import { DataContextProvider, useAuth, useDataTable } from 'react-admin-base';
|
|
2
|
+
import { DataContextProvider, RefreshScope, useAuth, useDataTable } from 'react-admin-base';
|
|
3
3
|
import { FormattedMessage, useIntl } from "react-intl";
|
|
4
4
|
import { Link } from 'react-router-dom';
|
|
5
5
|
import { Alert, Button, Card, CardFooter, CardHeader, Col, Input, Row, Table } from 'reactstrap';
|
|
@@ -77,7 +77,7 @@ export function Column(props) {
|
|
|
77
77
|
export default function BootstrapTable({url, bordered, noStrip, defaultParams, add, children, innerRef, body}: any) {
|
|
78
78
|
var state = useState({sort: 'id', ...defaultParams});
|
|
79
79
|
const [params, setParams] = state;
|
|
80
|
-
const [page, lastPage, setPage, data, itemPerPage, setItemPerPage] = useDataTable(url, params, body);
|
|
80
|
+
const [page, lastPage, setPage, data, itemPerPage, setItemPerPage, update] = useDataTable(url, params, body);
|
|
81
81
|
const intl = useIntl();
|
|
82
82
|
const [ api ] = useAuth();
|
|
83
83
|
|
|
@@ -98,7 +98,7 @@ export default function BootstrapTable({url, bordered, noStrip, defaultParams, a
|
|
|
98
98
|
};
|
|
99
99
|
}
|
|
100
100
|
}, [setParams, innerRef]);
|
|
101
|
-
|
|
101
|
+
|
|
102
102
|
const fetchData = useCallback(async function(extraParams) {
|
|
103
103
|
if (body) {
|
|
104
104
|
const data = await api.tokenized.post(url, body, { params: { ...params, ...(extraParams || {}) } });
|
|
@@ -112,47 +112,49 @@ export default function BootstrapTable({url, bordered, noStrip, defaultParams, a
|
|
|
112
112
|
return <Card>
|
|
113
113
|
<DataTableContext.Provider value={state}>
|
|
114
114
|
<DataContextProvider value={fetchData}>
|
|
115
|
-
<
|
|
116
|
-
<
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
<
|
|
120
|
-
<
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
<
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
115
|
+
<RefreshScope update={update}>
|
|
116
|
+
<CardHeader>
|
|
117
|
+
<Row>
|
|
118
|
+
{add && <Col xs="12" md="2"><Link to={add} className="btn btn-primary font-xl d-block"><i className="fa fa-plus"/></Link></Col>}
|
|
119
|
+
<Col md="2">
|
|
120
|
+
<Input type="select" value={itemPerPage.toString()} onChange={a => setItemPerPage(+a.currentTarget.value)}>
|
|
121
|
+
<option value="1">1</option>
|
|
122
|
+
<option value="20">20</option>
|
|
123
|
+
<option value="50">50</option>
|
|
124
|
+
<option value="100">100</option>
|
|
125
|
+
<option value="150">150</option>
|
|
126
|
+
<option value="200">200</option>
|
|
127
|
+
<option value="-1">{intl.formatMessage({id: "ALL"})}</option>
|
|
128
|
+
</Input>
|
|
129
|
+
</Col>
|
|
130
|
+
{children[2]}
|
|
131
|
+
<Col md="3" className="ms-auto">
|
|
132
|
+
<Input
|
|
133
|
+
placeholder={intl.formatMessage({id: "SEARCH"})} type="text"
|
|
134
|
+
value={params.query || ''}
|
|
135
|
+
onChange={e => setParams({...params, query: e.currentTarget.value})}
|
|
136
|
+
/>
|
|
137
|
+
</Col>
|
|
138
|
+
</Row>
|
|
139
|
+
</CardHeader>
|
|
140
|
+
{data === null ? <Alert className="text-center mb-0 mx-3 " color="warning"><i className="fas fa-spinner fa-spin"></i></Alert> : !data.length ? <Alert className="text-center mx-3" color="danger">
|
|
141
|
+
<i className="far fa-times-circle"></i> <FormattedMessage id="NO_DATA_IS_AVAILABLE"/>
|
|
142
|
+
</Alert> : <Table hover bordered={bordered} striped={!noStrip} responsive size="md" className="mb-0 dataTable">
|
|
143
|
+
{children[0]}
|
|
144
|
+
<tbody>
|
|
145
|
+
{data && data.map(children[1].props.children)}
|
|
146
|
+
</tbody>
|
|
147
|
+
</Table>}
|
|
148
|
+
{ lastPage > 1 && <CardFooter>
|
|
149
|
+
<nav>
|
|
150
|
+
<BootstrapPagination
|
|
151
|
+
currentPage={page}
|
|
152
|
+
pageCount={lastPage}
|
|
153
|
+
onPageChange={index => setPage(index)}
|
|
135
154
|
/>
|
|
136
|
-
</
|
|
137
|
-
</
|
|
138
|
-
</
|
|
139
|
-
{data === null ? <Alert className="text-center mb-0 mx-3 " color="warning"><i className="fas fa-spinner fa-spin"></i></Alert> : !data.length ? <Alert className="text-center mx-3" color="danger">
|
|
140
|
-
<i className="far fa-times-circle"></i> <FormattedMessage id="NO_DATA_IS_AVAILABLE"/>
|
|
141
|
-
</Alert> : <Table hover bordered={bordered} striped={!noStrip} responsive size="md" className="mb-0 dataTable">
|
|
142
|
-
{children[0]}
|
|
143
|
-
<tbody>
|
|
144
|
-
{data && data.map(children[1].props.children)}
|
|
145
|
-
</tbody>
|
|
146
|
-
</Table>}
|
|
147
|
-
{ lastPage > 1 && <CardFooter>
|
|
148
|
-
<nav>
|
|
149
|
-
<BootstrapPagination
|
|
150
|
-
currentPage={page}
|
|
151
|
-
pageCount={lastPage}
|
|
152
|
-
onPageChange={index => setPage(index)}
|
|
153
|
-
/>
|
|
154
|
-
</nav>
|
|
155
|
-
</CardFooter> }
|
|
155
|
+
</nav>
|
|
156
|
+
</CardFooter> }
|
|
157
|
+
</RefreshScope>
|
|
156
158
|
</DataContextProvider>
|
|
157
159
|
</DataTableContext.Provider>
|
|
158
160
|
</Card>;
|