legare de back-end nereusita

components/popOver.tsx

@@ -5,20 +5,31 @@ import { CheckIcon } from '@heroicons/react/24/outline';
 interface InsurancePopOverProps {
   open: boolean;
   setOpen: (open: boolean) => void;
-  onConfirm: () => void;
+  onConfirm: () => void; // Aceasta poate fi utilizată pentru acțiuni suplimentare la confirmare
   onCancel: () => void;
-  estimatedPrice: string;
+  onSubmit: () => void; // Funcția care va fi apelată pentru a trimite datele
+  estimatedPrice: string; // Prețul estimat pentru a fi afișat
 }
 
 const InsurancePopOver: React.FC<InsurancePopOverProps> = ({
   open,
   setOpen,
   onConfirm,
   onCancel,
+  onSubmit,
   estimatedPrice,
 }) => {
   const cancelButtonRef = useRef<HTMLButtonElement>(null);
 
+  const handleConfirm = async () => {
+    try {
+      await onSubmit(); // Apelăm funcția de trimitere a datelor
+      onConfirm(); // Apelăm funcția de confirmare, care poate include închiderea popover-ului sau alte acțiuni
+    } catch (error) {
+      console.error('A apărut o eroare:', error);
+    }
+  };
+
   return (
     <Transition.Root show={open} as={Fragment}>
       <Dialog
@@ -69,7 +80,7 @@ const InsurancePopOver: React.FC<InsurancePopOverProps> = ({
                   <button
                     type="button"
                     className="inline-flex justify-center rounded-md border border-transparent bg-indigo-600 px-4 py-2 text-base font-medium text-white shadow-sm hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2"
-                    onClick={onConfirm}
+                    onClick={handleConfirm}
                   >
                     Solicitare Asigurare
                   </button>

package.json

@@ -50,4 +50,6 @@
     "*.{js,ts,jsx,tsx}": "eslint --cache --fix",
     "*.{js,ts,jsx,tsx,css,md}": "prettier --write"
   }
+
+
 }

sections/details/details.tsx

@@ -1,53 +1,28 @@
 import React, { useState } from 'react';
 import InsurancePopOver from '../../components/popOver';
 
-// Definirea tipurilor pentru opțiuni, dacă sunt necesare
-interface Option {
-  value: string;
-  label: string;
-}
-
 const Details: React.FC = () => {
   const [open, setOpen] = useState(false);
-  const [formData, setFormData] = useState<Record<string, any>>({}); // Tipizare mai precisă pentru starea formularului
+  const [formData, setFormData] = useState<Record<string, any>>({});
   const [estimatedPrice, setEstimatedPrice] = useState<string>('');
   const [selectedInsuranceType, setSelectedInsuranceType] =
     useState<string>('');
   const [basePrice, setBasePrice] = useState<number>(0);
 
-  // Opțiunile rămân neschimbate
-  const options = {
-    'Perioada de asigurare': ['1 an', '6 luni', '3 luni'],
-    'Norma de Poluare': ['Euro 3', 'Euro 4', 'Euro 5', 'Euro 6'],
-    'Tip Combustibil': [
-      'Diesel',
-      'Benzina',
-      'Hibrid',
-      'Electric',
-      'Gaz-Benzina',
-    ],
-    'Categoria Masinii': [
-      'Autoturism',
-      'Camion',
-      'Remorca',
-      'Autocar',
-      'Microbuz',
-      'Motocicleta',
-      'ATV',
-    ],
-    'Categorie Bonus': Array.from({ length: 17 }, (_, i) => (i - 8).toString()),
-  };
+  // Actualizare: Păstrăm datele separate pentru șofer și mașină încă de la început
+  const [driverData, setDriverData] = useState<Record<string, any>>({});
+  const [carData, setCarData] = useState<Record<string, any>>({});
 
   const driverFields = [
     'Nume',
     'Prenume',
     'CNP',
-    'Data Nasterii',
+    'DataNasterii',
     'Permis de conducere',
     'E-mail',
     'Nr. de telefon',
+    'Categorie Bonus',
   ];
-
   const carFields = [
     'Categoria Masinii',
     'Numarul WIN',
@@ -65,9 +40,83 @@ const Details: React.FC = () => {
     e: React.ChangeEvent<HTMLInputElement | HTMLSelectElement>
   ) => {
     const { name, value } = e.target;
+    // Determinăm dacă inputul aparține șoferului sau mașinii și actualizăm starea corespunzătoare
+    if (driverFields.includes(name)) {
+      setDriverData({ ...driverData, [name]: value });
+    } else if (carFields.includes(name)) {
+      setCarData({ ...carData, [name]: value });
+    }
+
+    // Menținem formData actualizată pentru logica existentă (e.g., calculul prețului)
     setFormData({ ...formData, [name]: value });
   };
 
+  // Ajustăm submit-ul pentru a folosi direct datele pregătite
+  const submitDriverData = async () => {
+    // presupunem că endpoint-ul este /api/drivers pentru șoferi
+    const response = await fetch('http://localhost:5000/api/persons', {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify(driverData),
+    });
+
+    if (!response.ok) {
+      throw new Error('Eroare la trimiterea datelor despre șofer');
+    }
+
+    return response.json();
+  };
+
+  const submitCarData = async () => {
+    // presupunem că endpoint-ul este /api/cars pentru mașini
+    const response = await fetch('/api/cars', {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify(carData),
+    });
+
+    if (!response.ok) {
+      throw new Error('Eroare la trimiterea datelor despre mașină');
+    }
+
+    return response.json();
+  };
+
+  const handleSubmit = async () => {
+    try {
+      await submitDriverData(); // Trimite mai întâi datele despre șofer
+      await submitCarData(); // Apoi trimite datele despre mașină
+
+      console.log('Ambele seturi de date au fost trimise cu succes.');
+      // Aici poți adăuga orice logică post-trimitere, cum ar fi afișarea unui mesaj de succes
+    } catch (error) {
+      console.error('A apărut o eroare la trimiterea datelor:', error.message);
+      // Aici poți gestiona erorile
+    }
+  };
+
+  const options = {
+    'Perioada de asigurare': ['1 an', '6 luni', '3 luni'],
+    'Norma de Poluare': ['Euro 3', 'Euro 4', 'Euro 5', 'Euro 6'],
+    'Tip Combustibil': [
+      'Diesel',
+      'Benzina',
+      'Hibrid',
+      'Electric',
+      'Gaz-Benzina',
+    ],
+    'Categoria Masinii': [
+      'Autoturism',
+      'Camion',
+      'Remorca',
+      'Autocar',
+      'Microbuz',
+      'Motocicleta',
+      'ATV',
+    ],
+    'Categorie Bonus': Array.from({ length: 17 }, (_, i) => (i - 8).toString()),
+  };
+
   const selectInsuranceType = (type: string) => {
     setSelectedInsuranceType(type);
     const prices: Record<string, number> = {
@@ -104,7 +153,7 @@ const Details: React.FC = () => {
       // Adaugă alte tipuri de combustibil după necesitate
     };
     // Calcul coeficient pentru vârsta conducătorului auto
-    const driverBirthDate = new Date(formData['Data Nasterii']);
+    const driverBirthDate = new Date(formData['DataNasterii']);
     const driverAge = new Date().getFullYear() - driverBirthDate.getFullYear();
     const driverAgeCoefficient =
       driverAge < 25 ? 1.2 : driverAge <= 60 ? 1.0 : 1.1;
@@ -148,7 +197,6 @@ const Details: React.FC = () => {
     setEstimatedPrice(`Preț estimat: ${price.toFixed(2)} RON`);
     setOpen(true);
   };
-
   const isActiveButton = (type: string) => selectedInsuranceType === type;
 
   return (
@@ -196,12 +244,12 @@ const Details: React.FC = () => {
               </label>
               <div className="mt-2">
                 <input
-                  type={field === 'Data Nasterii' ? 'date' : 'text'}
+                  type={field === 'DataNasterii' ? 'date' : 'text'}
                   name={field}
                   id={field}
                   onChange={handleInputChange}
                   className="block w-full rounded-md border-0 py-2 px-2 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6"
-                  placeholder={field !== 'Data Nasterii' ? field : ''}
+                  placeholder={field !== 'DataNasterii' ? field : ''}
                 />
               </div>
             </div>
@@ -277,9 +325,10 @@ const Details: React.FC = () => {
         <InsurancePopOver
           open={open}
           setOpen={setOpen}
-          onConfirm={() => console.log('Confirm')}
+          onConfirm={() => console.log('Confirmare!')}
           onCancel={() => setOpen(false)}
-          estimatedPrice={estimatedPrice}
+          onSubmit={handleSubmit} // Pasăm funcția de submit ca prop
+          estimatedPrice={estimatedPrice} // Pasăm prețul estimat pentru a-l afișa în popover
         />
       </div>
     </div>