diff --git a/src/app/admin/cars/[id]/page.jsx b/src/app/admin/cars/[id]/page.jsx
index 486c593..11d97fd 100644
--- a/src/app/admin/cars/[id]/page.jsx
+++ b/src/app/admin/cars/[id]/page.jsx
@@ -1,6 +1,55 @@
"use client";
import { useState } from 'react';
-import { Save, ArrowLeft } from 'lucide-react';
+import { Save, ArrowLeft, Plus, Star, Trash2 } from 'lucide-react';
+
+const ImageUpload = ({ images, onImageAdd, onImageRemove, onMainImage }) => {
+ return (
+
+
Images
+
+ {/* Grid de imagens */}
+
+ {images.map((image, index) => (
+
+

+
+
+
+
+
+ ))}
+
+ {/* Botão de upload */}
+
+
+
+ );
+};
export default function CarForm({ params }) {
const [car, setCar] = useState({
@@ -15,10 +64,40 @@ export default function CarForm({ params }) {
}
});
+ const [images, setImages] = useState([]);
+
+ const handleImageAdd = (e) => {
+ const files = Array.from(e.target.files);
+
+ files.forEach(file => {
+ const reader = new FileReader();
+ reader.onloadend = () => {
+ setImages(prev => [...prev, {
+ file,
+ url: reader.result,
+ isMain: images.length === 0 // primeira imagem é a principal
+ }]);
+ };
+ reader.readAsDataURL(file);
+ });
+ };
+
+ const handleImageRemove = (index) => {
+ setImages(prev => prev.filter((_, i) => i !== index));
+ };
+
+ const handleMainImage = (index) => {
+ setImages(prev => prev.map((img, i) => ({
+ ...img,
+ isMain: i === index
+ })));
+ };
+
const handleSubmit = async (e) => {
e.preventDefault();
// Aqui virá a integração com a API
console.log('Car data:', car);
+ console.log('Images:', images);
};
return (
@@ -140,13 +219,13 @@ export default function CarForm({ params }) {
- {/* Images - será implementado depois */}
-
-
Images
-
- Image upload coming soon...
-
-
+ {/* Images Section */}
+
{/* Submit Button */}