
/* ##############################################################
	설  명 : [Modal]기타설정 등록 팝업
	작성일 : 2023. 01. 19.
	작성자 : NTsoft
	수정일 	        수정자 	 수정내용
	-------         -------- ---------------------------
	2023. 01. 19.	NTsoft 	 최초 생성
*/
let categoryInsertModal = {
    callback : null,
    reqParam : null,
    dataList : null,
    /* 모달 초기화 작업 */
    init : function () {
        $('#categoryInsertModal').remove();
        $('body').append( this.HtmlTemplate);
        //그리드 이벤트
        this.setEvent();
        fn_modal_setCategoryType('modal_categoryList');
    },
    /* 그리드 이벤트 설정 */
    setEvent:function() {
        $('#categoryInsertModal .btnCancle').on("click", function(){
            categoryInsertModal.close();
        });

        $('#categoryInsertModal .btnSave').on("click", function(){
            categoryInsertModal.save("I");
        });
        $('#categoryInsertModal #file').on('change', function(e) {
            let file = e.currentTarget.files[0];
            if (file) {
                // 파일 크기 및 형식 검증
                let allowedTypes = ['image/png', 'image/svg+xml'];
                if (!allowedTypes.includes(file.type)) {
                    alert('이미지 파일은 PNG 또는 SVG 형식이어야 합니다.');
                    $(this).val(''); // 파일 입력 초기화
                    return;
                }

                // 이미지 해상도 검증
                let img = new Image();
                img.src = URL.createObjectURL(file);
                img.onload = function() {
                    let maxWidth = 16;
                    let maxHeight = 16;
                    if (img.width > maxWidth || img.height > maxHeight) {
                        modalEvent.warning('오류',`이미지 해상도는 ${maxWidth}x${maxHeight} 이하이어야 합니다.`);
                        $('#categoryInsertModal #file').val(''); // 파일 입력 초기화
                        return;
                    } else {
                        // 파일 이름 업데이트
                        $("#categoryInsertModal .upload-name").val(file.name);
                    }
                };
                img.onerror = function() {
                    modalEvent.warning('오류','유효하지 않은 이미지 파일입니다.');
                    $('#categoryInsertModal #file').val(''); // 파일 입력 초기화
                    return;
                };
            }
        });
        $('#categoryInsertModal .select_box').on('click', 'li', function (e) {
            fn_OptionSelection($(this), e);
        });

        $('#categoryInsertModal #modal_orderNumber').on('input', function() {
            // 입력된 키가 숫자가 아닌 경우 입력을 막음
            this.value = this.value.replace(/\D/g, '');
        });
    },
    /* 데이터 선택 */
    setSelect:function(selectNumber) {
        let checkedData = dataList[selectNumber];
        if(dataList==null||checkedData==undefined){
            return ;
        }

        if( categoryInsertModal.callback )  {
            categoryInsertModal.callback(checkedData);
        }
        categoryInsertModal.close();
    },
    //저장
    save:function(state) {
        let categoryName= $("#categoryInsertModal #modal_categoryList .selected").text();
        let categoryCode             = $("#categoryInsertModal #categoryListCode").val();
        let categoryItemName     = $("#categoryInsertModal #modal_categoryName").val();
        let orderNumber         = $("#categoryInsertModal #modal_orderNumber").val();
        let file             = $("#categoryInsertModal #file")[0].files[0]??'';
        let etc              = $("#categoryInsertModal #modal_etc").val();
        categoryId = categoryCode;
        if(true != fn_emptyCheck(categoryItemName)){
            modalEvent.warning("등록", "구분 명이 없습니다.");
            return;
        }
        if(true != fn_emptyCheck(orderNumber)){
            modalEvent.warning("등록", "정렬 순서가 없습니다.");
            return;
        }
        modalEvent.info("등록", "카테고리 정보를 등록하시겠습니까?", function(){
            let formData = new FormData();
            formData.append("menuClass", menuClass);
            formData.append("categoryName", categoryName);
            formData.append("categoryCode", categoryCode);
            formData.append("categoryItemName", categoryItemName);
            formData.append("orderNumber", orderNumber);
            formData.append("file", file);
            formData.append("etc", etc);

            $.ajax({
                url: encodeURI('/webcategory/insertHospitalOther.do'),
                data: formData,
                dataType: "json",
                processData: false,
                contentType: false,
                type: 'POST',
                async: true,
                success: function(data){
                    if('0'==data.msgCode){
                        modalEvent.success("등록 성공", data.msgDesc, function(){
                            if( categoryInsertModal.callback )  {
                                categoryInsertModal.callback();
                            }
                            categoryInsertModal.close();
                        });
                    }
                    else{
                        modalEvent.danger("등록 오류", data.msgDesc);
                    }
                },
                error : function(xhr, status, error) {
                    modalEvent.danger("등록 오류", "등록 중 오류가 발생하였습니다. 잠시후 다시시도하십시오.");
                },
                beforeSend:function(){

                },
                complete:function(){

                }
            });
        });
    },
    /*
     * 팝업
     * callback : 콜백함수, reqParam: 팝업파라미터
     */
    popup:function(callback, reqParam) {
        // 초기화 후 열기
        categoryInsertModal.init();

        //콜백함수 지정.
        categoryInsertModal.callback = callback;
        categoryInsertModal.reqParam = reqParam;
        categoryInsertModal.dataList = null;

        setTimeout(function(){
            $('#categoryInsertModal').modal('show')
        }, 200);
    },
    /*
     * 팝업 닫기
     */
    close:function() {
        $('#categoryInsertModal').modal('hide');

		setTimeout(function(){
			$('#categoryInsertModal').remove();
		},500);
    },
    HtmlTemplate : `
	<div id="categoryInsertModal" class="modal group_item_modal fade" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<p class="title">카테고리 추가</p>
				</div>
	
				<div class="modal-body">
					<div class="form_box">
						<div class="input_box">
							<label>카테고리 명</label>
							<div class="select_box dropdown">
                                <button type="button" class="label dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"></button>
                                <input type="hidden" id="categoryListCode"></input>
                                <ul class="select_option_list dropdown-menu" id="modal_categoryList"></ul>
                            </div>
						</div>
						<div class="input_box">
							<label>구분 명</label>
							<input id="modal_categoryName" type="text" id="" placeholder="구분 명" maxlength="35">
						</div>
						<div class="input_box">
							<label>정렬 순서</label>
							<input type="number" id="modal_orderNumber" placeholder="0" maxlength="35">
						</div>
						<div class="input_box">
							<label>파일 업로드</label>
                            <div class="file_box">
                                <input class="upload-name" placeholder="파일 업로드">
                                <label for="file" class="file_btn">업로드</label>
                                <input type="file"  id="file" accept=".png,.svg">
                                 <small class="file-guidelines" style="float: right;left: auto;color: rgb(57, 133, 234);margin: 5px 70px 0 0;">* 파일은 PNG 또는 SVG 형식, 해상도는 16x16 이하이어야 합니다.</small>
                            </div>
                        </div>
						<div class="textarea_box">
							<label>메모</label>
							<textarea id="modal_etc" placeholder="메모를 입력해주세요."></textarea>
						</div>
					</div>
				</div>

				<div class="modal-footer">
					<div class="btn_box">
						<button type="button" class="cancel_btn btnCancle">취소</button>
						<button type="button" class="registration_bth btnSave">등록</button>
					</div>
				</div>
			</div>
		</div>
		<script>
        fn_clickEvent();
        </script>
	</div>
    `
};
/****************************************************************************
 * 카테고리 옵션 조회
 ****************************************************************************/
function fn_modal_setCategoryType(id){
    let formData = new FormData();
    formData.append("menuClass", menuClass);

    $.ajax({
        url: encodeURI('/webcategory/selectCategoryList.do'),
        data: formData,
        dataType: "json",
        processData: false,
        contentType: false,
        type: 'POST',
        async: true,
        success: function(data){
            if('0'==data.msgCode){
                let listHTML = '';

                if(0<data.rows.length){
                    for(let i = 0; i < data.rows.length; i++){
                        let categoryCode     = data.rows[i].categoryCode;
                        let categoryName     = data.rows[i].categoryName;

                        listHTML += `<li class="option_list_item" id="${categoryCode}" onclick="fn_disableFile('${categoryName}',$(this))">${categoryName}</li>`;
                    }
                    document.getElementById(id).innerHTML = listHTML;
                    if(categoryId){
                        $("#"+id+" #"+categoryId).click();
                    }else{
                        document.getElementById(id).querySelector('li:first-child').click();
                    }
                }
            }
            else{
                modalEvent.danger("조회 오류", data.msgDesc);
            }
        },
        error : function(xhr, status, error) {
            modalEvent.danger("조회 오류", "조회 중 오류가 발생하였습니다. 잠시후 다시시도하십시오.");
        },
        beforeSend:function(){

        },
        complete:function(){

        }
    });
}
/****************************************************************************
 * 조직 옵션 조회
 ****************************************************************************/
function fn_disableFile(categoryName,target){
    if(categoryName==='고객구분'){
        $('#categoryInsertModal .upload-name').prop('disabled', false);
        $('#categoryInsertModal #file').prop('disabled', false);
        $('#categoryInsertModal .file_btn').css('background', '#3985EA');
        $('#categoryInsertModal .file-guidelines').css('display', 'block');
    }else{
        $('#categoryInsertModal .upload-name').prop('disabled', true);
        $('#categoryInsertModal #file').prop('disabled', true);
        $('#categoryInsertModal .file_btn').css('background', 'lightGrey');
        $('#categoryInsertModal .file-guidelines').css('display', 'none');
    }

    $('#categoryInsertModal #categoryListCode').val(target.attr("id"))
}