kiosk 진행중

This commit is contained in:
pjs
2026-01-18 16:52:35 +09:00
parent 077a0767d0
commit f5425ba304
11 changed files with 1459 additions and 1256 deletions

View File

@@ -9,24 +9,25 @@
<!-- jQuery -->
<script src="/js/web/jquery.min.js"></script>
<script src="/js/web/jquery-ui.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.13.2/themes/base/jquery-ui.css">
<script src="/js/web/jquery-ui.js"></script>
<!-- Choices.js -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/choices.js/public/assets/styles/choices.min.css">
<script src="https://cdn.jsdelivr.net/npm/choices.js/public/assets/scripts/choices.min.js"></script>
<!-- Flatpickr -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css">
<script src="https://cdn.jsdelivr.net/npm/flatpickr"></script>
<script src="https://cdn.jsdelivr.net/npm/flatpickr/dist/l10n/ko.js"></script>
<!-- CSS -->
<link rel="stylesheet" href="/css/web/font.css">
<link rel="stylesheet" href="/css/kiosk/new-patient.css">
<!--KAKAO 주소API-->
<script src="//t1.daumcdn.net/mapjsapi/bundle/postcode/prod/postcode.v2.js"></script>
</head>
<th:block layout:fragment="layout_top_script">
<script src="/js/kiosk/new-patient.js"></script>
</th:block>
<!--<th:block th:replace="/web/include/modal :: layout_modal"></th:block>-->
@@ -45,37 +46,55 @@
<!-- Column 1: Basic Info -->
<section class="form-section-card col-card">
<div class="section-title">기본 정보</div>
<!-- Nationality -->
<!-- Name -->
<div class="form-row">
<label class="required">고객명</label>
<input type="text" name="modalUserName" placeholder="이름을 입력하세요" />
</div>
<!-- Nationality -->
<div class="form-row">
<label class="required">국적</label>
<select id="selectNationality" name="nationality">
<option value="">국적 선택</option>
</select>
</div>
<!-- Name -->
<div class="form-row">
<label class="required">고객명</label>
<input type="text" name="modalUserName" placeholder="이름을 입력하세요" />
</div>
<!-- Birthday -->
<div class="form-row">
<label>생년월일</label>
<div class="date-input-wrapper">
<input name="modalBirthday" type="text" placeholder="YYYY-MM-DD" readonly />
<span class="age-text txtAge"></span>
<img src="/image/web/calendar.svg" alt="calendar">
<div class="form-row">
<label class="required">주민등록번호</label>
<div class="split-inputs">
<input name="modalUserRrn1" type="text" placeholder="000000" maxlength="6" />
<span class="split-divider">-</span>
<input name="modalUserRrn2" type="password" placeholder="0000000" maxlength="7" />
</div>
</div>
<!-- Identification (Dynamic) -->
<div class="form-row foreigner_box">
<label class="required">여권번호</label>
<div class="passport_number_box">
<input name="modalUserPno" type="text" placeholder="여권번호 입력" />
</div>
</div>
<!-- Birthday -->
<div class="form-row">
<label for="modalBirthday" class="required">생년월일</label>
<div class="date-input-wrapper">
<input
type="text"
id="modalBirthday"
name="modalBirthday"
placeholder="YYYYMMDD"
maxlength="10"
/>
<span class="age-text txtAge">만 0세</span>
</div>
</div>
<!-- Gender -->
<div class="form-row">
<label>성별</label>
<div class="radio-group">
<div class="radio-item">
<input type="radio" name="modalGender" id="genderF" value="F" />
<input type="radio" name="modalGender" id="genderF" value="F" checked />
<label for="genderF">여자</label>
</div>
<div class="radio-item">
@@ -84,72 +103,62 @@
</div>
</div>
</div>
<!-- Identification (Dynamic) -->
<div class="form-row foreigner_box">
<label>식별정보</label>
<select id="selectIdentification" name="identificationType">
<option value="pno" selected>여권번호</option>
<option value="arc">외국인등록번호</option>
</select>
<div class="passport_number_box">
<input name="modalUserPno" type="text" placeholder="여권번호 입력" />
</div>
<div class="foreigner_number_box split-inputs" style="display:none;">
<input name="modalUserArc1" type="text" placeholder="000000" maxlength="6" />
<span class="split-divider">-</span>
<input name="modalUserArc2" type="password" placeholder="0000000" maxlength="7" />
</div>
<div class="form-row">
<label class="required">연락처</label>
<input name="modalPhoneNumber" type="tel" placeholder="010-0000-0000" />
</div>
<div class="form-row local_box">
<label>민등록번호</label>
<div class="split-inputs">
<input name="modalUserRrn1" type="text" placeholder="000000" maxlength="6" />
<span class="split-divider">-</span>
<input name="modalUserRrn2" type="password" placeholder="0000000" maxlength="7" />
</div>
<div class="form-row">
<label class="required"></label>
<div class="address-input-group" style="display: flex; gap: 8px;">
<input id="modalAddress" name="modalAddress" type="text" placeholder="주소를 검색하세요" readonly style="flex: 1; cursor: pointer;" />
<button type="button" id="btnSearchAddress" class="btn-small" style="padding: 0 15px; background: #333; color: #fff; border-radius: 4px;">검색</button>
</div>
<input id="modalAddressDetail" name="modalAddressDetail" type="text" placeholder="상세 주소를 입력하세요" style="margin-top: 8px;" />
</div>
<div class="form-row">
<label class="required">이메일</label>
<input name="email" type="text" placeholder="imadeu@naver.com" />
</div>
</section>
<!-- Column 2: Contact Info -->
<section class="form-section-card col-card">
<div class="section-title">연락처 및 동의</div>
<div class="section-title">개인정보 수집이용동의</div>
<div class="form-row checkbox-row">
<label for="agreePrivacy">개인정보 수집 및 이용안내</label>
<div class="checkbox-line">
<input type="checkbox" id="agreePrivacy" name="agreePrivacy" onclick="return false;" />
<a href="#" class="consent-link" data-type="agreePrivacy">개인정보 수집 및 이용안내 동의서 보기</a>
</div>
</div>
<!-- User Type -->
<div class="form-row">
<label>고객구분</label>
<select id="selectUserType" name="userType">
<option value="">고객구분 선택</option>
</select>
</div>
<div class="form-row checkbox-row">
<label for="agreeProcedure">시술동의서</label>
<div class="checkbox-line">
<input type="checkbox" id="agreeProcedure" name="agreeProcedure" onclick="return false;" />
<a href="#" class="consent-link" data-type="agreeProcedure">시술동의서 보기</a>
</div>
</div>
<!-- Phone 1 -->
<div class="form-row">
<label class="required">연락처</label>
<input name="modalPhoneNumber" type="tel" placeholder="010-0000-0000" />
</div>
<div class="form-row checkbox-row">
<label for="agreeTerms">이용약관동의서</label>
<div class="checkbox-line">
<input type="checkbox" id="agreeTerms" name="agreeTerms" onclick="return false;" />
<a href="#" class="consent-link" data-type="agreeTerms">이용약관 동의서 보기</a>
</div>
</div>
<!-- Phone 2 -->
<div class="form-row">
<label>보조 연락처</label>
<input name="modalPhoneNumber2" type="tel" placeholder="010-0000-0000" />
</div>
<!-- Photo Refusal -->
<div class="form-row">
<label>사진 거부</label>
<div class="radio-group">
<div class="radio-item">
<input type="radio" name="modalRefusePhotoYn" id="photoY" value="Y" checked />
<label for="photoY"></label>
</div>
<div class="radio-item">
<input type="radio" name="modalRefusePhotoYn" id="photoN" value="N" />
<label for="photoN">아니오</label>
</div>
</div>
</div>
<div class="form-row checkbox-row">
<label for="refusePhoto">사진촬영거부동의서</label>
<div class="checkbox-line">
<input type="checkbox" id="refusePhoto" name="refusePhoto" onclick="return false;" />
<a href="#" class="consent-link" data-type="refusePhoto">사진촬영거부동의서 동의서 보기</a>
</div>
</div>
<!-- SMS -->
<div class="form-row">
@@ -171,14 +180,6 @@
<section class="form-section-card col-card">
<div class="section-title">기타 정보</div>
<!-- Treatment -->
<div class="form-row">
<label>관심진료</label>
<select id="selectTreatment" name="treatment">
<option value="">관심진료 선택</option>
</select>
</div>
<!-- Channel -->
<div class="form-row">
<label>방문경로</label>
@@ -204,11 +205,6 @@
<textarea name="modalEtc" placeholder="특이사항을 입력하세요"></textarea>
</div>
<!-- Memo -->
<div class="form-row">
<label>고객 메모</label>
<textarea name="modalMemo" placeholder="메모를 입력하세요"></textarea>
</div>
</section>
</div>
@@ -223,7 +219,7 @@
</div>
</th:block>
<th:block layout:fragment="layout_script">
</th:block>