blog/public/js/admin.js

$(function ()
{
    /*$('.datepicker').datetimepicker({
        dayViewHeaderFormat: 'YYYY MMMM',
        format: 'YYYY-MM-DD',
        useCurrent: false,
        ignoreReadonly: true,
        // defaultDate: new Date(),
        allowInputToggle: true
    });*/

    $(".date-picker").datepicker({
        dayViewHeaderFormat: 'YYYY MMMM',
        format: 'YYYY-MM-DD',
        useCurrent: false,
        dateFormat: 'yy-mm-dd',	// 날짜 포맷이다. 보통 yy-mm-dd 를 많이 사용하는것 같다.
        prevText: '이전 달',	// 마우스 오버시 이전달 텍스트
        nextText: '다음 달',	// 마우스 오버시 다음달 텍스트
        closeText: '닫기', // 닫기 버튼 텍스트 변경
        currentText: '오늘', // 오늘 텍스트 변경
        monthNames: ['1월', '2월', '3월', '4월', '5월', '6월', '7월', '8월', '9월', '10월', '11월', '12월'],	//한글 캘린더중 월 표시를 위한 부분
        monthNamesShort: ['1월', '2월', '3월', '4월', '5월', '6월', '7월', '8월', '9월', '10월', '11월', '12월'],	//한글 캘린더 중 월 표시를 위한 부분
        dayNames: ['일', '월', '화', '수', '목', '금', '토'],	//한글 캘린더 요일 표시 부분
        dayNamesShort: ['일', '월', '화', '수', '목', '금', '토'],	//한글 요일 표시 부분
        dayNamesMin: ['일', '월', '화', '수', '목', '금', '토'],	// 한글 요일 표시 부분
        showMonthAfterYear: true,	// true : 년 월  false : 월 년 순으로 보여줌
        yearSuffix: '년',	//
        showButtonPanel: true,	// 오늘로 가는 버튼과 달력 닫기 버튼 보기 옵션
        // showOn: "button", // 이미지로 사용 , both : 엘리먼트와 이미지 동시사용
        // buttonImage: "/admin/common/images/btn_cal.gif", // 이미지 주소
        // buttonImageOnly: true // 이미지만 보이기
        onClose: function(value) {
			let date = getOnlyDigit(value);
            if(date) {
                this.value = moment(date, "YYYY-MM-DD").format("YYYY-MM-DD");
            }else{
                this.value = "";
            }
        }
    });

    // 이미지 없으면 기본값으로
    function imgError() {
        event.srcElement.src = BASE_URL + "/images/default/no_image.png";
        event.srcElement.style.width = "60";
        event.srcElement.style.height = "60";
    }

    let allImage = document.getElementsByTagName("img");
    if (allImage.length > 0) {
        for (let i = 0; i < allImage.length; i++) {
            allImage[i].onerror = imgError;
        }
    }

    if(typeof select2 != "undefined" && document.querySelectorAll(".select2").length > 0) {
        $('.select2').select2();
    }
});

window.addEventListener("load", function() {
    let tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
    let tooltipList = tooltipTriggerList.map(function (e) {
        return new bootstrap.Tooltip(e)
    });

    let popoverTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="popover"]'));
    let popoverList = popoverTriggerList.map(function (e) {
        return new bootstrap.Popover(e)
    });
});

$.validator.setDefaults({ // Bootstrap Required.
    ignore: [], // hidden
    debug: false,
    onfocusout: function () {
        for (let e of this.elements()) {
            $(e).valid();
        }
    },
    invalidHandler: function (event, validator) {
        return onlyInputUnComma(event.currentTarget);
    },
    submitHandler: function (form) {
        return onlyInputUnComma(form);
    },
    showErrors: function (errorMap, errorList) {
        for (let e of this.elements()) {
            if (e.ariaInvalid === "false") {
                $(e).tooltip('dispose');
            }
        }

        this.successList.forEach(function (e) {
            let field = $(e);
            if (typeof field.tooltip !== "undefined") { // 3.3.7은 destroy 4.0 이후 dispose
                field.tooltip('dispose');
            }
        });

        errorList.forEach(function (field) {
            $(field.element).tooltip('dispose').tooltip({
                placement: "bottom",
                trigger: "manual",
                title: field.message
            }).tooltip('show');
        });
    }
});

// 목록 버튼상자
function formSubmit(f, actType, actPage, actDesc)
{
    if ($("input:checkbox.list-check-box:checked", f).length < 1) {
        alert('자료를 하나 이상 선택하세요.');
        return false;
    }

    let msg;
    let input = document.createElement('input');
    input.setAttribute('type', 'hidden');
    input.setAttribute('name', '_method');

    switch(actType) {
        case 'update' :
            msg = '선택한 자료를 정말 수정 하시겠습니까?';
            input.setAttribute('value', 'PUT');
            break;
        case 'save' :
            msg = '선택한 자료를 정말 저장 하시겠습니까?';
            break;
        case 'delete' :
            msg = '선택한 자료를 정말 삭제 하시겠습니까?';
            input.setAttribute('value', 'DELETE');
            break;
        case 'recover' :
            msg = '선택한 자료를 정말 복원 하시겠습니까?';
            break;
        case 'trash' :
            msg = '선택한 자료를 정말 휴지통으로 이동하시겠습니까?';
            break;
        case 'action' :
            msg = '선택한 자료를 정말 ' + actDesc + ' 처리 하시겠습니까?';
            break;
    }

    if(!confirm(msg)) {
        return false;
    }

    f.appendChild(input);
    f.action = actPage;
    f.submit();
}

// 선택삭제
function deleteCheck()
{
    if (confirm('정말 삭제하시겠습니까? 삭제하신 후에는 복구가 불가능합니다.')) {
        return true;
    } else {
        return false;
    }
}

// 모든 라디오, 체크박스 선택/해제
function allCheckThis(obj) {
    let that = (obj || null);
    if (that) {
        if (that.name) {
            let checkBoxs = document.getElementsByName(that.name + '[]');
            checkBoxs.forEach(function (item, index) {
                if (item.checked) {
                    item.checked = false;
                } else {
                    item.checked = true;
                }
            });
        } else { // name이 설정되지 않으면 근처 input 검색하여 처리
            let checkBoxs = $(that).parent().parent().find('input');
            checkBoxs.each(function () {
                if (this.value !== '') {
                    if (this.checked) {
                        this.checked = false;
                    } else {
                        this.checked = true;
                    }
                }
            });
        }
    }
}

// 팝업창 생성
// http://naiyumie.tistory.com/entry/windowopen-windowshowModalDialog-%EC%98%B5%EC%85%98-%EC%9C%88%EB%8F%84%EC%9A%B0-%EC%98%A4%ED%94%88 사용법 참조
function ShowModalWindow(url, winName, width, height, reload) {
    var reload = (reload || true);

    /*
    var ua = window.navigator.userAgent;
    if(ua.indexOf('MSIE') > 0 || ua.indexOf('Trident') > 0){
        aWindow = window.showModalDialog(url, self, 'dialogWidth='+width+'px;dialogHeight='+height+'px;scroll:yes;');
        if(!reload){
            if(typeof aWindow != "undefined" && aWindow) {
                document.location.reload();
            }
        }
    }else{
        aWindow = window.open(url, winName, 'menubar=no,status=no,toolbar=no,resizable=no,width='+width+',height='+height+',titlebar=no,scrollbars=no,alwaysRaised=yes,directories=no');
    }
    */

    var aWindow = window.open(url, winName, 'menubar=no,status=no,toolbar=no,resizable=no,width=' + width + ',height=' + height + ',titlebar=no,scrollbars=no,alwaysRaised=yes,directories=no');

    function bodyLoaded() {
        if ((aWindow && aWindow.document && aWindow.document.body)) { // Loaded
            aWindow.focus();
        } else if (aWindow && !aWindow.closed) { // looks like we have a pop up blocker
            aWindow.location.reload(true);
            aWindow.focus();
        } else {
            window.setTimeout(function () {
                bodyLoaded();
            }, 100);
        }
    }

    bodyLoaded();

    return aWindow;
}

// 팝업 크기 자동조절
function popupAutoResize() {
    let strWidth;
    let strHeight;

    // innerWidth / innerHeight / outerWidth / outerHeight 지원 브라우저
    if (window.innerWidth && window.innerHeight && window.outerWidth && window.outerHeight) {
        strWidth = parseInt(document.body.children[1].scrollWidth) + (window.outerWidth - window.innerWidth);
        strHeight = parseInt(document.body.children[1].scrollHeight) + (window.outerHeight - window.innerHeight);

    } else {
        let strDocumentWidth = $(document).outerWidth();
        let strDocumentHeight = $(document).outerHeight();

        window.resizeTo(strDocumentWidth, strDocumentHeight);

        let strMenuWidth = strDocumentWidth - $(window).width();
        let strMenuHeight = strDocumentHeight - $(window).height();

        strWidth = parseInt(document.body.children[1].scrollWidth) + strMenuWidth;
        strHeight = parseInt(document.body.children[1].scrollHeight) + strMenuHeight;

    }
    window.resizeTo(strWidth, strHeight);
}

/*
// jquery UI 모달에 페이지 호출
function initializeDialog(url)
{
    var div = document.createElement("div");
    var dialog = $(div).load(url).dialog({
        autoOpen: false,
        autoResize: true,
        width: "90%",
        height: "inherit",
        position: { my: "center", at: "center", of: window },
        resizable: false,
        overlay: "background-color: #000;opcacity: 0.8;",
        draggable: false,
        title: "",
        hide: { effect: "none", duration: 150 },
        show: { effect: "none", duration: 150 },
        model: true,
        show: "show",
        hide: "hide",
        closeOnEscape: true,
        buttons: {
            '닫기': function(){
                dialog.dialog("close");
            }
        },
        close: function(){
            form[0].reset();
            allFields.removeClass("ui-state-error");
        }
    });
    return dialog.dialog("open");
}
*/

// 모달 열기
function initializeModal(element, url) {
    if (typeof element == "undefined" || typeof url == "undefined") {
        return false;
    }

    let modalPopup = $(element);
    modalPopup.load(url, function (response, status, xhr) {
        let msg = null;
        switch (status) {
            case 'error' :
                msg = '페이지를 호출 할 수 없습니다.';
                break;
            case 'timeout' :
                msg = '호출 시간이 초과 되었습니다.';
                break;
            case 'notmodified' :
                msg = 'NOT MODIFIED';
                break;
            case 'parsererror' :
                msg = 'PARSE ERROR';
                break;
            case 'success' :
                modalPopup.modal('show');
                break;
        }
        if (msg) {
            alert(msg);
            return false;
        }
    });
}

// 검색기간 지정
function setDateRange(type, so, eo)
{
    let w = '';
    let m = '';
    let y = '';
    let d = new Date();
    let c = new Date(new Date(new Date().toLocaleDateString()).getTime()+24*60*60*1000-1);
    let endDate = $.datepicker.formatDate('yy-mm-dd', d);
    $((typeof eo !== "undefined" ? eo : '.s-end-date')).val(endDate);

    switch(type) {
        case '1d' :
            d.setDate(d.getDate() - 1);
            break;
        case '7d' :
            w = d.getDate();
            d.setDate(w - 7);
            break;
        case '15d' :
            w = d.getDate();
            d.setDate(w - 15);
            break;
        case '1m' :
            m = d.getMonth();
            d.setMonth(m - 1);
            break;
        case '2m' :
            m = d.getMonth();
            d.setMonth(m - 2);
            break;
        case '3m' :
            m = d.getMonth();
            d.setMonth(m - 3);
            break;
        case '6m' :
            m = d.getMonth();
            d.setMonth(m - 6);
            break;
        default :
            // y = d.getFullYear();
            // d.setFullYear(y - 1);
            break;
    }
    let startDate = d.toISOString().split('T')[0];
    $((typeof so !== "undefined" ? so : '.s-start-date')).val(startDate);
}

function byteCheck(txt, byte) {
    txt = document.getElementById(txt);
    byte = document.getElementById(byte);
    let i = 0;
    let cnt = 0;
    let exceed = 0;
    let ch = '';
    let maxByte = 2000;

    for (i = 0; i < txt.value.length; i++) {
        ch = txt.value.charAt(i);
        if (escape(ch).length > 4) {
            cnt += 2;
        } else {
            cnt += 1;
        }
    }

    byte.innerHTML = cnt;
    if (cnt > maxByte) {
        exceed = cnt - maxByte;
        alert('메시지 내용은 80바이트를 넘을수 없습니다.\n\n작성하신 메세지 내용은 ' + exceed + 'byte 가 초과되었습니다.\n\n초과된 부분은 자동으로 삭제됩니다.');
        let tcnt = 0;
        let xcnt = 0;
        let tmp = txt.value;
        for (i = 0; i < tmp.length; i++) {
            ch = tmp.charAt(i);
            if (escape(ch).length > 4) {
                tcnt += 2;
            } else {
                tcnt += 1;
            }

            if (tcnt > 80) {
                tmp = tmp.substring(0, i);
                break;
            } else {
                xcnt = tcnt;
            }
        }
        txt.value = tmp;
        byte.innerHTML = xcnt;
        return true;
    }
}

$(document).on('click', '.btn-list-update', function () { // 선택수정
    formSubmit(document.f_admin_list, 'update', this.dataset.listUpdateUrl);
});
$(document).on('click', '.btn-list-save', function () { // 선택저장
    formSubmit(document.f_admin_list, 'save', this.dataset.listSaveUrl);
});
$(document).on('click', '.btn-list-delete', function () { // 선택삭제
    formSubmit(document.f_admin_list, 'delete', this.dataset.listDeleteUrl);
});
$(document).on('click', '.btn-list-trash', function () { // 전체삭제
    formSubmit(document.f_admin_list, 'trash', this.dataset.listTrashUrl);
});
$(document).on('click', '.btn-list-recover', function () { // 전체복구
    formSubmit(document.f_admin_list, 'recover', this.dataset.listRecoverUrl);
});
$(document).on('click', '.btn-list-action', function () { // 전체복구
    formSubmit(document.f_admin_list, 'action', this.dataset.listActionUrl, this.dataset.desc);
});
$(document).on('click', '.btn-write-cancel', function () { // 취소하기
    location.href = this.value;
});
$(document).on('click', '.btn-popup-cancel', function () { // 팝업 닫기
    window.close();
});

$(document).on('click', '.btn-one-delete', function () {
    if (confirm("한번 삭제한 자료는 복구할 방법이 없습니다.\n\n정말 삭제하시겠습니까?")) {
        document.location.href = $(this).attr('data-one-delete-url');
        return true;
    } else {
        return false;
    }
});

$(document).on('click', '.btn-list-truncate', function () {
    if (confirm("휴지통 전체를 비웁니다.\n\n비운 자료는 절대 복구가 불가능합니다. \n\n그래도 진행하시겠습니까?")) {
        document.location.href = $(this).attr('data-list-truncate-url');
        return true;
    } else {
        return false;
    }
});

$(document).on('click', '.btn-one-recover', function () {
    if (confirm('선택한 자료를 정말 복원하시겠습니까?')) {
        document.location.href = $(this).attr('data-one-recover-url');
        return true;
    } else {
        return false;
    }
});

$(document).on('click', '.btn-one-trash', function () {
    if (confirm('선택한 자료를 정말 휴지통으로 이동하시겠습니까?')) {
        document.location.href = $(this).attr('data-one-trash-url');
        return true;
    } else {
        return false;
    }
});

// 목록에 행 선택시 선택관련 버튼 활성화
$(document).on('click', '.list-check-box, #chkAll', function (e) {
    setTimeout(function () {
        let $checkedCheckboxes = $('.list-check-box:checked');
        let $btnListUpdate = $('.btn-list-update');
        let $btnListSelected = $('.btn-list-selected');
        if ($checkedCheckboxes.length > 0) {
            $btnListUpdate.removeClass('disabled');
            $btnListSelected.removeClass('disabled');
        } else {
            $btnListUpdate.addClass('disabled');
            $btnListSelected.addClass('disabled');
        }
    }, 300);
});

// 목록 전체선택
$(document).on('click', '#chkAll', function (e) {
    let chk = document.getElementsByClassName('list-check-box');
    for (let i = 0; i < chk.length; i++) {
        if (e.target.getAttribute('form') == chk[i].getAttribute('form')) {
            chk[i].checked = this.checked;
        }
    }
    if (this.checked) {
        $('[data-action]').prop('disabled', false);
    } else {
        $('[data-action]').prop('disabled', true);
    }
});

// 부트스트랩 모달 열기
$(document).on("change click", ".modal-popup", function (e) {
    if (typeof (this.dataset.href) != undefined && this.dataset.href != '') {
        let index = $('.modal-popup').index(this);
        let href = this.dataset.href;

        if (params('index', href) != 1) {
            if (href.indexOf('?') != -1) {
                // this.dataset.href = href + '&index=' + index;
            } else {
                this.dataset.href = href + '/?index=' + index;
            }
        }
        initializeModal('#modal-popup', this.dataset.href);
    }
});

// 체크박스 하나만 선택하기
$(document).on('change', '.only-one-checked', function (e) {
    if (this.checked) {
        let obj = document.getElementsByName(e.target.name);
        for (let i = 0; i < obj.length; i++) {
            if (obj[i].value !== e.target.value) {
                obj[i].checked = false;
            }
        }
    }
});

// 데이터 테이블
if ($.isFunction($.fn.dataTable)) {
    $.extend(true, $.fn.dataTable.defaults, {
        columnDefs: [{
            targets: 'actions',
            className: 'actions',
            searchable: false,
            sortable: false
        }],
        lengthMenu: [5, 10, 25, 50, 100, 250, 500],
        pageLength: 25,
        language: {
            search: '',
            searchPlaceholder: 'Search'
        },
        processing: true,
        stateSave: true,
        stateDuration: 0,
        responsive: true,
        stateSaveParams: function (settings, data) {
            data.search.search = "";
            data.start = 0;
        },
        stateSaveCallback: function (settings, data) {
            localStorage.setItem($(this).attr('id'), JSON.stringify(data));
        },
        stateLoadCallback: function () {
            return JSON.parse(localStorage.getItem($(this).attr('id')));
        },
        initComplete: function (settings, json) {
            let self = this.api();
            let filter_input = $('#' + settings.nTable.id + '_filter input').unbind();
            let search_button = $('<button type="button" class="btn btn-link btn-sm btn-icon ms-2 mb-1" data-bs-toggle="tooltip" title="Search"><i class="fa fa-fw fa-search"></i></button>').click(function () {
                self.search(filter_input.val()).draw();
            });
            let reset_button = $('<button type="button" class="btn btn-link btn-sm btn-icon mb-1" data-bs-toggle="tooltip" title="Reset"><i class="fa fa-fw fa-undo"></i></button>').click(function () {
                filter_input.val('');
                search_button.click();
            });

            $(document).keypress(function (event) {
                if (event.which === 13) {
                    search_button.click();
                }
            });

            $('#' + settings.nTable.id + '_filter').append(search_button, reset_button);
        }
    });
}

// 체크박스 클릭 시 해당 컨텐츠 내용을 숨김/표시 처리
$(document).on("change", ".content-collapse", function (e) {
    let target = e.target.dataset.target;
    let content = $("#" + target);
    if (this.checked) {
        content.show();
    } else {
        content.hide();
    }
});

// 맨 위로
$(document).on("click", "#btnScrollTop", function() {
    $("#main").scrollTop(0);
});