2024-05-07 01:31:38 +02:00
|
|
|
|
import React, { useState, useEffect } from "react";
|
|
|
|
|
import { HomeOutlined } from '@ant-design/icons-svg';
|
|
|
|
|
import { Menu } from "antd";
|
2024-04-04 09:28:19 +02:00
|
|
|
|
import { Home } from "../../pages";
|
|
|
|
|
import { getRoom } from "../../api/room";
|
2024-05-07 01:31:38 +02:00
|
|
|
|
function getItem(label, key, type, icon, children) {
|
2024-04-04 09:28:19 +02:00
|
|
|
|
return {
|
2024-05-07 01:31:38 +02:00
|
|
|
|
key: String(key),
|
|
|
|
|
icon,
|
|
|
|
|
children,
|
|
|
|
|
label,
|
|
|
|
|
type,
|
2024-04-04 09:28:19 +02:00
|
|
|
|
};
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// Component
|
|
|
|
|
const Navbar = () => {
|
|
|
|
|
//Hook calls
|
2024-05-07 01:31:38 +02:00
|
|
|
|
const [rooms, setRooms] = useState([]);
|
2024-04-04 09:28:19 +02:00
|
|
|
|
|
|
|
|
|
useEffect(() => {
|
2024-05-07 01:31:38 +02:00
|
|
|
|
if (true) {
|
|
|
|
|
getRoom().then((result) => {
|
2024-04-04 09:28:19 +02:00
|
|
|
|
setRooms(result);
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
}, []);
|
|
|
|
|
|
2024-05-07 01:31:38 +02:00
|
|
|
|
const roomItems = rooms.map((room, index) => (
|
|
|
|
|
getItem(room.name, `sub${index}`, <Home />)
|
|
|
|
|
));
|
|
|
|
|
|
|
|
|
|
const items = [
|
|
|
|
|
getItem("Menu principal", "1", <Home />),
|
|
|
|
|
getItem("Vue d'ensemble", "2", <Home />),
|
|
|
|
|
{
|
|
|
|
|
key: "3",
|
|
|
|
|
label: "Chambres",
|
|
|
|
|
icon: "",
|
|
|
|
|
children: roomItems, // Utilisation des <20>l<EFBFBD>ments de menu des chambres
|
|
|
|
|
},
|
|
|
|
|
];
|
2024-04-04 09:28:19 +02:00
|
|
|
|
|
2024-05-07 01:31:38 +02:00
|
|
|
|
// Rendu du composant Navbar
|
|
|
|
|
return (
|
|
|
|
|
<Menu
|
|
|
|
|
defaultSelectedKeys={["1"]}
|
|
|
|
|
defaultOpenKeys={["sub1"]}
|
|
|
|
|
theme="dark"
|
|
|
|
|
mode="inline"
|
|
|
|
|
items={items}
|
|
|
|
|
/>
|
|
|
|
|
);
|
2024-04-04 09:28:19 +02:00
|
|
|
|
};
|
|
|
|
|
export default Navbar;
|