diff options
Diffstat (limited to 'src/lib/product')
| -rw-r--r-- | src/lib/product/components/ProductFilterDesktop.jsx | 77 | ||||
| -rw-r--r-- | src/lib/product/components/ProductSearch.jsx | 19 |
2 files changed, 88 insertions, 8 deletions
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 <AccordionPanel> <Stack gap={3} direction='column' maxH={'240px'} overflow='auto'> {brands.map((brand, index) => ( - <div className='flex items-center gap-2' key={index}> + <div className='flex items-center gap-2 ' key={index}> <Checkbox - isChecked={brandValues.includes(brand)} + isChecked={brandValues.includes(brand.brand)} onChange={handleBrandsChange} - value={brand} + value={brand.brand} size='md' > - {brand} + <div className='flex items-center gap-2'> + <span>{brand.brand} </span> + <div className='badge-solid-red w-[30px] text-center'> + {brand.qty > 99 ? '99+' : brand.qty} + </div> + </div> </Checkbox> </div> ))} @@ -143,9 +182,37 @@ const ProductFilterDesktop = ({ brands, categories, prefixUrl, defaultBrand = nu onChange={(e) => setPriceTo(e.target.value)} /> </InputGroup> + <div className='flex items-center gap-x-2'> + <button onClick={() => handlePriceFromChange(1)} className='w-full border border-gray_r-9 p-3 rounded-full text-sm whitespace-nowrap'>{'Rp100k-Rp200k'}</button> + <button className='w-full border border-gray_r-9 p-3 rounded-full text-sm whitespace-nowrap'>{'Rp200k-Rp300k'}</button> + </div> + <div className='flex items-center gap-x-2'> + <button className='w-full border border-gray_r-9 p-3 rounded-full text-sm whitespace-nowrap'>{'Rp300k-Rp400k'}</button> + <button className='w-full border border-gray_r-9 p-3 rounded-full text-sm whitespace-nowrap'>{'Rp400k-Rp500k'}</button> + </div> </VStack> </AccordionPanel> </AccordionItem> + + <AccordionItem> + <AccordionButton padding={[2, 4]}> + <Box as='span' flex='1' textAlign='left' fontWeight='semibold'> + Ketersedian Stok + </Box> + <AccordionIcon /> + </AccordionButton> + + <AccordionPanel paddingY={4}> + <Checkbox + isChecked={stock === 'ready stock'} + onChange={handleReadyStockChange} + value={'ready stock'} + size='md' + > + Ketersedian Stock + </Checkbox> + </AccordionPanel> + </AccordionItem> </Accordion> <Button className='w-full mt-6' colorScheme='red' onClick={handleSubmit}> diff --git a/src/lib/product/components/ProductSearch.jsx b/src/lib/product/components/ProductSearch.jsx index df9aa91b..3c3dbfd2 100644 --- a/src/lib/product/components/ProductSearch.jsx +++ b/src/lib/product/components/ProductSearch.jsx @@ -63,13 +63,26 @@ const ProductSearch = ({ query, prefixUrl, defaultBrand = null }) => { } }, [productFound, query, spellings]) - const brands = productSearch.data?.facetCounts?.facetFields?.manufactureName?.filter( + const brands = [] + for ( + let i = 0; + i < productSearch.data?.facetCounts?.facetFields?.manufactureName.length; + i += 2 + ) { + const brand = productSearch.data?.facetCounts?.facetFields?.manufactureName[i] + const qty = productSearch.data?.facetCounts?.facetFields?.manufactureName[i + 1] + brands.push({ brand, qty }) + } + /*const brandsList = productSearch.data?.facetCounts?.facetFields?.manufactureName?.filter( (value, index) => { if (index % 2 === 0) { - return true + const brand = value + const qty = index + 1 + brands.push({ brand, qty }) } } - ) + )*/ + const categories = productSearch.data?.facetCounts?.facetFields?.categoryName?.filter( (value, index) => { if (index % 2 === 0) { |