
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
import React from "react";
import ContentTitle from "../../../component/ContentTitle.jsx";
import SubTitle from "../../../component/SubTitle.jsx";
import Button from "../../../component/Button.jsx";
import Chart3 from "../../../component/chart/Chart3.jsx";
import LineColor from "./../../../component/chart/LineColor.jsx";
import Donut2 from "./../../../component/chart/Donut2.jsx";
import ToggleButton from "../../../component/ToggleButton.jsx";
import Chart from './../../../component/chart/Chart.jsx';
export default function MedicineStatistics() {
return (
<main>
<div className="content-wrap">
<ContentTitle contentTitle={"복약율 통계"} />
<div className="board-wrap" style={{ height: "calc(100% - 60px)" }}>
<div className="statistics-grid" style={{ height: "100%" }}>
<div>
<SubTitle
className="margin-bottom"
explanation={"토탈 복약율 통계"}
color={"#333333"}
/>
<div
style={{
border: "1px solid #eeeeee",
borderRadius: "0.5rem",
padding: "1rem",
height: "calc(100% - 47px)",
}}
>
<div className="flex-end">
<div className="flex flex30">
<input type="date" name="" id="" />
</div>
<div className="flex10">
<Button className={"green-btn"} btnName={"검색"} />
</div>
</div>
<Donut2 />
</div>
</div>
<div>
<div className="flex">
<SubTitle
className="margin-bottom"
explanation={"나이대별 복약율 통계"}
color={"#333333"}
/>
</div>
<div
style={{
border: "1px solid #eeeeee",
borderRadius: "0.5rem",
padding: "1rem",
height: "calc(100% - 47px)",
}}
>
<Chart3 />
</div>
</div>
<div>
<div className="flex">
<SubTitle
className="margin-bottom"
explanation={"주별, 월별 복약율 통계"}
color={"#333333"}
/>
<ToggleButton
btnName1={"주별"}
btnName2={"월별"}
/>
</div>
<div
style={{
border: "1px solid #eeeeee",
borderRadius: "0.5rem",
padding: "1rem",
height: "calc(100% - 47px)",
}}
>
<div className="flex-end">
<select name="" id="">
<option value="">1월</option>
<option value="">2월</option>
<option value="">3월</option>
<option value="">4월</option>
<option value="">5월</option>
<option value="">6월</option>
<option value="">7월</option>
<option value="">8월</option>
<option value="">9월</option>
<option value="">10월</option>
<option value="">11월</option>
<option value="">12월</option>
</select>
</div>
<Chart />
</div>
</div>
<div>
<div className="flex">
<SubTitle
className="margin-bottom"
explanation={"분기별 년별 복약율 통계"}
color={"#333333"}
/>
<ToggleButton
btnName1={"분기별"}
btnName2={"년별"}
/>
</div>
<div
style={{
border: "1px solid #eeeeee",
borderRadius: "0.5rem",
padding: "1rem",
height: "calc(100% - 47px)",
}}
>
<div className="flex-end">
<select name="" id="">
<option value="">2022</option>
<option value="">2023</option>
</select>
</div>
<LineColor />
</div>
</div>
</div>
</div>
</div>
</main>
);
}