Daten von 118. in mocks geholt

components/main/kabelueberwachung/kue705FO/Charts/LoopMeasurementChart/LoopChartActionBar.tsx

@@ -12,6 +12,7 @@ import {
 } from "@/redux/slices/kabelueberwachungChartSlice";
 import { setBrushRange } from "@/redux/slices/brushSlice";
 import { Listbox } from "@headlessui/react";
+import { setChartTitle as setLoopChartTitle } from "@/redux/slices/loopChartTypeSlice";
 
 //-----------------------------------------------------------------------------------useLoopChartLoader
 export const useLoopChartLoader = () => {
@@ -99,12 +100,12 @@ const LoopChartActionBar: React.FC = () => {
     bisDatum,
     selectedMode,
     selectedSlotType,
-
     slotNumber,
-
     isLoading,
   } = useSelector((state: RootState) => state.kabelueberwachungChartSlice);
 
+  const { chartTitle } = useSelector((state: RootState) => state.loopChartType);
+
   const getApiUrl = (
     mode: "DIA0" | "DIA1" | "DIA2",
     type: number,
@@ -280,29 +281,67 @@ const LoopChartActionBar: React.FC = () => {
             </Listbox.Options>
           </div>
         </Listbox>
-        <div className="relative w-16"> </div>
-
-        {/* Schleife starten button*/}
-        <button
-          onClick={handleStartRSL}
-          className="px-4 py-1 bg-littwin-blue text-white rounded text-sm whitespace-nowrap"
-          disabled={isLoading}
+        {/* Dropdown für Messkurve / Meldungen (wie ISO) */}
+        <Listbox
+          value={chartTitle}
+          onChange={(value: "Messkurve" | "Meldungen") =>
+            dispatch(setLoopChartTitle(value))
+          }
         >
-          RSL starten
-        </button>
-
-        <button
-          onClick={handleFetchData}
-          className="px-4 py-1 bg-littwin-blue text-white rounded text-sm whitespace-nowrap"
-        >
-          Daten laden
-        </button>
-
-        {isLoading && (
-          <div className="flex items-center space-x-2 text-sm text-gray-500">
-            <div className="w-4 h-4 border-2 border-t-2 border-blue-500 rounded-full animate-spin" />
-            <span>Lade Daten...</span>
+          <div className="relative w-40">
+            <Listbox.Button className="w-full border px-3 py-1 rounded text-left bg-white flex justify-between items-center text-sm">
+              <span>{chartTitle}</span>
+              <svg
+                className="w-5 h-5 text-gray-400"
+                viewBox="0 0 20 20"
+                fill="currentColor"
+              >
+                <path
+                  fillRule="evenodd"
+                  d="M5.23 7.21a.75.75 0 011.06.02L10 10.585l3.71-3.355a.75.75 0 111.02 1.1l-4.25 3.85a.75.75 0 01-1.02 0l-4.25-3.85a.75.75 0 01.02-1.06z"
+                  clipRule="evenodd"
+                />
+              </svg>
+            </Listbox.Button>
+            <Listbox.Options className="absolute z-50 mt-1 w-full border rounded bg-white shadow max-h-60 overflow-auto text-sm">
+              {(["Messkurve", "Meldungen"] as const).map((option) => (
+                <Listbox.Option
+                  key={option}
+                  value={option}
+                  className={({ selected, active }) =>
+                    `px-4 py-1 cursor-pointer ${
+                      selected
+                        ? "bg-littwin-blue text-white"
+                        : active
+                        ? "bg-gray-200"
+                        : ""
+                    }`
+                  }
+                >
+                  {option}
+                </Listbox.Option>
+              ))}
+            </Listbox.Options>
           </div>
+        </Listbox>
+
+        {/* Buttons nur bei Messkurve sichtbar */}
+        {chartTitle === "Messkurve" && (
+          <>
+            <button
+              onClick={handleStartRSL}
+              className="px-4 py-1 bg-littwin-blue text-white rounded text-sm whitespace-nowrap"
+              disabled={isLoading}
+            >
+              RSL starten
+            </button>
+            <button
+              onClick={handleFetchData}
+              className="px-4 py-1 bg-littwin-blue text-white rounded text-sm whitespace-nowrap"
+            >
+              Daten laden
+            </button>
+          </>
         )}
       </div>
     </div>