AdOne.js 2.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748
  1. import React from "react";
  2. import { Container } from "react-bootstrap";
  3. import { Carousel } from 'react-responsive-carousel';
  4. import nofoto from '../images/placeholder.png'
  5. import "react-responsive-carousel/lib/styles/carousel.min.css";
  6. export const AdOne=({price, title,description,images,comments,createdAt,owner}) => {
  7. function timeConverter(t){
  8. let a = new Date(+t);
  9. let months = ['Января','Февраля','Марта','Апреля','Мая','Июня','Июля','Августа','Сентября','Октября','Ноября','Декабря'];
  10. let year = a.getFullYear();
  11. let month = months[a.getMonth()];
  12. let date = a.getDate();
  13. let hour = a.getHours();
  14. let min = a.getMinutes();
  15. let sec = a.getSeconds();
  16. let time = date + ' ' + month + ' ' + year + ' в ' + hour + ':' + min ;
  17. return time;
  18. }
  19. return (
  20. <Container>
  21. <div className='AdPage '>
  22. <Carousel className='carousel' infiniteLoop useKeyboardArrows showStatus={false} showThumbs={false} >
  23. {images? images.map(image =>
  24. <img src = {`http://marketplace.asmer.fs.a-level.com.ua/${image.url}`} />
  25. ): <img src={nofoto} />}
  26. </Carousel>
  27. <div className='mainInfo'>
  28. <p>{`Опубликовано: ${timeConverter(createdAt)}`}</p>
  29. <b>{title}</b>
  30. <h4>{`${price ? price : "0"} грн.`}</h4>
  31. <p>{description}</p>
  32. <p>{`Владелец: ${owner.login}`}</p>
  33. <p>{`На marketplace c: ${timeConverter(owner.createdAt)}`}</p>
  34. </div>
  35. <div className='mainInfo'>
  36. {comments ?
  37. comments.map(comment => {
  38. return (<div><p>{`Коментарии : ${comment.text}`}</p>
  39. <p>{`От: ${comment.owner.login}`}</p></div>)})
  40. : <p>Коментариев нет</p>
  41. }
  42. </div>
  43. </div>
  44. </Container>
  45. )
  46. }