itn_admin/src/main/resources/static/cmn/js/agent/init.js

$(function () {

    $(".slider").each(function () {
        var $slider = $(this); // 현재 슬라이더 요소
        var $input = $slider.closest('.input-group').find('.sliderValue'); // 해당 슬라이더의 input 요소

        // 슬라이더 초기화
        $slider.slider({
            range: "max",
            min: 1,
            max: 1000000,
            value: 1,
            slide: function (event, ui) {
                $input.val(ui.value); // 슬라이더 이동 시 input 값 업데이트
            }
        });

        // 슬라이더의 초기 값을 input에 설정
        $input.val($slider.slider("value"));

        // input 변경 시 슬라이더 값 업데이트 (실시간)
        $input.on("input", function () {
            var value = $(this).val();
            // 숫자 범위 확인 후 슬라이더 값 업데이트
            if ($.isNumeric(value) && value >= 1 && value <= 1000000) {
                $slider.slider("value", value);
            }
        });
    });

    $("form").on("reset", function () {
        setTimeout(function () {
            $("#divTwoSms #sendCnt").val(1); // 건수 필드 값을 1로 설정
            $("#divTwoSms #slider").slider("value", 1); // 슬라이더 값도 1로 설정
        }, 0); // setTimeout 사용 이유: reset 이벤트 후에 값 설정
    });

    /*
    * 예시 버튼
    * */
    $(".examBtn").on("click", function () {

        var tagId = getParentsId($(this));
        var $recvPhone = $(tagId + ' .recvPhone');
        var $sendPhone = $(tagId + ' .sendPhone');
        var $msgType = $(tagId + ' .msgType');
        var $message = $(tagId + ' .message');
        var $subject = $(tagId + ' .subject');

        // 기본 전화번호 설정
        $recvPhone.val('01012345678');
        $sendPhone.val('01043219876');

        // 메시지 타입에 따른 메시지 설정
        var msgType = $msgType.val();
        var msg = generateMessage(msgType);

        // 내용
        $message.val(msg);
        updateByteCount($message);

        if (msgType === 'L'
            ||msgType === 'M'
            ||msgType === 'A'
            ||msgType === 'F'
        ) {
            $subject.val('ITN SUBJECT');
        }

    });
    
    function generateMessage(msgType) {
        var messages = {
            'S': 'ITN SMS test ',
            'L': 'ITN LMS test ',
            'M': 'ITN MMS message test ',
            'A': 'ITN ',
            'F': 'ITN '
        };
        // 타입이 위 값들고 같이 않으면 null 반환
        return (messages[msgType] || '') + getNowDate();
    }
    $('.msgType').on('change', function() {

        var msgType = $(this).val();
        var tagId = getParentsId($(this));
        if(msgType === 'L'
            ||msgType === 'M'
            ||msgType === 'A'
            ||msgType === 'F'
        ) {
            $(tagId+' .subject').closest('.form-group').show();
        }else{
            $(tagId+' .subject').closest('.form-group').hide();
        }

        var $message = $(tagId + ' .message');
        $message.val(generateMessage(msgType));

    });


    $('.toggle-info-btn').on('click', function() {
        var $card = $(this).closest('.card'); // 클릭한 버튼의 가장 가까운 부모 .card 요소 찾기
        var $hiddenInfo = $card.find('.hidden-info'); // 해당 카드 내에서 .hidden-info 요소 찾기

        $hiddenInfo.slideToggle(); // 애니메이션 효과를 추가하여 더 부드럽게 보이도록 함
        var icon = $(this).find('i');
        if ($hiddenInfo.is(':visible')) {
            icon.removeClass('fa-info-circle').addClass('fa-times-circle');
        } else {
            icon.removeClass('fa-times-circle').addClass('fa-info-circle');
        }
    });



    $('textarea').on('input', function() {
        updateByteCount(this);
    });

});

// function updateByteCount(textarea) {
//     console.log('textarea : ', textarea);
//     var text = $(textarea).val();
//     var byteLength = new TextEncoder().encode(text).length;
//     $(textarea).closest('.form-group').find('.byte-count').text(byteLength + ' bytes');
// }
function updateByteCount(textarea) {
    var text = $(textarea).val();
    var byteLength = calculateByteLength(text);
    $(textarea).closest('.form-group').find('.byte-count').text(byteLength + ' bytes');
}

function calculateByteLength(text) {
    var byteLength = 0;
    for (var i = 0; i < text.length; i++) {
        var charCode = text.charCodeAt(i);
        if (charCode <= 0x007F) {
            byteLength += 1; // 1 byte for ASCII characters
        } else if (charCode <= 0x07FF) {
            byteLength += 2; // 2 bytes for characters from U+0080 to U+07FF
        } else {
            byteLength += 2; // 2 bytes for characters from U+0800 and above (including Hangul)
        }
    }
    return byteLength;
}
function getParentsId($obj){

    var $col = $obj.closest('.col-md-6'); // 클릭한 버튼의 가장 가까운 부모 .card 요소 찾기
    // 해당 카드 내에서 .hidden-info 요소 찾기
    return '#' + $col.attr('id');
}

function getNowDate(){

    // 현재 날짜와 시간을 가져와서 포맷팅
    var now = new Date();
    var year = String(now.getFullYear()).substring(2); // 년도 마지막 두 자리
    var month = ('0' + (now.getMonth() + 1)).slice(-2); // 월 (0부터 시작하므로 +1 필요)
    var day = ('0' + now.getDate()).slice(-2); // 일
    var hours = ('0' + now.getHours()).slice(-2); // 시
    var minutes = ('0' + now.getMinutes()).slice(-2); // 분

    return year + month + day + '|' + hours + ':' + minutes;
}