youna
275 lines
10 KiB
Plaintext
275 lines
10 KiB
Plaintext
<%@ page language="java" contentType="text/html; charset=utf-8"%>
|
|
<%@ page import="java.util.List"%>
|
|
<%@ page import="java.util.ArrayList"%>
|
|
<%@ page import="java.util.HashMap"%>
|
|
<%@ page import="java.util.Map"%>
|
|
<%@ page import="com.eactive.eai.rms.common.context.MonitoringContext"%>
|
|
<%@ page import="com.eactive.eai.rms.common.util.CommonUtil"%>
|
|
<%@ page import="com.eactive.eai.rms.common.datasource.DataSourceType"%>
|
|
<%@ page import="com.eactive.eai.rms.common.datasource.DataSourceTypeManager"%>
|
|
<%@ page import="com.eactive.eai.common.util.SystemUtil"%>
|
|
<%@ page import="javax.persistence.criteria.CriteriaBuilder" %>
|
|
<%@ page import="java.util.Comparator" %>
|
|
<%@ include file="/jsp/common/include/localemessage.jsp" %>
|
|
|
|
<%
|
|
response.setHeader("Pragma", "No-cache");
|
|
response.setHeader("Cache-Control", "no-cache");
|
|
response.setHeader("Expires", "0");
|
|
request.setCharacterEncoding("utf-8");
|
|
MonitoringContext monitoringContext = (MonitoringContext)CommonUtil.getBean(request, "monitoringContext");
|
|
|
|
String NEW_TITLE = (String) session.getAttribute(MonitoringContext.NEW_DASHBOARD_TITLE);
|
|
String fepBatchUrl = monitoringContext.getStringProperty("FEP_BATCH_SERVER", "");
|
|
String eaiBatchUrl = monitoringContext.getStringProperty("EAI_BATCH_SERVER", "");
|
|
|
|
// 온라인 데이터 소스 타입 목록 가져오기
|
|
List<DataSourceType> srvList = DataSourceTypeManager.getOnlineDataSourceTypes();
|
|
|
|
// GW 추가
|
|
if( DataSourceTypeManager.getDataSourceType("FGW") != null ){
|
|
srvList.add(DataSourceTypeManager.getDataSourceType("FGW"));
|
|
}
|
|
|
|
if( DataSourceTypeManager.getDataSourceType("CGW") != null ){
|
|
srvList.add(DataSourceTypeManager.getDataSourceType("CGW"));
|
|
}
|
|
|
|
int srvCnt = srvList.size();
|
|
|
|
// 서버 타입별 목록을 저장할 맵 생성
|
|
Map<String, List<DataSourceType>> serverTypeMap = new HashMap<>();
|
|
|
|
// 서버타입 맵을 application 스코프에 저장 (모든 컴포넌트에서 접근 가능)
|
|
application.setAttribute("serverTypeMap", serverTypeMap);
|
|
|
|
// 서버 타입별로 분류
|
|
for (DataSourceType server : srvList) {
|
|
String serverName = server.getName();
|
|
|
|
// 서버 타입에 해당하는 리스트가 없으면 생성
|
|
if (!serverTypeMap.containsKey(serverName)) {
|
|
serverTypeMap.put(serverName, new ArrayList<DataSourceType>());
|
|
}
|
|
|
|
// 서버를 해당 타입 리스트에 추가
|
|
serverTypeMap.get(serverName).add(server);
|
|
}
|
|
|
|
// BAP(일괄전송) 서버 타입 추가
|
|
DataSourceType bapServer = DataSourceTypeManager.getDataSourceType(DataSourceTypeManager.BAP);
|
|
if (bapServer != null && !serverTypeMap.containsKey(DataSourceTypeManager.BAP)) {
|
|
List<DataSourceType> bapList = new ArrayList<>();
|
|
bapList.add(bapServer);
|
|
serverTypeMap.put(DataSourceTypeManager.BAP, bapList);
|
|
}
|
|
|
|
// 서버 데이터 생성 (JavaScript 용)
|
|
StringBuilder serverDataJS = new StringBuilder();
|
|
serverDataJS.append("var serverDataArray = [");
|
|
|
|
boolean first = true;
|
|
for (Map.Entry<String, List<DataSourceType>> entry : serverTypeMap.entrySet()) {
|
|
String serverType = entry.getKey();
|
|
List<DataSourceType> servers = entry.getValue();
|
|
|
|
// BAT 서버는 제외
|
|
if (DataSourceTypeManager.BAT.equals(serverType)) {
|
|
continue;
|
|
}
|
|
|
|
for (DataSourceType server : servers) {
|
|
if (!first) {
|
|
serverDataJS.append(",");
|
|
}
|
|
|
|
String name = server.getName();
|
|
String text = server.getText();
|
|
|
|
serverDataJS.append("{");
|
|
serverDataJS.append("type:'").append(serverType).append("',");
|
|
serverDataJS.append("name:'").append(name).append("',");
|
|
serverDataJS.append("text:'").append(text).append("'");
|
|
serverDataJS.append("}");
|
|
|
|
first = false;
|
|
}
|
|
}
|
|
|
|
serverDataJS.append("];");
|
|
%>
|
|
<!DOCTYPE html>
|
|
<html lang="ko">
|
|
<head>
|
|
<title>eLink 모니터링 대시보드</title>
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
|
|
|
|
<!-- 폰트 -->
|
|
<jsp:include page="/jsp/common/include/fonts.jsp"/>
|
|
<!-- 아이콘 -->
|
|
<link href="<%=request.getContextPath()%>/addon/bootstrap-icons-1.11.3/bootstrap-icons.min.css" rel="stylesheet" />
|
|
<!-- 커스텀 CSS -->
|
|
<link href="<%=request.getContextPath()%>/dashboard-modern/css/main.css" rel="stylesheet" />
|
|
|
|
<!-- jQuery -->
|
|
<script src="<%=request.getContextPath()%>/js/jquery-3.7.1.min.js"></script>
|
|
<!-- 커스텀 JavaScript -->
|
|
<script src="<%=request.getContextPath()%>/dashboard-modern/js/modern-dashboard-api.js"></script>
|
|
<script src="<%=request.getContextPath()%>/dashboard-modern/js/modern-dashboard.js"></script>
|
|
|
|
<!-- API 초기화 (가장 먼저 실행) -->
|
|
<script>
|
|
// 페이지 로드 전 API 초기화
|
|
ModernDashboardApi.init('<%=request.getContextPath()%>');
|
|
</script>
|
|
|
|
<style>
|
|
/* 1번 줄 (4:3:1 비율) - 서버 상태, 배치 처리 상태, 피크 처리 성능 */
|
|
.first-row {
|
|
grid-template-columns: 4fr 3fr 1fr;
|
|
}
|
|
|
|
/* 2번 줄 (1:1 비율) - 거래 처리 집계, 실시간 트랜잭션 현황 */
|
|
.second-row {
|
|
grid-template-columns: 1fr 1fr;
|
|
}
|
|
|
|
/* 3번 줄 (7:3 비율) - 어댑터 상태, 장애통보(SMS) */
|
|
.third-row {
|
|
grid-template-columns: 6fr 4fr;
|
|
}
|
|
|
|
/* 컴팩트한 대시보드를 위한 추가 스타일 */
|
|
.container {
|
|
padding-top: 0.5rem;
|
|
padding-bottom: 0.5rem;
|
|
}
|
|
|
|
/* 카드 내부 여백 줄임 */
|
|
.card {
|
|
padding: 0.75rem;
|
|
}
|
|
|
|
/* 테이블 행 높이 줄임 */
|
|
table tr td, table tr th {
|
|
padding-top: 0.4rem;
|
|
padding-bottom: 0.4rem;
|
|
}
|
|
|
|
/* 반응형 디자인 */
|
|
@media (max-width: 1200px) {
|
|
.first-row {
|
|
grid-template-columns: 1fr;
|
|
}
|
|
.second-row {
|
|
grid-template-columns: 1fr;
|
|
}
|
|
.third-row {
|
|
grid-template-columns: 1fr;
|
|
}
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="container">
|
|
<!-- 헤더 영역 -->
|
|
<jsp:include page="components/dashboard-header.jsp" />
|
|
|
|
<!-- 1번 줄 (4:3:1 비율) - 서버 상태, 배치 처리 상태, 피크 처리 성능 -->
|
|
<div class="dashboard-row first-row">
|
|
<!-- 서버 상태 섹션 (4/8 비율) -->
|
|
<div class="server-container">
|
|
<jsp:include page="components/dashboard-servers.jsp">
|
|
<jsp:param name="serverTypeMap" value="<%= serverTypeMap %>" />
|
|
</jsp:include>
|
|
</div>
|
|
|
|
<!-- 배치 처리 상태 섹션 (3/8 비율) -->
|
|
<div class="batch-container">
|
|
<jsp:include page="components/dashboard-batch.jsp" />
|
|
</div>
|
|
|
|
<!-- 피크 처리 성능 섹션 (1/8 비율) -->
|
|
<div class="peak-container">
|
|
<jsp:include page="components/dashboard-peak.jsp" />
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 2번 줄 (1:1 비율) - 거래 처리 집계, 실시간 트랜잭션 현황 -->
|
|
<div class="dashboard-row second-row">
|
|
<!-- 거래 처리 집계 섹션 (좌측) -->
|
|
<div class="transaction-container" style="overflow-y:auto;">
|
|
<jsp:include page="components/dashboard-transactions.jsp">
|
|
<jsp:param name="serverTypeMap" value="<%= serverTypeMap %>" />
|
|
</jsp:include>
|
|
</div>
|
|
|
|
<!-- 실시간 트랜잭션 현황 섹션 (우측) -->
|
|
<div class="transaction-overview-container">
|
|
<jsp:include page="components/dashboard-tran-chart.jsp" />
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 3번 줄 (8:2 비율) - 어댑터 상태, 장애통보(SMS) -->
|
|
<div class="dashboard-row third-row">
|
|
<!-- 어댑터 섹션 (8/10 비율) -->
|
|
<div class="adapters-container">
|
|
<jsp:include page="components/dashboard-adapter.jsp">
|
|
<jsp:param name="serverTypeMap" value="<%= serverTypeMap %>" />
|
|
</jsp:include>
|
|
</div>
|
|
|
|
<!-- 장애통보(SMS) 섹션 (2/10 비율) -->
|
|
<div class="sms-container">
|
|
<jsp:include page="components/dashboard-sms.jsp" />
|
|
</div>
|
|
</div>
|
|
<!-- 인터페이스 로그 조회 모달 -->
|
|
<jsp:include page="components/dashboard-interface-detail.jsp" />
|
|
<!-- 푸터 영역 -->
|
|
<jsp:include page="components/dashboard-footer.jsp" />
|
|
</div>
|
|
|
|
<script type="text/javascript">
|
|
// 서버 데이터 초기화
|
|
<%= serverDataJS.toString() %>
|
|
|
|
// 자동 새로고침 타이머 변수 (window 객체에 할당)
|
|
window.refreshTimer = null;
|
|
window.refreshInterval = 5; // 기본값 10초
|
|
|
|
// 숫자 포맷 유틸리티 함수
|
|
function formatNumber(num) {
|
|
return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
|
|
}
|
|
|
|
// 서버 데이터 설정 및 대시보드 초기화
|
|
$(document).ready(function() {
|
|
// 대시보드 초기화
|
|
initDashboard('<%=request.getContextPath()%>');
|
|
|
|
// 현재 시간 표시 및 업데이트
|
|
updateCurrentTime();
|
|
setInterval(updateCurrentTime, 1000);
|
|
|
|
// 초기 데이터 로드
|
|
refreshDashboardData();
|
|
|
|
// 로컬 스토리지에서 저장된 새로고침 간격 불러오기
|
|
if (localStorage.getItem('dashboardRefreshInterval')) {
|
|
window.refreshInterval = parseInt(localStorage.getItem('dashboardRefreshInterval'));
|
|
|
|
// 저장된 간격에 해당하는 버튼 활성화
|
|
$('.refresh-btn').removeClass('active');
|
|
$('.refresh-btn[data-interval="' + window.refreshInterval + '"]').addClass('active');
|
|
}
|
|
|
|
// modern-dashboard.js의 함수 호출
|
|
window.startRefreshTimer();
|
|
window.updateRefreshStatus();
|
|
});
|
|
</script>
|
|
</body>
|
|
</html> |