<?php
// 1. الاتصال بقاعدة البيانات
$host = 'localhost';
$db   = 'globewyd_coffee_erp'; 
$user = 'globewyd_kaba';
$pass = 'R-65;G)%yeZE^*97';
$charset = 'utf8mb4';

$dsn = "mysql:host=$host;dbname=$db;charset=$charset";
$options = [
    PDO::ATTR_ERRMODE            => PDO::ERRMODE_EXCEPTION,
    PDO::ATTR_DEFAULT_FETCH_MODE => PDO::FETCH_ASSOC,
    PDO::ATTR_EMULATE_PREPARES   => false,
];

try {
     $pdo = new PDO($dsn, $user, $pass, $options);
} catch (\PDOException $e) {
     die("فشل الاتصال بقاعدة البيانات: " . $e->getMessage());
}

// ==========================================
// 2. جلب إحصائيات البازار (الكروت والداتا)
// ==========================================

// إجمالي عدد الموردين / أصحاب الحرف
$suppliersStmt = $pdo->query("SELECT COUNT(id) AS total FROM suppliers");
$total_suppliers = $suppliersStmt->fetch()['total'] ?? 0;

// إجمالي عدد التحف والأصناف المسجلة
$productsStmt = $pdo->query("SELECT COUNT(id) AS total FROM products");
$total_products = $productsStmt->fetch()['total'] ?? 0;

// المبيعات بالجنيه المصري (EGP)
$salesEgpStmt = $pdo->query("SELECT SUM(total_amount) AS total FROM orders WHERE currency = 'EGP' OR currency = 'ج.م'");
$sales_egp = $salesEgpStmt->fetch()['total'] ?? 0;

// المبيعات بالدولار الأمريكي (USD) - أساسي للسياح
$salesUsdStmt = $pdo->query("SELECT SUM(total_amount) AS total FROM orders WHERE currency = 'USD'");
$sales_usd = $salesUsdStmt->fetch()['total'] ?? 0;

// المبيعات بالين الياباني (JPY)
$salesJpyStmt = $pdo->query("SELECT SUM(total_amount) AS total FROM orders WHERE currency = 'JPY' OR currency = 'YEN'");
$sales_jpy = $salesJpyStmt->fetch()['total'] ?? 0;

// إجمالي القطع المباعة اليوم (حساب كل الكميات بدون تقييد بوحدة معينة)
$todayQtyStmt = $pdo->query("SELECT SUM(oi.quantity) AS total_qty 
                             FROM order_items oi 
                             JOIN orders o ON oi.order_id = o.id 
                             WHERE DATE(o.order_date) = CURDATE()");
$today_qty = $todayQtyStmt->fetch()['total_qty'] ?? 0;

// التحفة الأكثر مبيعاً (الأعلى طلباً)
$mostSoldStmt = $pdo->query("SELECT p.product_name 
                             FROM order_items oi 
                             JOIN products p ON oi.product_id = p.id 
                             GROUP BY oi.product_id 
                             ORDER BY SUM(oi.quantity) DESC 
                             LIMIT 1");
$most_sold_product = $mostSoldStmt->fetch()['product_name'] ?? 'لا يوجد بيانات';

// التحفة الأقل مبيعاً 
$leastSoldStmt = $pdo->query("SELECT p.product_name 
                              FROM order_items oi 
                              JOIN products p ON oi.product_id = p.id 
                              GROUP BY oi.product_id 
                              ORDER BY SUM(oi.quantity) ASC 
                              LIMIT 1");
$least_sold_product = $leastSoldStmt->fetch()['product_name'] ?? 'لا يوجد بيانات';


// ==========================================
// 3. بيانات الجرافات بالثيم الجديد
// ==========================================
// مبيعات آخر 7 أيام
$weeklySalesStmt = $pdo->query("SELECT DATE(order_date) AS o_date, SUM(total_amount) AS daily_total 
                                FROM orders 
                                WHERE order_date >= DATE_SUB(CURDATE(), INTERVAL 6 DAY)
                                GROUP BY DATE(order_date)
                                ORDER BY DATE(order_date) ASC");
$weekly_data = $weeklySalesStmt->fetchAll();

$chart_days = [];
$chart_totals = [];
foreach ($weekly_data as $row) {
    $chart_days[] = date('Y-m-d', strtotime($row['o_date']));
    $chart_totals[] = (float)$row['daily_total'];
}

// الأصناف الـ 4 الأكثر مبيعاً لشارت الدونات
$topProductsStmt = $pdo->query("SELECT p.product_name, SUM(oi.quantity) AS total_sold 
                                FROM order_items oi 
                                JOIN products p ON oi.product_id = p.id 
                                GROUP BY oi.product_id 
                                ORDER BY total_sold DESC 
                                LIMIT 4");
$top_data = $topProductsStmt->fetchAll();

$pie_labels = [];
$pie_values = [];
foreach ($top_data as $row) {
    $pie_labels[] = $row['product_name'];
    $pie_values[] = (float)$row['total_sold'];
}
?>

<!DOCTYPE html>
<html lang="ar" dir="rtl">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>خزينة ومخططات البازار الملكية</title>
    <!-- خطوط جوجل: Cairo للمتن و Reem Kufi للعنوان الفرعوني اللامع -->
    <link href="https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700&family=Reem+Kufi:wght@500;700&display=swap" rel="stylesheet">
    <script src="https://cdn.jsdelivr.net/npm/apexcharts"></script>
    
    <style>
        :root {
            --bg-color: #06080a; /* أسود بازلتي عميق */
            --card-bg: #0f1217; /* أسود أوبسيديان فرعوني */
            --border-color: #2d2415; /* برونزي داكن */
            --text-main: #ffffff;
            --text-muted: #94a3b8;
            --egyptian-gold: #d4af37; /* ذهبي ملكي مقبرة توت عنخ آمون */
            --gold-glow: rgba(212, 175, 55, 0.2);
            --ruby-red: #da2c38; /* أحمر ياقوتي للأصناف الراكدة */
        }

        body {
            font-family: 'Cairo', sans-serif;
            background-color: var(--bg-color);
            color: var(--text-main);
            margin: 0;
            padding: 20px;
            background-image: radial-gradient(circle at 50% 10%, #16120a 0%, var(--bg-color) 70%);
        }

        .dashboard-container {
            max-width: 1400px;
            margin: 0 auto;
        }

        .header-section {
            text-align: center;
            margin-bottom: 40px;
            position: relative;
            padding-bottom: 20px;
        }

        /* خط فرعوني منمّق للعنوان */
        .header-section h1 {
            font-family: 'Reem Kufi', serif;
            font-size: 32px;
            color: var(--egyptian-gold);
            margin: 0 0 10px 0;
            text-shadow: 0 2px 10px var(--gold-glow);
            letter-spacing: 1px;
        }
        
        /* زخرفة فرعونية بسيطة تحت العنوان الرئيسي */
        .header-section::after {
            content: "♦  ❖  ♦";
            position: absolute;
            bottom: 0;
            left: 50%;
            transform: translateX(-50%);
            color: var(--egyptian-gold);
            font-size: 14px;
            letter-spacing: 6px;
        }

        .subtitle {
            color: var(--text-muted);
            font-size: 14px;
            margin: 0;
        }

        .section-title {
            font-family: 'Reem Kufi', serif;
            font-size: 20px;
            margin: 35px 0 15px 0;
            color: var(--egyptian-gold);
            display: flex;
            align-items: center;
            gap: 10px;
        }

        /* شبكة الكروت الملكية */
        .stats-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
            gap: 20px;
            margin-bottom: 20px;
        }

        .stat-card {
            background-color: var(--card-bg);
            border: 1px solid var(--border-color);
            border-radius: 8px; /* حواف حادة وراقية مستوحاة من العمارة القديمة */
            padding: 22px;
            box-shadow: 0 4px 20px rgba(0,0,0,0.4);
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            position: relative;
            overflow: hidden;
        }

        /* خط مذهب علوي عند الحركية */
        .stat-card::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 3px;
            background: transparent;
            transition: background 0.3s;
        }

        .stat-card:hover {
            transform: translateY(-4px);
            border-color: var(--egyptian-gold);
            box-shadow: 0 4px 25px var(--gold-glow);
        }

        .stat-card:hover::before {
            background: var(--egyptian-gold);
        }

        .stat-card.danger:hover::before {
            background: var(--ruby-red);
        }

        .stat-card.danger:hover {
            border-color: var(--ruby-red);
            box-shadow: 0 4px 25px rgba(218, 44, 56, 0.15);
        }

        .stat-card .title {
            color: var(--text-muted);
            font-size: 13px;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            margin-bottom: 8px;
        }

        .stat-card .value {
            font-size: 26px;
            font-weight: 700;
            color: var(--egyptian-gold);
        }
        
        .stat-card.danger .value {
            color: var(--ruby-red);
        }

        /* الجرافات والمخططات */
        .charts-grid {
            display: grid;
            grid-template-columns: 2fr 1fr;
            gap: 20px;
            margin-top: 20px;
        }

        @media (max-width: 950px) {
            .charts-grid {
                grid-template-columns: 1fr;
            }
        }

        .chart-card {
            background-color: var(--card-bg);
            border: 1px solid var(--border-color);
            border-radius: 8px;
            padding: 20px;
            box-shadow: 0 4px 20px rgba(0,0,0,0.4);
        }

        .chart-card h3 {
            font-family: 'Reem Kufi', serif;
            margin-top: 0;
            font-size: 18px;
            color: var(--egyptian-gold);
            margin-bottom: 20px;
        }
    </style>
</head>
<body>

<div class="dashboard-container">
    
    <div class="header-section">
        <h1>المركز التحليلي لإحصائيات البازار الملكي 🏺</h1>
        <div class="subtitle">رصد حي لحركة المبيعات، مبادلات العملات السياحية، وتقارير المخزن الأثري</div>
    </div>

    <!-- القسم الأول: المخزن والموردين والقطع الأكثر طلبًا -->
    <div class="section-title">📜 إدارة التحف والحرفيين</div>
    <div class="stats-grid">
        <div class="stat-card">
            <div class="title">عدد الحرفيين والموردين</div>
            <div class="value"><?php echo number_format($total_suppliers); ?> مورد</div>
        </div>
        <div class="stat-card">
            <div class="title">التحف والأصناف المسجلة</div>
            <div class="value"><?php echo number_format($total_products); ?> صنف</div>
        </div>
        <div class="stat-card">
            <div class="title">إجمالي القطع المباعة اليوم</div>
            <div class="value"><?php echo number_format($today_qty); ?> قطعة</div>
        </div>
    </div>
    
    <div class="stats-grid">
        <div class="stat-card">
            <div class="title">المنتج الأكثر مبيعاً 🔥</div>
            <div class="value" style="font-size: 20px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;">
                <?php echo $most_sold_product; ?>
            </div>
        </div>
        <div class="stat-card danger">
            <div class="title">المنتج الأقل مبيعاً (الراكد) 📉</div>
            <div class="value" style="font-size: 20px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;">
                <?php echo $least_sold_product; ?>
            </div>
        </div>
    </div>

    <!-- القسم الثاني: المبيعات بالعملات (دولار، ين، جنيه) -->
    <div class="section-title">💎 مبيعات الخزينة الملكية حسب العملة</div>
    <div class="stats-grid">
        <div class="stat-card">
            <div class="title">المبيعات بالدولار الأمريكي (USD) 💵</div>
            <div class="value">$<?php echo number_format($sales_usd, 2); ?></div>
        </div>
        <div class="stat-card">
            <div class="title">المبيعات بالين الياباني (JPY) 💴</div>
            <div class="value">¥<?php echo number_format($sales_jpy); ?></div>
        </div>
        <div class="stat-card">
            <div class="title">المبيعات بالجنيه المصري (EGP) 🇪🇬</div>
            <div class="value"><?php echo number_format($sales_egp, 2); ?> ج.م</div>
        </div>
    </div>

    <!-- القسم الثالث: الجرافات المذهبة -->
    <div class="section-title">📊 النمو البياني والتدفق المالي</div>
    <div class="charts-grid">
        <!-- شارت الإيرادات -->
        <div class="chart-card">
            <h3>منحنى الإيرادات الأسبوعي للبازار</h3>
            <div id="salesLineChart"></div>
        </div>

        <!-- شارت توزيع الأصناف الأكثر طلباً -->
        <div class="chart-card">
            <h3>المجموعات الأكثر طلباً من السياح</h3>
            <div id="topProductsChart"></div>
        </div>
    </div>
</div>

<script>
    // جراف المبيعات مذهب بالكامل
    const chartDays = <?php echo json_encode($chart_days); ?>;
    const chartTotals = <?php echo json_encode($chart_totals); ?>;

    const salesOptions = {
        series: [{
            name: 'إيرادات البازار',
            data: chartTotals.length ? chartTotals : [0] 
        }],
        chart: {
            type: 'area',
            height: 350,
            toolbar: { show: false },
            background: 'transparent'
        },
        colors: ['#d4af37'], /* لون ذهبي للجراف */
        dataLabels: { enabled: false },
        stroke: { curve: 'smooth', width: 3 },
        fill: {
            type: 'gradient',
            gradient: {
                shadeIntensity: 1,
                opacityFrom: 0.3,
                opacityTo: 0.0,
                stops: [0, 90, 100]
            }
        },
        xaxis: {
            categories: chartDays.length ? chartDays : ['لا يوجد مبيعات'],
            labels: { style: { colors: '#94a3b8', fontFamily: 'Cairo' } }
        },
        yaxis: {
            labels: { style: { colors: '#94a3b8', fontFamily: 'Cairo' } }
        },
        grid: { borderColor: '#2d2415' },
        theme: { mode: 'dark' }
    };

    const salesChart = new ApexCharts(document.querySelector("#salesLineChart"), salesOptions);
    salesChart.render();


    // جراف الدونات مذهب بتدرجات ملكية (ذهبي، برونزي، نحاسي، بني غامق)
    const pieLabels = <?php echo json_encode($pie_labels); ?>;
    const pieValues = <?php echo json_encode($pie_values); ?>;

    const productOptions = {
        series: pieValues.length ? pieValues : [1], 
        chart: {
            type: 'donut',
            height: 330,
            background: 'transparent'
        },
        labels: pieLabels.length ? pieLabels : ['لا يوجد مبيعات بعد'],
        colors: ['#d4af37', '#aa841b', '#806013', '#4a370b'], /* باليتة فرعونية مذهبة */
        theme: { mode: 'dark' },
        legend: {
            position: 'bottom',
            fontFamily: 'Cairo',
            labels: { colors: '#ffffff' }
        },
        dataLabels: {
            style: { fontFamily: 'Cairo' }
        }
    };

    const productChart = new ApexCharts(document.querySelector("#topProductsChart"), productOptions);
    productChart.render();
</script>

</body>
</html>