Enviar arquivos para "src/app/admin"

src/app/admin/page.jsx

@@ -0,0 +1,100 @@
+import React from 'react';
+import { Pencil, Trash, Plus } from 'lucide-react';
+
+const AdminDashboard = () => {
+  // Dados de exemplo (depois virão do backend)
+  const cars = [
+    {
+      id: 1,
+      name: 'BMW M4 2024',
+      price: 75000,
+      image: '/api/placeholder/200/150',
+      isSpecial: true
+    },
+    {
+      id: 2,
+      name: 'Mercedes-Benz C-Class 2015',
+      price: 35000,
+      image: '/api/placeholder/200/150',
+      isSpecial: true
+    }
+  ];
+
+  return (
+    <div className="min-h-screen bg-gray-50">
+      <header className="bg-white shadow-sm">
+        <div className="max-w-7xl mx-auto px-4 py-4 flex justify-between items-center">
+          <div className="w-48 h-12 bg-gray-200 rounded flex items-center justify-center">
+            <span className="text-gray-500">LOGO</span>
+          </div>
+          <span className="font-semibold text-gray-700">Admin Panel</span>
+        </div>
+      </header>
+
+      <main className="max-w-7xl mx-auto px-4 py-8">
+        {/* Add New Car Button */}
+        <div className="mb-8">
+          <button className="bg-blue-500 text-white px-6 py-2 rounded-lg hover:bg-blue-600 transition-colors flex items-center gap-2">
+            <Plus className="w-5 h-5" />
+            Add New Car
+          </button>
+        </div>
+
+        {/* Cars List */}
+        <div className="bg-white rounded-lg shadow">
+          <div className="py-4 px-6 border-b border-gray-200">
+            <h2 className="text-lg font-semibold text-gray-800">Cars Management</h2>
+          </div>
+          
+          <div className="overflow-x-auto">
+            <table className="w-full">
+              <thead className="bg-gray-50">
+                <tr>
+                  <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">Image</th>
+                  <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">Name</th>
+                  <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">Price</th>
+                  <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">Special</th>
+                  <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">Actions</th>
+                </tr>
+              </thead>
+              <tbody className="divide-y divide-gray-200">
+                {cars.map((car) => (
+                  <tr key={car.id}>
+                    <td className="px-6 py-4">
+                      <img 
+                        src={car.image} 
+                        alt={car.name}
+                        className="w-24 h-16 object-cover rounded"
+                      />
+                    </td>
+                    <td className="px-6 py-4">{car.name}</td>
+                    <td className="px-6 py-4">${car.price.toLocaleString()}</td>
+                    <td className="px-6 py-4">
+                      {car.isSpecial ? (
+                        <span className="bg-blue-100 text-blue-800 px-2 py-1 rounded-full text-xs">
+                          Special
+                        </span>
+                      ) : '-'}
+                    </td>
+                    <td className="px-6 py-4">
+                      <div className="flex gap-2">
+                        <button className="p-2 text-blue-600 hover:bg-blue-50 rounded">
+                          <Pencil className="w-5 h-5" />
+                        </button>
+                        <button className="p-2 text-red-600 hover:bg-red-50 rounded">
+                          <Trash className="w-5 h-5" />
+                        </button>
+                      </div>
+                    </td>
+                  </tr>
+                ))}
+              </tbody>
+            </table>
+          </div>
+        </div>
+      </main>
+    </div>
+  );
+};
+
+export default AdminDashboard;