<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="~{/mobile/layout/homeLayout}">
<th:block layout:fragment="layout_css">
	<link rel="stylesheet" href="/css/mobile/mypage.css">
	<link rel="stylesheet" href="/css/mobile/swiper-bundle.min.css">
</th:block>
<th:block layout:fragment="layout_top_script">
	<script src="/js/mobile/swiper-bundle.min.js"></script>
</th:block>

<th:block layout:fragment="layout_content">
	<h1>어서오세요, <th:block>[[${session.mobileLoginName}]]</th:block>님!</h1>
	<div class="point_box">
	<div class="text_box">
		<p>MEMBERSHIP POINT</p>
		<p id="membershipBalance">- 원</p>
		<p>충전된 잔여 포인트 금액입니다.<br/>추가 충전이 필요하신 경우, 내원시 담당자에게 요청해주세요.</p>
	</div>
	<div class="button_box">
		<button class="charging_detail_btn" onClick="location.href='/mobilemembership/selectListMembershipChargeIntro.do'">충전내역</button>
		<button class="use_detail_btn" onClick="location.href='/mobilemembership/selectListMembershipUseIntro.do'">사용내역</button>
	</div>
</div>
<div class="button_box">
	<button onClick="location.href='/mobileuserphysical/selectListUserPhysicalIntro.do'">
		<p>변화된 BMI 기록을 확인하세요</p>
		<p>신체 기록 확인하기</p>
		<img src="/image/mobile/arrow_b.svg" alt="arrow"/>
	</button>
</div>
<ul class="mypage_list">
	<!-- 개인 설정 -->
	<li class="title">개인 설정</li>
	<li>
		<a href="/mobileuser/selectUserAccountIntro.do">
			<div class="img_box">
				<img src="/image/mobile/mypage_lock.svg" alt="회원정보설정"/>
			</div>
			<p>회원정보 설정</p>
		</a>
	</li>
	<!-- 알림 설정 -->
	<li class="title">알림 설정</li>
	<li class="push">
		<div class="img_box">
			<img src="/image/mobile/mypage_push.svg" alt="기본 push 알림"/>
		</div>
		<p>기본 PUSH 알림</p>
		<div class="switch">
			<input type="checkbox" id="autoPushYn"/>
			<label for="autoPushYn"></label>
		</div>
	</li>
	<li class="push">
		<div class="img_box">
			<img src="/image/mobile/mypage_push.svg" alt="마케팅 push 알림"/>
		</div>
		<p>마케팅 PUSH 알림</p>
		<div class="switch">
			<input type="checkbox" id="marketingPushYn"/>
			<label for="marketingPushYn"></label>
		</div>
	</li>
	<!-- 사용 정보 -->
	<li class="title">사용 정보</li>
	<li>
		<a href="/mobilenotice/selectNoticeIntro.do">
			<div class="img_box">
				<img src="/image/mobile/mypage_notice.svg" alt="공지사항"/>
			</div>
			<p>공지사항</p>
		</a>
	</li>
	<li>
		<a href="/mobileuseinfo/selectUseInfoIntro.do">
			<div class="img_box">
				<img src="/image/mobile/mypage_error.svg" alt="이용안내"/>
			</div>
			<p>이용안내</p>
		</a>
	</li>
	<li>
		<a href="/mobilecustomerservice/selectListCustomerServiceIntro.do">
			<div class="img_box">
				<img src="/image/mobile/mypage_phone.svg" alt="고객센터"/>
			</div>
			<p>고객센터</p>
		</a>
	</li>
	<li class="last">
		<a onclick="fn_logout();">
			<div class="img_box">
				<img src="/image/mobile/mypage_logout.svg" alt="로그아웃"/>
			</div>
			<p>로그아웃</p>
		</a>
	</li>
<!--	<li>-->
<!--        <a onclick="fn_deleteUser()">-->
<!--            <div class="img_box">-->
<!--                <img src="/image/mobile/mypage_withdrawal.svg" alt="회원탈퇴"/>-->
<!--            </div>-->
<!--            <p>회원탈퇴</p>-->
<!--        </a>-->
<!--    </li>-->
</ul>
<form id="loginForm" onsubmit="return false;"></form>
</th:block>
<th:block layout:fragment="layout_script">
	<script src="/js/mobile/mypage/selectMyPageInfo.js"></script>
</th:block>
</html>