<!DOCTYPE html>
<html lang="ko"
	xmlns:th="http://www.thymeleaf.org"
	xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
	layout:decorator="mob/common/layout/LoginLayoutMob">
<!--
 *******************************************************************************
 * @source  : NonCustOrderConfirmFormMob.html
 * @desc    : 비회원주문확인 Page
 *============================================================================
 * STYLE24
 * Copyright(C) 2021 TSIT, All rights reserved.
 *============================================================================
 * VER  DATE         AUTHOR      DESCRIPTION
 * ===  ===========  ==========  =============================================
 * 1.0  2021.04.23   jsshin     최초 작성
 *******************************************************************************
 -->

<body>
<th:block layout:fragment="content">
<main class="container mb">
	<!-- ★ 컨텐츠 시작 -->
	<section class="content mb_idInquiry_8">
		<div class="inner">
			<div class="close">
				<a href="javascript:history.back();" class="btn_close"><span></span><span></span></a>
			</div>
		</div>
		<div class="inner">
			<h2 class="title">비회원 주문조회</h2>
		</div>
		<div class="inner">
				<form id="nonCustOrderForm" name="nonCustOrderForm" class="form_wrap form_full" role="form">
					<div class="form_head">
						<h3 class="title sr-only">비회원 주문 조회</h3>
					</div>
					<div class="form_info">
						<span class="ico_content_order"></span>
						<p>
							고객님의 주문 확인을 위해<br>주문번호 와 비밀번호를 입력하여 주세요.
						</p>
					</div>
					<div class="form_field mt30">
						<label class="input_label sr-only">이름(주문자명)</label>
						<input type="text" name="ordNm" placeholder="이름(주문자명)" id="ordNm" class="form_control" minlength="20" required="required" data-valid-name="이름"/>
					</div>
					<div class="form_field">
						<label class="input_label sr-only">휴대폰 번호</label>
						<input type="number" pattern="\d*" name="ordPhnno" placeholder="휴대폰 번호" id="ordPhnno" class="form_control" minlength="10" maxlength="11" required="required" data-valid-type="numeric" data-valid-name="휴대폰"/>
					</div>
					<div class="form_field">
						<label class="input_label sr-only">주문번호</label>
						<input type="number" pattern="\d*" name="ordNo" placeholder="주문 번호" id="ordNo" class="form_control" required="required" data-valid-type="numeric" data-valid-name="주문번호" maxlength="30"/>
					</div>
					<!-- 210415_수정 : 버튼 형식 변경. -->
					<div class="btn_group_flex">
						<div>
							<button type="button" id="btnNonOrder" class="btn btn_primary btn_block">
								<span>비회원 주문확인</span>
							</button>
						</div>
					</div>
					<!-- //210415_수정 : 버튼 형식 변경. -->
					<div class="form_summary clear">
						<p class="txt normal">
							STYLE24의 고객센터
							<span data-font="lato" class="c_primary ml10 bold">1544-5336</span>
						</p>
						<p class="t_info light mb20">
							비회원 주문확인 중 궁금하신 사항은 고객센터로 문의해주세요.
						</p>
						<p class="txt normal">
							아직 STYLE24 회원이 아니시라면?
							<button type="button" class="btn mini btn_default" onclick="cfnGoToPage(_PAGE_CUSTOMER_JOIN_TYPE);">
								<span>회원가입</span>
							</button>
						</p>
						<p class="t_info light">
							쇼핑 혜택충만! STYLE24 회원이 되세요!
						</p>
					</div>
				</form>
		</div>
	</section>
	<!-- ★ 컨텐츠 종료 -->
</main>

<script th:inline="javascript">
	$('#btnNonOrder').on('click', function () {
		if (!gagajf.validation($('#nonCustOrderForm'))) {
			return;
		}
		gagajf.ajaxFormSubmit('/noMember/order/info/validation','#nonCustOrderForm', fnOrderInfoCallback)
	});

	var fnOrderInfoCallback = function (result) {
		if (result.isFind) {
			cfnGoToPage(_PAGE_NOMEMBER_ORDER_LIST);
		} else {
			mcxDialog.alert('입력하신 정보가 정확하지 않습니다. 다시 시도해주세요.');
			return;
		}
	};
</script>
</th:block>
</body>
</html>