liz/PluralKit
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Tweak pagination

Browse Source
This commit is contained in:
Spectralitree
2020-12-13 12:14:33 +01:00
parent 2afa1c5fdf
commit 5cb90ba2c3
3 changed files with 11 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/Components/MemberCard.js
View File

@@ -347,7 +347,7 @@ export default function MemberCard(props) {
</BS.InputGroup>
</BS.Form.Row>
</BS.Col>
))} <BS.Col className="mb-lg-2" xs={12} lg={2}><BS.Button block variant="light" onClick={() => addProxyField()}>Add new</BS.Button></BS.Col>
))} <BS.Col className="mb-2" xs={12} lg={2}><BS.Button block variant="light" onClick={() => addProxyField()}>Add new</BS.Button></BS.Col>
</BS.Form.Row>
<BS.Button variant="light" onClick={() => resetProxyFields()}>Exit</BS.Button> <BS.Button variant="primary" type="submit">Submit</BS.Button>
</BS.Form><hr/></> : proxyView ?

19
src/Components/Memberlist.js
View File

@@ -70,8 +70,6 @@ export default function Memberlist(props) {
const newdata = data.proxy_tags ? {...data, proxy_tags: data.proxy_tags.filter(tag => !(tag.prefix === "" && tag.suffix === ""))} : data
console.log(newdata);
fetch(`${API_URL}m/`,{
method: 'POST',
body: JSON.stringify(newdata),
@@ -100,10 +98,11 @@ export default function Memberlist(props) {
return false;
}).sort((a, b) => a.name.localeCompare(b.name)).slice(indexOfFirstMember, indexOfLastMember);
const active = currentPage;
const pageAmount = Math.ceil(members.length / membersPerPage);
const pageNumbers = [];
for ( let i = currentPage; (i <= currentPage + 3) && (i < pageAmount); i++ ) {
for ( let i = currentPage; (i <= currentPage + 1) && (i < pageAmount); i++ ) {
pageNumbers.push(
<BS.Pagination.Item key={i} onClick={() => setCurrentPage(i)} active={i === active}>{i}</BS.Pagination.Item>
);
@@ -126,7 +125,10 @@ export default function Memberlist(props) {
<BS.Form>
<BS.InputGroup className="mb-3">
<BS.Form.Control disabled placeholder='Page length:'/>
<BS.Form.Control as="select" onChange={e => setMembersPerPage(e.target.value)}>
<BS.Form.Control as="select" onChange={e => {
setMembersPerPage(e.target.value);
setCurrentPage(1);
}}>
<option>10</option>
<option selected>25</option>
<option>50</option>
@@ -137,7 +139,7 @@ export default function Memberlist(props) {
</BS.Col>
<BS.Col className="ml-lg-2 mb-3" xs={12} lg={4}>
<BS.Form>
<BS.Form.Control value={value} onChange={e => setValue(e.target.value)} placeholder="Search"/>
<BS.Form.Control value={value} onChange={e => {setValue(e.target.value); setCurrentPage(1)}} placeholder="Search"/>
</BS.Form>
</BS.Col>
<BS.Col className="ml-lg-2 mb-3" xs={12} lg={1}>
@@ -146,17 +148,14 @@ export default function Memberlist(props) {
</BS.Row>
<BS.Row className="justify-content-md-center">
<BS.Pagination className="ml-auto mr-auto">
<BS.Pagination.First onClick={() => setCurrentPage(1)} />
<BS.Pagination.Prev onClick={() => setCurrentPage(currentPage - 1)} />
{ currentPage === 1 ? <BS.Pagination.Prev disabled/> : <BS.Pagination.Prev onClick={() => setCurrentPage(currentPage - 1)} />}
<BS.Pagination.Item onClick={() => setCurrentPage(1)} active={1 === active}>{1}</BS.Pagination.Item>
<BS.Pagination.Ellipsis />
{ currentPage > 2 ? <BS.Pagination.Item onClick={() => setCurrentPage(currentPage - 2)} active={currentPage - 2 === active}>{currentPage - 2}</BS.Pagination.Item> : "" }
{ currentPage > 1 ? <BS.Pagination.Item onClick={() => setCurrentPage(currentPage - 1)} active={currentPage - 1 === active}>{currentPage - 1}</BS.Pagination.Item> : "" }
{pageNumbers}
<BS.Pagination.Ellipsis />
<BS.Pagination.Item onClick={() => setCurrentPage(pageAmount)} active={pageAmount === active}>{pageAmount}</BS.Pagination.Item>
<BS.Pagination.Next onClick={() => setCurrentPage(currentPage + 1)} />
<BS.Pagination.Last onClick={() => setCurrentPage(pageAmount)} />
{ currentPage === pageAmount ? <BS.Pagination.Next disabled /> :<BS.Pagination.Next onClick={() => setCurrentPage(currentPage + 1)} />}
</BS.Pagination>
</BS.Row>
<BS.Card className="w-100">