From a63b03fffdf46ecddecf356d1d00d6582add75cf Mon Sep 17 00:00:00 2001 From: it-fixcomart Date: Tue, 6 Aug 2024 17:05:01 +0700 Subject: update cart pop up --- src/contexts/ProductCartContext.js | 4 +- src/contexts/ProductQuotationContext.js | 17 ------ .../components/elements/Navbar/NavbarDesktop.jsx | 35 +++++------ src/lib/quotation/components/Quotationheader.jsx | 67 ++++++++++++++++++---- 4 files changed, 76 insertions(+), 47 deletions(-) delete mode 100644 src/contexts/ProductQuotationContext.js (limited to 'src') diff --git a/src/contexts/ProductCartContext.js b/src/contexts/ProductCartContext.js index 06e97563..19889e07 100644 --- a/src/contexts/ProductCartContext.js +++ b/src/contexts/ProductCartContext.js @@ -4,12 +4,14 @@ const ProductCartContext = createContext() export const ProductCartProvider = ({ children }) => { const [productCart, setProductCart] = useState(null) + const [productQuotation, setProductQuotation] = useState(null) + const [refreshQuotation, setRefreshQuotation] = useState(false) const [refreshCart, setRefreshCart] = useState(false) const [isLoading, setIsloading] = useState(false) return ( {children} diff --git a/src/contexts/ProductQuotationContext.js b/src/contexts/ProductQuotationContext.js deleted file mode 100644 index f9e17830..00000000 --- a/src/contexts/ProductQuotationContext.js +++ /dev/null @@ -1,17 +0,0 @@ -import React, { createContext, useContext, useState } from 'react'; - -const ProductQuotationContext = createContext(); - -export const useProductQuotationContext = () => useContext(ProductQuotationContext); - -export const ProductQuotationProvider = ({ children }) => { - const [productQuotation, setProductQuotation] = useState([]); - const [refreshQuotation, setRefreshQuotation] = useState(false); - const [isLoading, setIsloading] = useState(false); - - return ( - - {children} - - ); -}; diff --git a/src/core/components/elements/Navbar/NavbarDesktop.jsx b/src/core/components/elements/Navbar/NavbarDesktop.jsx index 49c4cd6e..c0e9b383 100644 --- a/src/core/components/elements/Navbar/NavbarDesktop.jsx +++ b/src/core/components/elements/Navbar/NavbarDesktop.jsx @@ -7,7 +7,7 @@ import IndoteknikLogo from '@/images/logo.png'; import Cardheader from '@/lib/cart/components/Cartheader'; import Quotationheader from '@/lib/quotation/components/QuotationHeader' import Category from '@/lib/category/components/Category'; -import { useProductQuotationContext } from '@/contexts/ProductQuotationContext' +import { useProductCartContext } from '@/contexts/ProductCartContext'; import { ChevronDownIcon, DocumentCheckIcon, @@ -41,8 +41,9 @@ const NavbarDesktop = () => { const [cartCount, setCartCount] = useState(0); const [quotationCount, setQuotationCount] = useState(0); - // const { setProductQuotation, refreshQuotation, setRefreshQuotation, isLoading, setIsloading } = useProductQuotationContext() - + const { productCart, setProductCart, refreshCart, setRefreshCart, isLoading, setIsloading, productQuotation, setProductQuotation, refreshQuotation, setRefreshQuotation } = + useProductCartContext(); + const [pendingTransactions, setPendingTransactions] = useState([]) const [templateWA, setTemplateWA] = useState(null); const [payloadWA, setPayloadWa] = useState(null); const [urlPath, setUrlPath] = useState(null); @@ -51,15 +52,22 @@ const NavbarDesktop = () => { const { product } = useProductContext(); const { isOpen, onOpen, onClose } = useDisclosure(); - + const query = { context: 'quotation', site: - (auth?.webRole === null && auth?.site ? auth.site : null), + (auth?.webRole === null && auth?.site ? auth.site : null), }; - const { transactions } = useTransactions({query}); - const pendingTransactions = transactions?.data?.saleOrders.filter(transaction => transaction.status === 'draft'); + const { transactions } = useTransactions({ query }); + const data = transactions?.data?.saleOrders.filter( + (transaction) => transaction.status === 'draft' + ); + + useEffect(() => { + setProductQuotation(data); + setPendingTransactions(data); + }, [transactions.data]); useEffect(() => { @@ -83,7 +91,7 @@ const NavbarDesktop = () => { }; cart(); }; - handleCartChange(); + handleCartChange(); window.addEventListener('localStorageChange', handleCartChange); @@ -91,12 +99,6 @@ const NavbarDesktop = () => { window.removeEventListener('localStorageChange', handleCartChange); }; }, []); - - // useEffect(() => { - // setProductQuotation(pendingTransactions) - // }, [transactions, ]) - // console.log("Pending Transactions", pendingTransactions); - // console.log("pendingTransactions.length", pendingTransactions.length); useEffect(() => { const handleQuotationChange = () => { @@ -112,8 +114,8 @@ const NavbarDesktop = () => { return () => { window.removeEventListener('localStorageChange', handleQuotationChange); }; - }, []); - console.log("quotationCount",quotationCount) + }, [pendingTransactions]); + return ( @@ -176,7 +178,6 @@ const NavbarDesktop = () => {
- diff --git a/src/lib/quotation/components/Quotationheader.jsx b/src/lib/quotation/components/Quotationheader.jsx index 141b731e..9f0f17a6 100644 --- a/src/lib/quotation/components/Quotationheader.jsx +++ b/src/lib/quotation/components/Quotationheader.jsx @@ -1,16 +1,15 @@ import { useCallback, useEffect, useMemo, useState } from 'react'; -import { getQuotationApi } from '../api/QuotationApi'; -import currencyFormat from '@/core/utils/currencyFormat'; import { createSlug } from '@/core/utils/slug'; import useAuth from '@/core/hooks/useAuth'; import { useRouter } from 'next/router'; import odooApi from '@/core/api/odooApi'; -import { useProductQuotationContext } from '@/contexts/ProductQuotationContext'; +import { useProductCartContext } from '@/contexts/ProductCartContext'; import Image from '@/core/components/elements/Image/Image'; import whatsappUrl from '@/core/utils/whatsappUrl'; import { AnimatePresence, motion } from 'framer-motion'; import style from '../../../../src-migrate/modules/cart/styles/item-promo.module.css'; import useTransactions from '../../transaction/hooks/useTransactions'; +import currencyFormat from '@/core/utils/currencyFormat'; const { DocumentCheckIcon, PhotoIcon } = require('@heroicons/react/24/outline'); const { default: Link } = require('next/link'); @@ -20,14 +19,14 @@ const Quotationheader = (quotationCount) => { context: 'quotation', site: auth?.webRole === null && auth?.site ? auth.site : null, }; - + const router = useRouter(); const [subTotal, setSubTotal] = useState(null); const [buttonLoading, SetButtonTerapkan] = useState(false); const itemLoading = [1, 2, 3]; const [countQuotation, setCountQuotation] = useState(null); - const { productQuotation, setProductQuotation, refreshQuotation, setRefreshQuotation, isLoading, setIsloading } = - useProductQuotationContext(); + const { productCart, setProductCart, refreshCart, setRefreshCart, isLoading, setIsloading, productQuotation, setProductQuotation, refreshQuotation, setRefreshQuotation } = + useProductCartContext(); const [isHovered, setIsHovered] = useState(false); const [isTop, setIsTop] = useState(true); @@ -49,12 +48,12 @@ const Quotationheader = (quotationCount) => { refreshCartf(); } }; + let { transactions } = useTransactions({ query }); const refreshCartf = useCallback(async () => { setIsloading(true); - let { transactions } = await useTransactions({ query }); let pendingTransactions = transactions?.data?.saleOrders.filter(transaction => transaction.status === 'draft'); setProductQuotation(pendingTransactions); - setCountQuotation(pendingTransactions.length); + setCountQuotation(pendingTransactions?.length ? pendingTransactions?.length : pendingTransactions?.length); setIsloading(false); }, [setProductQuotation, setIsloading]); @@ -66,7 +65,7 @@ const Quotationheader = (quotationCount) => { }, [refreshQuotation, refreshCartf, setRefreshQuotation]); useEffect(() => { - setCountQuotation(quotationCount.cartCount); + setCountQuotation(quotationCount.quotationCount); }, [quotationCount]); useEffect(() => { @@ -85,6 +84,8 @@ const Quotationheader = (quotationCount) => { router.push('/shop/quotation'); }; + console.log("quotation",qotation) + return (
@@ -105,7 +106,7 @@ const Quotationheader = (quotationCount) => { )}
- Daftar + List
Quotation
@@ -137,7 +138,7 @@ const Quotationheader = (quotationCount) => { >
Daftar Quotation
- + Lihat Semua
@@ -150,7 +151,7 @@ const Quotationheader = (quotationCount) => { Login {' '} - Untuk Melihat Daftar Keranjang Belanja Anda + Untuk Melihat Daftar Quotation Anda

)} @@ -176,6 +177,48 @@ const Quotationheader = (quotationCount) => {

)} + {auth && qotation.length > 0 && !isLoading && ( + <> +
    + {qotation && + qotation?.map((product, index) => ( + <> +
  • +
    +
    +

    {product.dateOrder}

    +

    Pending Quotation

    +
    +
    +
    +

    + No. Transaksi +

    +

    + {product.name} +

    +
    +
    +

    + No. Purchase Order +

    +

    + {product.purchaseOrderFile} +

    +
    +
    +
    +

    Total

    +

    {currencyFormat(product.amountTotal)}

    +
    +
    +
  • + + ))} +
+
+ + )} -- cgit v1.2.3