- {pm.vms.active.map((vm) => (
-
-
-
- Name: {vm.name}
-
-
- Status:
-
- {vm.status}
-
-
-
- Power: {vm.power}
-
-
- Config: CPU: {vm.config?.cpu}, RAM:{" "}
- {vm.config?.ram}, Disk: {vm.config?.disk}
-
-
-
- ))}
+ {/* All VMs */}
+
+
+
+ Virtual Machines ({pm.vms?.length || 0})
+
+
+ {pm.vms?.length > 0 ? (
+
+
+
+
+ | Name |
+ Status |
+ Power (W) |
+ Configuration |
+ Host |
+
+
+
+ {pm.vms.map((vm) => {
+ const isActive = vm.state && ["ACTIVE", "active"].includes(vm.state);
+ return (
+
+ |
+ {vm.vmName || vm.vm_name}
+ |
+
+
+ {vm.state}
+
+ |
+
+ {vm.power ? (
+ {vm.power.toFixed(2)}
+ ) : (
+ -
+ )}
+ |
+
+
+
+ CPU
+ {(vm.config?.cpu || (vm.confg && vm.confg[1])) || '-'}
+
+
+ RAM
+ {(vm.config?.ram || (vm.confg && vm.confg[2])) || '-'} GB
+
+
+ Disk
+ {(vm.config?.disk || (vm.confg && vm.confg[3])) || '-'} GB
+
+ |
+
+
+
+ {vm.host || vm.hostingPm || (vm.confg && vm.confg[4]) || '-'}
+
+ |
+
+ );
+ })}
+
+
) : (
-
No active VMs
- )}
-
- {/* Inactive VMs */}
-
- Inactive VMs ({pm.vms?.inactive?.length || 0}):
-
- {pm.vms?.inactive?.length > 0 ? (
-
- {pm.vms.inactive.map((vm) => (
-
-
-
- Name: {vm.name}
-
-
- Status:
-
- {vm.status}
-
-
-
- Power: {vm.power}
-
-
- Config: CPU: {vm.config?.cpu}, RAM:{" "}
- {vm.config?.ram}, Disk: {vm.config?.disk}
-
-
-
- ))}
+
+
+
No virtual machines found
- ) : (
-
No inactive VMs
)}
))}
diff --git a/sge-frontend/src/views/DataCenterManagement.js b/sge-frontend/src/views/DataCenterManagement.js
index c344df6..d77f7df 100644
--- a/sge-frontend/src/views/DataCenterManagement.js
+++ b/sge-frontend/src/views/DataCenterManagement.js
@@ -28,7 +28,8 @@ import { Edit } from "@mui/icons-material";
import { useSnackbar } from "notistack";
import { default as SweetAlert } from "sweetalert2";
import withReactContent from "sweetalert2-react-content";
-import { getDataCenters, createDataCenter, updateDataCenter, deleteDataCenter } from "../redux/actions/dataCenter";
+import { getDataCenters, createDataCenter, updateDataCenter, deleteDataCenter, getEmissionScopes } from "../redux/actions/dataCenter";
+import { getAreas, getAreasWithCriteria } from "../redux/actions/areas";
import { useTranslation } from "react-i18next";
import { getSectors, getSectorById, getSubSectorById, getConsuptionUnits } from "../redux/actions/datas";
import { getAllEmissionSources } from "../redux/actions/emissionSources";
@@ -105,6 +106,8 @@ const DataCenterManagement = () => {
externalId: "",
number: "",
address: "",
+ areaId: null,
+ cityId: null,
latitude: null,
longitude: null,
ayposURL: "",
@@ -120,14 +123,18 @@ const DataCenterManagement = () => {
const [mapPosition, setMapPosition] = useState(null);
const dataCenterStore = useSelector((state) => state.dataCenter);
+ const emissionScopeStore = useSelector((state) => state.emissionScope);
const datasStore = useSelector((state) => state.datas);
const emissionSourceStore = useSelector((state) => state.emissionSources);
+ const areasStore = useSelector((state) => state.areas);
const [sectorsOptions, setSectorsOptions] = useState([]);
const [subSectorsOptions, setSubSectorsOptions] = useState([]);
const [emissionSourcesOptions, setEmissionSourcesOptions] = useState([]);
const [consuptionUnitsOptions, setConsuptionUnitsOptions] = useState([]);
const [activitySubUnitsOptions, setActivitySubUnitsOptions] = useState([]);
const [emissionScopesOptions, setEmissionScopesOptions] = useState([]);
+ const [areasOptions, setAreasOptions] = useState([]);
+ const [citiesOptions, setCitiesOptions] = useState([]);
// Add state for selected sector and sub sector like in data input
const [selectedSector, setSelectedSector] = useState(null);
@@ -215,6 +222,8 @@ const DataCenterManagement = () => {
useEffect(() => {
dispatch(getDataCenters());
dispatch(getSectors());
+ dispatch(getAreas());
+ dispatch(getEmissionScopes());
}, [dispatch]);
useEffect(() => {
@@ -295,17 +304,48 @@ const DataCenterManagement = () => {
}, [datasStore?.consuptionUnits]);
useEffect(() => {
- setEmissionScopesOptions([
- {
- label: "Şehir İçi",
- value: false,
- },
- {
- label: "Şehir Dışı",
- value: true,
- },
- ]);
- }, []);
+ if (emissionScopeStore?.emissionScopes) {
+ setEmissionScopesOptions(
+ emissionScopeStore.emissionScopes.map((scope) => ({
+ value: scope.id,
+ label: scope.tag,
+ }))
+ );
+ }
+ }, [emissionScopeStore?.emissionScopes]);
+
+ // Set areas options when areas data is loaded
+ useEffect(() => {
+ if (areasStore?.areas) {
+ setAreasOptions(
+ areasStore.areas.map((area) => ({
+ value: area.id,
+ label: area.tag,
+ }))
+ );
+ }
+ }, [areasStore?.areas]);
+
+ // Set cities options when selected area changes
+ useEffect(() => {
+ if (selectedDataCenter.areaId && areasStore?.areas) {
+ const selectedArea = areasStore.areas.find(
+ (area) => area.id === selectedDataCenter.areaId
+ );
+ if (selectedArea?.cities) {
+ setCitiesOptions(
+ selectedArea.cities.map((city) => ({
+ value: city.id,
+ label: city.name,
+ }))
+ );
+ } else {
+ setCitiesOptions([]);
+ }
+ } else {
+ setCitiesOptions([]);
+ }
+ }, [selectedDataCenter.areaId, areasStore?.areas]);
const handleEditDataCenter = (row) => {
setEditingDataCenter(row);
@@ -314,10 +354,12 @@ const DataCenterManagement = () => {
externalId: row.externalId,
number: row.number,
address: row.address,
+ areaId: row.area?.id,
+ cityId: null, // City is a string in the backend, not an object
latitude: row.latitude,
longitude: row.longitude,
ayposURL: row.ayposURL,
- city: row.city,
+ city: row.city || "",
emissionScopeId: row.emissionScope?.id,
sectorId: row.sector?.id,
subSectorId: row.subSector?.id,
@@ -364,9 +406,56 @@ const DataCenterManagement = () => {
}
};
+ const validateForm = () => {
+ const errors = [];
+
+ // Required fields
+ if (!selectedDataCenter.name) {
+ errors.push(t("DataCenter.nameRequired"));
+ }
+ if (!selectedDataCenter.externalId) {
+ errors.push(t("DataCenter.externalIdRequired"));
+ }
+ if (!selectedDataCenter.sectorId) {
+ errors.push(t("DataCenter.sectorRequired"));
+ }
+
+ // Validate external ID is a number
+ if (selectedDataCenter.externalId && isNaN(parseInt(selectedDataCenter.externalId))) {
+ errors.push(t("DataCenter.externalIdMustBeNumber"));
+ }
+
+ // Validate coordinates if either is provided
+ if ((selectedDataCenter.latitude && !selectedDataCenter.longitude) ||
+ (!selectedDataCenter.latitude && selectedDataCenter.longitude)) {
+ errors.push(t("DataCenter.bothCoordinatesRequired"));
+ }
+
+ // Validate area and city are selected together
+ if (selectedDataCenter.areaId && !selectedDataCenter.cityId) {
+ errors.push(t("DataCenter.cityRequired"));
+ }
+
+ // Validate sector hierarchy
+ if (selectedDataCenter.subSectorId && !selectedDataCenter.sectorId) {
+ errors.push(t("DataCenter.sectorRequired"));
+ }
+ if (selectedDataCenter.emissionSourceId && !selectedDataCenter.subSectorId) {
+ errors.push(t("DataCenter.subSectorRequired"));
+ }
+ if (selectedDataCenter.consuptionUnitId && !selectedDataCenter.emissionSourceId) {
+ errors.push(t("DataCenter.emissionSourceRequired"));
+ }
+
+ return errors;
+ };
+
const handleSubmit = async () => {
- if (!selectedDataCenter.name || !selectedDataCenter.externalId) {
- enqueueSnackbar(t("Common.fillRequiredFields"), { variant: "error" });
+ const validationErrors = validateForm();
+ if (validationErrors.length > 0) {
+ validationErrors.forEach(error => {
+ enqueueSnackbar(error, { variant: "error" });
+ });
return;
}
@@ -397,10 +486,20 @@ const DataCenterManagement = () => {
handleCloseModal();
} catch (error) {
console.error("Submit error:", error);
- enqueueSnackbar(
- error?.message || t("DataCenter.submitError"),
- { variant: "error" }
- );
+
+ // Handle specific error cases
+ if (error.message?.includes("duplicate")) {
+ enqueueSnackbar(t("DataCenter.duplicateExternalId"), { variant: "error" });
+ } else if (error.message?.includes("permission")) {
+ enqueueSnackbar(t("Common.noPermission"), { variant: "error" });
+ } else if (error.message?.includes("not found")) {
+ enqueueSnackbar(t("DataCenter.resourceNotFound"), { variant: "error" });
+ } else {
+ enqueueSnackbar(
+ error?.message || t("DataCenter.submitError"),
+ { variant: "error" }
+ );
+ }
}
};
@@ -599,19 +698,49 @@ const DataCenterManagement = () => {
-
-
+
+
+
+
+
+
+
@@ -670,7 +799,7 @@ const DataCenterManagement = () => {
-
+