53 lines
1.2 KiB
TypeScript
53 lines
1.2 KiB
TypeScript
"use client";
|
|
import { useEffect, useState } from "react";
|
|
import { envConfig } from "../lib/config";
|
|
import axios from "axios";
|
|
import Cookies from "js-cookie";
|
|
|
|
if (!envConfig.apiUrl) {
|
|
console.error("API URL is not defined in envConfig");
|
|
}
|
|
|
|
interface proms {
|
|
url: string;
|
|
}
|
|
|
|
export default function SelectAreas(props: proms) {
|
|
const [areas, setAreas] = useState([]);
|
|
const [selectedArea, setSelectedArea] = useState("");
|
|
|
|
const token = Cookies.get("token");
|
|
const headers = { Authorization: `Bearer ${token}` };
|
|
|
|
|
|
useEffect(() => {
|
|
axios
|
|
.get(`${envConfig.apiUrl}/area-ubicacion`, { headers }
|
|
)
|
|
.then((data) => {
|
|
setAreas(data.data);
|
|
})
|
|
.catch((error) => {
|
|
console.error("Error al traer las áreas:", error);
|
|
});
|
|
}, []);
|
|
|
|
return (
|
|
<div>
|
|
<label htmlFor="areaSelect">Selecciona un área:</label>
|
|
<select
|
|
id="areaSelect"
|
|
value={selectedArea}
|
|
onChange={(e) => setSelectedArea(e.target.value)}
|
|
>
|
|
<option value="">-- Selecciona una opción --</option>
|
|
{areas.map((area: any, index) => (
|
|
<option key={index} value={area.area}>
|
|
{area.area}
|
|
</option>
|
|
))}
|
|
</select>
|
|
</div>
|
|
);
|
|
}
|
|
//IO
|