<?php /** @var \Autogedal\StockLog\Block\Adminhtml\History $block */ $sku = $block->escapeHtml($block->getSku()); $history = $block->getHistoryData(); $chart = $block->getChartJson(); ?> <div class="admin__page-section"><div style="margin-bottom: 16px;"><a href="<?= $block->escapeUrl($block->getBackUrl()) ?>" class="action-default scalable back"><span><?= $block->escapeHtml(__('Back to Stock Log')) ?></span></a></div><div class="admin__page-section-title"><span class="title"><?= $block->escapeHtml(__('Stock History — SKU: %1', $sku)) ?></span> <span style="margin-left:16px;color:#666;"><?= count($history) ?> <?= $block->escapeHtml(__('entries')) ?></span></div><?php if (empty($history)): ?> <p><?= $block->escapeHtml(__('No stock changes recorded for this SKU yet.')) ?></p><?php else: ?> <div style="background:#fff;padding:20px;border:1px solid #d6d6d6;border-radius:4px;margin-bottom:24px;"><canvas id="stockHistoryChart" height="80"></canvas></div><div class="admin__data-grid-wrap"><table class="data-grid" style="width:100%"><thead><tr><th class="data-grid-th"><?= $block->escapeHtml(__('Date')) ?></th><th class="data-grid-th"><?= $block->escapeHtml(__('Qty Before')) ?></th><th class="data-grid-th"><?= $block->escapeHtml(__('Qty After')) ?></th><th class="data-grid-th"><?= $block->escapeHtml(__('Delta')) ?></th><th class="data-grid-th"><?= $block->escapeHtml(__('In Stock Before')) ?></th><th class="data-grid-th"><?= $block->escapeHtml(__('In Stock After')) ?></th><th class="data-grid-th"><?= $block->escapeHtml(__('Source')) ?></th><th class="data-grid-th"><?= $block->escapeHtml(__('Admin User')) ?></th></tr></thead><tbody><?php foreach ($history as $row): $delta = (float)$row['qty_after'] - (float)$row['qty_before']; $deltaStr = ($delta >= 0 ? '+' : '') . number_format($delta, 0); $deltaColor = $delta >= 0 ? '#28a745' : '#dc3545'; $inStockAfterBadge = (int)$row['is_in_stock_after'] === 1 ? '<span style="color:#28a745;font-weight:bold">Yes</span>' : '<span style="color:#dc3545;font-weight:bold">No</span>'; $inStockBeforeBadge = (int)$row['is_in_stock_before'] === 1 ? '<span style="color:#28a745">Yes</span>' : '<span style="color:#dc3545">No</span>'; ?> <tr><td><?= $block->escapeHtml($block->formatLogDate($row['created_at'])) ?></td><td><?= number_format((float)$row['qty_before'], 0) ?></td><td><?= number_format((float)$row['qty_after'], 0) ?></td><td style="font-weight:bold;color:<?= $deltaColor ?>"><?= $deltaStr ?></td><td><?= /* @noEscape */ $inStockBeforeBadge ?></td><td><?= /* @noEscape */ $inStockAfterBadge ?></td><td><?= $block->escapeHtml($row['source'] ?? '') ?></td><td><?= $block->escapeHtml($row['admin_username'] ?? '') ?></td></tr><?php endforeach; ?></tbody></table></div><script>
    require(['stocklog-chartjs'], function (Chart) {
        var d = <?= /* @noEscape */ $chart ?>;
        var ctx = document.getElementById('stockHistoryChart').getContext('2d');
        new Chart(ctx, {
            type: 'line',
            data: {
                labels: d.labels,
                datasets: [{
                    label: 'Qty',
                    data: d.qtys,
                    borderColor: '#007bff',
                    backgroundColor: 'rgba(0,123,255,0.08)',
                    pointBackgroundColor: d.colors,
                    pointRadius: 5,
                    tension: 0.15,
                    fill: true
                }]
            },
            options: {
                responsive: true,
                plugins: {
                    legend: { display: false },
                    tooltip: {
                        callbacks: {
                            title: function(items) { return items[0].label; },
                            label: function(item) { return 'Qty: ' + item.raw; }
                        }
                    }
                },
                scales: {
                    x: { ticks: { maxTicksLimit: 20, maxRotation: 45 } },
                    y: { beginAtZero: true, title: { display: true, text: 'Qty' } }
                }
            }
        });
    });</script><?php endif; ?></div>