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

<?php $__template->section('page_actions'); ?>
<a href="/procurement" class="btn btn-outline"><i data-lucide="arrow-right" style="width:15px;height:15px;vertical-align:middle;margin-left:4px;"></i> العودة</a>
<?php $__template->endSection(); ?>

<?php $__template->section('content'); ?>

<!-- Filters -->
<div class="card" style="margin-bottom:20px;padding:15px;">
    <form method="GET" action="/procurement/reports/purchase-volume" style="display:flex;gap:10px;align-items:end;flex-wrap:wrap;">
        <div><label class="form-label" style="font-size:12px;">من</label><input type="date" name="date_from" value="<?= e($filters['date_from'] ?? '') ?>" class="form-input"></div>
        <div><label class="form-label" style="font-size:12px;">إلى</label><input type="date" name="date_to" value="<?= e($filters['date_to'] ?? '') ?>" class="form-input"></div>
        <button type="submit" class="btn btn-outline"><i data-lucide="search" style="width:16px;height:16px;vertical-align:middle;"></i> بحث</button>
    </form>
</div>

<!-- Totals -->
<div style="display:grid;grid-template-columns:1fr 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:36px;font-weight:800;color:#0D7377;"><?= (int) ($totals['total_orders'] ?? 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:36px;font-weight:800;color:#D97706;direction:ltr;"><?= money($totals['total_value'] ?? 0) ?></div>
    </div>
</div>

<!-- Monthly Volume -->
<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="bar-chart-3" style="width:18px;height:18px;color:#0D7377;"></i>
        <h3 style="margin:0;color:#0D7377;font-size:15px;">حجم المشتريات الشهري</h3>
    </div>
    <?php if (!empty($monthly)): ?>
    <div class="table-responsive">
        <table class="data-table">
            <thead><tr><th>الشهر</th><th>عدد الطلبات</th><th>إجمالي القيمة</th><th>الرسم البياني</th></tr></thead>
            <tbody>
                <?php
                $maxValue = 0;
                foreach ($monthly as $m) { $maxValue = max($maxValue, (float) $m['total_value']); }
                ?>
                <?php foreach ($monthly as $m): ?>
                <?php $pct = $maxValue > 0 ? ((float) $m['total_value'] / $maxValue * 100) : 0; ?>
                <tr>
                    <td style="font-weight:600;"><?= e($m['month']) ?></td>
                    <td style="font-weight:600;"><?= (int) $m['order_count'] ?></td>
                    <td style="font-weight:700;direction:ltr;text-align:left;"><?= money($m['total_value']) ?></td>
                    <td style="width:40%;">
                        <div style="background:#E5E7EB;border-radius:4px;height:20px;overflow:hidden;">
                            <div style="background:#0D7377;height:100%;width:<?= round($pct, 1) ?>%;border-radius:4px;"></div>
                        </div>
                    </td>
                </tr>
                <?php endforeach; ?>
            </tbody>
        </table>
    </div>
    <?php else: ?>
    <div style="padding:40px;text-align:center;color:#6B7280;">لا توجد بيانات في هذه الفترة</div>
    <?php endif; ?>
</div>

<!-- Top Suppliers -->
<div style="display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-bottom:20px;">
    <div class="card">
        <div style="padding:15px 20px;border-bottom:1px solid #E5E7EB;display:flex;align-items:center;gap:8px;">
            <i data-lucide="truck" style="width:18px;height:18px;color:#D97706;"></i>
            <h3 style="margin:0;color:#D97706;font-size:15px;">أكبر الموردين</h3>
        </div>
        <?php if (!empty($topSuppliers)): ?>
        <div class="table-responsive">
            <table class="data-table">
                <thead><tr><th>المورد</th><th>الطلبات</th><th>القيمة</th></tr></thead>
                <tbody>
                    <?php foreach ($topSuppliers as $s): ?>
                    <tr>
                        <td style="font-weight:600;"><?= e($s['name_ar']) ?></td>
                        <td><?= (int) $s['order_count'] ?></td>
                        <td style="font-weight:700;direction:ltr;text-align:left;"><?= money($s['total_value']) ?></td>
                    </tr>
                    <?php endforeach; ?>
                </tbody>
            </table>
        </div>
        <?php else: ?>
        <div style="padding:30px;text-align:center;color:#6B7280;">لا توجد بيانات</div>
        <?php endif; ?>
    </div>

    <!-- Top Items -->
    <div class="card">
        <div style="padding:15px 20px;border-bottom:1px solid #E5E7EB;display:flex;align-items:center;gap:8px;">
            <i data-lucide="package" style="width:18px;height:18px;color:#2563EB;"></i>
            <h3 style="margin:0;color:#2563EB;font-size:15px;">أكثر الأصناف شراءً</h3>
        </div>
        <?php if (!empty($topItems)): ?>
        <div class="table-responsive">
            <table class="data-table">
                <thead><tr><th>الصنف</th><th>الكمية</th><th>القيمة</th></tr></thead>
                <tbody>
                    <?php foreach ($topItems as $it): ?>
                    <tr>
                        <td style="font-weight:600;"><?= e($it['name_ar']) ?><?php if (!empty($it['sku'])): ?><br><code style="font-size:11px;background:#F3F4F6;padding:2px 6px;border-radius:4px;"><?= e($it['sku']) ?></code><?php endif; ?></td>
                        <td style="direction:ltr;text-align:left;"><?= number_format((float) $it['total_qty'], 3) ?></td>
                        <td style="font-weight:700;direction:ltr;text-align:left;"><?= money($it['total_value']) ?></td>
                    </tr>
                    <?php endforeach; ?>
                </tbody>
            </table>
        </div>
        <?php else: ?>
        <div style="padding:30px;text-align:center;color:#6B7280;">لا توجد بيانات</div>
        <?php endif; ?>
    </div>
</div>

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