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.
42 lines
1.5 KiB
42 lines
1.5 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 = {'card_basket_product_img'}>
|
|
<Image
|
|
className = {'pictureText_img'}
|
|
src={src}
|
|
alt={alt}
|
|
width={63}
|
|
height={60}
|
|
/>
|
|
</div>
|
|
<div className={'card_basket_product_box_title'}>
|
|
<p className={'card_basket_product_title'}>{title_name}</p>
|
|
<p className={'card_basket_product_size'}>{title_size}</p>
|
|
</div>
|
|
|
|
<div className={'card_basket_product_sale_box_button'}>
|
|
<button className='card_basket_product_button'>-</button>
|
|
<p className='card_basket_product_count'>{countProduct}</p>
|
|
<button className='card_basket_product_button'>+</button>
|
|
</div>
|
|
|
|
<div className={'card_basket_product_sale_box_price'}>
|
|
<p className='card_basket_product_price'>{price} ₽</p>
|
|
</div>
|
|
</div>
|
|
)
|
|
} |