2023/12/15 문자온 선거문자 수정 1. 초기화버튼 추가 2.초기화 버튼 → 전체선택 3. 1명씩 선택 호버시 문구 변경 4. 발송완료 버튼 클릭 시 토스트박스 노출
4. 발송완료 버튼 클릭 시 토스트박스 노출
@262f03a4d6a223b7861e61b9811ebf38d8a5025d
--- src/main/webapp/publish/css/content.css
+++ src/main/webapp/publish/css/content.css
... | ... | @@ -613,10 +613,12 @@ |
| 613 | 613 |
.sub .election .receipt_number_table_wrap .receipt_number_table tbody tr td input{width:60px;}
|
| 614 | 614 |
.sub .election .receipt_number_table_wrap .receipt_number_table tbody tr td label{display:inline-block;width:calc(100% - 64px);}
|
| 615 | 615 |
.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;}
|
| 616 |
-.sub .election .receipt_number_table_wrap .put_right .receipt_info dt{font-size:15px;font-weight:500;margin:0 0 8px 0;}
|
|
| 616 |
+.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;}
|
|
| 617 | 617 |
.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;}
|
| 618 | 618 |
.sub .election .receipt_number_table_wrap .put_right .receipt_info dd:last-child{margin:0 0 0 0;}
|
| 619 | 619 |
.sub .election .receipt_number_table_wrap .put_right .receipt_info dd b{font-size:16px;font-weight:500;}
|
| 620 |
+.sub .election .receipt_number_table_wrap .put_right .receipt_info .btn_reset{font-size:14px;font-weight:400;color:#666;}
|
|
| 621 |
+.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;}
|
|
| 620 | 622 |
.sub .election .list_bottom{display:flex;width:100%;align-items:center;justify-content:space-between;padding:0 0 10px 0;}
|
| 621 | 623 |
.sub .election .list_bottom .pagination{display:inline-flex;width:auto;margin:0;justify-content:flex-start;}
|
| 622 | 624 |
.sub .election .list_bottom .pagination button{height:32px;}
|
... | ... | @@ -644,6 +646,7 @@ |
| 644 | 646 |
.sub .election .receipt_number_table_wrap .tbody_ul li .input_wrap{position:relative;width:60px;}
|
| 645 | 647 |
.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%);}
|
| 646 | 648 |
.sub .election .receipt_number_table_wrap .tbody_ul li label{width:calc(100% - 60px);}
|
| 649 |
+.sub .election .send_hover_cont p{line-height:1.5;}
|
|
| 647 | 650 |
|
| 648 | 651 |
/* send_bottom */ |
| 649 | 652 |
.send_bottom {position: relative;margin: 60px 0 0 0;}
|
... | ... | @@ -2155,7 +2158,7 @@ |
| 2155 | 2158 |
.rev_admin_cont .select_btnWrap .btn_right .select_btn{width: 105px;}
|
| 2156 | 2159 |
|
| 2157 | 2160 |
/* 선거문자 */ |
| 2158 |
- .sub .election .list_bottom{width:72.5%;}
|
|
| 2161 |
+ .sub .election .list_bottom{width:100%;}
|
|
| 2159 | 2162 |
.sub .election .receipt_number_table_wrap+.list_bottom .list_bottom_right button{letter-spacing:-1.4px;}
|
| 2160 | 2163 |
.sub .election .list_bottom .pagination button{width:30px;height:30px;}
|
| 2161 | 2164 |
} |
--- src/main/webapp/publish/css/popupLayer.css
+++ src/main/webapp/publish/css/popupLayer.css
... | ... | @@ -1123,6 +1123,16 @@ |
| 1123 | 1123 |
.level_popup .layer_in .level_text td{font-size: 15px; font-weight: 300; text-align: center; height: 40px;}
|
| 1124 | 1124 |
.level_popup .pagination{margin-top: 20px;}
|
| 1125 | 1125 |
|
| 1126 |
+/* toast popup */ |
|
| 1127 |
+.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;}
|
|
| 1128 |
+.toast_popup.active{opacity:1;bottom:40px;transition:all 0.3s;}
|
|
| 1129 |
+.toast_popup.success{background:#048848;}
|
|
| 1130 |
+.toast_popup.error{background:#e11900;}
|
|
| 1131 |
+.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;}
|
|
| 1132 |
+.toast_popup .title{font-size:16px;font-weight:500;color:#fff;line-height:1.5;}
|
|
| 1133 |
+.toast_popup .btn_close{display:inline-block;width:20px;height:20px;background:url(/publish/images/icon_toast_close.png) no-repeat center center;}
|
|
| 1134 |
+ |
|
| 1135 |
+ |
|
| 1126 | 1136 |
/* ie */ |
| 1127 | 1137 |
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
|
| 1128 | 1138 |
/* 특수문자 */ |
+++ src/main/webapp/publish/images/icon_reset.png
| Binary file is not shown |
+++ src/main/webapp/publish/images/icon_toast_close.png
| Binary file is not shown |
+++ src/main/webapp/publish/images/icon_toast_success.png
| Binary file is not shown |
--- src/main/webapp/publish/js/content.js
+++ src/main/webapp/publish/js/content.js
... | ... | @@ -53,7 +53,7 @@ |
| 53 | 53 |
var jbTxt = $("#textarea").text();
|
| 54 | 54 |
$(".realtime").text(jbTxt);
|
| 55 | 55 |
|
| 56 |
- $("#textarea").on("change keyup paste", function () {
|
|
| 56 |
+ $("#textarea, #smsTxtArea").on("change keyup paste", function () {
|
|
| 57 | 57 |
var crtTxt = $(this).val(); |
| 58 | 58 |
$(".realtime").text(crtTxt);
|
| 59 | 59 |
$(".none_txt").empty();
|
--- src/main/webapp/publish/js/publish.js
+++ src/main/webapp/publish/js/publish.js
... | ... | @@ -1,4 +1,3 @@ |
| 1 |
- |
|
| 2 | 1 |
// 마우스 길게 누르는 function |
| 3 | 2 |
var onlongclick = function ($target, time, callback) {
|
| 4 | 3 |
$($target).on("mousedown", function () {
|
... | ... | @@ -12,20 +11,19 @@ |
| 12 | 11 |
|
| 13 | 12 |
var publishCommon = {
|
| 14 | 13 |
count: 0, |
| 15 |
- longMousePressCheck: function (checkTarget, checkTime , $target) {
|
|
| 14 |
+ longMousePressCheck: function (checkTarget, checkTime, $target) {
|
|
| 16 | 15 |
// checkTarget → 체크박스([name='']) / checkTime → 몇초 간격으로 체크 될지 |
| 17 | 16 |
var checkLength = checkTarget.length; // 체크박스 몇개인지 |
| 18 | 17 |
var cnt = 0; // 몇개 체크됐는지 |
| 19 | 18 |
var checkEvent = setInterval(function () {
|
| 20 |
- if (this.count == 0) {}
|
|
| 21 |
- else if (cnt >= checkLength) {
|
|
| 19 |
+ if (this.count == 0) {} else if (cnt >= checkLength) {
|
|
| 22 | 20 |
clearInterval(checkEvent); // 자동체크 끝. |
| 23 | 21 |
} |
| 24 | 22 |
//$(checkTarget[cnt]).prop('checked', true); // 체크박스 체크.
|
| 25 | 23 |
$(checkTarget[cnt]).attr("checked", "checked"); // 체크박스 체크.
|
| 26 |
- $($target).on("mouseup",function(){
|
|
| 27 |
- //마우스떼면 멈춤 |
|
| 28 |
- clearInterval(checkEvent); |
|
| 24 |
+ $($target).on("mouseup", function () {
|
|
| 25 |
+ //마우스떼면 멈춤 |
|
| 26 |
+ clearInterval(checkEvent); |
|
| 29 | 27 |
}); |
| 30 | 28 |
cnt++; |
| 31 | 29 |
fnChkCallToChange(); |
... | ... | @@ -33,51 +31,65 @@ |
| 33 | 31 |
}, |
| 34 | 32 |
clickCheck: function (checkTarget) {
|
| 35 | 33 |
// 한번 클릭 했을 때 체크, checkTarget → 체크박스([name='']) |
| 36 |
- |
|
| 37 |
- $("input:checkbox[name='chkCallTo']").each(function(){
|
|
| 38 |
- |
|
| 39 |
- var chkSts = $(this).is(":checked");
|
|
| 40 |
- |
|
| 41 |
- if(!chkSts){
|
|
| 42 |
- $(this).attr("checked", "checked");
|
|
| 43 |
- //$(this).prop("checked","true");
|
|
| 44 |
- return false; |
|
| 45 |
- } |
|
| 46 |
- |
|
| 47 |
- }); |
|
| 48 |
- |
|
| 34 |
+ |
|
| 35 |
+ $("input:checkbox[name='chkCallTo']").each(function () {
|
|
| 36 |
+ |
|
| 37 |
+ var chkSts = $(this).is(":checked");
|
|
| 38 |
+ |
|
| 39 |
+ if (!chkSts) {
|
|
| 40 |
+ $(this).attr("checked", "checked");
|
|
| 41 |
+ //$(this).prop("checked","true");
|
|
| 42 |
+ return false; |
|
| 43 |
+ } |
|
| 44 |
+ |
|
| 45 |
+ }); |
|
| 46 |
+ |
|
| 49 | 47 |
}, |
| 50 |
- clickCheckAll : function(){
|
|
| 51 |
- |
|
| 52 |
- var chkCnt = $("input:checkbox[name='chkCallTo']").length;
|
|
| 53 |
- var chkAllSts = $('input:checkbox[name="receipt_number_check"]').is(':checked');
|
|
| 54 |
- //var chkAllSts = $('input:checkbox[name="receipt_number_check"]').attr("checked");
|
|
| 55 |
- |
|
| 56 |
- if(chkCnt == 0){
|
|
| 57 |
- |
|
| 58 |
- alert("받는사람을 추가해 주세요.");
|
|
| 59 |
- return false; |
|
| 60 |
- |
|
| 61 |
- } |
|
| 62 |
- |
|
| 63 |
- $("input:checkbox[name='chkCallTo']").each(function(){
|
|
| 64 |
- |
|
| 65 |
- if(chkAllSts){
|
|
| 66 |
- $(this).attr("checked", "checked");
|
|
| 67 |
- //$(this).prop("checked",true);
|
|
| 68 |
- }else{
|
|
| 69 |
- $(this).removeAttr("checked");
|
|
| 70 |
- //$(this).prop("checked",false);
|
|
| 71 |
- } |
|
| 72 |
- |
|
| 73 |
- }); |
|
| 74 |
- |
|
| 75 |
- |
|
| 48 |
+ clickCheckAll: function () {
|
|
| 49 |
+ |
|
| 50 |
+ var chkCnt = $("input:checkbox[name='chkCallTo']").length;
|
|
| 51 |
+ var chkAllSts = $('input:checkbox[name="receipt_number_check"]').is(':checked');
|
|
| 52 |
+ //var chkAllSts = $('input:checkbox[name="receipt_number_check"]').attr("checked");
|
|
| 53 |
+ |
|
| 54 |
+ if (chkCnt == 0) {
|
|
| 55 |
+ |
|
| 56 |
+ alert("받는사람을 추가해 주세요.");
|
|
| 57 |
+ return false; |
|
| 58 |
+ |
|
| 59 |
+ } |
|
| 60 |
+ |
|
| 61 |
+ $("input:checkbox[name='chkCallTo']").each(function () {
|
|
| 62 |
+ |
|
| 63 |
+ if (chkAllSts) {
|
|
| 64 |
+ $(this).attr("checked", "checked");
|
|
| 65 |
+ //$(this).prop("checked",true);
|
|
| 66 |
+ } else {
|
|
| 67 |
+ $(this).removeAttr("checked");
|
|
| 68 |
+ //$(this).prop("checked",false);
|
|
| 69 |
+ } |
|
| 70 |
+ |
|
| 71 |
+ }); |
|
| 72 |
+ |
|
| 73 |
+ |
|
| 76 | 74 |
}, |
| 77 |
- clickCheckPrice : function(){
|
|
| 78 |
- |
|
| 79 |
- fnChkCallToChange(); |
|
| 80 |
- |
|
| 75 |
+ clickCheckPrice: function () {
|
|
| 76 |
+ |
|
| 77 |
+ fnChkCallToChange(); |
|
| 78 |
+ |
|
| 79 |
+ }, |
|
| 80 |
+ toastsUtil: function (txt, cls, status) {
|
|
| 81 |
+ // txt - 문구 / cls - 활성화 clss / status - 초록색인지 빨간색인지 |
|
| 82 |
+ var toastText = txt; |
|
| 83 |
+ $(".toast_popup").find(".title").text(toastText);
|
|
| 84 |
+ if ($(".toast_popup").hasClass("active") == true) {
|
|
| 85 |
+ $(".toast_popup").removeClass(cls).removeClass(status);
|
|
| 86 |
+ } else {
|
|
| 87 |
+ $(".toast_popup").fadeIn(400);
|
|
| 88 |
+ $(".toast_popup").addClass(cls).addClass(status);
|
|
| 89 |
+ setTimeout(function () {
|
|
| 90 |
+ $(".toast_popup").removeClass(cls).removeClass(status);
|
|
| 91 |
+ }, 2000) |
|
| 92 |
+ } |
|
| 81 | 93 |
} |
| 82 |
- |
|
| 83 |
-} |
|
| 94 |
+ |
|
| 95 |
+}(No newline at end of file) |
--- src/main/webapp/publish/sub_election_2023.html
+++ src/main/webapp/publish/sub_election_2023.html
... | ... | @@ -82,6 +82,14 @@ |
| 82 | 82 |
<body> |
| 83 | 83 |
|
| 84 | 84 |
<div class="mask"></div> |
| 85 |
+ |
|
| 86 |
+ <!-- toast(시작) --> |
|
| 87 |
+ <div class="toast_popup success"> |
|
| 88 |
+ <i class="icon check"></i> |
|
| 89 |
+ <p class="title">처리가 완료되었습니다.</p> |
|
| 90 |
+ <button type="button" class="btn_close" onclick="publishCommon.toastsUtil('','active','success')"><i></i></button>
|
|
| 91 |
+ </div> |
|
| 92 |
+ <!-- toast(끝) --> |
|
| 85 | 93 |
|
| 86 | 94 |
<!-- 전송내역 팝업 --> |
| 87 | 95 |
<div class="tooltip-wrap"> |
... | ... | @@ -1349,7 +1357,7 @@ |
| 1349 | 1357 |
<div class="put_left"> |
| 1350 | 1358 |
<div class="listType list"> |
| 1351 | 1359 |
<ul class="thead_ul table_ul"> |
| 1352 |
- <li><div class="input_wrap"><input type="checkbox" id="checkAll" name="receipt_number_check"></div></li> |
|
| 1360 |
+ <li><!-- <div class="input_wrap"><input type="checkbox" id="checkAll" name="receipt_number_check"></div> --></li> |
|
| 1353 | 1361 |
<li> |
| 1354 | 1362 |
번호 |
| 1355 | 1363 |
<button type="button" class="btn_sort_up"><img src="/publish/images/sortUp.png"></button> |
... | ... | @@ -1445,23 +1453,22 @@ |
| 1445 | 1453 |
</div> |
| 1446 | 1454 |
<div class="list_bottom"> |
| 1447 | 1455 |
<ul class="pagination"> |
| 1448 |
- <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> |
|
| 1449 |
- <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> |
|
| 1456 |
+ <!-- <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> |
|
| 1457 |
+ <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> --> |
|
| 1450 | 1458 |
<li class="on"><button type="button"><a href="#" title="현재페이지">1</a></button></li> |
| 1451 |
- <li><button type="button" onclick="customSampleListAjax(2);return false;"><a href="#" title="2페이지">2</a></button></li> |
|
| 1459 |
+ <!-- <li><button type="button" onclick="customSampleListAjax(2);return false;"><a href="#" title="2페이지">2</a></button></li> |
|
| 1452 | 1460 |
<li><button type="button" onclick="customSampleListAjax(3);return false;"><a href="#" title="3페이지">3</a></button></li> |
| 1453 | 1461 |
<li><button type="button" onclick="customSampleListAjax(4);return false;"><a href="#" title="4페이지">4</a></button></li> |
| 1454 | 1462 |
<li><button type="button" onclick="customSampleListAjax(5);return false;"><a href="#" title="5페이지">5</a></button></li> |
| 1455 | 1463 |
<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> |
| 1456 |
- <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> |
|
| 1464 |
+ <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> --> |
|
| 1457 | 1465 |
</ul> |
| 1458 | 1466 |
<div class="list_bottom_right"> |
| 1459 |
- <button type="button" class="btnType btn_gray fill">초기화</button> |
|
| 1467 |
+ <button type="button" class="btnType btn_gray fill">전체선택</button> |
|
| 1460 | 1468 |
<div class="btn_popup_wrap"> |
| 1461 | 1469 |
<button type="button" class="btnType btn_yellow fill btn_check_one">1명씩 선택<i class="qmMark"></i></button> |
| 1462 | 1470 |
<div class="error_hover_cont send_hover_cont"> |
| 1463 |
- <p>휴대폰 번호 입력 시 해당 휴대폰 번호에 대한 형식이 어긋나거나 휴대폰 번호에 오류가 있는지 등을 검사하는 기능</p> |
|
| 1464 |
- <span>(예시) 010-1234-0001(O) / 010-123-0001(X)</span> |
|
| 1471 |
+ <p>마우스를 누르고 있으면 받는사람을 연속적으로 20명까지 선택할 수 있습니다.</p> |
|
| 1465 | 1472 |
</div> |
| 1466 | 1473 |
</div> |
| 1467 | 1474 |
</div> |
... | ... | @@ -1473,12 +1480,12 @@ |
| 1473 | 1480 |
<div class="btn_popup_wrap"> |
| 1474 | 1481 |
<button type="button" class="btnType btnType3">오류 검사 <i class="qmMark"></i></button> |
| 1475 | 1482 |
<div class="error_hover_cont send_hover_cont"> |
| 1476 |
- <p>휴대폰 번호 입력 시 해당 휴대폰 번호에 대한 형식이 어긋나거나 휴대폰 번호에 오류가 있는지 등을 검사하는 기능</p> |
|
| 1483 |
+ <p>마우스를 계속 누르고 있으면 받는 사람이 연속으로 선택됩니다.</p> |
|
| 1477 | 1484 |
<span>(예시) 010-1234-0001(O) / 010-123-0001(X)</span> |
| 1478 | 1485 |
</div> |
| 1479 | 1486 |
</div> |
| 1480 | 1487 |
<dl class="receipt_info"> |
| 1481 |
- <dt>전체 받는사람</dt> |
|
| 1488 |
+ <dt>전체 받는사람 <button type="button" class="btn_reset"><i></i>초기화</button></dt> |
|
| 1482 | 1489 |
<dd> |
| 1483 | 1490 |
<p><b>10,000,000</b>명</p> |
| 1484 | 1491 |
</dd> |
... | ... | @@ -1629,7 +1636,7 @@ |
| 1629 | 1636 |
</ul> |
| 1630 | 1637 |
</div> |
| 1631 | 1638 |
<div class="send_btn"> |
| 1632 |
- <button type="button" class="btnType btnType11" onclick="javascript:fn_sendMsgData(); return false;">발송하기</button> |
|
| 1639 |
+ <button type="button" class="btnType btnType11" onclick="publishCommon.toastsUtil('처리가 완료되었습니다.','active', 'success')">발송하기</button>
|
|
| 1633 | 1640 |
<button type="button" class="btnType btnType10" onclick="javascript:fnTestSend(); return false;">테스트발송</button> |
| 1634 | 1641 |
</div> |
| 1635 | 1642 |
</div> |
Add a comment
Delete comment
Once you delete this comment, you won't be able to recover it. Are you sure you want to delete this comment?