feat: add fcp map

fix: fixed lazy fcp search
fix: try to fix preorder filter

public/js/pages/ADBRimoFcp/ADBRimoFcp.js

@@ -200,6 +200,7 @@ Vue.component('a-d-b-rimo-fcp',   {
                     <div style="display: flex; gap: 10px;">
                         <tt-button icon="fas fa-upload" text="FCPs Importieren" additional-class="btn-outline-success" @click="showImportFCPModal = true" />
                         <tt-button icon="fas fa-upload" text="Locations Importieren" additional-class="btn-outline-success" @click="showImportLocationsModal = true" />
+                        <tt-button text="Karte anzeigen" icon="fas fa-map" additional-class="btn-outline-primary" @click="window.location.href = window.TT_CONFIG['BASE_PATH'] + '/ADBRimoFcp/Map'" />
                     </div>
                 </template>
             </tt-table-crud>
@@ -231,7 +232,8 @@ Vue.component('a-d-b-rimo-fcp',   {
             showImportLocationsModal: false,
             networkAreas: window.TT_CONFIG?.CRUD_CONFIG?.columns?.find(col => col.key === 'netzgebiet_id')?.modal?.items || [],
             fcpApiUrl: window.TT_CONFIG['BASE_PATH'] + '/ADBRimoFcp/ImportFCPs',
-            locationsApiUrl: window.TT_CONFIG['BASE_PATH'] + '/ADBRimoFcp/ImportLocations'
+            locationsApiUrl: window.TT_CONFIG['BASE_PATH'] + '/ADBRimoFcp/ImportLocations',
+            window
         }
     },
     methods: {

public/js/pages/ADBRimoFcpMap/ADBRimoFcpMap.js

@@ -0,0 +1,93 @@
+Vue.component('ADBRimoFcpMap', {
+    data() {
+        return {
+            mapMarkers: [],
+            isLoading: true,
+            error: null,
+            window,
+            fetchUrl: window.TT_CONFIG.BASE_PATH + '/ADBRimoFcp/getAllFCPs',
+        };
+    },
+    async created() {
+        await this.fetchAndPrepareData();
+    },
+    methods: {
+        async fetchAndPrepareData() {
+            this.isLoading = true;
+            this.error = null;
+            try {
+                const response = await axios.get(this.fetchUrl);
+                if (response.data && response.data.success && Array.isArray(response.data.data)) {
+                    this.mapMarkers = response.data.data
+                        .filter(fcp => fcp.gps_lat != null && fcp.gps_long != null)
+                        .map(fcp => ({
+                            lat: fcp.gps_lat,
+                            lng: fcp.gps_long,
+                            options: {
+                                asyncPopupContent: async (markerData) => {
+                                    const response = await axios.get(`${this.window.TT_CONFIG.BASE_PATH}/ADBRimoFcp/getById?id=${fcp.id}`);
+                                    const fullFcpData = response.data;
+                                    return `
+    <div style="padding: 0px 5px 5px 5px; font-size: 0.85rem;">
+        <h5 class="mb-3 mt-1">${fullFcpData.name}</h5>
+        <table class="table table-sm table-borderless mb-0">
+            <tbody>
+                <tr>
+                    <td class="font-weight-bold py-1">RIMO ID:</td>
+                    <td class="py-1" style="word-break: break-all;">${fullFcpData.rimo_id}</td>
+                </tr>
+                <tr>
+                    <td class="font-weight-bold py-1">RIMO Ex State:</td>
+                    <td class="py-1">${fullFcpData.rimo_ex_state}</td>
+                </tr>
+                <tr>
+                    <td class="font-weight-bold py-1">RIMO Op State:</td>
+                    <td class="py-1">${fullFcpData.rimo_op_state}</td>
+                </tr>
+                 <tr>
+                    <td class="font-weight-bold py-1">Building Type:</td>
+                    <td class="py-1">${fullFcpData.building_type}</td>
+                </tr>
+                <tr>
+                    <td class="font-weight-bold py-1">Coordinates:</td>
+                    <td class="py-1">
+                        <a href="https://maps.google.com/?q=${fullFcpData.gps_lat},${fullFcpData.gps_long}" target="_blank" class="text-primary">
+                            <i class="fas fa-map-marker-alt mr-1"></i>${fullFcpData.gps_lat},<br> ${fullFcpData.gps_long}
+                        </a>
+                    </td>
+                </tr>
+            </tbody>
+        </table>
+    </div>
+`;                                },
+                            }
+                        }));
+                } else {
+                    console.error("Invalid data format from API:", response.data);
+                    this.error = "Invalid data format received.";
+                    this.mapMarkers = [];
+                }
+            } catch (err) {
+                console.error("Error fetching FCP data:", err);
+                this.error = "Failed to load FCP locations.";
+                this.mapMarkers = [];
+            } finally {
+                this.isLoading = false;
+            }
+        }
+    },
+    template: `
+      <tt-card style="height: 80vh; position: relative;">
+        <template #header>
+          <h5>FCP Locations</h5>
+        </template>
+        <div v-if="!isLoading && error" class="alert alert-danger">
+          {{ error }}
+        </div>
+        <tt-map :markers-data="mapMarkers" :loading="isLoading"></tt-map>
+        <div v-if="!isLoading && !error && mapMarkers.length === 0" class="alert alert-info">
+          No FCP locations found.
+        </div>
+      </tt-card>
+    `
+});