<?php
require_once 'conn.php';
checkLogin();
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>管理区域</title>
    <link rel="stylesheet" href="css/common.css" type="text/css" />
    <link rel="stylesheet" href="css/alert.css" type="text/css" />
    <script src="system/js/jquery-1.7.2.min.js"></script>
    <script src="js/js.js"></script>
    <style>
        body {
            margin: 0;
            padding: 0;
            overflow: hidden;
        }
        .container {
            display: flex;
            height: 100vh;
            width: 100vw;
            overflow: hidden;
        }
        .panel-container {
            width: 250px;
            height: 100%;
            overflow-y: auto;
        /* 隐藏滚动条但保持功能 */
        scrollbar-width: none; /* Firefox */
            -ms-overflow-style: none; /* IE and Edge */
        }
        .panel-container::-webkit-scrollbar {
            display: none; /* Chrome, Safari and Opera */
        }
        .content-container {
            flex: 1;
            height: 100%;
            width: 100%;
        }
        #contentFrame {
            width: 100%;
            height: 100%;
            border: none;
        }
    </style>

</head>
<body>
<div class="container" style="">
    <div class="panel-container">
        <?php
        // 只有首页 panel.php
        require_once 'panel.php';
        ?>
    </div>
    <div class="content-container">
        <iframe id="contentFrame" name="contentFrame" src="dashboard_search.php"></iframe>
    </div>
</div>

<?php
$sql = "SELECT cs_code, em_user, cs_claimdate FROM customer 
        LEFT JOIN employee ON customer.cs_belong = employee.id 
        WHERE customer.id IN (
            SELECT cs_id FROM claimrecord 
            WHERE isread = 0 AND originalEmp = ?
        )";

$stmt = $conn->prepare($sql);
$stmt->bind_param("s", $_SESSION['employee_name']);
$stmt->execute();
$result = $stmt->get_result();

if ($result->num_rows > 0) {
?>
    <div class="modal" id="modal">
        <div class="modal-wraper">
            <div class="modal-content">
                <div class="popup-title">距离上次登录之后,以下客户已经被认领</div>
                <div class="popup-content">
                    <ul>
                        <?php while ($row = $result->fetch_assoc()) { ?>
                            <li>
                                <span class="prominent"><?= textUncode($row['cs_code']) ?></span> 被 
                                <span class="prominent"><?= textUncode($row['em_user']) ?></span> 于 
                                <span><?= textUncode($row['cs_claimdate']) ?></span> 认领
                            </li>
                        <?php } ?>
                    </ul>
                </div>
                <div class="close" onclick="closePopup()">已读</div>
            </div>
        </div>
    </div>
<?php
}

// Update claim records
$update_sql = "UPDATE claimrecord SET isread = 1 
               WHERE originalEmp = ? AND isread = 0";
$update_stmt = $conn->prepare($update_sql);
$update_stmt->bind_param("s", $_SESSION['employee_name']);
$update_stmt->execute();

$stmt->close();
$update_stmt->close();
?>

<script>
  // 检查是否首次登陆或是否过期
  const em = localStorage.getItem('em');
  const currentTime = new Date().getTime();
  const expirationTime = 24 * 60 * 60 * 1000; // 24小时的有效时间
  console.log(em);
  if (!em || em !== 'em<?= $_SESSION["employee_id"] ?>') {
    // 如果是首次登陆或已过期,显示弹窗
    $("#modal").addClass("active");
    setTimeout(function() {
        $("#modal").find(".modal-content").addClass("active");
    }, 0);

    // 存储当前时间戳
    localStorage.setItem('em', 'em<?= $_SESSION["employee_id"] ?>');
  }

  // 关闭弹窗的函数
  function closePopup() {
    $("#modal").removeClass("active");
  }

// Prevent iframe content from being loaded in parent window when logged out
if (window.top !== window.self) {
    window.top.location.href = window.location.href;
}
</script>

</body>
</html>