65 lines
2.9 KiB
JavaScript
65 lines
2.9 KiB
JavaScript
// /hooks/useLineData.js
|
|
import { useEffect, useState } from "react";
|
|
import { SERVER_URL } from "../config/urls";
|
|
|
|
const useLineData = (webserviceGisLinesStatusUrl, setLineStatusData) => {
|
|
const [lineColors, setLineColors] = useState({});
|
|
const [tooltipContents, setTooltipContents] = useState({});
|
|
|
|
useEffect(() => {
|
|
const fetchData = async () => {
|
|
try {
|
|
const response1 = await fetch(webserviceGisLinesStatusUrl);
|
|
const data1 = await response1.json();
|
|
const response2 = await fetch(`${SERVER_URL}:3000/api/talas_v5_DB/gisLines/readGisLines`);
|
|
const data2 = await response2.json();
|
|
|
|
const colorsByModule = {};
|
|
const newTooltipContents = {};
|
|
const reversedData = data1.Statis ? data1.Statis.reverse() : [];
|
|
reversedData.forEach((stat) => {
|
|
const matchingLine = data2.find((item) => item.idLD === stat.IdLD && item.idModul === stat.Modul);
|
|
if (matchingLine) {
|
|
// Check if PrioColor is #ffffff and change it to green
|
|
const prioColor = stat.PrioColor === "#ffffff" ? "green" : stat.PrioColor;
|
|
|
|
colorsByModule[matchingLine.idModul] = prioColor;
|
|
newTooltipContents[matchingLine.idModul] = `
|
|
<div class="bg-white rounded-lg m-0 p-2 w-[210px]">
|
|
<span class="text-lg font-semibold text-gray-900">${stat.ModulName || "Unknown"}</span>
|
|
<br>
|
|
<span class="text-md font-bold text-gray-800">${stat.ModulTyp || "N/A"}</span>
|
|
<br>
|
|
<span class="text-md font-bold text-gray-800">Slot: ${stat.Modul || "N/A"}</span>
|
|
<br>
|
|
<div style="max-width: 100%; overflow-wrap: break-word; word-break: break-word; white-space: normal;">
|
|
<span class="inline-block w-2 h-2 rounded-full mr-2" style="background-color: ${prioColor || "#000000"};"></span>
|
|
<span class="inline-block text-gray-800">${stat.Message || "N/A"}</span>
|
|
</div>
|
|
<span class="text-gray-800" style="color: ${prioColor || "#000000"};">(${stat.PrioName || "N/A"})</span>
|
|
<br>
|
|
<div style="max-width: 100%; overflow-wrap: break-word; word-break: break-word; white-space: normal;">
|
|
<span class="inline-block text-gray-800">${stat.DpName || "N/A"}</span>
|
|
: <span class="inline-block text-gray-800">${stat.Value || "N/A"}</span>
|
|
</div>
|
|
</div>
|
|
`;
|
|
}
|
|
});
|
|
|
|
setLineColors(colorsByModule);
|
|
setTooltipContents(newTooltipContents);
|
|
setLineStatusData(reversedData);
|
|
} catch (error) {
|
|
console.error("Error fetching data:", error);
|
|
}
|
|
};
|
|
|
|
fetchData();
|
|
}, [webserviceGisLinesStatusUrl, setLineStatusData]);
|
|
|
|
return { lineColors, tooltipContents };
|
|
};
|
|
|
|
export default useLineData;
|