<?php
session_start();
// 禁止页面缓存，解决标题刷新不生效

header("Cache-Control: no-store, no-cache, must-revalidate, max-age=0");
header("Pragma: no-cache");
header("Expires: Thu, 01 Jan 1970 00:00:00 GMT");

// 会话超时：30分钟无操作自动登出，与admin后台统一
$expire = 1800;
if (empty($_SESSION['user_id']) || (time() - $_SESSION['login_time'] > $expire)) {
    session_destroy();
    header("Location: login.php");
    exit;
}
// 刷新登录计时
$_SESSION['login_time'] = time();
$userName = htmlspecialchars($_SESSION['username']);
$userRole = $_SESSION['role'];
$roleText = $userRole === 'admin' ? '管理员' : '只读用户';

// 读取全局系统配置（admin后台保存后同步生效）
$dbHost = "10.150.117.190";
$dbUser = "root";
$dbPwd = "hp93000";
$dbName = "alert_mail_stat";
$connConfig = mysqli_connect($dbHost, $dbUser, $dbPwd, $dbName);
mysqli_set_charset($connConfig, "utf8mb4");
$configSql = "SELECT k,v FROM sys_config";
$configRes = mysqli_query($connConfig, $configSql);
$sysConfig = [];
while ($row = mysqli_fetch_assoc($configRes)) {
    $sysConfig[$row['k']] = $row['v'];
}
mysqli_close($connConfig);

// 赋值全局配置
$pageTitle = htmlspecialchars($sysConfig['page_title'] ?? "告警监控系统");
$themeColor = htmlspecialchars($sysConfig['theme_color'] ?? "#409eff");
$pageSize = $sysConfig['page_size'] ?? "20";
$footerText = htmlspecialchars($sysConfig['footer_text'] ?? "");
$sidebarRawLinks = $sysConfig['sidebar_links'] ?? "";
// 读取语言配置 zh=中文 en=英文
$currentLang = $sysConfig['lang'] ?? "zh";

// 全局多语言词典
$langMap = [
    'zh' => [
        'html_lang' => 'zh-CN',
        'page_subtitle' => '爱德万测试 · 运维告警监控平台',
        'monitor_panel' => '监控面板',
        'alert_overview' => '告警监控总览',
        'disk_capacity' => '服务器磁盘容量',
        'alert_list_page' => '历史告警查询',
        'work_order_mgr' => '工单系统',
        'system_manager' => '角色管理',
        'work_order_title' => '工单管理',
        'work_create' => '新建工单',
        'work_edit' => '编辑工单',
        'work_assign' => '分发工单',
        'work_status' => '工单状态',
        'work_creator' => '创建人',
        'work_handler' => '处理人',
        'work_content' => '工单内容/备注',
        'work_title' => '工单标题',
        'work_create_time' => '创建时间',
        'work_update_time' => '更新时间',
        'work_all_list' => '全部工单列表',
        'work_no_data' => '暂无工单记录',
        'work_save' => '保存',
        'work_cancel' => '取消',
        'work_placeholder_title' => '填写故障/需求标题',
        'work_placeholder_content' => '详细描述故障、操作步骤、处理备注',
        'work_select_handler' => '选择处理人（留空暂不分配）', 
        'quick_link' => '快捷外链',
        'system_manage' => '系统管理',
        'system_config' => '后台配置管理',
        'current_user' => '当前用户：',
        'sys_time' => '系统时间：',
        'refresh_all' => '刷新全部数据',
        'export_csv' => '导出告警CSV',
        'logout' => '退出登录',
        'lang_text' => '语言：',
        'today_fire' => '今日触发告警',
        'unresolved_now' => '当前未恢复告警',
        'resolved_today' => '今日恢复告警',
        'instance_total' => '故障实例总数',
        'recovery_rate' => '告警恢复率',
        'today_fire_sub' => 'Total Firing Today',
        'unresolved_sub' => 'Unresolved Now',
        'resolved_sub' => 'Resolved Today',
        'instance_sub' => 'Affected Host Instance',
        'rate_sub' => 'Daily Recovery Rate',
        'top10_alert' => '今日告警频次 TOP 10',
        'active_alert' => '当前未恢复活跃告警',
        'alert_count' => '条未恢复故障',
        'all_alert_log' => '今日全量告警明细列表',
        'total_alert' => '条告警记录',
        'tag' => '告警状态',
        'alert_name' => '告警名称',
        'instance_addr' => '实例地址',
        'severity' => '告警级别',
        'occur_time' => '故障发生时间',
        'empty_normal' => '当前无未恢复告警，系统运行正常',
        'empty_no_data' => '暂无今日告警数据',
        'disk_stat' => '用户目录磁盘占用统计',
        'filter_ip' => '筛选实例IP：',
        'export_disk' => '导出当前表格CSV',
        'all_instance' => '全部实例',
        'disk_loading' => '磁盘数据加载中...',
        'no_disk_data' => '暂无磁盘指标数据',
        'no_ip_data' => '该实例下无目录数据',
        'csv_tip' => '正在生成CSV报表，请稍候...',
        'alert_axis' => '告警次数',
        'data_fail' => '数据加载失败，请重新登录',
        'server_fail' => '接口数据加载失败，请检查后端服务',
        'disk_api_fail' => '磁盘接口异常：',
        'disk_request_fail' => '请求df.php接口失败，请检查服务',
        'no_export_data' => '无数据可导出'
    ],
    'en' => [
        'html_lang' => 'en',
        'page_subtitle' => 'Advantest · O&M Alert Monitor Platform',
        'monitor_panel' => 'Monitor Panel',
        'alert_overview' => 'Alert Overview',
        'disk_capacity' => 'Server Disk Capacity',
        'alert_list_page' => 'Alert Pagination List',
        'work_order_mgr' => 'Work Order System',
        'system_manager' => 'Role & Permission Manage',
        'work_order_title' => 'Work Order Manage',
        'work_create' => 'Create Order',
        'work_edit' => 'Edit Order',
        'work_assign' => 'Assign Order',
        'work_status' => 'Status',
        'work_creator' => 'Creator',
        'work_handler' => 'Handler',
        'work_content' => 'Content / Remark',
        'work_title' => 'Order Title',
        'work_create_time' => 'Create Time',
        'work_update_time' => 'Update Time',
        'work_all_list' => 'All Work Order List',
        'work_no_data' => 'No order data',
        'work_save' => 'Save',
        'work_cancel' => 'Cancel',
        'work_placeholder_title' => 'Fill fault or demand title',
        'work_placeholder_content' => 'Describe fault, steps and handling remark',
        'work_select_handler' => 'Select handler (empty for unassigned)',
        'quick_link' => 'Quick Links',
        'system_manage' => 'System Manage',
        'system_config' => 'System Config',
        'current_user' => 'User: ',
        'sys_time' => 'System Time: ',
        'refresh_all' => 'Refresh All Data',
        'export_csv' => 'Export Alert CSV',
        'logout' => 'Logout',
        'lang_text' => 'Lang: ',
        'today_fire' => 'Today Triggered Alerts',
        'unresolved_now' => 'Unresolved Alerts',
        'resolved_today' => 'Resolved Today',
        'instance_total' => 'Affected Instances',
        'recovery_rate' => 'Daily Recovery Rate',
        'today_fire_sub' => 'Total Firing Today',
        'unresolved_sub' => 'Unresolved Now',
        'resolved_sub' => 'Resolved Today',
        'instance_sub' => 'Affected Host Instance',
        'rate_sub' => 'Daily Recovery Rate',
        'top10_alert' => 'Top 10 Alert Frequency Today',
        'active_alert' => 'Active Unresolved Alerts',
        'alert_count' => ' unresolved alerts',
        'all_alert_log' => 'Today Full Alert List',
        'total_alert' => ' alert records',
        'tag' => 'Status',
        'alert_name' => 'Alert Name',
        'instance_addr' => 'Instance IP',
        'severity' => 'Severity',
        'occur_time' => 'Occur Time',
        'empty_normal' => 'No active alerts, system normal',
        'empty_no_data' => 'No alert data today',
        'disk_stat' => 'User Directory Disk Usage',
        'filter_ip' => 'Filter IP: ',
        'export_disk' => 'Export Table CSV',
        'all_instance' => 'All Instances',
        'disk_loading' => 'Loading disk data...',
        'no_disk_data' => 'No disk data available',
        'no_ip_data' => 'No directory data for this instance',
        'csv_tip' => 'Generating CSV file, please wait...',
        'alert_axis' => 'Alert Count',
        'data_fail' => 'Data load failed, please relogin',
        'server_fail' => 'API request failed, check backend service',
        'disk_api_fail' => 'Disk API Error: ',
        'disk_request_fail' => 'Request df.php failed, check service',
        'no_export_data' => 'No data to export'
    ]
];
$t = $langMap[$currentLang];

// 解析侧边外链列表
$sidebarLinkList = [];
if (!empty($sidebarRawLinks)) {
    $lines = explode("\n", $sidebarRawLinks);
    foreach ($lines as $line) {
        $line = trim($line);
        if (empty($line)) continue;
        $item = explode("|", $line, 2);
        if (count($item) === 2) {
            $sidebarLinkList[] = [
                "name" => trim($item[0]),
                "url" => trim($item[1])
            ];
        }
    }
}
?>
<!DOCTYPE html>
<html lang="<?php echo $t['html_lang']; ?>">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><?php echo $pageTitle; ?> - Advantest <?php echo $t['page_subtitle']; ?></title>
<link rel="stylesheet" href="/static/css/font-awesome.min.css">
<script src="/static/js/echarts.min.js"></script>
<script src="/static/js/jquery.min.js"></script>
<style>
*{box-sizing:border-box;margin:0;padding:0}
body{
    background:#f9fafc;
    font-family:"Inter","PingFang SC","Microsoft YaHei";
    color:#1d2939;
    line-height:1.6;
    display:flex;
    flex-direction:column;
    height:100vh;
    overflow:hidden;
}
/* 侧边导航菜单 */
.wrap-main{
    display:flex;
    flex:1;
    overflow:hidden;
}
.sidebar{
    width:240px;
    background:#152c5b;
    color:#e2e8f0;
    flex-shrink:0;
    overflow-y:auto;
}
.sidebar-brand{
    padding:26px 24px;
    border-bottom:1px solid rgba(255,255,255,0.1);
}
.sidebar-brand-en{
    font-size:20px;
    font-weight:700;
    letter-spacing:1px;
    color:#fff;
}
.sidebar-brand-cn{
    font-size:13px;
    color:#a5b4fc;
    margin-top:4px;
}
.sidebar-menu{
    padding:16px 0;
}
.menu-title{
    padding:10px 24px;
    font-size:12px;
    color:#94a3b8;
    letter-spacing:1px;
}
.menu-item{
    display:flex;
    align-items:center;
    gap:12px;
    padding:14px 24px;
    cursor:pointer;
    font-size:14px;
    transition:0.2s;
    color:#cbd5e1;
}
.menu-item i{
    font-size:16px;
    width:20px;
    text-align:center;
}
.menu-item.active{
    background:rgba(255,255,255,0.12);
    color:#fff;
    border-left:4px solid #3b82f6;
}
.menu-item:hover:not(.active){
    background:rgba(255,255,255,0.06);
    color:#fff;
}
/* 主内容区域 */
.main-content{
    flex:1;
    overflow-y:auto;
    display:flex;
    flex-direction:column;
}
/* 顶部导航栏 高端纯白渐变 */
.header{
    background:#ffffff;
    border-bottom:1px solid #eef2fb;
    color:#152c5b;
    padding:20px 40px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    box-shadow:0 2px 12px rgba(21,44,91,0.05);
    flex-shrink:0;
}
.header-left{
    display:flex;
    align-items:center;
    gap:14px;
}
.header-brand-en{
    font-size:24px;
    font-weight:700;
    letter-spacing:2px;
    color:#152c5b;
}
.header-brand-cn{
    font-size:15px;
    color:#64748b;
}
.header-right{
    display:flex;
    align-items:center;
    gap:18px;
    font-size:14px;
    flex-wrap:wrap;
}
.user-info,.time-info,.lang-box{
    color:#475569;
    display:flex;
    align-items:center;
    gap:6px;
}
.lang-box select{
    padding:4px 8px;
    border:1px solid #cbd5e1;
    border-radius:6px;
}
.btn-base{
    border:none;
    padding:9px 20px;
    border-radius:8px;
    cursor:pointer;
    font-size:14px;
    display:flex;
    align-items:center;
    gap:6px;
    transition:all 0.2s ease;
}
.btn-outline{
    background:#ffffff;
    color:#152c5b;
    border:1px solid #cbd5e1;
}
.btn-outline:hover{
    background:#f7f8fc;
    border-color:#152c5b;
}
.btn-primary{
    background:#152c5b;
    color:#fff;
}
.btn-primary:hover{
    background:#0f1e42;
}
.btn-success{
    background:#10b981;
    color:#fff;
}
.btn-success:hover{
    background:#059669;
}
/* 日期选择框样式 */
#csvDatePicker{
    padding:8px 10px;
    border:1px solid #cbd5e1;
    border-radius:8px;
    font-size:14px;
}
/* 加载遮罩 */
.mask{
    position:fixed;
    left:0;top:0;
    width:100%;height:100%;
    background:rgba(255,255,255,0.85);
    display:none;
    z-index:999;
    align-items:center;
    justify-content:center;
}
.mask-box{
    background:#fff;
    padding:30px 40px;
    border-radius:14px;
    font-size:15px;
    display:flex;
    gap:14px;
    align-items:center;
    box-shadow:0 8px 30px rgba(21,44,91,0.12);
    border:1px solid #eef2fb;
}
.loading{
    display:inline-block;
    width:20px;height:20px;
    border:2px solid #e2e8f0;
    border-top-color:#152c5b;
    border-radius:50%;
    animation:spin 0.8s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg)}}
/* 容器内边距 */
.container{
    padding:36px 40px;
    max-width:100%;
    flex:1;
}
/* 页面面板控制（切换显示隐藏） */
.page-panel{
    display:none;
}
.page-panel.active{
    display:block;
}
/* 统计卡片区域 */
.stat-cards{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:28px;
    margin-bottom:36px;
}
.stat-card{
    background:#fff;
    border-radius:16px;
    padding:32px;
    box-shadow:0 3px 18px rgba(21,44,91,0.06);
    border:1px solid #eef2fb;
    transition:transform 0.26s,box-shadow 0.26s;
}
.stat-card:hover{
    transform:translateY(-6px);
    box-shadow:0 10px 32px rgba(21,44,91,0.09);
}
.stat-header{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    margin-bottom:20px;
}
.stat-title{
    font-size:14px;
    color:#64748b;
}
.stat-icon{
    width:46px;height:46px;
    border-radius:12px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:20px;
}
.stat-card.fire .stat-icon{background:#fee2e2;color:#dc2626}
.stat-card.active .stat-icon{background:#fef3c7;color:#d97706}
.stat-card.resolve .stat-icon{background:#dcfce7;color:#16a34a}
.stat-card.instance .stat-icon{background:#dbeafe;color:#2563eb}
.stat-card.rate .stat-icon{background:#ffedd5;color:#ea580c}
.stat-value{
    font-size:44px;
    font-weight:700;
    color:#152c5b;
    letter-spacing:1px;
    line-height:1.1;
}
.stat-card.active .stat-value{color:#d97706}
.stat-sub{
    font-size:12px;
    color:#94a3b8;
    margin-top:8px;
}
/* 图表、表格通用卡片 */
.chart-section,.active-alert-section,.table-section,.disk-section{
    margin-bottom:36px;
}
.base-card{
    background:#fff;
    border-radius:16px;
    padding:32px;
    box-shadow:0 3px 18px rgba(21,44,91,0.06);
    border:1px solid #eef2fb;
}
.title-wrap{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:26px;
    padding-bottom:16px;
    border-bottom:1px solid #eef2fb;
}
.title-left{
    display:flex;
    align-items:center;
    gap:12px;
    font-size:19px;
    font-weight:600;
    color:#152c5b;
}
.title-left i{color:#2563eb;font-size:21px}
.table-count{font-size:14px;color:#64748b}
.filter-box{
    display:flex;
    align-items:center;
    gap:10px;
}
.filter-box label{
    font-size:14px;
    color:#475569;
}
#ipSelect{
    padding:6px 10px;
    border:1px solid #cbd5e0;
    border-radius:6px;
    font-size:14px;
    min-width:200px;
}
#diskExportBtn{
    padding:6px 14px;
    background:#2b6cb0;
    color:#fff;
    border:none;
    border-radius:6px;
    cursor:pointer;
    font-size:14px;
}
#diskExportBtn:hover{
    background:#2c5282;
}
#chart1{height:420px;width:100%}
.active-alert-section .base-card{border:1px solid #fee2e2}
/* 表格通用样式 */
.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:14px}
th{
    background:#f9fafc;
    color:#475569;
    font-weight:600;
    padding:16px 18px;
    text-align:left;
    border-bottom:2px solid #e2e8f0;
    white-space:nowrap;
}
th i{margin-right:6px;font-size:13px;color:#94a3b8}
td{
    padding:18px;
    border-bottom:1px solid #f1f5f9;
    color:#334155;
}
tbody tr{transition:background 0.2s}
tbody tr:hover{background:#f7f8fc}
tbody tr:nth-child(even){background:#fbfcfe}
/* 状态标签 */
.status-tag{
    display:inline-flex;
    align-items:center;
    gap:5px;
    padding:6px 14px;
    border-radius:24px;
    font-size:13px;
    font-weight:500;
}
.status-tag.fire{background:#fee2e2;color:#dc2626}
.status-tag.resolve{background:#dcfce7;color:#16a34a}
.severity-tag{
    display:inline-block;
    padding:5px 12px;
    border-radius:8px;
    font-size:13px;
    font-weight:500;
}
.severity-critical{background:#fee2e2;color:#dc2626}
.severity-warning{background:#ffedd5;color:#ea580c}
.severity-info{background:#dbeafe;color:#2563eb}
.num-big {
    color: #c53030;
    font-weight: 500;
}
/* 空数据提示 */
.empty-state{
    text-align:center;
    padding:80px 20px;
    color:#94a3b8;
    font-size:15px;
}
.empty-icon{
    font-size:56px;
    margin-bottom:18px;
    opacity:0.35;
}
/* 响应式适配 */
@media (max-width:1440px){.stat-cards{grid-template-columns:repeat(3,1fr)}}
@media (max-width:992px){
    .wrap-main{flex-direction:column;}
    .sidebar{width:100%;height:auto}
}
@media (max-width:768px){
    .header{padding:16px 24px;flex-direction:column;gap:16px;align-items:flex-start}
    .header-right{flex-wrap:wrap}
    .container{padding:24px}
    .stat-cards{grid-template-columns:1fr;gap:20px}
    .stat-card{padding:24px}
    .base-card{padding:24px}
    .filter-box{flex-wrap:wrap;}
}
</style>
</head>
<body>
<div class="mask" id="exportMask">
    <div class="mask-box">
        <span class="loading"></span>
        <span><?php echo $t['csv_tip']; ?></span>
    </div>
</div>
<div class="wrap-main">
    <!-- 左侧侧边栏菜单 -->
    <div class="sidebar">
        <div class="sidebar-brand">
            <div class="sidebar-brand-en">Advantest</div>
            <div class="sidebar-brand-cn"><?php echo $t['page_subtitle']; ?></div>
        </div>
        <div class="sidebar-menu">
            <div class="menu-title"><?php echo $t['monitor_panel']; ?></div>
            <div class="menu-item active" data-page="alertPage">
                <i class="fa fa-line-chart"></i>
                <span><?php echo $t['alert_overview']; ?></span>
            </div>
            <div class="menu-item" data-page="diskPage">
                <i class="fa fa-hdd-o"></i>
                <span><?php echo $t['disk_capacity']; ?></span>
            </div>
            <!-- 告警分页：去掉window.open，同页跳转 -->
            <div class="menu-item" onclick="location.href='alert_list.php'">
                <i class="fa fa-list"></i>
                <span><?php echo $t['alert_list_page']; ?></span>
            </div>
            <!-- 工单 图标 fa-ticket -->
            <div class="menu-item" onclick="location.href='work_order.php'" data-page="workOrderPage">
                <i class="fa fa-ticket"></i>
                <span><?php echo $t['work_order_mgr']; ?></span>
            </div>
            <!-- 后台配置快捷外链自动渲染 -->
            <?php if (!empty($sidebarLinkList)): ?>
            <div class="menu-title"><?php echo $t['quick_link']; ?></div>
            <?php foreach ($sidebarLinkList as $link): ?>
            <div class="menu-item" onclick="window.open('<?php echo htmlspecialchars($link['url']); ?>')">
                <i class="fa fa-external-link"></i>
                <span><?php echo htmlspecialchars($link['name']); ?></span>
            </div>
            <?php endforeach; ?>
            <?php endif; ?>
            <div class="menu-title"><?php echo $t['system_manage']; ?></div>
            <div class="menu-item" onclick="location.href='admin.php'">
                <i class="fa fa-cog"></i>
                <span><?php echo $t['system_config']; ?></span>
            </div>
            <!-- 新增角色管理菜单 -->
            <div class="menu-item" onclick="location.href='system_manage.php'">
                <i class="fa fa-users"></i>
                <span><?php echo $t['system_manager']; ?></span>
            </div>
        </div>
    </div>
    <!-- 右侧主内容区 -->
    <div class="main-content">
        <div class="header">
            <div class="header-left">
                <div>
                    <div class="header-brand-en">Advantest</div>
                    <div class="header-brand-cn"><?php echo $t['page_subtitle']; ?></div>
                </div>
            </div>
            <div class="header-right">
                <span class="user-info"><i class="fa fa-user-circle"></i><?php echo $t['current_user']; ?><?php echo $userName; ?>（<?php echo $roleText; ?>）</span>
                <span class="time-info"><i class="fa fa-clock-o"></i><?php echo $t['sys_time']; ?><span id="updateTime">--</span></span>
                <!-- 语言切换下拉框 -->
                <div class="lang-box">
                    <span><?php echo $t['lang_text']; ?></span>
                    <select id="langSwitch">
                        <option value="zh" <?php echo $currentLang==='zh'?'selected':''; ?>>中文</option>
                        <option value="en" <?php echo $currentLang==='en'?'selected':''; ?>>EN</option>
                    </select>
                </div>
                <button class="btn-base btn-outline" onclick="loadAllData()"><i class="fa fa-refresh"></i><?php echo $t['refresh_all']; ?></button>
                <div style="display:flex;align-items:center;gap:8px;">
                    <input type="date" id="csvDatePicker">
                    <button class="btn-base btn-success" onclick="exportCsv()"><i class="fa fa-download"></i><?php echo $t['export_csv']; ?></button>
                </div>
                <button class="btn-base btn-primary" id="logoutBtn"><i class="fa fa-sign-out"></i><?php echo $t['logout']; ?></button>
            </div>
        </div>

        <div class="container">
            <!-- 告警监控面板 -->
            <div class="page-panel active" id="alertPage">
                <div class="stat-cards">
                    <div class="stat-card fire">
                        <div class="stat-header">
                            <div class="stat-title"><?php echo $t['today_fire']; ?></div>
                            <div class="stat-icon"><i class="fa fa-exclamation-triangle"></i></div>
                        </div>
                        <div class="stat-value" id="fire">0</div>
                        <div class="stat-sub"><?php echo $t['today_fire_sub']; ?></div>
                    </div>
                    <div class="stat-card active">
                        <div class="stat-header">
                            <div class="stat-title"><?php echo $t['unresolved_now']; ?></div>
                            <div class="stat-icon"><i class="fa fa-bolt"></i></div>
                        </div>
                        <div class="stat-value" id="activeAlert">0</div>
                        <div class="stat-sub"><?php echo $t['unresolved_sub']; ?></div>
                    </div>
                    <div class="stat-card resolve">
                        <div class="stat-header">
                            <div class="stat-title"><?php echo $t['resolved_today']; ?></div>
                            <div class="stat-icon"><i class="fa fa-check-circle"></i></div>
                        </div>
                        <div class="stat-value" id="resolve">0</div>
                        <div class="stat-sub"><?php echo $t['resolved_sub']; ?></div>
                    </div>
                    <div class="stat-card instance">
                        <div class="stat-header">
                            <div class="stat-title"><?php echo $t['instance_total']; ?></div>
                            <div class="stat-icon"><i class="fa fa-server"></i></div>
                        </div>
                        <div class="stat-value" id="instance">0</div>
                        <div class="stat-sub"><?php echo $t['instance_sub']; ?></div>
                    </div>
                    <div class="stat-card rate">
                        <div class="stat-header">
                            <div class="stat-title"><?php echo $t['recovery_rate']; ?></div>
                            <div class="stat-icon"><i class="fa fa-line-chart"></i></div>
                        </div>
                        <div class="stat-value" id="rate">0%</div>
                        <div class="stat-sub"><?php echo $t['rate_sub']; ?></div>
                    </div>
                </div>

                <!-- TOP10图表 -->
                <div class="chart-section">
                    <div class="base-card">
                        <div class="title-wrap">
                            <div class="title-left"><i class="fa fa-bar-chart"></i><?php echo $t['top10_alert']; ?></div>
                        </div>
                        <div id="chart1"></div>
                    </div>
                </div>

                <!-- 未恢复活跃告警 -->
                <div class="active-alert-section">
                    <div class="base-card">
                        <div class="title-wrap">
                            <div class="title-left"><i class="fa fa-exclamation-circle"></i><?php echo $t['active_alert']; ?></div>
                            <div class="table-count"><?php echo $currentLang==='zh'?'共 ':' '; ?><span id="activeCount">0</span><?php echo $t['alert_count']; ?></div>
                        </div>
                        <div class="table-wrap">
                            <table>
                                <thead>
                                    <tr>
                                        <th style="width:100px"><i class="fa fa-tag"></i><?php echo $t['tag']; ?></th>
                                        <th><i class="fa fa-bullhorn"></i><?php echo $t['alert_name']; ?></th>
                                        <th><i class="fa fa-desktop"></i><?php echo $t['instance_addr']; ?></th>
                                        <th style="width:120px"><i class="fa fa-signal"></i><?php echo $t['severity']; ?></th>
                                        <th style="width:200px"><i class="fa fa-calendar"></i><?php echo $t['occur_time']; ?></th>
                                    </tr>
                                </thead>
                                <tbody id="active-table-body">
                                    <tr>
                                        <td colspan="5">
                                            <div class="empty-state">
                                                <div class="empty-icon"><i class="fa fa-check"></i></div>
                                                <div><?php echo $t['empty_normal']; ?></div>
                                            </div>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>

                <!-- 今日全量明细 -->
                <div class="table-section">
                    <div class="base-card">
                        <div class="title-wrap">
                            <div class="title-left"><i class="fa fa-list-alt"></i><?php echo $t['all_alert_log']; ?></div>
                            <div class="table-count"><?php echo $currentLang==='zh'?'共 ':' '; ?><span id="totalCount">0</span><?php echo $t['total_alert']; ?></div>
                        </div>
                        <div class="table-wrap">
                            <table>
                                <thead>
                                    <tr>
                                        <th style="width:100px"><i class="fa fa-tag"></i><?php echo $t['tag']; ?></th>
                                        <th><i class="fa fa-bullhorn"></i><?php echo $t['alert_name']; ?></th>
                                        <th><i class="fa fa-desktop"></i><?php echo $t['instance_addr']; ?></th>
                                        <th style="width:120px"><i class="fa fa-signal"></i><?php echo $t['severity']; ?></th>
                                        <th style="width:200px"><i class="fa fa-calendar"></i><?php echo $t['occur_time']; ?></th>
                                    </tr>
                                </thead>
                                <tbody id="table-body">
                                    <tr>
                                        <td colspan="5">
                                            <div class="empty-state">
                                                <div class="empty-icon"><i class="fa fa-folder-open-o"></i></div>
                                                <div><?php echo $t['empty_no_data']; ?></div>
                                            </div>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>

            <!-- 磁盘容量监控面板 -->
            <div class="page-panel" id="diskPage">
                <div class="disk-section">
                    <div class="base-card">
                        <div class="title-wrap">
                            <div class="title-left"><i class="fa fa-hdd-o"></i><?php echo $t['disk_stat']; ?></div>
                            <div class="filter-box">
                                <label><?php echo $t['filter_ip']; ?></label>
                                <select id="ipSelect">
                                    <option value="all"><?php echo $t['all_instance']; ?></option>
                                </select>
                                <button id="diskExportBtn"><?php echo $t['export_disk']; ?></button>
                            </div>
                        </div>
                        <div class="table-wrap">
                            <table>
                                <thead>
                                    <tr>
                                        <th>IP</th>
                                        <th>Username</th>
                                        <th>Path</th>
                                        <th>Size(GB)</th>
                                    </tr>
                                </thead>
                                <tbody id="diskTableBody">
                                    <tr>
                                        <td colspan="4" class="empty-state">
                                            <div class="empty-icon"><i class="fa fa-spinner fa-spin"></i></div>
                                            <div><?php echo $t['disk_loading']; ?></div>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script>
const api = "./api/index.php";
let chartInstance = null;
let diskSourceData = [];
let currentDiskIp = "all";
// 当前语言
const currentLang = "<?php echo $currentLang; ?>";

// 语言切换接口
$("#langSwitch").change(function(){
    const newLang = $(this).val();
    fetch(api,{
        method:"POST",
        headers:{"Content-Type":"application/x-www-form-urlencoded"},
        body:"act=save_lang&lang="+newLang
    }).then(()=>{
        // 带随机参数清除缓存刷新页面
        location.href = "dashboard.php?_t="+new Date().getTime();
    })
})

// 侧边菜单切换
$(".menu-item").click(function(){
    const pageId = $(this).data("page");
    if (!pageId) return;
    $(".menu-item").removeClass("active");
    $(this).addClass("active");
    $(".page-panel").removeClass("active");
    $("#"+pageId).addClass("active");
    if(pageId === "diskPage") loadDiskData();
})

// 格式化时间
function formatTime(dateStr){
    if(!dateStr || dateStr === '0001-01-01 00:00:00' || dateStr === null) return '-';
    return dateStr;
}
// 告警级别标签
function getSeverityTag(severity){
    const s = (severity || '').toLowerCase();
    if(s==='critical') return `<span class="severity-tag severity-critical">${currentLang==='zh'?'严重':'Critical'}</span>`;
    if(s==='warning') return `<span class="severity-tag severity-warning">${currentLang==='zh'?'警告':'Warning'}</span>`;
    if(s==='info') return `<span class="severity-tag severity-info">${currentLang==='zh'?'信息':'Info'}</span>`;
    return `<span class="severity-tag severity-info">${severity||'-'}</span>`;
}

// 加载未恢复告警
function loadActiveAlert(){
    $.getJSON(api+"?act=active_firing",function(list){
        $("#activeAlert").text(list.length);
        $("#activeCount").text(list.length);
        if(list.length===0){
            $("#active-table-body").html(`<tr><td colspan="5"><div class="empty-state"><div class="empty-icon"><i class="fa fa-check"></i></div><div><?php echo $t['empty_normal']; ?></div></div></td></tr>`);
            return;
        }
        let html="";
        list.forEach(row=>{
            const t=`<span class="status-tag fire"><i class="fa fa-bolt"></i>${currentLang==='zh'?'触发':'Firing'}</span>`;
            html+=`<tr>
                <td>${t}</td>
                <td style="font-weight:500;color:#152c5b">${row.alert_name||'-'}</td>
                <td style="font-family:Consolas,monospace;font-size:13px">${row.instance||'-'}</td>
                <td>${getSeverityTag(row.severity)}</td>
                <td style="color:#475569">${formatTime(row.receive_time)}</td>
            </tr>`;
        });
        $("#active-table-body").html(html);
    }).fail(()=>{
        $("#activeAlert").text("-");
        $("#active-table-body").html(`<tr><td colspan="5"><div class="empty-state" style="color:#dc2626"><div class="empty-icon"><i class="fa fa-exclamation-circle"></i></div><div><?php echo $t['data_fail']; ?></div></div></td></tr>`);
    });
}

// 统计卡片数据
function loadStats(){
    $.getJSON(api+"?act=day_total",function(res){
        const fire=parseInt(res.fire_count)||0;
        const resolve=parseInt(res.resolve_count)||0;
        const ins=parseInt(res.instance_num)||0;
        const rate=fire>0?Math.round((resolve/fire)*100):0;
        $("#fire").text(fire);
        $("#resolve").text(resolve);
        $("#instance").text(ins);
        $("#rate").text(rate+"%");
    }).fail(()=>{$("#fire,#resolve,#instance,#rate").text("-");});
}

// 图表加载
function loadChart(){
    $.getJSON(api+"?act=top_alert",function(list){
        if(!chartInstance){
            chartInstance=echarts.init(document.getElementById("chart1"));
            window.addEventListener("resize",()=>chartInstance.resize());
        }
        const names=list.map(i=>i.alert_name);
        const cnt=list.map(i=>i.cnt);
        chartInstance.setOption({
            tooltip:{trigger:"axis",axisPointer:{type:"shadow"}},
            grid:{left:"3%",right:"4%",bottom:"18%",top:"8%",containLabel:true},
            xAxis:{
                type:"category",
                data:names,
                axisLabel:{rotate:30,fontSize:12,color:"#64748b"},
                axisLine:{lineStyle:{color:"#e2e8f0"}},
                axisTick:{show:false}
            },
            yAxis:{
                type:"value",
                name:"<?php echo $t['alert_axis']; ?>",
                nameTextStyle:{color:"#64748b",fontSize:13},
                axisLabel:{color:"#64748b",fontSize:12},
                splitLine:{lineStyle:{color:"#f1f5f9",type:"dashed"}},
                axisLine:{show:false}
            },
            series:[{
                type:"bar",
                data:cnt,
                barWidth:"48%",
                itemStyle:{
                    color:new echarts.graphic.LinearGradient(0,0,0,1,[
                        {offset:0,color:"#3b82f6"},
                        {offset:1,color:"#1d4ed8"}
                    ]),
                    borderRadius:[6,6,0,0]
                },
                label:{show:true,position:"top",fontSize:12,color:"#334155"}
            }]
        });
    });
}

// 告警明细表格
function loadTable(){
    $.getJSON(api+"?act=log_list",function(list){
        $("#totalCount").text(list.length);
        if(list.length===0){
            $("#table-body").html(`<tr><td colspan="5"><div class="empty-state"><div class="empty-icon"><i class="fa fa-folder-open-o"></i></div><div><?php echo $t['empty_no_data']; ?></div></div></td></tr>`);
            return;
        }
        let html="";
        list.forEach(row=>{
            const typeText = row.alert_type == 1
                ? `<span class="status-tag fire"><i class="fa fa-bolt"></i>${currentLang==='zh'?'触发':'Firing'}</span>`
                : `<span class="status-tag resolve"><i class="fa fa-check"></i>${currentLang==='zh'?'恢复':'Resolved'}</span>`;
            html += `<tr>
                <td>${typeText}</td>
                <td style="font-weight:500;color:#152c5b">${row.alert_name || '-'}</td>
                <td style="font-family:Consolas,monospace;font-size:13px">${row.instance || '-'}</td>
                <td>${getSeverityTag(row.severity)}</td>
                <td style="color:#475569">${formatTime(row.receive_time)}</td>
            </tr>`;
        });
        $("#table-body").html(html);
    }).fail(()=>{
        $("#table-body").html(`<tr><td colspan="5"><div class="empty-state" style="color:#dc2626"><div class="empty-icon"><i class="fa fa-exclamation-circle"></i></div><div><?php echo $t['server_fail']; ?></div></div></td></tr>`);
    });
}

// 更新顶部时间
function updateTime() {
    const now = new Date();
    const Y = now.getFullYear();
    const M = String(now.getMonth() + 1).padStart(2, '0');
    const D = String(now.getDate()).padStart(2, '0');
    const h = String(now.getHours()).padStart(2, '0');
    const m = String(now.getMinutes()).padStart(2, '0');
    const s = String(now.getSeconds()).padStart(2, '0');
    $("#updateTime").text(`${Y}-${M}-${D} ${h}:${m}:${s}`);
}

// 刷新全部数据
function loadAllData() {
    loadStats();
    loadChart();
    loadTable();
    loadActiveAlert();
    updateTime();
    if($("#diskPage").hasClass("active")) loadDiskData();
}

// 导出CSV
function exportCsv(){
    const mask = $("#exportMask");
    mask.css("display","flex");
    const selectDate = $("#csvDatePicker").val().trim();
    let exportUrl = api + "?act=export_csv";
    if(selectDate) exportUrl += "&date=" + encodeURIComponent(selectDate);
    window.open(exportUrl, "_blank");
    setTimeout(()=>mask.hide(),5000);
}

// 磁盘数据加载
function loadDiskData(){
    const tbody = $("#diskTableBody");
    tbody.html(`<tr><td colspan="4" class="empty-state"><div class="empty-icon"><i class="fa fa-spinner fa-spin"></i></div><div><?php echo $t['disk_loading']; ?></div></td></tr>`);
    $.getJSON("./api/df.php")
    .done(ret=>{
        console.log("df接口返回数据：", ret);
        if(ret.code !== 0){
            tbody.html(`<tr><td colspan="4" class="empty-state"><div class="empty-icon"><i class="fa fa-exclamation-circle"></i></div><div style="color:#dc2626"><?php echo $t['disk_api_fail']; ?>${ret.msg}</div></td></tr>`);
            return;
        }
        diskSourceData = ret.list;
        if(diskSourceData.length === 0){
            tbody.html(`<tr><td colspan="4" class="empty-state"><div class="empty-icon"><i class="fa fa-folder-open-o"></i></div><div><?php echo $t['no_disk_data']; ?></div></td></tr>`);
            return;
        }
        const ipSel = $("#ipSelect");
        const ipSet = new Set();
        diskSourceData.forEach(item=>ipSet.add(item.instance_ip));
        ipSet.forEach(ip=>{
            let has = false;
            ipSel.find("option").each(function(){
                if($(this).val() === ip) has = true;
            });
            if(!has){
                ipSel.append(`<option value="${ip}">${ip}</option>`);
            }
        });
        currentDiskIp = "all";
        renderDiskTable("all");
    })
    .fail(function(xhr,status,err){
        console.error("df接口请求失败", xhr, status, err);
        tbody.html(`<tr><td colspan="4" class="empty-state"><div class="empty-icon"><i class="fa fa-exclamation-circle"></i></div><div style="color:#dc2626"><?php echo $t['disk_request_fail']; ?></div></td></tr>`);
    });
}
// 渲染磁盘表格
function renderDiskTable(filterIp){
    currentDiskIp = filterIp;
    const tbody = $("#diskTableBody");
    tbody.html("");
    let showList = filterIp === "all" ? diskSourceData : diskSourceData.filter(i=>i.instance_ip === filterIp);
    if(showList.length === 0){
        tbody.html(`<tr><td colspan="4" class="empty-state"><?php echo $t['no_ip_data']; ?></td></tr>`);
        return;
    }
    showList.forEach(row=>{
        tbody.append(`
            <tr>
                <td>${row.instance_ip}</td>
                <td>${row.username}</td>
                <td>${row.directory}</td>
                <td class="num-big">${row.size_gb}GB</td>
            </tr>
        `)
    })
}
// 导出磁盘CSV
$("#diskExportBtn").click(function(){
    let showList = currentDiskIp === "all" ? diskSourceData : diskSourceData.filter(i=>i.instance_ip === currentDiskIp);
    if(showList.length === 0){
        alert("<?php echo $t['no_export_data']; ?>");
        return;
    }
    let csv = "\uFEFFIP,Username,Path,Size(GB)\n";
    showList.forEach(item=>{
        const line = [
            `"${item.instance_ip}"`,
            `"${item.username}"`,
            `"${item.directory}"`,
            `"${item.size_gb}GB"`
        ];
        csv += line.join(",") + "\n";
    })
    const blob = new Blob([csv], {type:"text/csv;charset=utf-8"});
    const url = URL.createObjectURL(blob);
    const a = document.createElement("a");
    a.href = url;
    a.download = "disk_"+new Date().getTime()+".csv";
    a.click();
    URL.revokeObjectURL(url);
})
// IP筛选切换
$("#ipSelect").change(function(){
    renderDiskTable($(this).val());
})

// 页面初始化
$(function() {
    loadAllData();
    setInterval(loadAllData, 60000);
    setInterval(updateTime, 1000);
    $("#logoutBtn").click(function(){
        location.href="logout.php";
    })
});
</script>
</body>
</html>
