actions bereich und admin panel ueberarbeitet

und bug fix
2026-03-15 21:19:49 +01:00
parent 9b9b8d39a8
commit 9a39120919
10 changed files with 659 additions and 116 deletions
--- a/src/components/FilialDetail.jsx
+++ b/src/components/FilialDetail.jsx
@@ -0,0 +1,138 @@
+import { useState, useEffect, useCallback } from 'react';
+import { databases, DATABASE_ID } from '@/lib/appwrite';
+import { Query } from 'appwrite';
+import { useLagerstandorte } from '@/hooks/useLagerstandorte';
+import LagerstandortManager from './LagerstandortManager';
+import UserCreateForm from './UserCreateForm';
+import { Card, CardHeader, CardTitle, CardContent } from '@/components/ui/card';
+import { Button } from '@/components/ui/button';
+import { Badge } from '@/components/ui/badge';
+import { Separator } from '@/components/ui/separator';
+import { AlertCircle } from 'lucide-react';
+
+const ROLE_LABELS = {
+  admin: 'Admin',
+  firmenleiter: 'Firmenleiter',
+  filialleiter: 'Filialleiter',
+  service: 'Service',
+  lager: 'Lager',
+};
+
+export default function FilialDetail({ location: loc, onClose, showToast, onUserAdded }) {
+  const [users, setUsers] = useState([]);
+  const [showUserForm, setShowUserForm] = useState(false);
+  const [showLsManager, setShowLsManager] = useState(false);
+
+  const { lagerstandorte, addLagerstandort, toggleLagerstandort, deleteLagerstandort } = useLagerstandorte(loc?.$id || '');
+
+  const loadUsers = useCallback(async () => {
+    if (!loc?.$id) return;
+    try {
+      const res = await databases.listDocuments(DATABASE_ID, 'users_meta', [
+        Query.equal('locationId', [loc.$id]),
+        Query.limit(200),
+      ]);
+      setUsers(res.documents);
+    } catch (err) {
+      console.error('Benutzer laden fehlgeschlagen:', err);
+    }
+  }, [loc?.$id]);
+
+  useEffect(() => {
+    loadUsers();
+  }, [loadUsers]);
+
+  const hasFilialleiter = users.some((u) => u.role === 'filialleiter');
+
+  return (
+    <div className="rounded-lg border border-t-0 bg-muted/30 p-4">
+      <div className="mb-4 flex items-center justify-between">
+        <h3 className="font-semibold">Details: {loc?.name}</h3>
+        <Button variant="ghost" size="sm" onClick={onClose}>
+          Schließen
+        </Button>
+      </div>
+
+      {!hasFilialleiter && (
+        <div className="mb-4 flex items-center gap-2 rounded-md border border-amber-500/50 bg-amber-500/10 px-3 py-2 text-sm">
+          <AlertCircle className="h-4 w-4 shrink-0 text-amber-600" />
+          <Badge variant="outline" className="border-amber-600 text-amber-700">
+            Filialleiter fehlt
+          </Badge>
+        </div>
+      )}
+
+      <div className="grid gap-6 md:grid-cols-2">
+        <Card>
+          <CardHeader className="pb-2">
+            <CardTitle className="text-base">Lagerstandorte</CardTitle>
+          </CardHeader>
+          <CardContent className="space-y-3">
+            <Button size="sm" variant="outline" className="w-full" onClick={() => setShowLsManager(true)}>
+              Lagerstandorte verwalten
+            </Button>
+            <div className="max-h-48 space-y-2 overflow-y-auto">
+              {lagerstandorte.length === 0 ? (
+                <p className="text-center text-sm text-muted-foreground">Keine Lagerstandorte</p>
+              ) : (
+                lagerstandorte.map((ls) => (
+                  <div key={ls.$id} className="flex items-center justify-between rounded border px-2 py-1.5 text-sm">
+                    <span className={ls.isActive ? '' : 'text-muted-foreground line-through'}>{ls.name}</span>
+                    <Badge variant={ls.isActive ? 'default' : 'secondary'}>{ls.isActive ? 'Aktiv' : 'Inaktiv'}</Badge>
+                  </div>
+                ))
+              )}
+            </div>
+          </CardContent>
+        </Card>
+
+        <Card>
+          <CardHeader className="pb-2">
+            <CardTitle className="text-base">Benutzer dieser Filiale</CardTitle>
+          </CardHeader>
+          <CardContent className="space-y-3">
+            <Button size="sm" variant="outline" className="w-full" onClick={() => setShowUserForm(true)}>
+              Benutzer hinzufügen
+            </Button>
+            <div className="max-h-48 space-y-2 overflow-y-auto">
+              {users.length === 0 ? (
+                <p className="text-center text-sm text-muted-foreground">Keine Benutzer</p>
+              ) : (
+                users.map((u) => (
+                  <div key={u.$id} className="flex items-center justify-between rounded border px-2 py-1.5 text-sm">
+                    <span className="font-medium">{u.userName || u.userId}</span>
+                    <Badge variant="secondary">{ROLE_LABELS[u.role] || u.role}</Badge>
+                  </div>
+                ))
+              )}
+            </div>
+          </CardContent>
+        </Card>
+      </div>
+
+      {showLsManager && (
+        <LagerstandortManager
+          lagerstandorte={lagerstandorte}
+          onAdd={addLagerstandort}
+          onToggle={toggleLagerstandort}
+          onDelete={deleteLagerstandort}
+          onClose={() => setShowLsManager(false)}
+        />
+      )}
+
+      {showUserForm && (
+        <UserCreateForm
+          locationId={loc?.$id}
+          locationName={loc?.name}
+          onSuccess={() => {
+            loadUsers();
+            setShowUserForm(false);
+            onUserAdded?.();
+          }}
+          onCancel={() => setShowUserForm(false)}
+          showToast={showToast}
+        />
+      )}
+    </div>
+  );
+}