From b5c08af4979f00d546c131492a2428fbb1af3be6 Mon Sep 17 00:00:00 2001
From: aboodi_abdo <abdulrhman.abdulghaffar001@gmail.com>
Date: Mon, 27 Jul 2026 12:01:46 +0000
Subject: [PATCH] Update q4-siem/dashboard.html

---
 q4-siem/dashboard.html | 155 ++++++++++++++++++++++++++++++++++-------
 1 file changed, 129 insertions(+), 26 deletions(-)
diff --git a/q4-siem/dashboard.html b/q4-siem/dashboard.html
index 48c646e..8800193 100644
--- a/q4-siem/dashboard.html
+++ b/q4-siem/dashboard.html
@@ -2,36 +2,139 @@
 <html lang="ar" dir="rtl">
 <head>
     <meta charset="UTF-8">
-    <title>Ghaymah SIEM Console</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Ghaymah Cloud SIEM Console</title>
     <style>
-        body { background-color: #0f172a; color: #f8fafc; font-family: monospace; padding: 20px; }
-        .alert-box { background-color: #991b1b; padding: 15px; border-radius: 5px; margin-bottom: 20px; }
-        table { width: 100%; border-collapse: collapse; margin-top: 10px; }
-        th, td { border: 1px solid #334155; padding: 10px; text-align: right; }
-        th { background-color: #1e293b; }
+        :root {
+            --bg-main: #0f172a;
+            --bg-card: #1e293b;
+            --border: #334155;
+            --text: #f8fafc;
+            --critical: #ef4444;
+            --high: #f97316;
+            --medium: #eab308;
+        }
+        body {
+            background-color: var(--bg-main);
+            color: var(--text);
+            font-family: system-ui, -apple-system, sans-serif;
+            margin: 0;
+            padding: 24px;
+        }
+        header {
+            border-bottom: 1px solid var(--border);
+            padding-bottom: 16px;
+            margin-bottom: 24px;
+        }
+        h1 { margin: 0; font-size: 24px; color: #38bdf8; }
+        .grid {
+            display: grid;
+            grid-template-columns: 2fr 1fr;
+            gap: 24px;
+        }
+        .card {
+            background-color: var(--bg-card);
+            border: 1px solid var(--border);
+            border-radius: 8px;
+            padding: 20px;
+        }
+        table {
+            width: 100%;
+            border-collapse: collapse;
+            margin-top: 12px;
+        }
+        th, td {
+            padding: 12px;
+            text-align: right;
+            border-bottom: 1px solid var(--border);
+        }
+        th { background-color: #111827; }
+        .badge {
+            padding: 4px 8px;
+            border-radius: 4px;
+            font-size: 12px;
+            font-weight: bold;
+        }
+        .badge-critical { background: rgba(239, 68, 68, 0.2); color: var(--critical); }
+        .badge-high { background: rgba(249, 115, 22, 0.2); color: var(--high); }
+        .badge-medium { background: rgba(234, 179, 8, 0.2); color: var(--medium); }
     </style>
 </head>
 <body>
-    <h2>نظام مراقبة الأحداث الأمنية - Ghaymah SIEM</h2>
-    
-    <div class="alert-box">
-        <strong>[تنبيه حرِج]:</strong> تم كشف محاولات اختراق نشطة على الـ API الخاص بتسجيل الدخول.
+
+    <header>
+        <h1>Ghaymah Cloud SIEM Security Console</h1>
+        <p>نظام المراقبة والتحليل اللحظي للسجلات السحابية</p>
+    </header>
+
+    <div class="grid">
+        <div class="card">
+            <h3>أحدث التنبيهات الأمنية (Active Security Alerts)</h3>
+            <table>
+                <thead>
+                    <tr>
+                        <th>المصدر</th>
+                        <th>IP المهاجم</th>
+                        <th>نوع التهديد</th>
+                        <th>الخطورة</th>
+                    </tr>
+                </thead>
+                <tbody id="alerts-tbody">
+                    <tr>
+                        <td>Web Logs (Nginx)</td>
+                        <td>185.220.101.5</td>
+                        <td>SQL Injection Attempt</td>
+                        <td><span class="badge badge-critical">Critical</span></td>
+                    </tr>
+                    <tr>
+                        <td>Auth Logs (SSH)</td>
+                        <td>45.133.1.22</td>
+                        <td>SSH Brute Force Attempt</td>
+                        <td><span class="badge badge-high">High</span></td>
+                    </tr>
+                </tbody>
+            </table>
+        </div>
+
+        <div class="card">
+            <h3>عناوين IP قيد الحظر / المراقبة</h3>
+            <ul style="list-style: none; padding: 0;" id="ip-list">
+                <li style="padding: 10px 0; border-bottom: 1px solid var(--border);">
+                    <strong style="color: var(--critical);">185.220.101.5</strong> - (تم الحظر التلقائي عبر WAF)
+                </li>
+                <li style="padding: 10px 0; border-bottom: 1px solid var(--border);">
+                    <strong style="color: var(--high);">45.133.1.22</strong> - (محاولات متكررة)
+                </li>
+            </ul>
+        </div>
     </div>
 
-    <h3>عناوين IP المشبوهة</h3>
-    <table>
-        <tr>
-            <th>عنوان IP</th>
-            <th>نوع التهديد</th>
-            <th>العدد</th>
-            <th>الإجراء</th>
-        </tr>
-        <tr>
-            <td>192.168.1.45</td>
-            <td>Brute Force / API</td>
-            <td>18 محاولة</td>
-            <td><b style="color: #ef4444;">مستبعد تلقائياً</b></td>
-        </tr>
-    </table>
+    <script>
+        // آلية جلب البيانات وتحديث اللوحة تلقائياً
+        async function fetchAlerts() {
+            try {
+                const response = await fetch('/var/log/siem_logs/siem_alerts.json');
+                if (!response.ok) return;
+                const alerts = await response.json();
+                
+                const tbody = document.getElementById('alerts-tbody');
+                tbody.innerHTML = '';
+                
+                alerts.forEach(alert => {
+                    const row = `<tr>
+                        <td>${alert.source}</td>
+                        <td>${alert.ip}</td>
+                        <td>${alert.type}</td>
+                        <td><span class="badge badge-${alert.severity.toLowerCase()}">${alert.severity}</span></td>
+                    </tr>`;
+                    tbody.insertAdjacentHTML('beforeend', row);
+                });
+            } catch (error) {
+                console.log("Waiting for new SIEM log generation...");
+            }
+        }
+        // تحديث كل 30 ثانية
+        setInterval(fetchAlerts, 30000);
+    </script>
 </body>
-</html>
+</html>
\ No newline at end of file

المصدر	IP المهاجم	نوع التهديد	الخطورة
Web Logs (Nginx)	185.220.101.5	SQL Injection Attempt	Critical
Auth Logs (SSH)	45.133.1.22	SSH Brute Force Attempt	High