trafficmonitor init...1

This commit is contained in:
choi.jh 2025-11-13 15:16:03 +09:00
parent 8e8c3c2535
commit 3a79048491

View File

@ -46,20 +46,24 @@
<div id="app" class="container-fluid" style="max-width: 1200px;"> <div id="app" class="container-fluid" style="max-width: 1200px;">
<header class="text-center mb-5"> <header class="text-center mb-5">
<h1 class="display-5 fw-bold text-dark mb-2"><?= $title ?? '트래픽 데이터 시각화 대시보드' ?></h1> <h1 class="display-5 fw-bold text-dark mb-2"><?= $title ?? '트래픽 데이터 시각화 대시보드' ?></h1>
<!-- 인트로 문구 제거됨 -->
</header> </header>
<!-- Configuration Card --> <!-- Configuration Card -->
<div class="card shadow-lg mb-5 dashboard-card"> <div class="card shadow-lg mb-5 dashboard-card">
<div class="card-body p-4 p-md-5"> <div class="card-body p-4 p-md-5">
<!-- PHP 변수 사용: <?= $viewDatas['entity']->getCustomTitle() ?> -->
<h2 class="h5 card-title text-dark mb-4"><?= $viewDatas['entity']->getCustomTitle() ?>데이터 조회 설정</h2> <h2 class="h5 card-title text-dark mb-4"><?= $viewDatas['entity']->getCustomTitle() ?>데이터 조회 설정</h2>
<div class="row g-3 align-items-end"> <div class="row g-3 align-items-end">
<!-- 1. Start Date Picker --> <!-- 1. Start Date Picker -->
<div class="col-12 col-md-3"> <div class="col-12 col-md-3">
<label for="startDate" class="form-label text-muted">시작 날짜</label> <label for="startDate" class="form-label text-muted">시작 날짜</label>
<!-- 기본값을 오늘 날짜로 설정 -->
<input type="date" id="startDate" class="form-control" value="<?= date('Y-m-d') ?>"> <input type="date" id="startDate" class="form-control" value="<?= date('Y-m-d') ?>">
</div> </div>
<!-- 2. End Date Picker --> <!-- 2. End Date Picker -->
<div class="col-12 col-md-3"> <div class="col-12 col-md-3">
<label for="endDate" class="form-label text-muted">종료 날짜</label> <label for="endDate" class="form-label text-muted">종료 날짜</label>
<!-- 기본값을 오늘 날짜로 설정 -->
<input type="date" id="endDate" class="form-control" value="<?= date('Y-m-d') ?>"> <input type="date" id="endDate" class="form-control" value="<?= date('Y-m-d') ?>">
</div> </div>
</div> </div>
@ -101,6 +105,7 @@
let trafficChart = null; let trafficChart = null;
document.addEventListener('DOMContentLoaded', () => { document.addEventListener('DOMContentLoaded', () => {
// DOM 로드 후 바로 차트를 불러옵니다.
fetchDataAndDrawChart(); fetchDataAndDrawChart();
}); });
@ -109,7 +114,8 @@
// ----------------------------------------------------------- // -----------------------------------------------------------
async function fetchAggregatedData(startDate, endDate) { async function fetchAggregatedData(startDate, endDate) {
const baseEndpoint = '<?= base_url("/admin/traffic/data/{$viewDatas['entity']->getPK()}") ?>'; // CI4 라우트로 지정된 기본 엔드포인트 // PHP 변수를 사용하여 엔드포인트 URL을 구성합니다.
const baseEndpoint = '<?= base_url("/admin/traffic/data/{$viewDatas['entity']->getPK()}") ?>';
// GET 요청을 위해 쿼리 파라미터를 생성합니다. // GET 요청을 위해 쿼리 파라미터를 생성합니다.
const params = new URLSearchParams({ const params = new URLSearchParams({
@ -117,7 +123,7 @@
endDate: endDate endDate: endDate
}); });
// 최종 엔드포인트 URL: /traffic/data?startDate=...&endDate=... // 최종 엔드포인트 URL: /admin/traffic/data/{PK}?startDate=...&endDate=...
const endpoint = `${baseEndpoint}?${params.toString()}`; const endpoint = `${baseEndpoint}?${params.toString()}`;
const maxRetries = 3; const maxRetries = 3;
@ -126,8 +132,7 @@
for (let i = 0; i < maxRetries; i++) { for (let i = 0; i < maxRetries; i++) {
try { try {
const response = await fetch(endpoint, { const response = await fetch(endpoint, {
method: 'GET', // GET 방식으로 변경 method: 'GET', // GET 방식으로 유지
// GET 요청이므로 body는 포함하지 않습니다.
}); });
const result = await response.json(); const result = await response.json();