make page buttons on home page usable

This commit is contained in:
b1ek 2023-05-12 09:39:54 +10:00
parent 9790e4b70a
commit bd15e49dea
Signed by: blek
GPG Key ID: 14546221E3595D0C
2 changed files with 12 additions and 26 deletions

View File

@ -24,12 +24,14 @@ const ListElement = styled.li`
export default function ApartmentsList(props) {
const list = props.list;
if (list.length == 0) return null;
return (
<ul>
{
list.map((el, i) => {
return (
<ListElement>
<ListElement key={i}>
<CardApartment results={el} />
</ListElement>
);

View File

@ -343,7 +343,7 @@ export default class IndexPage extends React.Component {
this.state = {
apartments: [],
pageSize: 10,
page: 0,
page: 10,
data_loaded: false,
load_err: false,
loading_filters: false
@ -387,25 +387,7 @@ export default class IndexPage extends React.Component {
return (
<IndexPageRoot>
{/* <Swiper
spaceBetween={4}
style={{ width: 1150, height: 200, borderRadius: 20 }}
modules={[ Scrollbar, Navigation ]}
scrollbar={{ enabled: true, draggable: true }}
navigation={{ enabled: true }}
loop={ true }
autoplay={{ delay: 7 }}
>
<SwiperSlide>
<SwiperImage src='/images/house-s.jpg' />
</SwiperSlide>
<SwiperSlide>
<SwiperImage src='/images/house-s-2.jpg' />
</SwiperSlide>
</Swiper> */}
<IndexPageRoot>
<SliderContainer>
<AwesomeSlider cssModule={AwsSliderStyles} bullets={false}>
<div data-src='/images/house-s.jpg' />
@ -442,17 +424,19 @@ export default class IndexPage extends React.Component {
{
pages != 0 ?
[...Array(pages)].map((_, i) => {
if (i > 3 && i != pageSize - 1) {
if (i == 4)
return <PageButton>...</PageButton>;
return null;
if (i > (pages / 4) & i < (pages - (pages / 4)) && i != 0 && i != pages) {
if (!(i == page + 1 | i == page - 1 | i == page)) {
if (i == Math.floor((pages / 2)))
return <PageButton disabled>...</PageButton>;
return null;
}
}
if (i == page)
return <CurrentPage>{i + 1}</CurrentPage>
return (
<PageButton>{i + 1}</PageButton>
<PageButton onClick={() => this.setState({page: i})}>{i + 1}</PageButton>
);
}) :
null