Proyectos de Subversion LeadersLinked - Backend

Rev

Rev 15501 | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
14164 stevensc 1 
import React from 'react'
11938 stevensc 2 
import styled from 'styled-components'
15501 stevensc 3 
import Pagination from 'react-bootstrap/Pagination'
7458 stevensc 4 
 
15501 stevensc 5 
const StyledPagination = styled(Pagination)`
15502 stevensc 6 
  display: inline-flex;
15501 stevensc 7 
  flex-direction: ${props => props.isRow ? 'row' : 'column'} !important;
11938 stevensc 8 
`
7458 stevensc 9 
 
14164 stevensc 10 
const PaginationComponent = ({ pages = 1, currentActivePage = 1, onChangePage, isRow = true }) => {
11938 stevensc 11 
	const currentPage = currentActivePage
12 
	const nextPages = []
13 
	const previousPages = []
14 
	const maxPages = 5 > pages ? pages : 5
7458 stevensc 15 
 
11938 stevensc 16 
	const generateCurrentPages = () => {
17 
		let isPreviousOrNext = false
18 
		let pagesCont = 1
19 
		let nextPage = currentPage + 1
20 
		let previousPage = currentPage - 1
21 
		do {
22 
			if (isPreviousOrNext) {
23 
				// nextPage
24 
				if (nextPage <= pages) {
25 
					nextPages.push(nextPage)
26 
					nextPage++
27 
					pagesCont++
28 
				}
29 
				isPreviousOrNext = !isPreviousOrNext
30 
			} else {
31 
				// previousPage
32 
				if (previousPage > 0) {
33 
					previousPages.unshift(previousPage)
34 
					previousPage--
35 
					pagesCont++
36 
				}
37 
				isPreviousOrNext = !isPreviousOrNext
38 
			}
39 
		} while (pagesCont < maxPages)
40 
	}
7458 stevensc 41 
 
11938 stevensc 42 
	const previousPageHandler = () => {
43 
		onChangePage(currentPage - 1)
44 
	}
45 
	const nextPageHandler = () => {
46 
		onChangePage(currentPage + 1)
47 
	}
7458 stevensc 48 
 
11938 stevensc 49 
	const onClickHandler = (pageToNavigate) => {
50 
		onChangePage(pageToNavigate)
51 
	}
7458 stevensc 52 
 
11938 stevensc 53 
	generateCurrentPages()
15500 stevensc 54 
 
55 
	if (pages <= 1) return null
56 
 
11938 stevensc 57 
	return (
15501 stevensc 58 
		<StyledPagination isRow={isRow}>
14164 stevensc 59 
			<Pagination.Prev
60 
				disabled={currentPage - 1 <= 0}
61 
				onClick={previousPageHandler}
15500 stevensc 62 
			>
63 
				Anterior
64 
			</Pagination.Prev>
14164 stevensc 65 
			{previousPages.map((previousPage) =>
66 
				<Pagination.Item
67 
					key={previousPage}
68 
					onClick={() => onClickHandler(previousPage)}
69 
				>
70 
					{previousPage}
71 
				</Pagination.Item>
11938 stevensc 72 
			)}
14164 stevensc 73 
			<Pagination.Item active>{currentPage}</Pagination.Item>
74 
			{nextPages.map((nextPage) =>
75 
				<Pagination.Item
76 
					key={nextPage}
77 
					onClick={() => onClickHandler(nextPage)}
78 
				>
79 
					{nextPage}
80 
				</Pagination.Item>
81 
			)}
82 
			<Pagination.Next
15500 stevensc 83 
				disabled={currentPage + 1 > pages}
14164 stevensc 84 
				onClick={nextPageHandler}
15500 stevensc 85 
			>
86 
				Siguiente
87 
			</Pagination.Next>
14164 stevensc 88 
		</StyledPagination>
11938 stevensc 89 
	)
90 
}
7458 stevensc 91 
 
11938 stevensc 92 
export default PaginationComponent