get message

app/Components/EviarMensaje/EnviarMensaje.tsx

@@ -22,25 +22,44 @@ interface EnviarMensajeProps {
   titulo: string;
 }
 
+interface Mensaje {
+  id_mensaje: number;
+  mensaje: string;
+}
+
+
 const EnviarMensaje = ({ titulo }: EnviarMensajeProps) => {
   const [equipos, setEquipos] = useState<Equipo[]>([]);
   const [equipoSeleccionado, setEquipoSeleccionado] = useState<any>(null);
   const [loadingEquipos, setLoadingEquipos] = useState(false);
   const [open, setOpen] = useState(false);
   const [mensaje, setMensaje] = useState("");
+  const [mensajes, setMensajes] = useState<Mensaje[]>([]);
+  const [loadingMensajes, setLoadingMensajes] = useState(false);
+
   const [customMsg, setCustomMsg] = useState("");
 
   useEffect(() => {
-    const fetchEquipos = async () => {
+    const fetchData = async () => {
       try {
-        const response = await axios.get(`${envConfig.apiUrl}/equipo/busy`);
-        setEquipos(response.data);
+        setLoadingMensajes(true);
+
+        const [equiposRes, mensajesRes] = await Promise.all([
+          axios.get(`${envConfig.apiUrl}/equipo/busy`),
+          axios.get(`${envConfig.apiUrl}/mensaje`)
+        ]);
+
+        setEquipos(equiposRes.data);
+        setMensajes(mensajesRes.data);
+
       } catch (error) {
-        console.error("Error cargando equipos:", error);
+        console.error("Error cargando datos:", error);
+      } finally {
+        setLoadingMensajes(false);
       }
     };
 
-    fetchEquipos();
+    fetchData();
   }, []);
 
   const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
@@ -111,15 +130,24 @@ const EnviarMensaje = ({ titulo }: EnviarMensajeProps) => {
       <label className="label">Seleccione el mensaje</label>
 
       <div className="groupInput">
-        <select value={mensaje} onChange={(e) => setMensaje(e.target.value)}>
-          <option value="">-- Seleccione el mensaje --</option>
-          <option value="cerrar">No olvides cerrar sesión</option>
-          <option value="alerta1">⚠️ Atención</option>
-          <option value="alerta2">🔔 Aviso importante</option>
-          <option value="alerta3">✅ Confirmación</option>
-        </select>
-      </div>
+        <select
+          value={mensaje}
+          onChange={(e) => setMensaje(e.target.value)}
+        >
+          <option value="">
+            {loadingMensajes
+              ? "Cargando mensajes..."
+              : "Seleccione un mensaje"}
+          </option>
 
+          {mensajes.map((msg) => (
+            <option key={msg.id_mensaje} value={msg.mensaje}>
+              {msg.mensaje}
+            </option>
+          ))}
+        </select>
+
+      </div>
 
       <label className="label">Mensaje personalizado</label>