Files
menui_web/src/components/Output/CardRestaurant.js
2021-02-05 19:57:06 +01:00

62 lines
1.8 KiB
JavaScript

import React from "react";
import Pictograms from "./Pictograms";
import { useHistory } from "react-router-dom";
import { getTodayHours } from "../../Services.js";
import AccessTimeIcon from '@material-ui/icons/AccessTime';
import LocationCityIcon from '@material-ui/icons/LocationCity';
import GradeIcon from '@material-ui/icons/Grade';
function extractTags(tags) {
var results = [];
if (!tags) return results;
for (let [key, value] of Object.entries(tags)) {
if (value === true) {
results.push(key);
}
}
return results;
}
export default function CardRestaurant(props) {
const history = useHistory();
const img = props.imgUrl;
return (
<div
onClick={() => history.push(`/restaurant/${props.id}`)}
className="card-restaurant"
>
<div
className="card-img"
style={{ backgroundImage: "url(" + img + ")" }}
></div>
<div className="card-info">
<div className="title-info">
<div className="card-info-line-top">
<h1>{props.name}</h1>
<div className="card-info-line">
<GradeIcon fontSize="medium"/>
<h3>brak ocen</h3>
</div>
</div>
<hr />
<div className="card-info-line">
<LocationCityIcon color="primary" fontSize="small"/>
<h3>{props.city}</h3>
</div>
<div className="card-info-line">
<AccessTimeIcon color="primary" fontSize="small"/>
<h3>{getTodayHours(props.hours)}</h3>
</div>
</div>
<div className="card-description">
<p>{props.description}</p>
</div>
<div className="card-pictograms">
<Pictograms pictograms={extractTags(props.tags)} />
</div>
</div>
</div>
);
}