sake/src/main/webapp/WEB-INF/views/itrnt/ntcn/mssage/ItrntMssageAditPopupC.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib prefix="ui" uri="http://www.winbit.kr/ctl/ui" %>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ page import="java.util.Date" %>
<%--
    Class Name : MssageAditPopupC.jsp
    Description : SMS 추가 팝업
    Modification Information

    수정일 수정자 수정내용
    ------- -------- ---------------------------
    2024.04.04 이운산 최초 생성
--%>
<script>
	$(document).ready(function() {
	    /**********************************
	     *  바이트 계산
	     **********************************/
		fn_count_byte("#addMsg", ".number", 2000);

	    /**********************************
	     *  나이스 셀렉트
	     **********************************/
		$("select").niceSelect();


	    /**************************************************************
	     *  자주쓰는 메시지 등록
	     ****************************************************************/
	    $("#insertBtn").on("click", function() {
			const ctgy = $("[name=category]").val();
			const newCtgy = $("#addCtgyNm").val();
			console.log(ctgy, newCtgy);
	    	if(ctgy == "" && newCtgy == "") {
	    		alert("카테고리가 선택되지 않았습니다.")
	    		return false;
	    	}

	    	if($("[name=msg]").val() == "") {
	    		alert("메세지가 작성되지 않았습니다.")
	    		return false;
	    	}

    		const dataStr = $("#mssageAditForm").serializeArray();

			//카테고리 추가입력 여부 확인
			const isAddInput = $("#addCtgy").css("display") !== 'none';

    		$.each(dataStr, function(index, item){
    			if(($("#addCtgyNm").val() != "" || $("#addCtgyNm").val() != null)
    					&& isAddInput && item.name == "category") {
					item.value = $("#addCtgyNm").val();
				}
    		})

			$.ajax({
				type: "post",
				url: "<c:url value="/mngr/ntcn/mssage/insertMssageAditRegist"/>",
				data: dataStr,
				success:function(data) {
					const str = JSON.parse(data.resBody.result);
	            	if(str.result == "success") {
	            		alert('<spring:message code="success.common.insert"/>');
	            		fn_close_modal("mssageAditPopup");
	            		if(!newCtgy == '') {
	            		    fn_select_album(newCtgy);
	            		} else {
	            		    fn_select_album(ctgy);
	            		}

	            	}
				}
			})

    	})


		 /**************************************************************
	     *  카테고리 추가
	     ****************************************************************/
		$("#addCtgyBtn").on("click", function(){
			if($("#addCtgy").css("display") == 'none') {
				$("#addCtgy").show();
			} else {
				$("#addCtgy").hide();
			}
		})

		 /**************************************************************
	     *  카테고리 삭제
	     ****************************************************************/
		$("#delCtgyBtn").on("click", function(){
			if($("[name=category]").val() != null) {
				const category = $("[name=category]").val();
				console.log(category)
				$.ajax({
					type: "post",
					url: "<c:url value="/mngr/ntcn/mssage/deleteMssageAditCtgy"/>",
					data: { category },
					success:function(data) {
						const str = JSON.parse(data.resBody.result);
		            	if(str.result == "success") {
		            		alert('<spring:message code="success.common.insert"/>');
		            		fn_close_modal("mssageAditPopup");
		            		fn_select_album();
		            	}
					}
				})

			}
		})

	 	/**************************************************************
	     *  초기화
	     ****************************************************************/
		$("#resetAddBtn").on("click", function(){
			$("[name=category]").val("");
			$("[name=category]").niceSelect("update");
			$("#addMsg").val("");
		})


	})


</script>
<div id="mssageAditPopup" class="modal" style="max-width: 380px;">
    <div class="modal-header">
        <h4>SMS 추가</h4>
    </div>
    <div class="modal-content">
            <div class="tab-box__content">
            <form id="mssageAditForm">
               <div class="">
                   <div class="template-message">
					<div class="template-message__header">
	                    <div class="select-box">
	                       <select class="short" title="카테고리" name="category">
	                       		<option value="">선택</option>
	                       		<c:forEach var="list" items="${resultMap.boAlbumMap.ctgyList}"  varStatus="status">
	                       			<option value="${list.category}"><c:out value="${list.category}"/></option>
	                       		</c:forEach>
	                       </select>
	                   </div>
	                   <div id="addCtgy" class="mb-10"  style="display:none">
	                   		<input class="input-text" type="text" title="해당 인풋에 대한 설명" placeholder="" id="addCtgyNm">
	                   </div>
	                   <div>
	                   		<button class="btn sm dark" id="addCtgyBtn" type="button">
	                            카테고리 추가
	                        </button>
	                        <button class="btn sm dark" id="delCtgyBtn" type="button">
	                            카테고리 삭제
	                        </button>
                        </div>
	                </div>
	                <div class="template-message__body">
	                    <div class="sms-manage">
	                        <textarea class="textarea" title="sms 입력" id="addMsg" name="msg"></textarea>
	                        <div class="sms-manage__byte">
	                            <span class="number">0</span>
	                            <span class="text">byte</span>
	                        </div>
	                    </div>
	                </div>
                   </div>
               </div>
               </form>
             </div>
	        <div class="table-wrapper">
	            <div class="form-control-container mt-10">
		            <div class="left"></div>
		            <div class="center">
		                <button class="btn outline" id="resetAddBtn" type="button">초기화</button>
		                <button class="btn primary" id="insertBtn" type="button">적용</button>
		            </div>
		            <div class="right"></div>
	        </div>
        </div>
    </div>
</div>