admin/madeu_crm
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

kiosk 개발시작

Browse Source
This commit is contained in:
pjs
2026-01-16 00:58:09 +09:00
parent 521aa41a18
commit 077a0767d0
3 changed files with 554 additions and 324 deletions
Download Patch File Download Diff File Expand all files Collapse all files

327
src/main/resources/templates/kiosk/new-patient.html
View File

@@ -26,9 +26,9 @@
</head>
<th:block layout:fragment="layout_top_script">
<script src="/js/kiosk/common.js"></script>
<script src="/js/kiosk/new-patient.js"></script>
</th:block>
<th:block th:replace="/web/include/modal :: layout_modal"></th:block>
<!--<th:block th:replace="/web/include/modal :: layout_modal"></th:block>-->
<th:block layout:fragment="layout_content">
<div id="newPatientForm" class="new-patient-container">
@@ -223,328 +223,9 @@
</div>
</th:block>
<th:block layout:fragment="layout_popup">
</th:block>
<th:block layout:fragment="layout_script">
<script type="text/javascript">
// Choices.js 인스턴스 저장
let choicesInstances = {};
$(document).ready(function () {
newPatientPage.init();
});
let newPatientPage = {
data: {
nationality: '',
nationalityCode: '',
userType: '',
visitPath: '',
treatment: ''
},
init: function () {
this.initChoices();
this.loadCommonCategories();
this.initDatepicker();
this.setEvent();
},
// Choices.js 초기화
initChoices: function () {
const choicesConfig = {
searchEnabled: true,
searchPlaceholderValue: '검색...',
noResultsText: '결과 없음',
noChoicesText: '선택 가능한 항목이 없습니다',
itemSelectText: '선택',
removeItemButton: false,
shouldSort: false,
placeholderValue: '선택하세요'
};
// 국적
choicesInstances.nationality = new Choices('#selectNationality', {
...choicesConfig,
placeholder: true,
placeholderValue: '국적 선택'
});
// 고객구분
choicesInstances.userType = new Choices('#selectUserType', {
...choicesConfig,
placeholder: true,
placeholderValue: '고객구분 선택'
});
// 관심진료
choicesInstances.treatment = new Choices('#selectTreatment', {
...choicesConfig,
placeholder: true,
placeholderValue: '관심진료 선택'
});
// 방문경로
choicesInstances.channel = new Choices('#selectChannel', {
...choicesConfig,
placeholder: true,
placeholderValue: '방문경로 선택'
});
// 식별정보 (여권/외국인등록번호)
choicesInstances.identification = new Choices('#selectIdentification', {
...choicesConfig,
searchEnabled: false,
placeholder: false
});
// 초기 상태 설정 (한국인 기본)
$('.foreigner_box').hide();
// Change 이벤트 바인딩
this.bindChoicesEvents();
},
bindChoicesEvents: function () {
let self = this;
// 식별정보 변경
let idSelect = document.getElementById('selectIdentification');
if (idSelect) {
idSelect.addEventListener('change', function (e) {
if (this.value === 'pno') {
$('.passport_number_box').show();
$('.foreigner_number_box').hide();
} else {
$('.passport_number_box').hide();
$('.foreigner_number_box').show();
}
});
}
// 국적 변경
document.getElementById('selectNationality').addEventListener('change', function (e) {
self.data.nationalityCode = this.value;
let selectedText = this.options[this.selectedIndex]?.text || '';
if (selectedText.includes('대한민국') || this.value.includes('KR') || this.value === 'Local') {
self.data.nationality = 'Local';
$('.local_box').show();
$('.foreigner_box').hide();
} else {
self.data.nationality = 'Foreigner';
$('.local_box').hide();
$('.foreigner_box').show();
}
});
// 고객구분 변경
document.getElementById('selectUserType').addEventListener('change', function (e) {
self.data.userType = this.value;
});
// 관심진료 변경
document.getElementById('selectTreatment').addEventListener('change', function (e) {
self.data.treatment = this.value;
});
// 방문경로 변경
document.getElementById('selectChannel').addEventListener('change', function (e) {
self.data.visitPath = this.value;
let selectedText = this.options[this.selectedIndex]?.text || '';
if (selectedText.includes('소개')) {
$('.searchIntroUser').show();
} else {
$('input[name="modalRecommendId"]').val('').removeAttr('data-userid');
}
});
},
// 공통 코드 로드
loadCommonCategories: function () {
this.fetchCategory('C202404110001', 'nationality'); // 국적
this.fetchCategory('C202404110002', 'userType'); // 고객구분
this.fetchCategory('C202404110003', 'channel'); // 방문경로
this.fetchTreatmentList(); // 관심진료
},
fetchCategory: function (code, choicesKey) {
$.ajax({
url: '/kiosk/getCategoryItem.do',
type: 'POST',
data: { categoryCode: code },
success: function (data) {
if (data.rows && data.rows.length > 0) {
let choices = data.rows.map(item => ({
value: item.categoryitemcode || item.commonCode || '',
label: item.categoryitemname || item.codeName || ''
}));
// Choices 인스턴스에 옵션 설정
if (choicesInstances[choicesKey]) {
choicesInstances[choicesKey].setChoices(choices, 'value', 'label', true);
// 국적의 경우 기본값 설정 (대한민국)
if (choicesKey === 'nationality') {
let defaultItem = choices.find(c => c.label.includes('대한민국'));
if (defaultItem) {
choicesInstances[choicesKey].setChoiceByValue(defaultItem.value);
newPatientPage.data.nationalityCode = defaultItem.value;
newPatientPage.data.nationality = 'Local';
}
}
}
}
},
error: function (xhr) {
console.error("카테고리 조회 실패:", code, xhr.responseText);
}
});
},
fetchTreatmentList: function () {
$.ajax({
url: '/kiosk/getTreatmentOptionList.do',
type: 'POST',
success: function (data) {
if (data.rows && data.rows.length > 0) {
let choices = data.rows.map(item => ({
value: item.mutreatmentid || '',
label: item.treatmentname || ''
}));
if (choicesInstances.treatment) {
choicesInstances.treatment.setChoices(choices, 'value', 'label', true);
}
}
}
});
},
// Datepicker 초기화 (Flatpickr)
initDatepicker: function () {
let birthdayInput = document.querySelector('input[name="modalBirthday"]');
if (!birthdayInput) return;
let fp = flatpickr(birthdayInput, {
locale: "ko",
dateFormat: "Y-m-d",
maxDate: "today",
disableMobile: true,
onChange: function (selectedDates, dateStr, instance) {
if (selectedDates.length > 0) {
let birthDate = selectedDates[0];
let today = new Date();
let age = today.getFullYear() - birthDate.getFullYear();
// 만 나이 계산
let m = today.getMonth() - birthDate.getMonth();
if (m < 0 || (m === 0 && today.getDate() < birthDate.getDate())) {
age--;
}
$('.txtAge').text('만 ' + age + '세');
// 주민번호 앞자리 자동 완성 (YYMMDD)
let yy = String(birthDate.getFullYear()).substring(2);
let mm = String(birthDate.getMonth() + 1).padStart(2, '0');
let dd = String(birthDate.getDate()).padStart(2, '0');
$('input[name="modalUserRrn1"]').val(yy + mm + dd);
}
}
});
// 래퍼/아이콘 클릭 시 달력 열기
$('.date-input-wrapper').off('click').on('click', function (e) {
e.stopPropagation();
fp.open();
});
},
// 이벤트 설정
setEvent: function () {
$('.cancel_btn').off('click').on("click", function () { history.back(); });
$('.registration_bth').off('click').on("click", function () { newPatientPage.save(); });
// 추천인 검색
$('.searchIntroUser').off('click').on('click', function () {
if (typeof userIntroSelectModal !== 'undefined') {
userIntroSelectModal.popup(function (obj) {
$('input[name="modalRecommendId"]').val(obj.username).attr('data-userid', obj.muuserid);
}, {});
}
});
// 전화번호 포맷
$('input[name="modalPhoneNumber"], input[name="modalPhoneNumber2"]').on('input', function () {
this.value = this.value.replace(/[^0-9]/g, '').replace(/(\d{3})(\d{3,4})(\d{4})/, '$1-$2-$3').substring(0, 13);
});
},
save: function () {
let userName = $('input[name="modalUserName"]').val().trim();
let phone = $('input[name="modalPhoneNumber"]').val().replace(/-/g, '');
let phone2 = $('input[name="modalPhoneNumber2"]').val().replace(/-/g, '');
let birthday = $('input[name="modalBirthday"]').val();
let gender = $('input[name="modalGender"]:checked').val();
let smsYn = $('input[name="modalSmsYn"]:checked').val();
let refusePhoto = $('input[name="modalRefusePhotoYn"]:checked').val();
let rrn1 = $('input[name="modalUserRrn1"]').val();
let rrn2 = $('input[name="modalUserRrn2"]').val();
let pno = $('input[name="modalUserPno"]').val();
let arc1 = $('input[name="modalUserArc1"]').val();
let arc2 = $('input[name="modalUserArc2"]').val();
let memo = $('textarea[name="modalMemo"]').val();
let etc = $('textarea[name="modalEtc"]').val();
let introUserId = $('input[name="modalRecommendId"]').attr('data-userid') || '';
// 유효성 검사
if (!userName) { modalEvent.warning("알림", "고객명을 입력해주세요."); return; }
if (!phone || phone.length < 10) { modalEvent.warning("알림", "올바른 연락처를 입력해주세요."); return; }
if (!$('#agree_privacy').is(':checked')) { modalEvent.warning("알림", "개인정보 수집 이용에 동의해야 합니다."); return; }
$.ajax({
url: '/kiosk/putUser.do',
type: 'POST',
data: {
nationality: this.data.nationality,
nationalityCode: this.data.nationalityCode,
userName: userName,
phoneNumber: phone,
phoneNumber2: phone2,
birthday: birthday,
gender: gender,
userRrn1: rrn1,
userRrn2: rrn2,
userPno: pno,
userArc1: arc1,
userArc2: arc2,
userTypeCode: this.data.userType,
channelCode: this.data.visitPath,
muGroupId: this.data.treatment,
introUserId: introUserId,
memo: memo,
etc: etc,
smsYn: smsYn,
refusePhotoYn: refusePhoto
},
success: function (data) {
if (data.msgCode == '0') {
modalEvent.success("등록 성공", "신규 고객 등록이 완료되었습니다.", function () {
location.href = '/kiosk/kiosk_main';
});
} else {
modalEvent.danger("오류", data.msgDesc);
}
},
error: function () {
modalEvent.danger("오류", "통신 중 오류가 발생했습니다.");
}
});
}
};
</script>
</th:block>
</html>