<?= $this->extend('layouts/enterprise') ?>

<?= $this->section('content') ?>

<?= view('partials/workspace_hero', [
    'workspaceCrumbPill'    => 'Reports',
    'workspaceCrumbCurrent' => 'Lead Conversion',
    'workspaceTitle'        => 'Lead Conversion Report',
    'workspaceDesc'         => 'Funnel health, source quality, and conversion speed across the sales pipeline.',
]) ?>

<?= view('Modules\Sale\Views\reports\_kpis', ['kpis' => $report['kpis'] ?? []]) ?>

<div class="enterprise-data-panel mb-4">
    <div class="enterprise-data-panel__head">
        <h2 class="enterprise-data-panel__title">Filters</h2>
        <p class="enterprise-data-panel__subtitle">Filter by period and lead source.</p>
    </div>
    <?= view('Modules\Sale\Views\reports\_filters', [
        'actionPath'  => 'sale/reports/lead-conversion',
        'filters'     => $filters,
        'sources'     => $sources,
        'showCompany' => false,
        'showSource'  => true,
    ]) ?>
</div>

<section class="enterprise-charts-grid mb-4">
    <article class="enterprise-chart-card">
        <div class="enterprise-chart-header">
            <h3 class="enterprise-chart-title">CONVERSION FUNNEL</h3>
        </div>
        <div class="enterprise-chart-body">
            <canvas id="leadFunnelChart" height="220"></canvas>
        </div>
    </article>
    <article class="enterprise-chart-card">
        <div class="enterprise-chart-header">
            <h3 class="enterprise-chart-title">LEADS BY SOURCE</h3>
        </div>
        <div class="enterprise-chart-body">
            <canvas id="leadSourceChart" height="220"></canvas>
        </div>
    </article>
</section>

<div class="row g-4 mb-4">
    <div class="col-lg-6">
        <div class="enterprise-data-panel h-100">
            <div class="enterprise-data-panel__head">
                <h2 class="enterprise-data-panel__title">By Source</h2>
                <p class="enterprise-data-panel__subtitle">Volume, conversion rate, and estimated value.</p>
            </div>
            <div class="enterprise-data-panel__body">
                <div class="table-responsive">
                    <table class="enterprise-data-table">
                        <thead>
                            <tr>
                                <th>Source</th>
                                <th class="text-end">Leads</th>
                                <th class="text-end">Converted</th>
                                <th class="text-end">Rate</th>
                                <th class="text-end">Est. Value</th>
                            </tr>
                        </thead>
                        <tbody>
                            <?php foreach ($report['bySource'] ?? [] as $row): ?>
                                <tr>
                                    <td class="enterprise-data-table__primary"><?= esc($row['label']) ?></td>
                                    <td class="text-end"><?= (int) $row['total'] ?></td>
                                    <td class="text-end"><?= (int) $row['converted'] ?></td>
                                    <td class="text-end"><?= number_format((float) $row['conversion_rate'], 1) ?>%</td>
                                    <td class="text-end"><?= number_format((float) $row['estimated_value'], 2) ?></td>
                                </tr>
                            <?php endforeach; ?>
                            <?php if (empty($report['bySource'])): ?>
                                <tr><td colspan="5" class="text-center text-muted py-4">No leads in this period.</td></tr>
                            <?php endif; ?>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
    <div class="col-lg-6">
        <div class="enterprise-data-panel h-100">
            <div class="enterprise-data-panel__head">
                <h2 class="enterprise-data-panel__title">By Assignee</h2>
                <p class="enterprise-data-panel__subtitle">Owner performance on lead conversion.</p>
            </div>
            <div class="enterprise-data-panel__body">
                <div class="table-responsive">
                    <table class="enterprise-data-table">
                        <thead>
                            <tr>
                                <th>Assignee</th>
                                <th class="text-end">Leads</th>
                                <th class="text-end">Converted</th>
                                <th class="text-end">Rate</th>
                            </tr>
                        </thead>
                        <tbody>
                            <?php foreach ($report['byAssignee'] ?? [] as $row): ?>
                                <tr>
                                    <td class="enterprise-data-table__primary"><?= esc($row['label']) ?></td>
                                    <td class="text-end"><?= (int) $row['total'] ?></td>
                                    <td class="text-end"><?= (int) $row['converted'] ?></td>
                                    <td class="text-end"><?= number_format((float) $row['conversion_rate'], 1) ?>%</td>
                                </tr>
                            <?php endforeach; ?>
                            <?php if (empty($report['byAssignee'])): ?>
                                <tr><td colspan="4" class="text-center text-muted py-4">No assignee data.</td></tr>
                            <?php endif; ?>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="enterprise-data-panel">
    <div class="enterprise-data-panel__head">
        <h2 class="enterprise-data-panel__title">Recent Conversions</h2>
        <p class="enterprise-data-panel__subtitle">
            <?php
            $types = $report['typeSplit'] ?? [];
            if ($types !== []) {
                $parts = [];
                foreach ($types as $t) {
                    $parts[] = (int) $t['total'] . ' ' . esc($t['conversion_type']);
                }
                echo implode(' · ', $parts);
            } else {
                echo 'Latest converted leads in the selected period.';
            }
            ?>
        </p>
    </div>
    <div class="enterprise-data-panel__body">
        <div class="table-responsive">
            <table class="enterprise-data-table">
                <thead>
                    <tr>
                        <th>Lead</th>
                        <th>Company</th>
                        <th>Source</th>
                        <th>Type</th>
                        <th>Converted By</th>
                        <th class="text-end">Est. Value</th>
                        <th>Converted At</th>
                    </tr>
                </thead>
                <tbody>
                    <?php foreach ($report['recent'] ?? [] as $row): ?>
                        <tr>
                            <td class="enterprise-data-table__primary">
                                <?= esc(trim(($row['first_name'] ?? '') . ' ' . ($row['last_name'] ?? ''))) ?>
                            </td>
                            <td><?= esc($row['company_name'] ?: '—') ?></td>
                            <td><?= esc($row['source_name'] ?: '—') ?></td>
                            <td><?= esc(ucfirst($row['conversion_type'] ?? '')) ?></td>
                            <td><?= esc(trim($row['converted_by_name'] ?? '') ?: '—') ?></td>
                            <td class="text-end"><?= number_format((float) ($row['estimated_value'] ?? 0), 2) ?></td>
                            <td><?= esc($row['converted_at'] ?? '—') ?></td>
                        </tr>
                    <?php endforeach; ?>
                    <?php if (empty($report['recent'])): ?>
                        <tr><td colspan="7" class="text-center text-muted py-5">No conversions in this period.</td></tr>
                    <?php endif; ?>
                </tbody>
            </table>
        </div>
    </div>
</div>

<?= $this->endSection() ?>

<?= $this->section('scripts') ?>
<script>
window.saleReportCharts = <?= json_encode($report['charts'] ?? [], JSON_HEX_TAG | JSON_HEX_APOS | JSON_HEX_QUOT | JSON_HEX_AMP) ?>;
</script>
<script src="<?= base_url('assets/js/sale-reports.js') ?>"></script>
<?= $this->endSection() ?>
