react_admin_layout

src/pages/admin/components/Header.tsx

@@ -0,0 +1,36 @@
+import { MenuFoldOutlined, MenuUnfoldOutlined } from '@ant-design/icons';
+import { Button, Layout, theme } from 'antd';
+const { Header } = Layout;
+
+export default function HeaderCom({ collapsed, setCollapsed }: { collapsed: boolean, setCollapsed: any }) {
+    const {
+        token: { colorBgContainer },
+    } = theme.useToken();
+    return (
+        <Header style={{ padding: 0, background: colorBgContainer }}>
+            <Button
+                type="text"
+                icon={collapsed ? <MenuUnfoldOutlined /> : <MenuFoldOutlined />}
+                onClick={() => setCollapsed(!collapsed)}
+                style={{
+                    fontSize: '16px',
+                    width: 64,
+                    height: 64,
+                }}
+            />
+
+            <select onChange={(e) => {
+                localStorage.setItem("lng", e.target.value)
+            }}>
+                <option value="vi">Tiếng Việt</option>
+                <option value="en">Tiếng Anh</option>
+                <option value="ja">Tiếng Nhật</option>
+            </select>
+
+            <Button onClick={() => {
+                localStorage.removeItem("userLogin")
+                window.location.reload()
+            }}>logout</Button>
+        </Header>
+    )
+}