Init

2026-07-26 23:57:23 +02:00
commit 8b613ec0bc
6300 changed files with 1257646 additions and 0 deletions
@@ -0,0 +1,72 @@
+import React from 'react';
+import { CalendarDays, Plus, UserCheck } from 'lucide-react';
+
+export const DispatchingView: React.FC = () => {
+  const scheduleData = [
+    { time: '08:00 - 10:00', technician: 'Max Müller', customer: 'Max Mustermann', task: 'Wartung Heizungsanlage', status: 'In Bearbeitung' },
+    { time: '10:30 - 12:30', technician: 'Stefan Bauer', customer: 'Anja Klein', task: 'Thermostat Einstellung & Kalibrierung', status: 'Geplant' },
+    { time: '13:00 - 15:00', technician: 'Tom Gerber', customer: 'Hausverwaltung Schmidt', task: 'Sanitär-Rohrreinigung', status: 'In Bearbeitung' },
+    { time: '15:30 - 17:30', technician: 'Max Müller', customer: 'Bäckerei Hoffmann GmbH', task: 'Austausch Umwälzpumpe', status: 'Geplant' },
+  ];
+
+  return (
+    <>
+      <header className="header-bar">
+        <h1 className="header-title">Dispatching & Auftragsdisposition</h1>
+        <button style={{
+          backgroundColor: '#2563eb',
+          color: '#ffffff',
+          border: 'none',
+          padding: '10px 18px',
+          borderRadius: '10px',
+          fontWeight: 600,
+          display: 'flex',
+          alignItems: 'center',
+          gap: '8px',
+          cursor: 'pointer'
+        }}>
+          <Plus size={18} /> Neuer Einsatz
+        </button>
+      </header>
+
+      <section className="content-card">
+        <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '20px' }}>
+          <h2 className="card-heading" style={{ margin: 0 }}>Tagesdisposition (Heute)</h2>
+          <span style={{ fontSize: '0.9rem', color: '#64748b', fontWeight: 600 }}>10 Monteure im System</span>
+        </div>
+
+        <table className="orders-table">
+          <thead>
+            <tr>
+              <th>Uhrzeit</th>
+              <th>Monteur</th>
+              <th>Kunde</th>
+              <th>Aufgabe / Tätigkeit</th>
+              <th>Status</th>
+            </tr>
+          </thead>
+          <tbody>
+            {scheduleData.map((item, idx) => (
+              <tr key={idx}>
+                <td style={{ fontWeight: 600, color: '#2563eb' }}>{item.time}</td>
+                <td style={{ fontWeight: 600, color: '#0f172a' }}>
+                  <div style={{ display: 'flex', alignItems: 'center', gap: '8px' }}>
+                    <UserCheck size={16} color="#64748b" />
+                    {item.technician}
+                  </div>
+                </td>
+                <td>{item.customer}</td>
+                <td style={{ color: '#475569' }}>{item.task}</td>
+                <td>
+                  <span className={`badge ${item.status === 'In Bearbeitung' ? 'badge-in-progress' : 'badge-scheduled'}`}>
+                    {item.status}
+                  </span>
+                </td>
+              </tr>
+            ))}
+          </tbody>
+        </table>
+      </section>
+    </>
+  );
+};