Commit @ffd7a861906b56145211ae3e22674be8fe0eb379

ffd7a86

.vscode/launch.json (added)

+++ .vscode/launch.json

...	...	@@ -0,0 +1,16 @@
	1	+{
	2	+ // Use IntelliSense to learn about possible attributes.
	3	+ // Hover to view descriptions of existing attributes.
	4	+ // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
	5	+ "version": "0.2.0",
	6	+ "configurations": [
	7	+
	8	+ {
	9	+ "type": "chrome",
	10	+ "request": "launch",
	11	+ "name": "Launch Chrome against localhost",
	12	+ "url": "http://localhost:8080",
	13	+ "webRoot": "${workspaceFolder}"
	14	+ }
	15	+ ]
	16	+}(No newline at end of file)

d445871

ffd7a86

client/resources/css/layout.css

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

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


 }
 .nav{
   position: relative;
-  box-shadow: 1px 1px 5px 1px rgb(0 0 0 / 20%);}
+  background: #ffffff;
+}
 .logo {  
   padding: 2rem 1rem;
   font-size: large;
   text-align: center;
-  background: #ffffff;
   font-weight: bold;
 }
 .logo img{width: 273px;}

   color: #333333;
   font-weight: bold;
   margin: 0 3rem;
-  padding: 1rem 6.2rem;
+  padding: 1rem 3.2rem;
   
 }
 

   display: block;
 }
 .sidebar-title {
-  margin: 0 auto;
-  width: 150px;
-  padding: 1rem;
+  margin: 0 3rem;
+  padding: 1rem 3.2rem;
 }
 
 .sidebar-title span {
   font-weight: bold;
-  color: #333333;
-  
-  font-family:"KoPubDotumLight";
-  
+  color: #333333;  
+  font-family:"KoPubDotumLight";  
 }
 
 .sidebar-title .toggle {

 }
 nav li{cursor: pointer;}
 .sidebar-item{font-size: 1.8rem;}
-.sidebar-item:hover{background: #f25430; color: #ffffff;}
+.sidebar-item:hover{background: #f25430; color: #ffffff; width: 90%; border-top-right-radius: 50px; border-bottom-right-radius: 50px; }
 .sidebar-item:hover a{color: #ffffff;}
 .sidebar-item:hover span, .sidebar-item:hover .toggle{color: #ffffff;}
+.sidebar-item:hover span, .sidebar-item:hover .MuiSvgIcon-root{color: #ffffff;}
 .sidebar-content {
   display: none;
   color: #ffffff;
 }
-.sidebar-content a{padding: 1rem 0 1rem 6rem;}
+.sidebar-content a{padding: 1rem 0 1rem 5rem;}
 .sidebar-item.open>.sidebar-content {
   height: auto;
   display: block;

 
 .sidebar-content .sidebar-item:hover a {
   font-weight: bold;
+  background: #f1bdb1;
+  color: #ffffff;
 }
 .info-wrap .usericon{width: 5rem; height: 5rem; border: 1px solid #f25430; border-radius: 50px; margin-right: 2rem;}
 .header-info-id{font-size: 1.6rem; margin-right: 2rem; color: #733c1d; font-weight: 600;}

d445871

ffd7a86

client/resources/css/main.css

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

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


   background-color: #18924e;
 }
 
+/* 기관조회 */
 
 /* Q&A */
 .title{text-decoration: underline; cursor: pointer;}
 .question-select input{width: 3%;}
 .question-select label{width: 10%;}
-.question-select select{width: 16%;}
+.question-select select{width: 16%; height: 3.7rem;}
+.qna-insert select{height: 3.7rem;}
+.qna-insert th{font-size: 1.8rem; color: #733c1d;}
 /* 담당자배정 */
 .protectorlist input{width: 20rem;}
 /* 위험기준관리 */

 /* 카테고리 기관 추가*/
 .explain-table th{background: #ffffff;}
 .react-calendar{width: 100%;}
-.total p{font-size: 1.6rem;}
+.total p{font-size: 1.6rem; font-weight: 600;}
+.total{color: #733c1d; }
 .total-equip::before{
   content: "";
   border-left: 20px solid #5a70df;

   width: 100%;
   margin-bottom: 2rem;
 }
-
-.search-group .btn-box {
-  padding-bottom: 0.5rem;
-}
-
 .detail-search table {
   border-top: none;
   border-bottom: none;

 }
 
 .detail-search table th {
-  width: 14%;
+  width: 20%;
 }
 
 .detail-search table td {

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

 .search-area {
   padding: 2rem;
 }
-
+.search-area button{width: 100%;}
 .search-area details {
   margin-top: 1rem;
 }

 }
 
 .senior-insert label {
-  padding: 0 4rem 0 1rem;
-
+  padding: 0 0rem 0 1rem;
+  width: 5rem;
+}
+.senior-insert tr:nth-child(5) input{
+  width: 2rem;
 }
 .senior-insert select{padding: 1rem;}
 .senior-insert tr:nth-child(2) .gender {

 
 .search-management input {
   width: 20%;
-  height: 3rem;
+  height: 3.7rem;
   margin-right: 1rem;
 }
 .tab-container>div>div:nth-child(2) {

 
 .mobile{
   display: none;
+}
+
+/* -------------- 페이징 버튼 색상 적용 ----------------- */
+.PagingBtn{
+  background-color: #ff7f50;
+  color: #ffffff;
+
 }

d445871

ffd7a86

client/resources/css/reset.css

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

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


-@font-face {
+/* @font-face {
   font-family: "KoPubDotumLight";
   src: url(../files/font/KoPubDotumLight_0.ttf);
-}
+} */
 
 :root{
   --font-KoPubDotumLight:"KoPubDotumLight"

   width: 100%;
   border-collapse: collapse;
   font-family:"AuctionGothic_Medium";
+  border: 1px solid #d8d3c7;
 }
 thead{
   font-weight: bold;

ffd7a86

client/resources/files/images/0percent.png (Binary) (added)

+++ client/resources/files/images/0percent.png

Binary file is not shown

ffd7a86

client/resources/files/images/100percent.png (Binary) (added)

+++ client/resources/files/images/100percent.png

Binary file is not shown

ffd7a86

client/resources/files/images/20percent.png (Binary) (added)

+++ client/resources/files/images/20percent.png

Binary file is not shown

ffd7a86

client/resources/files/images/40percent.png (Binary) (added)

+++ client/resources/files/images/40percent.png

Binary file is not shown

ffd7a86

client/resources/files/images/60percent.png (Binary) (added)

+++ client/resources/files/images/60percent.png

Binary file is not shown

ffd7a86

client/resources/files/images/80percent.png (Binary) (added)

+++ client/resources/files/images/80percent.png

Binary file is not shown

ffd7a86

client/resources/files/images/battery.png (Binary) (added)

+++ client/resources/files/images/battery.png

Binary file is not shown

ffd7a86

client/resources/files/images/calendar.png (Binary) (added)

+++ client/resources/files/images/calendar.png

Binary file is not shown

ffd7a86

client/resources/files/images/medicine.png (Binary) (added)

+++ client/resources/files/images/medicine.png

Binary file is not shown

ffd7a86

client/resources/files/images/temperature.png (Binary) (added)

+++ client/resources/files/images/temperature.png

Binary file is not shown

d445871

ffd7a86

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">
-        <div className="detail-search" style={{padding:"0 5rem", width:"100%"}}>
+      <div className="search-area flex" style={{ width:"50%"}}>
+        <div className="detail-search" style={{ width:"85%"}}>
           <table>
             <tbody>
               <tr>

             </tbody>
           </table>
         </div>
-        <div className="btn-box flex-center">
-              <Button className={"btn-large green-btn"} btnName={"조회"} />
+        <div className="btn-box flex-center"  style={{ width:"15%"}}>
+              <Button className={"btn-small gray-btn"} btnName={"조회"} />
             </div>
       </div>
     </div>

ffd7a86

client/views/component/MatchingModal.jsx (added)

+++ client/views/component/MatchingModal.jsx

...	...	@@ -0,0 +1,93 @@
	1	+import React from "react";
	2	+import Button from "./Button.jsx";
	3	+import SubTitle from "./SubTitle.jsx";
	4	+import Table from "./Table.jsx";
	5	+import Pagination from "./Pagination.jsx";
	6	+
	7	+export default function Modal({ children, open, close, header }) {
	8	+
	9	+ //-------- 페이징 작업 설정 시작 --------//
	10	+ const limit = 10; // 페이지당 보여줄 공지 개수
	11	+ const [page, setPage] = React.useState(1); //page index
	12	+ const offset = (page - 1) * limit; //게시물 위치 계산
	13	+ const [agencyTotal, setAgencyTotal] = React.useState(0); //최대길이 넣을 변수
	14	+ //-------- 페이징 작업 설정 끝 --------//
	15	+
	16	+ const thead4 = [
	17	+ "No",
	18	+ "보호사 명",
	19	+ "보호사 ID",
	20	+ "보호사 연락처",
	21	+ "매칭 일자",
	22	+ ];
	23	+ const key4 = [
	24	+ "No",
	25	+ "name",
	26	+ "Id",
	27	+ "phone",
	28	+ "date",
	29	+ ];
	30	+ const content4 = [
	31	+ {
	32	+ No: 1,
	33	+ name: "정복지",
	34	+ Id: "worker5",
	35	+ phone: "010-9876-5432",
	36	+ date: "2023-01-10",
	37	+ },
	38	+ {
	39	+ No: 2,
	40	+ name: "문간호",
	41	+ Id: "worker13",
	42	+ phone: "010-1357-2468",
	43	+ date: "2023-02-07",
	44	+ },
	45	+ ];
	46	+
	47	+ return (
	48	+ <div class={open ? "openModal modal" : "modal"}>
	49	+ {open ? (
	50	+ <div className="modal-inner">
	51	+ <div className="modal-header flex">
	52	+ {header}
	53	+ <Button className={"close"} onClick={close} btnName={"X"} />
	54	+ </div>
	55	+ <div className="modal-main">{children}
	56	+ <div className="board-wrap">
	57	+ <SubTitle explanation={"담당자 선택"} className="margin-bottom" />
	58	+ <div className="flex-start protectorlist margin-bottom5">
	59	+ <input type="text" list="protectorlist" />
	60	+ <datalist id="protectorlist">
	61	+ <option value="보호사1(ID)"></option>
	62	+ <option value="보호사2(ID)"></option>
	63	+ <option value="보호사3(ID)"></option>
	64	+ </datalist>
	65	+ <div className="btn-wrap">
	66	+ <Button
	67	+ className={"btn-small green-btn"}
	68	+ btnName={"등록"}
	69	+ />
	70	+ </div>
	71	+ </div>
	72	+ </div>
	73	+ <div>
	74	+ <Table
	75	+ className={"caregiver-user"}
	76	+ head={thead4}
	77	+ contents={content4}
	78	+ contentKey={key4}
	79	+ view={"matching"}
	80	+ offset={offset}
	81	+ limit={limit}
	82	+ />
	83	+ </div>
	84	+ <div>
	85	+ <Pagination total={content4.length} limit={limit} page={page} setPage={setPage} />
	86	+ </div>
	87	+ </div>
	88	+ </div>
	89	+
	90	+ ) : null}
	91	+ </div>
	92	+ );
	93	+}

d445871

ffd7a86

client/views/component/Pagination.jsx

--- client/views/component/Pagination.jsx

+++ client/views/component/Pagination.jsx


             <Paging>
                 <button onClick={() => setPage(page - 1)} disabled={page === 1}>&lt;</button>
                 {Array(numPages).fill().map((_, i) => (
-                    <button key={i + 1} onClick={() => setPage(i + 1)} aria-current={page === i + 1 ? "page" : null}> {i + 1} </button>
+                    <button key={i + 1} onClick={() => setPage(i + 1)} aria-current={page === i + 1 ? "page" : null} className={page === i + 1 ? "PagingBtn" : null}> {i + 1} </button>
                 ))}
                 <button onClick={() => setPage(page + 1)} disabled={page === numPages}>&gt;</button>
             </Paging>

   align-items: center;
   gap: 4px;
   margin: 16px;
-`;
+`;
+

d445871

ffd7a86

client/views/component/Table.jsx

--- client/views/component/Table.jsx

+++ client/views/component/Table.jsx


 import React from "react";
 import Button from "./Button.jsx";
+import Modal from "./MatchingModal.jsx";
+import Modal2 from "./Modal.jsx";
+import SubTitle from "./SubTitle.jsx";
+
 // import styled from "styled-components";
 
-export default function Table({ head, contents, contentKey, onClick, className, view, offset, limit}) {
+export default function Table({ head, contents, contentKey, onClick, className, view, offset, limit }) {
+  const [userName, setUserName] = React.useState("");
   const [modalOpen, setModalOpen] = React.useState(false);
   const openModal = () => {
     setModalOpen(true);

   const openModal2 = () => {
     setModalOpen2(true);
   };
-  
 
+  const closeModal = () => {
+    setModalOpen(false);
+  };
+
+  const closeModal2 = () => {
+    setModalOpen2(false);
+  };
+
+  // 보호자 등록페이지 데이터
+  const thead3 = [
+    "No",
+    "이름",
+    "생년월일",
+    "연락처",
+    "대상자와의 관계",
+  ];
+  const key3 = [
+    "No",
+    "name",
+    "birth",
+    "phone",
+    "relationship",
+  ];
+  const content3 = [
+    {
+      No: 1,
+      name: "김훈",
+      birth: "1965.01.01",
+      relationship: "아들",
+      phone: "010-1234-1234",
+    },
+  ];
+
+  
   const buttonPrint = () => {
-    if(view == 'mySenior'){
-      return(
-      <td>
-        <Button
-          className={"btn-small gray-btn"}
-          btnName={"보기"}
-          onClick={openModal}
-        />
-      </td>)
+    if (view == 'mySenior') {
+      return (
+        <td>
+          <Button
+            className={"btn-small gray-btn"}
+            btnName={"보기"}
+            onClick={openModal}
+          />
+        </td>)
     }
-    else if(view == 'allSenior'){
-      return(
+    else if (view == 'allSenior') {
+      return (
         <>
           <td>
-          <Button
+            <Button
               className={"btn-small gray-btn"}
               btnName={"선택"}
               onClick={openModal2}

               btnName={"보기"}
               onClick={openModal}
             />
-            </td>
-          </>
+          </td>
+        </>
       )
     }
   }
-  
+
   return (
-    <table className={className}>
-      <thead>
-        <tr>
-          {head.map((i) => {
-            return <th>{i}</th>;
-          })}
-        </tr>
-      </thead>
-      <tbody>
-        {contents.slice(offset, offset + limit).map((i, index) => {
-          return (
-            <tr key={index}>
-            {/* //   <td>{i.rn}</td>
-            //   <td>{i.user_name}</td>
-            //   <td>{i.user_phonenumber}</td>
-            //   <td>{i.user_gender}</td>
-            //   <td>{i.user_birth}</td>
-            //   <td>{i.user_address}</td>
-            //   {buttonPrint()} */}
-            {contentKey.map((kes) => {
-                return (
-                  <>
-                  <td onClick={onClick}>{i[kes]}</td>
-                  </>
-                )
-            })}
-            {buttonPrint()}
+    <>
+      <Modal open={modalOpen2} close={closeModal2} header="담당자 배정" />
+      <Modal2 open={modalOpen} close={closeModal} header={userName+"님의 가족"}>
+        <div className="board-wrap">
+          <SubTitle explanation={"최초 ID는 연락처, PW는 생년월일 8자리입니다."} className="margin-bottom" />
+          <table className="margin-bottom2 senior-insert">
+            <tr>
+              <th>이름</th>
+              <td>
+                <input type="text" />
+              </td>
+              <th>생년월일</th>
+              <td>
+                <div className="flex">
+                  <select name="year" id="year">
+                    <option value="">년</option>
+                  </select>
+                  <select name="month" id="month">
+                    <option value="">월</option>
+                  </select>
+                  <select name="days" id="days">
+                    <option value="">일</option>
+                  </select>
+                </div>
+              </td>
             </tr>
-          );
-        })}
-      </tbody>
-    </table>
-    
+            <tr>
+              <th>연락처</th>
+              <td colSpan={3}>
+                <input type="input" maxLength="11" />
+              </td>
+            </tr>
+            <tr>
+              <th>대상자와의 관계</th>
+              <td colSpan={3}>
+                <input type="text" />
+              </td>
+            </tr>
+          </table>
+          <div className="btn-wrap flex-center margin-bottom5">
+            <Button
+              className={"btn-small green-btn"}
+              btnName={"추가"}
+              onClick={() => {
+                navigate("/SeniorInsert");
+              }}
+            />
+          </div>
+          <div>
+            <Table
+              className={"caregiver-user"}
+              head={thead3}
+              contents={content3}
+              contentKey={key3}
+            />
+          </div>
+        </div>
+      </Modal2>
+      <table className={className}>
+        <thead>
+          <tr>
+            {head.map((i) => {
+              return <th>{i}</th>;
+            })}
+          </tr>
+        </thead>
+        <tbody>
+          {contents.slice(offset, offset + limit).map((i, index) => {
+            const name = i.user_name;
+            return (
+              <tr key={index}>
+                {contentKey.map((kes) => {
+                  return (
+                    <>
+                      <td onClick={onClick}>{i[kes]}</td>
+                      {console.log("userName : ", userName)}
+                    </>
+                  )
+                })}
+                {buttonPrint()}
+              </tr>
+            );
+          })}
+        </tbody>
+      </table>
+    </>
   );
 }
 

d445871

ffd7a86

client/views/pages/App.jsx

--- client/views/pages/App.jsx

+++ client/views/pages/App.jsx


   };
 
 
-  const menuItems = GovernmentApp.menuItems;  //AdminApp, GovernmentApp, AllApp, AgencyApp, GuardianApp 
-  const AppRoute = GovernmentApp.AppRoute;
+  const menuItems = GuardianApp.menuItems;  //AdminApp, GovernmentApp, AllApp, AgencyApp, GuardianApp 
+  const AppRoute = GuardianApp.AppRoute;
 
 
   const { title } = menuItems.find(

d445871

ffd7a86

client/views/pages/AppRoute.jsx

--- client/views/pages/AppRoute.jsx

+++ client/views/pages/AppRoute.jsx


 function AgencyAppRoute() {
   return (
     <Routes>
+      <Route path="/Medicalcare" element={<Medicalcare />}></Route>
+      <Route path="/Healthcare" element={<Healthcare />}></Route>
       <Route path="/Join" element={<Join />}></Route>
       <Route path="/QuestionSelect" element={<QuestionSelect />}></Route>
+      <Route path="/QuestionInsert" element={<QuestionInsert />}></Route>
       <Route path="/Main_agency" element={<Main_agency />}></Route>
       <Route path="/UserAuthoriySelect_agency" element={<UserAuthoriySelect_agency />}></Route>
       <Route path="/SeniorInsert" element={<SeniorInsert />}></Route>

d445871

ffd7a86

client/views/pages/callcenter/QandAInsert.jsx

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

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


       <div className="content-wrap row">
         <ContentTitle contentTitle={"문의글 작성"} />
         <SubTitle explanation={"작성자 정보"} />
-        <table className="margin-bottom2 senior-insert">
+        <table className="margin-bottom2 qna-insert">
           <tr>
             <th>작성자</th>
             <td>

             </tr>
         </table>
         <SubTitle explanation={"대상자 정보"} />
-        <table className="margin-bottom2 senior-insert">
+        <table className="margin-bottom2 qna-insert">
           <tr>
             <th>대상자 선택</th>
             <td colSpan={3} className="flex width">

             }}
           />
           <Button
-            className={"btn-large green-btn"}
+            className={"btn-large red-btn"}
             btnName={"등록"}
             onClick={() => {
               navigate("/QandASelect");

d445871

ffd7a86

client/views/pages/callcenter/QuestionInsert.jsx

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

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


 import SubTitle from "../../component/SubTitle.jsx";
 import { useNavigate } from "react-router";
 
-export default function QandAInsert() {
+export default function QuestionInsert() {
   const navigate = useNavigate();
   return (
     <main>
       <div className="content-wrap row">
         <ContentTitle contentTitle={"문의글 작성"} />
         <SubTitle explanation={"작성자 정보"} />
-        <table className="margin-bottom2 senior-insert">
+        <table className="margin-bottom2 qna-insert">
           <tr>
             <th>작성자</th>
             <td>

d445871

ffd7a86

client/views/pages/callcenter/QuestionSelect.jsx

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

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


             <option value="답변완료">답변완료</option>
           </select>
           <Button
-            className={"btn-small green-btn"}
+            className={"btn-small gray-btn"}
             btnName={"작성하기"}
             onClick={() => {
               navigate("/QuestionInsert");

d445871

ffd7a86

client/views/pages/equipment/EquipmentManagementSelect.jsx

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

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


 						<SubTitle explanation={"장비 클릭 시 지난 매칭이력을 확인할 수 있습니다."} />
 						<div className="btn-wrap flex-end margin-bottom ">
 							<Button
-								className={"btn-small green-btn"}
+								className={"btn-small gray-btn"}
 								btnName={"등록"}
 								onClick={openModal3}
 							/>

 												{
 													item['senior_id'] == null
 														? <Button
-															className={"btn-small green-btn"}
+															className={"btn-small gray-btn"}
 															btnName={"등록"}
 															onClick={() => seniorMatchInsertModalOpen(item)}
 														/>
 														: <Button
-															className={"btn-small green-btn"}
+															className={"btn-small gray-btn"}
 															btnName={"반납"}
 															onClick={seniorMatchDelete}
 														/>

 						<SubTitle explanation={"장비 클릭 시 지난 매칭이력을 확인할 수 있습니다."} />
 						<div className="btn-wrap flex-end margin-bottom ">
 							<Button
-								className={"btn-small green-btn"}
+								className={"btn-small gray-btn"}
 								btnName={"LOG"}
 								onClick={logCheck}
 							/>

 											{
 												item['equipment_rental_state'] == 'RENTABLE'
 													? <Button
-														className={"btn-small green-btn"}
+														className={"btn-small gray-btn"}
 														btnName={"등록"}
 														onClick={() => seniorMatchInsertModalOpen(item)}
 													/>
 													: <Button
-														className={"btn-small green-btn"}
+														className={"btn-small gray-btn"}
 														btnName={"반납"}
 														onClick={() => seniorMatchReturnModalOpen(item)}
 													/>

 											<td>
 												{
 													<Button
-														className={"btn-small green-btn"}
+														className={"btn-small gray-btn"}
 														btnName={"반납"}
 														onClick={() => seniorMatchReturnModalOpen(item)}
 													/>

 											<td>
 												{
 													<Button
-														className={"btn-small green-btn"}
+														className={"btn-small gray-btn"}
 														btnName={"등록"}
 														onClick={() => seniorMatchInsertModalOpen(item)}
 													/>

 					</div>
 					<div>
 						<Button
-							className={"btn-100 green-btn"}
+							className={"btn-100 gray-btn"}
 							btnName={"닫기"}
 							onClick={closeModal}
 						/>

 							</tbody>
 						</table>
 					</div>
-					<div>
+					<div className="flex-center">
 						<Button
-							className={"btn-100 green-btn"}
+							className={"btn-small gray-btn"}
 							btnName={"저장"}
 							onClick={closeModal3}
 						/>

 					</div>
 					<div>
 						<Button
-							className={"btn-100 green-btn"}
+							className={"btn-100 gray-btn"}
 							btnName={"닫기"}
 							onClick={seniorMatchInsertModalClose}
 						/>

 					</div>
 					<div>
 						<Button
-							className={"btn-100 green-btn"}
+							className={"btn-100 gray-btn"}
 							btnName={"닫기"}
 							onClick={seniorMatchInsertModalClose}
 						/>

 					</div>
 					<div>
 						<Button
-							className={"btn-100 green-btn"}
+							className={"btn-100 gray-btn"}
 							btnName={"닫기"}
 							onClick={seniorMatchInsertModalClose}
 						/>

d445871

ffd7a86

client/views/pages/main/Main_guardian.jsx

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

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


   return (
     <>
       <main>
+        <div><Title title={"김복남 어르신"} explanation={"방문, 복약, 온도, 배터리 현황을 확인하세요."} /></div>
         <div className="main-grid-guardian">
           <ul className="content-box statistics-guardian">
             <li className="flex-start">

             </li>
           </ul>
           <div className="content-box combine-left combine-all-government">
-            <Title title={"김복남 어르신"} explanation={"방문, 복약, 온도, 배터리 현황을 확인하세요."} />
+            
 
           </div>
         </div>

d445871

ffd7a86

client/views/pages/setting/AuthorityManagement.jsx

--- client/views/pages/setting/AuthorityManagement.jsx

+++ client/views/pages/setting/AuthorityManagement.jsx


             </tbody>
             </table>
             <div className="btn-wrap flex-end">
-              <Button className={"btn-small green-btn"} btnName={"저장"} />
+              <Button className={"btn-small gray-btn"} btnName={"저장"} />
             </div>
             <SubTitle className="margin-bottom" explanation={"각 메뉴에 대한 설명"} />
             <table className="explain-table">

d445871

ffd7a86

client/views/pages/setting/RiskSet.jsx

--- client/views/pages/setting/RiskSet.jsx

+++ client/views/pages/setting/RiskSet.jsx


                 />          
           <div className="btn-wrap flex-end margin-bottom ">
             <Button
-              className={"btn-small green-btn"}
+              className={"btn-small gray-btn"}
               btnName={"저장"}
             />
           </div>

d445871

ffd7a86

client/views/pages/user_management/AgencySelect.jsx

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

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


               </div>
               <div className="btn-wrap flex-end margin-bottom ">
                 <Button
-                  className={"btn-small green-btn"}
+                  className={"btn-small gray-btn"}
                   btnName={"등록"}
                   onClick={openModal}
                 />

d445871

ffd7a86

client/views/pages/user_management/UserAuthoriySelect_agency.jsx

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

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


 import Pagination from "../../component/Pagination.jsx";
 
 export default function UserAuthoriySelect_agency() {
-  // 화면 진입 시 탭 별 노출될ㄹ 리스트 초기화 
-  const [subjectList, setSubjectList] = React.useState([]);
-  const [subjectMyList, setSubjectMyList] = React.useState([]);
-  
+  // 화면 진입 시 탭 별 노출될 리스트 초기화 
+  const [seniortList, setSeniorList] = React.useState([]);
+  const [seniorMyList, setSeniorMyList] = React.useState([]);
 
-  //페이징 작업
-  const limit = 10; // 페이지당 보여줄 공지 개수
+  //category 설정 초기화
+  const [selectUserCode, setSelectUserCode] = React.useState("전체");
+  const [selectUserData, setSelectUserData] = React.useState("이름");
+  
+  //-------- 페이징 작업 설정 시작 --------//
+  const limit = 15; // 페이지당 보여줄 공지 개수
   const [page, setPage] = React.useState(1); //page index
   const offset = (page - 1) * limit; //게시물 위치 계산
   const [myUserTotal, setMyUserTotal] = React.useState(0); //최대길이 넣을 변수
   const [userTotal, setUserTotal] = React.useState(0); //최대길이 넣을 변수
+  //-------- 페이징 작업 설정 끝 --------//
 
   // ------ 등록 버튼 클릭 시 노출되는 모달 데이터 ------//
 

     setMedication("");
     setNote("");
   }
-  // 변경되는 데이터 Handler
+  //-------- 변경되는 데이터 Handler 설정 --------//
   const handleUserName = (e) => {
     setUserName(e.target.value);
   };

   const handleNote = (e) => {
     setNote(e.target.value);
   };
-
-  // 대상자 등록 함수 
+  const handleSelectUserCode = (e) => {
+    console.log("e.target.value : ", e.target.value)
+    setSelectUserCode(e.target.value);
+  };
+  const handleSelectUserData = (e) => {
+    console.log("e.target.value : ", e.target.value)
+    setSelectUserData(e.target.value);
+  };
+  //-------- 등록 버튼 동작 수행 영역 시작 --------//
+  // 등록 버튼 클릭 시 수행 함수
   const InsertSenior = () => {
     var insertBtn = confirm("등록하시겠습니까?");
     if (insertBtn) {

       alert("등록 되었습니다.");
       dataReset();
       closeModal3();
-      getSelectSubjectList();
-      getSelectMySubjectList();
+      getSelectSeniorList();
+      getSelectMySeniorList();
     } else {
       return;
     }

         user_birth: brith,
         user_phonenumber: telNum,
         user_address: homeAddress,
-        agency_id: 'agency1',
-        government_id: 'government1',
-        user_code: '4'
+        agency_id: 'agency01',
+        government_id: 'government01',
+        user_code: '4',
       }),
     }).then((response) => response.json()).then((data) => {
       console.log("대상자 정보 등록");
       InsertUserPillData();
     }).catch((error) => {
-      console.log('insertSeniorData() /Notice/insertSeniorData.json error : ', error);
+      console.log('insertSeniorData() /user/insertSeniorData.json error : ', error);
     });
   };
   // 대상자 약 복용 정보 등록을 위한 함수 

       console.log('InsertUserPillData() /user/insertSeniorMadication.json error : ', error);
     });
   };
+  //-------- 등록 버튼 동작 수행 영역 끝 --------//
  //select 
-  const getSelectSubjectList = () => {
+  const getSelectSeniorList = () => {
     fetch("/user/selectUserList.json", {
       method: "POST",
       headers: {
         'Content-Type': 'application/json; charset=UTF-8'
       },
       body: JSON.stringify({
+        agency_id: 'agency01',
         user_code: '4',
       }),
     }).then((response) => response.json()).then((data) => {
       const rowData = data;
       console.log(data);
-      setSubjectList(rowData)
+      setSeniorList(rowData)
       setUserTotal(rowData.length)
     }).catch((error) => {
-      console.log('getSelectSubjectList() /user/selectUserList.json error : ', error);
+      console.log('getSelectSeniorList() /user/selectUserList.json error : ', error);
     });
   };
 
-  const getSelectMySubjectList = () => {
+  const getSelectMySeniorList = () => {
     fetch("/user/selectMyUserList.json", {
       method: "POST",
       headers: {
         'Content-Type': 'application/json; charset=UTF-8'
       },
       body: JSON.stringify({
-        agency_id: 'agency1',
+        agency_id: 'agency01',
         user_code: '4',
       }),
     }).then((response) => response.json()).then((data) => {
       const rowData = data;
       console.log(data);
-      setSubjectMyList(rowData)
+      setSeniorMyList(rowData)
       setMyUserTotal(rowData.length)
     }).catch((error) => {
       console.log('getSubjectMySelect() /user/selectMyUserList.json error : ', error);

         <Table
           className={"protector-user"}
           head={thead1}
-          contents={subjectMyList}
+          contents={seniorMyList}
           contentKey={key1}
           view={"mySenior"}
           offset={offset}

         <Table
           className={"caregiver-user"}
           head={thead2}
-          contents={subjectList}
+          contents={seniortList}
           contentKey={key2}
           view={"allSenior"}
           offset={offset}

 
   
   React.useEffect(() => {
-    getSelectSubjectList();
-    getSelectMySubjectList();
+    getSelectSeniorList();
+    getSelectMySeniorList();
 
   }, [])
   return (
     <main>
-      <Modal open={modalOpen} close={closeModal} header="김복남'님의 가족">
-        <div className="board-wrap">
-          <SubTitle explanation={"최초 ID는 연락처, PW는 생년월일 8자리입니다."} className="margin-bottom" />
-          <table className="margin-bottom2 senior-insert">
-            <tr>
-              <th>이름</th>
-              <td>
-                <input type="text" />
-              </td>
-              <th>생년월일</th>
-              <td>
-                <div className="flex">
-                  <select name="year" id="year">
-                    <option value="">년</option>
-                  </select>
-                  <select name="month" id="month">
-                    <option value="">월</option>
-                  </select>
-                  <select name="days" id="days">
-                    <option value="">일</option>
-                  </select>
-                </div>
-              </td>
-            </tr>
-            <tr>
-              <th>연락처</th>
-              <td colSpan={3}>
-                <input type="input" maxLength="11" />
-              </td>
-            </tr>
-            <tr>
-              <th>대상자와의 관계</th>
-              <td colSpan={3}>
-                <input type="text" />
-              </td>
-            </tr>
-          </table>
-          <div className="btn-wrap flex-center margin-bottom5">
-            <Button
-              className={"btn-small green-btn"}
-              btnName={"추가"}
-              onClick={() => {
-                navigate("/SeniorInsert");
-              }}
-            />
-          </div>
-          <div>
-            <Table
-              className={"caregiver-user"}
-              head={thead3}
-              contents={content3}
-              contentKey={key3}
-            />
-          </div>
-        </div>
-      </Modal>
-      <Modal open={modalOpen2} close={closeModal2} header="담당자 배정">
-        <div className="board-wrap">
-          <SubTitle explanation={"담당자 선택"} className="margin-bottom" />
-          <div className="flex-start protectorlist margin-bottom5">
-            <input type="text" list="protectorlist" />
-            <datalist id="protectorlist">
-              <option value="보호사1(ID)"></option>
-              <option value="보호사2(ID)"></option>
-              <option value="보호사3(ID)"></option>
-            </datalist>
-            <div className="btn-wrap">
-              <Button
-                className={"btn-small green-btn"}
-                btnName={"등록"}
-              />
-            </div>
-          </div>
-          <div>
-            <Table
-              className={"caregiver-user"}
-              head={thead4}
-              contents={content4}
-              contentKey={key4}
-            />
-          </div>
-        </div>
-      </Modal>
       <Modal open={modalOpen3} close={closeModal3} header="대상자 등록">
         <div className="board-wrap">
           <SubTitle explanation={"회원 등록 시 ID는 연락처, 패스워드는 생년월일 8자리입니다."} className="margin-bottom" />

             <li
               key={item.id}
               className={index === item.id ? "active" : null}
-              onClick={() => setIndex(item.id)}
+              onClick={() => {setIndex(item.id); setPage(1)}}
             >
               {item.title}
             </li>

         </ul>
         <div className="content-wrap">
           <div className="search-management flex-start margin-bottom2">
-            <select name="management-agency">
+            <select name="management-agency" onChange={handleSelectUserCode} value={selectUserCode}>
               <option value="기관전체">전체</option>
-              <option value="군위군청">대상자</option>
-              <option value="대구보훈병원">복지사</option>
-              <option value="대구보훈병원">보호자</option>
+              <option value="대상자">대상자</option>
+              <option value="담당자">담당자</option>
+              <option value="보호자">보호자</option>
             </select>
-            <select>
+            <select onChange={handleSelectUserData} value={selectUserData}>
               <option value="이름">이름</option>
               <option value="아이디">아이디</option>
-              <option value="아이디">등록번호</option>
+              <option value="등록번호">등록번호</option>
             </select>
             <input type="text" />
             <Button

               ))}
           </ul>
           <div>
-            <Pagination total={data.id == 1 ? myUserTotal:userTotal} limit={limit} page={page} setPage={setPage} />
+            <Pagination total={index === 1 ? myUserTotal:userTotal} limit={limit} page={page} setPage={setPage} />
           </div>
         </div>
       </div>

...	...	@@ -190,8 +190,8 @@
190	190
191	191	return (
192	192	<div className="search-group">
193		- <div className="search-area flex">
194		- <div className="detail-search" style={{padding:"0 5rem", width:"100%"}}>
	193	+ <div className="search-area flex" style={{ width:"50%"}}>
	194	+ <div className="detail-search" style={{ width:"85%"}}>
195	195	<table>
196	196	<tbody>
197	197	<tr>
...	...	@@ -212,8 +212,8 @@
212	212	</tbody>
213	213	</table>
214	214	</div>
215		- <div className="btn-box flex-center">
216		- <Button className={"btn-large green-btn"} btnName={"조회"} />
	215	+ <div className="btn-box flex-center" style={{ width:"15%"}}>
	216	+ <Button className={"btn-small gray-btn"} btnName={"조회"} />
217	217	</div>
218	218	</div>
219	219	</div>

...	...	@@ -622,8 +622,11 @@
622	622	function AgencyAppRoute() {
623	623	return (
624	624	<Routes>
	625	+ <Route path="/Medicalcare" element={<Medicalcare />}></Route>
	626	+ <Route path="/Healthcare" element={<Healthcare />}></Route>
625	627	<Route path="/Join" element={<Join />}></Route>
626	628	<Route path="/QuestionSelect" element={<QuestionSelect />}></Route>
	629	+ <Route path="/QuestionInsert" element={<QuestionInsert />}></Route>
627	630	<Route path="/Main_agency" element={<Main_agency />}></Route>
628	631	<Route path="/UserAuthoriySelect_agency" element={<UserAuthoriySelect_agency />}></Route>
629	632	<Route path="/SeniorInsert" element={<SeniorInsert />}></Route>

...	...	@@ -753,7 +753,7 @@
753	753	<SubTitle explanation={"장비 클릭 시 지난 매칭이력을 확인할 수 있습니다."} />
754	754	<div className="btn-wrap flex-end margin-bottom ">
755	755	<Button
756		- className={"btn-small green-btn"}
	756	+ className={"btn-small gray-btn"}
757	757	btnName={"등록"}
758	758	onClick={openModal3}
759	759	/>
...	...	@@ -789,12 +789,12 @@
789	789	{
790	790	item['senior_id'] == null
791	791	? <Button
792		- className={"btn-small green-btn"}
	792	+ className={"btn-small gray-btn"}
793	793	btnName={"등록"}
794	794	onClick={() => seniorMatchInsertModalOpen(item)}
795	795	/>
796	796	: <Button
797		- className={"btn-small green-btn"}
	797	+ className={"btn-small gray-btn"}
798	798	btnName={"반납"}
799	799	onClick={seniorMatchDelete}
800	800	/>
...	...	@@ -846,7 +846,7 @@
846	846	<SubTitle explanation={"장비 클릭 시 지난 매칭이력을 확인할 수 있습니다."} />
847	847	<div className="btn-wrap flex-end margin-bottom ">
848	848	<Button
849		- className={"btn-small green-btn"}
	849	+ className={"btn-small gray-btn"}
850	850	btnName={"LOG"}
851	851	onClick={logCheck}
852	852	/>
...	...	@@ -891,12 +891,12 @@
891	891	{
892	892	item['equipment_rental_state'] == 'RENTABLE'
893	893	? <Button
894		- className={"btn-small green-btn"}
	894	+ className={"btn-small gray-btn"}
895	895	btnName={"등록"}
896	896	onClick={() => seniorMatchInsertModalOpen(item)}
897	897	/>
898	898	: <Button
899		- className={"btn-small green-btn"}
	899	+ className={"btn-small gray-btn"}
900	900	btnName={"반납"}
901	901	onClick={() => seniorMatchReturnModalOpen(item)}
902	902	/>
...	...	@@ -938,7 +938,7 @@
938	938	<td>
939	939	{
940	940	<Button
941		- className={"btn-small green-btn"}
	941	+ className={"btn-small gray-btn"}
942	942	btnName={"반납"}
943	943	onClick={() => seniorMatchReturnModalOpen(item)}
944	944	/>
...	...	@@ -982,7 +982,7 @@
982	982	<td>
983	983	{
984	984	<Button
985		- className={"btn-small green-btn"}
	985	+ className={"btn-small gray-btn"}
986	986	btnName={"등록"}
987	987	onClick={() => seniorMatchInsertModalOpen(item)}
988	988	/>
...	...	@@ -1017,7 +1017,7 @@
1017	1017	</div>
1018	1018	<div>
1019	1019	<Button
1020		- className={"btn-100 green-btn"}
	1020	+ className={"btn-100 gray-btn"}
1021	1021	btnName={"닫기"}
1022	1022	onClick={closeModal}
1023	1023	/>
...	...	@@ -1051,9 +1051,9 @@
1051	1051	</tbody>
1052	1052	</table>
1053	1053	</div>
1054		- <div>
	1054	+ <div className="flex-center">
1055	1055	<Button
1056		- className={"btn-100 green-btn"}
	1056	+ className={"btn-small gray-btn"}
1057	1057	btnName={"저장"}
1058	1058	onClick={closeModal3}
1059	1059	/>
...	...	@@ -1103,7 +1103,7 @@
1103	1103	</div>
1104	1104	<div>
1105	1105	<Button
1106		- className={"btn-100 green-btn"}
	1106	+ className={"btn-100 gray-btn"}
1107	1107	btnName={"닫기"}
1108	1108	onClick={seniorMatchInsertModalClose}
1109	1109	/>
...	...	@@ -1148,7 +1148,7 @@
1148	1148	</div>
1149	1149	<div>
1150	1150	<Button
1151		- className={"btn-100 green-btn"}
	1151	+ className={"btn-100 gray-btn"}
1152	1152	btnName={"닫기"}
1153	1153	onClick={seniorMatchInsertModalClose}
1154	1154	/>
...	...	@@ -1185,7 +1185,7 @@
1185	1185	</div>
1186	1186	<div>
1187	1187	<Button
1188		- className={"btn-100 green-btn"}
	1188	+ className={"btn-100 gray-btn"}
1189	1189	btnName={"닫기"}
1190	1190	onClick={seniorMatchInsertModalClose}
1191	1191	/>

...	...	@@ -176,7 +176,7 @@
176	176	</tbody>
177	177	</table>
178	178	<div className="btn-wrap flex-end">
179		- <Button className={"btn-small green-btn"} btnName={"저장"} />
	179	+ <Button className={"btn-small gray-btn"} btnName={"저장"} />
180	180	</div>
181	181	<SubTitle className="margin-bottom" explanation={"각 메뉴에 대한 설명"} />
182	182	<table className="explain-table">

...	...	@@ -139,7 +139,7 @@
139	139	/>
140	140	<div className="btn-wrap flex-end margin-bottom ">
141	141	<Button
142		- className={"btn-small green-btn"}
	142	+ className={"btn-small gray-btn"}
143	143	btnName={"저장"}
144	144	/>
145	145	</div>

...	...	@@ -39,12 +39,12 @@
39	39	}
40	40	.nav{
41	41	position: relative;
42		- box-shadow: 1px 1px 5px 1px rgb(0 0 0 / 20%);}
	42	+ background: #ffffff;
	43	+}
43	44	.logo {
44	45	padding: 2rem 1rem;
45	46	font-size: large;
46	47	text-align: center;
47		- background: #ffffff;
48	48	font-weight: bold;
49	49	}
50	50	.logo img{width: 273px;}
...	...	@@ -55,7 +55,7 @@
55	55	color: #333333;
56	56	font-weight: bold;
57	57	margin: 0 3rem;
58		- padding: 1rem 6.2rem;
	58	+ padding: 1rem 3.2rem;
59	59
60	60	}
61	61
...	...	@@ -64,17 +64,14 @@
64	64	display: block;
65	65	}
66	66	.sidebar-title {
67		- margin: 0 auto;
68		- width: 150px;
69		- padding: 1rem;
	67	+ margin: 0 3rem;
	68	+ padding: 1rem 3.2rem;
70	69	}
71	70
72	71	.sidebar-title span {
73	72	font-weight: bold;
74		- color: #333333;
75		-
76		- font-family:"KoPubDotumLight";
77		-
	73	+ color: #333333;
	74	+ font-family:"KoPubDotumLight";
78	75	}
79	76
80	77	.sidebar-title .toggle {
...	...	@@ -86,14 +83,15 @@
86	83	}
87	84	nav li{cursor: pointer;}
88	85	.sidebar-item{font-size: 1.8rem;}
89		-.sidebar-item:hover{background: #f25430; color: #ffffff;}
	86	+.sidebar-item:hover{background: #f25430; color: #ffffff; width: 90%; border-top-right-radius: 50px; border-bottom-right-radius: 50px; }
90	87	.sidebar-item:hover a{color: #ffffff;}
91	88	.sidebar-item:hover span, .sidebar-item:hover .toggle{color: #ffffff;}
	89	+.sidebar-item:hover span, .sidebar-item:hover .MuiSvgIcon-root{color: #ffffff;}
92	90	.sidebar-content {
93	91	display: none;
94	92	color: #ffffff;
95	93	}
96		-.sidebar-content a{padding: 1rem 0 1rem 6rem;}
	94	+.sidebar-content a{padding: 1rem 0 1rem 5rem;}
97	95	.sidebar-item.open>.sidebar-content {
98	96	height: auto;
99	97	display: block;
...	...	@@ -106,6 +104,8 @@
106	104
107	105	.sidebar-content .sidebar-item:hover a {
108	106	font-weight: bold;
	107	+ background: #f1bdb1;
	108	+ color: #ffffff;
109	109	}
110	110	.info-wrap .usericon{width: 5rem; height: 5rem; border: 1px solid #f25430; border-radius: 50px; margin-right: 2rem;}
111	111	.header-info-id{font-size: 1.6rem; margin-right: 2rem; color: #733c1d; font-weight: 600;}

...	...	@@ -17,12 +17,15 @@
17	17	background-color: #18924e;
18	18	}
19	19
	20	+/* 기관조회 */
20	21
21	22	/* Q&A */
22	23	.title{text-decoration: underline; cursor: pointer;}
23	24	.question-select input{width: 3%;}
24	25	.question-select label{width: 10%;}
25		-.question-select select{width: 16%;}
	26	+.question-select select{width: 16%; height: 3.7rem;}
	27	+.qna-insert select{height: 3.7rem;}
	28	+.qna-insert th{font-size: 1.8rem; color: #733c1d;}
26	29	/* 담당자배정 */
27	30	.protectorlist input{width: 20rem;}
28	31	/* 위험기준관리 */
...	...	@@ -39,7 +42,8 @@
39	42	/* 카테고리 기관 추가*/
40	43	.explain-table th{background: #ffffff;}
41	44	.react-calendar{width: 100%;}
42		-.total p{font-size: 1.6rem;}
	45	+.total p{font-size: 1.6rem; font-weight: 600;}
	46	+.total{color: #733c1d; }
43	47	.total-equip::before{
44	48	content: "";
45	49	border-left: 20px solid #5a70df;
...	...	@@ -542,11 +546,6 @@
542	546	width: 100%;
543	547	margin-bottom: 2rem;
544	548	}
545		-
546		-.search-group .btn-box {
547		- padding-bottom: 0.5rem;
548		-}
549		-
550	549	.detail-search table {
551	550	border-top: none;
552	551	border-bottom: none;
...	...	@@ -560,7 +559,7 @@
560	559	}
561	560
562	561	.detail-search table th {
563		- width: 14%;
	562	+ width: 20%;
564	563	}
565	564
566	565	.detail-search table td {
...	...	@@ -569,6 +568,9 @@
569	568
570	569	.detail-search tbody tr:nth-of-type(2) select {
571	570	width: 24.4%;
	571	+}
	572	+.detail-search tbody select {
	573	+ height: 3.7rem;
572	574	}
573	575
574	576	.detail-search tbody tr:nth-of-type(3) td {
...	...	@@ -597,7 +599,7 @@
597	599	.search-area {
598	600	padding: 2rem;
599	601	}
600		-
	602	+.search-area button{width: 100%;}
601	603	.search-area details {
602	604	margin-top: 1rem;
603	605	}
...	...	@@ -689,8 +691,11 @@
689	691	}
690	692
691	693	.senior-insert label {
692		- padding: 0 4rem 0 1rem;
693		-
	694	+ padding: 0 0rem 0 1rem;
	695	+ width: 5rem;
	696	+}
	697	+.senior-insert tr:nth-child(5) input{
	698	+ width: 2rem;
694	699	}
695	700	.senior-insert select{padding: 1rem;}
696	701	.senior-insert tr:nth-child(2) .gender {
...	...	@@ -931,7 +936,7 @@
931	936
932	937	.search-management input {
933	938	width: 20%;
934		- height: 3rem;
	939	+ height: 3.7rem;
935	940	margin-right: 1rem;
936	941	}
937	942	.tab-container>div>div:nth-child(2) {
...	...	@@ -973,4 +978,11 @@
973	978
974	979	.mobile{
975	980	display: none;
	981	+}
	982	+
	983	+/* -------------- 페이징 버튼 색상 적용 ----------------- */
	984	+.PagingBtn{
	985	+ background-color: #ff7f50;
	986	+ color: #ffffff;
	987	+
976	988	} (No newline at end of file)

...	...	@@ -1,7 +1,7 @@
1		-@font-face {
	1	+/* @font-face {
2	2	font-family: "KoPubDotumLight";
3	3	src: url(../files/font/KoPubDotumLight_0.ttf);
4		-}
	4	+} */
5	5
6	6	:root{
7	7	--font-KoPubDotumLight:"KoPubDotumLight"
...	...	@@ -45,6 +45,7 @@
45	45	width: 100%;
46	46	border-collapse: collapse;
47	47	font-family:"AuctionGothic_Medium";
	48	+ border: 1px solid #d8d3c7;
48	49	}
49	50	thead{
50	51	font-weight: bold;

...	...	@@ -9,7 +9,7 @@
9	9	<Paging>
10	10	<button onClick={() => setPage(page - 1)} disabled={page === 1}><</button>
11	11	{Array(numPages).fill().map((_, i) => (
12		- <button key={i + 1} onClick={() => setPage(i + 1)} aria-current={page === i + 1 ? "page" : null}> {i + 1} </button>
	12	+ <button key={i + 1} onClick={() => setPage(i + 1)} aria-current={page === i + 1 ? "page" : null} className={page === i + 1 ? "PagingBtn" : null}> {i + 1} </button>
13	13	))}
14	14	<button onClick={() => setPage(page + 1)} disabled={page === numPages}>></button>
15	15	</Paging>
...	...	@@ -23,4 +23,5 @@
23	23	align-items: center;
24	24	gap: 4px;
25	25	margin: 16px;
26		-`; (No newline at end of file)
	26	+`;
	27	+

...	...	@@ -1,8 +1,13 @@
1	1	import React from "react";
2	2	import Button from "./Button.jsx";
	3	+import Modal from "./MatchingModal.jsx";
	4	+import Modal2 from "./Modal.jsx";
	5	+import SubTitle from "./SubTitle.jsx";
	6	+
3	7	// import styled from "styled-components";
4	8
5		-export default function Table({ head, contents, contentKey, onClick, className, view, offset, limit}) {
	9	+export default function Table({ head, contents, contentKey, onClick, className, view, offset, limit }) {
	10	+ const [userName, setUserName] = React.useState("");
6	11	const [modalOpen, setModalOpen] = React.useState(false);
7	12	const openModal = () => {
8	13	setModalOpen(true);
...	...	@@ -12,24 +17,57 @@
12	17	const openModal2 = () => {
13	18	setModalOpen2(true);
14	19	};
15		-
16	20
	21	+ const closeModal = () => {
	22	+ setModalOpen(false);
	23	+ };
	24	+
	25	+ const closeModal2 = () => {
	26	+ setModalOpen2(false);
	27	+ };
	28	+
	29	+ // 보호자 등록페이지 데이터
	30	+ const thead3 = [
	31	+ "No",
	32	+ "이름",
	33	+ "생년월일",
	34	+ "연락처",
	35	+ "대상자와의 관계",
	36	+ ];
	37	+ const key3 = [
	38	+ "No",
	39	+ "name",
	40	+ "birth",
	41	+ "phone",
	42	+ "relationship",
	43	+ ];
	44	+ const content3 = [
	45	+ {
	46	+ No: 1,
	47	+ name: "김훈",
	48	+ birth: "1965.01.01",
	49	+ relationship: "아들",
	50	+ phone: "010-1234-1234",
	51	+ },
	52	+ ];
	53	+
	54	+
17	55	const buttonPrint = () => {
18		- if(view == 'mySenior'){
19		- return(
20		- <td>
21		- <Button
22		- className={"btn-small gray-btn"}
23		- btnName={"보기"}
24		- onClick={openModal}
25		- />
26		- </td>)
	56	+ if (view == 'mySenior') {
	57	+ return (
	58	+ <td>
	59	+ <Button
	60	+ className={"btn-small gray-btn"}
	61	+ btnName={"보기"}
	62	+ onClick={openModal}
	63	+ />
	64	+ </td>)
27	65	}
28		- else if(view == 'allSenior'){
29		- return(
	66	+ else if (view == 'allSenior') {
	67	+ return (
30	68	<>
31	69	<td>
32		- <Button
	70	+ <Button
33	71	className={"btn-small gray-btn"}
34	72	btnName={"선택"}
35	73	onClick={openModal2}
...	...	@@ -41,46 +79,99 @@
41	79	btnName={"보기"}
42	80	onClick={openModal}
43	81	/>
44		- </td>
45		- </>
	82	+ </td>
	83	+ </>
46	84	)
47	85	}
48	86	}
49		-
	87	+
50	88	return (
51		- <table className={className}>
52		- <thead>
53		- <tr>
54		- {head.map((i) => {
55		- return <th>{i}</th>;
56		- })}
57		- </tr>
58		- </thead>
59		- <tbody>
60		- {contents.slice(offset, offset + limit).map((i, index) => {
61		- return (
62		- <tr key={index}>
63		- {/* // <td>{i.rn}</td>
64		- // <td>{i.user_name}</td>
65		- // <td>{i.user_phonenumber}</td>
66		- // <td>{i.user_gender}</td>
67		- // <td>{i.user_birth}</td>
68		- // <td>{i.user_address}</td>
69		- // {buttonPrint()} */}
70		- {contentKey.map((kes) => {
71		- return (
72		- <>
73		- <td onClick={onClick}>{i[kes]}</td>
74		- </>
75		- )
76		- })}
77		- {buttonPrint()}
	89	+ <>
	90	+ <Modal open={modalOpen2} close={closeModal2} header="담당자 배정" />
	91	+ <Modal2 open={modalOpen} close={closeModal} header={userName+"님의 가족"}>
	92	+ <div className="board-wrap">
	93	+ <SubTitle explanation={"최초 ID는 연락처, PW는 생년월일 8자리입니다."} className="margin-bottom" />
	94	+ <table className="margin-bottom2 senior-insert">
	95	+ <tr>
	96	+ <th>이름</th>
	97	+ <td>
	98	+ <input type="text" />
	99	+ </td>
	100	+ <th>생년월일</th>
	101	+ <td>
	102	+ <div className="flex">
	103	+ <select name="year" id="year">
	104	+ <option value="">년</option>
	105	+ </select>
	106	+ <select name="month" id="month">
	107	+ <option value="">월</option>
	108	+ </select>
	109	+ <select name="days" id="days">
	110	+ <option value="">일</option>
	111	+ </select>
	112	+ </div>
	113	+ </td>
78	114	</tr>
79		- );
80		- })}
81		- </tbody>
82		- </table>
83		-
	115	+ <tr>
	116	+ <th>연락처</th>
	117	+ <td colSpan={3}>
	118	+ <input type="input" maxLength="11" />
	119	+ </td>
	120	+ </tr>
	121	+ <tr>
	122	+ <th>대상자와의 관계</th>
	123	+ <td colSpan={3}>
	124	+ <input type="text" />
	125	+ </td>
	126	+ </tr>
	127	+ </table>
	128	+ <div className="btn-wrap flex-center margin-bottom5">
	129	+ <Button
	130	+ className={"btn-small green-btn"}
	131	+ btnName={"추가"}
	132	+ onClick={() => {
	133	+ navigate("/SeniorInsert");
	134	+ }}
	135	+ />
	136	+ </div>
	137	+ <div>
	138	+ <Table
	139	+ className={"caregiver-user"}
	140	+ head={thead3}
	141	+ contents={content3}
	142	+ contentKey={key3}
	143	+ />
	144	+ </div>
	145	+ </div>
	146	+ </Modal2>
	147	+ <table className={className}>
	148	+ <thead>
	149	+ <tr>
	150	+ {head.map((i) => {
	151	+ return <th>{i}</th>;
	152	+ })}
	153	+ </tr>
	154	+ </thead>
	155	+ <tbody>
	156	+ {contents.slice(offset, offset + limit).map((i, index) => {
	157	+ const name = i.user_name;
	158	+ return (
	159	+ <tr key={index}>
	160	+ {contentKey.map((kes) => {
	161	+ return (
	162	+ <>
	163	+ <td onClick={onClick}>{i[kes]}</td>
	164	+ {console.log("userName : ", userName)}
	165	+ </>
	166	+ )
	167	+ })}
	168	+ {buttonPrint()}
	169	+ </tr>
	170	+ );
	171	+ })}
	172	+ </tbody>
	173	+ </table>
	174	+ </>
84	175	);
85	176	}
86	177

...	...	@@ -26,8 +26,8 @@
26	26	};
27	27
28	28
29		- const menuItems = GovernmentApp.menuItems; //AdminApp, GovernmentApp, AllApp, AgencyApp, GuardianApp
30		- const AppRoute = GovernmentApp.AppRoute;
	29	+ const menuItems = GuardianApp.menuItems; //AdminApp, GovernmentApp, AllApp, AgencyApp, GuardianApp
	30	+ const AppRoute = GuardianApp.AppRoute;
31	31
32	32
33	33	const { title } = menuItems.find(

...	...	@@ -11,7 +11,7 @@
11	11	<div className="content-wrap row">
12	12	<ContentTitle contentTitle={"문의글 작성"} />
13	13	<SubTitle explanation={"작성자 정보"} />
14		- <table className="margin-bottom2 senior-insert">
	14	+ <table className="margin-bottom2 qna-insert">
15	15	<tr>
16	16	<th>작성자</th>
17	17	<td>
...	...	@@ -51,7 +51,7 @@
51	51	</tr>
52	52	</table>
53	53	<SubTitle explanation={"대상자 정보"} />
54		- <table className="margin-bottom2 senior-insert">
	54	+ <table className="margin-bottom2 qna-insert">
55	55	<tr>
56	56	<th>대상자 선택</th>
57	57	<td colSpan={3} className="flex width">
...	...	@@ -102,7 +102,7 @@
102	102	}}
103	103	/>
104	104	<Button
105		- className={"btn-large green-btn"}
	105	+ className={"btn-large red-btn"}
106	106	btnName={"등록"}
107	107	onClick={() => {
108	108	navigate("/QandASelect");

...	...	@@ -4,14 +4,14 @@
4	4	import SubTitle from "../../component/SubTitle.jsx";
5	5	import { useNavigate } from "react-router";
6	6
7		-export default function QandAInsert() {
	7	+export default function QuestionInsert() {
8	8	const navigate = useNavigate();
9	9	return (
10	10	<main>
11	11	<div className="content-wrap row">
12	12	<ContentTitle contentTitle={"문의글 작성"} />
13	13	<SubTitle explanation={"작성자 정보"} />
14		- <table className="margin-bottom2 senior-insert">
	14	+ <table className="margin-bottom2 qna-insert">
15	15	<tr>
16	16	<th>작성자</th>
17	17	<td>

...	...	@@ -51,7 +51,7 @@
51	51	<option value="답변완료">답변완료</option>
52	52	</select>
53	53	<Button
54		- className={"btn-small green-btn"}
	54	+ className={"btn-small gray-btn"}
55	55	btnName={"작성하기"}
56	56	onClick={() => {
57	57	navigate("/QuestionInsert");

...	...	@@ -65,6 +65,7 @@
65	65	return (
66	66	<>
67	67	<main>
	68	+ <div><Title title={"김복남 어르신"} explanation={"방문, 복약, 온도, 배터리 현황을 확인하세요."} /></div>
68	69	<div className="main-grid-guardian">
69	70	<ul className="content-box statistics-guardian">
70	71	<li className="flex-start">
...	...	@@ -134,7 +135,7 @@
134	135	</li>
135	136	</ul>
136	137	<div className="content-box combine-left combine-all-government">
137		- <Title title={"김복남 어르신"} explanation={"방문, 복약, 온도, 배터리 현황을 확인하세요."} />
	138	+
138	139
139	140	</div>
140	141	</div>

...	...	@@ -144,7 +144,7 @@
144	144	</div>
145	145	<div className="btn-wrap flex-end margin-bottom ">
146	146	<Button
147		- className={"btn-small green-btn"}
	147	+ className={"btn-small gray-btn"}
148	148	btnName={"등록"}
149	149	onClick={openModal}
150	150	/>

...	...	@@ -7,17 +7,21 @@
7	7	import Pagination from "../../component/Pagination.jsx";
8	8
9	9	export default function UserAuthoriySelect_agency() {
10		- // 화면 진입 시 탭 별 노출될ㄹ 리스트 초기화
11		- const [subjectList, setSubjectList] = React.useState([]);
12		- const [subjectMyList, setSubjectMyList] = React.useState([]);
13		-
	10	+ // 화면 진입 시 탭 별 노출될 리스트 초기화
	11	+ const [seniortList, setSeniorList] = React.useState([]);
	12	+ const [seniorMyList, setSeniorMyList] = React.useState([]);
14	13
15		- //페이징 작업
16		- const limit = 10; // 페이지당 보여줄 공지 개수
	14	+ //category 설정 초기화
	15	+ const [selectUserCode, setSelectUserCode] = React.useState("전체");
	16	+ const [selectUserData, setSelectUserData] = React.useState("이름");
	17	+
	18	+ //-------- 페이징 작업 설정 시작 --------//
	19	+ const limit = 15; // 페이지당 보여줄 공지 개수
17	20	const [page, setPage] = React.useState(1); //page index
18	21	const offset = (page - 1) * limit; //게시물 위치 계산
19	22	const [myUserTotal, setMyUserTotal] = React.useState(0); //최대길이 넣을 변수
20	23	const [userTotal, setUserTotal] = React.useState(0); //최대길이 넣을 변수
	24	+ //-------- 페이징 작업 설정 끝 --------//
21	25
22	26	// ------ 등록 버튼 클릭 시 노출되는 모달 데이터 ------//
23	27
...	...	@@ -46,7 +50,7 @@
46	50	setMedication("");
47	51	setNote("");
48	52	}
49		- // 변경되는 데이터 Handler
	53	+ //-------- 변경되는 데이터 Handler 설정 --------//
50	54	const handleUserName = (e) => {
51	55	setUserName(e.target.value);
52	56	};
...	...	@@ -78,8 +82,16 @@
78	82	const handleNote = (e) => {
79	83	setNote(e.target.value);
80	84	};
81		-
82		- // 대상자 등록 함수
	85	+ const handleSelectUserCode = (e) => {
	86	+ console.log("e.target.value : ", e.target.value)
	87	+ setSelectUserCode(e.target.value);
	88	+ };
	89	+ const handleSelectUserData = (e) => {
	90	+ console.log("e.target.value : ", e.target.value)
	91	+ setSelectUserData(e.target.value);
	92	+ };
	93	+ //-------- 등록 버튼 동작 수행 영역 시작 --------//
	94	+ // 등록 버튼 클릭 시 수행 함수
83	95	const InsertSenior = () => {
84	96	var insertBtn = confirm("등록하시겠습니까?");
85	97	if (insertBtn) {
...	...	@@ -87,8 +99,8 @@
87	99	alert("등록 되었습니다.");
88	100	dataReset();
89	101	closeModal3();
90		- getSelectSubjectList();
91		- getSelectMySubjectList();
	102	+ getSelectSeniorList();
	103	+ getSelectMySeniorList();
92	104	} else {
93	105	return;
94	106	}
...	...	@@ -107,15 +119,15 @@
107	119	user_birth: brith,
108	120	user_phonenumber: telNum,
109	121	user_address: homeAddress,
110		- agency_id: 'agency1',
111		- government_id: 'government1',
112		- user_code: '4'
	122	+ agency_id: 'agency01',
	123	+ government_id: 'government01',
	124	+ user_code: '4',
113	125	}),
114	126	}).then((response) => response.json()).then((data) => {
115	127	console.log("대상자 정보 등록");
116	128	InsertUserPillData();
117	129	}).catch((error) => {
118		- console.log('insertSeniorData() /Notice/insertSeniorData.json error : ', error);
	130	+ console.log('insertSeniorData() /user/insertSeniorData.json error : ', error);
119	131	});
120	132	};
121	133	// 대상자 약 복용 정보 등록을 위한 함수
...	...	@@ -139,40 +151,42 @@
139	151	console.log('InsertUserPillData() /user/insertSeniorMadication.json error : ', error);
140	152	});
141	153	};
	154	+ //-------- 등록 버튼 동작 수행 영역 끝 --------//
142	155	//select
143		- const getSelectSubjectList = () => {
	156	+ const getSelectSeniorList = () => {
144	157	fetch("/user/selectUserList.json", {
145	158	method: "POST",
146	159	headers: {
147	160	'Content-Type': 'application/json; charset=UTF-8'
148	161	},
149	162	body: JSON.stringify({
	163	+ agency_id: 'agency01',
150	164	user_code: '4',
151	165	}),
152	166	}).then((response) => response.json()).then((data) => {
153	167	const rowData = data;
154	168	console.log(data);
155		- setSubjectList(rowData)
	169	+ setSeniorList(rowData)
156	170	setUserTotal(rowData.length)
157	171	}).catch((error) => {
158		- console.log('getSelectSubjectList() /user/selectUserList.json error : ', error);
	172	+ console.log('getSelectSeniorList() /user/selectUserList.json error : ', error);
159	173	});
160	174	};
161	175
162		- const getSelectMySubjectList = () => {
	176	+ const getSelectMySeniorList = () => {
163	177	fetch("/user/selectMyUserList.json", {
164	178	method: "POST",
165	179	headers: {
166	180	'Content-Type': 'application/json; charset=UTF-8'
167	181	},
168	182	body: JSON.stringify({
169		- agency_id: 'agency1',
	183	+ agency_id: 'agency01',
170	184	user_code: '4',
171	185	}),
172	186	}).then((response) => response.json()).then((data) => {
173	187	const rowData = data;
174	188	console.log(data);
175		- setSubjectMyList(rowData)
	189	+ setSeniorMyList(rowData)
176	190	setMyUserTotal(rowData.length)
177	191	}).catch((error) => {
178	192	console.log('getSubjectMySelect() /user/selectMyUserList.json error : ', error);
...	...	@@ -387,7 +401,7 @@
387	401	<Table
388	402	className={"protector-user"}
389	403	head={thead1}
390		- contents={subjectMyList}
	404	+ contents={seniorMyList}
391	405	contentKey={key1}
392	406	view={"mySenior"}
393	407	offset={offset}
...	...	@@ -402,7 +416,7 @@
402	416	<Table
403	417	className={"caregiver-user"}
404	418	head={thead2}
405		- contents={subjectList}
	419	+ contents={seniortList}
406	420	contentKey={key2}
407	421	view={"allSenior"}
408	422	offset={offset}
...	...	@@ -416,95 +430,12 @@
416	430
417	431
418	432	React.useEffect(() => {
419		- getSelectSubjectList();
420		- getSelectMySubjectList();
	433	+ getSelectSeniorList();
	434	+ getSelectMySeniorList();
421	435
422	436	}, [])
423	437	return (
424	438	<main>
425		- <Modal open={modalOpen} close={closeModal} header="김복남'님의 가족">
426		- <div className="board-wrap">
427		- <SubTitle explanation={"최초 ID는 연락처, PW는 생년월일 8자리입니다."} className="margin-bottom" />
428		- <table className="margin-bottom2 senior-insert">
429		- <tr>
430		- <th>이름</th>
431		- <td>
432		- <input type="text" />
433		- </td>
434		- <th>생년월일</th>
435		- <td>
436		- <div className="flex">
437		- <select name="year" id="year">
438		- <option value="">년</option>
439		- </select>
440		- <select name="month" id="month">
441		- <option value="">월</option>
442		- </select>
443		- <select name="days" id="days">
444		- <option value="">일</option>
445		- </select>
446		- </div>
447		- </td>
448		- </tr>
449		- <tr>
450		- <th>연락처</th>
451		- <td colSpan={3}>
452		- <input type="input" maxLength="11" />
453		- </td>
454		- </tr>
455		- <tr>
456		- <th>대상자와의 관계</th>
457		- <td colSpan={3}>
458		- <input type="text" />
459		- </td>
460		- </tr>
461		- </table>
462		- <div className="btn-wrap flex-center margin-bottom5">
463		- <Button
464		- className={"btn-small green-btn"}
465		- btnName={"추가"}
466		- onClick={() => {
467		- navigate("/SeniorInsert");
468		- }}
469		- />
470		- </div>
471		- <div>
472		- <Table
473		- className={"caregiver-user"}
474		- head={thead3}
475		- contents={content3}
476		- contentKey={key3}
477		- />
478		- </div>
479		- </div>
480		- </Modal>
481		- <Modal open={modalOpen2} close={closeModal2} header="담당자 배정">
482		- <div className="board-wrap">
483		- <SubTitle explanation={"담당자 선택"} className="margin-bottom" />
484		- <div className="flex-start protectorlist margin-bottom5">
485		- <input type="text" list="protectorlist" />
486		- <datalist id="protectorlist">
487		- <option value="보호사1(ID)"></option>
488		- <option value="보호사2(ID)"></option>
489		- <option value="보호사3(ID)"></option>
490		- </datalist>
491		- <div className="btn-wrap">
492		- <Button
493		- className={"btn-small green-btn"}
494		- btnName={"등록"}
495		- />
496		- </div>
497		- </div>
498		- <div>
499		- <Table
500		- className={"caregiver-user"}
501		- head={thead4}
502		- contents={content4}
503		- contentKey={key4}
504		- />
505		- </div>
506		- </div>
507		- </Modal>
508	439	<Modal open={modalOpen3} close={closeModal3} header="대상자 등록">
509	440	<div className="board-wrap">
510	441	<SubTitle explanation={"회원 등록 시 ID는 연락처, 패스워드는 생년월일 8자리입니다."} className="margin-bottom" />
...	...	@@ -609,7 +540,7 @@
609	540	<li
610	541	key={item.id}
611	542	className={index === item.id ? "active" : null}
612		- onClick={() => setIndex(item.id)}
	543	+ onClick={() => {setIndex(item.id); setPage(1)}}
613	544	>
614	545	{item.title}
615	546	</li>
...	...	@@ -617,16 +548,16 @@
617	548	</ul>
618	549	<div className="content-wrap">
619	550	<div className="search-management flex-start margin-bottom2">
620		- <select name="management-agency">
	551	+ <select name="management-agency" onChange={handleSelectUserCode} value={selectUserCode}>
621	552	<option value="기관전체">전체</option>
622		- <option value="군위군청">대상자</option>
623		- <option value="대구보훈병원">복지사</option>
624		- <option value="대구보훈병원">보호자</option>
	553	+ <option value="대상자">대상자</option>
	554	+ <option value="담당자">담당자</option>
	555	+ <option value="보호자">보호자</option>
625	556	</select>
626		- <select>
	557	+ <select onChange={handleSelectUserData} value={selectUserData}>
627	558	<option value="이름">이름</option>
628	559	<option value="아이디">아이디</option>
629		- <option value="아이디">등록번호</option>
	560	+ <option value="등록번호">등록번호</option>
630	561	</select>
631	562	<input type="text" />
632	563	<Button
...	...	@@ -645,7 +576,7 @@
645	576	))}
646	577	</ul>
647	578	<div>
648		- <Pagination total={data.id == 1 ? myUserTotal:userTotal} limit={limit} page={page} setPage={setPage} />
	579	+ <Pagination total={index === 1 ? myUserTotal:userTotal} limit={limit} page={page} setPage={setPage} />
649	580	</div>
650	581	</div>
651	582	</div>

Delete comment