From 502ea2700003e8959f3d81c8978126da0d3b9828 Mon Sep 17 00:00:00 2001 From: "HATEC\\SPVDEV001" Date: Mon, 10 Jul 2023 10:31:42 +0700 Subject: button voucher --- src/lib/checkout/components/Checkout.jsx | 10 ++++++++++ 1 file changed, 10 insertions(+) (limited to 'src/lib') diff --git a/src/lib/checkout/components/Checkout.jsx b/src/lib/checkout/components/Checkout.jsx index 07d9acb6..6cb735fe 100644 --- a/src/lib/checkout/components/Checkout.jsx +++ b/src/lib/checkout/components/Checkout.jsx @@ -578,6 +578,16 @@ const Checkout = () => { )} + +
+ + +

Dengan melakukan pembelian melalui website Indoteknik, saya menyetujui{' '} -- cgit v1.2.3 From bdb8aa884317fdca72a20989f73764fdde06f42e Mon Sep 17 00:00:00 2001 From: "HATEC\\SPVDEV001" Date: Mon, 10 Jul 2023 16:56:58 +0700 Subject: layouting --- src/lib/checkout/api/getVoucher.js | 8 ++ src/lib/checkout/components/Checkout.jsx | 134 +++++++++++++++++++++++++++++-- 2 files changed, 136 insertions(+), 6 deletions(-) create mode 100644 src/lib/checkout/api/getVoucher.js (limited to 'src/lib') diff --git a/src/lib/checkout/api/getVoucher.js b/src/lib/checkout/api/getVoucher.js new file mode 100644 index 00000000..68185021 --- /dev/null +++ b/src/lib/checkout/api/getVoucher.js @@ -0,0 +1,8 @@ +import odooApi from '@/core/api/odooApi' + +const getVoucher = async () => { + const dataVoucher = await odooApi('GET', `/api/v1/voucher`) + return dataVoucher +} + +export default getVoucher diff --git a/src/lib/checkout/components/Checkout.jsx b/src/lib/checkout/components/Checkout.jsx index 6cb735fe..629ec5bc 100644 --- a/src/lib/checkout/components/Checkout.jsx +++ b/src/lib/checkout/components/Checkout.jsx @@ -24,6 +24,7 @@ import whatsappUrl from '@/core/utils/whatsappUrl' import { createSlug } from '@/core/utils/slug' import BottomPopup from '@/core/components/elements/Popup/BottomPopup' import { gtagPurchase } from '@/core/utils/googleTag' +import getVoucher from '../api/getVoucher' const SELF_PICKUP_ID = 32 @@ -81,7 +82,13 @@ const Checkout = () => { const [selectedExpedisiService, setselectedExpedisiService] = useState(null) const [etd, setEtd] = useState(null) const [etdFix, setEtdFix] = useState(null) + const [bottomPopup, SetBottomPopup] = useState(null) + const [listVouchers, SetListVoucher] = useState(null) + const voucher = async () => { + let dataVoucher = await getVoucher() + SetListVoucher(dataVoucher) + } useEffect(() => { const loadExpedisi = async () => { let dataExpedisi = await ExpedisiList() @@ -93,8 +100,11 @@ const Checkout = () => { setExpedisi(dataExpedisi) } loadExpedisi() + voucher() }, []) + console.log('ini voucher', listVouchers) + useEffect(() => { const loadProducts = async () => { let variantIds = '' @@ -260,6 +270,95 @@ const Checkout = () => { return ( <> + SetBottomPopup(false)} title='Gunakan Promo'> +

+
+
+ +
+
+ +
+
+ +
+
+

Promo yang tersedia

+ {listVouchers?.map((item) => ( +
+
+
+ {item.name} +
+
+
+
+

{item.name}

+
+ {item.description} +
+
+
+ +
+
+
+

+ Kode Voucher :{' '} + {item.code} +

+
+
+
+

+ Voucher ini dapat anda gunakan untuk pengguna pertama{' '} +

+
+
+ + + Berakhir dalam {item.endTime} lagi !{' '} + + Lihat Detail + + +
+
+
+ ))} +
+
+
@@ -353,6 +452,22 @@ const Checkout = () => { )}
+ +
+ +
+ +
{/*

*) Belum termasuk biaya pengiriman

*/}

Dengan melakukan pembelian melalui website Indoteknik, saya menyetujui{' '} @@ -581,12 +696,19 @@ const Checkout = () => {

- +
+ +

Dengan melakukan pembelian melalui website Indoteknik, saya menyetujui{' '} -- cgit v1.2.3 From dc334fa49ad13959b6a0d572fd56a4cde38176fa Mon Sep 17 00:00:00 2001 From: "HATEC\\SPVDEV001" Date: Tue, 11 Jul 2023 15:29:03 +0700 Subject: get voucher --- src/lib/checkout/api/getVoucher.js | 7 +- src/lib/checkout/components/Checkout.jsx | 230 ++++++++++++++++++++++--------- 2 files changed, 168 insertions(+), 69 deletions(-) (limited to 'src/lib') diff --git a/src/lib/checkout/api/getVoucher.js b/src/lib/checkout/api/getVoucher.js index 68185021..03ac3d6d 100644 --- a/src/lib/checkout/api/getVoucher.js +++ b/src/lib/checkout/api/getVoucher.js @@ -1,8 +1,11 @@ import odooApi from '@/core/api/odooApi' -const getVoucher = async () => { +export const getVoucher = async () => { const dataVoucher = await odooApi('GET', `/api/v1/voucher`) return dataVoucher } -export default getVoucher +export const findVoucher = async (code) => { + const dataVoucher = await odooApi('GET', `/api/v1/voucher?code=${code}`) + return dataVoucher +} diff --git a/src/lib/checkout/components/Checkout.jsx b/src/lib/checkout/components/Checkout.jsx index 629ec5bc..dcc00eb8 100644 --- a/src/lib/checkout/components/Checkout.jsx +++ b/src/lib/checkout/components/Checkout.jsx @@ -24,7 +24,7 @@ import whatsappUrl from '@/core/utils/whatsappUrl' import { createSlug } from '@/core/utils/slug' import BottomPopup from '@/core/components/elements/Popup/BottomPopup' import { gtagPurchase } from '@/core/utils/googleTag' -import getVoucher from '../api/getVoucher' +import { findVoucher, getVoucher } from '../api/getVoucher' const SELF_PICKUP_ID = 32 @@ -84,11 +84,22 @@ const Checkout = () => { const [etdFix, setEtdFix] = useState(null) const [bottomPopup, SetBottomPopup] = useState(null) const [listVouchers, SetListVoucher] = useState(null) + const [activeVoucher, SetActiveVoucher] = useState(null) + const [discountVoucher, SetDiscountVoucher] = useState(null) + const [codeVoucher, SetCodeVoucher] = useState(null) const voucher = async () => { let dataVoucher = await getVoucher() SetListVoucher(dataVoucher) } + const VoucherCode = async (code) => { + let dataVoucher = await findVoucher(code) + if (!dataVoucher) return + + let addNewLine = dataVoucher[0] + SetListVoucher((prevList) => [addNewLine, ...prevList]) + SetActiveVoucher(addNewLine.code) + } useEffect(() => { const loadExpedisi = async () => { let dataExpedisi = await ExpedisiList() @@ -103,7 +114,27 @@ const Checkout = () => { voucher() }, []) - console.log('ini voucher', listVouchers) + useEffect(() => { + if (!listVouchers) return + if (!activeVoucher) return + + let dataVoucherIndex = listVouchers.findIndex((vocuher) => vocuher.code == activeVoucher) + let dataActiveVocuher = listVouchers[dataVoucherIndex] + let countDiscount = 0 + + if (dataActiveVocuher.discountType === 'percentage') { + countDiscount = (totalAmount - totalDiscountAmount) * 0.1 + if ( + dataActiveVocuher.maxDiscountAmount > 0 && + countDiscount > dataActiveVocuher.maxDiscountAmount + ) { + countDiscount = dataActiveVocuher.maxDiscountAmount + } + } else { + countDiscount = dataActiveVocuher.discountAmount + } + SetDiscountVoucher(countDiscount) + }, [activeVoucher, listVouchers]) useEffect(() => { const loadProducts = async () => { @@ -266,92 +297,137 @@ const Checkout = () => { event_callback: midtrans }) } + + const handlingActivateCode = async () => { + VoucherCode(codeVoucher) + } const taxTotal = (totalAmount - totalDiscountAmount) * 0.11 return ( <> - SetBottomPopup(false)} title='Gunakan Promo'> + SetBottomPopup(false)} + title='Gunakan Promo' + >

SetCodeVoucher(e.target.value)} />
-
+ {codeVoucher && activeVoucher == codeVoucher ? ( +
+ + Voucher berhasil ditambahkan{' '} + +
+ ) : ( +
+ + Kode voucher salah / sudah tidak berlaku lagi. Coba voucher lainnya, ya. + +
+ )}

Promo yang tersedia

{listVouchers?.map((item) => ( -
-
-
- {item.name} -
-
-
-
-

{item.name}

-
- {item.description} +
+ {totalAmount - totalDiscountAmount < item.minPurchaseAmount && ( +
+ )} + +
+
+
+ {item.name} +
+
+
+
+

{item.name}

+
+ {item.description} +
+
+
+
-
- +
+
+

+ Kode Voucher :{' '} + {item.code} +

+

+ {activeVoucher === item.code && ( + + Voucher digunakan{' '} + + )} +

-
-

- Kode Voucher :{' '} - {item.code} -

-
-
-

- Voucher ini dapat anda gunakan untuk pengguna pertama{' '} -

-
-
- - - Berakhir dalam {item.endTime} lagi !{' '} - - Lihat Detail - - +
+

+ {totalAmount - totalDiscountAmount < item.minPurchaseAmount + ? 'Tambah ' + + currencyFormat( + item.minPurchaseAmount - (totalAmount - totalDiscountAmount) + ) + + ' untuk pakai promo ini' + : 'Voucher ini dapat anda gunakan untuk pengguna pertama'} +

+
+
+ + + Berakhir dalam {item.remainingTime}{' '} + lagi{' '} + +
@@ -462,9 +538,18 @@ const Checkout = () => { className='text-gray-900 flex items-center justify-center rounded-lg bg-white border font-medium border-gray-300 hover:bg-gray-100 py-2.5 h-[50px] w-[100%]' > % - - Hemat belanja dengan promo - + {activeVoucher ? ( +
+ + Kamu dapat potogan {discountVoucher} + + Voucher berhasil digunakan +
+ ) : ( + + Hemat belanja dengan promo + + )} {'>'}
@@ -700,12 +785,23 @@ const Checkout = () => {
-- cgit v1.2.3 From b3855694c2723168d1c7ad949d892649fff220b8 Mon Sep 17 00:00:00 2001 From: "HATEC\\SPVDEV001" Date: Tue, 11 Jul 2023 17:05:43 +0700 Subject: find voucher --- src/lib/checkout/components/Checkout.jsx | 40 ++++++++++++++++++++++++++++---- 1 file changed, 35 insertions(+), 5 deletions(-) (limited to 'src/lib') diff --git a/src/lib/checkout/components/Checkout.jsx b/src/lib/checkout/components/Checkout.jsx index dcc00eb8..f19b6054 100644 --- a/src/lib/checkout/components/Checkout.jsx +++ b/src/lib/checkout/components/Checkout.jsx @@ -87,6 +87,8 @@ const Checkout = () => { const [activeVoucher, SetActiveVoucher] = useState(null) const [discountVoucher, SetDiscountVoucher] = useState(null) const [codeVoucher, SetCodeVoucher] = useState(null) + const [findCodeVoucher, SetFindVoucher] = useState(null) + const [selisihHargaCode, SetSelisihHargaCode] = useState(null) const voucher = async () => { let dataVoucher = await getVoucher() @@ -94,9 +96,21 @@ const Checkout = () => { } const VoucherCode = async (code) => { let dataVoucher = await findVoucher(code) - if (!dataVoucher) return + if (dataVoucher.length <= 0) { + SetFindVoucher(1) + return + } let addNewLine = dataVoucher[0] + if (totalAmount - totalDiscountAmount < addNewLine.minPurchaseAmount) { + SetSelisihHargaCode( + currencyFormat(addNewLine.minPurchaseAmount - (totalAmount - totalDiscountAmount)) + ) + SetFindVoucher(2) + return + } else { + SetFindVoucher(3) + } SetListVoucher((prevList) => [addNewLine, ...prevList]) SetActiveVoucher(addNewLine.code) } @@ -301,6 +315,14 @@ const Checkout = () => { const handlingActivateCode = async () => { VoucherCode(codeVoucher) } + + const handleUseVoucher = async (code) => { + SetActiveVoucher(code) + SetFindVoucher(null) + // document.getElementById('uniqCode').val('') + } + + console.log('ini find voucher', findCodeVoucher) const taxTotal = (totalAmount - totalDiscountAmount) * 0.11 return ( @@ -334,19 +356,27 @@ const Checkout = () => {
- {codeVoucher && activeVoucher == codeVoucher ? ( + {findCodeVoucher === 3 && activeVoucher === codeVoucher && (
Voucher berhasil ditambahkan{' '}
- ) : ( + )} + {findCodeVoucher === 1 && (
- + Kode voucher salah / sudah tidak berlaku lagi. Coba voucher lainnya, ya.
)} + {findCodeVoucher === 2 && ( +
+ + {'Tambah ' + selisihHargaCode + ' untuk pakai promo ini'} + +
+ )}
@@ -374,7 +404,7 @@ const Checkout = () => {
@@ -351,6 +361,7 @@ const Checkout = () => { className='btn-solid-red flex-1 md:flex-none rounded-md' type='button' onClick={() => handlingActivateCode()} + disabled={buttonTerapkan} > Terapkan @@ -380,7 +391,16 @@ const Checkout = () => {
-

Promo yang tersedia

+ {!listVouchers ? ( +
+
+

Tidak ada voucher tersedia

+

Maaf, saat ini tidak ada voucher yang tersedia.

+
+
+ ) : ( +

Promo yang tersedia

+ )} {listVouchers?.map((item) => (
{totalAmount - totalDiscountAmount < item.minPurchaseAmount && ( @@ -389,7 +409,7 @@ const Checkout = () => {
-
+
{item.name}
@@ -528,9 +548,15 @@ const Checkout = () => {
{currencyFormat(totalAmount)}
-
Total Diskon
+
Diskon Produk
- {currencyFormat(totalDiscountAmount)}
+ {activeVoucher && ( +
+
Diskon Voucher
+
- {currencyFormat(discountVoucher)}
+
+ )}
Subtotal
{currencyFormat(totalAmount - totalDiscountAmount)}
@@ -552,7 +578,8 @@ const Checkout = () => {
{currencyFormat( totalAmount - - totalDiscountAmount + + totalDiscountAmount - + discountVoucher + taxTotal + Math.round(parseInt(biayaKirim * 1.1) / 1000) * 1000 )} @@ -565,22 +592,33 @@ const Checkout = () => {
{/*

*) Belum termasuk biaya pengiriman

*/} @@ -778,9 +816,15 @@ const Checkout = () => {
Total Diskon
- {currencyFormat(totalDiscountAmount)}
+ {activeVoucher && ( +
+
Diskon Voucher
+
- {currencyFormat(discountVoucher)}
+
+ )}
Subtotal
-
{currencyFormat(totalAmount - totalDiscountAmount)}
+
{currencyFormat(totalAmount - totalDiscountAmount - discountVoucher)}
PPN 11%
@@ -802,7 +846,8 @@ const Checkout = () => {
{currencyFormat( totalAmount - - totalDiscountAmount + + totalDiscountAmount - + discountVoucher + taxTotal + Math.round(parseInt(biayaKirim * 1.1) / 1000) * 1000 )} @@ -815,9 +860,15 @@ const Checkout = () => {
-- cgit v1.2.3 From c2be9e77d22840eb33142ea2e694c3278613c4ef Mon Sep 17 00:00:00 2001 From: "HATEC\\SPVDEV001" Date: Wed, 12 Jul 2023 11:49:53 +0700 Subject: checkout --- src/lib/checkout/components/Checkout.jsx | 80 ++++++++++++++++++-------------- 1 file changed, 46 insertions(+), 34 deletions(-) (limited to 'src/lib') diff --git a/src/lib/checkout/components/Checkout.jsx b/src/lib/checkout/components/Checkout.jsx index 1763ae5b..6990b420 100644 --- a/src/lib/checkout/components/Checkout.jsx +++ b/src/lib/checkout/components/Checkout.jsx @@ -104,7 +104,7 @@ const Checkout = () => { let addNewLine = dataVoucher[0] let checkList = listVouchers.findIndex((voucher) => voucher.code == addNewLine.code) - if(checkList > 0) return + if (checkList > 0) return if (totalAmount - totalDiscountAmount < addNewLine.minPurchaseAmount) { SetSelisihHargaCode( currencyFormat(addNewLine.minPurchaseAmount - (totalAmount - totalDiscountAmount)) @@ -132,25 +132,34 @@ const Checkout = () => { voucher() }, []) - useEffect(() => { - if (!listVouchers) return - if (!activeVoucher) return + const hitungDiscountVoucher = (code) => { + let dataVoucherIndex = listVouchers.findIndex((voucher) => voucher.code == code) + let dataActiveVoucher = listVouchers[dataVoucherIndex] - let dataVoucherIndex = listVouchers.findIndex((voucher) => voucher.code == activeVoucher) - let dataActiveVocuher = listVouchers[dataVoucherIndex] + console.log('ini data active', dataActiveVoucher, code, dataVoucherIndex) let countDiscount = 0 - if (dataActiveVocuher.discountType === 'percentage') { + if (dataActiveVoucher.discountType === 'percentage') { countDiscount = (totalAmount - totalDiscountAmount) * 0.1 if ( - dataActiveVocuher.maxDiscountAmount > 0 && - countDiscount > dataActiveVocuher.maxDiscountAmount + dataActiveVoucher.maxDiscountAmount > 0 && + countDiscount > dataActiveVoucher.maxDiscountAmount ) { - countDiscount = dataActiveVocuher.maxDiscountAmount + countDiscount = dataActiveVoucher.maxDiscountAmount } } else { - countDiscount = dataActiveVocuher.discountAmount + countDiscount = dataActiveVoucher.discountAmount } + + return countDiscount + } + + useEffect(() => { + if (!listVouchers) return + if (!activeVoucher) return + + const countDiscount = hitungDiscountVoucher(activeVoucher) + SetDiscountVoucher(countDiscount) }, [activeVoucher, listVouchers]) @@ -417,7 +426,7 @@ const Checkout = () => {

{item.name}

- {item.description} + {item.description}
@@ -455,7 +464,8 @@ const Checkout = () => { item.minPurchaseAmount - (totalAmount - totalDiscountAmount) ) + ' untuk pakai promo ini' - : 'Voucher ini dapat anda gunakan untuk pengguna pertama'} + : 'Potensi potongan sebesar ' + + currencyFormat(hitungDiscountVoucher(item.code))}

@@ -559,7 +569,7 @@ const Checkout = () => { )}
Subtotal
-
{currencyFormat(totalAmount - totalDiscountAmount)}
+
{currencyFormat(totalAmount - totalDiscountAmount - discountVoucher)}
PPN 11%
@@ -862,27 +872,29 @@ const Checkout = () => { onClick={() => SetBottomPopup(true)} className='text-gray-900 p-3 flex items-center justify-between rounded-lg bg-white border font-medium border-gray-300 hover:bg-gray-100 py-2.5 h-[50px] w-[100%]' > - - {''} - - {activeVoucher ? ( -
-
- Hemat {currencyFormat(discountVoucher)} -
-
- Voucher berhasil digunakan -
-
- ) : ( - - Hemat belanja dengan promo +
+ + {''} - )} + {activeVoucher ? ( +
+
+ Hemat {currencyFormat(discountVoucher)} +
+
+ Voucher berhasil digunakan +
+
+ ) : ( + + Hemat belanja dengan promo + + )} +
{'>'}
-- cgit v1.2.3 From 3f890e6d482cefba37014e021cb4c2b8d5de2a9d Mon Sep 17 00:00:00 2001 From: "HATEC\\SPVDEV001" Date: Wed, 12 Jul 2023 14:31:07 +0700 Subject: cr --- src/lib/checkout/components/Checkout.jsx | 34 +++++++++++----------- .../product/components/Product/ProductDesktop.jsx | 4 +-- 2 files changed, 19 insertions(+), 19 deletions(-) (limited to 'src/lib') diff --git a/src/lib/checkout/components/Checkout.jsx b/src/lib/checkout/components/Checkout.jsx index 6990b420..27cdda76 100644 --- a/src/lib/checkout/components/Checkout.jsx +++ b/src/lib/checkout/components/Checkout.jsx @@ -17,6 +17,7 @@ import { useRouter } from 'next/router' import VariantGroupCard from '@/lib/variant/components/VariantGroupCard' import axios from 'axios' import Image from '@/core/components/elements/Image/Image' +import imageNext from 'next/image' import MobileView from '@/core/components/views/MobileView' import DesktopView from '@/core/components/views/DesktopView' import ExpedisiList from '../api/ExpedisiList' @@ -136,15 +137,11 @@ const Checkout = () => { let dataVoucherIndex = listVouchers.findIndex((voucher) => voucher.code == code) let dataActiveVoucher = listVouchers[dataVoucherIndex] - console.log('ini data active', dataActiveVoucher, code, dataVoucherIndex) let countDiscount = 0 if (dataActiveVoucher.discountType === 'percentage') { - countDiscount = (totalAmount - totalDiscountAmount) * 0.1 - if ( - dataActiveVoucher.maxDiscountAmount > 0 && - countDiscount > dataActiveVoucher.maxDiscountAmount - ) { + countDiscount = (totalAmount - totalDiscountAmount) * (dataActiveVoucher.discountAmount/100) + if (dataActiveVoucher.maxDiscountAmount > 0 && countDiscount > dataActiveVoucher.maxDiscountAmount) { countDiscount = dataActiveVoucher.maxDiscountAmount } } else { @@ -331,10 +328,14 @@ const Checkout = () => { } const handleUseVoucher = async (code) => { - SetActiveVoucher(code) - SetFindVoucher(null) - document.getElementById('uniqCode').value = '' - SetButtonTerapkan(false) + if(code === activeVoucher){ + SetActiveVoucher(null) + }else{ + SetActiveVoucher(code) + SetFindVoucher(null) + document.getElementById('uniqCode').value = '' + SetButtonTerapkan(false) + } } const onChangeCodeVoucher = async (e) => { @@ -354,7 +355,7 @@ const Checkout = () => { >
-
+
{
)} -
+
{!listVouchers ? (
@@ -418,7 +419,7 @@ const Checkout = () => {
-
+
{item.name}
@@ -434,9 +435,8 @@ const Checkout = () => { className='btn-solid-red w-[102px] md:flex-none rounded-md' type='button' onClick={() => handleUseVoucher(item.code)} - disabled={activeVoucher === item.code} > - {activeVoucher === item.code ? 'Terpakai' : 'Pakai'} + {activeVoucher === item.code ? 'Batal' : 'Pakai'}
@@ -609,7 +609,7 @@ const Checkout = () => { {''} {activeVoucher ? ( @@ -823,7 +823,7 @@ const Checkout = () => {
{currencyFormat(totalAmount)}
-
Total Diskon
+
Diskon Produk
- {currencyFormat(totalDiscountAmount)}
{activeVoucher && ( diff --git a/src/lib/product/components/Product/ProductDesktop.jsx b/src/lib/product/components/Product/ProductDesktop.jsx index 6a87d022..cafab721 100644 --- a/src/lib/product/components/Product/ProductDesktop.jsx +++ b/src/lib/product/components/Product/ProductDesktop.jsx @@ -66,9 +66,9 @@ const ProductDesktop = ({ product, wishlist, toggleWishlist }) => { } const handleBuy = (variant) => { - const quantity = variantQuantityRefs.current[variant.id].value + const quantity = variantQuantityRefs.current[variant].value if (!validQuantity(quantity)) return - router.push(`/shop/checkout?productId=${variant.id}&quantity=${quantity}`) + router.push(`/shop/checkout?productId=${variant}&quantity=${quantity}`) } const variantSectionRef = useRef(null) -- cgit v1.2.3