diff --git a/frontend/src/pages/Products/Products.js b/frontend/src/pages/Products/Products.js index 9eb1c64..41e273e 100644 --- a/frontend/src/pages/Products/Products.js +++ b/frontend/src/pages/Products/Products.js @@ -7,7 +7,7 @@ import { TrashIcon, PencilIcon } from '@heroicons/react/24/outline'; -import { productsAPI, productSpreaderSettingsAPI } from '../../services/api'; +import { productsAPI, productSpreaderSettingsAPI, equipmentAPI } from '../../services/api'; import LoadingSpinner from '../../components/UI/LoadingSpinner'; import toast from 'react-hot-toast'; @@ -76,7 +76,9 @@ const Products = () => { const settingPromises = productData.spreaderSettings.map(setting => productSpreaderSettingsAPI.create({ userProductId: createdProduct.id, - spreaderBrand: setting.spreaderBrand, + equipmentId: setting.equipmentId ? parseInt(setting.equipmentId) : null, + // Legacy fields for backward compatibility + spreaderBrand: setting.spreaderBrand || null, spreaderModel: setting.spreaderModel || null, settingValue: setting.settingValue, rateDescription: setting.rateDescription || null, @@ -417,24 +419,51 @@ const CreateProductModal = ({ onSubmit, onCancel, sharedProducts, categories }) }); const [spreaderSettings, setSpreaderSettings] = useState([]); + const [availableSpreaders, setAvailableSpreaders] = useState([]); + const [loadingSpreaders, setLoadingSpreaders] = useState(false); const [newSpreaderSetting, setNewSpreaderSetting] = useState({ - spreaderBrand: '', - spreaderModel: '', + equipmentId: '', settingValue: '', rateDescription: '', notes: '' }); + // Load user's spreader equipment + useEffect(() => { + const loadSpreaders = async () => { + setLoadingSpreaders(true); + try { + const response = await equipmentAPI.getSpreaders(); + setAvailableSpreaders(response.data.data.spreaders || []); + } catch (error) { + console.error('Failed to load spreaders:', error); + toast.error('Failed to load spreader equipment'); + } finally { + setLoadingSpreaders(false); + } + }; + + loadSpreaders(); + }, []); + const addSpreaderSetting = () => { - if (!newSpreaderSetting.spreaderBrand || !newSpreaderSetting.settingValue) { - toast.error('Please enter spreader brand and setting value'); + if (!newSpreaderSetting.equipmentId || !newSpreaderSetting.settingValue) { + toast.error('Please select spreader equipment and enter setting value'); return; } - setSpreaderSettings([...spreaderSettings, { ...newSpreaderSetting, id: Date.now() }]); + const selectedSpreader = availableSpreaders.find(s => s.id === parseInt(newSpreaderSetting.equipmentId)); + const settingWithSpreaderInfo = { + ...newSpreaderSetting, + id: Date.now(), + equipmentName: selectedSpreader?.name, + equipmentManufacturer: selectedSpreader?.manufacturer, + equipmentModel: selectedSpreader?.model + }; + + setSpreaderSettings([...spreaderSettings, settingWithSpreaderInfo]); setNewSpreaderSetting({ - spreaderBrand: '', - spreaderModel: '', + equipmentId: '', settingValue: '', rateDescription: '', notes: '' @@ -612,7 +641,7 @@ const CreateProductModal = ({ onSubmit, onCancel, sharedProducts, categories })
No spreader equipment found. Please add spreader equipment to your inventory first.
+No spreader equipment found. Please add spreader equipment to your inventory first.