35 lines
1.2 KiB
TypeScript
35 lines
1.2 KiB
TypeScript
import React, { useEffect } from "react";
|
|
import { useProduct } from "vtex.product-context";
|
|
import styles from "./styles.module.css";
|
|
|
|
const PixDiscount = () => {
|
|
|
|
useEffect(() => {
|
|
const inputCep = document.querySelector(".vtex-address-form-4-x-input");
|
|
inputCep?.setAttribute("placeholder", "Digite seu CEP");
|
|
});
|
|
|
|
const productContextValue = useProduct();
|
|
const productPrice = productContextValue?.product?.priceRange?.sellingPrice?.lowPrice;
|
|
const discount = (Number(productPrice) * 10) / 100;
|
|
const totalDiscount = Number(productPrice) - Number(discount.toFixed(2));
|
|
|
|
|
|
return (
|
|
<div className={styles["wrapper"]}>
|
|
<div className={styles["container-img"]}>
|
|
<figure className={styles["figure-pix"]}>
|
|
<img className={styles["img-pix"]} src="https://agenciamagma.vtexassets.com/arquivos/pixDescontoThiagoBronisio.png" alt="Imagem Pix" />
|
|
</figure>
|
|
</div>
|
|
|
|
<div className={styles["container-price"]}>
|
|
<p className={styles["price-pix"]}>R$ {totalDiscount.toFixed(2).replace(".", ",")}</p>
|
|
<p className={styles["discount"]}>10% de desconto</p>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default PixDiscount;
|