<?php $__template->layout('Layout.main'); ?>
<?php $__template->section('title'); ?>الجدولة الذكية<?php $__template->endSection(); ?>
<?php $__template->section('page_actions'); ?>
<a href="/scheduling/rules" class="btn btn-outline">القواعد</a>
<a href="/scheduling/conflicts" class="btn btn-outline">التعارضات</a>
<a href="/scheduling/requests" class="btn btn-primary">طلبات التغيير</a>
<?php $__template->endSection(); ?>
<?php $__template->section('content'); ?>

<!-- Stats -->
<div style="display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-bottom:25px;">
    <div class="card" style="padding:20px;text-align:center;">
        <div style="font-size:28px;font-weight:700;color:#DC2626;"><?= $stats['pending_requests'] ?></div>
        <div style="font-size:13px;color:#6B7280;">طلبات معلقة</div>
    </div>
    <div class="card" style="padding:20px;text-align:center;">
        <div style="font-size:28px;font-weight:700;color:#F59E0B;"><?= $stats['open_conflicts'] ?></div>
        <div style="font-size:13px;color:#6B7280;">تعارضات مفتوحة</div>
    </div>
    <div class="card" style="padding:20px;text-align:center;">
        <div style="font-size:28px;font-weight:700;color:#1e3a5f;"><?= $stats['active_rules'] ?></div>
        <div style="font-size:13px;color:#6B7280;">قواعد نشطة</div>
    </div>
    <div class="card" style="padding:20px;text-align:center;">
        <div style="font-size:28px;font-weight:700;color:#059669;"><?= $stats['resolved_today'] ?></div>
        <div style="font-size:13px;color:#6B7280;">تم حلها اليوم</div>
    </div>
</div>

<div style="display:grid;grid-template-columns:1fr 1fr;gap:20px;">
    <!-- Pending Change Requests -->
    <div class="card" style="padding:20px;">
        <h4 style="margin-bottom:15px;">طلبات التغيير المعلقة</h4>
        <?php if (empty($pendingRequests)): ?>
        <p style="color:#6B7280;text-align:center;padding:20px;">لا توجد طلبات معلقة</p>
        <?php else: ?>
        <div style="max-height:350px;overflow-y:auto;">
            <?php foreach (array_slice($pendingRequests, 0, 8) as $req): ?>
            <div style="padding:10px;border-bottom:1px solid #F3F4F6;">
                <div style="display:flex;justify-content:space-between;align-items:center;">
                    <div>
                        <span style="font-weight:600;font-size:13px;"><?= e($req['requester_name'] ?? '') ?></span>
                        <span style="font-size:11px;background:#EDE9FE;color:#7C3AED;padding:2px 6px;border-radius:4px;margin-right:6px;">
                            <?= $req['request_type'] === 'reschedule' ? 'إعادة جدولة' : ($req['request_type'] === 'cancel' ? 'إلغاء' : $req['request_type']) ?>
                        </span>
                    </div>
                    <span style="font-size:11px;color:#6B7280;"><?= e(substr($req['created_at'] ?? '', 0, 10)) ?></span>
                </div>
                <div style="font-size:12px;color:#6B7280;margin-top:4px;"><?= e($req['reason_ar'] ?? '') ?></div>
                <div style="margin-top:6px;display:flex;gap:5px;">
                    <form method="POST" action="/scheduling/requests/<?= (int) $req['id'] ?>/approve" style="display:inline;"><?= csrf_field() ?><button type="submit" class="btn btn-sm btn-primary">قبول</button></form>
                    <form method="POST" action="/scheduling/requests/<?= (int) $req['id'] ?>/reject" style="display:inline;"><?= csrf_field() ?><button type="submit" class="btn btn-sm btn-outline" style="color:#DC2626;">رفض</button></form>
                </div>
            </div>
            <?php endforeach; ?>
        </div>
        <?php if (count($pendingRequests) > 8): ?>
        <a href="/scheduling/requests" style="display:block;text-align:center;margin-top:10px;font-size:13px;color:#1e3a5f;">عرض الكل (<?= count($pendingRequests) ?>)</a>
        <?php endif; ?>
        <?php endif; ?>
    </div>

    <!-- Recent Conflicts -->
    <div class="card" style="padding:20px;">
        <h4 style="margin-bottom:15px;">التعارضات الأخيرة</h4>
        <?php if (empty($recentConflicts)): ?>
        <p style="color:#6B7280;text-align:center;padding:20px;">لا توجد تعارضات مفتوحة</p>
        <?php else: ?>
        <div style="max-height:350px;overflow-y:auto;">
            <?php foreach ($recentConflicts as $c): ?>
            <div style="padding:10px;border-bottom:1px solid #F3F4F6;">
                <div style="display:flex;justify-content:space-between;align-items:center;">
                    <span style="font-size:12px;padding:2px 8px;border-radius:4px;background:<?= $c['severity'] === 'error' ? '#FEE2E2' : '#FEF3C7' ?>;color:<?= $c['severity'] === 'error' ? '#DC2626' : '#D97706' ?>;">
                        <?= $c['severity'] === 'error' ? 'خطأ' : 'تحذير' ?>
                    </span>
                    <span style="font-size:11px;color:#6B7280;"><?= e($c['conflict_date'] ?? '') ?></span>
                </div>
                <div style="font-size:13px;margin-top:4px;"><?= e($c['description_ar'] ?? '') ?></div>
                <div style="font-size:11px;color:#6B7280;margin-top:2px;">
                    <?= e($c['conflict_time_start'] ? substr($c['conflict_time_start'], 0, 5) : '') ?> - <?= e($c['conflict_time_end'] ? substr($c['conflict_time_end'], 0, 5) : '') ?>
                </div>
            </div>
            <?php endforeach; ?>
        </div>
        <?php endif; ?>
    </div>
</div>

<!-- Conflict Checker Tool -->
<div class="card" style="padding:20px;margin-top:20px;">
    <h4 style="margin-bottom:15px;">فحص التعارضات</h4>
    <form id="conflictCheckForm" style="display:grid;grid-template-columns:repeat(5,1fr);gap:10px;align-items:end;">
        <?= csrf_field() ?>
        <div><label class="form-label">المدرب</label><input type="number" name="coach_id" class="form-input" placeholder="رقم المدرب"></div>
        <div><label class="form-label">المرفق</label><input type="number" name="facility_id" class="form-input" placeholder="رقم المرفق"></div>
        <div><label class="form-label">التاريخ</label><input type="date" name="date" class="form-input" required></div>
        <div><label class="form-label">من - إلى</label><div style="display:flex;gap:5px;"><input type="time" name="start_time" class="form-input" required><input type="time" name="end_time" class="form-input" required></div></div>
        <div><button type="submit" class="btn btn-primary" style="width:100%;">فحص</button></div>
    </form>
    <div id="conflictResults" style="margin-top:15px;display:none;"></div>
</div>

<script>
document.getElementById('conflictCheckForm').addEventListener('submit', function(e) {
    e.preventDefault();
    const form = this;
    const resultsDiv = document.getElementById('conflictResults');
    const formData = new FormData(form);

    fetch('/scheduling/check-conflicts', { method: 'POST', body: formData })
        .then(r => r.json())
        .then(data => {
            resultsDiv.style.display = 'block';
            let html = '';
            if (data.conflicts.length === 0) {
                html = '<div style="padding:15px;background:#F0FDF4;border-radius:8px;color:#059669;font-weight:600;">لا توجد تعارضات - الموعد متاح</div>';
            } else {
                html = '<div style="padding:10px;background:#FEF2F2;border-radius:8px;margin-bottom:10px;"><strong style="color:#DC2626;">تعارضات (' + data.conflicts.length + '):</strong>';
                data.conflicts.forEach(function(c) {
                    html += '<div style="padding:5px 0;font-size:13px;border-bottom:1px solid #FECACA;">' + c.description + '</div>';
                });
                html += '</div>';
            }
            if (data.suggestions && data.suggestions.length > 0) {
                html += '<div style="padding:10px;background:#F0F9FF;border-radius:8px;"><strong style="color:#1e3a5f;">بدائل مقترحة:</strong>';
                data.suggestions.forEach(function(s) {
                    html += '<div style="padding:4px 0;font-size:13px;">' + s.day_name + ' ' + s.date + ' (' + s.start_time.substring(0,5) + '-' + s.end_time.substring(0,5) + ')' + (s.warnings > 0 ? ' <span style="color:#F59E0B;">⚠ ' + s.warnings + '</span>' : '') + '</div>';
                });
                html += '</div>';
            }
            resultsDiv.innerHTML = html;
        });
});
</script>
<?php $__template->endSection(); ?>
