Commit @ceca426f9723e476e8b003d6218fc2b76b32789a

최정우 2023-04-16

230416 방문관리 완성

@ceca426f9723e476e8b003d6218fc2b76b32789a

2026383

ceca426

client/views/component/Tabletitle.jsx

--- client/views/component/Tabletitle.jsx

+++ client/views/component/Tabletitle.jsx


   background-size: 13% 15%;
   background-repeat: no-repeat;
   background-position: center bottom;
-  &::before {
-    content: "김복남";
-    font-size: 1.8rem;
-  }  
   
 `

2026383

ceca426

client/views/pages/healthcare/Healthcare.jsx

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

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

...	...	@@ -201,14 +201,17 @@
201	201	<th>생년월일</th>
202	202	<th>성별</th>
203	203	<th>연락처</th>
204		- <th>최근방문일</th>
205		- <th>방문목적</th>
	204	+
	205	+ {/* <th>최근방문일</th>
	206	+ <th>방문목적</th> */}
206	207	</tr>
207	208	</thead>
208	209	<tbody>
209	210	{senior.seniorList.map((item, idx) => { return (
210	211	<tr key={idx} onClick={() => {
211		- navigate("/VisitSelectOne");
	212	+ navigate("/VisitSelectOne", {state: {
	213	+ 'senior_id': item['senior_id'],
	214	+ }})
212	215	}}>
213	216	<td data-label="No">{senior.seniorListCount - idx - (senior.search.currentPage - 1) * senior.search.perPage}</td>
214	217	<td data-label="소속기관명">{item['agency_name']}</td>
...	...	@@ -216,13 +219,14 @@
216	219	<td data-label="생년월일">{item['user_birth']}</td>
217	220	<td data-label="성별">{item['user_gender']}</td>
218	221	<td data-label="연락처">{item['user_phonenumber']}</td>
219		- <td>2023-04-11</td>
220		- <td>정기방문</td>
	222	+
	223	+ {/* <td>2023-04-11</td>
	224	+ <td>정기방문</td> */}
221	225	</tr>
222	226	)})}
223	227	{CommonUtil.isEmpty(senior.seniorList) ?
224	228	<tr>
225		- <td colSpan={8}>조회된 데이터가 없습니다</td>
	229	+ <td colSpan={6}>조회된 데이터가 없습니다</td>
226	230	</tr>
227	231	: null}
228	232	</tbody>

2026383

ceca426

client/views/pages/visit/visit/VisitSelectOne.jsx

--- client/views/pages/visit/visit/VisitSelectOne.jsx

+++ client/views/pages/visit/visit/VisitSelectOne.jsx


 import React from "react";
-import { useNavigate } from "react-router";
-import DetailSearch from "../../../component/DetailSearch.jsx";
-import Table from "../../../component/Table.jsx";
+import { useNavigate, useLocation } from "react-router";
+import { useSelector } from "react-redux";
 import ContentTitle from "../../../component/ContentTitle.jsx";
 import SubTitle from "../../../component/SubTitle.jsx";
 import TableTitle from "../../../component/Tabletitle.jsx";
 import Chart2 from "../../../component/chart/Chart2.jsx";
-import Button from "../../../component/Button.jsx";
 import Modal from "../../../component/Modal.jsx";
 import person from "../../../../resources/files/icon/person.png";
+import Pagination from "../../../component/Pagination.jsx";
 
-export default function MedicineCareSelect() {
-  const navigate = useNavigate();
-  const [modalOpen, setModalOpen] = React.useState(false);
-  const openModal = () => {
-    setModalOpen(true);
-  };
-  const closeModal = () => {
-    setModalOpen(false);
-  };
-  //게시판
-  const thead = ["No","방문일", "방문목적", "상세사유", ];
-  const key = ["No", "birth", "phone", "address", ];
-  const content = [
-    {
-      No: (
-        <p><span><img src={person} alt="" />{thead[0]}</span> 1</p>
-      ),
-      birth: (
-        <p><span>{thead[1]}</span> 2020.03.04</p>
-      ),
-      phone: (
-        <p><span>{thead[2]}</span> 정기방문</p>
-      ),
-      address: (
-        <p><span>{thead[3]}</span> 정기방문일</p>
-      ),
-    },
-  ];
+import CommonUtil from "../../../../resources/js/CommonUtil.js";
 
-  return (
-    <main>
-      <Modal open={modalOpen} close={closeModal} header="방문 등록">
-        <div className="board-wrap">
-        <table className="flex70 margin-bottom questionnaire-table">
-            <tbody>
-              <tr>
-                <th>대상자</th>
-                <td colSpan={3}>
-                  <input type="text" name="" id="" disabled />
-                </td>
-              </tr>              
-              <tr>
-                <th>방문날짜</th>
-                <td colSpan={3}>
-                  <input type="text" placeholder="자동입력" />
-                </td>
-              </tr>
-              <tr>
-                <th>방문목적</th>
-                <td className="flex-start">
-                  <div className="flex-start width100">
-                    <input type="checkbox" className="width20"/>
-                    <label className="width50" >
-                      정기방문
-                    </label>
-                  </div>
-                  <div className="flex-start width100">
-                    <input type="checkbox"  className="width20"/>
-                    <label className="width50" >
-                      어르신케어
-                    </label>
-                  </div>
-                  <div className="flex-start width100">
-                    <input type="checkbox"  className="width20"/>
-                    <label className="width50" >
-                      장비점검
-                    </label>
-                  </div>
-                </td>
-              </tr>
-              <tr>
-                <th>방문 상세 사유</th>
-                <td colSpan={3}>
-                  <textarea style={{height:"225px"}} name="" id="" cols="30" rows="10"></textarea>
-                </td>
-              </tr>
-            </tbody>
-          </table>
-          <div className="flex-center"><Button className={"btn-small gray-btn"} btnName={"저장"} /></div >
-        </div>
-      </Modal>
-      <div className="content-wrap">
-        <ContentTitle contentTitle={"방문 상세 페이지"}/>
-        <div className="detail-graph">
-          <TableTitle tableTitle={" 님의 방문 내역"}/>
-          <Chart2 />
-        </div>
-        <div className="board-wrap">
-        <div className="btn-wrap flex-end margin-bottom">
-            <Button
-              className={"btn-small gray-btn"}
-              btnName={"등록"}
-              onClick={openModal}
-            />
-          </div>
-        <Table
-            className={"medicine-table  senior-table"}
-              head={thead}
-              contents={content}
-              contentKey={key}
-              onClick={() => {
-                navigate("/MedicineCareSelectOne");
-              }}
-            />
-          <div className="btn-wrap flex-center">
-            <Button
-              className={"btn-large gray-btn"}
-              btnName={"이전"}
-              onClick={() => {
-                navigate("/Healthcare");
-              }}
-            />
-          </div>
-        </div>
-      </div>
-      
-    </main>
-  );
+export default function VisitSelectOne() {
+    const navigate = useNavigate();
+    const location = useLocation();
+
+    //전역 변수 저장 객체
+    const state = useSelector((state) => {return state});
+    const defaultUserId = CommonUtil.isEmpty(state.loginUser) ? null : state.loginUser['user_id'];
+
+    const [modalOpen, setModalOpen] = React.useState(false);
+    const openModal = () => {
+        setModalOpen(true);
+    };
+    const closeModal = () => {
+        setModalOpen(false);
+    };
+
+    //시니어 정보
+    const [senior, setSenior] = React.useState({
+        'user_id': location.state['senior_id'],
+        'user_name': null,
+        'user_password': null,
+        'user_phonenumber': null,
+        'user_birth': null,
+        'user_gender': null,
+        'user_address': null,
+        'user_email': null,
+        'authority': 'ROLE_SENIOR',
+        'agency_id': null,
+        'government_id': null,
+
+        'senior_id': location.state['senior_id'],
+        'care_grade': null,
+        'medication_pill': null,
+        'underlie_disease': null,
+        'senior_note': null,
+
+        'seniorMedicationList': []
+    });
+    //시니어 상세 조회
+    const seniorSelectOne = () => {
+        fetch("/user/seniorSelectOne.json", {
+            method: "POST",
+            headers: {
+                'Content-Type': 'application/json; charset=UTF-8'
+            },
+            body: JSON.stringify(senior),
+        }).then((response) => response.json()).then((data) => {
+            console.log("seniorSelectOne data : ", data);
+            setSenior(data);
+        }).catch((error) => {
+            console.log('seniorSelectOne() /user/seniorSelectOne.json error : ', error);
+        });
+    };
+
+    /****************** 방문 기록 (시작) ******************/
+    const visitRecordInit = {
+        'senior_id': location.state['senior_id'],
+        'visit_date': CommonUtil.getDate(),
+        'visit_reason': null,
+        'visit_content': null,
+        
+        'agent_id': defaultUserId,
+
+        isInsert: true,
+    };
+    //방문 기록 정보
+    const [visitRecord, setVisitRecord] = React.useState({...visitRecordInit});
+    const visitRecordRef = React.useRef({...visitRecordInit});
+
+    //방문 기록 유효성 검사
+    const visitRecordValidation = () => {
+        const target = visitRecord;
+		const targetRef = visitRecordRef;
+
+		if (CommonUtil.isEmpty(target['visit_date']) == true) {
+			targetRef.current['visit_date'].focus();
+			alert("방문 일자를 선택해 주세요.");
+			return false;
+		}
+		if (CommonUtil.isEmpty(target['visit_reason']) == true) {
+			targetRef.current['visit_reason'].focus();
+			alert("방문 목적을 선택해 주세요.");
+			return false;
+		}
+        if (CommonUtil.isEmpty(target['visit_content']) == true) {
+			targetRef.current['visit_content'].focus();
+			alert("방문 상세 사유를 입력해 주세요.");
+			return false;
+		}
+
+        return true;
+    }
+
+
+	//방문 기록 등록
+	const visitRecordInsert = () => {
+        if (visitRecordValidation() == false) {
+            return;
+        }
+
+        visitRecord['senior_id'] = location.state['senior_id'];
+        visitRecord['agent_id'] = defaultUserId;
+        setVisitRecord({...visitRecord});
+
+		fetch("/welfare/visitRecordInsert.json", {
+			method: "POST",
+			headers: {
+				'Content-Type': 'application/json; charset=UTF-8'
+			},
+			body: JSON.stringify(visitRecord),
+		}).then((response) => response.json()).then((data) => {
+			console.log("방문 기록 등록 결과(건수) : ", data);
+			if (data > 0) {
+                setVisitRecordInit();
+                visitRecordSelectList();
+                closeModal();
+				alert("등록완료");
+				
+			} else {
+				alert("등록에 실패하였습니다. 관리자에게 문의바랍니다.");
+			}
+		}).catch((error) => {
+			console.log('visitRecordInsert() /welfare/visitRecordInsert.json error : ', error);
+		});
+    }
+
+    //방문 기록 수정
+	const visitRecordUpdate = () => {
+        if (visitRecordValidation() == false) {
+            return;
+        }
+
+        visitRecord['senior_id'] = location.state['senior_id'];
+        visitRecord['agent_id'] = defaultUserId;
+        setVisitRecord({...visitRecord});
+
+		fetch("/welfare/visitRecordUpdate.json", {
+			method: "POST",
+			headers: {
+				'Content-Type': 'application/json; charset=UTF-8'
+			},
+			body: JSON.stringify(visitRecord),
+		}).then((response) => response.json()).then((data) => {
+			console.log("방문 기록 수정 결과(건수) : ", data);
+			if (data > 0) {
+                setVisitRecordInit();
+                visitRecordSelectList();
+                closeModal();
+				alert("수정완료");
+			} else {
+				alert("수정에 실패하였습니다. 관리자에게 문의바랍니다.");
+			}
+		}).catch((error) => {
+			console.log('visitRecordUpdate() /welfare/visitRecordUpdate.json error : ', error);
+		});
+    }
+
+    //방문 기록 삭제
+	const visitRecordDelete = () => {
+        if (confirm('방문 기록 정보를 삭제하시겠습니까?') == false) {
+            return;
+        }
+
+		fetch("/welfare/visitRecordDelete.json", {
+			method: "POST",
+			headers: {
+				'Content-Type': 'application/json; charset=UTF-8'
+			},
+			body: JSON.stringify(visitRecord),
+		}).then((response) => response.json()).then((data) => {
+			console.log("방문 기록 삭제 결과(건수) : ", data);
+			if (data > 0) {
+                setVisitRecordInit();
+                visitRecordSelectList();
+                closeModal();
+				alert("삭제완료");
+			} else {
+				alert("삭제에 실패하였습니다. 관리자에게 문의바랍니다.");
+			}
+		}).catch((error) => {
+			console.log('visitRecordDelete() /welfare/visitRecordDelete.json error : ', error);
+		});
+    }
+
+    //초기화 취소
+    const setVisitRecordInit = () => {
+        setVisitRecord({...visitRecordInit});
+    }
+
+    //방문 기록 정보
+    const [visitRecordList, setVisitRecordList] = React.useState({visitRecordList: [], visitRecordListCount:0, search: {currentPage: 1, perPage: 5}});
+    //방문 기록 목록 조회
+	const visitRecordSelectList = (currentPage) => {
+        visitRecordList.search.currentPage = CommonUtil.isEmpty(currentPage) ? 1 : currentPage;
+        visitRecordList.search['senior_id'] = location.state['senior_id'];
+        setVisitRecordList({...visitRecordList});
+
+		fetch("/welfare/visitRecordSelectList.json", {
+			method: "POST",
+			headers: {
+				'Content-Type': 'application/json; charset=UTF-8'
+			},
+			body: JSON.stringify(visitRecordList.search),
+		}).then((response) => response.json()).then((data) => {
+			console.log("방문 기록 목록 조회 결과(건수) : ", data);
+            data.search = visitRecordList.search;
+            setVisitRecordList(data);
+		}).catch((error) => {
+			console.log('visitRecordSelectList() /welfare/visitRecordSelectList.json error : ', error);
+		});
+    }
+
+    React.useEffect(() => {
+        seniorSelectOne();
+        visitRecordSelectList(1);
+    }, [])
+
+    return (
+        <main>
+        
+            <div className="content-wrap">
+                <ContentTitle contentTitle={"방문 상세 페이지"}/>
+                <div className="detail-graph">
+                    <TableTitle tableTitle={`${senior['user_name']} 님의 방문 내역`}/>
+                    <Chart2 />
+                </div>
+                <div className="board-wrap">
+                    <div className="btn-wrap flex-end margin-bottom">
+                        <button className="btn-small gray-btn" onClick={openModal}>등록</button>
+                    </div>
+
+                    <table className="medicine-table senior-table">
+                        <thead>
+                            <tr>
+                                <th>No</th>
+                                <th>방문일</th>
+                                <th>방문목적</th>
+                            </tr>
+                        </thead>
+                        <tbody>
+                            {visitRecordList.visitRecordList.map((item, idx) => { return (
+                            <tr key={idx} onClick={() => {setVisitRecord(item); openModal();}}>
+                                <td data-label="No">{visitRecordList.visitRecordList - idx - (visitRecordList.search.currentPage - 1) * visitRecordList.search.perPage}</td>
+                                <td data-label="방문일">{item['visit_date']}</td>
+                                <td data-label="방문목적">{item['visit_reason']}</td>
+                            </tr>
+                            )})}
+                            {CommonUtil.isEmpty(visitRecordList.visitRecordList) ?
+                            <tr>
+                                <td colSpan={3}>조회된 데이터가 없습니다</td>
+                            </tr>  
+                            : null}
+                        </tbody>
+                    </table>
+                    <Pagination
+                        currentPage={visitRecordList.search.currentPage}
+                        perPage={visitRecordList.search.perPage}
+                        totalCount={visitRecordList.visitRecordListCount}
+                        maxRange={10}
+                        click={visitRecordSelectList}
+                    />
+                    <div className="btn-wrap flex-center">
+                        <button className="btn-large gray-btn" onClick={() => {navigate(-1)}}>이전</button>
+                    </div>
+                </div>
+            </div>
+        
+
+
+
+            <Modal open={modalOpen} close={closeModal} header="방문 정보 관리">
+                <div className="board-wrap">
+                    <table className="flex70 margin-bottom">{/* questionnaire-table */}
+                        <tbody>            
+                            <tr>
+                                <th>방문날짜</th>
+                                <td colSpan={3}>
+                                    <input type="date" value={visitRecord['visit_date']}
+                                        onChange={(e) => {
+                                            visitRecord['visit_date'] = e.target.value;
+                                            setVisitRecord({...visitRecord});
+                                        }}
+                                        ref={el => visitRecordRef.current['visit_date'] = el}
+                                    />
+                                </td>
+                            </tr>
+                            <tr>
+                                <th>방문목적</th>
+                                <td>
+                                    <select onChange={(e) => {
+                                            visitRecord['visit_reason'] = e.target.value;
+                                            setVisitRecord({...visitRecord});
+                                        }}
+                                        ref={el => visitRecordRef.current['visit_reason'] = el}
+                                    >
+                                        <option value="" selected={CommonUtil.isEmpty(visitRecord['visit_reason'])}>방문목적선택</option>
+                                        <option value="정기방문" selected={visitRecord['visit_reason'] == "정기방문"}>정기방문</option>
+                                        <option value="어르신케어" selected={visitRecord['visit_reason'] == "어르신케어"}>어르신케어</option>
+                                        <option value="장비점검" selected={visitRecord['visit_reason'] == "장비점검"}>장비점검</option>
+                                        <option value="정기방문" selected={visitRecord['visit_reason'] == "기타"}>기타</option>
+                                    </select>
+                                </td>
+                            </tr>
+                            <tr>
+                                <th>방문 상세 사유</th>
+                                <td colSpan={3}>
+                                    <textarea className="medicine" style={{height:"225px"}} name="" id="" cols="30" rows="10"
+                                        value={visitRecord['visit_content']}
+                                        onChange={(e) => {
+                                            visitRecord['visit_content'] = e.target.value;
+                                            setVisitRecord({...visitRecord});
+                                        }}
+                                        ref={el => visitRecordRef.current['visit_content'] = el}
+                                    ></textarea>
+                                </td>
+                            </tr>
+                        </tbody>
+                    </table>
+                    <div className="flex-center">
+                        {CommonUtil.isEmpty(visitRecord.isInsert) == false && visitRecord.isInsert
+                            ? <button className="btn-small red-btn" onClick={visitRecordInsert}>등록</button>
+                            : <>
+                                <button className="btn-small red-btn" onClick={visitRecordUpdate}>수정</button>
+                                <button className="btn-small red-btn" onClick={visitRecordDelete}>삭제</button>
+                            </>
+                        }
+                    </div>
+                </div>
+            </Modal>
+
+
+
+        </main>
+    );
 }

Add a comment

Open 0
Closed 0

List

...	...	@@ -19,9 +19,5 @@
19	19	background-size: 13% 15%;
20	20	background-repeat: no-repeat;
21	21	background-position: center bottom;
22		- &::before {
23		- content: "김복남";
24		- font-size: 1.8rem;
25		- }
26	22
27	23	` (No newline at end of file)

...	...	@@ -1,131 +1,348 @@
1	1	import React from "react";
2		-import { useNavigate } from "react-router";
3		-import DetailSearch from "../../../component/DetailSearch.jsx";
4		-import Table from "../../../component/Table.jsx";
	2	+import { useNavigate, useLocation } from "react-router";
	3	+import { useSelector } from "react-redux";
5	4	import ContentTitle from "../../../component/ContentTitle.jsx";
6	5	import SubTitle from "../../../component/SubTitle.jsx";
7	6	import TableTitle from "../../../component/Tabletitle.jsx";
8	7	import Chart2 from "../../../component/chart/Chart2.jsx";
9		-import Button from "../../../component/Button.jsx";
10	8	import Modal from "../../../component/Modal.jsx";
11	9	import person from "../../../../resources/files/icon/person.png";
	10	+import Pagination from "../../../component/Pagination.jsx";
12	11
13		-export default function MedicineCareSelect() {
14		- const navigate = useNavigate();
15		- const [modalOpen, setModalOpen] = React.useState(false);
16		- const openModal = () => {
17		- setModalOpen(true);
18		- };
19		- const closeModal = () => {
20		- setModalOpen(false);
21		- };
22		- //게시판
23		- const thead = ["No","방문일", "방문목적", "상세사유", ];
24		- const key = ["No", "birth", "phone", "address", ];
25		- const content = [
26		- {
27		- No: (
28		- <p><span><img src={person} alt="" />{thead[0]}</span> 1</p>
29		- ),
30		- birth: (
31		- <p><span>{thead[1]}</span> 2020.03.04</p>
32		- ),
33		- phone: (
34		- <p><span>{thead[2]}</span> 정기방문</p>
35		- ),
36		- address: (
37		- <p><span>{thead[3]}</span> 정기방문일</p>
38		- ),
39		- },
40		- ];
	12	+import CommonUtil from "../../../../resources/js/CommonUtil.js";
41	13
42		- return (
43		- <main>
44		- <Modal open={modalOpen} close={closeModal} header="방문 등록">
45		- <div className="board-wrap">
46		- <table className="flex70 margin-bottom questionnaire-table">
47		- <tbody>
48		- <tr>
49		- <th>대상자</th>
50		- <td colSpan={3}>
51		- <input type="text" name="" id="" disabled />
52		- </td>
53		- </tr>
54		- <tr>
55		- <th>방문날짜</th>
56		- <td colSpan={3}>
57		- <input type="text" placeholder="자동입력" />
58		- </td>
59		- </tr>
60		- <tr>
61		- <th>방문목적</th>
62		- <td className="flex-start">
63		- <div className="flex-start width100">
64		- <input type="checkbox" className="width20"/>
65		- <label className="width50" >
66		- 정기방문
67		- </label>
68		- </div>
69		- <div className="flex-start width100">
70		- <input type="checkbox" className="width20"/>
71		- <label className="width50" >
72		- 어르신케어
73		- </label>
74		- </div>
75		- <div className="flex-start width100">
76		- <input type="checkbox" className="width20"/>
77		- <label className="width50" >
78		- 장비점검
79		- </label>
80		- </div>
81		- </td>
82		- </tr>
83		- <tr>
84		- <th>방문 상세 사유</th>
85		- <td colSpan={3}>
86		- <textarea style={{height:"225px"}} name="" id="" cols="30" rows="10"></textarea>
87		- </td>
88		- </tr>
89		- </tbody>
90		- </table>
91		- <div className="flex-center"><Button className={"btn-small gray-btn"} btnName={"저장"} /></div >
92		- </div>
93		- </Modal>
94		- <div className="content-wrap">
95		- <ContentTitle contentTitle={"방문 상세 페이지"}/>
96		- <div className="detail-graph">
97		- <TableTitle tableTitle={" 님의 방문 내역"}/>
98		- <Chart2 />
99		- </div>
100		- <div className="board-wrap">
101		- <div className="btn-wrap flex-end margin-bottom">
102		- <Button
103		- className={"btn-small gray-btn"}
104		- btnName={"등록"}
105		- onClick={openModal}
106		- />
107		- </div>
108		- <Table
109		- className={"medicine-table senior-table"}
110		- head={thead}
111		- contents={content}
112		- contentKey={key}
113		- onClick={() => {
114		- navigate("/MedicineCareSelectOne");
115		- }}
116		- />
117		- <div className="btn-wrap flex-center">
118		- <Button
119		- className={"btn-large gray-btn"}
120		- btnName={"이전"}
121		- onClick={() => {
122		- navigate("/Healthcare");
123		- }}
124		- />
125		- </div>
126		- </div>
127		- </div>
128		-
129		- </main>
130		- );
	14	+export default function VisitSelectOne() {
	15	+ const navigate = useNavigate();
	16	+ const location = useLocation();
	17	+
	18	+ //전역 변수 저장 객체
	19	+ const state = useSelector((state) => {return state});
	20	+ const defaultUserId = CommonUtil.isEmpty(state.loginUser) ? null : state.loginUser['user_id'];
	21	+
	22	+ const [modalOpen, setModalOpen] = React.useState(false);
	23	+ const openModal = () => {
	24	+ setModalOpen(true);
	25	+ };
	26	+ const closeModal = () => {
	27	+ setModalOpen(false);
	28	+ };
	29	+
	30	+ //시니어 정보
	31	+ const [senior, setSenior] = React.useState({
	32	+ 'user_id': location.state['senior_id'],
	33	+ 'user_name': null,
	34	+ 'user_password': null,
	35	+ 'user_phonenumber': null,
	36	+ 'user_birth': null,
	37	+ 'user_gender': null,
	38	+ 'user_address': null,
	39	+ 'user_email': null,
	40	+ 'authority': 'ROLE_SENIOR',
	41	+ 'agency_id': null,
	42	+ 'government_id': null,
	43	+
	44	+ 'senior_id': location.state['senior_id'],
	45	+ 'care_grade': null,
	46	+ 'medication_pill': null,
	47	+ 'underlie_disease': null,
	48	+ 'senior_note': null,
	49	+
	50	+ 'seniorMedicationList': []
	51	+ });
	52	+ //시니어 상세 조회
	53	+ const seniorSelectOne = () => {
	54	+ fetch("/user/seniorSelectOne.json", {
	55	+ method: "POST",
	56	+ headers: {
	57	+ 'Content-Type': 'application/json; charset=UTF-8'
	58	+ },
	59	+ body: JSON.stringify(senior),
	60	+ }).then((response) => response.json()).then((data) => {
	61	+ console.log("seniorSelectOne data : ", data);
	62	+ setSenior(data);
	63	+ }).catch((error) => {
	64	+ console.log('seniorSelectOne() /user/seniorSelectOne.json error : ', error);
	65	+ });
	66	+ };
	67	+
	68	+ /**************** 방문 기록 (시작) ****************/
	69	+ const visitRecordInit = {
	70	+ 'senior_id': location.state['senior_id'],
	71	+ 'visit_date': CommonUtil.getDate(),
	72	+ 'visit_reason': null,
	73	+ 'visit_content': null,
	74	+
	75	+ 'agent_id': defaultUserId,
	76	+
	77	+ isInsert: true,
	78	+ };
	79	+ //방문 기록 정보
	80	+ const [visitRecord, setVisitRecord] = React.useState({...visitRecordInit});
	81	+ const visitRecordRef = React.useRef({...visitRecordInit});
	82	+
	83	+ //방문 기록 유효성 검사
	84	+ const visitRecordValidation = () => {
	85	+ const target = visitRecord;
	86	+ const targetRef = visitRecordRef;
	87	+
	88	+ if (CommonUtil.isEmpty(target['visit_date']) == true) {
	89	+ targetRef.current['visit_date'].focus();
	90	+ alert("방문 일자를 선택해 주세요.");
	91	+ return false;
	92	+ }
	93	+ if (CommonUtil.isEmpty(target['visit_reason']) == true) {
	94	+ targetRef.current['visit_reason'].focus();
	95	+ alert("방문 목적을 선택해 주세요.");
	96	+ return false;
	97	+ }
	98	+ if (CommonUtil.isEmpty(target['visit_content']) == true) {
	99	+ targetRef.current['visit_content'].focus();
	100	+ alert("방문 상세 사유를 입력해 주세요.");
	101	+ return false;
	102	+ }
	103	+
	104	+ return true;
	105	+ }
	106	+
	107	+
	108	+ //방문 기록 등록
	109	+ const visitRecordInsert = () => {
	110	+ if (visitRecordValidation() == false) {
	111	+ return;
	112	+ }
	113	+
	114	+ visitRecord['senior_id'] = location.state['senior_id'];
	115	+ visitRecord['agent_id'] = defaultUserId;
	116	+ setVisitRecord({...visitRecord});
	117	+
	118	+ fetch("/welfare/visitRecordInsert.json", {
	119	+ method: "POST",
	120	+ headers: {
	121	+ 'Content-Type': 'application/json; charset=UTF-8'
	122	+ },
	123	+ body: JSON.stringify(visitRecord),
	124	+ }).then((response) => response.json()).then((data) => {
	125	+ console.log("방문 기록 등록 결과(건수) : ", data);
	126	+ if (data > 0) {
	127	+ setVisitRecordInit();
	128	+ visitRecordSelectList();
	129	+ closeModal();
	130	+ alert("등록완료");
	131	+
	132	+ } else {
	133	+ alert("등록에 실패하였습니다. 관리자에게 문의바랍니다.");
	134	+ }
	135	+ }).catch((error) => {
	136	+ console.log('visitRecordInsert() /welfare/visitRecordInsert.json error : ', error);
	137	+ });
	138	+ }
	139	+
	140	+ //방문 기록 수정
	141	+ const visitRecordUpdate = () => {
	142	+ if (visitRecordValidation() == false) {
	143	+ return;
	144	+ }
	145	+
	146	+ visitRecord['senior_id'] = location.state['senior_id'];
	147	+ visitRecord['agent_id'] = defaultUserId;
	148	+ setVisitRecord({...visitRecord});
	149	+
	150	+ fetch("/welfare/visitRecordUpdate.json", {
	151	+ method: "POST",
	152	+ headers: {
	153	+ 'Content-Type': 'application/json; charset=UTF-8'
	154	+ },
	155	+ body: JSON.stringify(visitRecord),
	156	+ }).then((response) => response.json()).then((data) => {
	157	+ console.log("방문 기록 수정 결과(건수) : ", data);
	158	+ if (data > 0) {
	159	+ setVisitRecordInit();
	160	+ visitRecordSelectList();
	161	+ closeModal();
	162	+ alert("수정완료");
	163	+ } else {
	164	+ alert("수정에 실패하였습니다. 관리자에게 문의바랍니다.");
	165	+ }
	166	+ }).catch((error) => {
	167	+ console.log('visitRecordUpdate() /welfare/visitRecordUpdate.json error : ', error);
	168	+ });
	169	+ }
	170	+
	171	+ //방문 기록 삭제
	172	+ const visitRecordDelete = () => {
	173	+ if (confirm('방문 기록 정보를 삭제하시겠습니까?') == false) {
	174	+ return;
	175	+ }
	176	+
	177	+ fetch("/welfare/visitRecordDelete.json", {
	178	+ method: "POST",
	179	+ headers: {
	180	+ 'Content-Type': 'application/json; charset=UTF-8'
	181	+ },
	182	+ body: JSON.stringify(visitRecord),
	183	+ }).then((response) => response.json()).then((data) => {
	184	+ console.log("방문 기록 삭제 결과(건수) : ", data);
	185	+ if (data > 0) {
	186	+ setVisitRecordInit();
	187	+ visitRecordSelectList();
	188	+ closeModal();
	189	+ alert("삭제완료");
	190	+ } else {
	191	+ alert("삭제에 실패하였습니다. 관리자에게 문의바랍니다.");
	192	+ }
	193	+ }).catch((error) => {
	194	+ console.log('visitRecordDelete() /welfare/visitRecordDelete.json error : ', error);
	195	+ });
	196	+ }
	197	+
	198	+ //초기화 취소
	199	+ const setVisitRecordInit = () => {
	200	+ setVisitRecord({...visitRecordInit});
	201	+ }
	202	+
	203	+ //방문 기록 정보
	204	+ const [visitRecordList, setVisitRecordList] = React.useState({visitRecordList: [], visitRecordListCount:0, search: {currentPage: 1, perPage: 5}});
	205	+ //방문 기록 목록 조회
	206	+ const visitRecordSelectList = (currentPage) => {
	207	+ visitRecordList.search.currentPage = CommonUtil.isEmpty(currentPage) ? 1 : currentPage;
	208	+ visitRecordList.search['senior_id'] = location.state['senior_id'];
	209	+ setVisitRecordList({...visitRecordList});
	210	+
	211	+ fetch("/welfare/visitRecordSelectList.json", {
	212	+ method: "POST",
	213	+ headers: {
	214	+ 'Content-Type': 'application/json; charset=UTF-8'
	215	+ },
	216	+ body: JSON.stringify(visitRecordList.search),
	217	+ }).then((response) => response.json()).then((data) => {
	218	+ console.log("방문 기록 목록 조회 결과(건수) : ", data);
	219	+ data.search = visitRecordList.search;
	220	+ setVisitRecordList(data);
	221	+ }).catch((error) => {
	222	+ console.log('visitRecordSelectList() /welfare/visitRecordSelectList.json error : ', error);
	223	+ });
	224	+ }
	225	+
	226	+ React.useEffect(() => {
	227	+ seniorSelectOne();
	228	+ visitRecordSelectList(1);
	229	+ }, [])
	230	+
	231	+ return (
	232	+ <main>
	233	+
	234	+ <div className="content-wrap">
	235	+ <ContentTitle contentTitle={"방문 상세 페이지"}/>
	236	+ <div className="detail-graph">
	237	+ <TableTitle tableTitle={`${senior['user_name']} 님의 방문 내역`}/>
	238	+ <Chart2 />
	239	+ </div>
	240	+ <div className="board-wrap">
	241	+ <div className="btn-wrap flex-end margin-bottom">
	242	+ <button className="btn-small gray-btn" onClick={openModal}>등록</button>
	243	+ </div>
	244	+
	245	+ <table className="medicine-table senior-table">
	246	+ <thead>
	247	+ <tr>
	248	+ <th>No</th>
	249	+ <th>방문일</th>
	250	+ <th>방문목적</th>
	251	+ </tr>
	252	+ </thead>
	253	+ <tbody>
	254	+ {visitRecordList.visitRecordList.map((item, idx) => { return (
	255	+ <tr key={idx} onClick={() => {setVisitRecord(item); openModal();}}>
	256	+ <td data-label="No">{visitRecordList.visitRecordList - idx - (visitRecordList.search.currentPage - 1) * visitRecordList.search.perPage}</td>
	257	+ <td data-label="방문일">{item['visit_date']}</td>
	258	+ <td data-label="방문목적">{item['visit_reason']}</td>
	259	+ </tr>
	260	+ )})}
	261	+ {CommonUtil.isEmpty(visitRecordList.visitRecordList) ?
	262	+ <tr>
	263	+ <td colSpan={3}>조회된 데이터가 없습니다</td>
	264	+ </tr>
	265	+ : null}
	266	+ </tbody>
	267	+ </table>
	268	+ <Pagination
	269	+ currentPage={visitRecordList.search.currentPage}
	270	+ perPage={visitRecordList.search.perPage}
	271	+ totalCount={visitRecordList.visitRecordListCount}
	272	+ maxRange={10}
	273	+ click={visitRecordSelectList}
	274	+ />
	275	+ <div className="btn-wrap flex-center">
	276	+ <button className="btn-large gray-btn" onClick={() => {navigate(-1)}}>이전</button>
	277	+ </div>
	278	+ </div>
	279	+ </div>
	280	+
	281	+
	282	+
	283	+
	284	+ <Modal open={modalOpen} close={closeModal} header="방문 정보 관리">
	285	+ <div className="board-wrap">
	286	+ <table className="flex70 margin-bottom">{/* questionnaire-table */}
	287	+ <tbody>
	288	+ <tr>
	289	+ <th>방문날짜</th>
	290	+ <td colSpan={3}>
	291	+ <input type="date" value={visitRecord['visit_date']}
	292	+ onChange={(e) => {
	293	+ visitRecord['visit_date'] = e.target.value;
	294	+ setVisitRecord({...visitRecord});
	295	+ }}
	296	+ ref={el => visitRecordRef.current['visit_date'] = el}
	297	+ />
	298	+ </td>
	299	+ </tr>
	300	+ <tr>
	301	+ <th>방문목적</th>
	302	+ <td>
	303	+ <select onChange={(e) => {
	304	+ visitRecord['visit_reason'] = e.target.value;
	305	+ setVisitRecord({...visitRecord});
	306	+ }}
	307	+ ref={el => visitRecordRef.current['visit_reason'] = el}
	308	+ >
	309	+ <option value="" selected={CommonUtil.isEmpty(visitRecord['visit_reason'])}>방문목적선택</option>
	310	+ <option value="정기방문" selected={visitRecord['visit_reason'] == "정기방문"}>정기방문</option>
	311	+ <option value="어르신케어" selected={visitRecord['visit_reason'] == "어르신케어"}>어르신케어</option>
	312	+ <option value="장비점검" selected={visitRecord['visit_reason'] == "장비점검"}>장비점검</option>
	313	+ <option value="정기방문" selected={visitRecord['visit_reason'] == "기타"}>기타</option>
	314	+ </select>
	315	+ </td>
	316	+ </tr>
	317	+ <tr>
	318	+ <th>방문 상세 사유</th>
	319	+ <td colSpan={3}>
	320	+ <textarea className="medicine" style={{height:"225px"}} name="" id="" cols="30" rows="10"
	321	+ value={visitRecord['visit_content']}
	322	+ onChange={(e) => {
	323	+ visitRecord['visit_content'] = e.target.value;
	324	+ setVisitRecord({...visitRecord});
	325	+ }}
	326	+ ref={el => visitRecordRef.current['visit_content'] = el}
	327	+ ></textarea>
	328	+ </td>
	329	+ </tr>
	330	+ </tbody>
	331	+ </table>
	332	+ <div className="flex-center">
	333	+ {CommonUtil.isEmpty(visitRecord.isInsert) == false && visitRecord.isInsert
	334	+ ? <button className="btn-small red-btn" onClick={visitRecordInsert}>등록</button>
	335	+ : <>
	336	+ <button className="btn-small red-btn" onClick={visitRecordUpdate}>수정</button>
	337	+ <button className="btn-small red-btn" onClick={visitRecordDelete}>삭제</button>
	338	+ </>
	339	+ }
	340	+ </div>
	341	+ </div>
	342	+ </Modal>
	343	+
	344	+
	345	+
	346	+ </main>
	347	+ );
131	348	}

Delete comment