challenge-vtex-io-josecarlo.../react/components/descont-pix/index.tsx

51 lines
1.5 KiB
TypeScript

import React, { FC } from 'react'
import { useProduct } from 'vtex.product-context'
import styles from "./styles.css";
export const DescontPix: FC = () => {
const productContextValue = useProduct();
// const fetchApi = async () => {
// fetch("/api/checkout/pub/orderForms/simulation", {
// method: "POST",
// headers: {
// Accept: "application/json",
// "Content-Type": "application/json",
// },
// body: `
// {
// "items": [
// {
// "id": ${productContextValue?.selectedItem?.itemId},
// "seller": ${productContextValue?.selectedItem?.sellers[0].sellerId},
// "quantity": ${productContextValue?.selectedQuantity}
// ]
// }
// ],
// "country": "BRA"
// }`,
// })
// .then((response) => response.json())
// .then((data) => {
// console.log(data)
// })
// }
// fetchApi();
let sellingPrice = Number(productContextValue?.product?.priceRange.sellingPrice.highPrice);
sellingPrice = (sellingPrice - (sellingPrice/10));
return (
<div className={styles.containerDescontPix}>
<img src="https://agenciamagma.vteximg.com.br/arquivos/logoPixjosecarloslins.png" alt="Logo PIX" />
<div className={styles.containerDescontPixPrice}>
<span className={styles.priceDescontPix}>R$ {sellingPrice.toFixed(2).replace(".", ",")}</span>
<span className={styles.descontDescontPix}>10 % de desconto</span>
</div>
</div>
);
}