<?php $__template->layout('Layout.main'); ?>
<?php $__template->section('title'); ?>لوحة تحكم المشتريات<?php $__template->endSection(); ?>

<?php $__template->section('content'); ?>
<?php
$pr = $prCounts ?? [];
$po = $poCounts ?? [];
$grn = $grnCounts ?? [];
$inv = $invoiceCounts ?? [];
$overdue = $overdueAP ?? [];
?>

<!-- Summary Cards Row 1 -->
<div style="display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-bottom:20px;">
    <div class="card" style="padding:20px;">
        <div style="display:flex;align-items:center;gap:10px;margin-bottom:12px;">
            <div style="width:40px;height:40px;border-radius:10px;background:#F0FDFA;display:flex;align-items:center;justify-content:center;">
                <i data-lucide="file-text" style="width:20px;height:20px;color:#0D7377;"></i>
            </div>
            <div>
                <div style="font-size:12px;color:#6B7280;">طلبات شراء مفتوحة</div>
                <div style="font-size:24px;font-weight:800;color:#0D7377;"><?= (int) ($pr['open_total'] ?? 0) ?></div>
            </div>
        </div>
        <div style="font-size:12px;color:#D97706;"><?= (int) ($pr['pending_approval'] ?? 0) ?> بانتظار الاعتماد</div>
    </div>

    <div class="card" style="padding:20px;">
        <div style="display:flex;align-items:center;gap:10px;margin-bottom:12px;">
            <div style="width:40px;height:40px;border-radius:10px;background:#FFF7ED;display:flex;align-items:center;justify-content:center;">
                <i data-lucide="shopping-cart" style="width:20px;height:20px;color:#D97706;"></i>
            </div>
            <div>
                <div style="font-size:12px;color:#6B7280;">أوامر شراء مفتوحة</div>
                <div style="font-size:24px;font-weight:800;color:#D97706;"><?= (int) ($po['open_pos'] ?? 0) ?></div>
            </div>
        </div>
        <div style="font-size:12px;color:#6B7280;">قيمة: <span style="font-weight:700;direction:ltr;"><?= money($po['open_value'] ?? 0) ?></span></div>
    </div>

    <div class="card" style="padding:20px;">
        <div style="display:flex;align-items:center;gap:10px;margin-bottom:12px;">
            <div style="width:40px;height:40px;border-radius:10px;background:#EFF6FF;display:flex;align-items:center;justify-content:center;">
                <i data-lucide="clipboard-check" style="width:20px;height:20px;color:#2563EB;"></i>
            </div>
            <div>
                <div style="font-size:12px;color:#6B7280;">GRN بانتظار الفحص</div>
                <div style="font-size:24px;font-weight:800;color:#2563EB;"><?= (int) ($grn['pending'] ?? 0) ?></div>
            </div>
        </div>
        <div style="font-size:12px;color:#6B7280;"><?= (int) ($po['awaiting_receipt'] ?? 0) ?> أمر بانتظار الاستلام</div>
    </div>

    <div class="card" style="padding:20px;">
        <div style="display:flex;align-items:center;gap:10px;margin-bottom:12px;">
            <div style="width:40px;height:40px;border-radius:10px;background:#FEE2E2;display:flex;align-items:center;justify-content:center;">
                <i data-lucide="alert-triangle" style="width:20px;height:20px;color:#DC2626;"></i>
            </div>
            <div>
                <div style="font-size:12px;color:#6B7280;">فواتير متأخرة</div>
                <div style="font-size:24px;font-weight:800;color:#DC2626;"><?= (int) ($overdue['cnt'] ?? 0) ?></div>
            </div>
        </div>
        <div style="font-size:12px;color:#DC2626;">مبلغ: <span style="font-weight:700;direction:ltr;"><?= money($overdue['total'] ?? 0) ?></span></div>
    </div>
</div>

<!-- Summary Cards Row 2 -->
<div style="display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-bottom:20px;">
    <div class="card" style="padding:20px;text-align:center;background:linear-gradient(135deg, #0D737710, #0D737720);">
        <div style="font-size:13px;color:#6B7280;margin-bottom:6px;">فواتير بانتظار المعالجة</div>
        <div style="font-size:32px;font-weight:800;color:#0D7377;"><?= (int) ($inv['pending'] ?? 0) ?></div>
    </div>
    <div class="card" style="padding:20px;text-align:center;background:linear-gradient(135deg, #D9770610, #D9770620);">
        <div style="font-size:13px;color:#6B7280;margin-bottom:6px;">فواتير بها تباين</div>
        <div style="font-size:32px;font-weight:800;color:#D97706;"><?= (int) ($inv['discrepancies'] ?? 0) ?></div>
    </div>
    <div class="card" style="padding:20px;text-align:center;background:linear-gradient(135deg, #DC262610, #DC262620);">
        <div style="font-size:13px;color:#6B7280;margin-bottom:6px;">قيمة فواتير غير مدفوعة</div>
        <div style="font-size:32px;font-weight:800;color:#DC2626;direction:ltr;"><?= money($inv['unpaid_value'] ?? 0) ?></div>
    </div>
</div>

<!-- Quick Links -->
<div class="card" style="margin-bottom:20px;">
    <div style="padding:15px 20px;border-bottom:1px solid #E5E7EB;">
        <h3 style="margin:0;color:#0D7377;font-size:15px;">إجراءات سريعة</h3>
    </div>
    <div style="padding:15px 20px;display:flex;gap:10px;flex-wrap:wrap;">
        <a href="/procurement/requisitions/create" class="btn btn-primary" style="font-size:13px;"><i data-lucide="file-plus" style="width:14px;height:14px;vertical-align:middle;margin-left:4px;"></i> طلب شراء جديد</a>
        <a href="/procurement/grn/create" class="btn" style="font-size:13px;background:#2563EB;color:#fff;border:none;"><i data-lucide="package-check" style="width:14px;height:14px;vertical-align:middle;margin-left:4px;"></i> استلام بضاعة</a>
        <a href="/procurement/invoices/create" class="btn" style="font-size:13px;background:#D97706;color:#fff;border:none;"><i data-lucide="receipt" style="width:14px;height:14px;vertical-align:middle;margin-left:4px;"></i> فاتورة مورد</a>
        <a href="/procurement/payments/create" class="btn" style="font-size:13px;background:#059669;color:#fff;border:none;"><i data-lucide="banknote" style="width:14px;height:14px;vertical-align:middle;margin-left:4px;"></i> دفعة مورد</a>
    </div>
</div>

<!-- Recent Activity -->
<div class="card" style="margin-bottom:20px;">
    <div style="padding:15px 20px;border-bottom:1px solid #E5E7EB;display:flex;align-items:center;gap:8px;">
        <i data-lucide="activity" style="width:18px;height:18px;color:#6B7280;"></i>
        <h3 style="margin:0;color:#6B7280;font-size:15px;">آخر النشاطات</h3>
    </div>
    <?php if (!empty($recentActivity)): ?>
    <div class="table-responsive">
        <table class="data-table">
            <thead><tr><th>النوع</th><th>الرقم</th><th>الحالة</th><th>المبلغ</th><th>التاريخ</th></tr></thead>
            <tbody>
                <?php
                $typeLabels = ['pr' => 'طلب شراء', 'grn' => 'إذن استلام', 'invoice' => 'فاتورة مورد'];
                $typeColors = ['pr' => '#0D7377', 'grn' => '#2563EB', 'invoice' => '#D97706'];
                $typeIcons  = ['pr' => 'file-text', 'grn' => 'package-check', 'invoice' => 'receipt'];
                $statusLabels = [
                    'draft' => 'مسودة', 'submitted' => 'مُقدّم', 'approved' => 'معتمد',
                    'rejected' => 'مرفوض', 'converted' => 'تم التحويل', 'cancelled' => 'ملغي',
                    'inspecting' => 'قيد الفحص', 'accepted' => 'مقبول', 'partial_accept' => 'قبول جزئي',
                    'verified' => 'تم التحقق', 'paid' => 'مدفوعة', 'partial_paid' => 'مدفوعة جزئياً',
                ];
                ?>
                <?php foreach ($recentActivity as $item): ?>
                <?php $t = $item['type'] ?? ''; ?>
                <tr>
                    <td>
                        <span style="display:inline-flex;align-items:center;gap:4px;color:<?= $typeColors[$t] ?? '#6B7280' ?>;font-size:13px;font-weight:600;">
                            <i data-lucide="<?= $typeIcons[$t] ?? 'file' ?>" style="width:14px;height:14px;"></i>
                            <?= e($typeLabels[$t] ?? $t) ?>
                        </span>
                    </td>
                    <td style="font-weight:600;"><code style="font-size:12px;background:#F3F4F6;padding:2px 8px;border-radius:4px;"><?= e($item['doc_number'] ?? '') ?></code></td>
                    <td><span style="font-size:12px;color:#6B7280;"><?= e($statusLabels[$item['status'] ?? ''] ?? ($item['status'] ?? '')) ?></span></td>
                    <td style="font-weight:700;direction:ltr;text-align:left;"><?= money($item['amount'] ?? 0) ?></td>
                    <td style="font-size:12px;color:#6B7280;"><?= e(substr($item['created_at'] ?? '', 0, 16)) ?></td>
                </tr>
                <?php endforeach; ?>
            </tbody>
        </table>
    </div>
    <?php else: ?>
    <div style="padding:40px 20px;text-align:center;color:#6B7280;">
        <p style="margin:0;">لا توجد نشاطات حديثة</p>
    </div>
    <?php endif; ?>
</div>

<!-- Report Links -->
<div class="card">
    <div style="padding:15px 20px;border-bottom:1px solid #E5E7EB;">
        <h3 style="margin:0;color:#0D7377;font-size:15px;">التقارير</h3>
    </div>
    <div style="padding:15px 20px;display:grid;grid-template-columns:repeat(4,1fr);gap:12px;">
        <a href="/procurement/reports/purchase-volume" style="text-decoration:none;">
            <div style="padding:15px;border:1px solid #E5E7EB;border-radius:8px;text-align:center;transition:all 0.2s;">
                <i data-lucide="bar-chart-3" style="width:24px;height:24px;color:#0D7377;margin-bottom:8px;"></i>
                <div style="font-size:13px;font-weight:600;color:#1F2937;">حجم المشتريات</div>
            </div>
        </a>
        <a href="/procurement/reports/supplier-performance" style="text-decoration:none;">
            <div style="padding:15px;border:1px solid #E5E7EB;border-radius:8px;text-align:center;transition:all 0.2s;">
                <i data-lucide="award" style="width:24px;height:24px;color:#D97706;margin-bottom:8px;"></i>
                <div style="font-size:13px;font-weight:600;color:#1F2937;">أداء الموردين</div>
            </div>
        </a>
        <a href="/procurement/reports/match-status" style="text-decoration:none;">
            <div style="padding:15px;border:1px solid #E5E7EB;border-radius:8px;text-align:center;transition:all 0.2s;">
                <i data-lucide="git-compare" style="width:24px;height:24px;color:#2563EB;margin-bottom:8px;"></i>
                <div style="font-size:13px;font-weight:600;color:#1F2937;">حالة المطابقة</div>
            </div>
        </a>
        <a href="/procurement/reports/overdue-invoices" style="text-decoration:none;">
            <div style="padding:15px;border:1px solid #E5E7EB;border-radius:8px;text-align:center;transition:all 0.2s;">
                <i data-lucide="clock" style="width:24px;height:24px;color:#DC2626;margin-bottom:8px;"></i>
                <div style="font-size:13px;font-weight:600;color:#1F2937;">فواتير متأخرة</div>
            </div>
        </a>
    </div>
</div>

<script>document.addEventListener('DOMContentLoaded', function() { if (typeof lucide !== 'undefined') lucide.createIcons(); });</script>
<?php $__template->endSection(); ?>
