/****************************************************************************
 * 전후사진 등록
 ****************************************************************************/
function fn_insertWebPhoto(){
    if("Y"!=insertUseYn){
        modalEvent.warning("", "등록 권한이 없습니다.");
        return false;
    }

    let title          = $("#title").val();
    let content         = $("#content").val();
	let hashtag         = $("#hashtag").val();
	let categoryno = $("select[name=categorylist]").val();
	
    let beforeFile = $("#before_file")[0].files[0];
    let afterFile = $("#after_file")[0].files[0];

	if(true != fn_emptyCheck(categoryno)) {
        modalEvent.warning("등록", "카테고리를 입력하세요.");
        return;
    }
    if(true != fn_emptyCheck(title)) {
        modalEvent.warning("등록", "제목을 입력하세요.");
        return;
    }
    if(true != fn_emptyCheck(content)) {
        modalEvent.warning("등록", "내용을 입력하세요.");
        return;
    }
	if(true != fn_emptyCheck(hashtag)) {
        modalEvent.warning("등록", "해시태그를 입력하세요.");
        return;
    }
	
    if(true != fn_emptyCheck(beforeFile)) {
        modalEvent.warning("등록", "Before 사진을 첨부하세요.");
        return;
    }
    if(true != fn_emptyCheck(afterFile)) {
        modalEvent.warning("등록", "After 사진을 첨부하세요.");
        return;
    }

    modalEvent.info("등록", "전후사진(쁘띠) 정보를 등록하시겠습니까?", function(){
        let formData = new FormData();
        formData.append("menuClass", menuClass);
        formData.append("categoryno", categoryno);
        formData.append("title", title);
        formData.append("content", content);
        formData.append("hashtag", hashtag);
        formData.append("beforeFile", beforeFile);
        formData.append("afterFile", afterFile);

        $.ajax({
            url: encodeURI('/webphotopetit/insertWebPhotoPetit.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(){
                        fn_selectListWebPhotoPetitIntro();
                    });
                }
                else{
                    modalEvent.danger("등록 오류", data.msgDesc);
                }
            },
            error : function(xhr, status, error) {
                modalEvent.danger("등록 오류", "등록 중 오류가 발생하였습니다. 잠시후 다시시도하십시오.");
            },
            beforeSend:function(){

            },
            complete:function(){

            }
        });
    });
}

/****************************************************************************
 * html 에디터 이미지 업로드시
 ****************************************************************************/
function uploadSummernoteImageFileNoticeInsert(files, editor){
    Object.values(files).forEach(file => {
        let formData = new FormData();
        formData.append('menuClass', menuClass);
        formData.append('file', file);
        $.ajax({
            url: encodeURI('/webphotopetit/uploadFile.do'),
            data: formData,
            dataType: "json",
            processData: false,
            contentType: false,
            type: 'POST',
            async: true,
            success: function (data) {
                if ('0' == data.msgCode) {
                    $(editor).summernote('insertImage', data.rows.filePath, function ($image) {
                    });
                }
            },
            error: function (xhr, status, error) {
                modalEvent.danger('오류', '이미지 업로드 중 오류가 발생했습니다.');
            },
            beforeSend: function () {
                // 로딩열기
                $(".loading-image-layer").show();
            },
            complete: function () {
                // 로딩닫기
                $(".loading-image-layer").hide();
            }
        });
    })
}

/****************************************************************************
 * 배너 이미지 미리보기
 ****************************************************************************/
function fn_filePreview(){
   const file =  $("#file")[0].files[0];
   if(file){
       $('.img_box').html('');
       const reader = new FileReader();

       reader.onload = function (e) {
           // 이미지 요소를 생성하고 미리보기 추가
           const img = document.createElement('img');
           img.src = e.target.result;
           img.style.width = '600px'; // 원하는 크기로 조정
           img.style.height = '350px';
           $('.img_box').append(img);
       };

       // 파일을 읽기 시작
       reader.readAsDataURL(file);
   }
}
/****************************************************************************
 * 배너 이미지 삭제
 ****************************************************************************/
function fn_removePreview(){
    $("#file").val('');
    $('.img_box').html('');
}


/****************************************************************************
 * 배너 이미지 미리보기
 ****************************************************************************/
function fn_beforeFilePreview(){
   const file =  $("#before_file")[0].files[0];
   if(file){
       $('#before_img_box').html('');
       const reader = new FileReader();

       reader.onload = function (e) {
           // 이미지 요소를 생성하고 미리보기 추가
           const img = document.createElement('img');
           img.src = e.target.result;
           img.style.width = '600px'; // 원하는 크기로 조정
           img.style.height = '350px';
           $('#before_img_box').append(img);
       };

       // 파일을 읽기 시작
       reader.readAsDataURL(file);
   }
}
/****************************************************************************
 * 배너 이미지 삭제
 ****************************************************************************/
function fn_removeBeforePreview(){
    $("#before_file").val('');
    $('#before_img_box').html('');
}
/****************************************************************************
 * 배너 이미지 미리보기
 ****************************************************************************/
function fn_afterFilePreview(){
   const file =  $("#after_file")[0].files[0];
   if(file){
       $('#after_img_box').html('');
       const reader = new FileReader();

       reader.onload = function (e) {
           // 이미지 요소를 생성하고 미리보기 추가
           const img = document.createElement('img');
           img.src = e.target.result;
           img.style.width = '600px'; // 원하는 크기로 조정
           img.style.height = '350px';
           $('#after_img_box').append(img);
       };

       // 파일을 읽기 시작
       reader.readAsDataURL(file);
   }
}
/****************************************************************************
 * 배너 이미지 삭제
 ****************************************************************************/
function fn_removeAfterPreview(){
    $("#after_file").val('');
    $('#after_img_box').html('');
}

/****************************************************************************
 * 리스트 화면으로 이동.
 ****************************************************************************/
function fn_selectListWebPhotoPetitIntro(){
    if("Y"==selectUseYn){
        let pagingParam = "?menuClass="+menuClass;
        fn_leftFormAction("/webphotopetit/selectListWebPhotoPetitIntro.do"+pagingParam);
    }else{
        modalEvent.warning("", "조회 권한이 없습니다.");
        return false;
    }
}

/****************************************************************************
 * 페이지 init
 ****************************************************************************/
function fn_pageInit(){
    // 날짜 datepicker
    fn_searchDatePicker("#eventStartDate", "#eventEndDate");

    $('#summernote').summernote({
        height: 540,
        callbacks: {	//여기 부분이 이미지를 첨부하는 부분
            onImageUpload : function(files) {
                uploadSummernoteImageFileNoticeInsert(files, this);
            }
        },
    });
}

/****************************************************************************
 * 페이지 event
 ****************************************************************************/
function fn_pagePhoto(){
    // 검색 input
    $('.btnCancle').on("click", function(){
        fn_selectListWebPhotoPetitIntro();
    });

    $('.btnSave').on("click", function(){
        fn_insertWebPhoto();
    });
    $('#delete_btn').on("click", function(){
        fn_removePreview();
    });
    $('#file').on('change', function(e) {
        fn_filePreview();
    })
	$('#before_delete_btn').on("click", function(){
        fn_removeBeforePreview();
    });
    $('#before_file').on('change', function(e) {
        fn_beforeFilePreview();
    });
    $('#after_delete_btn').on("click", function(){
        fn_removeAfterPreview();
    });
    $('#after_file').on('change', function(e) {
        fn_afterFilePreview();
    });
}

/****************************************************************************
 * 시술 목록 팝업
 ****************************************************************************/
function listOpen(){
    let reqParam = {};
    photoSelectModal.popup(function (obj, reqParam) {
		const childDivCount = $("#photolist > div").length;
		if($("#" + obj.photoProcedureId).length > 0){
			modalEvent.warning("", "이미 시술정보가 있습니다.");
			return;
		}
		var htmlstring = `<div id="photo`+childDivCount+`">
						<input type="checkbox" id="`+obj.photoProcedureId+`" name="photo">
						<input type="hidden" name="photoprocedurelist" value="`+obj.photoProcedureId+`">
						<input type="hidden" name="photolist" value="`+obj.photoId+`">
						<label for="`+obj.photoProcedureId+`">`+obj.photoNm + `-` + obj.price.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") + `-` + obj.discountPrice.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",") +`</label>
					</div>`;
		$('#photolist').append(htmlstring);
    }, reqParam);
}
function fn_removeRow(){
	 $('input:checkbox[name="photo"]').each(function() {      		
		if(this.checked){//checked 처리된 항목의 값            
			$(this).parent().remove();    
		} 
	});
	
}


$(function(){
    // 페이지 init
    fn_pageInit();

    // 페이지 event
    fn_pagePhoto();
});