78 lines
2.0 KiB
TypeScript
78 lines
2.0 KiB
TypeScript
import { Affix, Col, Menu, Row, type MenuProps } from "antd";
|
|
import {
|
|
FileSearchOutlined,
|
|
UnorderedListOutlined,
|
|
} from "@ant-design/icons";
|
|
import Box from "../components/Box";
|
|
import { useState } from "react";
|
|
import AudioEncodePage from "../components/AudioEncode";
|
|
import AudioTaskPage from "../components/AudioTask";
|
|
|
|
type MenuItem = Required<MenuProps>["items"][number];
|
|
export default function Home() {
|
|
const [currentMenu, setCurrentMenu] = useState("sub0");
|
|
|
|
const items: MenuItem[] = [
|
|
{
|
|
key: "sub0",
|
|
label: "文件管理",
|
|
icon: <FileSearchOutlined />,
|
|
},
|
|
{
|
|
key: "sub1",
|
|
label: "任务列表",
|
|
icon: <UnorderedListOutlined />,
|
|
},
|
|
];
|
|
|
|
const onClickMenu = (item: any) => {
|
|
setCurrentMenu(item?.key as string);
|
|
};
|
|
|
|
return (
|
|
<Row gutter={16}>
|
|
<Col sm={24} md={24} lg={3} xl={3} xxl={3} className="w-full">
|
|
<Affix className="hidden lg:block" offsetTop={0}>
|
|
<Box
|
|
style={{ minWidth: "10rem", width: "12rem" }}
|
|
className="mr-0 px-0"
|
|
>
|
|
<Menu
|
|
className="litegbs-menu-item select-none"
|
|
key={"config"}
|
|
selectedKeys={[currentMenu]}
|
|
onClick={onClickMenu}
|
|
items={items}
|
|
/>
|
|
</Box>
|
|
</Affix>
|
|
<Box
|
|
style={{ minWidth: "10rem", width: "12rem" }}
|
|
className="mr-0 px-0 block lg:hidden"
|
|
>
|
|
<Menu
|
|
className="litegbs-menu-item"
|
|
key={"config"}
|
|
selectedKeys={[currentMenu]}
|
|
onClick={onClickMenu}
|
|
items={items}
|
|
/>
|
|
</Box>
|
|
</Col>
|
|
<Col sm={24} md={24} lg={21} xl={21} xxl={21} className="w-full">
|
|
{/* <Col sm={24} md={24} className="w-full"> */}
|
|
{currentMenu == "sub0" && (
|
|
<Box>
|
|
<AudioEncodePage />
|
|
</Box>
|
|
)}
|
|
{currentMenu == "sub1" && (
|
|
<Box>
|
|
<AudioTaskPage />
|
|
</Box>
|
|
)}
|
|
</Col>
|
|
</Row>
|
|
);
|
|
}
|