Files
CHIEFSOFT\ameye 5f95d857d4 first commit
2023-10-14 22:02:57 -04:00

77 lines
2.3 KiB
JavaScript

import React from "react";
import { Box } from "@mui/material";
import Card from "@mui/material/Card";
import { Typography } from "@mui/material";
import InputLabel from "@mui/material/InputLabel";
import MenuItem from "@mui/material/MenuItem";
import FormControl from "@mui/material/FormControl";
import Select from "@mui/material/Select";
import TaskDistributionChart from "./TaskDistributionChart";
const TaskDistribution = () => {
const [select, setSelect] = React.useState("");
const handleChange = (event) => {
setSelect(event.target.value);
};
return (
<>
<Card
sx={{
boxShadow: "none",
borderRadius: "10px",
p: "25px",
mb: "15px",
}}
>
<Box
sx={{
display: "flex",
alignItems: "center",
justifyContent: "space-between",
borderBottom: "1px solid #EEF0F7",
paddingBottom: "10px",
marginBottom: "15px",
}}
className="for-dark-bottom-border"
>
<Typography
as="h3"
sx={{
fontSize: 18,
fontWeight: 500,
}}
>
Task Distribution
</Typography>
<Box>
<FormControl sx={{ minWidth: 120 }} size="small">
<InputLabel id="demo-select-small" sx={{ fontSize: '14px' }}>Select</InputLabel>
<Select
labelId="demo-select-small"
id="demo-select-small"
value={select}
label="Select"
onChange={handleChange}
sx={{ fontSize: '14px' }}
className="select"
>
<MenuItem value={0} sx={{ fontSize: '14px' }}>Today</MenuItem>
<MenuItem value={1} sx={{ fontSize: '14px' }}>Last 7 Days</MenuItem>
<MenuItem value={2} sx={{ fontSize: '14px' }}>Last Month</MenuItem>
<MenuItem value={3} sx={{ fontSize: '14px' }}>Last 12 Months</MenuItem>
<MenuItem value={4} sx={{ fontSize: '14px' }}>All Time</MenuItem>
</Select>
</FormControl>
</Box>
</Box>
{/* TaskDistributionChart */}
<TaskDistributionChart />
</Card>
</>
);
};
export default TaskDistribution;