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