GNU/_PAGE/monitoring/upbit/demon_platform.php



<title>GNU/_PAGE/monitoring/upbit/demon_platform.php</title>


<div class="header">GNU/_PAGE/monitoring/upbit/demon_platform.php</div>
<pre>&lt;?php
// ==================================================================
// 설정 및 DB 연결
// ==================================================================
error_reporting(E_ALL);
ini_set(&#039;display_errors&#039;, 1);

try {
    require &#039;/home/www/DB/db_upbit.php&#039;;
    $pdo = $db_upbit;
} catch (Exception $e) {
    die(&quot;데이터베이스 연결 실패: &quot; . $e-&gt;getMessage());
}
/** @var PDO $pdo */

$pdo_gnu = null;
try {
    require &#039;/home/www/DB/db_gnu.php&#039;;
    if (isset($db_gnu) &amp;&amp; $db_gnu instanceof PDO) {
        $pdo_gnu = $db_gnu;
    } elseif (isset($pdo_gnu) &amp;&amp; $pdo_gnu instanceof PDO) {
        $pdo_gnu = $pdo_gnu;
    } elseif (isset($pdo) &amp;&amp; $pdo instanceof PDO) {
        $pdo_gnu = $pdo;
    }
} catch (Exception $e) {
    $pdo_gnu = null;
}
/** @var PDO|null $pdo_gnu */

// ==================================================================
// 헬퍼 함수 (기존 코드 유지)
// ==================================================================
function getTimeDiff($datetime) {
    if (!$datetime) return &#039;N/A&#039;;
    try {
        $now = new DateTime();
        $ago = new DateTime($datetime);
        $diff = $now-&gt;diff($ago);
        if ($diff-&gt;d &gt; 0) return $diff-&gt;d . &#039;일 전&#039;;
        if ($diff-&gt;h &gt; 0) return $diff-&gt;h . &#039;시간 전&#039;;
        if ($diff-&gt;i &gt; 0) return $diff-&gt;i . &#039;분 전&#039;;
        return $diff-&gt;s . &#039;초 전&#039;;
    } catch (Exception $e) { return &#039;형식 오류&#039;; }
}

function isHeartbeatDead($datetime) {
    if (!$datetime) return true;
    $now = new DateTime();
    $ago = new DateTime($datetime);
    $diff = $now-&gt;getTimestamp() - $ago-&gt;getTimestamp();
    return $diff &gt; 300; 
}

function getBybitBestSymbols($pdo_gnu) {
    static $symbols = null;

    if ($symbols !== null) {
        return $symbols;
    }

    $symbols = [];
    if (!($pdo_gnu instanceof PDO)) {
        return $symbols;
    }

    try {
        $sql = &quot;SELECT wr_subject FROM g5_write_daemon_best_bybit WHERE (x2_run = 1 OR x2_run = &#039;1&#039;)&quot;;
        $stmt = $pdo_gnu-&gt;query($sql);
        $rows = $stmt-&gt;fetchAll(PDO::FETCH_COLUMN);

        foreach ($rows as $symbol) {
            $symbol = strtoupper(trim((string)$symbol));
            if ($symbol === &#039;&#039;) {
                continue;
            }
            if (strpos($symbol, &#039;USDT&#039;) === false &amp;&amp; strpos($symbol, &#039;-&#039;) === false) {
                $symbol .= &#039;USDT&#039;;
            }
            if (!in_array($symbol, $symbols, true)) {
                $symbols[] = $symbol;
            }
        }
    } catch (Exception $e) {
        return [];
    }

    return $symbols;
}

function getDaemonMetrics($pdo, $pdo_gnu, $daemon_id) {
    $default = [
        &#039;total_count_raw&#039; =&gt; 0,
        &#039;total_count_str&#039; =&gt; &#039;-&#039;,
        &#039;last_trade&#039; =&gt; &#039;데이터 없음&#039;,
        &#039;trade_diff&#039; =&gt; &#039;&#039;
    ];

    $config_map = [
        &#039;daemon_upbit_Ticker&#039; =&gt; [
            &#039;table&#039; =&gt; &#039;daemon_upbit_Ticker&#039;,
            &#039;date_column&#039; =&gt; &#039;collected_at&#039;,
            &#039;where_sql&#039; =&gt; &quot;WHERE market = ?&quot;,
            &#039;params&#039; =&gt; [&#039;KRW-BCH&#039;]
        ],
        &#039;daemon_upbit_Best&#039; =&gt; [
            &#039;table&#039; =&gt; &#039;daemon_upbit_Ticker&#039;,
            &#039;date_column&#039; =&gt; &#039;collected_at&#039;,
            &#039;where_sql&#039; =&gt; &quot;WHERE market = ?&quot;,
            &#039;params&#039; =&gt; [&#039;KRW-BTC&#039;]
        ],
        &#039;daemon_upbit_Ticker_user&#039; =&gt; [
            &#039;table&#039; =&gt; &#039;daemon_upbit_Ticker_user&#039;,
            &#039;date_column&#039; =&gt; &#039;collected_at&#039;,
            &#039;where_sql&#039; =&gt; &#039;&#039;,
            &#039;params&#039; =&gt; []
        ],
        &#039;daemon_bybit_Ticker&#039; =&gt; [
            &#039;table&#039; =&gt; &#039;daemon_bybit_Ticker&#039;,
            &#039;date_column&#039; =&gt; &#039;updated_at&#039;,
            &#039;where_sql&#039; =&gt; &#039;&#039;,
            &#039;params&#039; =&gt; []
        ]
    ];

    if ($daemon_id === &#039;daemon_bybit_Best&#039;) {
        $symbols = getBybitBestSymbols($pdo_gnu);
        if (!$symbols) {
            return $default;
        }

        $placeholders = implode(&#039;, &#039;, array_fill(0, count($symbols), &#039;?&#039;));
        $config = [
            &#039;table&#039; =&gt; &#039;daemon_bybit_Ticker&#039;,
            &#039;date_column&#039; =&gt; &#039;updated_at&#039;,
            &#039;where_sql&#039; =&gt; &quot;WHERE symbol IN ($placeholders)&quot;,
            &#039;params&#039; =&gt; $symbols
        ];
    } else {
        if (!isset($config_map[$daemon_id])) {
            return $default;
        }
        $config = $config_map[$daemon_id];
    }

    try {
        $sql = &quot;SELECT COUNT(*) AS total_cnt, MAX({$config[&#039;date_column&#039;]}) AS last_trade FROM {$config[&#039;table&#039;]} {$config[&#039;where_sql&#039;]}&quot;;
        $stmt = $pdo-&gt;prepare($sql);
        $stmt-&gt;execute($config[&#039;params&#039;]);
        $row = $stmt-&gt;fetch(PDO::FETCH_ASSOC);

        if (!$row) {
            return $default;
        }

        $total_count_raw = (int)($row[&#039;total_cnt&#039;] ?? 0);
        $last_trade = $row[&#039;last_trade&#039;] ?: &#039;데이터 없음&#039;;

        return [
            &#039;total_count_raw&#039; =&gt; $total_count_raw,
            &#039;total_count_str&#039; =&gt; $total_count_raw &gt; 0 ? number_format($total_count_raw) : &#039;0&#039;,
            &#039;last_trade&#039; =&gt; $last_trade,
            &#039;trade_diff&#039; =&gt; $row[&#039;last_trade&#039;] ? getTimeDiff($row[&#039;last_trade&#039;]) : &#039;&#039;
        ];
    } catch (Exception $e) {
        return $default;
    }
}

// ==================================================================
// 실시간 데이터를 위한 API 모드 (기존 로직 유지)
// ==================================================================
if (isset($_GET[&#039;api&#039;])) {
    header(&#039;Content-Type: application/json&#039;);
    $target_ids = [&#039;daemon_upbit_Ticker&#039;, &#039;daemon_upbit_Ticker_user&#039;, &#039;daemon_upbit_Best&#039;, &#039;daemon_bybit_Ticker&#039;, &#039;daemon_bybit_Best&#039;];
    $in_clause = &quot;&#039;&quot; . implode(&quot;&#039;,&#039;&quot;, $target_ids) . &quot;&#039;&quot;;
    $sql = &quot;SELECT * FROM daemon_record WHERE d_id IN ($in_clause) ORDER BY FIELD(d_id, $in_clause)&quot;;
    $stmt = $pdo-&gt;query($sql);
    $daemons = $stmt-&gt;fetchAll(PDO::FETCH_ASSOC);

    $result = [];
    foreach ($daemons as $daemon) {
        $is_dead = isHeartbeatDead($daemon[&#039;d_heartbeat&#039;]);
        $metrics = getDaemonMetrics($pdo, $pdo_gnu, $daemon[&#039;d_id&#039;]);

        $result[] = [
            &#039;d_id&#039; =&gt; $daemon[&#039;d_id&#039;],
            &#039;d_status&#039; =&gt; $daemon[&#039;d_status&#039;],
            &#039;is_dead&#039; =&gt; $is_dead,
            &#039;total_count&#039; =&gt; $metrics[&#039;total_count_str&#039;],
            &#039;total_count_raw&#039; =&gt; $metrics[&#039;total_count_raw&#039;],
            &#039;last_trade&#039; =&gt; $metrics[&#039;last_trade&#039;],
            &#039;trade_diff&#039; =&gt; $metrics[&#039;trade_diff&#039;],
            &#039;heartbeat_diff&#039; =&gt; getTimeDiff($daemon[&#039;d_heartbeat&#039;]),
            &#039;d_pid&#039; =&gt; $daemon[&#039;d_pid&#039;] ?: &#039;-&#039;,
            &#039;d_kill_flag&#039; =&gt; (bool)$daemon[&#039;d_kill_flag&#039;]
        ];
    }
    echo json_encode($result);
    exit;
}

// 초기 데이터 로드
$target_ids = [&#039;daemon_upbit_Ticker&#039;, &#039;daemon_upbit_Ticker_user&#039;, &#039;daemon_upbit_Best&#039;, &#039;daemon_bybit_Ticker&#039;, &#039;daemon_bybit_Best&#039;];
$in_clause = &quot;&#039;&quot; . implode(&quot;&#039;,&#039;&quot;, $target_ids) . &quot;&#039;&quot;;
$sql = &quot;SELECT * FROM daemon_record WHERE d_id IN ($in_clause) ORDER BY FIELD(d_id, $in_clause)&quot;;
$stmt = $pdo-&gt;query($sql);
$daemons = $stmt-&gt;fetchAll(PDO::FETCH_ASSOC);

// 헤더 부분 포함
require_once &#039;/home/www/GNU/_PAGE/head.php&#039;;
?&gt;
&lt;!DOCTYPE html&gt;
&lt;html lang=&quot;ko&quot;&gt;
&lt;head&gt;
    &lt;meta charset=&quot;UTF-8&quot;&gt;
    &lt;title&gt;핵심 데몬 가동 현황&lt;/title&gt;
    &lt;!-- 아이콘과 폰트만 외부 호출 허용 --&gt;
    &lt;link rel=&quot;stylesheet&quot; href=&quot;https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css&quot;&gt;
    &lt;style&gt;
        @import url(&#039;https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css&#039;);
        
        /* CSS 변수 설정 */
        :root {
            --bg-body: #f1f5f9;
            --bg-card: #ffffff;
            --bg-metric: #f8fafc;
            --text-main: #1e293b;
            --text-sub: #64748b;
            --indigo: #6366f1;
            --border-card: #e2e8f0;
        }

        .dark {
            --bg-body: #0a0f1d;
            --bg-card: #161b2c;
            --bg-metric: rgba(13, 17, 29, 0.5);
            --text-main: #f1f5f9;
            --text-sub: #94a3b8;
            --indigo: #818cf8;
            --border-card: rgba(30, 41, 59, 0.5);
        }

        body { 
            font-family: &#039;Pretendard&#039;, sans-serif; 
            font-style: normal !important; 
            background-color: var(--bg-body);
            margin: 0;
            padding: 0px 0px 40px 0px; /* px-[60px] 요구사항 반영 */
            overflow-x: hidden;
            transition: background-color 0.3s;
        }

        * { font-style: normal !important; box-sizing: border-box; }

        .max-w-full { width: 100vw; padding: 30px 50px 0px 50px; }
        .page-enter { animation: enter 0.6s cubic-bezier(0.16, 1, 0.3, 1); }
        @keyframes enter { 0% { opacity: 0; transform: translateY(20px); } 100% { opacity: 1; transform: translateY(0); } }

        /* Header Styles */
        header { margin-bottom: 20px; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-end; gap: 1.5rem; }
        @media (min-width: 768px) { header { flex-direction: row; } }
        
        header h1 { font-size: 2.25rem; font-weight: 900; color: var(--text-main); margin: 0; letter-spacing: -0.05em; }
        header h1 span { color: #6366f1; }
        .header-desc { font-size: 1.125rem; color: var(--text-sub); margin-top: 0.75rem; font-weight: 500; display: flex; align-items: center; }
        #update-timer { margin-left: 0.75rem; font-size: 0.875rem; background: #e2e8f0; color: #64748b; padding: 0.25rem 0.75rem; border-radius: 0.375rem; font-family: monospace; }
        .dark #update-timer { background: #1e293b; color: #94a3b8; }

        /* Grid System */
        .grid { display: grid; grid-template-columns: 1fr; gap: 2.5rem; }
        @media (min-width: 1024px) { .grid { grid-template-columns: repeat(3, 1fr); } }

        /* Card Styles */
        .daemon-card { 
            position: relative; 
            display: flex; 
            flex-direction: column; 
            height: 100%; 
            background-color: var(--bg-card); 
            border-radius: 1.5rem; 
            box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1); 
            transition: all 0.3s; 
            border: 1px solid var(--border-card);
            overflow: hidden;
        }
        .daemon-card:hover { transform: translateY(-5px); box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25); }

        .kill-flag-overlay { 
            position: absolute; top: 0; right: 0; background: #dc2626; color: white; 
            font-size: 0.75rem; font-weight: 700; padding: 0.5rem 1rem; 
            border-bottom-left-radius: 1rem; z-index: 10; 
        }

        .card-body { padding: 2.5rem; flex-grow: 1; }
        .card-head-row { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 2rem; }
        .card-info-group { display: flex; align-items: center; gap: 1.5rem; }

        .icon-box { 
            width: 4rem; height: 4rem; border-radius: 1rem; 
            display: flex; align-items: center; justify-content: center; 
            font-size: 1.5rem; background: #1e293b; color: #94a3b8; border: 1px solid #334155;
        }

        .card-title { font-size: 1.5rem; font-weight: 800; color: var(--text-main); margin: 0; line-height: 1.2; }
        .card-id { font-size: 0.875rem; color: var(--text-sub); font-family: monospace; margin-top: 0.25rem; }

        .status-badge { padding: 0.5rem 1.25rem; border-radius: 0.75rem; font-size: 0.875rem; font-weight: 900; }

        /* Metric Box */
        .metric-box { background-color: var(--bg-metric); border-radius: 1rem; padding: 1.5rem; border: 1px solid var(--border-card); margin-bottom: 1.5rem; }
        .metric-label-row { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.5rem; }
        .metric-label { font-size: 0.875rem; font-weight: 700; color: var(--text-sub); text-transform: uppercase; }
        .mode-badge { font-size: 0.75rem; font-weight: 900; padding: 0.25rem 0.75rem; border-radius: 0.5rem; border: 1px solid transparent; }

        .total-cnt { font-size: 2.25rem; font-weight: 900; color: var(--indigo); letter-spacing: -0.05em; }
        .cnt-unit { font-size: 1.125rem; font-weight: 700; color: var(--text-sub); margin-left: 0.5rem; }

        /* Details */
        .details-container { display: flex; flex-direction: column; gap: 1.5rem; }
        .detail-label-row { display: flex; justify-content: space-between; align-items: end; margin-bottom: 0.5rem; }
        .detail-label { font-size: 0.75rem; font-weight: 700; color: var(--text-sub); text-transform: uppercase; }
        .detail-diff { font-size: 0.75rem; font-weight: 900; color: var(--indigo); }
        .detail-value-box { font-family: monospace; font-size: 1rem; font-weight: 600; color: var(--text-main); background: var(--bg-metric); padding: 0.75rem 1rem; border-radius: 0.75rem; border: 1px solid var(--border-card); }

        .meta-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; margin-top: 0.5rem; }
        .meta-label { font-size: 0.75rem; font-weight: 700; color: var(--text-sub); text-transform: uppercase; display: block; margin-bottom: 0.25rem; }
        .meta-value { font-family: monospace; font-size: 0.875rem; font-weight: 700; color: var(--indigo); }
        .meta-value.gray { color: var(--text-sub); }

        /* Card Footer */
        .card-footer { background-color: var(--bg-metric); padding: 1.25rem 2.5rem; border-top: 1px solid var(--border-card); display: flex; justify-content: space-between; align-items: center; }
        .hb-row { display: flex; align-items: center; gap: 0.75rem; color: var(--text-sub); font-weight: 700; font-size: 0.875rem; }
        .hb-value { color: #22d3ee; font-weight: 900; font-size: 1.25rem; letter-spacing: -0.025em; }
        .start-time { font-family: monospace; font-size: 0.75rem; color: var(--text-sub); font-weight: 700; opacity: 0.7; }

        /* Buttons */
        .btn-container { margin-top: 25px; display: flex; flex-direction: column; align-items: center; font-size: 18px; }
        .btn-primary { 
            background-color: #4f46e5; color: white; font-weight: 600; padding: 0.75rem 2rem; 
            border-radius: 9999px; text-decoration: none; box-shadow: 0 10px 15px -3px rgba(79, 70, 229, 0.4);
            transition: all 0.2s; display: flex; align-items: center; gap: 0.5rem;
        }
        .btn-primary:hover { background-color: #4338ca; transform: scale(1.05); }

        /* Utility */
        .blink { animation: blinker 1.5s linear infinite; }
        @keyframes blinker { 50% { opacity: 0; } }
        .update-flash { animation: flash 1s ease-out; }
        @keyframes flash { 0% { background-color: rgba(99, 102, 241, 0.2); } 100% { background-color: transparent; } }

    &lt;/style&gt;
&lt;/head&gt;
&lt;body class=&quot;bg-slate-100&quot;&gt;

    &lt;div class=&quot;max-w-full page-enter&quot;&gt;
        &lt;!-- Header --&gt;
        &lt;header&gt;
            &lt;div&gt;
                &lt;h1&gt;&lt;span&gt;핵심&lt;/span&gt; 데몬 가동 현황&lt;/h1&gt;
                &lt;div class=&quot;header-desc&quot;&gt;
                    실시간 데이터 수집 프로세스 모니터링 시스템
                    &lt;span id=&quot;update-timer&quot;&gt;상태 확인 중...&lt;/span&gt;
                &lt;/div&gt;
            &lt;/div&gt;
        &lt;/header&gt;

        &lt;!-- Cards Grid --&gt;
        &lt;div class=&quot;grid&quot;&gt;
            &lt;?php foreach ($daemons as $daemon): ?&gt;
                &lt;?php $target_id = $daemon[&#039;d_id&#039;]; ?&gt;
                &lt;div id=&quot;card-&lt;?php echo $target_id; ?&gt;&quot; class=&quot;daemon-card&quot;&gt;
                    
                    &lt;div id=&quot;kill-flag-&lt;?php echo $target_id; ?&gt;&quot; class=&quot;kill-flag-overlay blink&quot; style=&quot;display:none;&quot;&gt;
                        종료 프로세스 감지
                    &lt;/div&gt;

                    &lt;div class=&quot;card-body&quot;&gt;
                        &lt;div class=&quot;card-head-row&quot;&gt;
                            &lt;div class=&quot;card-info-group&quot;&gt;
                                &lt;div id=&quot;icon-box-&lt;?php echo $target_id; ?&gt;&quot; class=&quot;icon-box&quot;&gt;
                                    &lt;i class=&quot;fa-solid fa-circle-notch fa-spin&quot;&gt;&lt;/i&gt;
                                &lt;/div&gt;
                                &lt;div&gt;
                                    &lt;h3 class=&quot;card-title&quot;&gt;&lt;?php echo explode(&#039;_&#039;, $target_id, 3)[2]; ?&gt;&lt;/h3&gt;
                                    &lt;p class=&quot;card-id&quot;&gt;&lt;?php echo htmlspecialchars($target_id); ?&gt;&lt;/p&gt;
                                &lt;/div&gt;
                            &lt;/div&gt;
                            &lt;span id=&quot;status-badge-&lt;?php echo $target_id; ?&gt;&quot; class=&quot;status-badge&quot; style=&quot;background:#f1f5f9; color:#64748b;&quot;&gt;
                                ...
                            &lt;/span&gt;
                        &lt;/div&gt;

                        &lt;div class=&quot;details-container&quot;&gt;
                            &lt;div id=&quot;metric-box-&lt;?php echo $target_id; ?&gt;&quot; class=&quot;metric-box&quot;&gt;
                                &lt;div class=&quot;metric-label-row&quot;&gt;
                                    &lt;span class=&quot;metric-label&quot;&gt;누적 수집 데이터&lt;/span&gt;
                                    &lt;span id=&quot;mode-badge-&lt;?php echo $target_id; ?&gt;&quot; class=&quot;mode-badge&quot;&gt;분석 중&lt;/span&gt;
                                &lt;/div&gt;
                                &lt;div&gt;
                                    &lt;span id=&quot;total-cnt-&lt;?php echo $target_id; ?&gt;&quot; class=&quot;total-cnt&quot;&gt;...&lt;/span&gt;
                                    &lt;span class=&quot;cnt-unit&quot;&gt;건&lt;/span&gt;
                                &lt;/div&gt;
                            &lt;/div&gt;

                            &lt;div&gt;
                                &lt;div class=&quot;detail-label-row&quot;&gt;
                                    &lt;span class=&quot;detail-label&quot;&gt;최종 동기화 시점&lt;/span&gt;
                                    &lt;span id=&quot;diff-&lt;?php echo $target_id; ?&gt;&quot; class=&quot;detail-diff&quot;&gt;...&lt;/span&gt;
                                &lt;/div&gt;
                                &lt;div id=&quot;last-trade-&lt;?php echo $target_id; ?&gt;&quot; class=&quot;detail-value-box&quot;&gt;...&lt;/div&gt;
                            &lt;/div&gt;

                            &lt;div class=&quot;meta-grid&quot;&gt;
                                &lt;div&gt;
                                    &lt;span class=&quot;meta-label&quot;&gt;프로세스 ID&lt;/span&gt;
                                    &lt;span id=&quot;pid-&lt;?php echo $target_id; ?&gt;&quot; class=&quot;meta-value&quot;&gt;...&lt;/span&gt;
                                &lt;/div&gt;
                                &lt;div&gt;
                                    &lt;span class=&quot;meta-label&quot;&gt;서버 위치&lt;/span&gt;
                                    &lt;span class=&quot;meta-value gray&quot;&gt;&lt;?php echo $daemon[&#039;d_ip&#039;] ?? &#039;-&#039;; ?&gt;&lt;/span&gt;
                                &lt;/div&gt;
                            &lt;/div&gt;
                        &lt;/div&gt;
                    &lt;/div&gt;

                    &lt;div class=&quot;card-footer&quot;&gt;
                        &lt;div class=&quot;hb-row&quot;&gt;
                            &lt;i class=&quot;fa-regular fa-clock&quot;&gt;&lt;/i&gt;
                            &lt;span&gt;생존 신호:&lt;/span&gt;
                            &lt;span id=&quot;hb-&lt;?php echo $target_id; ?&gt;&quot; class=&quot;hb-value&quot;&gt;...&lt;/span&gt;
                        &lt;/div&gt;
                        &lt;div class=&quot;start-time&quot;&gt;
                            STARTED: &lt;?php echo substr($daemon[&#039;d_start_time&#039;], 5, 11); ?&gt;
                        &lt;/div&gt;
                    &lt;/div&gt;
                &lt;/div&gt;
            &lt;?php endforeach; ?&gt;
        &lt;/div&gt;

        &lt;div class=&quot;btn-container&quot;&gt;
            &lt;a href=&quot;/home/www/GNU/_PAGE/monitoring/upbit/daemon_market/daemon.php&quot; class=&quot;btn-primary&quot;&gt;
                &lt;i class=&quot;fa-solid fa-list-check&quot;&gt;&lt;/i&gt;
                데몬 리스트 전체보기
            &lt;/a&gt;
        &lt;/div&gt;
    &lt;/div&gt;

    &lt;script&gt;
        // 실시간 데이터를 업데이트하는 함수 (기존 로직 100% 유지)
        async function updateData() {
            try {
                const response = await fetch(&#039;?api=1&#039;);
                const data = await response.json();
                
                data.forEach(d =&gt; {
                    const id = d.d_id;
                    const cntElem = document.getElementById(`total-cnt-${id}`);
                    const badge = document.getElementById(`status-badge-${id}`);
                    const iconBox = document.getElementById(`icon-box-${id}`);
                    const killOverlay = document.getElementById(`kill-flag-${id}`);
                    const modeBadge = document.getElementById(`mode-badge-${id}`);
                    
                    if(cntElem.innerText !== d.total_count) {
                        cntElem.innerText = d.total_count;
                        document.getElementById(`metric-box-${id}`).classList.add(&#039;update-flash&#039;);
                        setTimeout(() =&gt; document.getElementById(`metric-box-${id}`).classList.remove(&#039;update-flash&#039;), 1000);
                    }
                    
                    if (d.total_count_raw === 1) {
                        modeBadge.innerText = &quot;데이터 덮어쓰기&quot;;
                        modeBadge.style.background = &quot;rgba(249, 115, 22, 0.1)&quot;;
                        modeBadge.style.color = &quot;#f97316&quot;;
                        modeBadge.style.borderColor = &quot;rgba(249, 115, 22, 0.2)&quot;;
                    } else {
                        modeBadge.innerText = &quot;데이터 쌓아쓰기&quot;;
                        modeBadge.style.background = &quot;rgba(59, 130, 246, 0.1)&quot;;
                        modeBadge.style.color = &quot;#3b82f6&quot;;
                        modeBadge.style.borderColor = &quot;rgba(59, 130, 246, 0.2)&quot;;
                    }

                    document.getElementById(`last-trade-${id}`).innerText = d.last_trade;
                    document.getElementById(`diff-${id}`).innerText = d.trade_diff;
                    document.getElementById(`pid-${id}`).innerText = d.d_pid;
                    document.getElementById(`hb-${id}`).innerText = d.heartbeat_diff;
                    
                    killOverlay.style.display = d.d_kill_flag ? &#039;block&#039; : &#039;none&#039;;

                    let bStyle = &quot;&quot;, tColor = &quot;&quot;, label = &quot;&quot;, icon = &quot;&quot;;

                    if (d.d_status === &#039;RUNNING&#039;) {
                        if (d.is_dead) {
                            bStyle = &quot;rgba(249, 115, 22, 0.1)&quot;; tColor = &quot;#f97316&quot;;
                            label = &quot;응답 지연&quot;; icon = &#039;&lt;i class=&quot;fa-solid fa-triangle-exclamation&quot; style=&quot;color:#f97316;&quot;&gt;&lt;/i&gt;&#039;;
                        } else {
                            bStyle = &quot;#22c55e&quot;; tColor = &quot;#ffffff&quot;;
                            label = &quot;가동 중&quot;; icon = &#039;&lt;i class=&quot;fa-solid fa-bolt&quot; style=&quot;color:#10b981;&quot;&gt;&lt;/i&gt;&#039;;
                        }
                    } else if (d.d_status === &#039;STOPPED&#039;) {
                        bStyle = &quot;rgba(239, 68, 68, 0.1)&quot;; tColor = &quot;#ef4444&quot;;
                        label = &quot;중지됨&quot;; icon = &#039;&lt;i class=&quot;fa-solid fa-power-off&quot; style=&quot;color:#ef4444;&quot;&gt;&lt;/i&gt;&#039;;
                    } else {
                        bStyle = &quot;#334155&quot;; tColor = &quot;#94a3b8&quot;;
                        label = &quot;오류&quot;; icon = &#039;&lt;i class=&quot;fa-solid fa-bug&quot; style=&quot;color:#94a3b8;&quot;&gt;&lt;/i&gt;&#039;;
                    }

                    badge.style.background = bStyle;
                    badge.style.color = tColor;
                    badge.innerText = label;
                    iconBox.innerHTML = icon;
                });
            } catch (e) { console.error(&quot;Update fail&quot;, e); }
        }

        let countdown = 5;
        setInterval(() =&gt; {
            countdown--;
            if(countdown &lt;= 0) {
                updateData();
                countdown = 5;
            }
            document.getElementById(&#039;update-timer&#039;).innerText = `NEXT SYNC IN ${countdown}s`;
        }, 1000);

        updateData();

        // 테마 감지
        if (localStorage.theme === &#039;dark&#039; || (!(&#039;theme&#039; in localStorage) &amp;&amp; window.matchMedia(&#039;(prefers-color-scheme: dark)&#039;).matches)) {
            document.documentElement.classList.add(&#039;dark&#039;);
        }
    &lt;/script&gt;
&lt;/body&gt;
&lt;/html&gt;
&lt;?php require_once &#039;/home/www/GNU/_PAGE/tail.php&#039;; ?&gt;</pre>