31 lines
911 B
TypeScript
31 lines
911 B
TypeScript
|
import React from "react";
|
||
|
|
|
||
|
|
import { useProduct } from "vtex.product-context";
|
||
|
|
import styles from "./style.module.css";
|
||
|
|
|
||
|
|
const Pix = () => {
|
||
|
|
const productContextValue = useProduct();
|
||
|
|
|
||
|
|
const productPrice = productContextValue?.product?.priceRange?.sellingPrice?.lowPrice;
|
||
|
|
|
||
|
|
const discountValue = (Number(productPrice) * 10) / 100;
|
||
|
|
|
||
|
|
const totalValue = Number(productPrice) - Number(discountValue);
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div className={styles["wrapper"]}>
|
||
|
|
<div className={styles["container"]}>
|
||
|
|
<div className={styles["image"]}>
|
||
|
|
<img src="https://agenciamagma.vtexassets.com/arquivos/pix-logo-vitor-soares.png" alt="desconto" />
|
||
|
|
</div>
|
||
|
|
<div className={styles["discount"]}>
|
||
|
|
<p className={styles["value"]}>R${totalValue.toFixed(2)}</p>
|
||
|
|
<p className={styles["text"]}>10 % de desconto</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
};
|
||
|
|
|
||
|
|
export default Pix;
|