83 lines
2.7 KiB
JavaScript
83 lines
2.7 KiB
JavaScript
import React from 'react';
|
||
import './style.css'
|
||
import styled from 'styled-components';
|
||
// import { HttpApiMethods } from '../utils/FetchUtils';
|
||
import {useState} from 'react'
|
||
import EditMeetsForm from '../edit/EditMeetsForm';
|
||
import Grid from '@mui/material/Grid';
|
||
// import Card from '../Card';
|
||
import Box from '@mui/material/Box';
|
||
|
||
|
||
|
||
function extractDateTime(dateString) {
|
||
const dateTime = new Date(dateString);
|
||
const date = dateTime.toLocaleDateString();
|
||
const time = dateTime.toLocaleTimeString();
|
||
|
||
return { date, time };
|
||
}
|
||
|
||
const httpApiMethods = new HttpApiMethods()
|
||
|
||
const meets = await httpApiMethods.GetMeetings()
|
||
|
||
|
||
|
||
export const MeetsGetByID = () => {
|
||
return (
|
||
<div>
|
||
|
||
</div>
|
||
);
|
||
}
|
||
|
||
const GetMeets = () => {
|
||
const [count, setCount] = useState(7)
|
||
|
||
const filterMeet = meets.filter( (item, index) => index <= count )
|
||
const allMeets = () => {
|
||
setCount(meets.length)
|
||
}
|
||
return (
|
||
<>
|
||
<Box sx={{ flexGrow: 1, display: 'flex', justifyContent: 'flex-end', alignItems:'center'}}>
|
||
<Grid container sx={{width: '96%'}}>
|
||
|
||
|
||
{Array.isArray(meets) ? (
|
||
filterMeet.map((item, index) => (
|
||
|
||
|
||
<Grid item sm={6} xl={3} md={6} lg={4} key={index}>
|
||
<div className='event_card' >
|
||
<div className="event-card__photo"><img className='img' src={httpApiMethods.APIURL_FILES + item.speackerImage} alt="{item.speackerImage}" /></div>
|
||
<div className="taggs">
|
||
<div className='tagged'>{item.tags}</div>
|
||
<div className="feautures">{item.type}</div>
|
||
</div>
|
||
<h4 className="event-card__title">{item.title}</h4>
|
||
<p className="event-card__date">{extractDateTime(item.time).date}, в {extractDateTime(item.time).time} по Московскому времени</p>
|
||
</div>
|
||
</Grid>
|
||
|
||
|
||
|
||
))
|
||
) : (
|
||
<p>Неверный тип данных с сервера!</p>
|
||
)}
|
||
{/* <EditForm></EditForm> */}
|
||
</Grid>
|
||
</Box>
|
||
<div className='allButton__container'>
|
||
<button onClick={allMeets} className='allButton'>Все мероприятия</button>
|
||
</div>
|
||
</>
|
||
|
||
|
||
);
|
||
}
|
||
|
||
export default GetMeets;
|