import React from 'react'; import { makeStyles } from '@material-ui/core/styles'; import Table from '@material-ui/core/Table'; import TableBody from '@material-ui/core/TableBody'; import TableCell from '@material-ui/core/TableCell'; import TableContainer from '@material-ui/core/TableContainer'; import TableHead from '@material-ui/core/TableHead'; import TableRow from '@material-ui/core/TableRow'; import Paper from '@material-ui/core/Paper'; import DeleteOutlineOutlinedIcon from "@material-ui/icons/DeleteOutlineOutlined"; import './index.scss'; const useStyles = makeStyles({ table: { }, }); const maxMobileSize = 550; const fontSize = { mobile: { info: { strong: window.innerWidth > maxMobileSize ? 15 : window.innerWidth / 28, p: window.innerWidth > maxMobileSize ? 12 : window.innerWidth / 36, span: window.innerWidth > maxMobileSize ? 12 : window.innerWidth / 36, }, price: { strong: window.innerWidth > maxMobileSize ? 16 : window.innerWidth / 22, span: window.innerWidth > maxMobileSize ? 13 : window.innerWidth / 40, }, counter: { button: window.innerWidth > maxMobileSize ? 20 : window.innerWidth / 25, span: window.innerWidth > maxMobileSize ? 15 : window.innerWidth / 25, }, delete: { span: window.innerWidth > maxMobileSize ? 13 : window.innerWidth / 28, }, }, }; export default function BasicTable(props) { const classes = useStyles(); const {list, handleCounter, handleDelete} = props; return ( <> { window.innerWidth < 1000 ? محصولات قیمت { list.map((row,i) => ( ))}
: null } ); } // id: 1, // title: "ریاضیات گسسته خیلی پیشرفته", // subTitle: "در این قسمت توضیح بسیار کوتاهی قرار می گیرد", // options: "بسته‌های الحاقی: کیف، کفش و کوله پشتی", // image: book1, // slicePrice: 300000, // number: 1, // price: 2500000, const Item = (props) => { const {data, handleCounter, handleDelete} = props; return(
{data.title}
{data.title}

{data.subTitle}

{data.options}
handleDelete(data.id)} /> handleDelete(data.id)} style={{ fontSize: fontSize.mobile.delete.span, color: "#FC120A"}} > حذف
{data.price} {data.slicePrice} قیمت هر واحد
{data.number}
); }