50 lines
1.0 KiB
JavaScript
50 lines
1.0 KiB
JavaScript
import React from 'react'
|
|
import {
|
|
Card,
|
|
CardBody,
|
|
CardHeader,
|
|
Typography,
|
|
} from "@material-tailwind/react";
|
|
import Chart from "react-apexcharts";
|
|
|
|
export default function index(props) {
|
|
const chartConfig = {
|
|
type: "pie",
|
|
width: 280,
|
|
height: 280,
|
|
series: [44, 55, 13, 43, 22],
|
|
options: {
|
|
chart: {
|
|
toolbar: {
|
|
show: false,
|
|
},
|
|
},
|
|
title: {
|
|
show: "",
|
|
},
|
|
dataLabels: {
|
|
enabled: false,
|
|
},
|
|
colors: ["#020617", "#ff8f00", "#00897b", "#1e88e5", "#d81b60"],
|
|
legend: {
|
|
show: false,
|
|
},
|
|
},
|
|
};
|
|
return (
|
|
|
|
<Card {...props}>
|
|
<CardHeader
|
|
floated={false}
|
|
shadow={false}
|
|
color="transparent"
|
|
className="flex flex-col gap-4 rounded-none md:flex-row md:items-center"
|
|
>
|
|
</CardHeader>
|
|
<CardBody className="px-2 pb-0">
|
|
<Chart {...chartConfig} />
|
|
</CardBody>
|
|
</Card>
|
|
)
|
|
}
|