You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
46 lines
1.6 KiB
46 lines
1.6 KiB
import React, { useState, useEffect } from 'react';
|
|
import Image from 'next/image';
|
|
|
|
type Props = { src: string,
|
|
alt: string,
|
|
title_name: string,
|
|
title_size: string,
|
|
sum: number,
|
|
};
|
|
|
|
export const CardBasketProduct: React.FC<Props> = ({src, alt, title_name, title_size, sum}) => {
|
|
const [countProduct, setcountProduct] = useState(1);
|
|
const [price, setPrice] = useState(sum);
|
|
|
|
return(
|
|
<div className={'card_basket_product_main'}>
|
|
<div className="product_head">
|
|
<div className = {'product_img_box'}>
|
|
<Image
|
|
className = {'pictureText_img'}
|
|
src={src}
|
|
alt={alt}
|
|
width={63}
|
|
height={60}
|
|
/>
|
|
</div>
|
|
<div className={'title_box'}>
|
|
<p className={'title'}>{title_name}</p>
|
|
<p className={'size'}>{title_size}</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div className={'product_footer'}>
|
|
<div className={'sale_button_box'}>
|
|
<button className='product_button'>-</button>
|
|
<p className='product_count'>{countProduct}</p>
|
|
<button className='product_button'>+</button>
|
|
</div>
|
|
|
|
<div className={'sale_box_price'}>
|
|
<p className='product_price'>{price} ₽</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
} |