diff --git a/app/(protected)/facturas/invoice-form-modal.tsx b/app/(protected)/facturas/invoice-form-modal.tsx index d9ff576..6dbaf75 100644 --- a/app/(protected)/facturas/invoice-form-modal.tsx +++ b/app/(protected)/facturas/invoice-form-modal.tsx @@ -3,13 +3,12 @@ import { useState, useEffect } from 'react' import { Modal } from '@/components/ui/modal' import { Button } from '@/components/ui/button' -import { Input } from '@/components/ui/input' import { ConfirmationModal } from '@/components/ui/confirmation-modal' import { Textarea } from '@/components/ui/textarea' import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select' import { Combobox } from '@/components/ui/combobox' import { formatCurrency } from '@/lib/utils' -import { Trash2, Search } from 'lucide-react' +import { Trash2 } from 'lucide-react' import { createInvoice, updateInvoice } from '@/lib/actions/invoices' import { useQuery } from '@tanstack/react-query' @@ -56,14 +55,13 @@ interface InvoiceItem { export function InvoiceFormModal({ isOpen, onClose, onSuccess, customers, products, businessSettings, invoice }: InvoiceFormModalProps) { const [loading, setLoading] = useState(false) const [selectedCustomerId, setSelectedCustomerId] = useState('') + const [paymentMethod, setPaymentMethod] = useState('') const [items, setItems] = useState([]) - const [showProductDropdown, setShowProductDropdown] = useState(false) - const [productSearch, setProductSearch] = useState('') const [itemToRemove, setItemToRemove] = useState(null) const [draftQuantities, setDraftQuantities] = useState>({}) const isEditing = !!invoice - const taxRate = businessSettings?.taxRate || 16 + const taxRate = businessSettings?.taxRate ?? 16 const { data: paymentMethods = [] } = useQuery({ queryKey: ['payment-methods'], @@ -105,10 +103,9 @@ export function InvoiceFormModal({ isOpen, onClose, onSuccess, customers, produc } }, [isOpen, invoice]) - const filteredProducts = products.filter(p => - p.name.toLowerCase().includes(productSearch.toLowerCase()) && - !items.find(i => i.productId === p.id) - ).slice(0, 5) + const productOptions = products + .filter(p => !items.find(i => i.productId === p.id)) + .map(p => ({ value: p.id, label: p.name })) const subtotal = items.reduce((sum, item) => sum + item.quantity * item.unitPrice, 0) const taxAmount = subtotal * (taxRate / 100) @@ -124,8 +121,6 @@ export function InvoiceFormModal({ isOpen, onClose, onSuccess, customers, produc unitPrice: product.salePrice }]) setDraftQuantities(prev => ({ ...prev, [id]: '1' })) - setProductSearch('') - setShowProductDropdown(false) } const updateItem = (id: string, field: string, value: number) => { @@ -168,6 +163,7 @@ export function InvoiceFormModal({ isOpen, onClose, onSuccess, customers, produc formData.set('customerTin', selectedCustomer?.tin || '') formData.set('customerAddress', selectedCustomer?.address || '') formData.set('customerEmail', selectedCustomer?.email || '') + formData.set('paymentMethod', paymentMethod) formData.set('items', JSON.stringify(items.map(({ id, productId, productName, quantity, unitPrice }) => ({ productId, productName, quantity, unitPrice })))) @@ -207,54 +203,44 @@ export function InvoiceFormModal({ isOpen, onClose, onSuccess, customers, produc
- + {paymentMethods.length > 8 ? ( + ({ value: pm.name, label: pm.name }))} + value={paymentMethod} + onValueChange={setPaymentMethod} + placeholder="Seleccionar..." + className="w-full" + /> + ) : ( + + )}
-
-

Productos

-
- - { - setProductSearch(e.target.value) - setShowProductDropdown(true) - }} - onFocus={() => setShowProductDropdown(true)} - placeholder="Agregar producto..." - className="pl-9" - /> - {showProductDropdown && productSearch && ( -
- {filteredProducts.map(product => ( - - ))} -
- )} +
+
+ { + const product = products.find(p => p.id === val) + if (product) addItem(product) + }} + placeholder="Buscar producto..." + className="w-full" + /> +
-
{items.length === 0 ? (
diff --git a/components/ui/select.tsx b/components/ui/select.tsx index 275f51a..7d3ee49 100644 --- a/components/ui/select.tsx +++ b/components/ui/select.tsx @@ -16,7 +16,7 @@ const SelectTrigger = React.forwardRef<