forked from M3-Academy/challenge-vtex-io
feat: píx feito, faltando somente estilizar
This commit is contained in:
parent
32629e54a2
commit
6e0250dbf9
45
react/components/pixCustom/pixCustom.tsx
Normal file
45
react/components/pixCustom/pixCustom.tsx
Normal file
@ -0,0 +1,45 @@
|
||||
import React from 'react';
|
||||
import {useProduct} from 'vtex.product-context';
|
||||
|
||||
import './styles.css';
|
||||
|
||||
|
||||
const pixCustom = () => {
|
||||
const productContextValue = useProduct()
|
||||
|
||||
// {productContextValue?.product?.priceRange.sellingPrice.highPrice}
|
||||
|
||||
const valorString = productContextValue?.product?.priceRange.sellingPrice.lowPrice;
|
||||
|
||||
const valorNumber = Number(valorString)
|
||||
|
||||
const desconto = 0.9
|
||||
|
||||
var pix = (valorNumber * desconto).toFixed(2).replace(".", ",")
|
||||
|
||||
console.log(pix);
|
||||
|
||||
return(
|
||||
<div>
|
||||
<div>
|
||||
<img src="https://agenciamagma.vtexassets.com/arquivos/AdilsonFernandoNevesOrnellas-ImgPix.png" alt="Imagem Pix" />
|
||||
</div>
|
||||
|
||||
<div>
|
||||
|
||||
<div>
|
||||
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<h1> R$ ${pix} </h1>
|
||||
<h2> 10% de desconto </h2>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default pixCustom
|
3
react/components/pixCustom/styles.css
Normal file
3
react/components/pixCustom/styles.css
Normal file
@ -0,0 +1,3 @@
|
||||
[class*=""] {
|
||||
|
||||
}
|
3
react/pixCustom.ts
Normal file
3
react/pixCustom.ts
Normal file
@ -0,0 +1,3 @@
|
||||
import pixCustom from "./components/pixCustom/pixCustom";
|
||||
|
||||
export default pixCustom;
|
@ -125,6 +125,7 @@
|
||||
"flex-layout.row#selling-price",
|
||||
// "flex-layout.row#list-price-savings",
|
||||
"product-installments#custom",
|
||||
"pixCustom",
|
||||
"sku-selector",
|
||||
"html#quantidadeEButtonCustom",
|
||||
// "product-separator",
|
||||
|
@ -5,5 +5,8 @@
|
||||
"html": {
|
||||
"component": "html",
|
||||
"composition": "children"
|
||||
},
|
||||
"pixCustom": {
|
||||
"component": "pixCustom"
|
||||
}
|
||||
}
|
||||
|
Loading…
x
Reference in New Issue
Block a user