{{-- resources/views/stock_aging/by_category.blade.php --}}
@extends('layouts.app')
@section('title', $categoryData['label'] ?? 'Stock Aging - Category')

@section('content')

@php
    $categoryColors = [
        '0-30' => '#28a745',
        '31-60' => '#17a2b8',
        '61-90' => '#ffc107',
        '91-120' => '#fd7e14',
        '121-160' => '#e83e8c',
        '160+' => '#dc3545',
    ];
    
    $categoryActions = [
        '0-30' => 'Normal monitoring - continue regular sales activities',
        '31-60' => 'Monitor sales patterns - watch for slowing demand',
        '61-90' => 'Consider promotional activities to boost sales',
        '91-120' => 'Review pricing strategy and consider discounts',
        '121-160' => 'Take corrective action - aggressive promotion or bundle',
        '160+' => 'Immediate action required - clearance, return, or write-off',
    ];
    
    $categoryIcons = [
        '0-30' => 'fa-check-circle',
        '31-60' => 'fa-clock-o',
        '61-90' => 'fa-hourglass-half',
        '91-120' => 'fa-exclamation-triangle',
        '121-160' => 'fa-warning',
        '160+' => 'fa-skull',
    ];
    
    $color = $categoryColors[$category] ?? '#6c757d';
    $action = $categoryActions[$category] ?? 'Review';
    $icon = $categoryIcons[$category] ?? 'fa-clock-o';
@endphp

<!-- Content Header -->
<section class="content-header">
    <h1 class="tw-text-xl md:tw-text-3xl tw-font-bold tw-text-black">
        <i class="fa {{ $icon }}"></i> {{ $categoryData['label'] ?? $category }}
        <small>{{ $categoryData['age_range'] ?? '' }}</small>
    </h1>
</section>

<!-- Main content -->
<section class="content">
    <!-- Category Summary -->
    <div class="row">
        <div class="col-md-12">
            <div class="callout" style="border-left-color: {{ $color }}; border-left-width: 5px; background:white;">
                <h4><i class="fa {{ $icon }}" style="color: {{ $color }};"></i> {{ $categoryData['label'] ?? $category }}</h4>
                <p>
                    <strong>Total Value:</strong> KSh {{ number_format($totalValue, 2) }}
                    | <strong>Total Products:</strong> {{ $totalProducts }}
                    | <strong>Total Quantity:</strong> {{ number_format($totalQuantity, 2) }} Units
                    | <strong>Percentage of Total:</strong> {{ $percentage }}%
                </p>
                <hr>
                <p>
                    <strong>Recommended Action:</strong> 
                    <span class="label" style="background-color: {{ $color }}; color: white; padding: 5px 10px;">
                        {{ $action }}
                    </span>
                </p>
            </div>
        </div>
    </div>

    <!-- Filters -->
    <div class="row">
        <div class="col-md-12">
            <div class="box box-solid">
                <div class="box-header with-border">
                    <h3 class="box-title"><i class="fa fa-filter"></i> Filters</h3>
                </div>
                <div class="box-body">
                    <form action="{{ route('stock-aging.category', ['category' => $category]) }}" method="GET" id="filters_form">
                        <div class="row">
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label>{{ __('purchase.business_location') }}:</label>
                                    <select name="location_id" class="form-control select2" style="width:100%">
                                        <option value="">All Locations</option>
                                        @foreach($locations as $id => $name)
                                            <option value="{{ $id }}" {{ request()->input('location_id') == $id ? 'selected' : '' }}>
                                                {{ $name }}
                                            </option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label>{{ __('product.category') }}:</label>
                                    <select name="category_id" class="form-control select2" style="width:100%">
                                        <option value="">All Categories</option>
                                        @foreach($categories as $id => $name)
                                            <option value="{{ $id }}" {{ request()->input('category_id') == $id ? 'selected' : '' }}>
                                                {{ $name }}
                                            </option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label>{{ __('product.brand') }}:</label>
                                    <select name="brand_id" class="form-control select2" style="width:100%">
                                        <option value="">All Brands</option>
                                        @foreach($brands as $id => $name)
                                            <option value="{{ $id }}" {{ request()->input('brand_id') == $id ? 'selected' : '' }}>
                                                {{ $name }}
                                            </option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            <div class="col-md-3">
                                <div class="form-group">
                                    <label>&nbsp;</label>
                                    <div>
                                        <button type="submit" class="btn btn-primary">
                                            <i class="fa fa-search"></i> Apply Filters
                                        </button>
                                        <a href="{{ route('stock-aging.category', ['category' => $category]) }}" class="btn btn-default">
                                            <i class="fa fa-refresh"></i> Reset
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

    <!-- Back & Export Buttons -->
    <div class="row">
        <div class="col-md-12">
            <a href="{{ route('stock-aging.index') }}" class="btn btn-default">
                <i class="fa fa-arrow-left"></i> Back to Dashboard
            </a>
            <a href="{{ route('stock-aging.export') }}?{{ http_build_query(request()->all()) }}" 
                class="btn btn-success pull-right">
                <i class="fa fa-download"></i> Export
            </a>
        </div>
    </div>

    <br>

    <!-- Product List -->
    @component('components.widget', ['title' => $categoryData['label'] ?? $category . ' Products'])
        <div class="table-responsive">
            <table class="table table-bordered table-striped" id="category_table">
                <thead>
                    <tr>
                        <th>Product</th>
                        <th>Location</th>
                        <th>Category</th>
                        <th>Brand</th>
                        <th>Qty</th>
                        <th>Unit Cost</th>
                        <th>Stock Value</th>
                        <th>Days in Stock</th>
                        <th>Last Sale</th>
                        <th>Avg Monthly Sales</th>
                    </tr>
                </thead>
                <tbody>
                    @forelse($data as $item)
                    <tr>
                        <td>
                            <strong>{{ $item['product_name'] }}</strong>
                            <br>
                            <small class="text-muted">SKU: {{ $item['sku'] }}</small>
                            @if(!empty($item['variation_name']) && $item['variation_name'] != 'DUMMY')
                                <br><small class="text-muted">Variation: {{ $item['variation_name'] }}</small>
                            @endif
                        </td>
                        <td>{{ $item['location_name'] }}</td>
                        <td>{{ $item['category_name'] ?? '' }}</td>
                        <td>{{ $item['brand_name'] ?? '' }}</td>
                        <td>{{ number_format($item['quantity'], 2) }} {{ $item['unit'] ?? '' }}</td>
                        <td>KSh {{ number_format($item['unit_cost'], 2) }}</td>
                        <td>
                            <span style="color: {{ $color }}; font-weight: bold;">
                                KSh {{ number_format($item['stock_value'], 2) }}
                            </span>
                        </td>
                        <td>
                            <span class="label" style="background-color: {{ $color }}; color: white;">
                                {{ $item['avg_days_in_stock'] }} days
                            </span>
                        </td>
                        <td>{{ $item['last_sale_date'] ? \Carbon\Carbon::parse($item['last_sale_date'])->format('d-m-Y') : 'Never' }}</td>
                        <td>{{ number_format($item['avg_monthly_sales'], 2) }}</td>
                    </tr>
                    @empty
                    <tr>
                        <td colspan="10" class="text-center">
                            <i class="fa fa-check-circle text-success"></i> No products found in this category.
                        </td>
                    </tr>
                    @endforelse
                </tbody>
            </table>
        </div>
    @endcomponent
</section>
@stop

@section('javascript')
<script>
    $(document).ready(function() {
        // Initialize Select2
        $('.select2').select2();

        // Initialize DataTable
        var categoryTable = $('#category_table').DataTable({
            order: [[7, 'desc']],
            pageLength: 25,
            lengthMenu: [[10, 25, 50, 100, -1], [10, 25, 50, 100, 'All']],
            dom: 'Bfrtip',
           
            responsive: true
        });

        // Handle filter changes
        $('#filters_form select').on('change', function() {
            categoryTable.ajax.reload();
        });
    });
</script>
@stop