<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml"
	  xmlns:th="http://www.thymeleaf.org"
	  xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
	  layout:decorate="~{/web/layout/homeLayout}">
	<th:block layout:fragment="layout_css">
		<link rel="stylesheet" href="/css/web/home.css?v1.1">
		<link rel="stylesheet" href="/css/web/modal_home.css?v1.1">
		<link rel="stylesheet" href="/css/web/modal_customer_sub_consulting.css?v1.1">
		<link rel="stylesheet" href="/css/web/modal_customer_sub_sisul.css?v1.1">
		<link rel="stylesheet" href="/css/web/modal_home_message.css?v1.0">
	</th:block>

<th:block layout:fragment="layout_top_script">
<script>
let menuClass     = "[[${menuClass}]]"==""?"":"[[${menuClass}]]";
let selectUseYn   = "[[${selectUseYn}]]"==""?"N":"[[${selectUseYn}]]";
let insertUseYn   = "[[${insertUseYn}]]"==""?"N":"[[${insertUseYn}]]";
let updateUseYn   = "[[${updateUseYn}]]"==""?"N":"[[${updateUseYn}]]";
let deleteUseYn   = "[[${deleteUseYn}]]"==""?"N":"[[${deleteUseYn}]]";
let downloadUseYn = "[[${downloadUseYn}]]"==""?"N":"[[${downloadUseYn}]]";
</script>
</th:block>
<th:block layout:fragment="layout_content">
<div class="home_wrap">
	<!-- 왼쪽 -->
	<div class="left_box">
		<div class="calendar" id="date_reserveSearchDate"></div>

		<div class="notice">
			<p>금일 공지사항</p>

			<div id="noticeBox" class="subject"></div>
		</div>

		<div class="situation">
			<p>금일 근무 현황</p>

			<div id="attendanceBox" class="subject"></div>
		</div>
	</div>

	<!-- 왼쪽 - 반응형버튼 -->
	<ul class="media_button_left">
		<li>
			<button class="show_btn calendar_btn" onclick="calendar()"><img src="/image/web/menu_8_off.svg" alt="menu"/></button>
		</li>
		<li>
			<button class="show_btn notice_btn" onclick="notice()"><img src="/image/web/menu_8_off.svg" alt="menu"/></button>
		</li>
		<li>
			<button class="show_btn situation_btn" onclick="situation()"><img src="/image/web/menu_8_off.svg" alt="menu"/></button>
		</li>
	</ul>


	<!-- 센터쪽 -->
	<div class="center_box">
		<div class="tab_panel" role="tabpanel">
			<!-- 탭 -->
			<div class="nav_box">
				<ul class="nav nav-tabs" role="tablist">
					<li role="presentation" class="active">
						<a href="#career" aria-controls="career" role="tab" data-toggle="tab">
							<p>예약현황</p>
						</a>
					</li>
				</ul>

				<!-- 예약상황 -->
				<ul class="user_number">
					<li>예약 <span class="tStatusCount">0</span><p class="treartmentCountCount"></p></li>
					<li>접수 <span class="rStatusCount">0</span><p class="treartmentCountCount2"></p></li>
					<li>진료중 <span class="gStatusCount">0</span></li>
					<li>수납 <span class="pStatusCount">0</span><p class="treartmentCountCount3"></p></li>
					<li>예약취소 <span class="tnStatusCount">0</span></li>
				</ul>
			</div>


			<!-- Tab panes -->
			<div class="tab-content">
				<div role="tabpanel" class="tab-pane active" id="career">
					<div class="filter_box">
						<p>스케줄 필터</p>

						<div class="form_box">
							<div class="multiSelectBox">
								<select id="sel_reserveTreatment" multiple data-actions-box="true">
								</select>
							</div>

							<div class="multiSelectBox">
								<select id="sel_reserveTreatmentProcedure" multiple data-actions-box="true">
								</select>
							</div>

							<div class="multiSelectBox">
								<select id="sel_reserveMember" multiple data-actions-box="true">
								</select>
							</div>

							<div class="multiSelectBox">
								<select id="sel_reserveReserveVisit" multiple data-actions-box="true">
								</select>
							</div>
							<div class="search_list_box">
								<button class="search_btn">조회</button>
							</div>
						</div>
					</div>

					<!-- 예약현황표 -->
					<div class="main_content">
						<!-- 1. 시간 -->
						<ul class="time"></ul>
						
						<div class="table_box" style="position:relative;">
							<!-- 2. 직원 -->
							<div class="top_box">
								<div class="diagnosis_list"></div>
							</div>
							<!-- 3. 예약현황 -->
							<div class="bottom_box"></div>

							<div id="homeContextMenu" style="position:absolute; display:none; background:red; z-index:1; width:200px; height:100px;">
								<ul class="dropdown-menu">
									<li onclick="fn_insertReservePopup('')">
										<p class="list">예약하기</p>
									</li>
								</ul>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>


	<!-- 오른쪽 - 반응형버튼 -->
	<div class="media_button_right">
		<button onClick="rightOpen()">임시버튼</button>
	</div>


	<!-- 오른쪽_예약목로그,진료대기,진료끝 -->
	<div class="right_box">
		<div class="tab_panel" role="tabpanel">
			<!-- Nav tabs -->
			<div class="nav_box">
				<ul class="nav nav-tabs" role="tablist">
					<li role="presentation" class="active">
						<a class="active" href="#reservation_list" aria-controls="reservation_list" role="tab" data-toggle="tab">
							<p>예약목록</p>
						</a>
					</li>

					<li role="presentation">
						<a href="#diagnosis_list" aria-controls="diagnosis_list" role="tab" data-toggle="tab">
							<p>접수</p>
						</a>
					</li>

					<li role="presentation">
						<a href="#treatment_list" aria-controls="treatment_list" role="tab" data-toggle="tab">
							<p>진료중</p>
						</a>
					</li>

					<li role="presentation">
						<a href="#complete_list" aria-controls="complete_list" role="tab" data-toggle="tab">
							<p>진료끝</p>
						</a>
					</li>
				</ul>
			</div>
			
			<!-- 탭 상세 -->
			<div class="tab-content">
				<div role="tabpanel" class="tab-pane active" id="reservation_list">
					<!-- 접수,접수취소,검색 -->
					<div class="form_box">
						<div class="select_list first">
							<div class="select_box dropdown">
								<button class="label" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">예약</button>
								<input type="hidden" id="reservationStatus" value=""/>
								
								<ul class="select_option_list dropdown-menu">
									<li class="option_list_item">
										<input type="hidden" name="comboId" value="T"/>
										<span>예약</span>
									</li>
									<li class="option_list_item">
										<input type="hidden" name="comboId" value="TN"/>
										<span>예약취소</span>
									</li>
								</ul>
							</div>
						</div>

						<div class="select_list">
							<div class="select_box dropdown">
								<button class="label" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">진료 전체</button>
								<input type="hidden" id="reservationTreatmentId" />
								
								<ul class="select_option_list dropdown-menu"></ul>
							</div>
						</div>

						<div class="search_box">
							<img src="/image/web/search_B.svg" alt="search"/>
							<input type="text" id="reservationSeaerchKeyword" placeholder="">
						</div>

						<div class="search_list_box">
							<button class="search_btn">조회</button>
						</div>
					</div>

					
					<!-- 환자리스트 -->
					<div class="reservation_box">
						<div class="reservation_title">
							<!-- <label for="checkAll" class="chk_box">
								<input type="checkbox" id="checkAll" checked="checked">
								<span class="on"></span>
							</label> -->
							<p class="user">이름/진료정보</p>
							<p class="time">예약시간</p>
							<p class="memo">예약/접수메모</p>
						</div>

						
						<ul class="reservation_list">
							<li>
								<p>조회 정보가 없습니다.</p>
							</li>
						</ul>
					</div>
				</div>

				<div role="tabpanel" class="tab-pane" id="diagnosis_list">
					<!-- 접수,접수취소,검색 -->
					<div class="form_box">
						<div class="select_list first">
							<div class="select_box dropdown">
								<button class="label" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">접수</button>
								<input type="hidden" id="diagnosisStatus" value="R"/>
								
								<ul class="select_option_list dropdown-menu">
									<li class="option_list_item">
										<input type="hidden" name="comboId" value="R"/>
										<span>접수</span>
									</li>
									<li class="option_list_item">
										<input type="hidden" name="comboId" value="RN"/>
										<span>접수취소</span>
									</li>
								</ul>
							</div>
						</div>

						<div class="select_list">
							<div class="select_box dropdown">
								<button class="label" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">진료 전체</button>
								<input type="hidden" id="diagnosisTreatmentId" />
								
								<ul class="select_option_list dropdown-menu"></ul>
							</div>
						</div>

						<div class="search_box">
							<img src="/image/web/search_B.svg" alt=""/>
							<input type="text" id="diagnosisSeaerchKeyword" placeholder="">
						</div>

						<div class="search_list_box">
							<button class="search_btn">조회</button>
						</div>
					</div>

					<!-- 환자리스트 -->
					<div class="diagnosis_box">
						<div class="diagnosis_title">
							<!-- <label for="allCheck" class="chk_box">
								<input type="checkbox" id="allCheck" checked="checked">
								<span class="on"></span>
							</label> -->

							<p class="user">이름/진료정보</p>
							<p class="time">예약시간</p>
							<p class="memo">예약/접수메모</p>
						</div>

						
						<ul class="diagnosis_list">
							<li>
								<p>조회 정보가 없습니다.</p>
							</li>
						</ul>
					</div>
				</div>

				<div role="tabpanel" class="tab-pane" id="treatment_list">
					<div class="form_box">
						<div class="select_list">
							<div class="select_box dropdown">
								<button class="label" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">진료 전체</button>
								<input type="hidden" id="treatmentTreatmentId" value="">

								<ul class="select_option_list dropdown-menu"> <li class="option_list_item">	<input type="hidden" name="comboId" value="">	<span>진료 전체</span></li><li class="option_list_item">	<input type="hidden" name="comboId" value="T171979943377400000000010">	<span>비만</span></li><li class="option_list_item">	<input type="hidden" name="comboId" value="T171979944160300000000011">	<span>피부</span></li><li class="option_list_item">	<input type="hidden" name="comboId" value="T171979944754000000000012">	<span>쁘띠</span></li><li class="option_list_item">	<input type="hidden" name="comboId" value="T171979948889700000000016">	<span>기타</span></li></ul>
							</div>
						</div>

						<div class="search_box">
							<img src="/image/web/search_B.svg" alt="search"/>
							<input type="text" id="treatmentSeaerchKeyword" placeholder="">
						</div>
						
						<div class="search_list_box">
							<button class="search_btn">조회</button>
						</div>
					</div>

					<!-- 환자리스트 -->
					<div class="treatment_box">
						<div class="diagnosis_title">
							<!-- <label for="allCheck" class="chk_box">
								<input type="checkbox" id="allCheck" checked="checked">
								<span class="on"></span>
							</label> -->

							<p class="user">이름/진료정보</p>
							<p class="time">예약시간</p>
							<p class="memo">예약/접수메모</p>
						</div>

						
						<ul class="diagnosis_list">
							<li>
								<p>조회 정보가 없습니다.</p>
							</li>
						</ul>
					</div>
				</div>

				<div role="tabpanel" class="tab-pane" id="complete_list">
					<div class="form_box">
						<div class="select_list">
							<div class="select_box dropdown">
								<button class="label" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">진료 전체</button>
								<input type="hidden" id="completeTreatmentId" value="">

								<ul class="select_option_list dropdown-menu"> <li class="option_list_item">	<input type="hidden" name="comboId" value="">	<span>진료 전체</span></li><li class="option_list_item">	<input type="hidden" name="comboId" value="T171979943377400000000010">	<span>비만</span></li><li class="option_list_item">	<input type="hidden" name="comboId" value="T171979944160300000000011">	<span>피부</span></li><li class="option_list_item">	<input type="hidden" name="comboId" value="T171979944754000000000012">	<span>쁘띠</span></li><li class="option_list_item">	<input type="hidden" name="comboId" value="T171979948889700000000016">	<span>기타</span></li></ul>
							</div>
						</div>
						<div class="search_box">
							<img src="/image/web/search_B.svg" alt="search"/>
							<input type="text" id="completeSeaerchKeyword" placeholder="">
						</div>
						
						<div class="search_list_box">
							<button class="search_btn">조회</button>
						</div>
					</div>

					<div class="complete_box">
						<div class="complete_title">
							<p class="user">이름/진료정보</p>
							<p class="time">예약시간</p>
							<p class="whether">수납여부</p>
						</div>

						
						<ul class="complete_list">
							<li>
								<p>조회 정보가 없습니다.</p>
							</li>
						</ul>
					</div>
				</div>
			</div>
		</div>

		<!-- user_info -->
		<div class="user_info">
			<input type="hidden" id="hiddenMuUserId">
			<div class="user_info_top">
				<p class="user userName" id="homeRightUserInfoName" style="cursor:pointer;"></p>
				<button class="close_btn"><img src='/image/web/close.svg' alt="close"/></button>
			</div>
			<div class="user_info_bottom">
				<ul class="user_info_bottom_top">
					<li>
						<p class="label">인적사항</p>
						<p class="info">
							<span class="birthday"></span>
							<span class="age"></span>
							<span class="gender"></span>
							<span class="nationality"></span>
						</p>
					</li>
					<li>
						<p class="label">연락처</p>
						<p class="info phoneNumber"></p>
					</li>
					<li>
						<p class="label" id="homeRightUserInfoPhysical" style="cursor:pointer;">신체기록</p>
						<p class="info userPhysical"></p>
					</li>
					<li>
						<p class="label">고객구분</p>
						<p class="info userType"></p>
					</li>
					<li>
						<p class="label">특이사항</p>
						<p class="info etc"></p>
					</li>
					<li>
						<p class="label">고객메모</p>
						<p class="info memo"></p>
					</li>
				</ul>

				<div class="ul_top">
					<p>예약 정보</p>
					<!--<button class="info_btn">예약 상세 정보</button>-->
				</div>
				<ul class="user_info_bottom_center">
					<li>
						<p class="label">상태</p>
						<p class="info statusImg"></p>
					</li>
					<li>
						<p class="label">예약시간</p>
						<p class="info reserveDateTime"></p>
					</li>
					<li>
						<p class="label">방문유형</p>
						<p class="info visitType">재진</p>
					</li>
					<li>
						<p class="label">닥터/상담</p>
						<p class="info reserveMemberName"></p>
					</li>
					<li>
						<p class="label">진료유형</p>
						<p class="info treatmentName"></p>
					</li>
					<li>
						<p class="label">시술명</p>
						<p class="info treatmentProcedureName"></p>
					</li>
					<li>
						<p class="label">예약메모</p>
						<p class="info reserveEtc">-</p>
					</li>
					<li class="newUserHidden" style="display:none;">
						<p class="label">차트</p>
						<p class="info">
							<button class="counseling_btn"><img src='/image/web/bubble.svg' alt="상담차트"/>상담차트</button>
							<button class="surgery_btn"><img src='/image/web/hospital_btn.svg' alt="시술차트"/>시술차트</button>
						</p>
					</li>
				</ul>
				<div class="button_box">
					<button class="modify_btn"><img src="/image/web/menu_6_on.svg" alt="수정"/>수정</button>
					<button class="accept_btn"><img src="/image/web/receipt.svg" alt="접수"/>접수</button>
					<button class="new_user_btn newUser" style="display:none;"><img src="/image/web/registration.svg" alt="신환등록"/>신환등록</button>
					<button class="calculation_btn newUserHidden" style="display:none;"><img src="/image/web/menu_3_on.svg" alt="수납"/>수납</button>
				</div>

				<div class="table_top newUserHidden" style="display:none;">
					<p>이용 내역</p>
					<button class="more_btn">내역 더보기</button>
				</div>
				<div class='table_box newUserHidden' style="display:none;">
					<table>
						<thead>
							<tr>
								<th>예약날짜</th>
								<th>진료유형</th>
								<th>닥터/상담</th>
								<th>상태</th>
							</tr>
						</thead>
						<tbody>
							<tr>
								<td colspan="4">조회 내역이 없습니다.</td>
							</tr>
						</tbody>
					</table>
				</div>
			</div>
		</div>
	</div>
</div>
</th:block>
<th:block layout:fragment="layout_popup">

</th:block>

<th:block layout:fragment="layout_script">
<script>
$(function(){
	
});
</script>
<script src="/js/web/home/homeSelectList.js"></script>
<script src="/js/web/home/popup/homeSmsInsertPop.js"></script>
<script src="/js/web/kicc/kiccPosDll.js"></script>
<script src="/js/web/userconsultingchart/popup/userConsultingChartUpdatePop.js"></script>
<script src="/js/web/usermedicalchart/popup/userMedicalChartUpdatePop.js"></script>
<script src="/js/web/reserve/popup/reservePaymentInsertPop.js"></script>
<script src="/js/web/reserve/popup/discountInsertPop.js"></script>
<script src="/js/web/reserve/popup/discountPayCheckPop.js"></script>
<script src="/js/web/reserve/popup/paymentMembershipInsertPop.js"></script>
<script src="/js/web/reserve/popup/membershipPayCheckPop.js"></script>
<script src="/js/web/reserve/popup/paymentMembershipPartialPop.js"></script>
<script src="/js/web/reserve/popup/paymentMonetizationPop.js"></script>
<script src="/js/web/reserve/popup/paymentAccountPop.js"></script>
<script src="/js/web/reserve/popup/paymentCancellationPop.js"></script>
<script src="/js/web/reserve/popup/paymentCancellationPayPop.js"></script>
<script src="/js/web/reserve/popup/paymentRefundPop.js"></script>

<script src="/js/web/user/popup/userInfoUpdatePop.js"></script>
</th:block>
</html>
