64 lines
2.0 KiB
TypeScript
64 lines
2.0 KiB
TypeScript
|
import './index.css';
|
||
|
|
import {MouseEvent} from "react";
|
||
|
|
import {IMenuListItem, IMenuWithTopButton} from "../../interfaces/menu/IMenuWithTopButton.ts";
|
||
|
|
import MenuWithTopButton from "../../components/menu/MenuWithTopButton.tsx";
|
||
|
|
import MenuTree from "../../components/menu/MenuTree.tsx";
|
||
|
|
|
||
|
|
const projMenu: IMenuWithTopButton = {
|
||
|
|
button: {
|
||
|
|
name: '创建项目',
|
||
|
|
handle(e: MouseEvent<HTMLButtonElement>) {
|
||
|
|
console.log(e)
|
||
|
|
}
|
||
|
|
},
|
||
|
|
list: [
|
||
|
|
{id: 'proj1', icon: './vite.svg', name: '全部项目'},
|
||
|
|
{id: 'proj2', icon: './vite.svg', name: '进行中的'},
|
||
|
|
{id: 'proj3', icon: './vite.svg', name: '已完成的'}
|
||
|
|
],
|
||
|
|
handleListItem(e: MouseEvent<HTMLLIElement>, index: number, item: IMenuListItem) {
|
||
|
|
console.log(e);
|
||
|
|
console.log(index);
|
||
|
|
console.log(item)
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
const agentMenu: IMenuWithTopButton = {
|
||
|
|
button: {
|
||
|
|
name: '代理服务',
|
||
|
|
handle(e: MouseEvent<HTMLButtonElement>) {
|
||
|
|
console.log(e)
|
||
|
|
}
|
||
|
|
},
|
||
|
|
list: [
|
||
|
|
{id: 'agent1', icon: './vite.svg', name: '全部项目'},
|
||
|
|
{id: 'agent2', icon: './vite.svg', name: '进行中的'},
|
||
|
|
{id: 'agent3', icon: './vite.svg', name: '已完成的'},
|
||
|
|
],
|
||
|
|
handleListItem(e: MouseEvent<HTMLLIElement>, index: number, item: IMenuListItem) {
|
||
|
|
console.log(e);
|
||
|
|
console.log(index);
|
||
|
|
console.log(item)
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
export default function Index() {
|
||
|
|
return (
|
||
|
|
<div className="index">
|
||
|
|
<div className="left">
|
||
|
|
<MenuWithTopButton
|
||
|
|
button={projMenu.button}
|
||
|
|
list={projMenu.list}
|
||
|
|
handleListItem={projMenu.handleListItem}
|
||
|
|
/>
|
||
|
|
<MenuTree/>
|
||
|
|
<MenuWithTopButton
|
||
|
|
button={agentMenu.button}
|
||
|
|
list={agentMenu.list}
|
||
|
|
handleListItem={agentMenu.handleListItem}
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
<div className="right"></div>
|
||
|
|
</div>
|
||
|
|
)
|
||
|
|
}
|