function MainComponent() { // Theme-Initialisierung VOR allen anderen States - KRITISCH für SSR! React.useEffect(()=>{ // Sofortige Theme-Anwendung beim ersten Load if (typeof window !== "undefined") { const savedTheme = localStorage.getItem("theme"); const savedLanguage = localStorage.getItem("language"); const savedFontSize = localStorage.getItem("fontSize"); // Theme sofort anwenden - BEVOR React States gesetzt werden if (savedTheme === "dark") { document.documentElement.classList.add("dark"); } else { document.documentElement.classList.remove("dark"); } // Font-Size sofort anwenden if (savedFontSize) { document.documentElement.classList.remove("text-sm", "text-base", "text-lg"); if (savedFontSize === "small") { document.documentElement.classList.add("text-sm"); } else if (savedFontSize === "large") { document.documentElement.classList.add("text-lg"); } else { document.documentElement.classList.add("text-base"); } } } }, []); // Leeres Dependency Array - läuft nur einmal beim Mount const [plans, setPlans] = React.useState([]); const [translations, setTranslations] = React.useState({}); const [loading, setLoading] = React.useState(true); const [searchLoading, setSearchLoading] = React.useState(false); // Separater Loading-State für Suche const [error, setError] = React.useState(null); const [showSettings, setShowSettings] = React.useState(false); const [showCreateModal, setShowCreateModal] = React.useState(false); const [showDeleteModal, setShowDeleteModal] = React.useState(false); const [planToDelete, setPlanToDelete] = React.useState(null); const [searchTerm, setSearchTerm] = React.useState(""); const [statusFilter, setStatusFilter] = React.useState(""); // Debounced search term für die API-Aufrufe const [debouncedSearchTerm, setDebouncedSearchTerm] = React.useState(""); const [isInitialLoad, setIsInitialLoad] = React.useState(true); // Track ob es der erste Load ist const [language, setLanguage] = React.useState(()=>{ if (typeof window !== "undefined") { return localStorage.getItem("language") || "de"; } return "de"; }); const [isDark, setIsDark] = React.useState(()=>{ if (typeof window !== "undefined") { return localStorage.getItem("theme") === "dark"; } return false; }); // Bessere Fallback-Übersetzungen für sofortige Anzeige const fallbackTranslations = { de: { loading_plans: "Lade Reinigungspläne...", cleaning_plans: "Reinigungspläne" }, en: { loading_plans: "Loading cleaning plans...", cleaning_plans: "Cleaning Plans" } }; // Debouncing für Suchbegriff React.useEffect(()=>{ const timer = setTimeout(()=>{ setDebouncedSearchTerm(searchTerm); }, 300); // 300ms Verzögerung return ()=>clearTimeout(timer); }, [ searchTerm ]); // Übersetzungen laden - sofort beim Mount const loadTranslations = React.useCallback(async ()=>{ try { const response = await fetch("/api/get-translations", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ language }) }); if (!response.ok) { throw new Error(`Fehler beim Laden der Übersetzungen: ${response.status}`); } const data = await response.json(); if (data.error) { throw new Error(data.error); } setTranslations(data.translations || {}); } catch (err) { console.error("Fehler beim Laden der Übersetzungen:", err); setError("Übersetzungen konnten nicht geladen werden"); } }, [ language ]); // Pläne laden - verwendet jetzt debouncedSearchTerm const loadPlans = React.useCallback(async ()=>{ try { // Nur beim ersten Load das komplette Loading anzeigen if (isInitialLoad) { setLoading(true); } else { setSearchLoading(true); // Bei Suche nur Search-Loading } const response = await fetch("/api/get-plans-with-docs", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ status: statusFilter || undefined, search: debouncedSearchTerm || undefined }) }); if (!response.ok) { throw new Error(`Fehler beim Laden der Pläne: ${response.status}`); } const data = await response.json(); if (data.error) { throw new Error(data.error); } console.log("=== FRONTEND: Geladene Pläne ==="); console.log("Anzahl Pläne:", data.plans?.length || 0); if (data.plans && data.plans.length > 0) { console.log("Erste Plan document_number:", data.plans[0]?.document_number); console.log("Alle document_numbers:", data.plans.map((p)=>p.document_number)); } setPlans(data.plans || []); } catch (err) { console.error("Fehler beim Laden der Pläne:", err); setError("Reinigungspläne konnten nicht geladen werden"); } finally{ if (isInitialLoad) { setLoading(false); setIsInitialLoad(false); // Nach dem ersten Load } else { setSearchLoading(false); } } }, [ statusFilter, debouncedSearchTerm, isInitialLoad ]); // isInitialLoad hinzugefügt // Debug: Pläne in der Konsole ausgeben React.useEffect(()=>{ if (plans.length > 0) { console.log("Geladene Pläne:", plans); console.log("Erste Plan Dokumentennummer:", plans[0]?.document_number); } }, [ plans ]); // Neuen Plan erstellen const createPlan = async (planData)=>{ try { const response = await fetch("/api/create-plan", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify(planData) }); if (!response.ok) { throw new Error(`Fehler beim Erstellen: ${response.status}`); } const data = await response.json(); if (data.error) { throw new Error(data.error); } setShowCreateModal(false); loadPlans(); // Pläne neu laden return data.plan_id; } catch (err) { console.error("Fehler beim Erstellen des Plans:", err); setError("Plan konnte nicht erstellt werden"); } }; // Plan löschen Funktion const deletePlan = async (planId)=>{ try { setError(null); const response = await fetch("/api/delete-plan", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ plan_id: planId }) }); if (!response.ok) { throw new Error(`Fehler beim Löschen: ${response.status}`); } const data = await response.json(); if (data.error) { throw new Error(data.error); } // Erfolgs-Toast anzeigen const successToast = document.createElement("div"); successToast.className = `fixed top-4 right-4 z-50 p-4 rounded-lg shadow-lg flex items-center gap-3 bg-green-500 text-white border`; successToast.innerHTML = ` ${t("plan_deleted") || "Plan erfolgreich gelöscht!"} `; document.body.appendChild(successToast); // Toast nach 3 Sekunden entfernen setTimeout(()=>{ if (document.body.contains(successToast)) { document.body.removeChild(successToast); } }, 3000); // Pläne neu laden loadPlans(); setShowDeleteModal(false); setPlanToDelete(null); } catch (error) { console.error("Fehler beim Löschen des Plans:", error); setError(t("delete_error") || `Plan konnte nicht gelöscht werden: ${error.message}`); } }; const handleDeleteClick = (plan)=>{ setPlanToDelete(plan); setShowDeleteModal(true); }; // Theme synchronisation zwischen Seiten React.useEffect(()=>{ if (typeof window !== "undefined") { const savedTheme = localStorage.getItem("theme"); const shouldBeDark = savedTheme === "dark"; if (shouldBeDark !== isDark) { setIsDark(shouldBeDark); } if (shouldBeDark) { document.documentElement.classList.add("dark"); } else { document.documentElement.classList.remove("dark"); } } }, []); // Storage events für Theme-Synchronisation React.useEffect(()=>{ const handleStorageChange = (e)=>{ if (e.key === "theme") { const newTheme = e.newValue === "dark"; setIsDark(newTheme); if (newTheme) { document.documentElement.classList.add("dark"); } else { document.documentElement.classList.remove("dark"); } } if (e.key === "language") { const newLanguage = e.newValue || "de"; setLanguage(newLanguage); } }; window.addEventListener("storage", handleStorageChange); return ()=>window.removeEventListener("storage", handleStorageChange); }, []); // Initial laden React.useEffect(()=>{ loadTranslations(); }, [ loadTranslations ]); React.useEffect(()=>{ loadPlans(); }, [ loadPlans ]); const t = (key)=>{ const translation = translations[key] || fallbackTranslations[language][key] || key; return translation; }; // Einstellungskomponente const SettingsComponent = ()=>{ const [localIsDark, setLocalIsDark] = React.useState(isDark); const [localLanguage, setLocalLanguage] = React.useState(language); const [fontSize, setFontSize] = React.useState(()=>{ if (typeof window !== "undefined") { return localStorage.getItem("fontSize") || "medium"; } return "medium"; }); React.useEffect(()=>{ if (typeof window !== "undefined") { localStorage.setItem("theme", localIsDark ? "dark" : "light"); const root = document.documentElement; if (localIsDark) { root.classList.add("dark"); } else { root.classList.remove("dark"); } setIsDark(localIsDark); } }, [ localIsDark ]); React.useEffect(()=>{ if (typeof window !== "undefined") { localStorage.setItem("language", localLanguage); setLanguage(localLanguage); } }, [ localLanguage ]); React.useEffect(()=>{ if (typeof window !== "undefined") { localStorage.setItem("fontSize", fontSize); const root = document.documentElement; root.classList.remove("text-sm", "text-base", "text-lg"); if (fontSize === "small") { root.classList.add("text-sm"); } else if (fontSize === "large") { root.classList.add("text-lg"); } else { root.classList.add("text-base"); } } }, [ fontSize ]); if (!showSettings) { return null; // Kein Button mehr - nur das Modal } return /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 p-4", __source: { fileName: "", lineNumber: 363, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `max-w-md w-full rounded-lg shadow-xl ${isDark ? "bg-gray-800" : "bg-white"}`, __source: { fileName: "", lineNumber: 364, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `p-6 border-b ${isDark ? "border-gray-700" : "border-gray-200"}`, __source: { fileName: "", lineNumber: 367, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 370, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: `text-2xl font-semibold ${isDark ? "text-white" : "text-gray-900"}`, __source: { fileName: "", lineNumber: 371, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-cog mr-3", __source: { fileName: "", lineNumber: 374, columnNumber: 17 }, __self: this }), t("settings") || "Einstellungen"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowSettings(false), className: `w-8 h-8 rounded-full hover:${isDark ? "bg-gray-700" : "bg-gray-100"} transition-all duration-200 flex items-center justify-center ${isDark ? "text-gray-300" : "text-gray-600"}`, "aria-label": "Schließen", __source: { fileName: "", lineNumber: 377, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-times", __source: { fileName: "", lineNumber: 382, columnNumber: 17 }, __self: this })))), /*#__PURE__*/ React.createElement("div", { className: "p-6 space-y-6", __source: { fileName: "", lineNumber: 387, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 389, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: `block text-lg font-medium mb-4 ${isDark ? "text-white" : "text-gray-900"}`, __source: { fileName: "", lineNumber: 390, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-palette mr-2", __source: { fileName: "", lineNumber: 393, columnNumber: 17 }, __self: this }), t("theme") || "Design"), /*#__PURE__*/ React.createElement("div", { className: "flex gap-4", __source: { fileName: "", lineNumber: 396, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setLocalIsDark(false), className: `flex-1 p-3 rounded-lg border-2 transition-all duration-200 ${!localIsDark ? "border-[#44C7F4] bg-[#44C7F4] text-gray-900" : `border-gray-300 ${isDark ? "border-gray-600 text-gray-300 hover:border-gray-500" : "text-gray-700 hover:border-gray-400"}`}`, __source: { fileName: "", lineNumber: 397, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-sun mr-2", __source: { fileName: "", lineNumber: 405, columnNumber: 19 }, __self: this }), t("light_mode") || "Hell"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setLocalIsDark(true), className: `flex-1 p-3 rounded-lg border-2 transition-all duration-200 ${localIsDark ? "border-[#44C7F4] bg-[#44C7F4] text-gray-900" : `border-gray-300 ${isDark ? "border-gray-600 text-gray-300 hover:border-gray-500" : "text-gray-700 hover:border-gray-400"}`}`, __source: { fileName: "", lineNumber: 408, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-moon mr-2", __source: { fileName: "", lineNumber: 416, columnNumber: 19 }, __self: this }), t("dark_mode") || "Dunkel"))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 423, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: `block text-lg font-medium mb-4 ${isDark ? "text-white" : "text-gray-900"}`, __source: { fileName: "", lineNumber: 424, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-globe mr-2", __source: { fileName: "", lineNumber: 427, columnNumber: 17 }, __self: this }), t("language") || "Sprache"), /*#__PURE__*/ React.createElement("div", { className: "flex gap-4", __source: { fileName: "", lineNumber: 430, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setLocalLanguage("de"), className: `flex-1 p-3 rounded-lg border-2 transition-all duration-200 ${localLanguage === "de" ? "border-[#44C7F4] bg-[#44C7F4] text-gray-900" : `border-gray-300 ${isDark ? "border-gray-600 text-gray-300 hover:border-gray-500" : "text-gray-700 hover:border-gray-400"}`}`, __source: { fileName: "", lineNumber: 431, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-flag mr-2", __source: { fileName: "", lineNumber: 439, columnNumber: 19 }, __self: this }), "Deutsch"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setLocalLanguage("en"), className: `flex-1 p-3 rounded-lg border-2 transition-all duration-200 ${localLanguage === "en" ? "border-[#44C7F4] bg-[#44C7F4] text-gray-900" : `border-gray-300 ${isDark ? "border-gray-600 text-gray-300 hover:border-gray-500" : "text-gray-700 hover:border-gray-400"}`}`, __source: { fileName: "", lineNumber: 442, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-flag-usa mr-2", __source: { fileName: "", lineNumber: 450, columnNumber: 19 }, __self: this }), "English"))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 457, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: `block text-lg font-medium mb-4 ${isDark ? "text-white" : "text-gray-900"}`, __source: { fileName: "", lineNumber: 458, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-text-height mr-2", __source: { fileName: "", lineNumber: 461, columnNumber: 17 }, __self: this }), t("font_size") || "Schriftgröße"), /*#__PURE__*/ React.createElement("div", { className: "flex gap-2", __source: { fileName: "", lineNumber: 464, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setFontSize("small"), className: `flex-1 p-3 rounded-lg border-2 transition-all duration-200 ${fontSize === "small" ? "border-[#44C7F4] bg-[#44C7F4] text-gray-900" : `border-gray-300 ${isDark ? "border-gray-600 text-gray-300 hover:border-gray-500" : "text-gray-700 hover:border-gray-400"}`}`, __source: { fileName: "", lineNumber: 465, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-font text-sm mr-2", __source: { fileName: "", lineNumber: 473, columnNumber: 19 }, __self: this }), t("font_small") || "Klein"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setFontSize("medium"), className: `flex-1 p-3 rounded-lg border-2 transition-all duration-200 ${fontSize === "medium" ? "border-[#44C7F4] bg-[#44C7F4] text-gray-900" : `border-gray-300 ${isDark ? "border-gray-600 text-gray-300 hover:border-gray-500" : "text-gray-700 hover:border-gray-400"}`}`, __source: { fileName: "", lineNumber: 476, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-font text-base mr-2", __source: { fileName: "", lineNumber: 484, columnNumber: 19 }, __self: this }), t("font_medium") || "Mittel"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setFontSize("large"), className: `flex-1 p-3 rounded-lg border-2 transition-all duration-200 ${fontSize === "large" ? "border-[#44C7F4] bg-[#44C7F4] text-gray-900" : `border-gray-300 ${isDark ? "border-gray-600 text-gray-300 hover:border-gray-500" : "text-gray-700 hover:border-gray-400"}`}`, __source: { fileName: "", lineNumber: 487, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-font text-lg mr-2", __source: { fileName: "", lineNumber: 495, columnNumber: 19 }, __self: this }), t("font_large") || "Groß")))), /*#__PURE__*/ React.createElement("div", { className: `p-6 border-t ${isDark ? "border-gray-700" : "border-gray-200"}`, __source: { fileName: "", lineNumber: 502, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowSettings(false), className: "w-full bg-[#44C7F4] hover:bg-[#3BB8E5] text-gray-900 py-3 px-4 rounded-lg transition-all duration-200 font-medium", __source: { fileName: "", lineNumber: 505, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-check mr-2", __source: { fileName: "", lineNumber: 509, columnNumber: 15 }, __self: this }), "Fertig")))); }; // Plan erstellen Modal const CreatePlanModal = ()=>{ const [formData, setFormData] = React.useState({ title: "", subtitle: "", customer: "", area: "", interval_text: "", created_by: "", creator: "", reviewer: "", qm_responsible: "", area_responsible: "" }); const handleSubmit = async (e)=>{ e.preventDefault(); const planId = await createPlan(formData); if (planId) { // Zur Detailseite weiterleiten window.location.href = `/plan?id=${planId}`; } }; if (!showCreateModal) return null; return /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 p-4", __source: { fileName: "", lineNumber: 545, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `max-w-2xl w-full rounded-lg shadow-xl ${isDark ? "bg-gray-800" : "bg-white"} max-h-[90vh] overflow-y-auto`, __source: { fileName: "", lineNumber: 546, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `p-6 border-b ${isDark ? "border-gray-700" : "border-gray-200"}`, __source: { fileName: "", lineNumber: 549, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 552, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: `text-2xl font-semibold ${isDark ? "text-white" : "text-gray-900"}`, __source: { fileName: "", lineNumber: 553, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-plus mr-3", __source: { fileName: "", lineNumber: 556, columnNumber: 17 }, __self: this }), t("create_new_plan") || "Neuen Reinigungsplan erstellen"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowCreateModal(false), className: `w-8 h-8 rounded-full hover:${isDark ? "bg-gray-700" : "bg-gray-100"} transition-all duration-200 flex items-center justify-center ${isDark ? "text-gray-300" : "text-gray-600"}`, "aria-label": "Schließen", __source: { fileName: "", lineNumber: 559, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-times", __source: { fileName: "", lineNumber: 564, columnNumber: 17 }, __self: this })))), /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, className: "p-6 space-y-6", __source: { fileName: "", lineNumber: 569, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6", __source: { fileName: "", lineNumber: 570, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 571, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: `block text-sm font-medium mb-2 ${isDark ? "text-white" : "text-gray-900"}`, __source: { fileName: "", lineNumber: 572, columnNumber: 17 }, __self: this }, t("title") || "Titel", " *"), /*#__PURE__*/ React.createElement("input", { type: "text", required: true, value: formData.title, onChange: (e)=>setFormData({ ...formData, title: e.target.value }), className: `w-full p-3 border rounded-lg focus:outline-none focus:ring-2 focus:ring-[#44C7F4] ${isDark ? "bg-gray-700 border-gray-600 text-white" : "bg-white border-gray-300 text-gray-900"}`, placeholder: t("title_placeholder") || "z.B. Produktionsbereich A", __source: { fileName: "", lineNumber: 577, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 595, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: `block text-sm font-medium mb-2 ${isDark ? "text-white" : "text-gray-900"}`, __source: { fileName: "", lineNumber: 596, columnNumber: 17 }, __self: this }, t("subtitle") || "Untertitel"), /*#__PURE__*/ React.createElement("input", { type: "text", value: formData.subtitle, onChange: (e)=>setFormData({ ...formData, subtitle: e.target.value }), className: `w-full p-3 border rounded-lg focus:outline-none focus:ring-2 focus:ring-[#44C7F4] ${isDark ? "bg-gray-700 border-gray-600 text-white" : "bg-white border-gray-300 text-gray-900"}`, placeholder: t("subtitle_placeholder") || "z.B. Reinigung und Desinfektion", __source: { fileName: "", lineNumber: 601, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 619, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: `block text-sm font-medium mb-2 ${isDark ? "text-white" : "text-gray-900"}`, __source: { fileName: "", lineNumber: 620, columnNumber: 17 }, __self: this }, t("customer") || "Kunde"), /*#__PURE__*/ React.createElement("input", { type: "text", value: formData.customer, onChange: (e)=>setFormData({ ...formData, customer: e.target.value }), className: `w-full p-3 border rounded-lg focus:outline-none focus:ring-2 focus:ring-[#44C7F4] ${isDark ? "bg-gray-700 border-gray-600 text-white" : "bg-white border-gray-300 text-gray-900"}`, placeholder: t("customer_placeholder") || "z.B. Musterfirma GmbH", __source: { fileName: "", lineNumber: 625, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 642, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: `block text-sm font-medium mb-2 ${isDark ? "text-white" : "text-gray-900"}`, __source: { fileName: "", lineNumber: 643, columnNumber: 17 }, __self: this }, t("area") || "Bereich"), /*#__PURE__*/ React.createElement("input", { type: "text", value: formData.area, onChange: (e)=>setFormData({ ...formData, area: e.target.value }), className: `w-full p-3 border rounded-lg focus:outline-none focus:ring-2 focus:ring-[#44C7F4] ${isDark ? "bg-gray-700 border-gray-600 text-white" : "bg-white border-gray-300 text-gray-900"}`, placeholder: t("area_placeholder") || "z.B. Produktionsbereich A", __source: { fileName: "", lineNumber: 648, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 665, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: `block text-sm font-medium mb-2 ${isDark ? "text-white" : "text-gray-900"}`, __source: { fileName: "", lineNumber: 666, columnNumber: 17 }, __self: this }, t("interval") || "Intervall"), /*#__PURE__*/ React.createElement("input", { type: "text", value: formData.interval_text, onChange: (e)=>setFormData({ ...formData, interval_text: e.target.value }), className: `w-full p-3 border rounded-lg focus:outline-none focus:ring-2 focus:ring-[#44C7F4] ${isDark ? "bg-gray-700 border-gray-600 text-white" : "bg-white border-gray-300 text-gray-900"}`, placeholder: t("interval_placeholder") || "z.B. Täglich und nach Bedarf", __source: { fileName: "", lineNumber: 671, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 688, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: `block text-sm font-medium mb-2 ${isDark ? "text-white" : "text-gray-900"}`, __source: { fileName: "", lineNumber: 689, columnNumber: 17 }, __self: this }, t("created_by") || "Erstellt von"), /*#__PURE__*/ React.createElement("input", { type: "text", value: formData.created_by, onChange: (e)=>setFormData({ ...formData, created_by: e.target.value }), className: `w-full p-3 border rounded-lg focus:outline-none focus:ring-2 focus:ring-[#44C7F4] ${isDark ? "bg-gray-700 border-gray-600 text-white" : "bg-white border-gray-300 text-gray-900"}`, placeholder: t("created_by_placeholder") || "z.B. Dr. Schmidt", __source: { fileName: "", lineNumber: 694, columnNumber: 17 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: `flex gap-4 pt-4 border-t ${isDark ? "border-gray-700" : "border-gray-200"}`, __source: { fileName: "", lineNumber: 712, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("button", { type: "button", onClick: ()=>setShowCreateModal(false), className: "flex-1 bg-gray-300 hover:bg-gray-400 text-gray-800 py-3 px-4 rounded-lg transition-all duration-200 font-medium", __source: { fileName: "", lineNumber: 715, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-times mr-2", __source: { fileName: "", lineNumber: 720, columnNumber: 17 }, __self: this }), t("cancel") || "Abbrechen"), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "flex-1 bg-[#44C7F4] hover:bg-[#3BB8E5] text-gray-900 py-3 px-4 rounded-lg transition-all duration-200 font-medium", __source: { fileName: "", lineNumber: 723, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-plus mr-2", __source: { fileName: "", lineNumber: 727, columnNumber: 17 }, __self: this }), t("create") || "Erstellen"))))); }; const getStatusColor = (status)=>{ switch(status){ case "active": return "bg-green-100 text-green-800 dark:bg-green-900 dark:text-green-200"; case "draft": return "bg-yellow-100 text-yellow-800 dark:bg-yellow-900 dark:text-yellow-200"; case "archived": return "bg-gray-100 text-gray-800 dark:bg-gray-900 dark:text-gray-200"; default: return "bg-gray-100 text-gray-800 dark:bg-gray-900 dark:text-gray-200"; } }; const getStatusText = (status)=>{ switch(status){ case "active": return t("status_active") || "Aktiv"; case "draft": return t("status_draft") || "Entwurf"; case "archived": return t("status_archived") || "Archiviert"; default: return status; } }; // PDF Export Funktion hinzufügen const exportToPDF = async (planId)=>{ try { setError(null); // Finde den Plan für den korrekten Dateinamen const currentPlan = plans.find((p)=>p.id === planId); // Zeige Loading-Zustand const loadingToast = document.createElement("div"); loadingToast.className = `fixed top-4 right-4 z-50 p-4 rounded-lg shadow-lg flex items-center gap-3 ${isDark ? "bg-gray-800 text-white" : "bg-white text-gray-900"} border`; loadingToast.innerHTML = ` ${t("generating_pdf") || "PDF wird generiert..."} `; document.body.appendChild(loadingToast); const response = await fetch("/api/export-plan-pdf", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ plan_id: planId }) }); if (!response.ok) { throw new Error(`PDF-Export fehlgeschlagen: ${response.status}`); } const data = await response.json(); // Entferne Loading-Toast if (document.body.contains(loadingToast)) { document.body.removeChild(loadingToast); } if (data.error && !data.html_content && !data.fallback_message) { throw new Error(data.error); } // Erfolgreicher PDF-Export if (data.success && data.pdf_url) { // Erfolgs-Toast anzeigen const successToast = document.createElement("div"); successToast.className = `fixed top-4 right-4 z-50 p-4 rounded-lg shadow-lg flex items-center gap-3 bg-green-500 text-white border`; successToast.innerHTML = ` ${t("pdf_generated") || "PDF erfolgreich erstellt!"} `; document.body.appendChild(successToast); // PDF herunterladen mit korrektem Dateinamen const link = document.createElement("a"); link.href = data.pdf_url; link.download = data.filename || `${(currentPlan?.title || "Reinigungsplan").replace(/[^a-zA-Z0-9äöüÄÖÜß\s]/g, "").replace(/\s+/g, "-")}-${new Date().toISOString().split("T")[0]}.pdf`; document.body.appendChild(link); link.click(); document.body.removeChild(link); // Erfolgs-Toast nach 3 Sekunden entfernen setTimeout(()=>{ if (document.body.contains(successToast)) { document.body.removeChild(successToast); } }, 3000); } else if (data.html_content || data.fallback_message) { // Info-Toast anzeigen const infoToast = document.createElement("div"); infoToast.className = `fixed top-4 right-4 z-50 p-4 rounded-lg shadow-lg flex items-center gap-3 bg-blue-500 text-white border`; infoToast.innerHTML = ` ${data.fallback_message || "Druckvorschau wird vorbereitet..."} `; document.body.appendChild(infoToast); // iPad-kompatibles Drucken if (data.html_content) { // Erstelle neues Fenster für Drucken (iPad-kompatibel) const printWindow = window.open("", "_blank"); if (printWindow) { printWindow.document.write(data.html_content); printWindow.document.close(); // Warte bis Inhalt geladen ist, dann drucke printWindow.onload = ()=>{ setTimeout(()=>{ printWindow.print(); // Schließe Fenster nach dem Drucken (optional) setTimeout(()=>{ printWindow.close(); }, 1000); }, 500); }; } else { // Fallback: Erstelle temporären Print-Container im gleichen Fenster const printContainer = document.createElement("div"); printContainer.id = "print-container"; printContainer.style.display = "none"; printContainer.innerHTML = data.html_content; document.body.appendChild(printContainer); // Erstelle Print-Styles const printStyles = document.createElement("style"); printStyles.id = "print-styles"; printStyles.innerHTML = ` @media print { body * { visibility: hidden; } #print-container, #print-container * { visibility: visible; } #print-container { position: absolute; left: 0; top: 0; width: 100%; display: block !important; } } `; document.head.appendChild(printStyles); // Warte kurz und starte Druckdialog setTimeout(()=>{ window.print(); // Cleanup nach dem Drucken setTimeout(()=>{ const container = document.getElementById("print-container"); const styles = document.getElementById("print-styles"); if (container) document.body.removeChild(container); if (styles) document.head.removeChild(styles); }, 1000); }, 500); } } else { // Fallback: Browser-Druckfunktion für aktuelle Seite window.print(); } // Info-Toast nach 3 Sekunden entfernen setTimeout(()=>{ if (document.body.contains(infoToast)) { document.body.removeChild(infoToast); } }, 3000); } else { throw new Error("Unbekannte Antwort vom Server"); } } catch (error) { console.error("PDF Export Fehler:", error); setError(t("pdf_export_error") || `PDF Export fehlgeschlagen: ${error.message}`); // Entferne eventuell noch vorhandenen Loading-Toast const loadingToasts = document.querySelectorAll(".fixed.top-4.right-4"); loadingToasts.forEach((toast)=>{ if (toast.innerHTML.includes("fa-spinner")) { if (document.body.contains(toast)) { document.body.removeChild(toast); } } }); } }; // Lösch-Bestätigungsmodal const DeleteConfirmModal = ()=>{ if (!showDeleteModal || !planToDelete) return null; return /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 p-4", __source: { fileName: "", lineNumber: 939, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `max-w-md w-full rounded-lg shadow-xl ${isDark ? "bg-gray-800" : "bg-white"}`, __source: { fileName: "", lineNumber: 940, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `p-6 border-b ${isDark ? "border-gray-700" : "border-gray-200"}`, __source: { fileName: "", lineNumber: 943, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 946, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: `text-xl font-semibold ${isDark ? "text-white" : "text-gray-900"}`, __source: { fileName: "", lineNumber: 947, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-exclamation-triangle mr-3 text-[#f079b6]", __source: { fileName: "", lineNumber: 950, columnNumber: 17 }, __self: this }), t("confirm_delete") || "Löschen bestätigen"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>{ setShowDeleteModal(false); setPlanToDelete(null); }, className: `w-8 h-8 rounded-full hover:${isDark ? "bg-gray-700" : "bg-gray-100"} transition-all duration-200 flex items-center justify-center ${isDark ? "text-gray-300" : "text-gray-600"}`, "aria-label": "Schließen", __source: { fileName: "", lineNumber: 953, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-times", __source: { fileName: "", lineNumber: 961, columnNumber: 17 }, __self: this })))), /*#__PURE__*/ React.createElement("div", { className: "p-6", __source: { fileName: "", lineNumber: 966, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: `${isDark ? "text-gray-300" : "text-gray-700"} mb-4`, __source: { fileName: "", lineNumber: 967, columnNumber: 13 }, __self: this }, t("delete_plan_confirm") || "Möchten Sie diesen Reinigungsplan wirklich löschen?"), /*#__PURE__*/ React.createElement("div", { className: `flex gap-4 pt-4 border-t ${isDark ? "border-gray-700" : "border-gray-200"}`, __source: { fileName: "", lineNumber: 971, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>{ setShowDeleteModal(false); setPlanToDelete(null); }, className: "flex-1 bg-gray-300 hover:bg-gray-400 text-gray-800 py-3 px-4 rounded-lg transition-all duration-200 font-medium", __source: { fileName: "", lineNumber: 974, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-times mr-2", __source: { fileName: "", lineNumber: 981, columnNumber: 17 }, __self: this }), t("cancel") || "Abbrechen"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>deletePlan(planToDelete.id), className: "flex-1 bg-[#f079b6] hover:bg-[#e16ba8] text-white py-3 px-4 rounded-lg transition-all duration-200 font-medium", __source: { fileName: "", lineNumber: 984, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-trash mr-2", __source: { fileName: "", lineNumber: 988, columnNumber: 17 }, __self: this }), t("delete") || "Löschen"))))); }; // Plan duplizieren Funktion const duplicatePlan = async (plan)=>{ try { setError(null); const response = await fetch("/api/duplicate-plan", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ plan_id: plan.id }) }); if (!response.ok) { throw new Error(`Fehler beim Duplizieren: ${response.status}`); } const data = await response.json(); if (data.error) { throw new Error(data.error); } // Pläne neu laden await loadPlans(); // Neuen Plan für 7 Sekunden hervorheben - türkiser Hintergrundeffekt setTimeout(()=>{ const newPlanCard = document.querySelector(`[data-plan-id="${data.plan_id}"]`); console.log("Suche nach Plan:", data.plan_id); console.log("Gefundene Karte:", newPlanCard); if (newPlanCard) { // Füge türkisen Hintergrundeffekt hinzu newPlanCard.classList.add("!bg-[#44C7F4]", "!bg-opacity-30", "shadow-xl", "shadow-[#44C7F4]/60", "border-2", "border-[#44C7F4]", "ring-2", "ring-[#44C7F4]/50"); // Scroll zur Karte newPlanCard.scrollIntoView({ behavior: "smooth", block: "center" }); // Hervorhebung nach 7 Sekunden entfernen setTimeout(()=>{ newPlanCard.classList.remove("!bg-[#44C7F4]", "!bg-opacity-30", "shadow-xl", "shadow-[#44C7F4]/60", "border-2", "border-[#44C7F4]", "ring-2", "ring-[#44C7F4]/50"); }, 7000); } else { console.error("Plan-Karte nicht gefunden für ID:", data.plan_id); } }, 500); // Etwas länger warten bis DOM aktualisiert ist } catch (error) { console.error("Fehler beim Duplizieren des Plans:", error); setError(t("duplicate_error") || `Plan konnte nicht dupliziert werden: ${error.message}`); } }; if (loading) { return /*#__PURE__*/ React.createElement("div", { className: `min-h-screen ${isDark ? "bg-[#111827]" : "bg-gray-100"} flex items-center justify-center`, __source: { fileName: "", lineNumber: 1075, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 1078, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-spinner fa-spin text-4xl text-[#44C7F4] mb-4", __source: { fileName: "", lineNumber: 1079, columnNumber: 11 }, __self: this }), /*#__PURE__*/ React.createElement("p", { className: `text-lg ${isDark ? "text-gray-300" : "text-gray-600"}`, __source: { fileName: "", lineNumber: 1080, columnNumber: 11 }, __self: this }, t("loading_plans") || "Lade Reinigungspläne..."))); } return /*#__PURE__*/ React.createElement("div", { className: `min-h-screen ${isDark ? "bg-[#111827]" : "bg-gray-100"}`, __source: { fileName: "", lineNumber: 1091, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-full px-2 sm:px-4 max-w-full xl:max-w-[80%] mx-auto py-4", __source: { fileName: "", lineNumber: 1092, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center mb-6", __source: { fileName: "", lineNumber: 1094, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 1095, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: `text-2xl font-bold ${isDark ? "text-white" : "text-gray-900"}`, __source: { fileName: "", lineNumber: 1096, columnNumber: 13 }, __self: this }, t("cleaning_plans") || "Reinigungspläne"), /*#__PURE__*/ React.createElement("p", { className: `text-sm ${isDark ? "text-gray-400" : "text-gray-600"} mt-1`, __source: { fileName: "", lineNumber: 1101, columnNumber: 13 }, __self: this }, t("plans_overview") || "Übersicht aller QM-Reinigungspläne")), /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-4", __source: { fileName: "", lineNumber: 1108, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>window.location.href = "/symbols", className: "bg-[#2c4b93] hover:bg-[#1e3a8a] text-white px-4 py-2 rounded-lg transition-all duration-200 font-medium flex items-center gap-2", __source: { fileName: "", lineNumber: 1109, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-icons", __source: { fileName: "", lineNumber: 1113, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "hidden sm:inline", __source: { fileName: "", lineNumber: 1114, columnNumber: 15 }, __self: this }, t("manage_symbols") || "Symbole verwalten")), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowCreateModal(true), className: "bg-[#44C7F4] hover:bg-[#3BB8E5] text-gray-900 px-4 py-2 rounded-lg transition-all duration-200 font-medium flex items-center gap-2", __source: { fileName: "", lineNumber: 1118, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-plus", __source: { fileName: "", lineNumber: 1122, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "hidden sm:inline", __source: { fileName: "", lineNumber: 1123, columnNumber: 15 }, __self: this }, t("create_plan") || "Plan erstellen")))), error && /*#__PURE__*/ React.createElement("div", { className: "bg-[#f079b6] text-white p-4 rounded-lg mb-6 flex items-center gap-2", __source: { fileName: "", lineNumber: 1132, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-exclamation-triangle", __source: { fileName: "", lineNumber: 1133, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 1134, columnNumber: 13 }, __self: this }, error), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setError(null), className: "ml-auto hover:bg-white hover:bg-opacity-20 rounded p-1", __source: { fileName: "", lineNumber: 1135, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-times", __source: { fileName: "", lineNumber: 1139, columnNumber: 15 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: `${isDark ? "bg-[#1F2937]" : "bg-white"} rounded-lg shadow-lg p-6 mb-6`, __source: { fileName: "", lineNumber: 1145, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col sm:flex-row gap-4", __source: { fileName: "", lineNumber: 1148, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex-1", __source: { fileName: "", lineNumber: 1149, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: `block text-sm font-medium mb-2 ${isDark ? "text-white" : "text-gray-900"}`, __source: { fileName: "", lineNumber: 1150, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-search mr-2", __source: { fileName: "", lineNumber: 1153, columnNumber: 17 }, __self: this }), t("search") || "Suchen"), /*#__PURE__*/ React.createElement("input", { type: "text", value: searchTerm, onChange: (e)=>setSearchTerm(e.target.value), className: `w-full p-3 border rounded-lg focus:outline-none focus:ring-2 focus:ring-[#44C7F4] ${isDark ? "bg-gray-700 border-gray-600 text-white" : "bg-white border-gray-300 text-gray-900"}`, placeholder: t("search_placeholder") || "Nach Titel, Kunde, Bereich oder Dokumentennummer suchen...", __source: { fileName: "", lineNumber: 1156, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "sm:w-48", __source: { fileName: "", lineNumber: 1172, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: `block text-sm font-medium mb-2 ${isDark ? "text-white" : "text-gray-900"}`, __source: { fileName: "", lineNumber: 1173, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-filter mr-2", __source: { fileName: "", lineNumber: 1176, columnNumber: 17 }, __self: this }), t("status") || "Status"), /*#__PURE__*/ React.createElement("select", { value: statusFilter, onChange: (e)=>setStatusFilter(e.target.value), className: `w-full p-3 border rounded-lg focus:outline-none focus:ring-2 focus:ring-[#44C7F4] ${isDark ? "bg-gray-700 border-gray-600 text-white" : "bg-white border-gray-300 text-gray-900"}`, __source: { fileName: "", lineNumber: 1179, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "", __source: { fileName: "", lineNumber: 1188, columnNumber: 17 }, __self: this }, t("all_statuses") || "Alle Status"), /*#__PURE__*/ React.createElement("option", { value: "active", __source: { fileName: "", lineNumber: 1189, columnNumber: 17 }, __self: this }, t("status_active") || "Aktiv"), /*#__PURE__*/ React.createElement("option", { value: "draft", __source: { fileName: "", lineNumber: 1190, columnNumber: 17 }, __self: this }, t("status_draft") || "Entwurf"), /*#__PURE__*/ React.createElement("option", { value: "archived", __source: { fileName: "", lineNumber: 1191, columnNumber: 17 }, __self: this }, t("status_archived") || "Archiviert")))), /*#__PURE__*/ React.createElement("div", { className: `mt-4`, __source: { fileName: "", lineNumber: 1199, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 1200, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `text-sm ${isDark ? "text-gray-400" : "text-gray-600"} flex items-center gap-2`, __source: { fileName: "", lineNumber: 1201, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-list-ol", __source: { fileName: "", lineNumber: 1204, columnNumber: 17 }, __self: this }), searchLoading ? /*#__PURE__*/ React.createElement("span", { className: "flex items-center gap-2", __source: { fileName: "", lineNumber: 1206, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-spinner fa-spin text-[#44C7F4]", __source: { fileName: "", lineNumber: 1207, columnNumber: 21 }, __self: this }), t("searching") || "Suche läuft...") : /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 1211, columnNumber: 19 }, __self: this }, searchTerm || statusFilter ? /*#__PURE__*/ React.createElement(React.Fragment, null, plans.length, " ", t("plans_found") || "Pläne gefunden", searchTerm && /*#__PURE__*/ React.createElement("span", { className: "ml-2", __source: { fileName: "", lineNumber: 1216, columnNumber: 27 }, __self: this }, t("for_search") || "für", ' "', searchTerm, '"'), statusFilter && /*#__PURE__*/ React.createElement("span", { className: "ml-2", __source: { fileName: "", lineNumber: 1221, columnNumber: 27 }, __self: this }, "(", t("status") || "Status", ":", " ", getStatusText(statusFilter), ")")) : /*#__PURE__*/ React.createElement(React.Fragment, null, t("total_plans") || "Gesamt", ": ", plans.length, " ", t("plans") || "Pläne"))), (searchTerm || statusFilter) && /*#__PURE__*/ React.createElement("button", { onClick: ()=>{ setSearchTerm(""); setStatusFilter(""); }, className: `text-sm px-3 py-1 rounded-lg transition-all duration-200 flex items-center gap-2 ${isDark ? "text-gray-400 hover:text-white hover:bg-gray-700" : "text-gray-600 hover:text-gray-900 hover:bg-gray-100"}`, __source: { fileName: "", lineNumber: 1238, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-times", __source: { fileName: "", lineNumber: 1249, columnNumber: 19 }, __self: this }), t("clear_filters") || "Filter zurücksetzen")))), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6", __source: { fileName: "", lineNumber: 1258, columnNumber: 9 }, __self: this }, plans.map((plan)=>/*#__PURE__*/ React.createElement("div", { key: plan.id, "data-plan-id": plan.id, className: `${isDark ? "bg-[#1F2937]" : "bg-white"} rounded-lg shadow-lg hover:shadow-xl transition-all duration-200 overflow-hidden`, __source: { fileName: "", lineNumber: 1260, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-6", __source: { fileName: "", lineNumber: 1265, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-start justify-between mb-4", __source: { fileName: "", lineNumber: 1266, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex-1", __source: { fileName: "", lineNumber: 1267, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: `text-lg font-semibold ${isDark ? "text-white" : "text-gray-900"} mb-1`, __source: { fileName: "", lineNumber: 1268, columnNumber: 21 }, __self: this }, plan.title), plan.subtitle && /*#__PURE__*/ React.createElement("p", { className: `text-sm ${isDark ? "text-gray-400" : "text-gray-600"}`, __source: { fileName: "", lineNumber: 1274, columnNumber: 23 }, __self: this }, plan.subtitle)), /*#__PURE__*/ React.createElement("span", { className: `px-2 py-1 rounded-full text-xs font-medium ${getStatusColor(plan.status)}`, __source: { fileName: "", lineNumber: 1281, columnNumber: 19 }, __self: this }, getStatusText(plan.status))), /*#__PURE__*/ React.createElement("div", { className: "space-y-2 mb-4", __source: { fileName: "", lineNumber: 1288, columnNumber: 17 }, __self: this }, plan.document_number && /*#__PURE__*/ React.createElement("div", { className: `flex items-center text-sm ${isDark ? "text-gray-400" : "text-gray-600"}`, __source: { fileName: "", lineNumber: 1290, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-file-alt w-4 mr-2", __source: { fileName: "", lineNumber: 1293, columnNumber: 23 }, __self: this }), plan.document_number), plan.customer && /*#__PURE__*/ React.createElement("div", { className: `flex items-center text-sm ${isDark ? "text-gray-400" : "text-gray-600"}`, __source: { fileName: "", lineNumber: 1298, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-building w-4 mr-2", __source: { fileName: "", lineNumber: 1301, columnNumber: 23 }, __self: this }), plan.customer), plan.area && /*#__PURE__*/ React.createElement("div", { className: `flex items-center text-sm ${isDark ? "text-gray-400" : "text-gray-600"}`, __source: { fileName: "", lineNumber: 1306, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-map-marker-alt w-4 mr-2", __source: { fileName: "", lineNumber: 1309, columnNumber: 23 }, __self: this }), plan.area), plan.interval_text && /*#__PURE__*/ React.createElement("div", { className: `flex items-center text-sm ${isDark ? "text-gray-400" : "text-gray-600"}`, __source: { fileName: "", lineNumber: 1314, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-clock w-4 mr-2", __source: { fileName: "", lineNumber: 1317, columnNumber: 23 }, __self: this }), plan.interval_text), /*#__PURE__*/ React.createElement("div", { className: `flex items-center text-sm ${isDark ? "text-gray-400" : "text-gray-500"} mb-4`, __source: { fileName: "", lineNumber: 1321, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-user w-4 mr-2", __source: { fileName: "", lineNumber: 1324, columnNumber: 21 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 1325, columnNumber: 21 }, __self: this }, t("created_by") || "Erstellt von", ":", " ", plan.created_by || "Unbekannt", " am", " ", new Date(plan.updated_at).toLocaleDateString("de-DE"))), /*#__PURE__*/ React.createElement("div", { className: "flex gap-2", __source: { fileName: "", lineNumber: 1332, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>window.location.href = `/plan?id=${plan.id}`, className: "flex-1 bg-[#44C7F4] hover:bg-[#3BB8E5] text-gray-900 py-2 px-3 rounded-lg transition-all duration-200 font-medium text-sm flex items-center justify-center gap-2", __source: { fileName: "", lineNumber: 1333, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-edit", __source: { fileName: "", lineNumber: 1339, columnNumber: 23 }, __self: this }), t("edit") || "Bearbeiten"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>exportToPDF(plan.id), className: "bg-[#2c4b93] hover:bg-[#1e3a8a] text-white py-2 px-3 rounded-lg transition-all duration-200 font-medium text-sm flex items-center justify-center", title: t("export_pdf") || "PDF Export", __source: { fileName: "", lineNumber: 1342, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-file-pdf", __source: { fileName: "", lineNumber: 1347, columnNumber: 23 }, __self: this })), /*#__PURE__*/ React.createElement("button", { onClick: ()=>duplicatePlan(plan), className: "bg-[#44C7F4] hover:bg-[#3BB8E5] text-gray-900 py-2 px-3 rounded-lg transition-all duration-200 font-medium text-sm flex items-center justify-center", title: t("duplicate_plan") || "Plan duplizieren", __source: { fileName: "", lineNumber: 1349, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-copy", __source: { fileName: "", lineNumber: 1354, columnNumber: 23 }, __self: this })), /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleDeleteClick(plan), className: "bg-[#f079b6] hover:bg-[#e16ba8] text-white py-2 px-3 rounded-lg transition-all duration-200 font-medium text-sm flex items-center justify-center", title: t("delete_plan") || "Plan löschen", __source: { fileName: "", lineNumber: 1356, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-trash", __source: { fileName: "", lineNumber: 1361, columnNumber: 23 }, __self: this })))))))), plans.length === 0 && !loading && /*#__PURE__*/ React.createElement("div", { className: "text-center py-12", __source: { fileName: "", lineNumber: 1372, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas fa-clipboard-list text-6xl ${isDark ? "text-gray-600" : "text-gray-400"} mb-4`, __source: { fileName: "", lineNumber: 1373, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("h3", { className: `text-xl font-semibold ${isDark ? "text-white" : "text-gray-900"} mb-2`, __source: { fileName: "", lineNumber: 1376, columnNumber: 13 }, __self: this }, t("no_plans_found") || "Keine Reinigungspläne gefunden"), /*#__PURE__*/ React.createElement("p", { className: `${isDark ? "text-gray-400" : "text-gray-600"} mb-6`, __source: { fileName: "", lineNumber: 1381, columnNumber: 13 }, __self: this }, searchTerm || statusFilter ? t("no_plans_filter") || "Keine Pläne entsprechen den Filterkriterien." : t("no_plans_yet") || "Erstellen Sie Ihren ersten Reinigungsplan."), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowCreateModal(true), className: "bg-[#44C7F4] hover:bg-[#3BB8E5] text-gray-900 px-6 py-3 rounded-lg transition-all duration-200 font-medium flex items-center gap-2 mx-auto", __source: { fileName: "", lineNumber: 1388, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-plus", __source: { fileName: "", lineNumber: 1392, columnNumber: 15 }, __self: this }), t("create_first_plan") || "Ersten Plan erstellen"))), /*#__PURE__*/ React.createElement(CreatePlanModal, { __source: { fileName: "", lineNumber: 1400, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(DeleteConfirmModal, { __source: { fileName: "", lineNumber: 1401, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(SettingsComponent, { __source: { fileName: "", lineNumber: 1402, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowSettings(true), className: "fixed bottom-6 right-6 w-14 h-14 rounded-full bg-[#44C7F4] hover:bg-[#3BB8E5] transition-all duration-200 flex items-center justify-center text-gray-900 shadow-lg z-40", "aria-label": t("accessibility_settings") || "Barrierefreiheits-Einstellungen", title: t("accessibility_settings") || "Barrierefreiheits-Einstellungen", __source: { fileName: "", lineNumber: 1405, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-universal-access text-xl", __source: { fileName: "", lineNumber: 1413, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("footer", { className: `mt-16 py-8 border-t ${isDark ? "border-gray-700 bg-[#1F2937]" : "border-gray-200 bg-white"}`, __source: { fileName: "", lineNumber: 1417, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-full px-2 sm:px-4 max-w-full xl:max-w-[80%] mx-auto text-center", __source: { fileName: "", lineNumber: 1420, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: `text-sm ${isDark ? "text-gray-400" : "text-gray-600"}`, __source: { fileName: "", lineNumber: 1421, columnNumber: 11 }, __self: this }, "© Reinigungsplan-Konfigurator 1.0 - 2025")))); }