46 lines
983 B
TypeScript
46 lines
983 B
TypeScript
|
import React, { useEffect } from "react";
|
||
|
|
import { useProduct} from "vtex.product-context";
|
||
|
|
import styles from "./styles.module.css";
|
||
|
|
|
||
|
|
|
||
|
|
const Pix = () => {
|
||
|
|
|
||
|
|
useEffect(()=>{
|
||
|
|
const cep = document.querySelector(".vtex-address-form-4-x-input");
|
||
|
|
|
||
|
|
cep?.setAttribute("placeholder", "Digite seu CEP");
|
||
|
|
|
||
|
|
})
|
||
|
|
|
||
|
|
const productvalue = useProduct();
|
||
|
|
|
||
|
|
const pixproduct = productvalue?.product?.priceRange?.sellingPrice?.lowPrice;
|
||
|
|
|
||
|
|
const desconto = (Number(pixproduct)*10)/100;
|
||
|
|
|
||
|
|
const total = Number(pixproduct) - Number(desconto.toFixed(2))
|
||
|
|
|
||
|
|
return (
|
||
|
|
|
||
|
|
<div className={styles["pix-container"]}>
|
||
|
|
<div className={styles["pix-content"]}>
|
||
|
|
<div className={styles["pix-img"]}>
|
||
|
|
<img src="https://agenciamagma.vtexassets.com/arquivos/pix--ueberjames.png" alt="" />
|
||
|
|
</div>
|
||
|
|
<div className={styles["pix-desconto"]}>
|
||
|
|
<p className={styles["pix-valor"]}> R$ { total.toFixed(2)}</p>
|
||
|
|
<p className={styles["pix-text"]}> 10% de desconto</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
);
|
||
|
|
|
||
|
|
};
|
||
|
|
|
||
|
|
export default Pix;
|