
File name
Commit message
Commit date
File name
Commit message
Commit date
import React, { useState } from "react";
import { useNavigate, useLocation } from "react-router";
import { useSelector } from "react-redux";
import Calendar from "react-calendar";
import "react-calendar/dist/Calendar.css";
import Modal from "./Modal.jsx";
import moment from "moment";
import CommonUtil from "../../resources/js/CommonUtil.js";
export default function CalendarComponent({ data }) {
const navigate = useNavigate();
const location = useLocation();
//전역 변수 저장 객체
const state = useSelector((state) => { return state });
const defaultUserId = CommonUtil.isEmpty(state.loginUser) ? null : state.loginUser['user_id'];
const [value, setValue] = useState(new Date());
//const mark = ["12-04-2023", "21-04-2023", "05-04-2023", "02-04-2023"];
//const mark = ["2023-04-12", "2023-06-12"];
const Temperature = (date) => {
let todayTemperature = [];
data['temperature'].map((item, idx) => {
if (item['xName'] === date['date']) {
todayTemperature.push(item['temperature']);
}
})
if (todayTemperature.length > 0) {
if (moment(date['date']).format("MM") >= 11 || moment(date['date']).format("MM") <= 2) {
return (
<p>{Math.min.apply(null, todayTemperature)}</p>
)
} else {
return (
<p>{Math.max.apply(null, todayTemperature)}</p>
)
}
} else {
return (
<p>-</p>
)
}
}
const mark = [];
for (let i = 0; i < data.visitRecordList.length; i++) {
mark.push(data.visitRecordList[i]['visit_date']);
}
return (
<>
<Calendar
onChange={setValue}
value={value}
tileClassName={({ date, view }) => {
if (mark.find((x) => x === moment(date).format("YYYY-MM-DD"))) {
return "highlight";
}
}}
onClickDay={(date, event) => {
let sendData = { date: moment(date).format("YYYY-MM-DD") };
data.visitRecordList.map((item, idx) => {
if (item['visit_date'] === moment(date).format("YYYY-MM-DD")) {
sendData = {
date: moment(date).format("YYYY-MM-DD"),
visitData: item
}
}
})
data.onClick(sendData);
}}
tileContent={({ date, view }) => {
return (
<>
<div className="calendar-data">
<div>
<p><small>복약량</small></p>
{data['medication'].map((item, idx) => {
return (
item['xName'] === moment(date).format("YYYY-MM-DD") ? item['sum'] + '/' + item['total'] : null
)
})}
</div>
<div>
<div>
<p><small>온도(℃)</small></p>
<Temperature date={moment(date).format("YYYY-MM-DD")} />
</div>
</div>
</div>
</>
);
}}
/>
</>
);
}