Commit @773c475197a0f0080d96ed9e87aff5094bfb630a

방선주 2023-03-08

Merge branch 'admin' of http://210.180.118.83/yjryu/senior_care_system into admin

@773c475197a0f0080d96ed9e87aff5094bfb630a

1496b44

773c475

client/resources/css/common.css

--- client/resources/css/common.css

+++ client/resources/css/common.css


 /* layout 공통 */
 textarea{border: 1px solid #d8d3c7; border-radius: 5px;}
 em{font-style: normal;}
-main img{margin-right: 1rem;}
+main img{margin-right: 1rem; max-width: 100%;
+  width: unset;}
 /* grid */
 
 .main-grid-admin {

   gap: 1rem;
 }
 .main-grid-agency {
-  height: 100%;
   display: grid;
   grid-template-columns: 1fr 1fr 1fr 1fr;
   grid-template-rows: 0.1fr;

 .flex100 {
   flex: 0 0 100%;
 }
-
 /* width 공통 */
 .width100 {
   width: 100%;

1496b44

773c475

client/resources/css/layout.css

--- client/resources/css/layout.css

+++ client/resources/css/layout.css


   grid-template-columns: 315px 1fr;
   grid-template-rows: 0.1fr 2.9fr;
 }
-#layout.expander{
-  grid-template-columns: 50px 1fr;
-}
 header {
   padding: 1rem 3rem;
   background-color: white;

   width: 100%;
 }
 
-.page-title span {
-  font-size: 1.8rem;
+.page-title-span {
+  font-size: 2.5rem;
   font-weight: bold;
-  margin-left: 1rem;
 }
 
 nav{
   height: 100%;
+  width: 310px;
   background-color: #f2f0eb;
   grid-area: nav;
-  position: relative;
+  position: fixed;
+  z-index: 10;
   background: #ffffff;
   box-shadow: 1px 0px 6px 2px rgb(0 0 0 / 20%); 
 }

 .logout{background: #f26e50;}
 #pages {
   max-width: 100%;
-  height: 100%;
   padding: 3rem;
   background-color: #f4f4f2;
   grid-area: main;

 
 main {
   max-width: 100%;
+  height: 100%;
 }
 
 .content-wrap {

 .userlist{
   box-shadow: 1px 1px 5px 1px rgb(0 0 0 / 20%);
   width: 100%;
-  height: 51rem;
   padding: 4.5rem 2rem;
 }
 

 }
 .hierarchy-menu ul a {
   display: block;
-  padding: 6px 5rem;
+  padding: 6px 0 0 5rem;
   height: 44px;
   position: relative;
   color: #333333;

1496b44

773c475

client/resources/css/main.css

--- client/resources/css/main.css

+++ client/resources/css/main.css


 /* 공통 */
-.logo {
-  font-size: 2.4rem;
-  font-family: 'AuctionGothic_Medium';
-}
-
 header>div {
   height: 100%;
 }

 .menuicon {
   display: none;
   cursor: pointer;
-  height: 9.4rem;
-  left: 2.5rem;
+  left: 1.5rem;
   top: 2.6rem;
   position: absolute;
 }
 
 /* 시행기관 장비관리 리스트 */
-
+.react-calendar__month-view__days__day--neighboringMonth{display: none;}
 .visitlist {
   height: 55vh;
 }

 }
 
 .question-select label {
-  width: 10%;
+  margin-right: 1rem;
 }
 
 .question-select select {
   width: 16%;
   height: 3.7rem;
+  margin-right: 1rem;
 }
 
 .qna-insert select {

 
 
 /* -----------------------------------------------지자체 */
-
+.statistics-agency #RowChart>div{height: 36rem;}
 
 .map {
   width: 100%;

   color: #cbc9c9;
 }
 
-.statistics-guardian {
-  height: 100%;
+.statistics-grid .statistics-guardian {
+  height: 41vh;
 }
-
+.statistics-grid .statistics-guardian li:nth-child(1) p:nth-child(2){font-size: 2rem; font-weight: bold; margin-right: 1rem;}
+.statistics-grid .statistics-guardian li:nth-child(1) p:nth-child(3){font-size: 1.6rem; }
 .guardian-medicine {
-  height: 16vh;
+  height: 17vh;
 }
 
 .statistics-guardian li {

   border-radius: 20px;
   margin: 0 auto;
   margin-bottom: 1rem;
+  position: relative;
 }
-
-/* .statistics-guardian:nth-child(1) {
-  background: #fbe4e4;
-}
-
-.statistics-guardian:nth-child(2) {
-  background: #edf7df;
-}
-
-.statistics-guardian:nth-child(3) {
-  background: #f9f7e0;
-}
-
-.statistics-guardian:nth-child(4) {
-  background: #e9e7fe;
-}
-.statistics-guardian li p{
-  padding: 0 2rem;
-} */
-.statistics-guardian li:nth-child(2),
-.statistics-guardian li:nth-child(3),
-.statistics-guardian li:nth-child(4),
-.statistics-guardian li:nth-child(5),
-.statistics-guardian li:nth-child(6),
-.statistics-guardian li:nth-child(7) {
-  background: rgba(255, 254, 254, 0.5);
-}
-
-.chart-guardian {
-  height: 77%;
-}
-
-.statistics-guardian li p:nth-child(3) {
-  font-size: 1.5rem;
-}
-
-.statistics-guardian li p:nth-of-type(1) {
-  position: inherit;
-  font-size: 1.5rem;
+.medicine-title{
+  position: absolute;
+  right: -13px;
+  top: 78px;
   font-weight: bold;
+  font-size: 1.5rem;
 }
-
-.statistics-guardian li p:nth-of-type(2) {
-  padding: 0;
-  font-size: 2rem;
+.chart-guardian {
+  height: 70%;
 }
 
 .guardian-table {

   display: none;
   box-shadow: 1px 1px 14px 1px rgba(0, 0, 0, 0.15);
   border-radius: 20px;
+  max-width: 100%;
+  width: unset;
 }
 
 .battery-img img.show {

 .detail-search table td {
   border-top: none;
 }
-
-.detail-search tbody tr:nth-of-type(2) select {
-  width: 24.4%;
-}
-
 .detail-search tbody select {
   height: 3.7rem;
 }

 }
 
 /* 사용자 관리 */
+.userauthoriylist .left{width: 27%;}
+ .userauthoriylist .right{width: 70%; }
+.bSXvtB{display: none;}
 .tab-menu .tab-menu-agency {
   display: flex;
 }

 
 .search-management select {
   width: 15%;
-  height: 3rem;
+  height: 3.6rem;
+  margin-right: 1rem;
 }
 
 .search-management input {
   width: 20%;
-  height: 3.7rem;
+  height: 3.6rem;
   margin-right: 1rem;
 }
 

1496b44

773c475

client/resources/css/reset.css

--- client/resources/css/reset.css

+++ client/resources/css/reset.css


 select{
   width: 32%;
   border-radius: 0.5rem;
-  margin-right: 1rem;
   border: 1px solid #d8d3c7;
 }
 

1496b44

773c475

client/resources/css/responsive.css

--- client/resources/css/responsive.css

+++ client/resources/css/responsive.css


   }
 
   /* 사용자 관리 */
-  .tab-menu-mobile {
-    display: block;
-    padding: 1rem;
-    background-color: #ffffff;
-  }
 
   .tab-menu {
     display: none;

   .usericon {
     display: none;
   }
-
+  .ittLqr{font-size: 1.3rem !important;}
   /* 공통 */
   #layout{display: block;}
-  #pages{padding: 1rem;}
+  #pages{padding: 1rem; padding-top: 12rem; background-color: #ffffff;}
   header {
     padding: 1rem;
     position: fixed;
   }
   nav {
     position: fixed;
-    left: -310px;
-    top: 86px;
-    z-index: 10;
+    left: -320px;
+    top: 87px;
+    z-index: 12;
     transition: 0.5s;
     box-shadow:12px -6px 10px -10px rgb(0 0 0 / 20%);
     height:91vh;
   }
-  main{padding-top: 9rem;}
   nav.on {
     left: 0;
     transition: 0.5s;
   }
   .bottom-section{padding: 0.9rem ; bottom: 6rem;}
-  .content-wrap{padding: 1rem;}
+  .content-wrap{padding: 3rem 1rem 0 1rem; }
   th,td,tr{display: block;}
+  .header-info-id,#fullDate, #temp,.cCoJhO{display: none;}
+  /* 에이젼시 메인 */
+  .main-grid-agency{display: block;}
+  .main-grid-agency .agency-visitlist{margin-top: 16rem;}
+  .agency-calendar .react-calendar__month-view__weekdays{display: flex !important;}
+  .agency-calendar .react-calendar__month-view__days__day{flex: 0 0 12.5% !important;}
+  .agency-calendar .react-calendar__month-view__days{flex-wrap: wrap !important;}
+  .tab-menu-agency li{padding: 1rem;}
+  .statistics-agency{margin-bottom: 1rem;}
+  /* 지자체 메인 */
+  .main-grid-government{display: block;}
+  .main-grid-government .content-box:nth-child(8), .main-grid-government .content-box:nth-child(6){height: 30rem;}
+  #RowChart>div{height: 36rem;}  
+  .main-grid-government .content-box{margin-bottom: 1rem;}
+  .statistics-govern{margin-bottom: 1rem;}
+  /* 보호자 메인 */
+  .main-grid-guardian{display: block;}
+  .guardian-img{width: 2rem;}
+ 
+  /* 보호자 그래프보기 */
+  #chartdiv1{height: 26vh !important;}
+  #chartdiv{height: 26vh !important;}
+  #chart{height: 27vh !important;}
+  #Chart2{height: 27vh !important;}
+  .statistics-grid{display: block;}
+  .statistics-grid .statistics-guardian {
+   margin-bottom: 1rem; padding: 0; height: 32vh;
+  }
+  .statistics-grid .statistics-guardian li{padding: 0;}
+  .statistics-grid .statistics-guardian li p:nth-child(1){margin-right: 1rem;}
+  .statistics-grid .statistics-guardian li:nth-child(1) p:nth-child(2){width: 20%;}
+  /* Q&A */
+  .question-select select{width: 22%;}
   /* 권한관리 */
   .authority-table-pc {
     display: none;

   }
 
   /* 사용자관리 */
-  .tab-menu-mobile {
-    display: block;
-    padding: 1rem;
-    background-color: #ffffff;
-  }
-
-  .tab-menu {
-    display: none;
-  }
-
+  .senior-search{width: 25% !important;}
+  .searchselect label{margin-right: 2rem;}
+  .protector-user{margin-top: 2rem;}
+  .userauthoriylist{display: block;}
+  .userauthoriylist .left, .userauthoriylist .right {
+    width: 100% ;
+}
+.userauthoriylist .right{margin-top: 2rem;}
+.tab-menu {display: block;}
+.tab-menu li{width: 100%;}
+.userlist{padding: 1rem !important;}
   .search-management {
     justify-content: space-between;
   }
 
   .search-management select {
     width: 22%;
+    margin: 0;
   }
 
   .search-management input {
-    width: 30%;
-    margin-right: 1rem;
+    width: 52%;margin: 0;
   }
 
-  .search-management button {
-    width: 20%;
-  }
-
-  /* 공통 */
-
-  .header-flex {
-    display: flex;
-    justify-content: flex-start;
-  }
-
-  /* 보호자 메인 그리드 */
-  .pc {
-    display: none;
-  }
-
-  .mobile {
-    display: block;
-  }
-
-  .mobile .main-grid-guardian {
-    gap: 0.5rem;
-  }
-
-  .mobile .main-grid-guardian .content-box {
-    padding: 0.5rem;
-  }
-
-  .mobile .main-grid-guardian .content-box:nth-child(2)>div p {
-    font-size: 1.8rem;
-  }
-
-  .mobile .main-grid-guardian .content-box:nth-child(7)>div {
-    justify-content: flex-start;
-  }
-
-  .mobile .main-grid-guardian {
-    grid-template-columns: 1fr;
-    grid-template-rows: none;
-  }
-
-  .mobile .main-grid-guardian .combine-right-government,
-  .mobile .main-grid-guardian .combine-left {
-    grid-column: 1;
-  }
-
-  .mobile .main-grid-guardian .combine-bottom-government {
-    grid-column: 0;
-  }
+ .searchselect-wrap{display: block;}
+ .searchselect{width: max-content;}
+ .page-title-span{display: block;
+  margin-left: 5rem;}
 
   /* button */
 
   .btn-large {
     font-size: 1.4rem;
-    width: 20%;
   }
 
   /* 로그인 */

     width: 30%;
   }
 
-  /* 메인 */
-  .temp p {
-    font-size: 2rem;
-  }
-
-  .main-battery-title {
-    font-size: 1.4rem;
-    justify-content: flex-start;
-    padding-right: 1rem;
-  }
-
-  .battery::after {
-    content: " 남았습니다.";
-    font-size: 1.4rem;
-    margin-left: 0;
-  }
-
-  .battery p {
-    font-size: 2rem;
-    padding-left: 0;
-    padding-right: 1rem;
-  }
-
-  #chartdiv1 {
-    height: 25vh;
-  }
-
-  .statistics li p:nth-of-type(1),
-  .statistics li p:nth-of-type(2) {
-    font-size: 1.4rem;
-  }
-
-  .weather-info {
-    width: 70%;
-  }
-
-  .recent-visit {
-    border: 0;
-  }
-
-  .recent-visit td {
-    padding-left: 12rem;
-  }
-
-  .recent-visit td:nth-of-type(1) {
-    font-weight: bold;
-    padding: 0.5rem;
-  }
-
-  .recent-visit td:nth-of-type(1)::before {
-    content: "";
-  }
-
-  .recent-visit td:nth-of-type(2):before {
-    content: "방문목적";
-  }
-
-  .recent-visit td:nth-of-type(3):before {
-    content: "방문 상세 이유";
-  }
-
 
   /* 검색창 */
-
-  .mobile-area-wrap {
-    display: block;
-    margin-top: 1rem;
-  }
-
-  .mobile-area-wrap div {
-    width: 100%;
-    margin-top: 1rem;
-  }
-
-  .mobile-area-wrap div label {
-    width: 30%;
-    font-size: 1.6rem;
-  }
-
-  .mobile-area-wrap div select {
-    width: 70%;
-  }
-
+  .detail-search tbody select{margin-right: 1rem;}
   .area-wrap {
     display: none;
   }

   }
 
   /* 장비조회 */
-
+  .equip-tab{display: block;}
   /* 장비 상세 조회 */
   /* 장비등록창 */
   .equipment-modal tbody td {

1496b44

773c475

client/views/component/AgencySearch.jsx

--- client/views/component/AgencySearch.jsx

+++ client/views/component/AgencySearch.jsx


 
   return (
     <div className="search-group">
-      <div className="search-area flex" style={{ width:"50%"}}>
-        <div className="detail-search" style={{ width:"85%"}}>
+      <div className="search-area flex-start" >
+        <div className="detail-search" >
           <table>
             <tbody>
               <tr>

1496b44

773c475

client/views/component/DetailTitle.jsx

--- client/views/component/DetailTitle.jsx

+++ client/views/component/DetailTitle.jsx


   &::before {
     content: "";
     position: absolute;
-    z-index: 10;
+    z-index: 5;
     left: 0;
     bottom: -15px;
     height: 8px;

1496b44

773c475

client/views/component/QnAModal.jsx

--- client/views/component/QnAModal.jsx

+++ client/views/component/QnAModal.jsx

...	...	@@ -4,45 +4,106 @@
4	4	import SubTitle from "./SubTitle.jsx";
5	5	import { useNavigate } from "react-router";
6	6
7		-export default function QaAModal({ open, close, }) {
	7	+export default function QnAModal({ open, close }) {
	8	+ const [qnaRegisteringList, setQnaRegisteringList] = React.useState([]);
	9	+
	10	+ const [idx, setIdx] = React.useState();
	11	+ const [title, setTitle] = React.useState("");
	12	+ const [datetime, setDatetime] = React.useState("");
	13	+ const [contents, setContents] = React.useState("");
	14	+
	15	+ //qna등록
	16	+ const getQnaRegisteringList = () => {
	17	+ fetch("/qna/qnaInsert.json", {
	18	+ method: "POST",
	19	+ headers: {
	20	+ "Content-Type": "application/json; charset=UTF-8;",
	21	+ },
	22	+ body: JSON.stringify({
	23	+ qna_idx: idx,
	24	+ qna_title: title,
	25	+ qna_insert_user_id: "gym1004",
	26	+ qna_insert_datetime: datetime,
	27	+ }),
	28	+ })
	29	+ .then((response) => response.json())
	30	+ .then((data) => {
	31	+ if (data > 0) {
	32	+ console.log(data);
	33	+ alert("등록완료");
	34	+ close(true);
	35	+ } else {
	36	+ alert("등록실패, 관리자에게 문의해주세요.");
	37	+ }
	38	+ })
	39	+ .catch((error) => {
	40	+ console.log("qna error : ", error);
	41	+ });
	42	+ };
	43	+
	44	+ //게시판
	45	+ const thead = ["제목", "작성자", "작성일자"];
	46	+ const key = ["qna_title", "qna_insert_user_name", "qna_insert_datetime"];
	47	+
8	48	return (
9	49	<div class={open ? "openModal modal" : "modal"}>
10		- {open ? (
11		- <div className="modal-inner">
12		- <div className="modal-header flex">
13		- Q&A등록
14		- <Button className={"close"} onClick={close} btnName={"X"} />
15		- </div>
16		- <div className="modal-main"><div className="board-wrap">
17		- <div>
18		- <SubTitle explanation={"작성자 정보"} />
19		- <table className="margin-bottom2 qna-insert">
20		- <tr>
21		- <th>작성자</th>
22		- <td>
23		- <input type="text" placeholder="자동입력부분" />
24		- </td>
25		- </tr>
	50	+ {open ? (
	51	+ <div className="modal-inner">
	52	+ <div className="modal-header flex">
	53	+ Q&A등록
	54	+ <Button className={"close"} onClick={close} btnName={"X"} />
	55	+ </div>
	56	+ <div className="modal-main">
	57	+ <div className="board-wrap">
	58	+ <div>
	59	+ <SubTitle explanation={"작성자 정보"} />
	60	+ <table className="margin-bottom2 qna-insert">
	61	+ <tr>
	62	+ <th>작성자</th>
	63	+ <td>
	64	+ <input type="text" placeholder="자동입력부분" />
	65	+ </td>
	66	+ </tr>
26	67
27		- <tr>
28		- <th>제목</th>
29		- <td colSpan={3}>
30		- <input type="text" />
31		- </td>
32		- </tr>
33		- <tr>
34		- <th>내용</th>
35		- <td colSpan={3}>
36		- <textarea className="medicine" cols="30" rows="2"></textarea>
37		- </td>
38		- </tr>
39		- </table>
	68	+ <tr>
	69	+ <th>제목</th>
	70	+ <td colSpan={3}>
	71	+ <input
	72	+ type="text"
	73	+ value={title}
	74	+ onInput={(e) => {
	75	+ setTitle(e.target.value);
	76	+ }}
	77	+ />
	78	+ </td>
	79	+ </tr>
	80	+ <tr>
	81	+ <th>내용</th>
	82	+ <td colSpan={3}>
	83	+ <textarea
	84	+ className="medicine"
	85	+ cols="30"
	86	+ rows="2"
	87	+ value={contents}
	88	+ onInput={(e) => {
	89	+ setContents(e.target.value);
	90	+ }}
	91	+ ></textarea>
	92	+ </td>
	93	+ </tr>
	94	+ </table>
	95	+ </div>
	96	+ <div className="flex-center">
	97	+ <Button
	98	+ className={"btn-small red-btn"}
	99	+ btnName={"저장"}
	100	+ onClick={() => getQnaRegisteringList()}
	101	+ />
	102	+ </div>
	103	+ </div>
	104	+ </div>
40	105	</div>
41		- <div className="flex-center"><Button className={"btn-small red-btn"} btnName={"저장"} /></div >
42		- </div></div>
43		- </div>
44		- ) : null}
45		- </div>
46		-
	106	+ ) : null}
	107	+ </div>
47	108	);
48	109	}

1496b44

773c475

client/views/component/chart/LineColor.jsx

--- client/views/component/chart/LineColor.jsx

+++ client/views/component/chart/LineColor.jsx


 
     // Add scrollbar
     // https://www.amcharts.com/docs/v5/charts/xy-chart/scrollbars/
-    chart.set(
-      "scrollbarX",
-      am5.Scrollbar.new(root, {
-        orientation: "horizontal",
-        marginBottom: 20,
-      })
-    );
+    // chart.set(
+    //   "scrollbarX",
+    //   am5.Scrollbar.new(root, {
+    //     orientation: "horizontal",
+    //     marginBottom: 20,
+    //   })
+    // );
 
     // Make stuff animate on load
     // https://www.amcharts.com/docs/v5/concepts/animations/

1496b44

773c475

client/views/layout/Header.jsx

--- client/views/layout/Header.jsx

+++ client/views/layout/Header.jsx


   return (
     <header>
       <div className="header-flex flex flex-align">
+        <span className="page-title-span">{title}</span>
         <div className="page-title flex flex-align">
           {/* <MenuIcon /> */}
           <div className="info-wrap flex">
             <div className="usericon"><PersonIcon sx={{ width:48, height:48,}} /></div>
-            <p className="header-info-id">admin1</p>
-            
+            <p className="header-info-id">admin1</p>            
           </div>
-          {/* <span>{title}</span> */}
-        </div>
         <Weather />
+        </div>
       </div>
     </header>
   );

1496b44

773c475

client/views/pages/callcenter/QandASelect.jsx

--- client/views/pages/callcenter/QandASelect.jsx

+++ client/views/pages/callcenter/QandASelect.jsx


 import Button from "../../component/Button.jsx";
 import Table from "../../component/Table.jsx";
 import Modal from "../../component/Modal.jsx";
+import DetailTitle from "../../component/DetailTitle.jsx";
 import { useNavigate } from "react-router";
 import ContentTitle from "../../component/ContentTitle.jsx";
 import RestoreFromTrashIcon from '@mui/icons-material/RestoreFromTrash';

   return (
     <main>
       <div className="content-wrap">
-        <ContentTitle contentTitle={"장비 문의 요청"} />
-        <div className="board-wrap">
+      <DetailTitle contentTitle={"장비 문의 요청"} />
+        <div className="board-wrap" style={{ marginTop: "3rem" }} >
           <div className="btn-wrap flex-end margin-bottom">
             
             <Button

1496b44

773c475

client/views/pages/callcenter/QuestionConfirm.jsx

--- client/views/pages/callcenter/QuestionConfirm.jsx

+++ client/views/pages/callcenter/QuestionConfirm.jsx

...	...	@@ -5,7 +5,41 @@
5	5	import { useNavigate } from "react-router";
6	6
7	7	export default function QuestionConfirm() {
	8	+
8	9	const navigate = useNavigate();
	10	+
	11	+ const [username, setUsername] = React.useState("");
	12	+ const [qnaOne, setQnaOne] = React.useState([]);
	13	+
	14	+
	15	+ //qna 조회
	16	+ const getQnaOne = () => {
	17	+ fetch("/qna/qnaSelectOne.json", {
	18	+ method: "POST",
	19	+ headers: {
	20	+ "Content-Type": 'application/json; charset=UTF-8',
	21	+ },
	22	+ body: JSON.stringify({
	23	+ qna_insert_user_name : username
	24	+
	25	+ }),
	26	+ })
	27	+ .then((response) => response.json())
	28	+ .then((data) => {
	29	+ console.log(data[3]);
	30	+ setQnaOne(data[3]);
	31	+ })
	32	+ .catch((error) => {
	33	+ console.log("qna error : ", error);
	34	+ });
	35	+ };
	36	+
	37	+ React.useEffect(() => {
	38	+
	39	+ getQnaOne();
	40	+
	41	+ }, [])
	42	+
9	43	return (
10	44	<main>
11	45	<div className="content-wrap row">
...	...	@@ -14,29 +48,23 @@
14	48	<table className="margin-bottom2 senior-insert">
15	49	<tr>
16	50	<th>작성자</th>
17		- <td>
18		- 김가족
19		- </td>
	51	+ <td>{qnaOne.qna_insert_user_name}</td>
20	52	</tr>
21	53
22	54	<tr>
23	55	<th>제목</th>
24		- <td colSpan={3}>
25		- 문의
26		- </td>
	56	+ <td colSpan={3}>{qnaOne.qna_title}</td>
27	57	</tr>
28	58	<tr>
29		- <th>내용</th>
30		- <td colSpan={3}>
31		- 문의합니다.
32		- </td>
33		- </tr>
34		- <tr>
35		- <th>답변하기</th>
36		- <td colSpan={3}>
37		- <textarea className="medicine" cols="30" rows="2"></textarea>
38		- </td>
39		- </tr>
	59	+ <th>내용</th>
	60	+ <td colSpan={3}>{qnaOne.qna_content}</td>
	61	+ </tr>
	62	+ <tr>
	63	+ <th>답변하기</th>
	64	+ <td colSpan={3}>
	65	+ <textarea className="medicine" cols="30" rows="2"></textarea>
	66	+ </td>
	67	+ </tr>
40	68	</table>
41	69
42	70	<div className="btn-wrap flex-center">
...	...	@@ -44,14 +72,14 @@
44	72	className={"btn-large gray-btn"}
45	73	btnName={"이전"}
46	74	onClick={() => {
47		- navigate("/QandASelect");
	75	+ navigate("/QuestionSelect");
48	76	}}
49	77	/>
50	78	<Button
51	79	className={"btn-large green-btn"}
52	80	btnName={"등록"}
53	81	onClick={() => {
54		- navigate("/QandASelect");
	82	+ navigate("/QuestionSelect");
55	83	}}
56	84	/>
57	85	</div>
...	...	@@ -59,3 +87,114 @@
59	87	</main>
60	88	);
61	89	}
	90	+
	91	+// import React from "react";
	92	+// import Button from "../../component/Button.jsx";
	93	+// import ContentTitle from "../../component/ContentTitle.jsx";
	94	+// import SubTitle from "../../component/SubTitle.jsx";
	95	+// import { useNavigate } from "react-router";
	96	+// import { useParams } from "react-router";
	97	+
	98	+// export default function QuestionConfirm() {
	99	+// const navigate = useNavigate();
	100	+
	101	+
	102	+// const [username, setUsername] = React.useState("");
	103	+// const [qnaOne, setQnaOne] = React.useState([]);
	104	+
	105	+
	106	+// //qna 조회
	107	+// const getQnaOne = () => {
	108	+// fetch("/qna/qnaSelectOne.json", {
	109	+// method: "POST",
	110	+// headers: {
	111	+// "Content-Type": 'application/json; charset=UTF-8',
	112	+// },
	113	+// body: JSON.stringify({
	114	+// qna_insert_user_name : username
	115	+
	116	+// }),
	117	+// })
	118	+// .then((response) => response.json())
	119	+// .then((data) => {
	120	+// console.log(data[3]);
	121	+// setQnaOne(data[3]);
	122	+// })
	123	+// .catch((error) => {
	124	+// console.log("qna error : ", error);
	125	+// });
	126	+// };
	127	+
	128	+
	129	+// // const getSeniorDataOne = () => {
	130	+// // fetch("/user/selectSeniorOne.json", {
	131	+// // method: "POST",
	132	+// // headers: {
	133	+// // 'Content-Type': 'application/json; charset=UTF-8'
	134	+// // },
	135	+// // body: JSON.stringify({
	136	+// // user_id: seniorId
	137	+// // }),
	138	+// // }).then((response) => response.json()).then((data) => {
	139	+// // console.log("data : ", data[0]);
	140	+// // setSeniorOne(data[0]);
	141	+
	142	+// // }).catch((error) => {
	143	+// // console.log('getSeniorDataOne() /user/selectSeniorOne.json error : ', error);
	144	+// // });
	145	+// // };
	146	+
	147	+// React.useEffect(() => {
	148	+
	149	+// getQnaOne();
	150	+
	151	+// }, [])
	152	+
	153	+
	154	+// return (
	155	+// <main>
	156	+// <div className="content-wrap row">
	157	+// <ContentTitle contentTitle={"문의글 작성"} />
	158	+// <SubTitle explanation={"작성자 정보"} />
	159	+// <table className="margin-bottom2 senior-insert">
	160	+// <tr>
	161	+// <th>작성자</th>
	162	+// <td>{qnaOne.qna_insert_user_name}</td>
	163	+// </tr>
	164	+
	165	+// <tr>
	166	+// <th>제목</th>
	167	+// <td colSpan={3}>{qnaOne.qna_title}</td>
	168	+// </tr>
	169	+// <tr>
	170	+// <th>내용</th>
	171	+// <td colSpan={3}>{qnaOne.qna_content}</td>
	172	+// </tr>
	173	+// <tr>
	174	+// <th>답변하기</th>
	175	+// <td colSpan={3}>
	176	+// <textarea className="medicine" cols="30" rows="2"></textarea>
	177	+// </td>
	178	+// </tr>
	179	+// </table>
	180	+
	181	+// <div className="btn-wrap flex-center">
	182	+// <Button
	183	+// className={"btn-large gray-btn"}
	184	+// btnName={"이전"}
	185	+// onClick={() => {
	186	+// navigate("/QuestionSelect");
	187	+// }}
	188	+// />
	189	+// <Button
	190	+// className={"btn-large green-btn"}
	191	+// btnName={"등록"}
	192	+// onClick={() => {
	193	+// navigate("/QuestionSelect");
	194	+// }}
	195	+// />
	196	+// </div>
	197	+// </div>
	198	+// </main>
	199	+// );
	200	+// }

1496b44

773c475

client/views/pages/callcenter/QuestionSelect.jsx

--- client/views/pages/callcenter/QuestionSelect.jsx

+++ client/views/pages/callcenter/QuestionSelect.jsx


   const openModal = () => {
     setModalOpen(true);
   };
-  const closeModal = () => {
+  const closeModal = (isInsertComplete) => {
     setModalOpen(false);
+    if (isInsertComplete == true) {
+      getQnaList();
+    }
   };
 
-  const [qnaList, setQnaList] = React.useState();
+  const [qnaList, setQnaList] = React.useState([]);
 
-  const [state, setState] = React.useState();
-  const [title, setTitle] = React.useState();
-  const [username, setUsername] = React.useState();
-  const [datetime, setDatetime] = React.useState();
+  const [idx, setIdx] = React.useState();
 
   //-------- 페이징 작업 설정 시작 --------//
   const limit = 15; // 페이지당 보여줄 공지 개수

       },
       body: JSON.stringify({
 
-        qna_state: state,
-        qna_title: title,
-        qna_insert_user_id: username,
-        qna_insert_datetime: datetime,
+        qna_idx: idx,
+
       }),
     })
       .then((response) => response.json())
       .then((data) => {
         console.log(data);
         setQnaList(data);
-        // setMyQnaTotal(data.length);
+        setMyQnaTotal(data.length);
       })
       .catch((error) => {
         console.log(

 
   //게시판
   const thead = ["No", "답변상태", "제목", "작성자", "작성일자"];
-  const key = ["idx", "state", "title", "username", "datetime"];
-  const content = [
-    {
-      No: 1,
-      answer: "답변완료",
-      title: (
-        <div
-          className="title"
-          onClick={() => {
-            navigate("/QuestionConfirm");
-          }}
-        >
-          담당자 바꿔주세요
-        </div>
-      ),
-      writer: "홍길동",
-      date: "2023-01-27",
-    },
-  ];
+  const key = ["qna_idx", "qna_state", "qna_title", "qna_insert_user_name", "qna_insert_datetime"];
+  
 
   React.useEffect(() => {
 

         header="기관 등록"
       ></QnAModal>
       <div className="content-wrap">
-        <ContentTitle contentTitle={"Q&A"} />
         <div className="board-wrap">
           <div className="btn-wrap flex-end margin-bottom question-select">
             <input type="checkbox" />

         <Table
           className="equipment-detail"
           head={thead}
-          contents={content}
+          contents={qnaList}
           contentKey={key}
           view={"qna"}
           offset={offset}
           limit={limit}
         />
-      </div>
-      <div>
-        <Pagination
-          total={myQnaTotal}
-          limit={limit}
-          page={page}
-          setPage={setPage}
-        />
+        <div className="margin-bottom">
+          <Pagination
+            total={myQnaTotal}
+            limit={limit}
+            page={page}
+            setPage={setPage}            
+          />
+        </div>
       </div>
     </main>
   );

1496b44

773c475

client/views/pages/equipment/EquipmentManagementSelect.jsx

--- client/views/pages/equipment/EquipmentManagementSelect.jsx

+++ client/views/pages/equipment/EquipmentManagementSelect.jsx


 	}
 
 
-	// 관리자 전체 장비 목록
+	// 전체 장비 목록
 	const [equipmentList, setEquipmentList] = React.useState([]);
 	// 장비
 	const [equipment, setEquipment] = React.useState({

 	});
 	// 장비 등록 모달창
 	const [equipmentInsertModal, setEquipmentInsertModal] = React.useState(false);
+	// 장비 상세 조회 모달창
+	const [equipmentOneModal, setEquipmentOneModal] = React.useState(false);
 
-	// 장비 등록 모달창 열기
-	const equipmentInsertModalOpen = () => {
-		setEquipmentInsertModal(true);
-	};
-	// 장비 등록 모달창 닫기
-	const equipmentInsertModalClose = () => {
-		// 장비 초기화
-		setEquipment(equipment_);
-		setEquipmentInsertModal(false);
-	};
-
-
-	// 관리자 전체 장비 목록 조회
+	// 전체 장비 목록 조회
 	const equipmentSelectList = () => {
 		console.log('equipmentSelectList Function Run');
 		fetch("/equipment/equipmentSelectList.json", {

 		});
 	}
 
+	// 장비 등록 모달창 열기
+	const equipmentInsertModalOpen = () => {
+		setEquipmentInsertModal(true);
+	};
+	// 장비 등록 모달창 닫기
+	const equipmentInsertModalClose = () => {
+		// 장비 초기화
+		setEquipment(equipment_);
+		setEquipmentInsertModal(false);
+	};
+
 	// 장비 임시 데이터
 	const equipmentChange = (e) => {
-		console.log('equipmentChange: ', e.target.name, e.target.value);
+		// console.log('equipmentChange: ', e.target.name, e.target.value);
 
 		// 원본 데이터 복사 및 수정
 		let data = {};

 				return;
 			}
 		}
+		
+		// 시리얼 넘버 중복검사
+		for(let i = 0; i < equipmentList.length; i++) {
+			if(equipment["equipment_serial_number"] == equipmentList[i]["equipment_serial_number"]) {
+				alert('이미 등록된 시리얼 넘버입니다.');
+				return;
+			}
+		}
 
 		fetch("/equipment/equipmentInsert.json", {
 			method: "POST",

 			alert('등록에 실패했습니다.');
 		});
 	}
+
+	// 장비 상세 조회 모달창 열기
+	const equipmentOneModalOpen = (item) => {
+		setEquipment(item);
+		setEquipmentOneModal(true);
+	};
+	// 장비 상세 조회 모달창 닫기
+	const equipmentOneModalClose = () => {
+		// 장비 초기화
+		setEquipment(equipment_);
+		setEquipmentOneModal(false);
+	};
+
+	// 장비 수정
+	const equipmentUpdate = () => {
+		console.log('equipmentUpdate Function Run');
+
+		// 유효성 검사
+		for(let i = 0; i < equipmentInsertHead.length; i++) {
+			if(equipment[equipmentInsertKey[i]] == null) {
+				alert(equipmentInsertHead[i] +'를 선택해 주세요');
+				return;
+			}
+		}
+
+		fetch("/equipment/equipmentUpdate.json", {
+			method: "POST",
+			headers: {
+				'Content-Type': 'application/json; charset=UTF-8'
+			},
+			body: JSON.stringify(equipment),
+		}).then((response) => response.json()).then((data) => {
+			console.log('equipmentUpdate response : ', data);
+			// 장비 목록 조회
+			equipmentSelectList();
+			// 장비 초기화
+			setEquipment(equipment_);
+			// 모달창 닫기
+			setEquipmentOneModal(false);
+
+			alert('수정이 완료됐습니다.');
+		}).catch((error) => {
+			console.log('equipmentUpdate error : ', error);
+			alert('수정에 실패했습니다.');
+		});
+	}
+
+	// 장비 삭제
+	const equipmentDelete = () => {
+		console.log('equipmentDelete Function Run');
+
+		// 삭제 확인 팝업
+		if (confirm('정말 삭제하시겠습니까?') == false) {
+			return;
+		}
+
+		fetch("/equipment/equipmentDelete.json", {
+			method: "POST",
+			headers: {
+				'Content-Type': 'application/json; charset=UTF-8'
+			},
+			body: JSON.stringify(equipment),
+		}).then((response) => response.json()).then((data) => {
+			console.log('equipmentDelete response : ', data);
+			// 장비 목록 조회
+			equipmentSelectList();
+			// 장비 초기화
+			setEquipment(equipment_);
+			// 모달창 닫기
+			setEquipmentOneModal(false);
+
+			alert('삭제가 완료됐습니다.');
+		}).catch((error) => {
+			console.log('equipmentDelete error : ', error);
+			alert('삭제에 실패했습니다.');
+		});
+	}
+
 
 	// 장비 등록 th
 	const equipmentInsertHead = [

 		"입고 일자",
 		"상태",
 		"보유 기관",
-		"시행기관 관리",
+		"기관 관리",
 	];
 	const key1 = [
 		"equipment_name",

 			title: "전체 장비" + "(" + equipmentList.length + ")",
 			description: (
 				<div>
-					<div className="flex">
+					<div className="flex equip-tab">
 						<SubTitle explanation={"장비 클릭 시 지난 매칭이력을 확인할 수 있습니다."} />
 						<div className="btn-wrap flex-end margin-bottom ">
 							<Button

 							{equipmentList.length > 0
 								? equipmentList.map((item, index) => {
 									return (
-										<tr key={index}>
+										<tr key={index} onClick={() => equipmentOneModalOpen(item)}>
 											<td>{equipmentList.length - index}</td>
 											{key1.map((kes) => {
 												if(kes == "equipment_state") {

 												}
 												return <td>{item[kes]}</td>
 											})}
-											<td>
+											<td onClick={(e) => e.stopPropagation()}>
 												{
 													item['senior_id'] == null
 														? <Button

 															onClick={seniorMatchDelete}
 														/>
 												}
+												<Button
+													className={"btn-small gray-btn"}
+													btnName={"삭제"}
+													onClick={() => seniorMatchInsertModalOpen(item)}
+												/>
 											</td>
 										</tr>
 									);

 			title: "전체 장비(시행기관)" + "(" + agencyEquipmentList.length + ")",
 			description: (
 				<div>
-					<div className="flex">
+					<div className="flex equip-tab">
 						<SubTitle explanation={"장비 클릭 시 지난 매칭이력을 확인할 수 있습니다."} />
 						<div className="btn-wrap flex-end margin-bottom ">
 							<Button

 			title: "대상자 장비(시행기관)" + "(" + agencySeniorEquipmentList.length + ")",
 			description: (
 				<div>
-					<div className="flex">
+					<div className="flex equip-tab">
 						<SubTitle explanation={"장비 클릭 시 지난 매칭이력을 확인할 수 있습니다."} />
 					</div>
 					<table class="caregiver-user">

 			title: "재고 장비(시행기관)" + "(" + agencyStockEquipmentList.length + ")",
 			description: (
 				<div>
-					<div className="flex">
+					<div className="flex equip-tab">
 						<SubTitle explanation={"장비 클릭 시 지난 매칭이력을 확인할 수 있습니다."} />
 					</div>
 					<table class="caregiver-user">

 							className={"btn-small gray-btn"}
 							btnName={"저장"}
 							onClick={equipmentInsert}
+						/>
+					</div>
+				</div>
+			</Modal>
+
+			<Modal open={equipmentOneModal} close={equipmentOneModalClose} header="장비 상세 조회">
+				<div className="board-wrap">
+					<div>
+						<table className="flex70 margin-bottom">
+							<tbody className="equipment-insert">
+								<tr>
+									<th>종류</th>
+									<td colSpan={5}>
+										<select value={equipment['equipment_type']} name="equipment_type" onChange={equipmentChange}>
+											<option value="" selected disabled>선택</option>
+											<option value="DIGITAL_MEDIBOX">디지털 약상자</option>
+											<option value="ECG" disabled>심전도계</option>
+											<option value="SPHYGMOMANOMETER" disabled>혈압계</option>
+										</select>
+									</td>
+								</tr>
+								<tr>
+									<th>모델 명</th>
+									<td colSpan={5}>
+										<input type="text" value={equipment['equipment_name']} id="equipmentName" name="equipment_name" placeholder="모델 명을 입력해 주세요" onChange={equipmentChange}></input>
+										{/* {smartMediBoxNameList.map((item) => {
+											return (
+												<span>
+													<input type="radio" id={item} name="equipment_name" value={item}></input>
+													<label for={item}>{item}</label>
+												</span>
+											)
+										})} */}
+									</td>
+								</tr>
+								<tr>
+									<th>시리얼 넘버</th>
+									<td colSpan={5}>
+										<input type="text" value={equipment['equipment_serial_number']} name="equipment_serial_number" placeholder="S/N을 입력해 주세요" disabled onChange={equipmentChange}/>
+									</td>
+								</tr>
+								<tr>
+									<th>생산 일자</th>
+									<td colSpan={5}>
+										<input type="date" value={equipment['equipment_product_date']} name="equipment_product_date" onChange={equipmentChange}/>
+									</td>
+								</tr>
+								<tr>
+									<th>입고 일자</th>
+									<td colSpan={5}>
+										<input type="date" value={equipment['equipment_stock_date']} name="equipment_stock_date" onChange={equipmentChange}/>
+									</td>
+								</tr>
+							</tbody>
+						</table>
+
+						<table className={"caregiver-user"}>
+							<thead>
+								<tr>
+									{thead66.map((i) => {
+										return <th>{i}</th>;
+									})}
+								</tr>
+							</thead>
+							<tbody>
+								{seniorMatchListByEquipment.length > 0
+									? seniorMatchListByEquipment.map((item, index) => {
+										return (
+											<tr>
+												{key66.map((kes) => {
+													return <td>{item[kes]}</td>
+												})}
+											</tr>
+										);
+									})
+									: <td colSpan={4}>조회된 데이터가 없습니다.</td>
+								}
+							</tbody>
+						</table>
+					</div>
+					<div justify-content="center">
+						<Button
+							className={"btn-small gray-btn"}
+							btnName={"수정"}
+							onClick={equipmentUpdate}
+						/>
+						<Button
+							className={"btn-small gray-btn"}
+							btnName={"삭제"}
+							onClick={equipmentDelete}
+						/>
+						<Button
+							className={"btn-small gray-btn"}
+							btnName={"닫기"}
+							onClick={equipmentOneModalClose}
 						/>
 					</div>
 				</div>

 				</div>
 			</Modal>
 
-			<Modal open={agencyEquipmentOneModal} close={agencyEquipmentOneModalClose} header="장비 상세 조회">
+			<Modal open={agencyEquipmentOneModal} close={agencyEquipmentOneModalClose} header="대상자 장비 상세 조회">
 				<div className="board-wrap">
 					<div>
 						<table className={"caregiver-user"}>

 					))}
 				</ul>
 				<div className="content-wrap">
-					<div className="search-management flex-end margin-bottom2">
-						<select name="management-agency">
-							<option value="기관전체">기관전체</option>
-							<option value="대구보훈병원">복지재단1</option>
-							<option value="군위군청">복지재단2</option>
-							<option value="군위군청">복지재단3</option>
-						</select>
+					<div className="search-management flex-end margin-bottom2">						
 						<select>
-							<option value="이름">이름</option>
-							<option value="아이디">아이디</option>
+							<option value="기관명">기관명</option>
+							<option value="시리얼넘버">시리얼넘버</option>
 						</select>
 						<input type="text" />
 						<Button

1496b44

773c475

client/views/pages/healthcare/Healthcare.jsx

--- client/views/pages/healthcare/Healthcare.jsx

+++ client/views/pages/healthcare/Healthcare.jsx


 
     return (
         <main>
-            <ContentTitle contentTitle={"건강 관리"} explanation={"대상자의 복약/댁내온도/방문 관리를 할 수 있습니다."} />
             <div className="content-wrap">
-
+            <DetailTitle contentTitle={"대상자의 복약 / 댁내온도 / 방문 관리를 할 수 있습니다."} />
                 <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>
+                            <div className="tab-container" style={{ marginTop: "5rem", }}>                                
                                 <ul className="tab-menu flex-end">
                                     {data.map((item) => (
                                         <li

                                     ))}
                                 </ul>
                                 <div className="content-wrap userlist">
-                                    <DetailTitle contentTitle={`${tapName}`} />
+                                    
                                     <div className="search-management flex-start margin-bottom2">
                                         <DetailSearch />
                                     </div>

1496b44

773c475

client/views/pages/healthcare/Medicalcare.jsx

--- client/views/pages/healthcare/Medicalcare.jsx

+++ client/views/pages/healthcare/Medicalcare.jsx


 
     return (
         <main>
-
-            <ContentTitle contentTitle={"진료 관리"} explanation={"대상자의 문진표/심전도/혈압 관리를 할 수 있습니다."} />
             <div className="content-wrap">
+            <DetailTitle contentTitle={"대상자의 문진표 / 심전도 / 혈압 관리를 할 수 있습니다."} />
                 <Modal_Questionnaire open={modalOpen} close={closeModal} />
                 <Modal_MedicalHistory open={modalOpen2} close={closeModal2} />
                 <Modal_ECG open={modalOpen3} close={closeModal3} />

                 >
                     <div className="right" style={{ height: "100%", }}>
                         <div style={{ height: "100%" }}>
-                            <div className="tab-container">
+                            <div className="tab-container" style={{ marginTop: "5rem", }}>
                                 <ul className="tab-menu flex-end">
                                     {data.map((item) => (
                                         <li

                                         </li>
                                     ))}
                                 </ul>
-                                <div className="content-wrap userlist">
-                                    <DetailTitle contentTitle={`${tapName}`} />
+                                <div className="content-wrap userlist">                                    
                                     <div className="search-management flex-start margin-bottom2">
                                         <DetailSearch />
                                     </div>

1496b44

773c475

client/views/pages/healthcare/statistics/GuardianStatistics.jsx

--- client/views/pages/healthcare/statistics/GuardianStatistics.jsx

+++ client/views/pages/healthcare/statistics/GuardianStatistics.jsx


 import Chart1 from "../../../component/chart/Chart1.jsx";
 import LineColor from "../../../component/chart/LineColor.jsx";
 import ContentTitle from "../../../component/ContentTitle.jsx";
+import battery from '../../../../resources/files/images/battery.png';
+import temperature from '../../../../resources/files/images/temperature.png';
+import medicine from '../../../../resources/files/images/medicine.png';
+import calendarBig from '../../../../resources/files/images/calendarBig.png';
 
 export default function GuardianStatistics() {
 

   return (
     <>
       <main>
-        <ContentTitle contentTitle={"그래프로 한눈에 보기"} />
         <div className="statistics-grid">
           <ul className="content-box statistics-guardian">
             <li className="flex-start">
-              <p><AssignmentTurnedInIcon sx={{ width: "5rem", height: "5rem", color: "#bf0629", borderRadius: "50px" }} /></p>
+              <p><img className="guardian-img" src={calendarBig} alt="" /></p>
               <p>방문 그래프</p>
               <p>이번달 보호사님이 방문한 횟수는 총 4회 입니다.</p>
             </li>

           </ul>
           <ul className="content-box statistics-guardian">
             <li className="flex-start">
-              <p><MedicationIcon sx={{ width: "5rem", height: "5rem", color: "#0dd390", borderRadius: "50px" }} /></p>
+              <p><img className="guardian-img" src={medicine} alt="" /></p>
               <p>복약 체크</p>
               <p>약을 잘 복용하고 계신지 체크해주세요</p>
             </li>

           </ul>
           <ul className="content-box statistics-guardian">
             <li className="flex-start">
-              <p><DeviceThermostatIcon sx={{ width: "5rem", height: "5rem", color: "#f1de05", borderRadius: "50px" }} /></p>
+              <p><img className="guardian-img" src={temperature} alt="" /></p>
               <p>온도 체크</p>
               <p>댁내 온도가 적절한지 체크해보세요.</p>
             </li>

           </ul>
           <ul className="content-box statistics-guardian">
             <li className="flex-start">
-              <p><BatteryCharging20Icon sx={{ width: "5rem", height: "5rem", color: "#5f9af3", borderRadius: "50px" }} /></p>
+              <p><img className="guardian-img" src={battery} alt="" /></p>
               <p>약상자 배터리 그래프</p>
               <p>배터리 평균</p>
             </li>

1496b44

773c475

client/views/pages/main/Main_government.jsx

--- client/views/pages/main/Main_government.jsx

+++ client/views/pages/main/Main_government.jsx


             <p>400</p>
           </li>
         </ul>
-        <div className="content-box combine-all-government combine-bottom-government2">
-        <div className="flex">
-            <Title title={`${cityName} 월별 방문 횟수`} explanation={"최근 6개월간 방문 횟수의 변화를 확인할 수 있습니다."} />
-            <AddCircleIcon sx={{ fontSize: 20, color: "#1976d2" }} />
-          </div>
-          <RowChart_govern />
-        </div>
         <div className="content-box combine-left-government combine-bottom-government2 main-main">
           <div className="flex">
             <Title title={"지역별 케어 대상자 분포 현황"} explanation={"지역 선택 시 해당 지역의 대상자리스트가 보여집니다."} />
-            <AddCircleIcon sx={{ fontSize: 20, color: "#1976d2" }} />
           </div>
           <Map setCityName={setCityName} />
         </div>
+        <div className="content-box combine-all-government combine-bottom-government2">
+        <div className="flex">
+            <Title title={`${cityName} 월별 방문 횟수`} explanation={"최근 6개월간 방문 횟수의 변화를 확인할 수 있습니다."} />
+          </div>
+          <RowChart_govern />
+        </div>        
         <div className="content-box combine-left-government2">
           <div className="flex">
             <Title title={`${cityName} 복용률 평균`} explanation={"해당 지역의 대상자 복용률이 그래프로 보여집니다."} />
-            <AddCircleIcon sx={{ fontSize: 20, color: "#1976d2" }} />
           </div>
           <Chart2_govern />
         </div>
         <div className="content-box combine-right-government2">
         <div className="flex">
             <Title title={`기관별 대상자 등록 현황`} explanation={"약상자 사용자의 데이터 차트가 보여집니다."} />
-            <AddCircleIcon sx={{ fontSize: 20, color: "#1976d2" }} />
           </div>
           <Chart5 />         
         </div>
         <div className="content-box combine-right-government">
           <div className="flex">
             <Title title={`기관별 약상자 사용 현황`} explanation={""} />
-            <AddCircleIcon sx={{ fontSize: 20, color: "#1976d2" }} />
           </div>
           <Donut1_govern />
         </div>        

1496b44

773c475

client/views/pages/main/Main_guardian.jsx

--- client/views/pages/main/Main_guardian.jsx

+++ client/views/pages/main/Main_guardian.jsx


 
 export default function Main_guardian() {
   const tableHead1 = ["", "", "", "", "", ""];
-  const Key1 = ["morning", "morning2", "lunch","lunch2", "dinner","dinner2"];
+  const Key1 = ["morning", "morning2", "lunch", "lunch2", "dinner", "dinner2"];
   const content1 = [
     {
       morning: "아침",
-      morning2:(
-        <CheckCircleOutlineIcon sx={{ width: "3rem", height: "3rem", color: "#067943", borderRadius: "50px" }}/> 
+      morning2: (
+        <CheckCircleOutlineIcon sx={{ width: "3rem", height: "3rem", color: "#067943", borderRadius: "50px" }} />
       ),
       lunch: "점심",
       lunch2: (
-        <CheckCircleOutlineIcon sx={{ width: "3rem", height: "3rem", color: "#067943", borderRadius: "50px" }}/> 
+        <CheckCircleOutlineIcon sx={{ width: "3rem", height: "3rem", color: "#067943", borderRadius: "50px" }} />
       ),
       dinner: "저녁",
       dinner2: (
-        <CheckCircleOutlineIcon sx={{ width: "3rem", height: "3rem", color: "#067943", borderRadius: "50px" }}/> 
+        <CheckCircleOutlineIcon sx={{ width: "3rem", height: "3rem", color: "#067943", borderRadius: "50px" }} />
       ),
     }
   ];
   const tableHead2 = ["", "", "", "", "", ""];
-  const Key2 = ["morning", "morning2", "lunch","lunch2", "dinner","dinner2"];
+  const Key2 = ["morning", "morning2", "lunch", "lunch2", "dinner", "dinner2"];
   const content2 = [
     {
       morning: "아침",
-      morning2:(
-        <ClearIcon sx={{ width: "3rem", height: "3rem", color: "#bf0629", borderRadius: "50px" }}/> 
+      morning2: (
+        <ClearIcon sx={{ width: "3rem", height: "3rem", color: "#bf0629", borderRadius: "50px" }} />
       ),
       lunch: "점심",
       lunch2: (
-        <ClearIcon sx={{ width: "3rem", height: "3rem", color: "#bf0629", borderRadius: "50px" }}/> 
+        <ClearIcon sx={{ width: "3rem", height: "3rem", color: "#bf0629", borderRadius: "50px" }} />
       ),
       dinner: "저녁",
       dinner2: (
-        <ClearIcon sx={{ width: "3rem", height: "3rem", color: "#bf0629", borderRadius: "50px" }}/> 
+        <ClearIcon sx={{ width: "3rem", height: "3rem", color: "#bf0629", borderRadius: "50px" }} />
       ),
     }
   ];
   const tableHead3 = ["월", "화", "수", "목", "금", "토", "일"];
-  const Key3 = ["mon", "tue", "wed","thu", "fri","sat","sun"];
+  const Key3 = ["mon", "tue", "wed", "thu", "fri", "sat", "sun"];
   const content3 = [
     {
       mon: "24°C",

       <main>
         <div className="flex-start main-guardian"><img src={Senior} alt="" /><Title title={"김복남 어르신"} explanation={"방문, 복약, 온도, 배터리 현황을 확인하세요."} /></div>
         <div className="main-grid-guardian">
-          <div className=" statistics-guardian combine-left2 combine-middle-government">
-          <div className="flex-start margin-bottom2"><img src={calendarBig} alt="" /><TitleSmall title={"방문체크"} /></div>
-            <ul >         
-              <li>
-              <Calendar />
-              </li>     
-            </ul>
-          </div>
-          <div className=" statistics-guardian combine-right3">
-          <div className="flex-start margin-bottom2"><img src={temperature} alt="" /><TitleSmall title={"온도체크"} explanation={"댁내 온도가 적절한지 체크해보세요."}/></div>
-            <ul >
-              <li>
-                <DateMonth />
-                <Chart6 />
-              </li>   
-            </ul>
-          </div>
-          
-          <div className="statistics-guardian combine-right3">
-          <div className="flex-start margin-bottom2"><img src={medicine} alt="" /><TitleSmall title={"복약체크"} explanation={"약을 잘 복용하고 계신지 체크해주세요."}/></div>
-            <ul className="">
-              <li className="guardian-medicine">
-                <DateDay />
-                <ul className="flex">
-                  <li>
-                    <img src={mornon} alt="" className="show"/>
-                    <img src={mornoff} alt="" />
-                  </li>
-                  <li>
-                    <img src={lunchon} alt="" />
-                    <img src={lunchoff} alt="" className="show"/>
-                  </li>
-                  <li>
-                    <img src={dinneron} alt="" />
-                    <img src={dinneroff} alt="" className="show"/>
-                  </li>
-                </ul>
-              </li>
-            </ul>
-          </div>
           <div className="combine-left combine-all-government battery-wrap ">
-            <div className="battery flex-start"><img src={battery} alt="" /><p>현재 스마트 약상자의 배터리가 <em className="red">40</em>% 입니다.</p><p className="red">※충전이 필요합니다.</p></div> 
-            <div className="battery-img"> 
+            <div className="battery flex-start"><img className="guardian-img" src={battery} alt="" /><p>현재 스마트 약상자의 배터리가 <em className="red">40</em>% 입니다.</p><p className="red">※충전이 필요합니다.</p></div>
+            <div className="battery-img">
               {/* 0%일때 */}
-              <img src={zeropercent} alt="" /> 
+              <img src={zeropercent} alt="" />
               {/* 0~20%일때 */}
               <img src={twentypercent} alt="" />
               {/* 20~40%일때 */}
-              <img src={fortypercent} alt="" className="show"/>
+              <img src={fortypercent} alt="" className="show" />
               {/* 40~60%일때 */}
               <img src={sixtytypercent} alt="" />
               {/* 60~80% 일때 */}

             </div>
 
           </div>
+          <div className="statistics-guardian combine-right3">
+            <div className="flex-start margin-bottom2"><img className="guardian-img" src={medicine} alt="" /><TitleSmall title={"복약체크"} explanation={"약을 잘 복용하고 계신지 체크해주세요."} /></div>
+            <ul className="">
+              <li className="guardian-medicine">
+                <DateDay />
+                <ul className="flex">
+                  <li>
+                    <img src={mornon} alt="" className="show" />
+                    <img src={mornoff} alt="" />
+                    <p className="medicine-title">아침</p>
+                  </li>
+                  <li>
+                    <img src={lunchon} alt="" />
+                    <img src={lunchoff} alt="" className="show" />
+                    <p className="medicine-title">점심</p>
+                  </li>
+                  <li>
+                    <img src={dinneron} alt="" />
+                    <img src={dinneroff} alt="" className="show" />
+                    <p className="medicine-title">저녁</p>
+                  </li>
+                </ul>
+              </li>
+            </ul>
+          </div>
+          <div className=" statistics-guardian combine-right3">
+            <div className="flex-start margin-bottom2"><img className="guardian-img" src={temperature} alt="" /><TitleSmall title={"온도체크"} explanation={"댁내 온도가 적절한지 체크해보세요."} /></div>
+            <ul >
+              <li>
+                <DateMonth />
+                <Chart6 />
+              </li>
+            </ul>
+          </div>
+          <div className=" statistics-guardian combine-left2 combine-middle-government">
+            <div className="flex-start margin-bottom2"><img className="guardian-img" src={calendarBig} alt="" /><TitleSmall title={"방문체크"} /></div>
+            <ul >
+              <li>
+                <Calendar />
+              </li>
+            </ul>
+          </div> 
         </div>
       </main>
     </>

1496b44

773c475

client/views/pages/user_management/UserAuthoriySelect.jsx

--- client/views/pages/user_management/UserAuthoriySelect.jsx

+++ client/views/pages/user_management/UserAuthoriySelect.jsx


       <div className="content-wrap">
         
         <div
-          className="flex-align-start"
+          className="flex-align-start userauthoriylist"
           style={{ height: "calc(100% - 61px)" }}
         >
-          <div className="left" style={{ height: "100%", width:"27%" }}>
+          <div className="left" style={{ height: "100%", }}>
             <div style={{ height: "100%" }}>
               <SubTitle
                 subtitle={"관리기관 리스트"}

                 <Category />
             </div>
           </div>
-          <div className="right" style={{ height: "100%", width:"70%" }}>
+          <div className="right" style={{ height: "100%", }}>
             <div style={{ height: "100%" }}>
               <SubTitle
                 subtitle={`${agencyName} 사용자 리스트`}

                 className="margin-bottom"
               />
               <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

1496b44

773c475

client/views/pages/user_management/UserAuthoriySelect_agency.jsx

--- client/views/pages/user_management/UserAuthoriySelect_agency.jsx

+++ client/views/pages/user_management/UserAuthoriySelect_agency.jsx


               <option value="이름">이름</option>
               <option value="아이디">아이디</option>
             </select>
-            <input type="text" />
+            <input type="text" className="senior-search"/>
             <Button
               className={"btn-small gray-btn"}
               btnName={"검색"}

1496b44

773c475

server/modules/web/Server.js

--- server/modules/web/Server.js

+++ server/modules/web/Server.js


 webServer.get('*', function (request, response, next) {
     response.sendFile(`${BASE_DIR}/client/views/index.html`);
 })
+
 /**
 + * @author : 방선주
 + * @since : 2023.02.14
 + * @dscription : REST API 서버에 데이터 요청 보내기(Proxy)
 + */
-+webServer.use('*.json', expressProxy(API_SERVER_HOST, {
-        proxyReqPathResolver: function (request) {
-            //console.log('request : ', request.url, request.params[0]);
-            return `${request.params['0']}.json`;
-        }
-    }));
+webServer.use('*.json', expressProxy(API_SERVER_HOST, {
+    proxyReqPathResolver: function (request) {
+        //console.log('request : ', request.url, request.params[0]);
+        return `${request.params['0']}.json`;
+    }
+}));
+    
 /**
  * @author : 최정우
  * @since : 2022.09.21

Add a comment

Open 0
Closed 0

List

...	...	@@ -304,10 +304,10 @@
304	304	<div className="content-wrap">
305	305
306	306	<div
307		- className="flex-align-start"
	307	+ className="flex-align-start userauthoriylist"
308	308	style={{ height: "calc(100% - 61px)" }}
309	309	>
310		- <div className="left" style={{ height: "100%", width:"27%" }}>
	310	+ <div className="left" style={{ height: "100%", }}>
311	311	<div style={{ height: "100%" }}>
312	312	<SubTitle
313	313	subtitle={"관리기관 리스트"}
...	...	@@ -317,7 +317,7 @@
317	317	<Category />
318	318	</div>
319	319	</div>
320		- <div className="right" style={{ height: "100%", width:"70%" }}>
	320	+ <div className="right" style={{ height: "100%", }}>
321	321	<div style={{ height: "100%" }}>
322	322	<SubTitle
323	323	subtitle={`${agencyName} 사용자 리스트`}
...	...	@@ -325,22 +325,6 @@
325	325	className="margin-bottom"
326	326	/>
327	327	<div className="tab-container">
328		- <ul className="tab-menu-mobile">
329		- <div>
330		- <SubTitle
331		- className="margin-bottom"
332		- subtitle={"사용자 선택"}
333		- explanation={"사용자 별로 선택 후 관리할 수 있습니다. "}
334		- />
335		- </div>
336		- <select name="" id="" style={{ width: "100%" }}>
337		- <option value="사용자선택">보호자</option>
338		- <option value="사용자선택">보호사</option>
339		- <option value="사용자선택">병원</option>
340		- <option value="사용자선택">지자체</option>
341		- <option value="사용자선택">관리자</option>
342		- </select>
343		- </ul>
344	328	<ul className="tab-menu flex-end">
345	329	{data.map((item) => (
346	330	<li

...	...	@@ -340,7 +340,7 @@
340	340	<option value="이름">이름</option>
341	341	<option value="아이디">아이디</option>
342	342	</select>
343		- <input type="text" />
	343	+ <input type="text" className="senior-search"/>
344	344	<Button
345	345	className={"btn-small gray-btn"}
346	346	btnName={"검색"}

...	...	@@ -2,7 +2,8 @@
2	2	/* layout 공통 */
3	3	textarea{border: 1px solid #d8d3c7; border-radius: 5px;}
4	4	em{font-style: normal;}
5		-main img{margin-right: 1rem;}
	5	+main img{margin-right: 1rem; max-width: 100%;
	6	+ width: unset;}
6	7	/* grid */
7	8
8	9	.main-grid-admin {
...	...	@@ -28,7 +29,6 @@
28	29	gap: 1rem;
29	30	}
30	31	.main-grid-agency {
31		- height: 100%;
32	32	display: grid;
33	33	grid-template-columns: 1fr 1fr 1fr 1fr;
34	34	grid-template-rows: 0.1fr;
...	...	@@ -227,7 +227,6 @@
227	227	.flex100 {
228	228	flex: 0 0 100%;
229	229	}
230		-
231	230	/* width 공통 */
232	231	.width100 {
233	232	width: 100%;

...	...	@@ -16,9 +16,6 @@
16	16	grid-template-columns: 315px 1fr;
17	17	grid-template-rows: 0.1fr 2.9fr;
18	18	}
19		-#layout.expander{
20		- grid-template-columns: 50px 1fr;
21		-}
22	19	header {
23	20	padding: 1rem 3rem;
24	21	background-color: white;
...	...	@@ -28,17 +25,18 @@
28	25	width: 100%;
29	26	}
30	27
31		-.page-title span {
32		- font-size: 1.8rem;
	28	+.page-title-span {
	29	+ font-size: 2.5rem;
33	30	font-weight: bold;
34		- margin-left: 1rem;
35	31	}
36	32
37	33	nav{
38	34	height: 100%;
	35	+ width: 310px;
39	36	background-color: #f2f0eb;
40	37	grid-area: nav;
41		- position: relative;
	38	+ position: fixed;
	39	+ z-index: 10;
42	40	background: #ffffff;
43	41	box-shadow: 1px 0px 6px 2px rgb(0 0 0 / 20%);
44	42	}
...	...	@@ -131,7 +129,6 @@
131	129	.logout{background: #f26e50;}
132	130	#pages {
133	131	max-width: 100%;
134		- height: 100%;
135	132	padding: 3rem;
136	133	background-color: #f4f4f2;
137	134	grid-area: main;
...	...	@@ -141,6 +138,7 @@
141	138
142	139	main {
143	140	max-width: 100%;
	141	+ height: 100%;
144	142	}
145	143
146	144	.content-wrap {
...	...	@@ -151,7 +149,6 @@
151	149	.userlist{
152	150	box-shadow: 1px 1px 5px 1px rgb(0 0 0 / 20%);
153	151	width: 100%;
154		- height: 51rem;
155	152	padding: 4.5rem 2rem;
156	153	}
157	154
...	...	@@ -237,7 +234,7 @@
237	234	}
238	235	.hierarchy-menu ul a {
239	236	display: block;
240		- padding: 6px 5rem;
	237	+ padding: 6px 0 0 5rem;
241	238	height: 44px;
242	239	position: relative;
243	240	color: #333333;

...	...	@@ -1,9 +1,4 @@
1	1	/* 공통 */
2		-.logo {
3		- font-size: 2.4rem;
4		- font-family: 'AuctionGothic_Medium';
5		-}
6		-
7	2	header>div {
8	3	height: 100%;
9	4	}
...	...	@@ -20,14 +15,13 @@
20	15	.menuicon {
21	16	display: none;
22	17	cursor: pointer;
23		- height: 9.4rem;
24		- left: 2.5rem;
	18	+ left: 1.5rem;
25	19	top: 2.6rem;
26	20	position: absolute;
27	21	}
28	22
29	23	/* 시행기관 장비관리 리스트 */
30		-
	24	+.react-calendar__month-view__days__day--neighboringMonth{display: none;}
31	25	.visitlist {
32	26	height: 55vh;
33	27	}
...	...	@@ -66,12 +60,13 @@
66	60	}
67	61
68	62	.question-select label {
69		- width: 10%;
	63	+ margin-right: 1rem;
70	64	}
71	65
72	66	.question-select select {
73	67	width: 16%;
74	68	height: 3.7rem;
	69	+ margin-right: 1rem;
75	70	}
76	71
77	72	.qna-insert select {
...	...	@@ -139,7 +134,7 @@
139	134
140	135
141	136	/* -----------------------------------------------지자체 */
142		-
	137	+.statistics-agency #RowChart>div{height: 36rem;}
143	138
144	139	.map {
145	140	width: 100%;
...	...	@@ -277,12 +272,13 @@
277	272	color: #cbc9c9;
278	273	}
279	274
280		-.statistics-guardian {
281		- height: 100%;
	275	+.statistics-grid .statistics-guardian {
	276	+ height: 41vh;
282	277	}
283		-
	278	+.statistics-grid .statistics-guardian li:nth-child(1) p:nth-child(2){font-size: 2rem; font-weight: bold; margin-right: 1rem;}
	279	+.statistics-grid .statistics-guardian li:nth-child(1) p:nth-child(3){font-size: 1.6rem; }
284	280	.guardian-medicine {
285		- height: 16vh;
	281	+ height: 17vh;
286	282	}
287	283
288	284	.statistics-guardian li {
...	...	@@ -291,52 +287,17 @@
291	287	border-radius: 20px;
292	288	margin: 0 auto;
293	289	margin-bottom: 1rem;
	290	+ position: relative;
294	291	}
295		-
296		-/* .statistics-guardian:nth-child(1) {
297		- background: #fbe4e4;
298		-}
299		-
300		-.statistics-guardian:nth-child(2) {
301		- background: #edf7df;
302		-}
303		-
304		-.statistics-guardian:nth-child(3) {
305		- background: #f9f7e0;
306		-}
307		-
308		-.statistics-guardian:nth-child(4) {
309		- background: #e9e7fe;
310		-}
311		-.statistics-guardian li p{
312		- padding: 0 2rem;
313		-} */
314		-.statistics-guardian li:nth-child(2),
315		-.statistics-guardian li:nth-child(3),
316		-.statistics-guardian li:nth-child(4),
317		-.statistics-guardian li:nth-child(5),
318		-.statistics-guardian li:nth-child(6),
319		-.statistics-guardian li:nth-child(7) {
320		- background: rgba(255, 254, 254, 0.5);
321		-}
322		-
323		-.chart-guardian {
324		- height: 77%;
325		-}
326		-
327		-.statistics-guardian li p:nth-child(3) {
328		- font-size: 1.5rem;
329		-}
330		-
331		-.statistics-guardian li p:nth-of-type(1) {
332		- position: inherit;
333		- font-size: 1.5rem;
	292	+.medicine-title{
	293	+ position: absolute;
	294	+ right: -13px;
	295	+ top: 78px;
334	296	font-weight: bold;
	297	+ font-size: 1.5rem;
335	298	}
336		-
337		-.statistics-guardian li p:nth-of-type(2) {
338		- padding: 0;
339		- font-size: 2rem;
	299	+.chart-guardian {
	300	+ height: 70%;
340	301	}
341	302
342	303	.guardian-table {
...	...	@@ -468,6 +429,8 @@
468	429	display: none;
469	430	box-shadow: 1px 1px 14px 1px rgba(0, 0, 0, 0.15);
470	431	border-radius: 20px;
	432	+ max-width: 100%;
	433	+ width: unset;
471	434	}
472	435
473	436	.battery-img img.show {
...	...	@@ -779,11 +742,6 @@
779	742	.detail-search table td {
780	743	border-top: none;
781	744	}
782		-
783		-.detail-search tbody tr:nth-of-type(2) select {
784		- width: 24.4%;
785		-}
786		-
787	745	.detail-search tbody select {
788	746	height: 3.7rem;
789	747	}
...	...	@@ -1137,6 +1095,9 @@
1137	1095	}
1138	1096
1139	1097	/* 사용자 관리 */
	1098	+.userauthoriylist .left{width: 27%;}
	1099	+ .userauthoriylist .right{width: 70%; }
	1100	+.bSXvtB{display: none;}
1140	1101	.tab-menu .tab-menu-agency {
1141	1102	display: flex;
1142	1103	}
...	...	@@ -1174,12 +1135,13 @@
1174	1135
1175	1136	.search-management select {
1176	1137	width: 15%;
1177		- height: 3rem;
	1138	+ height: 3.6rem;
	1139	+ margin-right: 1rem;
1178	1140	}
1179	1141
1180	1142	.search-management input {
1181	1143	width: 20%;
1182		- height: 3.7rem;
	1144	+ height: 3.6rem;
1183	1145	margin-right: 1rem;
1184	1146	}
1185	1147

...	...	@@ -94,7 +94,6 @@
94	94	select{
95	95	width: 32%;
96	96	border-radius: 0.5rem;
97		- margin-right: 1rem;
98	97	border: 1px solid #d8d3c7;
99	98	}
100	99

...	...	@@ -259,11 +259,6 @@
259	259	}
260	260
261	261	/* 사용자 관리 */
262		- .tab-menu-mobile {
263		- display: block;
264		- padding: 1rem;
265		- background-color: #ffffff;
266		- }
267	262
268	263	.tab-menu {
269	264	display: none;
...	...	@@ -573,31 +568,63 @@
573	568	.usericon {
574	569	display: none;
575	570	}
576		-
	571	+ .ittLqr{font-size: 1.3rem !important;}
577	572	/* 공통 */
578	573	#layout{display: block;}
579		- #pages{padding: 1rem;}
	574	+ #pages{padding: 1rem; padding-top: 12rem; background-color: #ffffff;}
580	575	header {
581	576	padding: 1rem;
582	577	position: fixed;
583	578	}
584	579	nav {
585	580	position: fixed;
586		- left: -310px;
587		- top: 86px;
588		- z-index: 10;
	581	+ left: -320px;
	582	+ top: 87px;
	583	+ z-index: 12;
589	584	transition: 0.5s;
590	585	box-shadow:12px -6px 10px -10px rgb(0 0 0 / 20%);
591	586	height:91vh;
592	587	}
593		- main{padding-top: 9rem;}
594	588	nav.on {
595	589	left: 0;
596	590	transition: 0.5s;
597	591	}
598	592	.bottom-section{padding: 0.9rem ; bottom: 6rem;}
599		- .content-wrap{padding: 1rem;}
	593	+ .content-wrap{padding: 3rem 1rem 0 1rem; }
600	594	th,td,tr{display: block;}
	595	+ .header-info-id,#fullDate, #temp,.cCoJhO{display: none;}
	596	+ /* 에이젼시 메인 */
	597	+ .main-grid-agency{display: block;}
	598	+ .main-grid-agency .agency-visitlist{margin-top: 16rem;}
	599	+ .agency-calendar .react-calendar__month-view__weekdays{display: flex !important;}
	600	+ .agency-calendar .react-calendar__month-view__days__day{flex: 0 0 12.5% !important;}
	601	+ .agency-calendar .react-calendar__month-view__days{flex-wrap: wrap !important;}
	602	+ .tab-menu-agency li{padding: 1rem;}
	603	+ .statistics-agency{margin-bottom: 1rem;}
	604	+ /* 지자체 메인 */
	605	+ .main-grid-government{display: block;}
	606	+ .main-grid-government .content-box:nth-child(8), .main-grid-government .content-box:nth-child(6){height: 30rem;}
	607	+ #RowChart>div{height: 36rem;}
	608	+ .main-grid-government .content-box{margin-bottom: 1rem;}
	609	+ .statistics-govern{margin-bottom: 1rem;}
	610	+ /* 보호자 메인 */
	611	+ .main-grid-guardian{display: block;}
	612	+ .guardian-img{width: 2rem;}
	613	+
	614	+ /* 보호자 그래프보기 */
	615	+ #chartdiv1{height: 26vh !important;}
	616	+ #chartdiv{height: 26vh !important;}
	617	+ #chart{height: 27vh !important;}
	618	+ #Chart2{height: 27vh !important;}
	619	+ .statistics-grid{display: block;}
	620	+ .statistics-grid .statistics-guardian {
	621	+ margin-bottom: 1rem; padding: 0; height: 32vh;
	622	+ }
	623	+ .statistics-grid .statistics-guardian li{padding: 0;}
	624	+ .statistics-grid .statistics-guardian li p:nth-child(1){margin-right: 1rem;}
	625	+ .statistics-grid .statistics-guardian li:nth-child(1) p:nth-child(2){width: 20%;}
	626	+ /* Q&A */
	627	+ .question-select select{width: 22%;}
601	628	/* 권한관리 */
602	629	.authority-table-pc {
603	630	display: none;
...	...	@@ -654,84 +681,39 @@
654	681	}
655	682
656	683	/* 사용자관리 */
657		- .tab-menu-mobile {
658		- display: block;
659		- padding: 1rem;
660		- background-color: #ffffff;
661		- }
662		-
663		- .tab-menu {
664		- display: none;
665		- }
666		-
	684	+ .senior-search{width: 25% !important;}
	685	+ .searchselect label{margin-right: 2rem;}
	686	+ .protector-user{margin-top: 2rem;}
	687	+ .userauthoriylist{display: block;}
	688	+ .userauthoriylist .left, .userauthoriylist .right {
	689	+ width: 100% ;
	690	+}
	691	+.userauthoriylist .right{margin-top: 2rem;}
	692	+.tab-menu {display: block;}
	693	+.tab-menu li{width: 100%;}
	694	+.userlist{padding: 1rem !important;}
667	695	.search-management {
668	696	justify-content: space-between;
669	697	}
670	698
671	699	.search-management select {
672	700	width: 22%;
	701	+ margin: 0;
673	702	}
674	703
675	704	.search-management input {
676		- width: 30%;
677		- margin-right: 1rem;
	705	+ width: 52%;margin: 0;
678	706	}
679	707
680		- .search-management button {
681		- width: 20%;
682		- }
683		-
684		- /* 공통 */
685		-
686		- .header-flex {
687		- display: flex;
688		- justify-content: flex-start;
689		- }
690		-
691		- /* 보호자 메인 그리드 */
692		- .pc {
693		- display: none;
694		- }
695		-
696		- .mobile {
697		- display: block;
698		- }
699		-
700		- .mobile .main-grid-guardian {
701		- gap: 0.5rem;
702		- }
703		-
704		- .mobile .main-grid-guardian .content-box {
705		- padding: 0.5rem;
706		- }
707		-
708		- .mobile .main-grid-guardian .content-box:nth-child(2)>div p {
709		- font-size: 1.8rem;
710		- }
711		-
712		- .mobile .main-grid-guardian .content-box:nth-child(7)>div {
713		- justify-content: flex-start;
714		- }
715		-
716		- .mobile .main-grid-guardian {
717		- grid-template-columns: 1fr;
718		- grid-template-rows: none;
719		- }
720		-
721		- .mobile .main-grid-guardian .combine-right-government,
722		- .mobile .main-grid-guardian .combine-left {
723		- grid-column: 1;
724		- }
725		-
726		- .mobile .main-grid-guardian .combine-bottom-government {
727		- grid-column: 0;
728		- }
	708	+ .searchselect-wrap{display: block;}
	709	+ .searchselect{width: max-content;}
	710	+ .page-title-span{display: block;
	711	+ margin-left: 5rem;}
729	712
730	713	/* button */
731	714
732	715	.btn-large {
733	716	font-size: 1.4rem;
734		- width: 20%;
735	717	}
736	718
737	719	/* 로그인 */
...	...	@@ -765,89 +747,9 @@
765	747	width: 30%;
766	748	}
767	749
768		- /* 메인 */
769		- .temp p {
770		- font-size: 2rem;
771		- }
772		-
773		- .main-battery-title {
774		- font-size: 1.4rem;
775		- justify-content: flex-start;
776		- padding-right: 1rem;
777		- }
778		-
779		- .battery::after {
780		- content: " 남았습니다.";
781		- font-size: 1.4rem;
782		- margin-left: 0;
783		- }
784		-
785		- .battery p {
786		- font-size: 2rem;
787		- padding-left: 0;
788		- padding-right: 1rem;
789		- }
790		-
791		- #chartdiv1 {
792		- height: 25vh;
793		- }
794		-
795		- .statistics li p:nth-of-type(1),
796		- .statistics li p:nth-of-type(2) {
797		- font-size: 1.4rem;
798		- }
799		-
800		- .weather-info {
801		- width: 70%;
802		- }
803		-
804		- .recent-visit {
805		- border: 0;
806		- }
807		-
808		- .recent-visit td {
809		- padding-left: 12rem;
810		- }
811		-
812		- .recent-visit td:nth-of-type(1) {
813		- font-weight: bold;
814		- padding: 0.5rem;
815		- }
816		-
817		- .recent-visit td:nth-of-type(1)::before {
818		- content: "";
819		- }
820		-
821		- .recent-visit td:nth-of-type(2):before {
822		- content: "방문목적";
823		- }
824		-
825		- .recent-visit td:nth-of-type(3):before {
826		- content: "방문 상세 이유";
827		- }
828		-
829	750
830	751	/* 검색창 */
831		-
832		- .mobile-area-wrap {
833		- display: block;
834		- margin-top: 1rem;
835		- }
836		-
837		- .mobile-area-wrap div {
838		- width: 100%;
839		- margin-top: 1rem;
840		- }
841		-
842		- .mobile-area-wrap div label {
843		- width: 30%;
844		- font-size: 1.6rem;
845		- }
846		-
847		- .mobile-area-wrap div select {
848		- width: 70%;
849		- }
850		-
	752	+ .detail-search tbody select{margin-right: 1rem;}
851	753	.area-wrap {
852	754	display: none;
853	755	}
...	...	@@ -1072,7 +974,7 @@
1072	974	}
1073	975
1074	976	/* 장비조회 */
1075		-
	977	+ .equip-tab{display: block;}
1076	978	/* 장비 상세 조회 */
1077	979	/* 장비등록창 */
1078	980	.equipment-modal tbody td {

...	...	@@ -190,8 +190,8 @@
190	190
191	191	return (
192	192	<div className="search-group">
193		- <div className="search-area flex" style={{ width:"50%"}}>
194		- <div className="detail-search" style={{ width:"85%"}}>
	193	+ <div className="search-area flex-start" >
	194	+ <div className="detail-search" >
195	195	<table>
196	196	<tbody>
197	197	<tr>

...	...	@@ -28,7 +28,7 @@
28	28	&::before {
29	29	content: "";
30	30	position: absolute;
31		- z-index: 10;
	31	+ z-index: 5;
32	32	left: 0;
33	33	bottom: -15px;
34	34	height: 8px;

...	...	@@ -151,13 +151,13 @@
151	151
152	152	// Add scrollbar
153	153	// https://www.amcharts.com/docs/v5/charts/xy-chart/scrollbars/
154		- chart.set(
155		- "scrollbarX",
156		- am5.Scrollbar.new(root, {
157		- orientation: "horizontal",
158		- marginBottom: 20,
159		- })
160		- );
	154	+ // chart.set(
	155	+ // "scrollbarX",
	156	+ // am5.Scrollbar.new(root, {
	157	+ // orientation: "horizontal",
	158	+ // marginBottom: 20,
	159	+ // })
	160	+ // );
161	161
162	162	// Make stuff animate on load
163	163	// https://www.amcharts.com/docs/v5/concepts/animations/

...	...	@@ -2,6 +2,7 @@
2	2	import Button from "../../component/Button.jsx";
3	3	import Table from "../../component/Table.jsx";
4	4	import Modal from "../../component/Modal.jsx";
	5	+import DetailTitle from "../../component/DetailTitle.jsx";
5	6	import { useNavigate } from "react-router";
6	7	import ContentTitle from "../../component/ContentTitle.jsx";
7	8	import RestoreFromTrashIcon from '@mui/icons-material/RestoreFromTrash';
...	...	@@ -62,8 +63,8 @@
62	63	return (
63	64	<main>
64	65	<div className="content-wrap">
65		- <ContentTitle contentTitle={"장비 문의 요청"} />
66		- <div className="board-wrap">
	66	+ <DetailTitle contentTitle={"장비 문의 요청"} />
	67	+ <div className="board-wrap" style={{ marginTop: "3rem" }} >
67	68	<div className="btn-wrap flex-end margin-bottom">
68	69
69	70	<Button

...	...	@@ -13,16 +13,16 @@
13	13	const openModal = () => {
14	14	setModalOpen(true);
15	15	};
16		- const closeModal = () => {
	16	+ const closeModal = (isInsertComplete) => {
17	17	setModalOpen(false);
	18	+ if (isInsertComplete == true) {
	19	+ getQnaList();
	20	+ }
18	21	};
19	22
20		- const [qnaList, setQnaList] = React.useState();
	23	+ const [qnaList, setQnaList] = React.useState([]);
21	24
22		- const [state, setState] = React.useState();
23		- const [title, setTitle] = React.useState();
24		- const [username, setUsername] = React.useState();
25		- const [datetime, setDatetime] = React.useState();
	25	+ const [idx, setIdx] = React.useState();
26	26
27	27	//-------- 페이징 작업 설정 시작 --------//
28	28	const limit = 15; // 페이지당 보여줄 공지 개수
...	...	@@ -39,17 +39,15 @@
39	39	},
40	40	body: JSON.stringify({
41	41
42		- qna_state: state,
43		- qna_title: title,
44		- qna_insert_user_id: username,
45		- qna_insert_datetime: datetime,
	42	+ qna_idx: idx,
	43	+
46	44	}),
47	45	})
48	46	.then((response) => response.json())
49	47	.then((data) => {
50	48	console.log(data);
51	49	setQnaList(data);
52		- // setMyQnaTotal(data.length);
	50	+ setMyQnaTotal(data.length);
53	51	})
54	52	.catch((error) => {
55	53	console.log(
...	...	@@ -61,25 +59,8 @@
61	59
62	60	//게시판
63	61	const thead = ["No", "답변상태", "제목", "작성자", "작성일자"];
64		- const key = ["idx", "state", "title", "username", "datetime"];
65		- const content = [
66		- {
67		- No: 1,
68		- answer: "답변완료",
69		- title: (
70		- <div
71		- className="title"
72		- onClick={() => {
73		- navigate("/QuestionConfirm");
74		- }}
75		- >
76		- 담당자 바꿔주세요
77		- </div>
78		- ),
79		- writer: "홍길동",
80		- date: "2023-01-27",
81		- },
82		- ];
	62	+ const key = ["qna_idx", "qna_state", "qna_title", "qna_insert_user_name", "qna_insert_datetime"];
	63	+
83	64
84	65	React.useEffect(() => {
85	66
...	...	@@ -95,7 +76,6 @@
95	76	header="기관 등록"
96	77	></QnAModal>
97	78	<div className="content-wrap">
98		- <ContentTitle contentTitle={"Q&A"} />
99	79	<div className="board-wrap">
100	80	<div className="btn-wrap flex-end margin-bottom question-select">
101	81	<input type="checkbox" />
...	...	@@ -115,20 +95,20 @@
115	95	<Table
116	96	className="equipment-detail"
117	97	head={thead}
118		- contents={content}
	98	+ contents={qnaList}
119	99	contentKey={key}
120	100	view={"qna"}
121	101	offset={offset}
122	102	limit={limit}
123	103	/>
124		- </div>
125		- <div>
126		- <Pagination
127		- total={myQnaTotal}
128		- limit={limit}
129		- page={page}
130		- setPage={setPage}
131		- />
	104	+ <div className="margin-bottom">
	105	+ <Pagination
	106	+ total={myQnaTotal}
	107	+ limit={limit}
	108	+ page={page}
	109	+ setPage={setPage}
	110	+ />
	111	+ </div>
132	112	</div>
133	113	</main>
134	114	);

...	...	@@ -149,7 +149,7 @@
149	149	}
150	150
151	151
152		- // 관리자 전체 장비 목록
	152	+ // 전체 장비 목록
153	153	const [equipmentList, setEquipmentList] = React.useState([]);
154	154	// 장비
155	155	const [equipment, setEquipment] = React.useState({
...	...	@@ -162,20 +162,10 @@
162	162	});
163	163	// 장비 등록 모달창
164	164	const [equipmentInsertModal, setEquipmentInsertModal] = React.useState(false);
	165	+ // 장비 상세 조회 모달창
	166	+ const [equipmentOneModal, setEquipmentOneModal] = React.useState(false);
165	167
166		- // 장비 등록 모달창 열기
167		- const equipmentInsertModalOpen = () => {
168		- setEquipmentInsertModal(true);
169		- };
170		- // 장비 등록 모달창 닫기
171		- const equipmentInsertModalClose = () => {
172		- // 장비 초기화
173		- setEquipment(equipment_);
174		- setEquipmentInsertModal(false);
175		- };
176		-
177		-
178		- // 관리자 전체 장비 목록 조회
	168	+ // 전체 장비 목록 조회
179	169	const equipmentSelectList = () => {
180	170	console.log('equipmentSelectList Function Run');
181	171	fetch("/equipment/equipmentSelectList.json", {
...	...	@@ -192,9 +182,20 @@
192	182	});
193	183	}
194	184
	185	+ // 장비 등록 모달창 열기
	186	+ const equipmentInsertModalOpen = () => {
	187	+ setEquipmentInsertModal(true);
	188	+ };
	189	+ // 장비 등록 모달창 닫기
	190	+ const equipmentInsertModalClose = () => {
	191	+ // 장비 초기화
	192	+ setEquipment(equipment_);
	193	+ setEquipmentInsertModal(false);
	194	+ };
	195	+
195	196	// 장비 임시 데이터
196	197	const equipmentChange = (e) => {
197		- console.log('equipmentChange: ', e.target.name, e.target.value);
	198	+ // console.log('equipmentChange: ', e.target.name, e.target.value);
198	199
199	200	// 원본 데이터 복사 및 수정
200	201	let data = {};
...	...	@@ -227,6 +228,14 @@
227	228	return;
228	229	}
229	230	}
	231	+
	232	+ // 시리얼 넘버 중복검사
	233	+ for(let i = 0; i < equipmentList.length; i++) {
	234	+ if(equipment["equipment_serial_number"] == equipmentList[i]["equipment_serial_number"]) {
	235	+ alert('이미 등록된 시리얼 넘버입니다.');
	236	+ return;
	237	+ }
	238	+ }
230	239
231	240	fetch("/equipment/equipmentInsert.json", {
232	241	method: "POST",
...	...	@@ -249,6 +258,84 @@
249	258	alert('등록에 실패했습니다.');
250	259	});
251	260	}
	261	+
	262	+ // 장비 상세 조회 모달창 열기
	263	+ const equipmentOneModalOpen = (item) => {
	264	+ setEquipment(item);
	265	+ setEquipmentOneModal(true);
	266	+ };
	267	+ // 장비 상세 조회 모달창 닫기
	268	+ const equipmentOneModalClose = () => {
	269	+ // 장비 초기화
	270	+ setEquipment(equipment_);
	271	+ setEquipmentOneModal(false);
	272	+ };
	273	+
	274	+ // 장비 수정
	275	+ const equipmentUpdate = () => {
	276	+ console.log('equipmentUpdate Function Run');
	277	+
	278	+ // 유효성 검사
	279	+ for(let i = 0; i < equipmentInsertHead.length; i++) {
	280	+ if(equipment[equipmentInsertKey[i]] == null) {
	281	+ alert(equipmentInsertHead[i] +'를 선택해 주세요');
	282	+ return;
	283	+ }
	284	+ }
	285	+
	286	+ fetch("/equipment/equipmentUpdate.json", {
	287	+ method: "POST",
	288	+ headers: {
	289	+ 'Content-Type': 'application/json; charset=UTF-8'
	290	+ },
	291	+ body: JSON.stringify(equipment),
	292	+ }).then((response) => response.json()).then((data) => {
	293	+ console.log('equipmentUpdate response : ', data);
	294	+ // 장비 목록 조회
	295	+ equipmentSelectList();
	296	+ // 장비 초기화
	297	+ setEquipment(equipment_);
	298	+ // 모달창 닫기
	299	+ setEquipmentOneModal(false);
	300	+
	301	+ alert('수정이 완료됐습니다.');
	302	+ }).catch((error) => {
	303	+ console.log('equipmentUpdate error : ', error);
	304	+ alert('수정에 실패했습니다.');
	305	+ });
	306	+ }
	307	+
	308	+ // 장비 삭제
	309	+ const equipmentDelete = () => {
	310	+ console.log('equipmentDelete Function Run');
	311	+
	312	+ // 삭제 확인 팝업
	313	+ if (confirm('정말 삭제하시겠습니까?') == false) {
	314	+ return;
	315	+ }
	316	+
	317	+ fetch("/equipment/equipmentDelete.json", {
	318	+ method: "POST",
	319	+ headers: {
	320	+ 'Content-Type': 'application/json; charset=UTF-8'
	321	+ },
	322	+ body: JSON.stringify(equipment),
	323	+ }).then((response) => response.json()).then((data) => {
	324	+ console.log('equipmentDelete response : ', data);
	325	+ // 장비 목록 조회
	326	+ equipmentSelectList();
	327	+ // 장비 초기화
	328	+ setEquipment(equipment_);
	329	+ // 모달창 닫기
	330	+ setEquipmentOneModal(false);
	331	+
	332	+ alert('삭제가 완료됐습니다.');
	333	+ }).catch((error) => {
	334	+ console.log('equipmentDelete error : ', error);
	335	+ alert('삭제에 실패했습니다.');
	336	+ });
	337	+ }
	338	+
252	339
253	340	// 장비 등록 th
254	341	const equipmentInsertHead = [
...	...	@@ -278,7 +365,7 @@
278	365	"입고 일자",
279	366	"상태",
280	367	"보유 기관",
281		- "시행기관 관리",
	368	+ "기관 관리",
282	369	];
283	370	const key1 = [
284	371	"equipment_name",
...	...	@@ -846,7 +933,7 @@
846	933	title: "전체 장비" + "(" + equipmentList.length + ")",
847	934	description: (
848	935	<div>
849		- <div className="flex">
	936	+ <div className="flex equip-tab">
850	937	<SubTitle explanation={"장비 클릭 시 지난 매칭이력을 확인할 수 있습니다."} />
851	938	<div className="btn-wrap flex-end margin-bottom ">
852	939	<Button
...	...	@@ -882,7 +969,7 @@
882	969	{equipmentList.length > 0
883	970	? equipmentList.map((item, index) => {
884	971	return (
885		- <tr key={index}>
	972	+ <tr key={index} onClick={() => equipmentOneModalOpen(item)}>
886	973	<td>{equipmentList.length - index}</td>
887	974	{key1.map((kes) => {
888	975	if(kes == "equipment_state") {
...	...	@@ -894,7 +981,7 @@
894	981	}
895	982	return <td>{item[kes]}</td>
896	983	})}
897		- <td>
	984	+ <td onClick={(e) => e.stopPropagation()}>
898	985	{
899	986	item['senior_id'] == null
900	987	? <Button
...	...	@@ -908,6 +995,11 @@
908	995	onClick={seniorMatchDelete}
909	996	/>
910	997	}
	998	+ <Button
	999	+ className={"btn-small gray-btn"}
	1000	+ btnName={"삭제"}
	1001	+ onClick={() => seniorMatchInsertModalOpen(item)}
	1002	+ />
911	1003	</td>
912	1004	</tr>
913	1005	);
...	...	@@ -951,7 +1043,7 @@
951	1043	title: "전체 장비(시행기관)" + "(" + agencyEquipmentList.length + ")",
952	1044	description: (
953	1045	<div>
954		- <div className="flex">
	1046	+ <div className="flex equip-tab">
955	1047	<SubTitle explanation={"장비 클릭 시 지난 매칭이력을 확인할 수 있습니다."} />
956	1048	<div className="btn-wrap flex-end margin-bottom ">
957	1049	<Button
...	...	@@ -1024,7 +1116,7 @@
1024	1116	title: "대상자 장비(시행기관)" + "(" + agencySeniorEquipmentList.length + ")",
1025	1117	description: (
1026	1118	<div>
1027		- <div className="flex">
	1119	+ <div className="flex equip-tab">
1028	1120	<SubTitle explanation={"장비 클릭 시 지난 매칭이력을 확인할 수 있습니다."} />
1029	1121	</div>
1030	1122	<table class="caregiver-user">
...	...	@@ -1068,7 +1160,7 @@
1068	1160	title: "재고 장비(시행기관)" + "(" + agencyStockEquipmentList.length + ")",
1069	1161	description: (
1070	1162	<div>
1071		- <div className="flex">
	1163	+ <div className="flex equip-tab">
1072	1164	<SubTitle explanation={"장비 클릭 시 지난 매칭이력을 확인할 수 있습니다."} />
1073	1165	</div>
1074	1166	<table class="caregiver-user">
...	...	@@ -1171,6 +1263,101 @@
1171	1263	className={"btn-small gray-btn"}
1172	1264	btnName={"저장"}
1173	1265	onClick={equipmentInsert}
	1266	+ />
	1267	+ </div>
	1268	+ </div>
	1269	+ </Modal>
	1270	+
	1271	+ <Modal open={equipmentOneModal} close={equipmentOneModalClose} header="장비 상세 조회">
	1272	+ <div className="board-wrap">
	1273	+ <div>
	1274	+ <table className="flex70 margin-bottom">
	1275	+ <tbody className="equipment-insert">
	1276	+ <tr>
	1277	+ <th>종류</th>
	1278	+ <td colSpan={5}>
	1279	+ <select value={equipment['equipment_type']} name="equipment_type" onChange={equipmentChange}>
	1280	+ <option value="" selected disabled>선택</option>
	1281	+ <option value="DIGITAL_MEDIBOX">디지털 약상자</option>
	1282	+ <option value="ECG" disabled>심전도계</option>
	1283	+ <option value="SPHYGMOMANOMETER" disabled>혈압계</option>
	1284	+ </select>
	1285	+ </td>
	1286	+ </tr>
	1287	+ <tr>
	1288	+ <th>모델 명</th>
	1289	+ <td colSpan={5}>
	1290	+ <input type="text" value={equipment['equipment_name']} id="equipmentName" name="equipment_name" placeholder="모델 명을 입력해 주세요" onChange={equipmentChange}></input>
	1291	+ {/* {smartMediBoxNameList.map((item) => {
	1292	+ return (
	1293	+ <span>
	1294	+ <input type="radio" id={item} name="equipment_name" value={item}></input>
	1295	+ <label for={item}>{item}</label>
	1296	+ </span>
	1297	+ )
	1298	+ })} */}
	1299	+ </td>
	1300	+ </tr>
	1301	+ <tr>
	1302	+ <th>시리얼 넘버</th>
	1303	+ <td colSpan={5}>
	1304	+ <input type="text" value={equipment['equipment_serial_number']} name="equipment_serial_number" placeholder="S/N을 입력해 주세요" disabled onChange={equipmentChange}/>
	1305	+ </td>
	1306	+ </tr>
	1307	+ <tr>
	1308	+ <th>생산 일자</th>
	1309	+ <td colSpan={5}>
	1310	+ <input type="date" value={equipment['equipment_product_date']} name="equipment_product_date" onChange={equipmentChange}/>
	1311	+ </td>
	1312	+ </tr>
	1313	+ <tr>
	1314	+ <th>입고 일자</th>
	1315	+ <td colSpan={5}>
	1316	+ <input type="date" value={equipment['equipment_stock_date']} name="equipment_stock_date" onChange={equipmentChange}/>
	1317	+ </td>
	1318	+ </tr>
	1319	+ </tbody>
	1320	+ </table>
	1321	+
	1322	+ <table className={"caregiver-user"}>
	1323	+ <thead>
	1324	+ <tr>
	1325	+ {thead66.map((i) => {
	1326	+ return <th>{i}</th>;
	1327	+ })}
	1328	+ </tr>
	1329	+ </thead>
	1330	+ <tbody>
	1331	+ {seniorMatchListByEquipment.length > 0
	1332	+ ? seniorMatchListByEquipment.map((item, index) => {
	1333	+ return (
	1334	+ <tr>
	1335	+ {key66.map((kes) => {
	1336	+ return <td>{item[kes]}</td>
	1337	+ })}
	1338	+ </tr>
	1339	+ );
	1340	+ })
	1341	+ : <td colSpan={4}>조회된 데이터가 없습니다.</td>
	1342	+ }
	1343	+ </tbody>
	1344	+ </table>
	1345	+ </div>
	1346	+ <div justify-content="center">
	1347	+ <Button
	1348	+ className={"btn-small gray-btn"}
	1349	+ btnName={"수정"}
	1350	+ onClick={equipmentUpdate}
	1351	+ />
	1352	+ <Button
	1353	+ className={"btn-small gray-btn"}
	1354	+ btnName={"삭제"}
	1355	+ onClick={equipmentDelete}
	1356	+ />
	1357	+ <Button
	1358	+ className={"btn-small gray-btn"}
	1359	+ btnName={"닫기"}
	1360	+ onClick={equipmentOneModalClose}
1174	1361	/>
1175	1362	</div>
1176	1363	</div>
...	...	@@ -1291,7 +1478,7 @@
1291	1478	</div>
1292	1479	</Modal>
1293	1480
1294		- <Modal open={agencyEquipmentOneModal} close={agencyEquipmentOneModalClose} header="장비 상세 조회">
	1481	+ <Modal open={agencyEquipmentOneModal} close={agencyEquipmentOneModalClose} header="대상자 장비 상세 조회">
1295	1482	<div className="board-wrap">
1296	1483	<div>
1297	1484	<table className={"caregiver-user"}>
...	...	@@ -1342,16 +1529,10 @@
1342	1529	))}
1343	1530	</ul>
1344	1531	<div className="content-wrap">
1345		- <div className="search-management flex-end margin-bottom2">
1346		- <select name="management-agency">
1347		- <option value="기관전체">기관전체</option>
1348		- <option value="대구보훈병원">복지재단1</option>
1349		- <option value="군위군청">복지재단2</option>
1350		- <option value="군위군청">복지재단3</option>
1351		- </select>
	1532	+ <div className="search-management flex-end margin-bottom2">
1352	1533	<select>
1353		- <option value="이름">이름</option>
1354		- <option value="아이디">아이디</option>
	1534	+ <option value="기관명">기관명</option>
	1535	+ <option value="시리얼넘버">시리얼넘버</option>
1355	1536	</select>
1356	1537	<input type="text" />
1357	1538	<Button

...	...	@@ -122,31 +122,14 @@
122	122
123	123	return (
124	124	<main>
125		- <ContentTitle contentTitle={"건강 관리"} explanation={"대상자의 복약/댁내온도/방문 관리를 할 수 있습니다."} />
126	125	<div className="content-wrap">
127		-
	126	+ <DetailTitle contentTitle={"대상자의 복약 / 댁내온도 / 방문 관리를 할 수 있습니다."} />
128	127	<div
129	128	style={{ height: "calc(100% - 61px)" }}
130	129	>
131	130	<div className="right" style={{ height: "100%", }}>
132	131	<div style={{ height: "100%" }}>
133		- <div className="tab-container">
134		- <ul className="tab-menu-mobile">
135		- <div>
136		- <SubTitle
137		- className="margin-bottom"
138		- subtitle={"사용자 선택"}
139		- explanation={"사용자 별로 선택 후 관리할 수 있습니다. "}
140		- />
141		- </div>
142		- <select name="" id="" style={{ width: "100%" }}>
143		- <option value="사용자선택">보호자</option>
144		- <option value="사용자선택">보호사</option>
145		- <option value="사용자선택">병원</option>
146		- <option value="사용자선택">지자체</option>
147		- <option value="사용자선택">관리자</option>
148		- </select>
149		- </ul>
	132	+ <div className="tab-container" style={{ marginTop: "5rem", }}>
150	133	<ul className="tab-menu flex-end">
151	134	{data.map((item) => (
152	135	<li
...	...	@@ -159,7 +142,7 @@
159	142	))}
160	143	</ul>
161	144	<div className="content-wrap userlist">
162		- <DetailTitle contentTitle={`${tapName}`} />
	145	+
163	146	<div className="search-management flex-start margin-bottom2">
164	147	<DetailSearch />
165	148	</div>

...	...	@@ -168,9 +168,8 @@
168	168
169	169	return (
170	170	<main>
171		-
172		- <ContentTitle contentTitle={"진료 관리"} explanation={"대상자의 문진표/심전도/혈압 관리를 할 수 있습니다."} />
173	171	<div className="content-wrap">
	172	+ <DetailTitle contentTitle={"대상자의 문진표 / 심전도 / 혈압 관리를 할 수 있습니다."} />
174	173	<Modal_Questionnaire open={modalOpen} close={closeModal} />
175	174	<Modal_MedicalHistory open={modalOpen2} close={closeModal2} />
176	175	<Modal_ECG open={modalOpen3} close={closeModal3} />
...	...	@@ -180,7 +179,7 @@
180	179	>
181	180	<div className="right" style={{ height: "100%", }}>
182	181	<div style={{ height: "100%" }}>
183		- <div className="tab-container">
	182	+ <div className="tab-container" style={{ marginTop: "5rem", }}>
184	183	<ul className="tab-menu flex-end">
185	184	{data.map((item) => (
186	185	<li
...	...	@@ -192,8 +191,7 @@
192	191	</li>
193	192	))}
194	193	</ul>
195		- <div className="content-wrap userlist">
196		- <DetailTitle contentTitle={`${tapName}`} />
	194	+ <div className="content-wrap userlist">
197	195	<div className="search-management flex-start margin-bottom2">
198	196	<DetailSearch />
199	197	</div>

...	...	@@ -10,6 +10,10 @@
10	10	import Chart1 from "../../../component/chart/Chart1.jsx";
11	11	import LineColor from "../../../component/chart/LineColor.jsx";
12	12	import ContentTitle from "../../../component/ContentTitle.jsx";
	13	+import battery from '../../../../resources/files/images/battery.png';
	14	+import temperature from '../../../../resources/files/images/temperature.png';
	15	+import medicine from '../../../../resources/files/images/medicine.png';
	16	+import calendarBig from '../../../../resources/files/images/calendarBig.png';
13	17
14	18	export default function GuardianStatistics() {
15	19
...	...	@@ -18,11 +22,10 @@
18	22	return (
19	23	<>
20	24	<main>
21		- <ContentTitle contentTitle={"그래프로 한눈에 보기"} />
22	25	<div className="statistics-grid">
23	26	<ul className="content-box statistics-guardian">
24	27	<li className="flex-start">
25		- <p><AssignmentTurnedInIcon sx={{ width: "5rem", height: "5rem", color: "#bf0629", borderRadius: "50px" }} /></p>
	28	+ <p><img className="guardian-img" src={calendarBig} alt="" /></p>
26	29	<p>방문 그래프</p>
27	30	<p>이번달 보호사님이 방문한 횟수는 총 4회 입니다.</p>
28	31	</li>
...	...	@@ -32,7 +35,7 @@
32	35	</ul>
33	36	<ul className="content-box statistics-guardian">
34	37	<li className="flex-start">
35		- <p><MedicationIcon sx={{ width: "5rem", height: "5rem", color: "#0dd390", borderRadius: "50px" }} /></p>
	38	+ <p><img className="guardian-img" src={medicine} alt="" /></p>
36	39	<p>복약 체크</p>
37	40	<p>약을 잘 복용하고 계신지 체크해주세요</p>
38	41	</li>
...	...	@@ -42,7 +45,7 @@
42	45	</ul>
43	46	<ul className="content-box statistics-guardian">
44	47	<li className="flex-start">
45		- <p><DeviceThermostatIcon sx={{ width: "5rem", height: "5rem", color: "#f1de05", borderRadius: "50px" }} /></p>
	48	+ <p><img className="guardian-img" src={temperature} alt="" /></p>
46	49	<p>온도 체크</p>
47	50	<p>댁내 온도가 적절한지 체크해보세요.</p>
48	51	</li>
...	...	@@ -52,7 +55,7 @@
52	55	</ul>
53	56	<ul className="content-box statistics-guardian">
54	57	<li className="flex-start">
55		- <p><BatteryCharging20Icon sx={{ width: "5rem", height: "5rem", color: "#5f9af3", borderRadius: "50px" }} /></p>
	58	+ <p><img className="guardian-img" src={battery} alt="" /></p>
56	59	<p>약상자 배터리 그래프</p>
57	60	<p>배터리 평균</p>
58	61	</li>

...	...	@@ -114,38 +114,33 @@
114	114	<p>400</p>
115	115	</li>
116	116	</ul>
117		- <div className="content-box combine-all-government combine-bottom-government2">
118		- <div className="flex">
119		- <Title title={`${cityName} 월별 방문 횟수`} explanation={"최근 6개월간 방문 횟수의 변화를 확인할 수 있습니다."} />
120		- <AddCircleIcon sx={{ fontSize: 20, color: "#1976d2" }} />
121		- </div>
122		- <RowChart_govern />
123		- </div>
124	117	<div className="content-box combine-left-government combine-bottom-government2 main-main">
125	118	<div className="flex">
126	119	<Title title={"지역별 케어 대상자 분포 현황"} explanation={"지역 선택 시 해당 지역의 대상자리스트가 보여집니다."} />
127		- <AddCircleIcon sx={{ fontSize: 20, color: "#1976d2" }} />
128	120	</div>
129	121	<Map setCityName={setCityName} />
130	122	</div>
	123	+ <div className="content-box combine-all-government combine-bottom-government2">
	124	+ <div className="flex">
	125	+ <Title title={`${cityName} 월별 방문 횟수`} explanation={"최근 6개월간 방문 횟수의 변화를 확인할 수 있습니다."} />
	126	+ </div>
	127	+ <RowChart_govern />
	128	+ </div>
131	129	<div className="content-box combine-left-government2">
132	130	<div className="flex">
133	131	<Title title={`${cityName} 복용률 평균`} explanation={"해당 지역의 대상자 복용률이 그래프로 보여집니다."} />
134		- <AddCircleIcon sx={{ fontSize: 20, color: "#1976d2" }} />
135	132	</div>
136	133	<Chart2_govern />
137	134	</div>
138	135	<div className="content-box combine-right-government2">
139	136	<div className="flex">
140	137	<Title title={`기관별 대상자 등록 현황`} explanation={"약상자 사용자의 데이터 차트가 보여집니다."} />
141		- <AddCircleIcon sx={{ fontSize: 20, color: "#1976d2" }} />
142	138	</div>
143	139	<Chart5 />
144	140	</div>
145	141	<div className="content-box combine-right-government">
146	142	<div className="flex">
147	143	<Title title={`기관별 약상자 사용 현황`} explanation={""} />
148		- <AddCircleIcon sx={{ fontSize: 20, color: "#1976d2" }} />
149	144	</div>
150	145	<Donut1_govern />
151	146	</div>

...	...	@@ -30,43 +30,43 @@
30	30
31	31	export default function Main_guardian() {
32	32	const tableHead1 = ["", "", "", "", "", ""];
33		- const Key1 = ["morning", "morning2", "lunch","lunch2", "dinner","dinner2"];
	33	+ const Key1 = ["morning", "morning2", "lunch", "lunch2", "dinner", "dinner2"];
34	34	const content1 = [
35	35	{
36	36	morning: "아침",
37		- morning2:(
38		- <CheckCircleOutlineIcon sx={{ width: "3rem", height: "3rem", color: "#067943", borderRadius: "50px" }}/>
	37	+ morning2: (
	38	+ <CheckCircleOutlineIcon sx={{ width: "3rem", height: "3rem", color: "#067943", borderRadius: "50px" }} />
39	39	),
40	40	lunch: "점심",
41	41	lunch2: (
42		- <CheckCircleOutlineIcon sx={{ width: "3rem", height: "3rem", color: "#067943", borderRadius: "50px" }}/>
	42	+ <CheckCircleOutlineIcon sx={{ width: "3rem", height: "3rem", color: "#067943", borderRadius: "50px" }} />
43	43	),
44	44	dinner: "저녁",
45	45	dinner2: (
46		- <CheckCircleOutlineIcon sx={{ width: "3rem", height: "3rem", color: "#067943", borderRadius: "50px" }}/>
	46	+ <CheckCircleOutlineIcon sx={{ width: "3rem", height: "3rem", color: "#067943", borderRadius: "50px" }} />
47	47	),
48	48	}
49	49	];
50	50	const tableHead2 = ["", "", "", "", "", ""];
51		- const Key2 = ["morning", "morning2", "lunch","lunch2", "dinner","dinner2"];
	51	+ const Key2 = ["morning", "morning2", "lunch", "lunch2", "dinner", "dinner2"];
52	52	const content2 = [
53	53	{
54	54	morning: "아침",
55		- morning2:(
56		- <ClearIcon sx={{ width: "3rem", height: "3rem", color: "#bf0629", borderRadius: "50px" }}/>
	55	+ morning2: (
	56	+ <ClearIcon sx={{ width: "3rem", height: "3rem", color: "#bf0629", borderRadius: "50px" }} />
57	57	),
58	58	lunch: "점심",
59	59	lunch2: (
60		- <ClearIcon sx={{ width: "3rem", height: "3rem", color: "#bf0629", borderRadius: "50px" }}/>
	60	+ <ClearIcon sx={{ width: "3rem", height: "3rem", color: "#bf0629", borderRadius: "50px" }} />
61	61	),
62	62	dinner: "저녁",
63	63	dinner2: (
64		- <ClearIcon sx={{ width: "3rem", height: "3rem", color: "#bf0629", borderRadius: "50px" }}/>
	64	+ <ClearIcon sx={{ width: "3rem", height: "3rem", color: "#bf0629", borderRadius: "50px" }} />
65	65	),
66	66	}
67	67	];
68	68	const tableHead3 = ["월", "화", "수", "목", "금", "토", "일"];
69		- const Key3 = ["mon", "tue", "wed","thu", "fri","sat","sun"];
	69	+ const Key3 = ["mon", "tue", "wed", "thu", "fri", "sat", "sun"];
70	70	const content3 = [
71	71	{
72	72	mon: "24°C",
...	...	@@ -85,55 +85,15 @@
85	85	<main>
86	86	<div className="flex-start main-guardian"><img src={Senior} alt="" /><Title title={"김복남 어르신"} explanation={"방문, 복약, 온도, 배터리 현황을 확인하세요."} /></div>
87	87	<div className="main-grid-guardian">
88		- <div className=" statistics-guardian combine-left2 combine-middle-government">
89		- <div className="flex-start margin-bottom2"><img src={calendarBig} alt="" /><TitleSmall title={"방문체크"} /></div>
90		- <ul >
91		- <li>
92		- <Calendar />
93		- </li>
94		- </ul>
95		- </div>
96		- <div className=" statistics-guardian combine-right3">
97		- <div className="flex-start margin-bottom2"><img src={temperature} alt="" /><TitleSmall title={"온도체크"} explanation={"댁내 온도가 적절한지 체크해보세요."}/></div>
98		- <ul >
99		- <li>
100		- <DateMonth />
101		- <Chart6 />
102		- </li>
103		- </ul>
104		- </div>
105		-
106		- <div className="statistics-guardian combine-right3">
107		- <div className="flex-start margin-bottom2"><img src={medicine} alt="" /><TitleSmall title={"복약체크"} explanation={"약을 잘 복용하고 계신지 체크해주세요."}/></div>
108		- <ul className="">
109		- <li className="guardian-medicine">
110		- <DateDay />
111		- <ul className="flex">
112		- <li>
113		- <img src={mornon} alt="" className="show"/>
114		- <img src={mornoff} alt="" />
115		- </li>
116		- <li>
117		- <img src={lunchon} alt="" />
118		- <img src={lunchoff} alt="" className="show"/>
119		- </li>
120		- <li>
121		- <img src={dinneron} alt="" />
122		- <img src={dinneroff} alt="" className="show"/>
123		- </li>
124		- </ul>
125		- </li>
126		- </ul>
127		- </div>
128	88	<div className="combine-left combine-all-government battery-wrap ">
129		- <div className="battery flex-start"><img src={battery} alt="" /><p>현재 스마트 약상자의 배터리가 <em className="red">40</em>% 입니다.</p><p className="red">※충전이 필요합니다.</p></div>
130		- <div className="battery-img">
	89	+ <div className="battery flex-start"><img className="guardian-img" src={battery} alt="" /><p>현재 스마트 약상자의 배터리가 <em className="red">40</em>% 입니다.</p><p className="red">※충전이 필요합니다.</p></div>
	90	+ <div className="battery-img">
131	91	{/* 0%일때 */}
132		- <img src={zeropercent} alt="" />
	92	+ <img src={zeropercent} alt="" />
133	93	{/* 0~20%일때 */}
134	94	<img src={twentypercent} alt="" />
135	95	{/* 20~40%일때 */}
136		- <img src={fortypercent} alt="" className="show"/>
	96	+ <img src={fortypercent} alt="" className="show" />
137	97	{/* 40~60%일때 */}
138	98	<img src={sixtytypercent} alt="" />
139	99	{/* 60~80% 일때 */}
...	...	@@ -143,6 +103,48 @@
143	103	</div>
144	104
145	105	</div>
	106	+ <div className="statistics-guardian combine-right3">
	107	+ <div className="flex-start margin-bottom2"><img className="guardian-img" src={medicine} alt="" /><TitleSmall title={"복약체크"} explanation={"약을 잘 복용하고 계신지 체크해주세요."} /></div>
	108	+ <ul className="">
	109	+ <li className="guardian-medicine">
	110	+ <DateDay />
	111	+ <ul className="flex">
	112	+ <li>
	113	+ <img src={mornon} alt="" className="show" />
	114	+ <img src={mornoff} alt="" />
	115	+ <p className="medicine-title">아침</p>
	116	+ </li>
	117	+ <li>
	118	+ <img src={lunchon} alt="" />
	119	+ <img src={lunchoff} alt="" className="show" />
	120	+ <p className="medicine-title">점심</p>
	121	+ </li>
	122	+ <li>
	123	+ <img src={dinneron} alt="" />
	124	+ <img src={dinneroff} alt="" className="show" />
	125	+ <p className="medicine-title">저녁</p>
	126	+ </li>
	127	+ </ul>
	128	+ </li>
	129	+ </ul>
	130	+ </div>
	131	+ <div className=" statistics-guardian combine-right3">
	132	+ <div className="flex-start margin-bottom2"><img className="guardian-img" src={temperature} alt="" /><TitleSmall title={"온도체크"} explanation={"댁내 온도가 적절한지 체크해보세요."} /></div>
	133	+ <ul >
	134	+ <li>
	135	+ <DateMonth />
	136	+ <Chart6 />
	137	+ </li>
	138	+ </ul>
	139	+ </div>
	140	+ <div className=" statistics-guardian combine-left2 combine-middle-government">
	141	+ <div className="flex-start margin-bottom2"><img className="guardian-img" src={calendarBig} alt="" /><TitleSmall title={"방문체크"} /></div>
	142	+ <ul >
	143	+ <li>
	144	+ <Calendar />
	145	+ </li>
	146	+ </ul>
	147	+ </div>
146	148	</div>
147	149	</main>
148	150	</>

...	...	@@ -96,17 +96,19 @@
96	96	webServer.get('*', function (request, response, next) {
97	97	response.sendFile(`${BASE_DIR}/client/views/index.html`);
98	98	})
	99	+
99	100	/**
100	101	+ * @author : 방선주
101	102	+ * @since : 2023.02.14
102	103	+ * @dscription : REST API 서버에 데이터 요청 보내기(Proxy)
103	104	+ */
104		-+webServer.use('*.json', expressProxy(API_SERVER_HOST, {
105		- proxyReqPathResolver: function (request) {
106		- //console.log('request : ', request.url, request.params[0]);
107		- return `${request.params['0']}.json`;
108		- }
109		- }));
	105	+webServer.use('*.json', expressProxy(API_SERVER_HOST, {
	106	+ proxyReqPathResolver: function (request) {
	107	+ //console.log('request : ', request.url, request.params[0]);
	108	+ return `${request.params['0']}.json`;
	109	+ }
	110	+}));
	111	+
110	112	/**
111	113	* @author : 최정우
112	114	* @since : 2022.09.21

Delete comment