2023/12/15 문자온 선거문자 수정 1. 초기화버튼 추가 2.초기화 버튼 → 전체선택 3. 1명씩 선택 호버시 문구 변경

4. 발송완료 버튼 클릭 시 토스트박스 노출

src/main/webapp/publish/css/content.css

@@ -613,10 +613,12 @@ button.check_validity:hover  {border: 1px solid #a3a3a3;box-shadow: 0px 0px 5px
 .sub .election .receipt_number_table_wrap .receipt_number_table tbody tr td input{width:60px;}
 .sub .election .receipt_number_table_wrap .receipt_number_table tbody tr td label{display:inline-block;width:calc(100% - 64px);}
 .sub .election .receipt_number_table_wrap .put_right .receipt_info{width:calc(100% - 10px);height:calc(100% - 193px);background:#f2f2f2;margin:10px 0 0 10px;padding:10px;border-radius:5px;box-sizing:border-box;}
-.sub .election .receipt_number_table_wrap .put_right .receipt_info dt{font-size:15px;font-weight:500;margin:0 0 8px 0;}
+.sub .election .receipt_number_table_wrap .put_right .receipt_info dt{display:flex;font-size:15px;font-weight:500;margin:0 0 8px 0;justify-content:space-between;align-items:center;letter-spacing:-0.5px;}
 .sub .election .receipt_number_table_wrap .put_right .receipt_info dd{font-size:14px;text-align:right;background:#fff;margin:0 0 8px 0;padding:3px 6px;border-radius:5px;}
 .sub .election .receipt_number_table_wrap .put_right .receipt_info dd:last-child{margin:0 0 0 0;}
 .sub .election .receipt_number_table_wrap .put_right .receipt_info dd b{font-size:16px;font-weight:500;}
+.sub .election .receipt_number_table_wrap .put_right .receipt_info .btn_reset{font-size:14px;font-weight:400;color:#666;}
+.sub .election .receipt_number_table_wrap .put_right .receipt_info .btn_reset i{display:inline-block;width:13px;height:13px;margin:-1px 2px 0 0;background:url(/publish/images/icon_reset.png) no-repeat center center;}
 .sub .election .list_bottom{display:flex;width:100%;align-items:center;justify-content:space-between;padding:0 0 10px 0;}
 .sub .election .list_bottom .pagination{display:inline-flex;width:auto;margin:0;justify-content:flex-start;}
 .sub .election .list_bottom .pagination button{height:32px;}
@@ -644,6 +646,7 @@ button.check_validity:hover  {border: 1px solid #a3a3a3;box-shadow: 0px 0px 5px
 .sub .election .receipt_number_table_wrap .tbody_ul li .input_wrap{position:relative;width:60px;}
 .sub .election .receipt_number_table_wrap .tbody_ul li .input_wrap::after{position:absolute;content:"";width:1px;height:16px;background:#d4d4d4;right:0;top:50%;transform:translateY(-50%);}
 .sub .election .receipt_number_table_wrap .tbody_ul li label{width:calc(100% - 60px);}
+.sub .election .send_hover_cont p{line-height:1.5;}
 
 /* send_bottom */ 
 .send_bottom {position: relative;margin: 60px 0 0 0;}
@@ -2155,7 +2158,7 @@ button.check_validity:hover  {border: 1px solid #a3a3a3;box-shadow: 0px 0px 5px
 	.rev_admin_cont .select_btnWrap .btn_right .select_btn{width: 105px;}
 	
 	/* 선거문자 */
-	.sub .election .list_bottom{width:72.5%;}
+	.sub .election .list_bottom{width:100%;}
 	.sub .election .receipt_number_table_wrap+.list_bottom .list_bottom_right button{letter-spacing:-1.4px;}
 	.sub .election .list_bottom .pagination button{width:30px;height:30px;}
 }

src/main/webapp/publish/css/popupLayer.css

@@ -1123,6 +1123,16 @@
 .level_popup .layer_in .level_text td{font-size: 15px; font-weight: 300; text-align: center; height: 40px;}
 .level_popup .pagination{margin-top: 20px;}
 
+/* toast popup */
+.toast_popup{position:fixed;display:inline-flex;min-width:330px;height:50px;padding:10px 16px;border-radius:60px;background:#e5e5e5;justify-content:space-between;align-items:center;left:50%;bottom:-40px;transform:translateX(-50%);z-index:30;opacity:0;transition:all 0.3s;box-sizing:border-box;}
+.toast_popup.active{opacity:1;bottom:40px;transition:all 0.3s;}
+.toast_popup.success{background:#048848;}
+.toast_popup.error{background:#e11900;}
+.toast_popup i.icon.check{display:inline-block;width:28px;height:28px;margin:2px 4px 0 0;background:url(/publish/images/icon_toast_success.png) no-repeat center center;}
+.toast_popup .title{font-size:16px;font-weight:500;color:#fff;line-height:1.5;}
+.toast_popup .btn_close{display:inline-block;width:20px;height:20px;background:url(/publish/images/icon_toast_close.png) no-repeat center center;}
+
+
 /* ie */
 @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
      /* 특수문자 */

src/main/webapp/publish/js/content.js

@@ -53,7 +53,7 @@ $(document).ready(function () {
 	var jbTxt = $("#textarea").text();
 	$(".realtime").text(jbTxt);
 
-	$("#textarea").on("change keyup paste", function () {
+	$("#textarea, #smsTxtArea").on("change keyup paste", function () {
 		var crtTxt = $(this).val();
 		$(".realtime").text(crtTxt);
 		$(".none_txt").empty();

src/main/webapp/publish/js/publish.js

@@ -1,4 +1,3 @@
-
 // 마우스 길게 누르는 function
 var onlongclick = function ($target, time, callback) {
   $($target).on("mousedown", function () {
@@ -12,20 +11,19 @@ var onlongclick = function ($target, time, callback) {
 
 var publishCommon = {
   count: 0,
-  longMousePressCheck: function (checkTarget, checkTime , $target) {
+  longMousePressCheck: function (checkTarget, checkTime, $target) {
     // checkTarget → 체크박스([name='']) / checkTime → 몇초 간격으로 체크 될지
     var checkLength = checkTarget.length; // 체크박스 몇개인지
     var cnt = 0; // 몇개 체크됐는지
     var checkEvent = setInterval(function () {
-      if (this.count == 0) {} 
+      if (this.count == 0) {} else if (cnt >= checkLength) {
-      else if (cnt >= checkLength) {
         clearInterval(checkEvent); // 자동체크 끝.
       }
       //$(checkTarget[cnt]).prop('checked', true); // 체크박스 체크.
       $(checkTarget[cnt]).attr("checked", "checked"); // 체크박스 체크.
-      $($target).on("mouseup",function(){
+      $($target).on("mouseup", function () {
-    	  //마우스떼면 멈춤
+        //마우스떼면 멈춤
-    	  clearInterval(checkEvent);
+        clearInterval(checkEvent);
       });
       cnt++;
       fnChkCallToChange();
@@ -33,51 +31,65 @@ var publishCommon = {
   },
   clickCheck: function (checkTarget) {
     // 한번 클릭 했을 때 체크, checkTarget → 체크박스([name=''])
-	  
+
-	$("input:checkbox[name='chkCallTo']").each(function(){
+    $("input:checkbox[name='chkCallTo']").each(function () {
-			
+
-		var chkSts = $(this).is(":checked");
+      var chkSts = $(this).is(":checked");
-		
+
-		if(!chkSts){
+      if (!chkSts) {
-			$(this).attr("checked", "checked");
+        $(this).attr("checked", "checked");
-			//$(this).prop("checked","true");
+        //$(this).prop("checked","true");
-			return false;				
+        return false;
-		}
+      }
-	
+
-	});
+    });
-    
+
   },
-  clickCheckAll : function(){
+  clickCheckAll: function () {
-	  
+
-	var chkCnt = $("input:checkbox[name='chkCallTo']").length;
+    var chkCnt = $("input:checkbox[name='chkCallTo']").length;
-	var chkAllSts = $('input:checkbox[name="receipt_number_check"]').is(':checked');
+    var chkAllSts = $('input:checkbox[name="receipt_number_check"]').is(':checked');
-	//var chkAllSts = $('input:checkbox[name="receipt_number_check"]').attr("checked");
+    //var chkAllSts = $('input:checkbox[name="receipt_number_check"]').attr("checked");
-	
+
-	if(chkCnt == 0){
+    if (chkCnt == 0) {
-		
+
-		alert("받는사람을 추가해 주세요.");
+      alert("받는사람을 추가해 주세요.");
-		return false;
+      return false;
-		
+
-	}
+    }
-	
+
-	$("input:checkbox[name='chkCallTo']").each(function(){
+    $("input:checkbox[name='chkCallTo']").each(function () {
-		
+
-		if(chkAllSts){
+      if (chkAllSts) {
-			$(this).attr("checked", "checked");
+        $(this).attr("checked", "checked");
-			//$(this).prop("checked",true);
+        //$(this).prop("checked",true);
-		}else{
+      } else {
-			$(this).removeAttr("checked");
+        $(this).removeAttr("checked");
-			//$(this).prop("checked",false);
+        //$(this).prop("checked",false);
-		}
+      }
-		
+
-	});
+    });
-	  
+
-	  
+
   },
-  clickCheckPrice : function(){
+  clickCheckPrice: function () {
-	  
+
-	  fnChkCallToChange();
+    fnChkCallToChange();
-	  
+
+  },
+  toastsUtil: function (txt, cls, status) {
+    // txt - 문구 / cls - 활성화 clss / status - 초록색인지 빨간색인지
+    var toastText = txt;
+    $(".toast_popup").find(".title").text(toastText);
+    if ($(".toast_popup").hasClass("active") == true) {
+      $(".toast_popup").removeClass(cls).removeClass(status);
+    } else {
+      $(".toast_popup").fadeIn(400);
+      $(".toast_popup").addClass(cls).addClass(status);
+      setTimeout(function () {
+        $(".toast_popup").removeClass(cls).removeClass(status);
+      }, 2000)
+    }
   }
-  
+
-}
+}

src/main/webapp/publish/sub_election_2023.html

@@ -82,6 +82,14 @@
 <body>
 
 	<div class="mask"></div>
+	
+	<!-- toast(시작) -->
+	<div class="toast_popup success">
+		<i class="icon check"></i>
+		<p class="title">처리가 완료되었습니다.</p>
+		<button type="button" class="btn_close" onclick="publishCommon.toastsUtil('','active','success')"><i></i></button>
+	</div>
+	<!-- toast(끝) -->
 
 	<!--  전송내역 팝업 -->
 	<div class="tooltip-wrap">
@@ -1349,7 +1357,7 @@
 													<div class="put_left">
 													<div class="listType list">
 														<ul class="thead_ul table_ul">
-															<li><div class="input_wrap"><input type="checkbox" id="checkAll" name="receipt_number_check"></div></li>
+															<li><!-- <div class="input_wrap"><input type="checkbox" id="checkAll" name="receipt_number_check"></div> --></li>
 															<li>
 																번호
 																<button type="button" class="btn_sort_up"><img src="/publish/images/sortUp.png"></button>
@@ -1445,23 +1453,22 @@
 													</div>
 													<div class="list_bottom">
 													<ul class="pagination">
-														<li class="page_first"><a href="#" title="첫페이지" onclick="customSampleListAjax(1);return false;"><button type="button"><img src="/publish/images/content/page_first.png" alt="첫페이지"></button></a></li>
+														<!-- <li class="page_first"><a href="#" title="첫페이지" onclick="customSampleListAjax(1);return false;"><button type="button"><img src="/publish/images/content/page_first.png" alt="첫페이지"></button></a></li>
-														<li class="page_prev"><a href="#" title="이전10페이지" onclick="customSampleListAjax(1);return false;"><button type="button"><img src="/publish/images/content/page_prev.png" alt="이전10페이지"></button></a></li>
+														<li class="page_prev"><a href="#" title="이전10페이지" onclick="customSampleListAjax(1);return false;"><button type="button"><img src="/publish/images/content/page_prev.png" alt="이전10페이지"></button></a></li> -->
 														<li class="on"><button type="button"><a href="#" title="현재페이지">1</a></button></li>
-														<li><button type="button" onclick="customSampleListAjax(2);return false;"><a href="#" title="2페이지">2</a></button></li>
+														<!-- <li><button type="button" onclick="customSampleListAjax(2);return false;"><a href="#" title="2페이지">2</a></button></li>
 														<li><button type="button" onclick="customSampleListAjax(3);return false;"><a href="#" title="3페이지">3</a></button></li>
 														<li><button type="button" onclick="customSampleListAjax(4);return false;"><a href="#" title="4페이지">4</a></button></li>
 														<li><button type="button" onclick="customSampleListAjax(5);return false;"><a href="#" title="5페이지">5</a></button></li>
 														<li class="page_next"><a href="#" title="다음10페이지" onclick="customSampleListAjax(11);return false;"><button type="button"><img src="/publish/images/content/page_next.png" alt="다음10페이지"></button></a></li>
-														<li class="page_last"><a href="#" title="마지막페이지" onclick="customSampleListAjax(52);return false;"><button type="button"><img src="/publish/images/content/page_last.png" alt="마지막페이지"></button></a></li>
+														<li class="page_last"><a href="#" title="마지막페이지" onclick="customSampleListAjax(52);return false;"><button type="button"><img src="/publish/images/content/page_last.png" alt="마지막페이지"></button></a></li> -->
 													</ul>
 													<div class="list_bottom_right">
-														<button type="button" class="btnType btn_gray fill">초기화</button>
+														<button type="button" class="btnType btn_gray fill">전체선택</button>
 														<div class="btn_popup_wrap">
 															<button type="button" class="btnType btn_yellow fill btn_check_one">1명씩 선택<i class="qmMark"></i></button>
 															<div class="error_hover_cont send_hover_cont">
-																<p>휴대폰 번호 입력 시 해당 휴대폰 번호에 대한 형식이 어긋나거나 휴대폰 번호에 오류가 있는지 등을 검사하는 기능</p>
+																<p>마우스를 누르고 있으면 받는사람을 연속적으로 20명까지 선택할 수 있습니다.</p>
-																<span>(예시) 010-1234-0001(O) / 010-123-0001(X)</span>
 															</div>
 														</div>
 													</div>
@@ -1473,12 +1480,12 @@
 														<div class="btn_popup_wrap">
 															<button type="button" class="btnType btnType3">오류 검사 <i class="qmMark"></i></button>
 															<div class="error_hover_cont send_hover_cont">
-																<p>휴대폰 번호 입력 시 해당 휴대폰 번호에 대한 형식이 어긋나거나 휴대폰 번호에 오류가 있는지 등을 검사하는 기능</p>
+																<p>마우스를 계속 누르고 있으면 받는 사람이 연속으로 선택됩니다.</p>
 																<span>(예시) 010-1234-0001(O) / 010-123-0001(X)</span>
 															</div>
 														</div>
 														<dl class="receipt_info">
-															<dt>전체 받는사람</dt>
+															<dt>전체 받는사람 <button type="button" class="btn_reset"><i></i>초기화</button></dt>
 															<dd>
 																<p><b>10,000,000</b>명</p>
 															</dd>
@@ -1629,7 +1636,7 @@
 											</ul>
 										</div>
 										<div class="send_btn">
-											<button type="button" class="btnType btnType11" onclick="javascript:fn_sendMsgData(); return false;">발송하기</button>
+											<button type="button" class="btnType btnType11" onclick="publishCommon.toastsUtil('처리가 완료되었습니다.','active', 'success')">발송하기</button>
 											<button type="button" class="btnType btnType10" onclick="javascript:fnTestSend(); return false;">테스트발송</button>
 										</div>
 									</div>