style24
/
style24.front


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154
							<!DOCTYPE html>
<html lang="ko"
	xmlns:th="http://www.thymeleaf.org"
	xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
	layout:decorator="web/common/layout/CallcenterLayoutWeb">
<!--
 *******************************************************************************
 * @source  : NoticeFormWeb.html
 * @desc    : 공지사항 Page
 *============================================================================
 * STYLE24
 * Copyright(C) 2020 TSIT, All rights reserved.
 *============================================================================
 * VER  DATE         AUTHOR      DESCRIPTION
 * ===  ===========  ==========  =============================================
 * 1.0  2021.02.01   gagamel     최초 작성
 *******************************************************************************
 -->
<body>

<th:block layout:fragment="content">
	<div id="container" class="container cs"> 
		<div class="breadcrumb"> 
			<ul>
				<li class="bread_home"><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_MAIN);">홈</a></li>
				<li class="bread_2depth"><a href="javascript:void(0);" onclick="cfnGoToPage(_PAGE_FAQ);">고객센터</a></li>
				<li class="bread_3depth">공지사항</li>
			</ul> 
		</div>
		<div class="wrap">
			<div class="content notice">
				<div class="cont_body">
					<!-- CONT-BODY -->
					<div class="lnb" id="callcenterLnb">
					</div>
					<div class="cont">
						<div>
							<div class="sec_head">
								<h3>공지</h3>
							</div>
							<div class="sec_body">
								<div class="ui_row" id="divNotice"> <!-- 데이터 없을시 클래스 nodata 추가 -->
									<!-- list -->
									<div class="foldGroup case1">
										<ul id="ulNotice">
										</ul>
									</div>
									<!-- //list -->
								</div>
								<div class="ui_foot">
									<div class="ui_row">
										<ul class="pageNav" id="pageNav">
										</ul>
									</div>
								</div>
							</div>
						</div>
					</div>
					<!-- // CONT-BODY -->
				</div>
			</div>
		</div>
	</div>
	<!-- // container -->
	
	<form id="noticeForm" name="noticeForm" action="#" th:action="@{'/callcenter/notice/list'}">
		<input type="hidden" name="pageNo" value ="1"/>
		<input type="hidden" name="pageSize" value ="10"/>
	</form>

<script src="/ux/plugins/gaga/gaga.paging.js"></script>
<script th:inline="javascript">
/*<![CDATA[*/
	$(document).ready(function() {
		// 고객센터 LNB 설정
		fnSetCallcenterLnb(4);
		
		fnGetList();
	});
	
	let fnGetList = function() {
		// Initialize a pagination
		gagaPaging.init('noticeForm', fnGetListCallback, 'pageNav', 10);

		// Load data
		gagaPaging.load(1);
	}
	
	String.prototype.unescapeHtml = function(){
	  return this.replace(/&amp;/g, "&").replace(/&lt;/g, "<").replace(/&gt;/g, ">").replace(/&quot;/g, "\"");
	};


	var fnGetListCallback = function(result) {
		$('#ulNotice').html('');

		if (result.dataList != null && result.dataList.length > 0) {
			$.each(result.dataList, function(idx, item) {
				let paging = result.paging.pageable;
				let tag = '';
				
				if (item.urgentYn == 'Y') {
					tag += '<li class="critical">\n'; // 중요 공지 클래스 critical 추가
				} else {
					tag += '<li>\n';
				}
				
				tag += '	<div class="fold_head">\n';
				tag += '		<a href="javascript:void(0)">\n';
				tag += '			<div>\n';
				
				if (item.urgentYn == 'Y') {
					tag += '				<span class="fold_state"><em class="important">중요</em></span>\n';
				} else {
					tag += '				<span class="fold_state">' + (paging.totalCount - ((paging.pageNo - 1) * paging.pageSize) - idx++) + '</span>\n';
				}
				
// 				tag += '				<span class="fold_category">공지</span>\n';
				tag += '				<div class="fold_tit">\n';
				tag += '					<span>' + item.noticeTitle.escapeHtml() + '</span>\n';
				tag += '				</div>\n';
				tag += '				<span class="data">' + item.regDt.toDate("YYYYMMDD").format("YYYY.MM.DD") + '</span>\n';
				tag += '			</div>\n';
				tag += '		</a>\n';
				tag += '	</div>\n';
				tag += '	<div class="fold_cont" style="display: none;">\n';
				tag += '		<div class="fold_detail">\n';
				tag += '			<div>' + item.noticeContent.replaceAll('&lt;','<').replaceAll('&gt;', '>').replaceAll('&quot;', '"') + '</div>\n';
				tag += '		</div>\n';
				tag += '	</div>\n';
				tag += '</li>\n';

				$('#ulNotice').append(tag);
			});
			
			$('#divNotice').removeClass('nodata');
		} else {
// 			let tag = '<li>등록된 공지사항이 없습니다.</li>\n';
// 			$('#ulNotice').html(tag);
			$('#divNotice').addClass('nodata');
		}

		// Create pagination
		gagaPaging.createPagination(result.paging.pageable);
	}
/*]]>*/
</script>

</th:block>

</body>
</html>