new parse

This commit is contained in:
2025-06-07 17:15:33 +01:00
8 changed files with 49 additions and 34 deletions

13
src/components/Alert.jsx Executable file
View File

@@ -0,0 +1,13 @@
import React from 'react';
export default function Alert({ type = 'info', children }) {
const base = 'p-2 mb-2 rounded';
const types = {
success: 'bg-green-600 text-white',
error: 'bg-red-600 text-white',
info: 'bg-gray-200',
};
return (
<div className={`${base} ${types[type] || types.info}`}>{children}</div>
);
}

View File

@@ -1,6 +1,7 @@
import React, { useState, useEffect } from 'react';
import { get, post } from '../api';
import PageLayout from '../components/PageLayout';
import Alert from '../components/Alert';
const Connectivity = () => {
const [loading, setLoading] = useState(true);
@@ -44,25 +45,20 @@ const Connectivity = () => {
// Salvar configuração Wi-Fi
const saveWifi = async () => {
try {
await post('/api/v1/config/wifi', wifiConfig); // Envia as configurações de Wi-Fi para o servidor
setWifiMsg('Configuração Wi-Fi gravada!');
await post('/api/v1/config/wifi', wifiConfig);
setWifiMsg('Alterações guardadas com sucesso!');
} catch (error) {
setWifiMsg('Erro ao gravar Wi-Fi.');
setWifiMsg('Erro ao guardar alterações.');
}
};
// Salvar configuração MQTT
const saveMqtt = async () => {
try {
// Garante que o valor de port seja sempre um número válido
const updatedMqttConfig = {
...mqttConfig,
port: parseInt(mqttConfig.port, 10) || 1883, // Caso o valor seja inválido, define como 1883
};
await post('/api/v1/config/mqtt', updatedMqttConfig); // Envia as configurações de MQTT para o servidor
setMqttMsg('Configuração MQTT gravada!');
await post('/api/v1/config/mqtt', mqttConfig);
setMqttMsg('Alterações guardadas com sucesso!');
} catch (error) {
setMqttMsg('Erro ao gravar MQTT.');
setMqttMsg('Erro ao guardar alterações.');
}
};
@@ -74,7 +70,7 @@ const Connectivity = () => {
<>
{/* Configuração Wi-Fi */}
<h2 className="text-xl font-semibold mt-4">Configuração Wi-Fi</h2>
{wifiMsg && <div className="p-2 bg-gray-200 rounded mb-2">{wifiMsg}</div>}
{wifiMsg && <Alert type={wifiMsg.startsWith('Erro') ? 'error' : 'success'}>{wifiMsg}</Alert>}
<form className="flex flex-col gap-4" onSubmit={e => { e.preventDefault(); saveWifi(); }}>
<div>
<label className="flex items-center gap-2">
@@ -123,7 +119,7 @@ const Connectivity = () => {
{/* Configuração MQTT */}
<h2 className="text-xl font-semibold mt-6">Configuração MQTT</h2>
{mqttMsg && <div className="p-2 bg-gray-200 rounded mb-2">{mqttMsg}</div>}
{mqttMsg && <Alert type={mqttMsg.startsWith('Erro') ? 'error' : 'success'}>{mqttMsg}</Alert>}
<form className="flex flex-col gap-4" onSubmit={e => { e.preventDefault(); saveMqtt(); }}>
<div>
<label className="flex items-center gap-2">

View File

@@ -1,6 +1,7 @@
import { useEffect, useState } from 'react';
import { get, post } from '../api';
import PageLayout from '../components/PageLayout';
import Alert from '../components/Alert';
export default function ElectricalNetwork() {
const [loading, setLoading] = useState(true);
@@ -40,10 +41,10 @@ export default function ElectricalNetwork() {
try {
const body = { monitor, alerts, security, loadBalancing, solar };
await post('/api/v1/config/electrical', body);
setMsg('Configuração gravada com sucesso!');
setMsg('Alterações guardadas com sucesso!');
} catch (err) {
console.error('Erro ao salvar configuração:', err);
setError('Erro ao gravar configuração.');
setError('Erro ao guardar alterações.');
}
};
@@ -64,8 +65,8 @@ export default function ElectricalNetwork() {
return (
<PageLayout title="Rede Elétrica">
{msg && <div className="p-2 mb-2 bg-green-600 text-white rounded">{msg}</div>}
{error && <div className="p-2 mb-2 bg-red-600 text-white rounded">{error}</div>}
{msg && <Alert type="success">{msg}</Alert>}
{error && <Alert type="error">{error}</Alert>}
{loading ? (
<p>A carregar...</p>

View File

@@ -1,6 +1,7 @@
import { useState, useEffect } from 'react';
import { get, post } from '../api';
import PageLayout from '../components/PageLayout';
import Alert from '../components/Alert';
export default function LoadBalancing() {
const [enabled, setEnabled] = useState(false);
@@ -35,7 +36,7 @@ export default function LoadBalancing() {
devices: selectedDevices,
};
await post('/api/v1/config/load-balancing', config);
setMsg('Configuração de Load Balancing salva com sucesso!');
setMsg('Alterações guardadas com sucesso!');
} catch {
setError('Erro ao salvar configuração de Load Balancing.');
}
@@ -71,8 +72,8 @@ export default function LoadBalancing() {
return (
<PageLayout title="Configuração de Load Balancing">
{msg && <div className="p-2 mb-2 bg-green-600 text-white rounded">{msg}</div>}
{error && <div className="p-2 mb-2 bg-red-600 text-white rounded">{error}</div>}
{msg && <Alert type="success">{msg}</Alert>}
{error && <Alert type="error">{error}</Alert>}
<form className="flex flex-col gap-4" onSubmit={saveConfig}>
{/* Controle de Ativação/Desativação */}

View File

@@ -1,6 +1,7 @@
import { useEffect, useState } from 'react';
import { get, post } from '../api';
import PageLayout from '../components/PageLayout';
import Alert from '../components/Alert';
export default function Mqtt() {
const [config, setConfig] = useState({
@@ -28,16 +29,16 @@ export default function Mqtt() {
setError('');
try {
await post('/api/v1/config/mqtt', config);
setMsg('Configuração gravada com sucesso!');
setMsg('Alterações guardadas com sucesso!');
} catch {
setError('Erro ao gravar configuração.');
setError('Erro ao guardar alterações.');
}
};
return (
<PageLayout title="Configuração MQTT">
{msg && <div className="p-2 mb-2 bg-green-600 text-white rounded">{msg}</div>}
{error && <div className="p-2 mb-2 bg-red-600 text-white rounded">{error}</div>}
{msg && <Alert type="success">{msg}</Alert>}
{error && <Alert type="error">{error}</Alert>}
{loading ? (
<p>A carregar...</p>

View File

@@ -2,6 +2,7 @@
import React, { useState, useEffect } from 'react';
import { get, post } from '../api';
import PageLayout from '../components/PageLayout';
import Alert from '../components/Alert';
const OCPP = () => {
const [status, setStatus] = useState(null);
@@ -37,9 +38,9 @@ const OCPP = () => {
setMsg('');
try {
await post('/api/v1/config/ocpp', config);
setMsg('Configuração gravada com sucesso!');
setMsg('Alterações guardadas com sucesso!');
} catch {
setMsg('Erro ao gravar configuração.');
setMsg('Erro ao guardar alterações.');
}
};

View File

@@ -1,5 +1,6 @@
import React, { useState, useEffect } from 'react';
import PageLayout from '../components/PageLayout';
import Alert from '../components/Alert';
const Settings = () => {
// Estados para armazenar os valores dos sliders e caixas de entrada
@@ -57,19 +58,19 @@ const Settings = () => {
});
if (response.ok) {
setMsg('Configurações de energia atualizadas com sucesso!');
setMsg('Alterações guardadas com sucesso!');
} else {
setError('Erro ao atualizar configurações');
setError('Erro ao guardar alterações.');
}
} catch {
setError('Erro ao atualizar configurações');
setError('Erro ao guardar alterações.');
}
};
return (
<PageLayout title="Definições de Energia">
{msg && <div className="p-2 mb-2 bg-green-600 text-white rounded">{msg}</div>}
{error && <div className="p-2 mb-2 bg-red-600 text-white rounded">{error}</div>}
{msg && <Alert type="success">{msg}</Alert>}
{error && <Alert type="error">{error}</Alert>}
<form className="flex flex-col gap-4" onSubmit={handleSubmit}>
<div>

View File

@@ -1,6 +1,7 @@
import { useEffect, useState } from 'react';
import { get, post } from '../api';
import PageLayout from '../components/PageLayout';
import Alert from '../components/Alert';
export default function Wifi() {
const [config, setConfig] = useState({ ssid: '', password: '' });
@@ -36,15 +37,15 @@ export default function Wifi() {
const save = async () => {
try {
await post('/api/v1/config/wifi', config);
setMsg('Configuração gravada com sucesso!');
setMsg('Alterações guardadas com sucesso!');
} catch {
setMsg('Erro ao gravar.');
setMsg('Erro ao guardar alterações.');
}
};
return (
<PageLayout title="Configuração Wi-Fi">
{msg && <div className="p-2 mb-2 bg-gray-200 rounded">{msg}</div>}
{msg && <Alert type={msg.startsWith('Erro') ? 'error' : 'success'}>{msg}</Alert>}
{loading ? (
<p>A carregar...</p>