import React from 'react';
// import Header from './Header';
import { Layout, Breadcrumb } from 'antd';
const { Header, Footer, Sider, Content } = Layout;
//导入logo图片
import HeaderComponent from './Header';
import SiderMenu from './SiderMenu';
import './layout.less';

const LayoutIndex: React.FC = (props) => {
  const { children } = props;
  return (
    <>
      <Layout>
        <Header className="header">
          <HeaderComponent />
        </Header>
        <Layout>
          <Sider width={200} theme="light">
            <SiderMenu />
          </Sider>
          <Layout className="layout-content">
            <Breadcrumb style={{ margin: '10px 0' }}>
              <Breadcrumb.Item>Home</Breadcrumb.Item>
              <Breadcrumb.Item>List</Breadcrumb.Item>
              <Breadcrumb.Item>App</Breadcrumb.Item>
            </Breadcrumb>
            <Content>{children}</Content>
          </Layout>
        </Layout>
      </Layout>
    </>
  );
};

export default LayoutIndex;
