From 9836f109c38d7f02c587329795e80e15ff33aafa Mon Sep 17 00:00:00 2001 From: "HATEC\\SPVDEV001" Date: Tue, 10 Oct 2023 17:09:23 +0700 Subject: add qty di nenu brang , filter ready stock, filter haga fix di page search --- .../product/components/ProductFilterDesktop.jsx | 77 ++++++++++++++++++++-- src/lib/product/components/ProductSearch.jsx | 19 +++++- src/pages/api/shop/search.js | 6 +- 3 files changed, 92 insertions(+), 10 deletions(-) (limited to 'src') diff --git a/src/lib/product/components/ProductFilterDesktop.jsx b/src/lib/product/components/ProductFilterDesktop.jsx index b64349c7..08766e07 100644 --- a/src/lib/product/components/ProductFilterDesktop.jsx +++ b/src/lib/product/components/ProductFilterDesktop.jsx @@ -26,6 +26,7 @@ const ProductFilterDesktop = ({ brands, categories, prefixUrl, defaultBrand = nu const [categoryValues, setCategory] = useState(query?.category?.split(',') || []) const [priceFrom, setPriceFrom] = useState(query?.priceFrom) const [priceTo, setPriceTo] = useState(query?.priceTo) + const [stock, setStock] = useState(query?.stock) const handleCategoriesChange = (event) => { const value = event.target.value @@ -46,6 +47,38 @@ const ProductFilterDesktop = ({ brands, categories, prefixUrl, defaultBrand = nu } } + const handleReadyStockChange = (event) => { + const value = event.target.value + const isChecked = event.target.checked + if (isChecked) { + setStock(value) + } else { + setStock(null) + } + } + + const handlePriceFromChange = async (type) => { + let priceFrom = null + let priceTo = null + switch (type) { + case(1): + priceFrom = 100000 + priceFrom = 200000 + break; + case(2): + priceFrom = 100000 + priceFrom = 200000 + break; + case(1): + priceFrom = 100000 + priceFrom = 200000 + break; + } + await setPriceFrom(priceFrom) + await setPriceTo(priceTo) + handleSubmit() + } + const handleSubmit = () => { let params = { q: router.query.q, @@ -53,7 +86,8 @@ const ProductFilterDesktop = ({ brands, categories, prefixUrl, defaultBrand = nu brand: brandValues.join(','), category: categoryValues.join(','), priceFrom, - priceTo + priceTo, + stock : stock } params = _.pickBy(params, _.identity) params = toQuery(params) @@ -74,14 +108,19 @@ const ProductFilterDesktop = ({ brands, categories, prefixUrl, defaultBrand = nu {brands.map((brand, index) => ( -
+
- {brand} +
+ {brand.brand} +
+ {brand.qty > 99 ? '99+' : brand.qty} +
+
))} @@ -143,9 +182,37 @@ const ProductFilterDesktop = ({ brands, categories, prefixUrl, defaultBrand = nu onChange={(e) => setPriceTo(e.target.value)} /> +
+ + +
+
+ + +
+ + + + + Ketersedian Stok + + + + + + + Ketersedian Stock + + + - -
-
- - +
+ {priceRange.map((price, i) => ( + + ))}
-- cgit v1.2.3 From f4fb8d1f93024cfe907a5783215cf9c939dd59bc Mon Sep 17 00:00:00 2001 From: "HATEC\\SPVDEV001" Date: Wed, 11 Oct 2023 11:02:04 +0700 Subject: filter by limit rows --- src/lib/product/components/ProductFilter.jsx | 4 +-- src/lib/product/components/ProductSearch.jsx | 40 +++++++++++++++++++++++----- src/pages/api/shop/search.js | 2 +- 3 files changed, 37 insertions(+), 9 deletions(-) (limited to 'src') diff --git a/src/lib/product/components/ProductFilter.jsx b/src/lib/product/components/ProductFilter.jsx index 34357526..7dadc39e 100644 --- a/src/lib/product/components/ProductFilter.jsx +++ b/src/lib/product/components/ProductFilter.jsx @@ -48,8 +48,8 @@ const ProductFilter = ({ active, close, brands, categories, prefixUrl, defaultBr > {brands.map((brand, index) => ( - ))} diff --git a/src/lib/product/components/ProductSearch.jsx b/src/lib/product/components/ProductSearch.jsx index 3c3dbfd2..c79e355e 100644 --- a/src/lib/product/components/ProductSearch.jsx +++ b/src/lib/product/components/ProductSearch.jsx @@ -20,17 +20,20 @@ const ProductSearch = ({ query, prefixUrl, defaultBrand = null }) => { const router = useRouter() const { page = 1 } = query const [q, setQ] = useState(query?.q || '*') + const [limit, setLimit] = useState(query?.limit || 30) if (defaultBrand) query.brand = defaultBrand.toLowerCase() - const { productSearch } = useProductSearch({ query: { ...query, q } }) + const { productSearch } = useProductSearch({ query: { ...query, q, limit } }) const [products, setProducts] = useState(null) const [spellings, setSpellings] = useState(null) const popup = useActive() + const numRows = [30, 50, 80, 100] + console.log('ini product search', productSearch.data) const pageCount = Math.ceil( - productSearch.data?.response.numFound / productSearch.data?.responseHeader.params.rows + productSearch.data?.response.numFound / limit ) const productStart = productSearch.data?.responseHeader.params.start - const productRows = productSearch.data?.responseHeader.params.rows + const productRows = limit const productFound = productSearch.data?.response.numFound useEffect(() => { @@ -101,7 +104,17 @@ const ProductSearch = ({ query, prefixUrl, defaultBrand = null }) => { const handleOrderBy = (e) => { let params = { ...router.query, - orderBy: e.target.value + orderBy: e.target.value, + } + params = _.pickBy(params, _.identity) + params = toQuery(params) + router.push(`${prefixUrl}?${params}`) + } + + const handleLimit = (e) => { + let params = { + ...router.query, + limit: e.target.value, } params = _.pickBy(params, _.identity) params = toQuery(params) @@ -210,9 +223,9 @@ const ProductSearch = ({ query, prefixUrl, defaultBrand = null }) => { {pageCount > 1 ? ( <> {productStart + 1}- - {productStart + productRows > productFound + {parseInt(productStart) + parseInt(productRows) > productFound ? productFound - : productStart + productRows} + : parseInt(productStart) + parseInt(productRows)}  dari  ) : ( @@ -247,6 +260,21 @@ const ProductSearch = ({ query, prefixUrl, defaultBrand = null }) => { ))}
+
+ +
{productSearch.isLoading && } diff --git a/src/pages/api/shop/search.js b/src/pages/api/shop/search.js index 0c79831b..874431e0 100644 --- a/src/pages/api/shop/search.js +++ b/src/pages/api/shop/search.js @@ -13,7 +13,7 @@ export default async function handler(req, res) { orderBy = '', operation = 'AND', fq = '', - limit = 30, + limit = '', stock = '' } = req.query -- cgit v1.2.3 From de61c739202db29270d4ffd9215091f0219aba8c Mon Sep 17 00:00:00 2001 From: "HATEC\\SPVDEV001" Date: Wed, 11 Oct 2023 14:37:47 +0700 Subject: filter di web mobile --- src/lib/product/components/ProductFilter.jsx | 81 +++++++++++++++++++++- .../product/components/ProductFilterDesktop.jsx | 8 +-- src/lib/product/components/ProductSearch.jsx | 38 +++++++--- 3 files changed, 109 insertions(+), 18 deletions(-) (limited to 'src') diff --git a/src/lib/product/components/ProductFilter.jsx b/src/lib/product/components/ProductFilter.jsx index 7dadc39e..20c66a1f 100644 --- a/src/lib/product/components/ProductFilter.jsx +++ b/src/lib/product/components/ProductFilter.jsx @@ -3,6 +3,7 @@ import { useRouter } from 'next/router' import { useState } from 'react' import _ from 'lodash' import { toQuery } from 'lodash-contrib' +import { Checkbox } from '@chakra-ui/react' const orderOptions = [ { value: 'price-asc', label: 'Harga Terendah' }, @@ -20,6 +21,45 @@ const ProductFilter = ({ active, close, brands, categories, prefixUrl, defaultBr const [priceFrom, setPriceFrom] = useState(query?.priceFrom) const [priceTo, setPriceTo] = useState(query?.priceTo) + const [stock, setStock] = useState(query?.stock) + + const [activeRange, setActiveRange] = useState(null) + + const priceRange = [ + { + priceFrom: 100000, + priceTo: 200000 + }, + { + priceFrom: 200000, + priceTo: 300000 + }, + { + priceFrom: 300000, + priceTo: 400000 + }, + { + priceFrom: 400000, + priceTo: 500000 + } + ] + + const handlePriceFromChange = async (priceFromr, priceTor, index) => { + await setPriceFrom(priceFromr) + await setPriceTo(priceTor) + setActiveRange(index) + } + + const handleReadyStockChange = (event) => { + const value = event.target.value + const isChecked = event.target.checked + if (isChecked) { + setStock(value) + } else { + setStock(null) + } + } + const handleSubmit = () => { let params = { q: router.query.q, @@ -27,13 +67,23 @@ const ProductFilter = ({ active, close, brands, categories, prefixUrl, defaultBr brand, category, priceFrom, - priceTo + priceTo, + stock: stock } params = _.pickBy(params, _.identity) params = toQuery(params) router.push(`${prefixUrl}?${params}`) } + const formatCurrency = (value) => { + if (value >= 1000) { + const thousands = Math.floor(value / 1000) // Menghitung ribuan + return `Rp${thousands}k` + } else { + return `Rp${value}` + } + } + return (
@@ -49,7 +99,7 @@ const ProductFilter = ({ active, close, brands, categories, prefixUrl, defaultBr {brands.map((brand, index) => ( ))} @@ -106,6 +156,33 @@ const ProductFilter = ({ active, close, brands, categories, prefixUrl, defaultBr onChange={(e) => setPriceTo(e.target.value)} />
+
+ {priceRange.map((price, i) => ( + + ))} +
+ +
+ +
+ + Ketersedian Stok + +
+
+
+ +
+
+ +
+
)}
-- cgit v1.2.3 From e4bce35fe6ec891bb8841bbfad981e97f5bb2aa8 Mon Sep 17 00:00:00 2001 From: "HATEC\\SPVDEV001" Date: Wed, 11 Oct 2023 15:08:29 +0700 Subject: filter page brand --- src/lib/product/components/ProductFilter.jsx | 39 +++++++------- .../product/components/ProductFilterDesktop.jsx | 60 ++++++++++++---------- 2 files changed, 53 insertions(+), 46 deletions(-) (limited to 'src') diff --git a/src/lib/product/components/ProductFilter.jsx b/src/lib/product/components/ProductFilter.jsx index 20c66a1f..40bfc824 100644 --- a/src/lib/product/components/ProductFilter.jsx +++ b/src/lib/product/components/ProductFilter.jsx @@ -87,24 +87,27 @@ const ProductFilter = ({ active, close, brands, categories, prefixUrl, defaultBr return (
- {!defaultBrand && ( -
- - -
- )} + {!router.pathname.includes('brands') && + !defaultBrand && ( +
+ + +
+ ) + } +