diff --git a/src/routes/private/real-boxes-create/DashboardCreateRealBox.tsx b/src/routes/private/real-boxes-create/DashboardCreateRealBox.tsx index 0917b6d..4ead500 100644 --- a/src/routes/private/real-boxes-create/DashboardCreateRealBox.tsx +++ b/src/routes/private/real-boxes-create/DashboardCreateRealBox.tsx @@ -15,6 +15,7 @@ import { notifyUnknownError } from '@/services/notification'; import { AddCircleRounded, Close } from '@mui/icons-material'; import { Box, + Button, Checkbox, Chip, CircularProgress, @@ -192,20 +193,20 @@ const DashboardCreateRealBoxPage = ({ initialValues, partiesData }: Props) => { const [paketName, setPaketName] = useState(''); const PacketRow = ({ index, field }: { index: number; field: any }) => { const packetId = watch(`packetItemDtos.${index}.packetId`); - // Tanlangan paketning name'ini olish const [itemsPage, setItemsPage] = useState(1); const [itemsList, setItemsList] = useState([]); const [itemsHasMore, setItemsHasMore] = useState(true); const itemScrollRef = useRef(null); - // Packetlar uchun scroll state const [packetsPage, setPacketsPage] = useState(1); const [packetsList, setPacketsList] = useState([]); - const selectedPacket = packetsList.find(p => p.id === packetId); const [packetsHasMore, setPacketsHasMore] = useState(true); + const [selectedProductNames, setSelectedProductNames] = useState<{ [packetIndex: number]: { [productId: number]: string } }>({}); + const [paketName, setPaketName] = useState(''); + const [lastPacketId, setLastPacketId] = useState(null); const { isLoading: isLoadingProducts } = useQuery({ queryKey: ['product-list', packetId, itemsPage], - queryFn: () => item_requests.list({ packetId, page: itemsPage }), + queryFn: () => item_requests.getAll({ packetId, page: itemsPage }), enabled: !!packetId, onSuccess: data => { const newItems = data?.data?.data?.data || []; @@ -215,7 +216,6 @@ const DashboardCreateRealBoxPage = ({ initialValues, partiesData }: Props) => { const packetScrollRef = useRef(null); const [keyword, setKeyword] = useState(''); - const { isFetching: isLoadingPackets } = useQuery({ queryKey: ['packets-list', partyId, keyword, packetsPage], queryFn: () => box_requests.getAll({ partyId, cargoId: keyword, page: packetsPage }), @@ -246,46 +246,11 @@ const DashboardCreateRealBoxPage = ({ initialValues, partiesData }: Props) => { } }; - useEffect(() => { - setItemsPage(1); - setItemsList([]); - setItemsHasMore(true); - }, [packetId]); - - const [selectedProductNames, setSelectedProductNames] = useState<{ [packetIndex: number]: { [productId: number]: string } }>({}); - - const handleSelectAll = (checked: boolean, packetIndex: number, packetId: number, itemsList: any[]) => { - setSelectedProductNames(prev => { - const prevNames = prev[packetIndex] || {}; - if (checked) { - // add all products of current page - const newNames = { ...prevNames }; - itemsList.forEach(p => { - newNames[p.id] = p.nameRu || p.name || String(p.id); - }); - return { ...prev, [packetIndex]: newNames }; - } else { - // remove all products of current page - const newNames = { ...prevNames }; - itemsList.forEach(p => { - delete newNames[p.id]; - }); - return { ...prev, [packetIndex]: newNames }; - } - }); - setValue( - `packetItemDtos.${packetIndex}.itemDtos`, - checked - ? Array.from(new Set([...(watch(`packetItemDtos.${packetIndex}.itemDtos`) || []), ...itemsList.map(p => p.id)])) - : (watch(`packetItemDtos.${packetIndex}.itemDtos`) || []).filter(id => !itemsList.some(p => p.id === id)) - ); - }; - const handleProductChange = (packetIndex: number, product: any, checked: boolean) => { setSelectedProductNames(prev => { const prevNames = prev[packetIndex] || {}; if (checked) { - return { ...prev, [packetIndex]: { ...prevNames, [product.id]: product.nameRu || product.name || String(product.id) } }; + return { ...prev, [packetIndex]: { ...prevNames, [product.id]: product.name || product.nameRu || String(product.id) } }; } else { const newNames = { ...prevNames }; delete newNames[product.id]; @@ -294,6 +259,46 @@ const DashboardCreateRealBoxPage = ({ initialValues, partiesData }: Props) => { }); }; + const handleSelectAllProducts = async () => { + if (!packetId) return; + let allProducts: any[] = []; + let page = 1; + let totalPages = 1; + try { + do { + const res = await item_requests.list({ packetId, page }); + const data = res?.data?.data; + const products = data?.data || []; + totalPages = data?.totalPages || 1; + allProducts = [...allProducts, ...products]; + page++; + } while (page <= totalPages); + } catch (e) { + // error silent + } + if (allProducts.length > 0) { + setValue( + `packetItemDtos.${index}.itemDtos`, + allProducts.map((p: any) => p.id) + ); + setSelectedProductNames((prev: any) => ({ + ...prev, + [index]: allProducts.reduce( + (acc, p) => ({ + ...acc, + [p.id]: p.name || p.nameRu || String(p.id), + }), + {} + ), + })); + } + }; + + const handleClearAll = () => { + setValue(`packetItemDtos.${index}.itemDtos`, []); + setSelectedProductNames((prev: any) => ({ ...prev, [index]: {} })); + }; + return (
@@ -339,6 +344,11 @@ const DashboardCreateRealBoxPage = ({ initialValues, partiesData }: Props) => { autoFocus: false, }} onClick={e => e.stopPropagation()} + onChange={e => { + field.onChange(e); + const selected = packetsList.find(p => p.id === e.target.value); + setPaketName(selected?.name || ''); + }} > {isLoadingPackets && packetsList.length === 0 ? ( @@ -381,22 +391,23 @@ const DashboardCreateRealBoxPage = ({ initialValues, partiesData }: Props) => { {packetId && ( - - {t('products')} - + + + {t('products')} + + + + + + {isLoadingProducts && itemsList.length === 0 ? ( ) : ( - {/* - 0 && selectedProducts.length < itemsList.length} - checked={itemsList.length > 0 && selectedProducts.length === itemsList.length} - onChange={e => handleSelectAll(e.target.checked)} - disabled={itemsList.length === 0} - /> - {t('select_all')} - */} { }} renderValue={selected => ( - {(selected as any[]).map(id => ( - p.id === id)?.nameRu || - itemsList.find(p => p.id === id)?.name || - id - } - onDelete={e => { - e.stopPropagation(); - field.onChange(field.value.filter((x: any) => x !== id)); - handleProductChange(index, { id }, false); - }} - /> - ))} + {(selected as any[]).map(id => { + return ( + p.id === id)?.name || + itemsList.find(p => p.id === id)?.nameRu || + id + } + onDelete={e => { + e.stopPropagation(); + field.onChange(field.value.filter((x: any) => x !== id)); + handleProductChange(index, { id }, false); + }} + /> + ); + })} )} > - - 0 && field.value.length < itemsList.length} - checked={ - itemsList.length > 0 && itemsList.every((p: any) => field.value.includes(p.id)) - } - onChange={e => handleSelectAll(e.target.checked, index, packetId, itemsList)} - /> - {t('select_all')} - {itemsList.map(product => ( { }} > - + ))}