@extends('layouts.main')

@section('content')
<div class="d-flex justify-content-between align-items-center mb-4">
    <h4>Detailed Stock Value Report</h4>
    <a href="{{ route('reports.stock-value.export', request()->query()) }}" class="btn btn-success">
        <i class="bi bi-download"></i> Export CSV
    </a>
</div>

<form method="GET" class="row g-3 mb-4" id="stockValueForm">
    <div class="col-md-3">
        <label class="form-label">Category</label>
        <select name="category_id" class="form-select" onchange="document.getElementById('stockValueForm').submit()">
            <option value="">All Categories</option>
            @foreach($categories as $category)
                <option value="{{ $category->id }}" {{ $categoryId == $category->id ? 'selected' : '' }}>
                    {{ $category->name }}
                </option>
            @endforeach
        </select>
    </div>
    <div class="col-md-3">
        <label class="form-label">Stock Status</label>
        <select name="stock_status" class="form-select" onchange="document.getElementById('stockValueForm').submit()">
            <option value="">All</option>
            <option value="in_stock" {{ $stockStatus == 'in_stock' ? 'selected' : '' }}>In Stock</option>
            <option value="low_stock" {{ $stockStatus == 'low_stock' ? 'selected' : '' }}>Low Stock</option>
            <option value="out_of_stock" {{ $stockStatus == 'out_of_stock' ? 'selected' : '' }}>Out of Stock</option>
        </select>
    </div>
    <div class="col-md-3">
        <label class="form-label">Search</label>
        <input type="text" name="search" id="searchInput" class="form-control" placeholder="Name, SKU, or Barcode" value="{{ $search ?? '' }}">
    </div>
    <div class="col-md-3 d-flex align-items-end">
        <button type="submit" class="btn btn-primary me-2">
            <i class="bi bi-filter"></i> Filter
        </button>
        <a href="{{ route('reports.stock-value') }}" class="btn btn-secondary">
            <i class="bi bi-arrow-counterclockwise"></i> Reset
        </a>
    </div>
</form>

<script>
document.getElementById('searchInput').addEventListener('input', function(e) {
    if (e.target.value === '') {
        document.getElementById('stockValueForm').submit();
    }
});
</script>

<div class="row mb-4">
    <div class="col-md-2">
        <div class="card bg-primary text-white">
            <div class="card-body">
                <h5>Total Items</h5>
                <h3>{{ number_format($totalItems) }}</h3>
            </div>
        </div>
    </div>
    <div class="col-md-2">
        <div class="card bg-warning text-white">
            <div class="card-body">
                <h5>Total Cost</h5>
                <h3>{{ number_format($totalCost, 2) }}</h3>
            </div>
        </div>
    </div>
    <div class="col-md-2">
        <div class="card bg-success text-white">
            <div class="card-body">
                <h5>Selling Value</h5>
                <h3>{{ number_format($totalSellingValue, 2) }}</h3>
            </div>
        </div>
    </div>
    <div class="col-md-2">
        <div class="card bg-info text-white">
            <div class="card-body">
                <h5>Potential Profit</h5>
                <h3>{{ number_format($totalProfit, 2) }}</h3>
            </div>
        </div>
    </div>
    <div class="col-md-2">
        <div class="card bg-danger text-white">
            <div class="card-body">
                <h5>Low Stock</h5>
                <h3>{{ $lowStockCount }}</h3>
            </div>
        </div>
    </div>
    <div class="col-md-2">
        <div class="card bg-dark text-white">
            <div class="card-body">
                <h5>Out of Stock</h5>
                <h3>{{ $outOfStockCount }}</h3>
            </div>
        </div>
    </div>
</div>

@if($categorySummary->count() > 0)
<div class="card mb-4">
    <div class="card-header">
        <h5 class="mb-0">Category Summary</h5>
    </div>
    <div class="card-body table-responsive">
        <table class="table table-sm">
            <thead>
                <tr>
                    <th>Category</th>
                    <th class="text-end">Total Quantity</th>
                    <th class="text-end">Total Cost</th>
                    <th class="text-end">Total Value</th>
                    <th class="text-end">Profit</th>
                </tr>
            </thead>
            <tbody>
                @foreach($categorySummary as $summary)
                <tr>
                    <td>{{ $summary['name'] }}</td>
                    <td class="text-end">{{ number_format($summary['total_quantity']) }}</td>
                    <td class="text-end">{{ number_format($summary['total_cost'], 2) }}</td>
                    <td class="text-end">{{ number_format($summary['total_value'], 2) }}</td>
                    <td class="text-end text-success">{{ number_format($summary['total_profit'], 2) }}</td>
                </tr>
                @endforeach
            </tbody>
        </table>
    </div>
</div>
@endif

<div class="card">
    <div class="card-body table-responsive">
        <table class="table table-hover">
            <thead>
                <tr>
                    <th>SKU</th>
                    <th>Product</th>
                    <th>Category</th>
                    <th class="text-end">Cost Price</th>
                    <th class="text-end">Selling Price</th>
                    <th class="text-end">Stock</th>
                    <th class="text-end">Cost Value</th>
                    <th class="text-end">Selling Value</th>
                    <th class="text-end">Profit</th>
                    <th>Status</th>
                </tr>
            </thead>
            <tbody>
                @forelse($products as $product)
                    @php
                        $costValue = $product->cost_price * $product->stock_quantity;
                        $sellingValue = $product->selling_price * $product->stock_quantity;
                        $profit = $sellingValue - $costValue;
                    @endphp
                    <tr>
                        <td>{{ $product->sku }}</td>
                        <td>{{ $product->name }}</td>
                        <td>{{ $product->category->name ?? 'N/A' }}</td>
                        <td class="text-end">{{ number_format($product->cost_price, 2) }}</td>
                        <td class="text-end">{{ number_format($product->selling_price, 2) }}</td>
                        <td class="text-end">{{ number_format($product->stock_quantity) }}</td>
                        <td class="text-end">{{ number_format($costValue, 2) }}</td>
                        <td class="text-end">{{ number_format($sellingValue, 2) }}</td>
                        <td class="text-end text-success">{{ number_format($profit, 2) }}</td>
                        <td>
                            @if($product->stock_quantity == 0)
                                <span class="badge bg-secondary">Out of Stock</span>
                            @elseif($product->isLowStock())
                                <span class="badge bg-danger">Low Stock</span>
                            @else
                                <span class="badge bg-success">In Stock</span>
                            @endif
                        </td>
                    </tr>
                @empty
                    <tr>
                        <td colspan="10" class="text-center">No products found.</td>
                    </tr>
                @endforelse
            </tbody>
        </table>
    </div>
</div>
@endsection
