API 통계 화면 리뉴얼

WebContent/jsp/onl/kjb/statistics/apiStatsHourMan.jsp

@@ -41,7 +41,7 @@
 		var url_view = '<c:url value="/onl/kjb/statistics/apiStatsHourMan.view"/>';
 		var url_minute_view = '<c:url value="/onl/kjb/statistics/apiStatsMinuteMan.view"/>';
 
-		var totalDonutChart, seq900DonutChart, callChart, respChart;
+		var totalDonutChart, callChart;
 
 		function numberFormatter(cellvalue, options, rowObject) {
 			if (cellvalue == null || cellvalue == '') return '0';
@@ -55,9 +55,7 @@
 
 		function initCharts() {
 			totalDonutChart = echarts.init(document.getElementById('totalDonutChart'));
-			seq900DonutChart = echarts.init(document.getElementById('seq900DonutChart'));
 			callChart = echarts.init(document.getElementById('callChart'));
-			respChart = echarts.init(document.getElementById('respChart'));
 
 			// 총건수 도넛 차트
 			var totalDonutOption = {
@@ -119,64 +117,7 @@
 
 			totalDonutChart.setOption(totalDonutOption);
 
-			// Seq900 도넛 차트
-			var seq900DonutOption = {
-				title: {
-					text: 'Seq900 에러 분포',
-					left: 'center',
-					top: 10,
-					textStyle: { fontSize: 14 }
-				},
-				tooltip: {
-					trigger: 'item',
-					formatter: '{b}: {c} ({d}%)'
-				},
-				legend: {
-					orient: 'horizontal',
-					bottom: 10,
-					data: ['Timeout', '시스템오류', '업무오류']
-				},
-				series: [{
-					name: 'Seq900 에러',
-					type: 'pie',
-					radius: ['40%', '70%'],
-					center: ['50%', '50%'],
-					avoidLabelOverlap: true,
-					label: {
-						show: true,
-						formatter: '{b}: {c}'
-					},
-					emphasis: {
-						label: {
-							show: true,
-							fontSize: 16,
-							fontWeight: 'bold'
-						}
-					},
-					labelLine: {
-						show: true
-					},
-					data: [
-						{ value: 0, name: 'Timeout', itemStyle: { color: '#FAC858' } },
-						{ value: 0, name: '시스템오류', itemStyle: { color: '#EE6666' } },
-						{ value: 0, name: '업무오류', itemStyle: { color: '#FC8452' } }
-					]
-				}],
-				graphic: [{
-					type: 'text',
-					left: 'center',
-					top: 'center',
-					style: {
-						text: '0',
-						textAlign: 'center',
-						fill: '#333',
-						fontSize: 24,
-						fontWeight: 'bold'
-					}
-				}]
-			};
-
-			seq900DonutChart.setOption(seq900DonutOption);
+			
 
 			// 호출량 차트
 			var callOption = {
@@ -199,33 +140,11 @@
 
 			callChart.setOption(callOption);
 
-			// 응답시간 차트
-			var respOption = {
-				title: { text: '응답시간 추이 (ms)', left: 'center', textStyle: { fontSize: 14 } },
-				tooltip: {
-					trigger: 'axis',
-					axisPointer: { type: 'cross', label: { backgroundColor: '#6a7985' } }
-				},
-				legend: { data: ['P95', 'P50', '평균'], bottom: 0 },
-				grid: { left: '3%', right: '4%', bottom: '15%', top: '15%', containLabel: true },
-				xAxis: { type: 'category', boundaryGap: false, data: [] },
-				yAxis: { type: 'value' },
-				series: [
-					{ name: 'P95', type: 'line', smooth: true, itemStyle: { color: '#EE6666' }, lineStyle: { type: 'dashed' }, data: [] },
-					{ name: 'P50', type: 'line', smooth: true, itemStyle: { color: '#5470C6' }, data: [] },
-					{ name: '평균', type: 'line', smooth: true, itemStyle: { color: '#91CC75' }, data: [] }
-				]
-			};
-
-			respChart.setOption(respOption);
 
 			// 드릴다운 이벤트 (시간 클릭 시 분단위 화면으로 이동)
 			callChart.on('click', function(params) {
 				drillDownToMinute(callChart, params.dataIndex);
 			});
-			respChart.on('click', function(params) {
-				drillDownToMinute(respChart, params.dataIndex);
-			});
 		}
 
 		function drillDownToMinute(chart, dataIndex) {
@@ -319,22 +238,6 @@
 				}]
 			});
 
-			// Seq900 도넛 차트 업데이트
-			var seq900Total = seq900Timeout + seq900SystemErr + seq900BizErr;
-			seq900DonutChart.setOption({
-				series: [{
-					data: [
-						{ value: seq900Timeout, name: 'Timeout' },
-						{ value: seq900SystemErr, name: '시스템오류' },
-						{ value: seq900BizErr, name: '업무오류' }
-					]
-				}],
-				graphic: [{
-					style: {
-						text: seq900Total.toLocaleString()
-					}
-				}]
-			});
 
 			// 호출량 차트 업데이트
 			callChart.setOption({
@@ -347,19 +250,9 @@
 				]
 			});
 
-			// 응답시간 차트 업데이트
-			respChart.setOption({
-				xAxis: { data: times.map(function(t) { return t.substring(8, 10) + '시'; }) },
-				series: [
-					{ data: p95RespData },
-					{ data: p50RespData },
-					{ data: avgRespData }
-				]
-			});
 
 			// 드릴다운을 위해 원본 데이터 저장
 			callChart.rawData = data;
-			respChart.rawData = data;
 		}
 
 		function fetchChartData() {
@@ -542,7 +435,6 @@
 				colNames: [
 					'API명',
 					'총건수', '성공', 'Timeout', '시스템오류', '업무오류',
-					'Seq900 Timeout', 'Seq900 시스템오류', 'Seq900 업무오류',
 					'평균응답(ms)', '최소응답(ms)', '최대응답(ms)'
 				],
 				colModel: [
@@ -552,9 +444,6 @@
 					{ name: 'timeoutCnt', align: 'right', width: '80', formatter: numberFormatter, sortable: false },
 					{ name: 'systemErrCnt', align: 'right', width: '80', formatter: numberFormatter, sortable: false },
 					{ name: 'bizErrCnt', align: 'right', width: '80', formatter: numberFormatter, sortable: false },
-					{ name: 'seq900TimeoutCnt', align: 'right', width: '100', formatter: numberFormatter, sortable: false },
-					{ name: 'seq900SystemErrCnt', align: 'right', width: '120', formatter: numberFormatter, sortable: false },
-					{ name: 'seq900BizErrCnt', align: 'right', width: '100', formatter: numberFormatter, sortable: false },
 					{ name: 'avgRespTime', align: 'right', width: '90', formatter: decimalFormatter, sortable: false },
 					{ name: 'minRespTime', align: 'right', width: '90', formatter: decimalFormatter, sortable: false },
 					{ name: 'maxRespTime', align: 'right', width: '90', formatter: decimalFormatter, sortable: false }
@@ -587,8 +476,7 @@
 					'통계시간', 'API명', '인스턴스', '업무구분', '클라이언트ID',
 					'Inbound Adapter', 'Outbound Adapter',
 					'총건수', '성공', 'Timeout', '시스템오류', '업무오류',
-					'Seq900 Timeout', 'Seq900 시스템오류', 'Seq900 업무오류',
-					'평균응답(ms)', '최소응답(ms)', '최대응답(ms)', 'P50(ms)', 'P95(ms)'
+					'평균응답(ms)', '최소응답(ms)', '최대응답(ms)'
 				],
 				colModel: [
 					{ name: 'statTime', align: 'center', width: '120', sortable: false },
@@ -603,14 +491,9 @@
 					{ name: 'timeoutCnt', align: 'right', width: '70', formatter: numberFormatter, sortable: false },
 					{ name: 'systemErrCnt', align: 'right', width: '70', formatter: numberFormatter, sortable: false },
 					{ name: 'bizErrCnt', align: 'right', width: '70', formatter: numberFormatter, sortable: false },
-					{ name: 'seq900TimeoutCnt', align: 'right', width: '70', formatter: numberFormatter, sortable: false },
-					{ name: 'seq900SystemErrCnt', align: 'right', width: '70', formatter: numberFormatter, sortable: false },
-					{ name: 'seq900BizErrCnt', align: 'right', width: '70', formatter: numberFormatter, sortable: false },
 					{ name: 'avgRespTime', align: 'right', width: '80', formatter: decimalFormatter, sortable: false },
 					{ name: 'minRespTime', align: 'right', width: '80', formatter: decimalFormatter, sortable: false },
-					{ name: 'maxRespTime', align: 'right', width: '80', formatter: decimalFormatter, sortable: false },
-					{ name: 'p50RespTime', align: 'right', width: '70', formatter: decimalFormatter, sortable: false },
-					{ name: 'p95RespTime', align: 'right', width: '70', formatter: decimalFormatter, sortable: false }
+					{ name: 'maxRespTime', align: 'right', width: '80', formatter: decimalFormatter, sortable: false }
 				],
 				jsonReader: { repeatitems: false },
 				pager: $('#pager'),
@@ -669,9 +552,7 @@
 			// 윈도우 리사이즈 시 차트 리사이즈
 			$(window).resize(function() {
 				if (totalDonutChart) totalDonutChart.resize();
-				if (seq900DonutChart) seq900DonutChart.resize();
 				if (callChart) callChart.resize();
-				if (respChart) respChart.resize();
 			});
 
 			buttonControl();
@@ -736,12 +617,7 @@
 		<!-- 도넛 차트 (상단 50%씩) -->
 		<div class="chart-container">
 			<div id="totalDonutChart" class="chart"></div>
-			<div id="seq900DonutChart" class="chart"></div>
-		</div>
-		<!-- 호출량 및 응답시간 차트 (하단 50%씩) -->
-		<div class="chart-container">
 			<div id="callChart" class="chart"></div>
-			<div id="respChart" class="chart"></div>
 		</div>
 
 		<!-- 요약 그리드 -->