| } | } | ||||
| } | } | ||||
| }, | }, | ||||
| "classnames": { | |||||
| "version": "2.3.1", | |||||
| "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.3.1.tgz", | |||||
| "integrity": "sha512-OlQdbZ7gLfGarSqxesMesDa5uz7KFbID8Kpq/SxIoNGDqY8lSYs0D+hhtBXhcdB3rcbXArFr7vlHheLk1voeNA==" | |||||
| }, | |||||
| "clean-css": { | "clean-css": { | ||||
| "version": "4.2.3", | "version": "4.2.3", | ||||
| "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.2.3.tgz", | "resolved": "https://registry.npmjs.org/clean-css/-/clean-css-4.2.3.tgz", | ||||
| "csstype": "^3.0.2" | "csstype": "^3.0.2" | ||||
| } | } | ||||
| }, | }, | ||||
| "dom-scroll-into-view": { | |||||
| "version": "1.0.1", | |||||
| "resolved": "https://registry.npmjs.org/dom-scroll-into-view/-/dom-scroll-into-view-1.0.1.tgz", | |||||
| "integrity": "sha1-Mqu5Lw2P7KYhUWKu9D5LRJq42Zw=" | |||||
| }, | |||||
| "dom-serializer": { | "dom-serializer": { | ||||
| "version": "0.2.2", | "version": "0.2.2", | ||||
| "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-0.2.2.tgz", | "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-0.2.2.tgz", | ||||
| "whatwg-fetch": "^3.4.1" | "whatwg-fetch": "^3.4.1" | ||||
| } | } | ||||
| }, | }, | ||||
| "react-autocomplete": { | |||||
| "version": "1.8.1", | |||||
| "resolved": "https://registry.npmjs.org/react-autocomplete/-/react-autocomplete-1.8.1.tgz", | |||||
| "integrity": "sha1-67vEAABqqRrVOLLRRye55+XQYxA=", | |||||
| "requires": { | |||||
| "dom-scroll-into-view": "1.0.1", | |||||
| "prop-types": "^15.5.10" | |||||
| } | |||||
| }, | |||||
| "react-dev-utils": { | "react-dev-utils": { | ||||
| "version": "11.0.4", | "version": "11.0.4", | ||||
| "resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-11.0.4.tgz", | "resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-11.0.4.tgz", | ||||
| "scheduler": "^0.20.2" | "scheduler": "^0.20.2" | ||||
| } | } | ||||
| }, | }, | ||||
| "react-easy-swipe": { | |||||
| "version": "0.0.21", | |||||
| "resolved": "https://registry.npmjs.org/react-easy-swipe/-/react-easy-swipe-0.0.21.tgz", | |||||
| "integrity": "sha512-OeR2jAxdoqUMHIn/nS9fgreI5hSpgGoL5ezdal4+oO7YSSgJR8ga+PkYGJrSrJ9MKlPcQjMQXnketrD7WNmNsg==", | |||||
| "requires": { | |||||
| "prop-types": "^15.5.8" | |||||
| } | |||||
| }, | |||||
| "react-error-overlay": { | "react-error-overlay": { | ||||
| "version": "6.0.9", | "version": "6.0.9", | ||||
| "resolved": "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-6.0.9.tgz", | "resolved": "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-6.0.9.tgz", | ||||
| "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.8.3.tgz", | "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.8.3.tgz", | ||||
| "integrity": "sha512-X8jZHc7nCMjaCqoU+V2I0cOhNW+QMBwSUkeXnTi8IPe6zaRWfn60ZzvFDZqWPfmSJfjub7dDW1SP0jaHWLu/hg==" | "integrity": "sha512-X8jZHc7nCMjaCqoU+V2I0cOhNW+QMBwSUkeXnTi8IPe6zaRWfn60ZzvFDZqWPfmSJfjub7dDW1SP0jaHWLu/hg==" | ||||
| }, | }, | ||||
| "react-responsive-carousel": { | |||||
| "version": "3.2.19", | |||||
| "resolved": "https://registry.npmjs.org/react-responsive-carousel/-/react-responsive-carousel-3.2.19.tgz", | |||||
| "integrity": "sha512-lOO6CscsxnQoNnrmLXNXu7u3U0znY44jGloX9Zayki9+OdUs63YXypSgV7dzaTmlem4SXy4rIXBR8+gjA9zyxg==", | |||||
| "requires": { | |||||
| "classnames": "^2.2.5", | |||||
| "prop-types": "^15.5.8", | |||||
| "react-easy-swipe": "^0.0.21" | |||||
| } | |||||
| }, | |||||
| "react-router": { | "react-router": { | ||||
| "version": "5.2.0", | "version": "5.2.0", | ||||
| "resolved": "https://registry.npmjs.org/react-router/-/react-router-5.2.0.tgz", | "resolved": "https://registry.npmjs.org/react-router/-/react-router-5.2.0.tgz", |
| "react-helmet-async": "^1.0.9", | "react-helmet-async": "^1.0.9", | ||||
| "react-i18next": "^11.10.0", | "react-i18next": "^11.10.0", | ||||
| "react-redux": "^7.2.4", | "react-redux": "^7.2.4", | ||||
| "react-responsive-carousel": "^3.2.19", | |||||
| "react-router-dom": "^5.2.0", | "react-router-dom": "^5.2.0", | ||||
| "react-scripts": "4.0.3", | "react-scripts": "4.0.3", | ||||
| "react-select": "^4.3.1", | "react-select": "^4.3.1", |
| <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700" rel="stylesheet"> | <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700" rel="stylesheet"> | ||||
| <title>React App</title> | <title>React App</title> | ||||
| </head> | </head> | ||||
| <body class="hold-transition sidebar-mini layout-fixed"> | |||||
| <body class="sidebar-collapse layout-top-nav" data-new-gr-c-s-check-loaded="14.1020.0" data-gr-ext-installed="" style="height: auto;"> | |||||
| <noscript>You need to enable JavaScript to run this app.</noscript> | <noscript>You need to enable JavaScript to run this app.</noscript> | ||||
| <div id="root"></div> | |||||
| <div class="wrapper"> | |||||
| <div id="root"></div> | |||||
| </div> | |||||
| <!-- | <!-- | ||||
| This HTML file is a template. | This HTML file is a template. | ||||
| If you open it directly in the browser, you will see an empty page. | If you open it directly in the browser, you will see an empty page. |
| import { Helmet } from 'react-helmet-async'; | import { Helmet } from 'react-helmet-async'; | ||||
| import i18next from 'i18next'; | import i18next from 'i18next'; | ||||
| import history from './store/utils/history'; | import history from './store/utils/history'; | ||||
| //import Header from './components/Header/Header'; | |||||
| import "react-responsive-carousel/lib/styles/carousel.min.css"; | |||||
| // import Header from './components/Header/Header'; | // import Header from './components/Header/Header'; | ||||
| // import Sidebar from './components/Sidebar/Sidebar'; | // import Sidebar from './components/Sidebar/Sidebar'; | ||||
| import AppRoutes from './AppRoutes'; | import AppRoutes from './AppRoutes'; | ||||
| {i18next.t('app.title')} | {i18next.t('app.title')} | ||||
| </title> | </title> | ||||
| </Helmet> | </Helmet> | ||||
| <> | |||||
| {/* <Header /> */} | |||||
| {/* <Sidebar /> */} | |||||
| <AppRoutes /> | |||||
| </> | |||||
| <> | |||||
| {/* <Header /> */} | |||||
| {/* <Sidebar /> */} | |||||
| <AppRoutes /> | |||||
| </> | |||||
| </Router> | </Router> | ||||
| ); | ); |
| .cursor-pointer | .cursor-pointer | ||||
| { | { | ||||
| cursor: pointer; | cursor: pointer; | ||||
| } | |||||
| a{ | |||||
| color: #007bff!important; | |||||
| cursor: pointer; | |||||
| } | |||||
| h1{ | |||||
| font-size: 80px!important; | |||||
| } | } |
| import React from 'react'; | |||||
| import PropTypes from 'prop-types'; | |||||
| import getHours from '../../helpers/GetTodaysWorkingHours'; | |||||
| import CardPrice from '../CardPrice/CardPrice'; | |||||
| import './CardApartments.scss'; | |||||
| const CardApartments = ({result, index}) => { | |||||
| const carouselId = "carouselExampleIndicators".concat(index); | |||||
| const carouselIndicator = "#".concat(carouselId); | |||||
| const pricesId = "prices".concat(index); | |||||
| const pricesIndicatord = "#".concat(pricesId); | |||||
| return( | |||||
| <> | |||||
| { | |||||
| console.log(result) | |||||
| } | |||||
| <div className="card"> | |||||
| <div className="card-body"> | |||||
| {result.lastUpdate !=undefined ? | |||||
| <div className="ribbon-wrapper ribbon-lg"> | |||||
| <div className="ribbon bg-primary"> | |||||
| {result.lastUpdate} | |||||
| </div> | |||||
| </div> :'' | |||||
| } | |||||
| <div className="row"> | |||||
| <div className="col-md-4"> | |||||
| <div id={carouselId} className="carousel slide" data-ride="carousel"> | |||||
| <ol className="carousel-indicators"> | |||||
| {result.images.map((image, i) => | |||||
| (image !== undefined && image.src !==undefined ? | |||||
| i === 1 ? | |||||
| <li data-target={carouselIndicator} data-slide-to={i} className="active"></li> | |||||
| : | |||||
| <li data-target={carouselIndicator} data-slide-to={i} className=""></li> | |||||
| :"" | |||||
| ))} | |||||
| </ol> | |||||
| <div className="carousel-inner"> | |||||
| { | |||||
| result.images.map((image, i) => | |||||
| (image !== undefined && image.src !== undefined ? | |||||
| i === 0 ? | |||||
| <div className="carousel-item active" key={i} > | |||||
| <img height="269px" className="d-block w-100" | |||||
| src={image.src} | |||||
| alt= {i} /> | |||||
| </div> | |||||
| : | |||||
| <div className="carousel-item" key={i} > | |||||
| <img height="269px" className="d-block w-100" | |||||
| src={image.src} | |||||
| alt= {i} /> | |||||
| </div> | |||||
| :'') | |||||
| ) | |||||
| } | |||||
| </div> | |||||
| <a className="carousel-control-prev" href={carouselIndicator} role="button" | |||||
| data-slide="prev"> | |||||
| <span className="carousel-control-custom-icon" aria-hidden="true"> | |||||
| <i className="fas fa-chevron-left"></i> | |||||
| </span> | |||||
| <span className="sr-only">Previous</span> | |||||
| </a> | |||||
| <a className="carousel-control-next" href={carouselIndicator} role="button" | |||||
| data-slide="next"> | |||||
| <span className="carousel-control-custom-icon" aria-hidden="true"> | |||||
| <i className="fas fa-chevron-right"></i> | |||||
| </span> | |||||
| <span className="sr-only">Next</span> | |||||
| </a> | |||||
| </div> | |||||
| </div> | |||||
| <div className="col-md-8"> | |||||
| {result.name !== undefined ? <h2><a>{result.name} | |||||
| </a> | |||||
| {result.contact != undefined && result.contact.officeHours && getHours(result.contact.officeHours) !== null ? <span className="text-black-50 text-sm"><i className="fas fa-clock"></i> Open { getHours(result.contact.officeHours)} Today</span>: '' } | |||||
| </h2>: ''} | |||||
| {result.address != undefined ? | |||||
| <p className="lead"> | |||||
| {result.address.street !== undefined ? <span> {result.address.street}, </span>:''} | |||||
| {result.address.city !== undefined ? <span> {result.address.city}, </span>:''} | |||||
| {result.address.zip !== undefined ? <span> {result.address.zip.code} {result.address.zip.state}</span>:''} | |||||
| </p> | |||||
| : ''} | |||||
| <h3 className="strong"> | |||||
| <span>{result.rentInfo !=undefined ? result.rentInfo:'' } </span> | |||||
| <a className="text-sm" data-toggle="collapse" href={pricesIndicatord} role="button" aria-expanded="true" aria-controls="collapseExample"> | |||||
| view all prices | |||||
| </a> | |||||
| </h3> | |||||
| <p className="card-text mb-1"> | |||||
| {result.description !== undefined ? result.description.substr(0,100) + "..." : ''} | |||||
| </p> | |||||
| <div className="row"> | |||||
| <div className="col-md-8"> | |||||
| <div className="row"> | |||||
| <div className="col"> | |||||
| { | |||||
| result.features.map((feature, i) => <p key={i} className="badge badge-primary">{feature}</p>) | |||||
| } | |||||
| </div> | |||||
| </div> | |||||
| <div className="row"> | |||||
| { result.contact !== undefined && result.contact.phone != undefined ? <span className="mr-3 lead"><i className="fas fa-phone">{result.contact.phone}</i></span> : ''} | |||||
| { result.contact !== undefined && result.contact.url !== undefined ? <span className="mr-3 lead"><a href={result.contact.url}><i className="fas fa-external-link-square-alt"></i> View property site</a></span>: '' } | |||||
| </div> | |||||
| </div> | |||||
| <div className="col-md-3"> | |||||
| <div className="info-box mb-0"> | |||||
| <span className="info-box-icon bg-danger"><i className="far fa-star"></i></span> | |||||
| {result.review != undefined ? | |||||
| <div className="info-box-content"> | |||||
| <span className="info-box-text">Review</span> | |||||
| <span className="info-box-number">{result.review} stars</span> | |||||
| </div> | |||||
| :''} | |||||
| </div> | |||||
| </div> | |||||
| </div> | |||||
| </div> | |||||
| </div> | |||||
| {/* { (result.prices !== undefined && result.prices.length > 0) ? */} | |||||
| <div className="collapse" id={pricesId} > | |||||
| <hr /> | |||||
| <div className="row"> | |||||
| { result.prices.map((price,index) => <CardPrice key={index} info={price} />) } | |||||
| </div> | |||||
| </div> | |||||
| {/* :'' */} | |||||
| </div> | |||||
| </div> | |||||
| </> | |||||
| ); | |||||
| } | |||||
| CardApartments.propTypes = { | |||||
| result: PropTypes.object, | |||||
| index : PropTypes.string | |||||
| } | |||||
| export default CardApartments; |
| .image-height | |||||
| { | |||||
| height: 269px; | |||||
| } | |||||
| .card-body | |||||
| { | |||||
| position: relative; | |||||
| } |
| import React from 'react'; | |||||
| import PropTypes from 'prop-types'; | |||||
| const CardHouses = ({result, index}) => { | |||||
| const carouselId = "carouselExampleIndicators".concat(index); | |||||
| const carouselIndicator = "#".concat(carouselId); | |||||
| return( | |||||
| <> | |||||
| { | |||||
| console.log("houses or condo") | |||||
| } | |||||
| <div className="card"> | |||||
| <div className="card-body"> | |||||
| {result.lastUpdate !=undefined ? | |||||
| <div className="ribbon-wrapper ribbon-lg"> | |||||
| <div className="ribbon bg-primary"> | |||||
| {result.lastUpdate} | |||||
| </div> | |||||
| </div> :'' | |||||
| } | |||||
| <div className="row"> | |||||
| <div className="col-md-4"> | |||||
| <div id={carouselId} className="carousel slide" data-ride="carousel"> | |||||
| <ol className="carousel-indicators"> | |||||
| {result.images.map((image, i) => | |||||
| (image !== undefined && image.src !==undefined ? | |||||
| i === 1 ? | |||||
| <li data-target={carouselIndicator} data-slide-to={i} className="active"></li> | |||||
| : | |||||
| <li data-target={carouselIndicator} data-slide-to={i} className=""></li> | |||||
| :"" | |||||
| ))} | |||||
| </ol> | |||||
| <div className="carousel-inner"> | |||||
| { | |||||
| result.images.map((image, i) => | |||||
| (image !== undefined && image.src !== undefined ? | |||||
| i === 0 ? | |||||
| <div className="carousel-item active" key={i} > | |||||
| <img height="269px" className="d-block w-100" | |||||
| src={image.src} | |||||
| alt= {i} /> | |||||
| </div> | |||||
| : | |||||
| <div className="carousel-item" key={i} > | |||||
| <img height="269px" className="d-block w-100" | |||||
| src={image.src} | |||||
| alt= {i} /> | |||||
| </div> | |||||
| :'') | |||||
| ) | |||||
| } | |||||
| </div> | |||||
| <a className="carousel-control-prev" href={carouselIndicator} role="button" | |||||
| data-slide="prev"> | |||||
| <span className="carousel-control-custom-icon" aria-hidden="true"> | |||||
| <i className="fas fa-chevron-left"></i> | |||||
| </span> | |||||
| <span className="sr-only">Previous</span> | |||||
| </a> | |||||
| <a className="carousel-control-next" href={carouselIndicator} role="button" | |||||
| data-slide="next"> | |||||
| <span className="carousel-control-custom-icon" aria-hidden="true"> | |||||
| <i className="fas fa-chevron-right"></i> | |||||
| </span> | |||||
| <span className="sr-only">Next</span> | |||||
| </a> | |||||
| </div> | |||||
| </div> | |||||
| <div className="col-md-8"> | |||||
| {result.name !== undefined ? <h2><a>{result.name} | |||||
| </a> | |||||
| </h2>: ''} | |||||
| {result.address != undefined ? | |||||
| <p className="lead"> | |||||
| {result.address.street !== undefined ? <span> {result.address.street}, </span>:''} | |||||
| {result.address.city !== undefined ? <span> {result.address.city}, </span>:''} | |||||
| {result.address.zip !== undefined ? <span> {result.address.zip.code} {result.address.zip.state}</span>:''} | |||||
| </p> | |||||
| : ''} | |||||
| {result.rentInfo !=undefined ? <h3 className="strong">{result.rentInfo}</h3>:'' } | |||||
| <p className="card-text mb-1"> | |||||
| {result.description !== undefined ? result.description.substr(0,100) + "..." : ''} | |||||
| </p> | |||||
| <div className="row"> | |||||
| <div className="col-md-8"> | |||||
| <div className="row"> | |||||
| <div className="col"> | |||||
| { | |||||
| result.features.map((feature, i) => <p key={i} className="badge badge-primary">{feature}</p>) | |||||
| } | |||||
| </div> | |||||
| </div> | |||||
| <div className="row"> | |||||
| { result.contact !== undefined && result.contact.phone != undefined ? <span className="mr-3 lead"><i className="fas fa-phone">{result.contact.phone}</i></span> : ''} | |||||
| { result.contact !== undefined && result.contact.agentFullName ? <span className="mr-3 lead"><i className="fas fa-user"></i>{result.contact.agentFullName}</span>: '' } | |||||
| </div> | |||||
| </div> | |||||
| </div> | |||||
| </div> | |||||
| </div> | |||||
| </div> | |||||
| </div> | |||||
| </> | |||||
| ); | |||||
| } | |||||
| CardHouses.propTypes = { | |||||
| result: PropTypes.object, | |||||
| index : PropTypes.string | |||||
| } | |||||
| export default CardHouses; |
| import React from 'react'; | |||||
| import PropTypes from 'prop-types'; | |||||
| const CardPrice = ({info}) => | |||||
| { | |||||
| return ( | |||||
| <div className="col-md-6"> | |||||
| {console.log(info)} | |||||
| <div className="card card-body"> | |||||
| <div className="row"> | |||||
| <div className="col-md-5"> | |||||
| {info.url !==undefined ? <img className="w-100" src={info.url} /> :''} | |||||
| </div> | |||||
| <div className="col-md-7"> | |||||
| <h2 className="">{(info.name != undefined? info.name:'') }</h2> | |||||
| <p className="lead mb-0">{(info.rent != undefined? info.rent:'') }</p><br /> | |||||
| <p className="text-muted"> | |||||
| <span>{info.details.rooms}, </span> | |||||
| <span>{info.details.baths}, </span> | |||||
| <span>{info.details.area}, </span> | |||||
| <span>{info.details.available}, </span> | |||||
| </p> | |||||
| </div> | |||||
| </div> | |||||
| </div> | |||||
| </div> | |||||
| ); | |||||
| } | |||||
| CardPrice.propTypes = { | |||||
| info: PropTypes.object, | |||||
| } | |||||
| export default CardPrice; |
| import React from 'react'; | |||||
| import PropTypes from 'prop-types'; | |||||
| const CardTownHouses = ({result, index}) => { | |||||
| const carouselId = "carouselExampleIndicators".concat(index); | |||||
| const carouselIndicator = "#".concat(carouselId); | |||||
| return( | |||||
| <> | |||||
| { | |||||
| console.log("town houses") | |||||
| } | |||||
| <div className="card"> | |||||
| <div className="card-body"> | |||||
| {result.lastUpdate !=undefined ? | |||||
| <div className="ribbon-wrapper ribbon-lg"> | |||||
| <div className="ribbon bg-primary"> | |||||
| {result.lastUpdate} | |||||
| </div> | |||||
| </div> :'' | |||||
| } | |||||
| <div className="row"> | |||||
| <div className="col-md-4"> | |||||
| <div id={carouselId} className="carousel slide" data-ride="carousel"> | |||||
| <ol className="carousel-indicators"> | |||||
| {result.images.map((image, i) => | |||||
| (image !== undefined && image.src !==undefined ? | |||||
| i === 1 ? | |||||
| <li data-target={carouselIndicator} data-slide-to={i} className="active"></li> | |||||
| : | |||||
| <li data-target={carouselIndicator} data-slide-to={i} className=""></li> | |||||
| :"" | |||||
| ))} | |||||
| </ol> | |||||
| <div className="carousel-inner"> | |||||
| { | |||||
| result.images.map((image, i) => | |||||
| (image !== undefined && image.src !== undefined ? | |||||
| i === 0 ? | |||||
| <div className="carousel-item active" key={i} > | |||||
| <img height="269px" className="d-block w-100" | |||||
| src={image.src} | |||||
| alt= {i} /> | |||||
| </div> | |||||
| : | |||||
| <div className="carousel-item" key={i} > | |||||
| <img height="269px" className="d-block w-100" | |||||
| src={image.src} | |||||
| alt= {i} /> | |||||
| </div> | |||||
| :'') | |||||
| ) | |||||
| } | |||||
| </div> | |||||
| <a className="carousel-control-prev" href={carouselIndicator} role="button" | |||||
| data-slide="prev"> | |||||
| <span className="carousel-control-custom-icon" aria-hidden="true"> | |||||
| <i className="fas fa-chevron-left"></i> | |||||
| </span> | |||||
| <span className="sr-only">Previous</span> | |||||
| </a> | |||||
| <a className="carousel-control-next" href={carouselIndicator} role="button" | |||||
| data-slide="next"> | |||||
| <span className="carousel-control-custom-icon" aria-hidden="true"> | |||||
| <i className="fas fa-chevron-right"></i> | |||||
| </span> | |||||
| <span className="sr-only">Next</span> | |||||
| </a> | |||||
| </div> | |||||
| </div> | |||||
| <div className="col-md-8"> | |||||
| {result.name !== undefined ? <h2><a>{result.name} | |||||
| </a> | |||||
| </h2>: ''} | |||||
| {result.address != undefined ? | |||||
| <p className="lead"> | |||||
| {result.address.street !== undefined ? <span> {result.address.street}, </span>:''} | |||||
| {result.address.city !== undefined ? <span> {result.address.city}, </span>:''} | |||||
| {result.address.zip !== undefined ? <span> {result.address.zip.code} {result.address.zip.state}</span>:''} | |||||
| </p> | |||||
| : ''} | |||||
| {result.rentInfo !=undefined ? <h3 className="strong">{result.rentInfo}</h3>:'' } | |||||
| <p className="card-text mb-1"> | |||||
| {result.description !== undefined ? result.description.substr(0,100) + "..." : ''} | |||||
| </p> | |||||
| <div className="row"> | |||||
| <div className="col-md-8"> | |||||
| <div className="row"> | |||||
| <div className="col"> | |||||
| { | |||||
| result.features.map((feature, i) => <p key={i} className="badge badge-primary">{feature}</p>) | |||||
| } | |||||
| </div> | |||||
| </div> | |||||
| <div className="row"> | |||||
| { result.contact !== undefined && result.contact.phone != undefined ? <span className="mr-3 lead"><i className="fas fa-phone">{result.contact.phone}</i></span> : ''} | |||||
| { result.contact !== undefined && result.contact.agentFullName ? <span className="mr-3 lead"><i className="fas fa-user"></i>{result.contact.agentFullName}</span>: '' } | |||||
| </div> | |||||
| </div> | |||||
| </div> | |||||
| </div> | |||||
| </div> | |||||
| </div> | |||||
| </div> | |||||
| </> | |||||
| ); | |||||
| } | |||||
| CardTownHouses.propTypes = { | |||||
| result: PropTypes.object, | |||||
| index : PropTypes.string | |||||
| } | |||||
| export default CardTownHouses; |
| import PropTypes from 'prop-types'; | import PropTypes from 'prop-types'; | ||||
| import { useTranslation } from 'react-i18next'; | import { useTranslation } from 'react-i18next'; | ||||
| import ScrappeStatus from '../../components/ScrapeRequest/ScrappeStatus' | import ScrappeStatus from '../../components/ScrapeRequest/ScrappeStatus' | ||||
| const ScrappeDetails = (details) => { | |||||
| const ScrappeDetails = ({details}) => { | |||||
| const {t} = useTranslation(); | const {t} = useTranslation(); | ||||
| return ( | return ( | ||||
| (details.details) ? | |||||
| (details) ? | |||||
| <section> | <section> | ||||
| <h2>Scrappe Details</h2> | <h2>Scrappe Details</h2> | ||||
| <br/> | <br/> | ||||
| <div className="row"> | <div className="row"> | ||||
| <div className="com-md-4"> | <div className="com-md-4"> | ||||
| { | { | ||||
| (details.details.location) ? | |||||
| <h3>{details.details.location}</h3> | |||||
| (details.location) ? | |||||
| <h3>{details.location}</h3> | |||||
| : ''} | : ''} | ||||
| { | { | ||||
| (details.details.estimate) ? | |||||
| <span className="text-muted">{t('scrapeRequest.EstimatedTime')} {(new Date(details.details.estimate)).toLocaleString()}</span> | |||||
| (details.estimate) ? | |||||
| <span className="text-muted">{t('scrapeRequest.EstimatedTime')} {(new Date(details.estimate)).toLocaleString()}</span> | |||||
| : ''} | : ''} | ||||
| </div> | </div> | ||||
| <div className="col-md-4"> | <div className="col-md-4"> | ||||
| { | { | ||||
| (details.details.filters && details.details.filters.length > 0) ? | |||||
| (details.filters && details.filters.length > 0) ? | |||||
| <div className="filters-cont"> | <div className="filters-cont"> | ||||
| <h3>Filters</h3> | <h3>Filters</h3> | ||||
| {details.details.filters.map((filter,i) => <span className="badge bg-primary m-1" key={i}>{filter.name}</span>) } | |||||
| {details.filters.map((filter,i) => <span className="badge bg-primary m-1" key={i}>{filter.name}:{filter.value}</span>) } | |||||
| </div> | </div> | ||||
| :'' } | :'' } | ||||
| </div> | </div> | ||||
| <div className="col-md-1"> | <div className="col-md-1"> | ||||
| {details.details.status ? <ScrappeStatus status = {details.details.status} /> : '' } | |||||
| {details.status ? <ScrappeStatus status = {details.status} /> : '' } | |||||
| </div> | </div> | ||||
| </div> | </div> | ||||
| import React from 'react'; | |||||
| import PropTypes from 'prop-types'; | |||||
| const ScrappeResult = (result) => { | |||||
| return ( | |||||
| <div> | |||||
| Result | |||||
| </div> | |||||
| ); | |||||
| } | |||||
| ScrappeResult.propTypes = { | |||||
| result: PropTypes.object | |||||
| }; | |||||
| export default ScrappeResult; |
| import React from 'react'; | |||||
| import PropTypes from 'prop-types'; | |||||
| import CardApartments from '../CardApartments/CardApartments' | |||||
| import CardHouses from '../CardHouses/CardHouses'; | |||||
| import CardTownHouses from '../CardTownHouses/CardTownHouses'; | |||||
| const ScrappeResult = ({result, type, index}) => { | |||||
| return ( | |||||
| <> | |||||
| <div className='col-lg-12'> | |||||
| { (type !== undefined && type !== null) ? | |||||
| (type.value === "apartments") ? <CardApartments index = {index} result={result} /> | |||||
| : (type.value === "houses") ? <CardHouses index ={index} result={result} /> | |||||
| : <CardTownHouses index={index} result={result} /> | |||||
| :'' | |||||
| } | |||||
| </div> | |||||
| </> | |||||
| ); | |||||
| } | |||||
| ScrappeResult.propTypes = { | |||||
| result: PropTypes.object, | |||||
| type: PropTypes.object, | |||||
| index :PropTypes.string | |||||
| }; | |||||
| export default ScrappeResult; |
| export const Saturday = 6; | |||||
| export const Sunday = 7; |
| export const WorkingDayType = 0; | |||||
| export const SaturdayType = 1; | |||||
| export const SundayType = 2; |
| import {Saturday, Sunday}from '../constants/days' | |||||
| import {WorkingDayType, SaturdayType,SundayType }from '../constants/workingHours' | |||||
| export default function getHours(officeHours) { | |||||
| var day = new Date().getDay(); | |||||
| if(officeHours === undefined && officeHours.length < 3 ){ | |||||
| return null; | |||||
| } | |||||
| else if(day === Saturday){ | |||||
| return officeHours[SaturdayType].hours; | |||||
| } | |||||
| else if(day === Sunday){ | |||||
| return officeHours[SundayType].hours; | |||||
| } | |||||
| else { | |||||
| return officeHours[WorkingDayType].hours; | |||||
| } | |||||
| } |
| @import './assets/styles/functions'; | @import './assets/styles/functions'; | ||||
| @import './assets/styles/typography'; | @import './assets/styles/typography'; | ||||
| @import './assets/styles/base'; | @import './assets/styles/base'; | ||||
| @import './assets/styles/reset'; | |||||
| //@import './assets/styles/reset'; | |||||
| @import './assets/styles/components/button'; | @import './assets/styles/components/button'; | ||||
| @import './assets/styles/components/icon-button'; | @import './assets/styles/components/icon-button'; | ||||
| @import './assets/styles/components/app-button'; | @import './assets/styles/components/app-button'; |
| import React, { useEffect, useState } from 'react'; | import React, { useEffect, useState } from 'react'; | ||||
| import { getByIdScrappe } from '../../request/scrappe'; | import { getByIdScrappe } from '../../request/scrappe'; | ||||
| import { Link } from "react-router-dom"; | |||||
| import ScrappeDetails from '../../components/ScrappeDetails/ScrappeDetails' | import ScrappeDetails from '../../components/ScrappeDetails/ScrappeDetails' | ||||
| //import ScrappeResult from '../../components/ScrappeResult/ScrappeResult' | |||||
| import ScrappeResult from '../../components/ScrappeResult/ScrappeResult' | |||||
| import PropTypes from 'prop-types'; | import PropTypes from 'prop-types'; | ||||
| const ScrapeResultsPage = ({ location }) => { | const ScrapeResultsPage = ({ location }) => { | ||||
| const [scrappeResults, setScrappeResults] = useState() | const [scrappeResults, setScrappeResults] = useState() | ||||
| const [scrappeDetails, setScrappeDetails] = useState() | const [scrappeDetails, setScrappeDetails] = useState() | ||||
| useEffect(() => { | useEffect(() => { | ||||
| getByIdScrappe(location.id) | getByIdScrappe(location.id) | ||||
| .then(res => { | .then(res => { | ||||
| setScrappeDetails(res.data) | setScrappeDetails(res.data) | ||||
| if(res.data.status==='done') | if(res.data.status==='done') | ||||
| setScrappeResults(res.data.result)}) | setScrappeResults(res.data.result)}) | ||||
| }, [setScrappeResults]) | }, [setScrappeResults]) | ||||
| console.log("scrappeDetails", scrappeDetails) | console.log("scrappeDetails", scrappeDetails) | ||||
| console.log("scrappeResults", scrappeResults) | |||||
| return ( | return ( | ||||
| <> | <> | ||||
| {/* ScrappeDetail */} | |||||
| {console.log(scrappeDetails)} | |||||
| <ScrappeDetails details = {scrappeDetails} /> | |||||
| {/* {(scrappeResults !==undefined) | |||||
| ? scrappeResults.map((result, i) => <ScrappeResult key={i} result = {result} />) | |||||
| :'' | |||||
| */} | |||||
| <nav className="main-header navbar navbar-expand-md navbar-light navbar-white"> | |||||
| <div className="container"> | |||||
| <Link to="/" className="navbar-brand"> | |||||
| <span className="brand-text font-weight-light">Back to Scrape</span> | |||||
| </Link> | |||||
| </div> | |||||
| </nav> | |||||
| <ScrappeDetails details = {scrappeDetails} /> | |||||
| <div className ='content' > | |||||
| <div className="container"> | |||||
| <div className="row"> | |||||
| {(scrappeResults !== undefined) ? | |||||
| scrappeResults.map((result, i) => <ScrappeResult key={i} index={i} type={scrappeDetails.filters.find(el => el.name=="type" && el.value !== null)} result = {result} />) | |||||
| :'' | |||||
| } | |||||
| </div> | |||||
| </div> | |||||
| </div> | |||||
| </> | </> | ||||
| ); | ); | ||||
| }; | }; |
| isobject "^3.0.0" | isobject "^3.0.0" | ||||
| static-extend "^0.1.1" | static-extend "^0.1.1" | ||||
| classnames@^2.2.5: | |||||
| version "2.3.1" | |||||
| resolved "https://registry.yarnpkg.com/classnames/-/classnames-2.3.1.tgz#dfcfa3891e306ec1dad105d0e88f4417b8535e8e" | |||||
| integrity sha512-OlQdbZ7gLfGarSqxesMesDa5uz7KFbID8Kpq/SxIoNGDqY8lSYs0D+hhtBXhcdB3rcbXArFr7vlHheLk1voeNA== | |||||
| clean-css@^4.2.3: | clean-css@^4.2.3: | ||||
| version "4.2.3" | version "4.2.3" | ||||
| resolved "https://registry.yarnpkg.com/clean-css/-/clean-css-4.2.3.tgz#507b5de7d97b48ee53d84adb0160ff6216380f78" | resolved "https://registry.yarnpkg.com/clean-css/-/clean-css-4.2.3.tgz#507b5de7d97b48ee53d84adb0160ff6216380f78" | ||||
| object-assign "^4.1.1" | object-assign "^4.1.1" | ||||
| scheduler "^0.20.2" | scheduler "^0.20.2" | ||||
| react-easy-swipe@^0.0.21: | |||||
| version "0.0.21" | |||||
| resolved "https://registry.yarnpkg.com/react-easy-swipe/-/react-easy-swipe-0.0.21.tgz#ce9384d576f7a8529dc2ca377c1bf03920bac8eb" | |||||
| integrity sha512-OeR2jAxdoqUMHIn/nS9fgreI5hSpgGoL5ezdal4+oO7YSSgJR8ga+PkYGJrSrJ9MKlPcQjMQXnketrD7WNmNsg== | |||||
| dependencies: | |||||
| prop-types "^15.5.8" | |||||
| react-error-overlay@^6.0.9: | react-error-overlay@^6.0.9: | ||||
| version "6.0.9" | version "6.0.9" | ||||
| resolved "https://registry.yarnpkg.com/react-error-overlay/-/react-error-overlay-6.0.9.tgz#3c743010c9359608c375ecd6bc76f35d93995b0a" | resolved "https://registry.yarnpkg.com/react-error-overlay/-/react-error-overlay-6.0.9.tgz#3c743010c9359608c375ecd6bc76f35d93995b0a" | ||||
| resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.8.3.tgz#721d4657672d400c5e3c75d063c4a85fb2d5d68f" | resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.8.3.tgz#721d4657672d400c5e3c75d063c4a85fb2d5d68f" | ||||
| integrity sha512-X8jZHc7nCMjaCqoU+V2I0cOhNW+QMBwSUkeXnTi8IPe6zaRWfn60ZzvFDZqWPfmSJfjub7dDW1SP0jaHWLu/hg== | integrity sha512-X8jZHc7nCMjaCqoU+V2I0cOhNW+QMBwSUkeXnTi8IPe6zaRWfn60ZzvFDZqWPfmSJfjub7dDW1SP0jaHWLu/hg== | ||||
| react-responsive-carousel@^3.2.19: | |||||
| version "3.2.19" | |||||
| resolved "https://registry.yarnpkg.com/react-responsive-carousel/-/react-responsive-carousel-3.2.19.tgz#ded0d5888b0a605cf28f0db3fad04bbbb2ff3616" | |||||
| integrity sha512-lOO6CscsxnQoNnrmLXNXu7u3U0znY44jGloX9Zayki9+OdUs63YXypSgV7dzaTmlem4SXy4rIXBR8+gjA9zyxg== | |||||
| dependencies: | |||||
| classnames "^2.2.5" | |||||
| prop-types "^15.5.8" | |||||
| react-easy-swipe "^0.0.21" | |||||
| react-router-dom@^5.2.0: | react-router-dom@^5.2.0: | ||||
| version "5.2.0" | version "5.2.0" | ||||
| resolved "https://registry.yarnpkg.com/react-router-dom/-/react-router-dom-5.2.0.tgz#9e65a4d0c45e13289e66c7b17c7e175d0ea15662" | resolved "https://registry.yarnpkg.com/react-router-dom/-/react-router-dom-5.2.0.tgz#9e65a4d0c45e13289e66c7b17c7e175d0ea15662" |