@ant-design/icons#PieChartOutlined JavaScript Examples
The following examples show how to use
@ant-design/icons#PieChartOutlined.
You can vote up the ones you like or vote down the ones you don't like,
and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
| Source File: Stats.js From placement-portal with MIT License | 6 votes |
|
render() {
const {Title, Number, Color} = this.props;
return (
<Col sm={{span: 24}} md={{span: 8}} xl={{span: 8}} xxl={{span: 6}}>
<Card
style={{background: Color, margin: 10}}
actions={[
<PieChartOutlined key="statistics" />,
<EditOutlined key="details" />
]}
>
<Row type={'flex'} justify={'center'}>
<Col>
<Row type={'flex'} justify={'center'}>
<Typography.Title style={{color: '#ffffff', fontSize: '1.8em'}}>
{Title}
</Typography.Title>
</Row>
<Row type={'flex'} justify={'end'}>
<Typography.Title style={{color: '#ffffff', fontSize: '2em'}}>
{Number}
</Typography.Title>
</Row>
</Col>
</Row>
</Card>
</Col>
);
}
Example #2
| Source File: custom-trigger-debug.jsx From virtuoso-design-system with MIT License | 5 votes |
|
render() {
return (
<Layout>
<Sider trigger={null} collapsible collapsed={this.state.collapsed}>
<div className="logo" />
<Menu theme="dark" mode="inline" defaultSelectedKeys={['3']} defaultOpenKeys={['sub1']}>
<Menu.Item key="1" icon={<PieChartOutlined />}>
Option 1
</Menu.Item>
<Menu.Item key="2" icon={<DesktopOutlined />}>
Option 2
</Menu.Item>
<SubMenu key="sub1" icon={<UserOutlined />} title="User">
<Menu.Item key="3">Tom</Menu.Item>
<Menu.Item key="4">Bill</Menu.Item>
<Menu.Item key="5">Alex</Menu.Item>
</SubMenu>
<SubMenu key="sub2" icon={<TeamOutlined />} title="Team">
<Menu.Item key="6">Team 1</Menu.Item>
<Menu.Item key="8">Team 2</Menu.Item>
</SubMenu>
<Menu.Item key="9" icon={<FileOutlined />} />
</Menu>
</Sider>
<Layout>
<Header className="site-layout-background" style={{ padding: 0 }}>
{React.createElement(this.state.collapsed ? MenuUnfoldOutlined : MenuFoldOutlined, {
className: 'trigger',
onClick: this.toggle,
})}
</Header>
<Content
className="site-layout-background"
style={{
margin: '24px 16px',
padding: 24,
minHeight: 280,
}}
>
Content
</Content>
</Layout>
</Layout>
);
}
Example #3
| Source File: side.jsx From virtuoso-design-system with MIT License | 5 votes |
|
render() {
const { collapsed } = this.state;
return (
<Layout style={{ minHeight: '100vh' }}>
<Sider collapsible collapsed={collapsed} onCollapse={this.onCollapse}>
<div className="logo" />
<Menu theme="dark" defaultSelectedKeys={['1']} mode="inline">
<Menu.Item key="1" icon={<PieChartOutlined />}>
Option 1
</Menu.Item>
<Menu.Item key="2" icon={<DesktopOutlined />}>
Option 2
</Menu.Item>
<SubMenu key="sub1" icon={<UserOutlined />} title="User">
<Menu.Item key="3">Tom</Menu.Item>
<Menu.Item key="4">Bill</Menu.Item>
<Menu.Item key="5">Alex</Menu.Item>
</SubMenu>
<SubMenu key="sub2" icon={<TeamOutlined />} title="Team">
<Menu.Item key="6">Team 1</Menu.Item>
<Menu.Item key="8">Team 2</Menu.Item>
</SubMenu>
<Menu.Item key="9" icon={<FileOutlined />}>
Files
</Menu.Item>
</Menu>
</Sider>
<Layout className="site-layout">
<Header className="site-layout-background" style={{ padding: 0 }} />
<Content style={{ margin: '0 16px' }}>
<Breadcrumb style={{ margin: '16px 0' }}>
<Breadcrumb.Item>User</Breadcrumb.Item>
<Breadcrumb.Item>Bill</Breadcrumb.Item>
</Breadcrumb>
<div className="site-layout-background" style={{ padding: 24, minHeight: 360 }}>
Bill is a cat.
</div>
</Content>
<Footer style={{ textAlign: 'center' }}>Ant Design ©2018 Created by Ant UED</Footer>
</Layout>
</Layout>
);
}
Example #4
| Source File: inline-collapsed.jsx From virtuoso-design-system with MIT License | 5 votes |
|
render() {
return (
<div style={{ width: 256 }}>
<Button type="primary" onClick={this.toggleCollapsed} style={{ marginBottom: 16 }}>
{React.createElement(this.state.collapsed ? MenuUnfoldOutlined : MenuFoldOutlined)}
</Button>
<Menu
defaultSelectedKeys={['1']}
defaultOpenKeys={['sub1']}
mode="inline"
theme="dark"
inlineCollapsed={this.state.collapsed}
>
<Menu.Item key="1" icon={<PieChartOutlined />}>
Option 1
</Menu.Item>
<Menu.Item key="2" icon={<DesktopOutlined />}>
Option 2
</Menu.Item>
<Menu.Item key="3" icon={<ContainerOutlined />}>
Option 3
</Menu.Item>
<SubMenu key="sub1" icon={<MailOutlined />} title="Navigation One">
<Menu.Item key="5">Option 5</Menu.Item>
<Menu.Item key="6">Option 6</Menu.Item>
<Menu.Item key="7">Option 7</Menu.Item>
<Menu.Item key="8">Option 8</Menu.Item>
</SubMenu>
<SubMenu key="sub2" icon={<AppstoreOutlined />} title="Navigation Two">
<Menu.Item key="9">Option 9</Menu.Item>
<Menu.Item key="10">Option 10</Menu.Item>
<SubMenu key="sub3" title="Submenu">
<Menu.Item key="11">Option 11</Menu.Item>
<Menu.Item key="12">Option 12</Menu.Item>
</SubMenu>
</SubMenu>
</Menu>
</div>
);
}
Example #5
| Source File: index.js From QiskitFlow with Apache License 2.0 | 4 votes |
|
function App({ user, loggedIn, logoutUser, getProfile }) {
useInjectSaga({ key: 'login', saga });
useEffect(() => {
if (!loggedIn) getProfile();
});
const [collapsed, setCollapsed] = useState(true);
const siderMenu = loggedIn ? (
<Sider collapsible collapsed={collapsed} onCollapse={setCollapsed}>
<div style={logoStyle} />
<Menu
theme="dark"
defaultSelectedKeys={['1']}
defaultOpenKeys={['profile']}
mode="inline"
>
<Menu.Item key="home" icon={<PieChartOutlined />}>
<Link to="/">Dashboard</Link>
</Menu.Item>
<Menu.Item key="experiments" icon={<DesktopOutlined />}>
<Link to="/experiments">My experiments</Link>
</Menu.Item>
<SubMenu
key="profile"
icon={<UserOutlined />}
title={`${user.username}`}
>
<Menu.Item key="logout" onClick={logoutUser}>
Logout
</Menu.Item>
</SubMenu>
</Menu>
</Sider>
) : (
''
);
return (
<div>
<Helmet
titleTemplate="%s - QiskitFlow"
defaultTitle="QiskitFlow. Reproducible quantum experiments."
>
<meta
name="description"
content="QiskitFlow. Reproducible quantum experiments."
/>
</Helmet>
<Layout style={{ minHeight: '100vh' }}>
{siderMenu}
<Layout className="site-layout">
<Header className="site-layout-background" style={{ padding: 0 }}>
<Link to="/" style={{ padding: '0 24px', fontSize: 24 }}>
QiskitFlow
</Link>
</Header>
<Content style={{ margin: '16px 16px' }}>
<div
className="site-layout-background"
style={{ padding: 24, minHeight: 360, background: '#fff' }}
>
<Switch>
<Route exact path="/" component={HomePage} />
<PrivateRoute
exact
authed
path="/experiments"
component={ExperimentsList}
/>
<PrivateRoute
authed
path="/experiments/:experimentId"
component={ExperimentRunsList}
/>
<PrivateRoute
authed
path="/runs/:id"
component={Run}
/>
<Route path="" component={NotFoundPage} />
</Switch>
</div>
</Content>
<Footer style={{ textAlign: 'center' }}>QiskitFlow ©2021</Footer>
</Layout>
</Layout>
</div>
);
}
Example #6
| Source File: Dashboard.js From Smart-Vehicle-Fleet-Manager with MIT License | 4 votes |
|
function Dashboard() {
// Layout and Menu
const { Content, Sider } = Layout;
const { SubMenu } = Menu;
// report an issue preventDefault
const preventDefault = (event) => {
event.preventDefault();
window.location.href =
"https://github.com/abhishekpatel946/Smart-Vehicle-Fleet-Manager/issues/new/choose";
};
// snakbar state
const [vehicleAddSuccess, setvehicleAddSuccess] = React.useState(false);
const [vehicleAddError, setvehicleAddError] = React.useState(false);
const [maintainanceAddSuccess, setmaintainanceAddSuccess] = React.useState(
false
);
const [maintainanceAddError, setmaintainanceAddError] = React.useState(false);
const handleClose = (event, reason) => {
if (reason === "clickaway") {
return;
}
setvehicleAddSuccess(false);
setvehicleAddError(false);
setmaintainanceAddSuccess(false);
setmaintainanceAddError(false);
};
// vehicleId & vehicleName for addVehicle
const [vehicleNAME, setVehicleNAME] = useState("");
const [vehicleID, setVehicleID] = useState("");
// vehicleName, dateTime & cost for maintenace
const [vehicleRegNumber, setVehicleRegNumber] = useState("");
const [date, setDate] = useState(moment().toString());
const [cost, setCost] = useState("");
// set date
const onDateChange = (val) => {
setDate(val);
};
const [collapseState, setCollapseState] = useState(false);
const onCollapse = (collapsed) => {
setCollapseState({ collapsed });
};
// form onSubmit handler
const submitHandler = (event) => {
event.preventDefault();
event.target.className += " was-validated";
};
// fetch vehicle model & regid
// const [vehicleInfo, setVehicleInfo] = useState([]);
// let vehicleModel = "";
// let vehicleModelId = "";
// db.collection("data")
// .doc("MP10ME7969")
// .get()
// .then((snapshot) => {
// const currentInfo = [];
// snapshot.forEach((doc) => {
// currentInfo.push(doc.data());
// });
// setVehicleInfo(currentInfo);
// });
// vehicleInfo.forEach((data) => {
// vehicleModel = data.vehicleId;
// vehicleModelId = data.vehicleName;
// });
// fetch moduleState
const [moduleState, setModuleState] = useState([]);
let liveState = false;
db.collection("data")
.doc("MP10ME7969")
.collection("module_state")
.onSnapshot((docs) => {
const currentState = [];
docs.forEach((doc) => {
currentState.push(doc.data());
});
setModuleState(currentState);
});
moduleState.forEach((data) => {
liveState = data.state;
});
// form vehicleRegister submitHandler
const vehicleRegister = (event) => {
if (vehicleID && vehicleNAME) {
// check if the doc are already available in the DB... then just give the warning to the user!
// create a doc in DB with vehicleID and set it fields
db.collection("data").doc(vehicleID).set({
vehicleId: vehicleID,
vehicleName: vehicleNAME,
});
// create a dummy collection for newly created vehicleID
db.collection("data").doc(vehicleID).collection("fuel").doc().set({
id: "0",
amount: "0",
timestamp: "0",
});
db.collection("data").doc(vehicleID).collection("fuel_refill").doc().set({
id: "0",
amount: "0",
timestamp: "0",
});
db.collection("data")
.doc(vehicleID)
.collection("maintainance")
.doc()
.set({
id: "0",
amount: "0",
timestamp: "0",
});
db.collection("data").doc(vehicleID).collection("overspeed").doc().set({
id: "0",
speed: "0",
timestamp: "0",
});
db.collection("data").doc(vehicleID).collection("speed").doc().set({
id: "0",
speed: "0",
timestamp: "0",
});
db.collection("data")
.doc(vehicleID)
.collection("accident_alert")
.doc()
.set({
id: "0",
accident: "0",
geolocation_lat: "0",
geolocation_long: "0",
timestamp: "0",
});
db.collection("data")
.doc(vehicleID)
.collection("fuel_theft_alert")
.doc()
.set({
id: "0",
fuelTheft: "0",
geolocation_lat: "0",
geolocation_long: "0",
timestamp: "0",
});
db.collection("data")
.doc(vehicleID)
.collection("module_state")
.doc()
.set({
state: "0",
});
// success mgs for the all are right
setvehicleAddError(false);
setmaintainanceAddSuccess(false);
setmaintainanceAddError(false);
setvehicleAddSuccess(true);
// set it to defualt to state
setVehicleNAME("");
setVehicleID("");
} else {
// alert("Both the fields are mandatory!!!");
setvehicleAddSuccess(false);
setmaintainanceAddSuccess(false);
setmaintainanceAddError(false);
setvehicleAddError(true);
}
};
// from vehicleMaintenace submitHandler
const addCost = (event) => {
// store maintainance-cost into database
db.collection("data")
.doc(vehicleRegNumber)
.collection("maintainance")
.add({
id: vehicleRegNumber,
cose: cost,
timestamp: date,
})
.then(function () {
// success mgs for the all are right
setvehicleAddSuccess(false);
setvehicleAddError(false);
setmaintainanceAddError(false);
setmaintainanceAddSuccess(true);
})
.catch(function (error) {
setvehicleAddSuccess(false);
setvehicleAddError(false);
setmaintainanceAddSuccess(false);
setmaintainanceAddError(true);
});
};
// render() {
return (
<Layout id="header">
{/* Header Section */}
<HeaderLayout className="header" />
<Layout style={{ minHeight: "100vh" }}>
<Sider
collapsible
collapsed={collapseState.collapsed}
onCollapse={onCollapse}
>
<div className="logo" />
<Menu
theme="dark"
defaultSelectedKeys={["stats"]}
defaultOpenKeys={["track"]}
mode="inline"
>
<Menu.Item key="stats" icon={<PieChartOutlined />}>
Stats
</Menu.Item>
<SubMenu key="track" icon={<DesktopOutlined />} title="Track">
<Menu.Item key="speed">
<Link href="#speedSection">Speed</Link>
</Menu.Item>
<Menu.Item key="fuel">
<Link href="#fuelSection">Fuel</Link>
</Menu.Item>
<Menu.Item key="fuel_refill">
<Link href="#fuelRefillSection">Fuel Refill</Link>
</Menu.Item>
<Menu.Item key="overspeeding">
<Link href="#overSpeedingSection">OverSpeeding</Link>
</Menu.Item>
<Menu.Item key="maintainance">
<Link href="#maintainanceSection">Maintainance</Link>
</Menu.Item>
</SubMenu>
<Menu.Item
key="accidentAlert"
icon={<NotificationsActiveOutlinedIcon />}
>
<Link href="#accidentAlertSection">Accident alert</Link>
</Menu.Item>
<Menu.Item
key="fuelTheftAlert"
icon={<NotificationImportantIcon />}
>
<Link href="#fuelTheftAlertSection">FuelTheft alert</Link>
</Menu.Item>
<Menu.Item key="addVehicle" icon={<LocalTaxiIcon />}>
<Link href="#addVehicleSection">Add Vehicle</Link>
</Menu.Item>
<Menu.Item key="addMaintainance" icon={<PostAddIcon />}>
<Link href="#addVehicleSection">Add Maintainance</Link>
</Menu.Item>
<Menu.Item key="reportIssue" icon={<ReportProblemOutlinedIcon />}>
<Link
href="https://github.com/abhishekpatel946/Smart-Vehicle-Fleet-Manager/issues/new/choose"
onClick={preventDefault}
>
Report an issue
</Link>
</Menu.Item>
</Menu>
</Sider>
{/* Breadcrum Naming */}
<Layout className="site-layout">
<Content style={{ margin: "0 16px" }}>
<Breadcrumb style={{ margin: "16px 0" }}>
<Breadcrumb.Item>User</Breadcrumb.Item>
<Breadcrumb.Item>Dashboard</Breadcrumb.Item>
<div>
<p className="h6 text-left mb-1">
Status : {liveState ? "Active" : "Inactive"}
{/* {vehicleModel}
{vehicleModelId} */}
</p>
</div>
</Breadcrumb>
<div
className="site-layout-background"
style={{ padding: 24, minHeight: 560 }}
>
{/* Speed Section */}
<Divider orientation="left" id="speedSection">
Speed area
</Divider>
<MDBContainer>
<SpeedLog />
</MDBContainer>
{/* Fuel Section */}
<Divider orientation="left" id="fuelSection">
Fuel area
</Divider>
<MDBContainer>
<MDBRow>
<FuelLog />
</MDBRow>
</MDBContainer>
{/* OverSpeeding Section */}
<Divider orientation="left" id="overSpeedingSection">
OverSpeeding area
</Divider>
<MDBContainer>
<MDBRow>
<OverSpeedLog />
</MDBRow>
</MDBContainer>
{/* Fuel Refill Section */}
<Divider orientation="left" id="fuelRefillSection">
Fuel Refill area
</Divider>
<MDBContainer>
<MDBRow>
<FuelRefillLog />
</MDBRow>
</MDBContainer>
{/* Maintainence Section */}
<Divider orientation="left" id="maintainanceSection">
Maintainance area
</Divider>
<MDBContainer>
<MDBRow>
<MaintainenceLog />
</MDBRow>
</MDBContainer>
{/* Accident Section */}
<Divider orientation="left" id="accidentAlertSection">
Accident Alert area
</Divider>
<MDBContainer>
<MDBRow>
<AccidentAlert />
</MDBRow>
</MDBContainer>
{/* FuelTheft Section */}
<Divider orientation="left" id="fuelTheftAlertSection">
FuelTheft Alert area
</Divider>
<MDBContainer>
<MDBRow>
<FuelTheftAlert />
</MDBRow>
</MDBContainer>
{/* addVehicle Section */}
<Divider orientation="left" id="addVehicleSection">
Add Vehicle
</Divider>
<MDBContainer>
<MDBRow>
<MDBCol md="6">
<form
className="needs-validation"
onSubmit={submitHandler}
noValidate
>
<p className="h5 text-center mb-4">Register Vehicle</p>
<div className="grey-text">
<MDBInput
className="addVehicle_vehicleNAME"
name="vehicleNAME"
onChange={(event) =>
setVehicleNAME(event.target.value)
}
value={vehicleNAME}
label="Your vehicle name"
icon="car"
group
type="text"
validate
error="wrong"
success="right"
required
/>
<MDBInput
className="addVehicle_vehicleID"
name="vehicleID"
onChange={(event) => setVehicleID(event.target.value)}
value={vehicleID}
label="Your vechile reg. number"
icon="registered"
group
type="text"
validate
error="wrong"
success="right"
required
/>
</div>
<div className="text-center">
<MDBBtn outline type="submit" onClick={vehicleRegister}>
Register
<MDBIcon className="ml-1" />
</MDBBtn>
</div>
</form>
</MDBCol>
<MDBCol md="6">
<form
className="needs-validation"
onSubmit={submitHandler}
noValidate
>
<p className="h5 text-center mb-4">
Register Maintainance
</p>
<div className="grey-text">
<MDBInput
className="addVehicle_vehicleNAME"
name="vehicleName"
onChange={(event) =>
setVehicleRegNumber(event.target.value)
}
value={vehicleRegNumber}
label="Your vehicle Reg number"
icon="registered"
group
type="text"
validate
error="wrong"
success="right"
required
/>
<div>
<MuiPickersUtilsProvider utils={DateFnsUtils}>
<KeyboardDatePicker
disableToolbar
fullWidth
variant="inline"
format="dd/MM/yyyy"
margin="normal"
id="date-picker-inline"
label="DD/MM/YYYY"
value={date}
onChange={onDateChange}
KeyboardButtonProps={{
"aria-label": "change date",
}}
/>
</MuiPickersUtilsProvider>
</div>
<MDBInput
className="addVehicle_vehicleID"
name="cost"
onChange={(event) => setCost(event.target.value)}
value={cost}
label="Your mainatenace cost..."
icon="rupee-sign"
group
type="text"
validate
error="wrong"
success="right"
required
/>
</div>
<div className="text-center">
<MDBBtn outline type="submit" onClick={addCost}>
Add Cost
<MDBIcon className="ml-1" />
</MDBBtn>
</div>
</form>
</MDBCol>
</MDBRow>
</MDBContainer>
{/* back to top */}
<Link href="#header">
<Button
// ghost
icon={<NavigationIcon />}
style={{
float: "right",
margin: "auto 20px 10px 20px",
}}
>
{" "}
Back to top{" "}
</Button>
</Link>
{/* End */}
</div>
</Content>
{/* snakbar notifiers */}
<Snackbar
open={vehicleAddSuccess}
autoHideDuration={3000}
onClose={handleClose}
>
<Alert onClose={handleClose} severity="success">
Vehicle added successfully.
</Alert>
</Snackbar>
<Snackbar
open={vehicleAddError}
autoHideDuration={3000}
onClose={handleClose}
>
<Alert onClose={handleClose} severity="error">
All the field's are mendatory!!!
</Alert>
</Snackbar>
<Snackbar
open={maintainanceAddSuccess}
autoHideDuration={3000}
onClose={handleClose}
>
<Alert onClose={handleClose} severity="success">
Maintainance added successfully.
</Alert>
</Snackbar>
<Snackbar
open={maintainanceAddError}
autoHideDuration={3000}
onClose={handleClose}
>
<Alert onClose={handleClose} severity="error">
All the field's are mendatory!!!
</Alert>
</Snackbar>
{/* footer */}
<FooterLayout />
</Layout>
</Layout>
</Layout>
);
}
Example #7
| Source File: AppRouter.jsx From React-Nest-Admin with MIT License | 4 votes |
|
sidebar = () => {
return (
<Menu theme="dark" mode="inline" defaultSelectedKeys={["1"]}>
<Menu.Item key="1">
<Link to={{ pathname: "/" }}>
<HomeOutlined />
<span>首页</span>
</Link>
</Menu.Item>
<Menu.Item key="5">
<Link to={{ pathname: "/user-management" }}>
<UserOutlined />
<span>用户管理</span>
</Link>
</Menu.Item>
<SubMenu
key="sub1"
title={
<span>
<FileOutlined />
<span>文件管理</span>
</span>
}
>
<Menu.Item key="sub1-1">
<Link to={{ pathname: "/file/list" }}>
<OrderedListOutlined />
<span>文件列表</span>
</Link>
</Menu.Item>
<Menu.Item key="sub1-2">
<Link to={{ pathname: "/file/add" }}>
<UploadOutlined />
<span>文件上传</span>
</Link>
</Menu.Item>
</SubMenu>
<SubMenu
key="sub2"
title={
<span>
<DashboardOutlined />
<span>可视化图表</span>
</span>
}
>
<Menu.Item key="sub2-1">
<Link to={{ pathname: "/charts/line-chart" }}>
<LineChartOutlined />
<span>折线图</span>
</Link>
</Menu.Item>
<Menu.Item key="sub2-2">
<Link to={{ pathname: "/charts/bar-chart" }}>
<BarChartOutlined />
<span>柱状图</span>
</Link>
</Menu.Item>
<Menu.Item key="sub2-3">
<Link to={{ pathname: "/charts/pie-chart" }}>
<PieChartOutlined />
<span>饼状图</span>
</Link>
</Menu.Item>
</SubMenu>
<SubMenu
key="sub5"
title={
<span>
<FileExcelOutlined />
<span>Excel表格</span>
</span>
}
>
<Menu.Item key="sub5-1">
<Link to={{ pathname: "/excel/export-csv" }}>
<ExportOutlined />
<span>Export csv</span>
</Link>
</Menu.Item>
</SubMenu>
<SubMenu
key="sub4"
title={
<span>
<EditOutlined />
<span>文本编辑器</span>
</span>
}
>
<Menu.Item key="sub4-1">
<Link to={{ pathname: "/rich-text-editor" }}>
<Html5Outlined />
<span>富文本编辑器</span>
</Link>
</Menu.Item>
<Menu.Item key="sub4-2">
<Link to={{ pathname: "/md-editor" }}>
<FileMarkdownOutlined />
<span>Markdown编辑器</span>
</Link>
</Menu.Item>
</SubMenu>
<SubMenu
key="sub3"
title={
<span>
<BugOutlined />
<span>错误页面</span>
</span>
}
>
<Menu.Item key="sub3-1">
<Link to={{ pathname: "/not-found" }}>
<InboxOutlined />
<span>404</span>
</Link>
</Menu.Item>
<Menu.Item key="sub3-2">
<Link to={{ pathname: "/not-allow" }}>
<StopOutlined />
<span>403</span>
</Link>
</Menu.Item>
</SubMenu>
<Menu.Item key="6">
<a
href="https://github.com/cnscorpions/React-Nest-Admin"
target="_blank"
rel="noopener noreferrer"
>
<GithubOutlined />
<span>Github</span>
</a>
</Menu.Item>
</Menu>
);
}
