알림 : 퍼블 템플릿 적용 작업 완료

2021-11-08 10:47:21 +09:00 · 2021-11-08 10:47:21 +09:00 · 96ca01d797
commit 96ca01d797
parent cc9b10866f
8 changed files with 244 additions and 183 deletions
--- a/src/main/java/nlib/cmm/service/NotificationVO.java
+++ b/src/main/java/nlib/cmm/service/NotificationVO.java
@ -17,6 +17,9 @@ public class NotificationVO extends PagingVO {
 	private int    totCnt = 0;  /* 알림건수(최근1개월) */
 	private int    rno = 0;     /* 행번호 */
 	
+	private String mngOrgCd;    /* 관리문화원코드 */
+	private String mngOrgNm;    /* 관리문화원명 */ 
+	
 	public String getNotiId() {
 		return notiId;
 	}
@ -95,5 +98,17 @@ public class NotificationVO extends PagingVO {
 	public void setRno(int rno) {
 		this.rno = rno;
 	}
+	public String getMngOrgCd() {
+		return mngOrgCd;
+	}
+	public void setMngOrgCd(String mngOrgCd) {
+		this.mngOrgCd = mngOrgCd;
+	}
+	public String getMngOrgNm() {
+		return mngOrgNm;
+	}
+	public void setMngOrgNm(String mngOrgNm) {
+		this.mngOrgNm = mngOrgNm;
+	}
 	
 }
--- a/src/main/java/nlib/cmm/web/NotificationController.java
+++ b/src/main/java/nlib/cmm/web/NotificationController.java
@ -23,6 +23,7 @@ import org.springframework.web.servlet.mvc.support.RedirectAttributes;
 import nlib.cmm.NlibCommonController;
 import nlib.cmm.service.NotificationService;
 import nlib.cmm.service.NotificationVO;
+import nlib.cmm.service.PagingVO;
 import nlib.cmm.service.NlibProperty;
 import nlib.restful.service.DataApiReqVO;
 import nlib.restful.service.DataApiResVO;
@ -110,7 +111,7 @@ public class NotificationController extends NlibCommonController {
 			Authentication authentication, @RequestBody Map<String, String> paramMap) throws Exception {

 		String mbInfoId = getMbInfoId(req);
-		String pageIndex = StringUtil.getString(paramMap.get("pageIndex"), "1");
+		int pageIndex = StringUtil.toNumber(paramMap.get("pageIndex"), 1);
 		int pageSize  = StringUtil.toNumber(paramMap.get("pageSize"), DEFUALT_PAGE_SIZE);
 		
 		log.debug("listNotificationsAjax > pageIndex = " + pageIndex);
@ -136,6 +137,14 @@ public class NotificationController extends NlibCommonController {
    	retMap.put("data", list);
    	retMap.put("itemsCount", totRecordCount);
    	
+    	PagingVO pageVO = new PagingVO();
+	  	pageVO.setPagingVO(totRecordCount, pageIndex, pageSize);
+	  	retMap.put("pagingPageIndex"     , pageVO.getPageIndex());
+	  	retMap.put("pagingTotRecordCount", pageVO.getTotRecordCount());
+	  	retMap.put("pagingStartPage"     , pageVO.getStartPage());
+	  	retMap.put("pagingEndPage"       , pageVO.getEndPage());
+	  	retMap.put("pagingLastPage"      , pageVO.getLastPage());
+    	
    	return makeResponseEntityJson(retMap);
 	}

--- a/src/main/resources/egovframework/mapper/nlib/cmm/NotificationDAO_SQL.xml
+++ b/src/main/resources/egovframework/mapper/nlib/cmm/NotificationDAO_SQL.xml
@ -3,30 +3,6 @@
 "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
 <mapper namespace="NotificationDAO">

- 	<select id="listNotifications_bk20210910" parameterType="NotificationVO" resultType="NotificationVO">
- 	    <![CDATA[
-		SELECT 
-		      A.NOTI_ID
-		    , A.RECV_USER_ID
-		    , A.TITLE
-		    , A.CONTENT
-		    , A.NOTI_METHOD
-		    , A.NOTI_TYPE_CD
-		    , B.S_CODE_NM AS NOTI_TYPE_NM
-            , IF(A.READ_DD IS NULL, 'N', 'Y') AS READ_YN
-            , DATE_FORMAT(A.REG_DD, '%Y-%m-%d') AS REG_DD
-		    , COUNT(A.NOTI_ID) OVER(PARTITION BY 1) AS TOT_CNT 
-		FROM SM_NOTIFICATION A
-		JOIN SM_CODE_S B
-		ON B.S_CODE_ID = A.NOTI_TYPE_CD
-		WHERE A.RECV_USER_ID = #{recvUserId}
-		AND A.REG_DD > DATE_SUB(NOW(), INTERVAL 1 MONTH)
-		AND B.L_CODE_ID = 'NOTI_TYPE_CD'
-		AND B.USE_YN = 'Y'
-		ORDER BY A.NOTI_ID DESC
-		]]>
- 	</select>
- 	
 	<select id="listNotifications" parameterType="NotificationVO" resultType="NotificationVO">
        <![CDATA[
        SELECT 
@ -38,9 +14,12 @@
            , A.NOTI_TYPE_CD
            , B.S_CODE_NM AS NOTI_TYPE_NM
            , IF(A.READ_DD IS NULL, 'N', 'Y') AS READ_YN
-            , DATE_FORMAT(A.REG_DD, '%Y-%M-%D') AS REG_DD
+            , DATE_FORMAT(A.READ_DD, '%Y-%m-%d') AS READ_DD
+            , DATE_FORMAT(A.REG_DD, '%Y-%m-%d') AS REG_DD
            , COUNT(A.NOTI_ID) OVER(PARTITION BY 1) AS TOT_CNT 
            , A2.RNO
+            , A.MNG_ORG_CD
+            , C.DEPT_NM AS MNG_ORG_NM
        FROM SM_NOTIFICATION A
        INNER JOIN (
            SELECT S.NOTI_ID
@ -54,6 +33,8 @@
        USING(NOTI_ID)
        JOIN SM_CODE_S B
        ON B.S_CODE_ID = A.NOTI_TYPE_CD
+        LEFT OUTER JOIN SM_DEPT C
+        ON A.MNG_ORG_CD = C.ORG_CD
        WHERE 1=1 
        AND B.L_CODE_ID = 'NOTI_TYPE_CD'
        AND B.USE_YN = 'Y'
@ -83,7 +64,10 @@
        <![CDATA[
        SELECT A.*
             , IF(A.READ_DD IS NULL, 'N', 'Y') AS READ_YN
+             , B.DEPT_NM AS MNG_ORG_NM
        FROM SM_NOTIFICATION A 
+        LEFT OUTER JOIN SM_DEPT B
+        ON A.MNG_ORG_CD = B.ORG_CD
        WHERE A.RECV_USER_ID = #{recvUserId}
        AND A.NOTI_ID = #{notiId}
        ]]>
--- a/src/main/webapp/Notifications.html
+++ b/src/main/webapp/Notifications.html
@ -149,7 +149,7 @@
                                        <span>반납 하루전입니다</span>
                                        <span class="date">2021-08-23</span>
                                    </button>
-                                    <div class="answer" style="display: none;">
+                                    <div class="answer" style="display: block;">
                                        <p>반납예정일: 21/09/10</p>
                                        <p>(자료제목이 들어갑니다…)</p>
                                    </div>
--- a/src/main/webapp/WEB-INF/jsp/nlib/cmm/headerSubPart.jsp
+++ b/src/main/webapp/WEB-INF/jsp/nlib/cmm/headerSubPart.jsp
@ -10,9 +10,6 @@ String councilCd = (String)session.getAttribute("councilCd");
 String councilNm = (String)session.getAttribute("councilNm");
 %>
 <script>
-$(document).ready(function() {
-	
-});

 function goSearch(){
 	document.searchHeaderForm.submit();
--- a/src/main/webapp/WEB-INF/jsp/nlib/cmm/home.jsp
+++ b/src/main/webapp/WEB-INF/jsp/nlib/cmm/home.jsp
@ -5,11 +5,12 @@
 <%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
 <%@ taglib prefix="sec" uri="http://www.springframework.org/security/tags"%>

-
 <script type="text/javascript">
-window.onload = function() {
-    fn_myAlert('${unreadNotiCnt}');
-};
+
+$(document).ready(function() {
+    var unreadNotiCnt = $(".noti-btn span.count").text();
+    fn_myAlert(unreadNotiCnt);
+});

 </script>

--- a/src/main/webapp/WEB-INF/jsp/nlib/cmm/listNotifications.jsp
+++ b/src/main/webapp/WEB-INF/jsp/nlib/cmm/listNotifications.jsp
@ -22,6 +22,30 @@
 *
 */
 %>
+<%
+/**
+ * <pre>
+ * @Class Name : listFaqs.jsp
+ * 
+ * @Description : 자주하는질문 목록 화면을 표출한다.
+ * 
+ * 
+ * @프로젝트명: 지방문화원 통합자료관리시스템 구축사업 (2021)
+ *
+ * </pre>
+ *
+ * @ ------------    --------    ---------------------------
+ * @ 수정일                     수정자             수정내용
+ * @ ------------    --------    ---------------------------
+ * @ 2021. 9. 15.    KNKIM       최초 생성
+ *
+ * 
+ * @author 이씨플라자 * DIGITALSHIP KNKIM
+ * @since 2021. 9. 15.
+ * @version 1.0
+ *
+ */
+ %>
 <%@ page language="java" contentType="text/html; charset=UTF-8" %>
 <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
 <%@ taglib prefix="ui" uri="http://egovframework.gov/ctl/ui" %>
@ -33,102 +57,23 @@

 <c:set var="pageTitle">알림</c:set>

- <!DOCTYPE html>
- <html lang="ko">
- <head>
- <title>${pageTitle}</title>
-
- <!-- GRID -->
- <link type="text/css" rel="stylesheet" href="${pageContext.request.contextPath}/js/jsgrid/nlib-jsgrid.css" />
- <link type="text/css" rel="stylesheet" href="${pageContext.request.contextPath}/js/jsgrid/nlib-jsgrid-theme.css" />
- <script src="${pageContext.request.contextPath}/js/jsgrid/nlib-jsgrid.js"></script>
-
- <script type="text/javaScript" language="javascript">
- var GRID_INDEX_OF_READYN = 5;
+<script type="text/javaScript" language="javascript">
 
- $( document ).ready(function() {
+$( document ).ready(function() {
     
-     //=======================================================
-     // 그리드 생성 환경설정 
-     //=======================================================
-     $("#jsGrid").jsGrid({
-         pageSize : $("#pageSize").val(),
-         scrollOffset:0,
-         controller: {
-             loadData: function (filter) { // 그리드에 데이터를 가져올 때 실팽되는 함수 
-                 var data = $.Deferred();
-                 //======================================
-                 // 요청 정보 구성 : 시작  (각 요청에 맞게 조정)
-                 //======================================
-                 var reqUrl = "${pageContext.request.contextPath}/cmm/listNotificationsAjax.do";
-                 var pageIndex = ( filter && filter.pageIndex ? filter.pageIndex : $("#pageIndex").val());
-                 var pageSize  = ( filter && filter.pageSize  ? filter.pageSize  : $("#pageSize").val());
-                 
-                 $("#pageIndex").val(pageIndex);
+     // 메시지 표출 
+     if(!fn_isEmpty('${message}')) {
+         alert("${message}");
+     }

-                 var inputData = {
-                           "pageIndex" : pageIndex
-                         , "pageSize": pageSize};
-                 
-                 
-                 //--------------------------------------
-                 // 요청 처리 
-                 //--------------------------------------
-                 $.ajax({
-                     type: "post",
-                     contentType: "application/json; charset=utf-8",
-                     url: reqUrl,
-                     dataType: "json",
-                     data: JSON.stringify(inputData),
-                 }).done(function(response){
-                     <%
-                     // 그리드 데이터 예시 : 
-                     // (1) 페이징 클라이언트에서 수행하는 경우(pageloading = false) : [{ "articleNo": 1, "articleType": "01" }, { "articleNo": 2, "articleType": "02" }]
-                     // (2) 페이징 서버에서 수행하는 경우(pageloading = true) : {data: [{...}], itemsCount: 255}
-                     %>
-                     var jsonObj = JSON.parse(response);
-                     //$("#itemsCount").val(jsonOjb.itemsCount);
-                     console.log(jsonObj.itemsCount);
-                     
-                     if(jsonObj.itemsCount == undefined) $("#itemsCount").val("0");
-                     else $("#itemsCount").val(jsonObj.itemsCount);
-                     
-                     data.resolve(jsonObj);
-                 });
-                 return data.promise();
-             } // loadData
-         },
-         
-         rowClick: function(args) { // 행 클릭 시, 실행되는 이벤트 함수 
-             
-             // 클릭된 행의 자료 객체 
-             var getData = args.item;
-             
-             // 추출할 컬럼의 데이터 가져오기 
-             var notiId = getData["notiId"];
-             var selectedRow = $("#jsGrid").find('table tr.jsgrid-selected-row');
-             
-             // 상세 내용 보기 
-             fn_viewDetail(notiId, selectedRow);
-         },
-           
-         //======================================
-         // 그리드 컬럼 정의  (각 요청에 맞게 조정)
-         //======================================
-         fields: [
-             { title:"ID",   name: "notiId" , type: "text", width: 200, align: "left" },
-             { title:"알림방법",   name: "notiMethod" , type: "text", width: 100, align: "center"},
-             { title:"구분코드",   name: "notiTypeCd" , type: "text", width: 100, align: "center"},
-             { title:"구분",   name: "notiTypeNm" , type: "text", width: 100, align: "center"},
-             { title:"제목",   name: "title"      , type: "text", width: 200, align: "left" },
-             { title:"확인여부",   name: "readYn"      , type: "text", width: 100, align: "center"},
-             { title:"날짜",   name: "regDd"      , type: "text", width: 100, align: "center"}
-         ]
-     });
-
-     // 검색 버튼 클릭 
+     // 검색 수행 이벤트  
     $("#btnSearch").on("click", function(e) {
-         fn_searchArticle($("#pageSize").val(), 1);
+         fn_searchArticle(1);
+     });
+     $("#searchKeyword").on("keydown", function(e) {
+         if(e.keyCode == 13) {
+             fn_searchArticle(1);    
+         }
     });
     
     //초기 자료 조회 
@ -136,11 +81,14 @@
     
 }); // document ready

-
 // 선택한 글 상세 보기로 이동
- function fn_viewDetail(notiId, selectedRow) {
+ function fn_viewDetail(qObj, notiId) {

-     var $selectedRow = $(selectedRow);
+     var $qObj = $(qObj);
+     if($qObj.hasClass('on')) {
+         return;
+     }
+     
     var reqUrl = "${pageContext.request.contextPath}/cmm/selectNotificationAjax.do";
     var inputData = { "notiId" : notiId };
     
@ -155,65 +103,145 @@
         data: JSON.stringify(inputData),
     }).done(function(response){
         var jsonObj = JSON.parse(response);
-         $("#jsGrid").find('table tr.answer').remove();
-         //alert("DDDDDDDD remove = " + $("#jsGrid")[0].scrollHeight);
-         
-        $("#jsGrid").jsGrid("rowByItem", $selectedRow).data("JSGridItem")["readYn"] = jsonObj.data.readYn;
-        $selectedRow.find('td').eq(GRID_INDEX_OF_READYN).text(jsonObj.data.readYn);
+         var answerHtml = jsonObj.data.content;
+              
+        $('.list-accordion .answer').html("");
+        $qObj.next(".answer").html("<p>" + answerHtml + "<p>&nbsp;</p>");
+             
+        // 펼치기 
+        $('.list-accordion .answer').stop().slideUp(300);
+        $qObj.next('.answer').stop().slideDown(300);
        
-        $selectedRow.after("<tr class='answer'><td colspan='7'>" + jsonObj.data.content
-                 + "<br/>" + jsonObj.data.content
-                 + "<br/>" + jsonObj.data.content
-                 + "<br/>" + jsonObj.data.content
-                 + "<br/>알림확인여부=" + jsonObj.data.readYn
-                 + "<br/>알림일자=" + jsonObj.data.regDd
-                 + "</td></tr>");
+        $('.list-accordion .question').removeClass('on');
+        $qObj.addClass('on');
     });
-     
-     $("#jsGrid").closest('.ui-jqgrid-bdiv').width($("#jsGrid").closest('.ui-jqgrid-bdiv').width() + 1);
-     
+
 }
 
+
 // 그리드 데이터 조회 호출 
- function fn_searchArticle(pageSize, pageIndex) {
-     $("#jsGrid").jsGrid("search"
-             , {'pageSize'  : (pageSize  ? pageSize  : fn_getIntValue("pageSize", ${pageSize}) ), 
-                'pageIndex' : (pageIndex ? pageIndex : fn_getIntValue("pageIndex", 1))
-               }
-     );
+ function fn_searchArticle(pageIndex) {
+     
+     if(fn_isEmpty(pageIndex)) pageIndex = $("#pageIndex").val();
+     if(fn_isEmpty(pageIndex)) pageIndex = "1";
+     $("#pageIndex").val(pageIndex);
+     
+     var reqUrl = "${pageContext.request.contextPath}/cmm/listNotificationsAjax.do";
+     
+     var inputData = {
+               "pageIndex"  : $("#pageIndex").val()
+             , "pageSize"   : $("#pageSize").val()
+     };
+     
+     
+     //--------------------------------------
+     // 요청 처리 
+     //--------------------------------------
+     $.ajax({
+         type: "post",
+         contentType: "application/json; charset=utf-8",
+         url: reqUrl,
+         dataType: "json",
+         data: JSON.stringify(inputData),
+     }).done(function(data) {
+         <%
+         // 그리드 데이터 예시 : 
+         // (1) 페이징 클라이언트에서 수행하는 경우(pageloading = false) : [{ "articleNo": 1, "articleType": "01" }, { "articleNo": 2, "articleType": "02" }]
+         // (2) 페이징 서버에서 수행하는 경우(pageloading = true) : {data: [{...}], itemsCount: 255}
+         %>
+         
+         var jsonObj = JSON.parse(data);
+         console.log(jsonObj.itemsCount);
+         
+         // 건수 
+         if(jsonObj.itemsCount == undefined) {
+             $("#itemsCount").text("0");
+         }
+         else {
+             $("#itemsCount").text(jsonObj.itemsCount);
+         }
+         
+         // 기존 데이터 CLEAR
+         $( "ul.list-faq li").not('.no-result').remove();
+         
+         if(!jsonObj.data || jsonObj.data.length <= 0 ) {
+             $("ul.list-faq li.no-result").show();
+         } else {
+             $("ul.list-faq li.no-result").hide();
+
+             // 출력
+             $.each(jsonObj.data,function(key,obj) {
+                 var li = $(document.createElement('li'));
+                 li.attr("articleId", obj.articleId);
+                 li.append($('<button type="button"></button>').attr('class', 'question').on("click", function() {
+                     fn_viewDetail(this, obj.notiId);
+                 }));
+                 if(!fn_isEmpty(obj.mngOrgNm)) li.find(".question").append($('<span />').attr("class", "type").html("[" + obj.mngOrgNm + "]"));
+                 else li.find(".question").append($('<span />').attr("class", "type").html("[소장자료관]"));
+                 
+                 var unread = "";
+                 if(obj.readYn != "Y") unread = " (미확인)";
+                 li.find(".question").append($('<span />').html(obj.title + unread));
+                 li.find(".question").append($('<span />').attr('class', 'date').html(obj.regDd));
+                 li.append($('<div></div>').attr('class', 'answer').attr('style', 'display: none;'));
+                 $( "ul.list-faq").append(li);
+             });
+             
+         }
+         
+         pageLoad("fn_searchArticle", jsonObj.pagingPageIndex, jsonObj.pagingTotRecordCount, jsonObj.pagingStartPage, jsonObj.pagingEndPage, jsonObj.pagingLastPage); 
+
+     }).fail(function (jqXHR, textStatus, errorThrown) {
+         alert("조회에 실패하였습니다. 관리자에게 문의 바랍니다.");
+     });
 }
- 
- </script>
- </head>

- <body>
+</script>

- <h1>${pageTitle }</h1>
-
- 메시지 : ${message} 
- 
- 
- &nbsp;<br/>
- <form name="articleForm" id="articleForm"  
-       action="${pageContext.request.contextPath}/cmm/listAlerts.do" 
-       method="post"> 
-     
-     <!-- 검색조건 -->
-     <input type="text" name="pageSize" id="pageSize" value="${pageSize }" />
-     <input type="text" name="itemsCount" id="itemsCount" value="0" />
-     
-     <input type="text" name="pageIndex" id="pageIndex" title="페이지번호" value="${pageIndex }" size="5" maxlength="5" />
-     <input type="button" name="btnSearch" id="btnSearch" title="새로고침" value="새로고침" />
-     
-     <br/>
-          
-     <div id="jsGrid" name="jsGrid" style="height: 100%"></div>
-     
-     
-     <input type="text" name="articleNo" id="articleNo" value="" title="선택글번호" readonly />
-
- </form>
-
- </body>
- </html>
+    <!-- 알림 섹션 -->
+    <div class="location noti-data">
+        <h2 class="blind">알림 섹션영역</h2>
+        <div class="inner">
+            <div class="row-top">
+                <div class="location-box">
+                    <ul class="loc">
+                        <li>HOME</li>
+                        <li class="on">${pageTitle}</li>
+                    </ul>
+                    <ul class="tit">
+                        <li><span>${pageTitle}</span></li>
+                    </ul>
+                </div>
+                <div class="arr"><img src="/images/icon/icon-join-arr2.png" alt="화살표 아이콘"></div>
+            </div>
+            <div class="contents row-bottom">
+                <div class="list-box noti-box">
+                    <div class="title">
+                        <span class="count">총 <em name="itemsCount" id="itemsCount">0</em>건</span>
+                        <div class="text">
+                            <p>-  최근 한달동안 발송된 알림 내역만 보관됩니다.</p>
+                        </div>
+                    </div>
+                    
+                    <div class="notifi">
+                        <div class="list-accordion">
+                            <ul class="list-faq">
+                            <li class="no-result" style="display:none;">
+                                <span>검색결과가 없습니다.</span>
+                            </li>                                    
+                            </ul>
+                        </div>
+                        <ul id="paging" class="paging"></ul>
+                    </div>
+                     
+                </div>
+            </div>
+        </div>
+    </div>
+    
+<form name="articleForm" id="articleForm" method="post" onsubmit="return false;"> 
+<input type="hidden" name="pageSize" id="pageSize" value="${pageSize }" />
+<input type="hidden" name="pageIndex" id="pageIndex" title="페이지번호" value="${pageIndex }" />
+<input type="hidden" name="articleId" id="articleId" title="게시글번호" value="" readonly />
+</form>

--- a/src/main/webapp/js/nlib.js
+++ b/src/main/webapp/js/nlib.js
@ -94,13 +94,40 @@ function fn_closeLayerPopup() {
 }

 function fn_myAlert(newAlertNum) {
+	
 	if(newAlertNum == "undefined" || newAlertNum == null || newAlertNum < 1) {
 		return;
 	}
 	
-	fn_openLayerPopup("알림", "아직 확인하지 않은 새로운 알림이 " + newAlertNum + "건 있습니다", "알림 목록으로", CONTEXT_PATH + "/cmm/listNotifications.do");
+    var notiHtml = 
+        '<div class="row Title">' + 
+        '    <p>지방문화원 소장자료</p>' + 
+        '    <h3>알림</h3>' + 
+        '</div>' + 
+        '<div class="inner">' + 
+        '    <div class="row Text">' + 
+        '        <p>아직 확인하지 않은<br>새로운 알림이 <span>' + newAlertNum + '</span>건 있습니다.</p>' + 
+        '    </div>' + 
+        '    <div class="row btn-box">' + 
+        '        <button type="button" class="btn btn-color" onclick="fn_closeLayerPopup()">확인</button>' + 
+        '        <button type="submit" class="btn btn-green" onclick="location.href = \'/cmm/listNotifications.do\'; ">알림 목록으로</button>' + 
+        '    </div>' + 
+        '    <button type="button" class="notice-close" onclick="fn_closeLayerPopup()"></button>' + 
+        '</div>' + 
+        '<div class="Bg"></div>';
+    fn_layerPopWithHtml(notiHtml, "pop-notice");
 }

+function fn_layerPopWithHtml(cHtml, addClasses) {
+	$("#NLIB_LAYER_POPUP").removeClass();
+    $("#NLIB_LAYER_POPUP").addClass(addClasses);
+    $("#NLIB_LAYER_POPUP").html(cHtml);
+    $("#NLIB_LAYER_POPUP").show();
+
+    var classes = addClasses.split(" ");
+    
+    $("." + classes[0]).fadeIn();
+}

 function fn_layerPopWithClass(url, addClasses) {
 	// 클릭 시, 로딩되도록 처리 (2021.10.20)