Initial commit - Current state of vip-coordinator

2026-01-24 09:30:26 +01:00
commit aa900505b9
96 changed files with 31868 additions and 0 deletions
--- a/frontend/src/components/DriverForm.tsx
+++ b/frontend/src/components/DriverForm.tsx
@@ -0,0 +1,110 @@
+import React, { useState } from 'react';
+
+interface DriverFormData {
+  name: string;
+  phone: string;
+  vehicleCapacity: number;
+}
+
+interface DriverFormProps {
+  onSubmit: (driverData: DriverFormData) => void;
+  onCancel: () => void;
+}
+
+const DriverForm: React.FC<DriverFormProps> = ({ onSubmit, onCancel }) => {
+  const [formData, setFormData] = useState<DriverFormData>({
+    name: '',
+    phone: '',
+    vehicleCapacity: 4
+  });
+
+  const handleSubmit = (e: React.FormEvent) => {
+    e.preventDefault();
+    onSubmit(formData);
+  };
+
+  const handleChange = (e: React.ChangeEvent<HTMLInputElement | HTMLSelectElement>) => {
+    const { name, value, type } = e.target;
+    setFormData(prev => ({
+      ...prev,
+      [name]: type === 'number' || name === 'vehicleCapacity' ? parseInt(value) || 0 : value
+    }));
+  };
+
+  return (
+    <div className="modal-overlay">
+      <div className="modal-content">
+        {/* Modal Header */}
+        <div className="modal-header">
+          <h2 className="text-2xl font-bold text-slate-800">Add New Driver</h2>
+          <p className="text-slate-600 mt-2">Enter driver contact information</p>
+        </div>
+
+        {/* Modal Body */}
+        <div className="modal-body">
+          <form onSubmit={handleSubmit} className="space-y-6">
+            <div className="form-group">
+              <label htmlFor="name" className="form-label">Driver Name *</label>
+              <input
+                type="text"
+                id="name"
+                name="name"
+                value={formData.name}
+                onChange={handleChange}
+                className="form-input"
+                placeholder="Enter driver's full name"
+                required
+              />
+            </div>
+
+            <div className="form-group">
+              <label htmlFor="phone" className="form-label">Phone Number *</label>
+              <input
+                type="tel"
+                id="phone"
+                name="phone"
+                value={formData.phone}
+                onChange={handleChange}
+                className="form-input"
+                placeholder="Enter phone number"
+                required
+              />
+            </div>
+
+            <div className="form-group">
+              <label htmlFor="vehicleCapacity" className="form-label">Vehicle Capacity *</label>
+              <select
+                id="vehicleCapacity"
+                name="vehicleCapacity"
+                value={formData.vehicleCapacity}
+                onChange={handleChange}
+                className="form-input"
+                required
+              >
+                <option value={2}>2 passengers (Sedan/Coupe)</option>
+                <option value={4}>4 passengers (Standard Car)</option>
+                <option value={6}>6 passengers (SUV/Van)</option>
+                <option value={8}>8 passengers (Large Van)</option>
+                <option value={12}>12 passengers (Mini Bus)</option>
+              </select>
+              <p className="text-sm text-slate-600 mt-1">
+                🚗 Select the maximum number of passengers this vehicle can accommodate
+              </p>
+            </div>
+
+            <div className="form-actions">
+              <button type="button" className="btn btn-secondary" onClick={onCancel}>
+                Cancel
+              </button>
+              <button type="submit" className="btn btn-primary">
+                Add Driver
+              </button>
+            </div>
+          </form>
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default DriverForm;