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, { useState } from "react";
import ContentTitle from "../../component/ContentTitle.jsx";
import SubTitle from "../../component/SubTitle.jsx";
import Modal from "../../component/Modal.jsx";
import Table from "../../component/Table.jsx";
import Button from "../../component/Button.jsx";
import { useNavigate } from "react-router";
import { width } from "@mui/system";
import DetailSearch from "../../component/DetailSearch.jsx";
import DetailTitle from "../../component/DetailTitle.jsx";
export default function UserAuthoriySelect() {
const navigate = useNavigate();
const [tapName, setTapName] = useState("복약관리")
const thead = [
"No", "이름", "대상자등록번호", "생년월일", "연락처", "주소", "최근 복약률",
];
const key = [
"No", "name", "number", "birth", "phone", "address", "average"
];
const content = [
{
No: 1,
name: "김복남",
number: "00000001",
birth: "1948.11.15",
phone: "010-1234-5678",
address: "경상북도 군위군 삼국유사면",
agency: "A복지관",
protect: "홍길동",
average: "0%",
},
];
const thead1 = [
"No", "이름", "대상자등록번호", "생년월일", "연락처", "주소", "최근 최저 온도", "최근 최고 온도",
];
const key1 = ["No", "name", "number", "birth", "phone", "address", "low", "high"
];
const content1 = [
{
No: 1,
name: "김복남",
number: "00000001",
birth: "1948.11.15",
phone: "010-1234-5678",
address: "경상북도 군위군 삼국유사면",
agency: "A복지관",
protect: "홍길동",
high: "18°C",
low: "18°C",
}
];
const thead2 = [
"No", "이름", "대상자등록번호", "생년월일", "연락처", "주소", , "최근 방문일", "방문목적", "상세사유",
];
const key2 = [
"No", "name", "number", "birth", "phone", "address", "visit", "reason", "reason_detail"
];
const content2 = [
{
No: 1,
name: "김복남",
number: "00000001",
birth: "1948.11.15",
phone: "010-1234-5678",
address: "경상북도 군위군 삼국유사면",
visit: "2023.02.08",
reason: "정기방문",
reason_detail: "정기방문일",
},
];
const data = [
{
id: 1,
title: "복약관리",
description: (
<Table
className={"protector-user"}
head={thead}
contents={content}
contentKey={key}
onClick={() => {
navigate("/MedicineCareSelectOne");
}}
/>
),
},
{
id: 2,
title: "댁내온도관리",
description: (
<Table
className={"senior-table"}
head={thead1}
contents={content1}
contentKey={key1}
onClick={() => {
navigate("/TemperatureManagementSelectOne");
}}
/>
),
},
{
id: 3,
title: "방문관리",
description: (
<Table
className={"senior-table"}
head={thead2}
contents={content2}
contentKey={key2}
onClick={() => {
navigate("/VisitSelectOne");
}}
/>
),
},
]
const [index, setIndex] = React.useState(1);
return (
<main>
<ContentTitle contentTitle={"건강 관리"} explanation={"대상자의 복약/댁내온도/방문 관리를 할 수 있습니다."} />
<div className="content-wrap">
<div
style={{ height: "calc(100% - 61px)" }}
>
<div className="right" style={{ height: "100%", }}>
<div style={{ height: "100%" }}>
<div className="tab-container">
<ul className="tab-menu-mobile">
<div>
<SubTitle
className="margin-bottom"
subtitle={"사용자 선택"}
explanation={"사용자 별로 선택 후 관리할 수 있습니다. "}
/>
</div>
<select name="" id="" style={{ width: "100%" }}>
<option value="사용자선택">보호자</option>
<option value="사용자선택">보호사</option>
<option value="사용자선택">병원</option>
<option value="사용자선택">지자체</option>
<option value="사용자선택">관리자</option>
</select>
</ul>
<ul className="tab-menu flex-end">
{data.map((item) => (
<li
key={item.id}
className={index === item.id ? "active" : null}
onClick={() => setIndex(item.id)}
>
{item.title}
</li>
))}
</ul>
<div className="content-wrap userlist">
<DetailTitle contentTitle={`${tapName}`} />
<div className="search-management flex-start margin-bottom2">
<DetailSearch />
</div>
<div className="flex">
<SubTitle explanation={"대상자 클릭 시 상세페이지로 이동합니다."} className="margin-bottom" />
<div className="flex searchselect">
<input type="radio"/>
<label htmlFor="">나의 대상자 보기</label>
<input type="radio" />
<label htmlFor="">전체 대상자 보기</label>
</div>
</div>
<ul className="tab-content">
{data
.filter((item) => index === item.id)
.map((item) => (
<li>{item.description}</li>
))}
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</main>
);
}