Commit @7d12ec98146baba5effa24b6b640344172622ce9

하석형 2023-02-22
230222 하석형 시행기관 장비 조회 기능
@7d12ec98146baba5effa24b6b640344172622ce9
e05a3ac
7d12ec9
client/views/pages/equipment/EquipmentManagementSelect.jsx
--- client/views/pages/equipment/EquipmentManagementSelect.jsx
+++ client/views/pages/equipment/EquipmentManagementSelect.jsx

 	const closeModal = () => {
 		setModalOpen(false);
 	};
-	
+
 	const [modalOpen3, setModalOpen3] = React.useState(false);
 	const openModal3 = () => {
 		// equipmentListData();

 		setModalOpen3(false);
 	};
 
-	// 대상자 매칭 삭제
+	// 대상자 매칭 반납
 	const seniorMatchDelete = () => {
-		if(confirm('등록된 대상자를 삭제하시겠습니까?') == false) {
+		if (confirm('아니다') == false) {
 			return;
 		}
 		// 대상자 매칭 삭제 함수 사용하기

 			headers: {
 				'Content-Type': 'application/json; charset=UTF-8'
 			},
+			body: JSON.stringify({})
 		}).then((response) => response.json()).then((data) => {
 			console.log('equipmentSelectList response : ', data);
 			setEquipmentList(data);

 		"equipment_stock_date",
 		"equipment_state",
 		"agency_name",
-		"user_name",
+		"senior_name",
 	];
 
 	const thead2 = [

 				<Button
 					className={"btn-small gray-btn"}
 					btnName={"선택"}
-					// onClick={openModal2}
+				// onClick={openModal2}
 				/>
 			),
 		},

 				<Button
 					className={"btn-small gray-btn"}
 					btnName={"선택"}
-					// onClick={openModal2}
+				// onClick={openModal2}
 				/>
 			),
 		},

 	const [agencySeniorEquipmentList, setAgencySeniorEquipmentList] = React.useState([]);
 	// 시행기관 재고 장비 목록
 	const [agencyStockEquipmentList, setAgencyStockEquipmentList] = React.useState([]);
-	// 선택 대상자 장비
+	// 선택한 대상자 장비
 	const [seniorEquipment, setSeniorEquipment] = React.useState({});
+	// 대상자 장비 등록 모달창
+	const [seniorMatchInsertModal, setSeniorMatchInsertModal] = React.useState(false);
+	// 대상자 장비 삭제 모달창
+	const [seniorMatchDeleteModal, setSeniorMatchDeleteModal] = React.useState(false);
+
 	// 대상자 목록
 	const [seniorList, setSeniorList] = React.useState([]);
-	// 대상자 장비 등록 모달창
-	const [seniorMatchModal, setSeniorMatchModal] = React.useState(false);
-	
+	// 담당자 목록
+	const [workerList, setWorkerList] = React.useState([]);
+
 
 	// 대상자 장비 등록 모달창 열기
-	const seniorMatchModalOpen = (item) => {
+	const seniorMatchInsertModalOpen = (item) => {
 		setSeniorEquipment(item); // 선택한 장비 데이터 저장
-		setSeniorMatchModal(true);
+		setSeniorMatchInsertModal(true);
 	};
 	// 대상자 장비 등록 모달창 닫기
-	const seniorMatchModalClose = () => {
-		setSeniorMatchModal(false);
+	const seniorMatchInsertModalClose = () => {
+		setSeniorMatchInsertModal(false);
 	};
 
 	// 대상자 장비 등록 - 대상자

 		setSeniorEquipment(data);
 	};
 
+	// 대상자 장비 삭제 모달창 열기
+	const seniorMatchDeleteModalOpen = (item) => {
+		setSeniorEquipment(item); // 선택한 장비 데이터 저장
+		setSeniorMatchDeleteModal(true);
+	};
+	// 대상자 장비 삭제 모달창 닫기
+	const seniorMatchDeleteModalClose = () => {
+		setSeniorMatchDeleteModal(false);
+	};
+	// 대상자 장비 - 반납일
+	const seniorEquipmentRentalReturnDateInsert = (e) => {
+		// 원본 데이터 복사 및 수정
+		let data = {
+			...seniorEquipment,
+			equipment_rental_return_date: e.target.value
+		}
+		// 복사 데이터를 원본 데이터에 덮어쓰기
+		setSeniorEquipment(data);
+	};
+	// 대상자 장비 - 반납 관리자
+	const seniorEquipmentReturnUserIdInsert = (e) => {
+		// 원본 데이터 복사 및 수정
+		let data = {
+			...seniorEquipment,
+			return_user_id: e.target.value
+		}
+		// 복사 데이터를 원본 데이터에 덮어쓰기
+		setSeniorEquipment(data);
+	};
+
 
 	// 시행기관 전체 장비 목록 조회
-	const agencyEquipmentSelectList = () => {
-		console.log('agencyEquipmentSelectList Function Run');
-		fetch("/equipment/agencyEquipmentSelectList.json", {
-			method: "POST",
-			headers: {
-				'Content-Type': 'application/json; charset=UTF-8'
-			},
-			body: JSON.stringify({
-				agency_id: 'AGENCY01',
-			}),
-		}).then((response) => response.json()).then((data) => {
-			console.log('agencyEquipmentSelectList response : ', data);
-			setAgencyEquipmentList(data);
-		}).catch((error) => {
-			console.log('agencyEquipmentSelectList error : ', error);
-		});
-	}
-
-	// 시행기관 대상자 장비 목록 조회
-	// const agencySeniorEquipmentSelectList = () => {
-	// 	console.log('agencySeniorEquipmentSelectList Function Run');
-	// 	fetch("/equipment/agencySeniorEquipmentSelectList.json", {
+	// const agencyEquipmentSelectList = () => {
+	// 	console.log('agencyEquipmentSelectList Function Run');
+	// 	fetch("/equipment/agencyEquipmentSelectList.json", {
 	// 		method: "POST",
 	// 		headers: {
 	// 			'Content-Type': 'application/json; charset=UTF-8'

 	// 			agency_id: 'AGENCY01',
 	// 		}),
 	// 	}).then((response) => response.json()).then((data) => {
-	// 		console.log('agencySeniorEquipmentSelectList response : ', data);
-	// 		setAgencySeniorEquipmentList(data);
+	// 		console.log('agencyEquipmentSelectList response : ', data);
+	// 		setAgencyEquipmentList(data);
 	// 	}).catch((error) => {
-	// 		console.log('agencySeniorEquipmentSelectList error : ', error);
+	// 		console.log('agencyEquipmentSelectList error : ', error);
 	// 	});
 	// }
+
+	// 시행기관 전체 장비 목록 조회
+	const agencyEquipmentSelectList = () => {
+		console.log('equipmentSelectList Function Run');
+		fetch("/equipment/equipmentSelectList.json", {
+			method: "POST",
+			headers: {
+				'Content-Type': 'application/json; charset=UTF-8'
+			},
+			body: JSON.stringify({
+				agency_id: 'AGENCY01',
+				searchAll: true
+			}),
+		}).then((response) => response.json()).then((data) => {
+			console.log('equipmentSelectList response : ', data);
+			setAgencyEquipmentList(data);
+		}).catch((error) => {
+			console.log('equipmentSelectList error : ', error);
+		});
+	}
+
+	// 시행기관 대상자 장비 목록 조회
+	const agencySeniorEquipmentSelectList = () => {
+		console.log('agencySeniorEquipmentSelectList Function Run');
+		fetch("/equipment/equipmentSelectList.json", {
+			method: "POST",
+			headers: {
+				'Content-Type': 'application/json; charset=UTF-8'
+			},
+			body: JSON.stringify({
+				agency_id: 'AGENCY01',
+				seniorCheck: true
+			}),
+		}).then((response) => response.json()).then((data) => {
+			console.log('agencySeniorEquipmentSelectList response : ', data);
+			setAgencySeniorEquipmentList(data);
+		}).catch((error) => {
+			console.log('agencySeniorEquipmentSelectList error : ', error);
+		});
+	}
+
+	// 시행기관 재고 장비 목록 조회
+	const agencyStockEquipmentSelectList = () => {
+		console.log('agencyStockEquipmentList Function Run');
+		fetch("/equipment/equipmentSelectList.json", {
+			method: "POST",
+			headers: {
+				'Content-Type': 'application/json; charset=UTF-8'
+			},
+			body: JSON.stringify({
+				agency_id: 'AGENCY01',
+				seniorCheck: false
+			}),
+		}).then((response) => response.json()).then((data) => {
+			console.log('agencyStockEquipmentList response : ', data);
+			setAgencyStockEquipmentList(data);
+		}).catch((error) => {
+			console.log('agencyStockEquipmentList error : ', error);
+		});
+	}
 
 	// 대상자 장비 등록
 	const seniorEquipmentInsert = () => {

 
 		// 대상자 아이디 유효성 검사
 		let check = 0;
-		for(let i = 0; i < seniorList.length; i++) {
+		for (let i = 0; i < seniorList.length; i++) {
 			// 입력한 데이터가 대상자 목록에 있을 경우
-			if(seniorList[i]['user_id'] == seniorEquipment['senior_id']) {
+			if (seniorList[i]['user_id'] == seniorEquipment['senior_id']) {
 				console.log('success: ', seniorList[i]['user_id']);
 				// 원본 데이터 복사 및 수정
 				let data = {

 			}
 		}
 		// 입력한 데이터가 대상자 목록에 없을 경우
-		if(check != 1) {
+		if (check != 1) {
 			console.log('fail: ', seniorList, seniorEquipment['senior_id']);
 			alert('존재하지 않는 대상자입니다.');
 			return;

 			headers: {
 				'Content-Type': 'application/json; charset=UTF-8'
 			},
+			body: JSON.stringify({})
 		}).then((response) => response.json()).then((data) => {
 			console.log('seniorSelectList response : ', data);
 			setSeniorList(data);

 		});
 	}
 
+	// 담당자 목록 조회
+	const workerSelectList = () => {
+		console.log('workerSelectList Function Run');
+		fetch("/user/selectSubjectList.json", {
+			method: "POST",
+			headers: {
+				'Content-Type': 'application/json; charset=UTF-8'
+			},
+			body: JSON.stringify({})
+		}).then((response) => response.json()).then((data) => {
+			console.log('workerSelectList response : ', data);
+			setSeniorList(data);
+		}).catch((error) => {
+			console.log('workerSelectList error : ', error);
+		});
+	}
+
+	// 시행기관 전체 장비 thead, key
 	const thead11 = [
 		"No",
 		"모델 명",

 		"대상자",
 		"대여일",
 		"반납예정일",
-		"반납일",
 		"관리"
 	];
 	const key11 = [
 		"equipment_name",
 		"equipment_serial_number",
 		"equipment_state",
-		"user_name",
+		"senior_name",
 		"equipment_rental_start_date",
 		"equipment_rental_end_date",
-		"equipment_rental_return_date"
 	];
 
+	// 시행기관 대상자 장비 thead, key
 	const thead22 = [
 		"No",
 		"모델 명",

 		"대상자",
 		"대여일",
 		"반납예정일",
-		"반납일",
 		"관리"
 	];
 	const key22 = [
 		"equipment_name",
 		"equipment_serial_number",
 		"equipment_state",
-		"user_name",
+		"senior_name",
 		"equipment_rental_start_date",
 		"equipment_rental_end_date",
-		"equipment_rental_return_date"
 	];
 
+	// 시행기관 재고 장비 thead, key
 	const thead33 = [
 		"No",
-		"장비명",
+		"모델 명",
 		"시리얼 넘버",
-		"입고일자",
-		"납품 기관",//관리기관, 올잇메디
-		"대상자",//시행기관
+		"상태",
+		"대상자",
+		"대여일",
+		"반납예정일",
+		"관리"
 	];
 	const key33 = [
-		"No",
-		"equipment",
-		"serialNumber",
-		"date",
-		"agency",
-		"senior",
+		"equipment_name",
+		"equipment_serial_number",
+		"equipment_state",
+		"senior_name",
+		"equipment_rental_start_date",
+		"equipment_rental_end_date",
 	];
-	const content33 = [
-		{
-			No: 1,
-			equipment: "스마트약상자",
-			serialNumber: "ABCD-1",
-			date: "2022.12.02",
-			agency: (
-				<Button
-					className={"btn-small gray-btn"}
-					btnName={"선택"}
-					onClick={openModal}
-				/>
-			),
-			senior: (
-				<Button
-					className={"btn-small gray-btn"}
-					btnName={"선택"}
-					// onClick={openModal2}
-				/>
-			),
-		},
-		{
-			No: 2,
-			equipment: "스마트약상자",
-			serialNumber: "ABCD-1",
-			date: "2022.12.02",
-			agency: (<Button
-				className={"btn-small gray-btn"}
-				btnName={"선택"}
-				onClick={openModal}
-			/>),
-			senior: (
-				<Button
-					className={"btn-small gray-btn"}
-					btnName={"선택"}
-					// onClick={openModal2}
-				/>
-			),
-		},
+
+	// 장비 대상자 등록 모달창 thead
+	const thead44 = [
+		"대상자",
+		"대여일",
+		"반납예정일",
+		"선택",
+	];
+
+	// 장비 대상자 삭제 모달창 thead
+	const thead55 = [
+		"반납일",
+		"반납자",
 	];
 
 	// 마운트 시 실행 함수
 	React.useEffect(() => {
+		seniorSelectList();
+		//관리자
 		equipmentSelectList();
 
+		//시행기관
 		agencyEquipmentSelectList();
-		// agencySeniorEquipmentSelectList();
-		seniorSelectList();
+		agencySeniorEquipmentSelectList();
+		agencyStockEquipmentSelectList();
 	}, [])
-
-	// 대상자, 재고 장비 목록 
-	React.useEffect(() => {
-		console.log('@@@', agencyEquipmentList);
-		let data = [];
-		for(let i = 0; i < agencyEquipmentList.length; i++) {
-			if(agencyEquipmentList[i]['senior_id'] != null) {
-				data.push(agencyEquipmentList[i]);
-			}
-		}
-		console.log('@@@data', data);
-		setAgencySeniorEquipmentList(data);
-	}, [agencyEquipmentList])
 
 	/********************************** 시행기관 장비 (끝) **********************************/
 
+	// 장비 납품 모달창 thead, key
 	const thead4 = [
 		"No",
 		"기관명",

 
 		},
 	];
-	const thead5 = [
-		"대상자",
-		"대여일",
-		"반납예정일",
-		"선택",
-	];
-	const key5 = [
-		"senior",
-		"date",
-		"choice",
-	];
-	const content5 = [
-		{
-			No: 1,
-			senior: (
-				<div>
-					<input type="text" list="senior_list" />
-					<datalist id="senior_list">
-						<option value="대상자1(ID)"></option>
-						<option value="대상자2(ID)"></option>
-						<option value="대상자3(ID)"></option>
-					</datalist>
-				</div>
-			)
-			,
-			choice: (<Button
-				className={"btn-small gray-btn"}
-				btnName={"선택"}
-			/>)
 
-		},
-	];
-
-
-
+	// 장비 탭별 화면
 	const data = [
 		{
 			id: 1,

 							navigate("/EquipmentManagementSelectOne");
 						}}
 					/> */}
-					<table class = "caregiver-user">
+					<table class="caregiver-user">
 						<thead>
 							<tr>
-							{thead1.map((i) => {
-								return <th>{i}</th>;
-							})}
+								{thead1.map((i) => {
+									return <th>{i}</th>;
+								})}
 							</tr>
 						</thead>
 						<tbody>
 							{equipmentList.map((item, index) => {
-							return (
-								<tr key={index}>
-									<td>{equipmentList.length - index}</td>
-									{key1.map((kes) => {
-										return <td>{item[kes]}</td>
-									})}
-									<td>
-									{
-										item['senior_id'] == null
-										? <Button
-												className={"btn-small green-btn"}
-												btnName={"등록"}
-												onClick={() => seniorMatchModalOpen(item)}
-											/>
-										: <Button
-											className={"btn-small green-btn"}
-											btnName={"삭제"}
-											onClick={seniorMatchDelete}
-										/>
-									}
-									</td>
-								</tr>
-							);
+								return (
+									<tr key={index}>
+										<td>{equipmentList.length - index}</td>
+										{key1.map((kes) => {
+											return <td>{item[kes]}</td>
+										})}
+										<td>
+											{
+												item['senior_id'] == null
+													? <Button
+														className={"btn-small green-btn"}
+														btnName={"등록"}
+														onClick={() => seniorMatchInsertModalOpen(item)}
+													/>
+													: <Button
+														className={"btn-small green-btn"}
+														btnName={"삭제"}
+														onClick={seniorMatchDelete}
+													/>
+											}
+										</td>
+									</tr>
+								);
 							})}
 						</tbody>
 					</table>

 								btnName={"LOG"}
 								onClick={logCheck}
 							/>
-							<Button
-								className={"btn-small green-btn"}
-								btnName={"등록"}
-								onClick={openModal3}
-							/>
 						</div>
 					</div>
-					<table class = "caregiver-user">
+					<table class="caregiver-user">
 						<thead>
 							<tr>
-							{thead11.map((i) => {
-								return <th>{i}</th>;
-							})}
+								{thead11.map((i) => {
+									return <th>{i}</th>;
+								})}
 							</tr>
 						</thead>
 						<tbody>
 							{agencyEquipmentList.map((item, index) => {
-							return (
-								<tr key={index}>
-									<td>{agencyEquipmentList.length - index}</td>
-									{key11.map((kes) => {
-										return <td>{item[kes]}</td>
-									})}
-									<td>
-									{
-										item['senior_id'] == null
-										? <Button
-												className={"btn-small green-btn"}
-												btnName={"등록"}
-												onClick={() => seniorMatchModalOpen(item)}
-											/>
-										: <Button
-											className={"btn-small green-btn"}
-											btnName={"삭제"}
-											onClick={seniorMatchDelete}
-										/>
-									}
-									</td>
-								</tr>
-							);
+								return (
+									<tr key={index}>
+										<td>{agencyEquipmentList.length - index}</td>
+										{key11.map((kes) => {
+											return <td>{item[kes]}</td>
+										})}
+										<td>
+											{
+												item['senior_id'] == null
+													? <Button
+														className={"btn-small green-btn"}
+														btnName={"등록"}
+														onClick={() => seniorMatchInsertModalOpen(item)}
+													/>
+													: <Button
+														className={"btn-small green-btn"}
+														btnName={"반납"}
+														onClick={() => seniorMatchDeleteModalOpen(item)}
+													/>
+											}
+										</td>
+									</tr>
+								);
 							})}
 						</tbody>
 					</table>

 			title: "대상자 장비(시행기관)" + "(" + agencySeniorEquipmentList.length + ")",
 			description: (
 				<div>
-					{/* <table class = "caregiver-user">
+					<div className="flex">
+						<SubTitle explanation={"장비 클릭 시 지난 매칭이력을 확인할 수 있습니다."} />
+					</div>
+					<table class="caregiver-user">
 						<thead>
 							<tr>
-							{thead22.map((i) => {
-								return <th>{i}</th>;
-							})}
+								{thead22.map((i) => {
+									return <th>{i}</th>;
+								})}
 							</tr>
 						</thead>
 						<tbody>
 							{agencySeniorEquipmentList.map((item, index) => {
-							return (
-								<tr key={index}>
-									<td>{agencySeniorEquipmentList.length - index}</td>
-									{key22.map((kes) => {
-										return <td>{item[kes]}</td>
-									})}
-									<td>
-										<Button
-											className={"btn-small green-btn"}
-											btnName={"삭제"}
-											onClick={seniorMatchDelete}
-										/>
-									</td>
-								</tr>
-							);
-							})}
-						</tbody>
-					</table> */}
-					<table class = "caregiver-user">
-						<thead>
-							<tr>
-							{thead22.map((i) => {
-								return <th>{i}</th>;
-							})}
-							</tr>
-						</thead>
-						<tbody>
-							{agencySeniorEquipmentList.map((item, index) => {
-							return (
-								<tr key={index}>
-									<td>{agencySeniorEquipmentList.length - index}</td>
-									{key22.map((kes) => {
-										return <td>{item[kes]}</td>
-									})}
-									<td>
-										<Button
-											className={"btn-small green-btn"}
-											btnName={"삭제"}
-											onClick={seniorMatchDelete}
-										/>
-									</td>
-								</tr>
-							);
+								return (
+									<tr key={index}>
+										<td>{agencySeniorEquipmentList.length - index}</td>
+										{key22.map((kes) => {
+											return <td>{item[kes]}</td>
+										})}
+										<td>
+											{
+												<Button
+													className={"btn-small green-btn"}
+													btnName={"반납"}
+													onClick={() => seniorMatchDeleteModalOpen(item)}
+												/>
+											}
+										</td>
+									</tr>
+								);
 							})}
 						</tbody>
 					</table>

 		},
 		{
 			id: 6,
-			title: "재고 장비(시행기관)" + "(" + ")",
+			title: "재고 장비(시행기관)" + "(" + agencyStockEquipmentList.length + ")",
 			description: (
-				<Table
-					className={"caregiver-user"}
-					head={thead33}
-					contents={content33}
-					contentKey={key33}
-				/>
+				<div>
+					<div className="flex">
+						<SubTitle explanation={"장비 클릭 시 지난 매칭이력을 확인할 수 있습니다."} />
+					</div>
+					<table class="caregiver-user">
+						<thead>
+							<tr>
+								{thead33.map((i) => {
+									return <th>{i}</th>;
+								})}
+							</tr>
+						</thead>
+						<tbody>
+							{agencyStockEquipmentList.map((item, index) => {
+								return (
+									<tr key={index}>
+										<td>{agencyStockEquipmentList.length - index}</td>
+										{key33.map((kes) => {
+											return <td>{item[kes]}</td>
+										})}
+										<td>
+											{
+												<Button
+													className={"btn-small green-btn"}
+													btnName={"등록"}
+													onClick={() => seniorMatchInsertModalOpen(item)}
+												/>
+											}
+										</td>
+									</tr>
+								);
+							})}
+						</tbody>
+					</table>
+				</div>
 			),
 		},
 	];
 
 	//시작 탭 설정
 	const [index, setIndex] = React.useState(4);
+
 	return (
 		<main>
 			<Modal open={modalOpen} close={closeModal} header="납품 기관 선택">

 					</div>
 				</div>
 			</Modal>
-			<Modal open={seniorMatchModal} close={seniorMatchModalClose} header="대상자 장비 등록">
-				<div className="board-wrap">
-					<div>
-						<table className={"caregiver-user"}>
-							<thead>
-								<tr>
-								{thead5.map((i) => {
-									return <th>{i}</th>;
-								})}
-								</tr>
-							</thead>
-							<tbody>
-								<tr>
-									<td>
-										<input type="text" list="senior_list" placeholder="대상자를 입력해 주세요" onChange={seniorEquipmentSeniorInsert}/>
-										<datalist id="senior_list">
-											{seniorList.map((item) => {
-												// return <option value={item['user_name'] + " (" + item['user_id'] + ")"}></option>
-												return <option value={item['user_id']}>{item['user_name']}</option>
 
-											})}
-										</datalist>
-									</td>
-									<td>
-										<input type="date" onChange={seniorEquipmentRentalStartDateInsert}/>
-									</td>
-									<td>
-										<input type="date" onChange={seniorEquipmentRentalEndDateInsert}/>
-									</td>
-									<td>
-										<Button
-											className={"btn-small gray-btn"}
-											btnName={"선택"}
-											onClick={seniorEquipmentInsert}
-										/>
-									</td>
-								</tr>
-							</tbody>
-						</table>
-					</div>
-					<div>
-						<Button
-							className={"btn-100 green-btn"}
-							btnName={"닫기"}
-							onClick={seniorMatchModalClose}
-						/>
-					</div>
-				</div>
-			</Modal>
 			<Modal open={modalOpen3} close={closeModal3} header="장비 등록">
 				<div className="board-wrap">
 					<div>

 					</div>
 				</div>
 			</Modal>
+			
+			<Modal open={seniorMatchInsertModal} close={seniorMatchInsertModalClose} header="대상자 장비 등록">
+				<div className="board-wrap">
+					<div>
+						<table className={"caregiver-user"}>
+							<thead>
+								<tr>
+									{thead44.map((i) => {
+										return <th>{i}</th>;
+									})}
+								</tr>
+							</thead>
+							<tbody>
+								<tr>
+									<td>
+										<input type="text" list="senior_list" placeholder="대상자를 입력해 주세요" onChange={seniorEquipmentSeniorInsert} />
+										<datalist id="senior_list">
+											{seniorList.map((item) => {
+												// return <option value={item['user_name'] + " (" + item['user_id'] + ")"}></option>
+												return <option value={item['user_id']}>{item['user_name']}</option>
+
+											})}
+										</datalist>
+									</td>
+									<td>
+										<input type="date" onChange={seniorEquipmentRentalStartDateInsert} />
+									</td>
+									<td>
+										<input type="date" onChange={seniorEquipmentRentalEndDateInsert} />
+									</td>
+									<td>
+										<Button
+											className={"btn-small gray-btn"}
+											btnName={"선택"}
+											onClick={seniorEquipmentInsert}
+										/>
+									</td>
+								</tr>
+							</tbody>
+						</table>
+					</div>
+					<div>
+						<Button
+							className={"btn-100 green-btn"}
+							btnName={"닫기"}
+							onClick={seniorMatchInsertModalClose}
+						/>
+					</div>
+				</div>
+			</Modal>
+
+			<Modal open={seniorMatchDeleteModal} close={seniorMatchDeleteModalClose} header="대상자 장비 반납">
+				<div className="board-wrap">
+					<div>
+						<table className={"caregiver-user"}>
+							<thead>
+								<tr>
+									{thead55.map((i) => {
+										return <th>{i}</th>;
+									})}
+								</tr>
+							</thead>
+							<tbody>
+								<tr>
+									<td>
+										<input type="date" onChange={seniorEquipmentRentalReturnDateInsert} />
+									</td>
+									<td>
+										<input type="text" list="senior_list" placeholder="반납 관리자를 입력해 주세요" onChange={seniorEquipmentReturnUserIdInsert} />
+										<datalist id="senior_list">
+											{seniorList.map((item) => {
+												// return <option value={item['user_name'] + " (" + item['user_id'] + ")"}></option>
+												return <option value={item['user_id']}>{item['user_name']}</option>
+
+											})}
+										</datalist>
+									</td>
+									<td>
+										<Button
+											className={"btn-small gray-btn"}
+											btnName={"선택"}
+											onClick={seniorEquipmentInsert}
+										/>
+									</td>
+								</tr>
+							</tbody>
+						</table>
+					</div>
+					<div>
+						<Button
+							className={"btn-100 green-btn"}
+							btnName={"닫기"}
+							onClick={seniorMatchInsertModalClose}
+						/>
+					</div>
+				</div>
+			</Modal>
+
+
 			<div className="tab-container">
 				<ul className="tab-menu">
 					{data.map((item) => (
Add a comment
Open 0
Closed 0
List
Delete comment
