@extends('layouts.app')
@section('title','Products')
@section('page_title','Products')
@section('content')
@php $isCashier = auth()->user()->isCashier(); @endphp
<div class="page-heading">
    <div class="mobile-page-title"><h2>All Products</h2><small>{{ number_format($products->total()) }} products</small></div>
    <div class="heading-actions products-page-actions">
        @if(in_array(auth()->user()->role,['owner','manager'],true))
            <x-export-choice route-name="products.export.print" :current="request()->except(['page','scope'])" />
            <a class="btn btn-secondary" href="{{ route('products.import.index') }}">Import Products</a>
        @endif
        @if($canAddProducts)<a class="btn products-add-button" href="{{ route('products.create') }}">+ Add Product</a>@endif
    </div>
</div>

@if(session('status'))<div class="status-box">{{ session('status') }}</div>@endif
@if($errors->any())<div class="error-box">{{ $errors->first() }}</div>@endif

<div class="card filter-card mobile-collapsible-filter">
    <button class="mobile-filter-toggle" type="button" data-mobile-filter-toggle aria-controls="productsFilterForm" aria-expanded="false"><span><strong>Filters</strong><small>Search, category and stock status</small></span><b aria-hidden="true">+</b></button>
    <form class="filter-grid products-filter" id="productsFilterForm" method="GET" data-live-filter data-live-filter-key="products">
        <input name="search" value="{{ $search }}" placeholder="Start typing a product name..." data-live-search autocomplete="off">
        <select name="category" data-live-select>
            <option value="all">All Categories</option>
            @foreach($categories as $cat)
                <option value="{{ $cat->id }}" @selected((string)$category === (string)$cat->id)>{{ $cat->displayName() }}</option>
            @endforeach
        </select>
        <select name="status" data-live-select>
            <option value="all" @selected($status==='all')>All Products</option>
            <option value="active" @selected($status==='active')>Active</option>
            <option value="inactive" @selected($status==='inactive')>Inactive</option>
            <option value="archived" @selected($status==='archived')>Archived</option>
            <option value="in_stock" @selected($status==='in_stock')>In Stock</option>
            <option value="low_stock" @selected($status==='low_stock')>Low Stock</option>
            <option value="out_of_stock" @selected($status==='out_of_stock')>Out of Stock</option>
        </select>
        <div class="filter-actions"><noscript><button class="btn" type="submit">Apply</button></noscript><button class="btn-tertiary" type="button" data-filter-clear>Clear</button></div>
    </form>
</div>

<div class="card table-card" data-live-results>
    <div class="table-scroll desktop-record-table">
        <table class="data-table product-table">
            <thead>
                <tr><th class="product-image-cell">Image</th><th class="product-name-cell">Product Name</th><th class="product-category-cell">Category</th><th class="product-mode-cell">Selling Mode</th>@unless($isCashier)<th class="product-price-cell">Cost Price</th>@endunless<th class="product-price-cell">Selling Prices</th><th class="product-stock-column">Stock</th><th class="product-status-cell">Status</th><th class="product-actions-cell">Actions</th></tr>
            </thead>
            <tbody>
            @forelse($products as $product)
                <tr>
                    <td class="product-image-cell"><div class="thumb" data-image-fallback="{{ strtoupper(substr($product->name,0,1)) }}">@if($product->imageUrl())<img src="{{ $product->imageUrl() }}" alt="" loading="lazy" decoding="async">@else{{ strtoupper(substr($product->name,0,1)) }}@endif</div></td>
                    <td class="product-name-cell"><strong>{{ $product->name }}</strong><small>Added by {{ ucfirst($product->creator?->role ?? 'system') }}</small></td>
                    <td class="product-category-cell">{{ $product->category?->displayName() ?? 'General Products' }}</td>
                    <td class="product-mode-cell"><span class="product-mode-label">{{ $product->sellingModeLabel() }}</span></td>
                    @unless($isCashier)<td class="product-price-cell"><div class="product-price-lines">@if($product->canSellSingle())<span><small>{{ $product->singleUnitSingular() }}</small><b>TZS {{ tzs_amount($product->costPricePerSingle()) }}</b></span>@endif @if($product->canSellWholesale())<span><small>{{ $product->wholesaleUnitSingular() }}</small><b>TZS {{ tzs_amount($product->cost_price_per_carton) }}</b></span>@endif</div></td>@endunless
                    <td class="product-price-cell"><div class="product-price-lines">@if($product->canSellSingle())<span><small>{{ $product->singleUnitSingular() }}</small><b>TZS {{ tzs_amount($product->default_selling_price_per_single) }}</b></span>@endif @if($product->canSellWholesale())<span><small>{{ $product->wholesaleUnitSingular() }}</small><b>TZS {{ tzs_amount($product->default_selling_price_per_carton) }}</b></span>@endif</div></td>
                    <td class="product-stock-column">
                        <div class="product-stock-compact">
                            <div class="product-stock-primary {{ $product->canSellWholesale() && $product->canSellSingle() ? 'has-two-units' : 'has-one-unit' }}">
                                <div class="product-stock-badges">
                                    @if($product->canSellWholesale())
                                        <span><b>{{ number_format($product->wholesaleAvailable()) }}</b> {{ $product->unitName('wholesale',$product->wholesaleAvailable()) }}</span>
                                    @endif
                                    @if($product->canSellSingle())
                                        <span><b>{{ number_format($product->looseSingleAvailable()) }}</b> {{ $product->unitName('single',$product->looseSingleAvailable()) }}</span>
                                    @endif
                                </div>
                                @if($product->canSellWholesale() && $product->canSellSingle())
                                    <i class="product-stock-plus" aria-hidden="true">+</i>
                                @endif
                            </div>
                            <small>Total: {{ number_format($product->current_stock_pieces) }} {{ $product->unitName('single',$product->current_stock_pieces) }}</small>
                        </div>
                    </td>
                    <td class="product-status-cell">
                        @if($product->isArchived())
                            <span class="status-pill status-inactive">Archived</span>
                        @elseif($product->status === 'inactive')
                            <span class="status-pill status-inactive">Inactive</span>
                        @else
                            <span class="status-pill status-{{ str_replace('_','-',$product->stockStatus()) }}">{{ $product->stockStatusLabel() }}</span>
                        @endif
                    </td>
                    <td class="product-actions-cell">
                        @if(in_array(auth()->user()->role,['owner','manager'],true))
                            <div class="row-actions-primary">
                                @if(!$product->isArchived())
                                    <a class="btn btn-secondary btn-small" href="{{ route('products.edit',$product) }}">Edit</a>
                                    <details class="row-overflow"><summary title="More actions" aria-label="More actions for {{ $product->name }}">•••</summary><div>
                                        <form method="POST" action="{{ route('products.toggle-status',$product) }}" @if($product->status==='active') data-confirm="{{ 'Deactivate '.$product->name.'? It will no longer appear in POS. Current stock: '.$product->stockDisplay().'. Sales and stock history will remain available.' }}" data-dialog-title="Deactivate product" data-dialog-danger="1" data-confirm-text="Deactivate" @endif>@csrf @method('PATCH')
                                            <button type="submit">{{ $product->status==='active'?'Deactivate Product':'Activate Product' }}</button>
                                        </form>
                                        <form method="POST" action="{{ route('archive.store',['type'=>'product','id'=>$product->id]) }}" data-reason-prompt="Archive {{ $product->name }}? It will be hidden from normal product and POS screens while its history remains available." data-dialog-title="Archive product" data-dialog-danger="1">@csrf<input type="hidden" name="reason"><button type="submit">Archive Product</button></form>
                                    </div></details>
                                @else
                                    <form method="POST" action="{{ route('archive.restore',['type'=>'product','id'=>$product->id]) }}">@csrf @method('DELETE')<button class="btn btn-secondary btn-small" type="submit">Restore</button></form>
                                @endif
                            </div>
                        @else
                            <span class="muted-small">—</span>
                        @endif
                    </td>
                </tr>
            @empty
                <tr><td colspan="{{ $isCashier ? 8 : 9 }}" class="empty-cell">No products found.</td></tr>
            @endforelse
            </tbody>
        </table>
    </div>
    <div class="mobile-record-list">
        @forelse($products as $product)
            <article class="mobile-record-card mobile-data-card mobile-product-data-card">
                <div class="mobile-data-visual thumb" data-image-fallback="{{ strtoupper(substr($product->name,0,1)) }}">@if($product->thumbnailUrl())<img src="{{ $product->thumbnailUrl() }}" alt="" loading="lazy" decoding="async">@else{{ strtoupper(substr($product->name,0,1)) }}@endif</div>
                <div class="mobile-record-head mobile-data-head">
                    <div><h3>{{ $product->name }}</h3><small>{{ $product->category?->displayName() ?? 'General Products' }}</small></div>
                    @if($product->isArchived())<span class="status-pill status-inactive">Archived</span>@elseif($product->status === 'inactive')<span class="status-pill status-inactive">Inactive</span>@else<span class="status-pill status-{{ str_replace('_','-',$product->stockStatus()) }}">{{ $product->stockStatusLabel() }}</span>@endif
                </div>
                <div class="mobile-data-body">
                    <div class="mobile-product-prices">@if($product->canSellSingle())<span><small>{{ $product->singleUnitSingular() }}</small><strong>TZS {{ tzs_amount($product->default_selling_price_per_single) }}</strong></span>@endif @if($product->canSellWholesale())<span><small>{{ $product->wholesaleUnitSingular() }}</small><strong>TZS {{ tzs_amount($product->default_selling_price_per_carton) }}</strong></span>@endif</div>
                    <div class="mobile-product-stockline">Stock: <strong>{{ $product->stockDisplay() }}</strong></div>
                </div>
                <div class="mobile-data-actions">@if(in_array(auth()->user()->role,['owner','manager'],true) && !$product->isArchived())<a class="btn btn-small mobile-primary-action" href="{{ route('products.edit',$product) }}">Edit</a>@else<a class="btn btn-small mobile-primary-action" href="{{ route('stock.index',['search'=>$product->name]) }}">View</a>@endif @if(in_array(auth()->user()->role,['owner','manager'],true))<details class="mobile-more-menu"><summary title="More product actions" aria-label="More actions for {{ $product->name }}">•••</summary><div>@if(!$product->isArchived())<a href="{{ route('stock.index',['search'=>$product->name]) }}">View Stock</a><form method="POST" action="{{ route('products.toggle-status',$product) }}" @if($product->status==='active') data-confirm="{{ 'Deactivate '.$product->name.'? It will no longer appear in POS. Current stock: '.$product->stockDisplay().'. Sales and stock history will remain available.' }}" data-dialog-title="Deactivate product" data-dialog-danger="1" data-confirm-text="Deactivate" @endif>@csrf @method('PATCH')<button type="submit">{{ $product->status==='active'?'Deactivate Product':'Activate Product' }}</button></form><form method="POST" action="{{ route('archive.store',['type'=>'product','id'=>$product->id]) }}" data-reason-prompt="Archive {{ $product->name }}? It will be hidden from normal product and POS screens while its history remains available." data-dialog-title="Archive product" data-dialog-danger="1">@csrf<input type="hidden" name="reason"><button type="submit">Archive Product</button></form>@else<form method="POST" action="{{ route('archive.restore',['type'=>'product','id'=>$product->id]) }}">@csrf @method('DELETE')<button type="submit">Restore Product</button></form>@endif</div></details>@endif</div>
            </article>
        @empty<div class="empty-state-professional"><div class="empty-icon">P</div><h3>No products found</h3><p>Try clearing the filters or add your first product.</p>@if($canAddProducts)<a class="btn" href="{{ route('products.create') }}">Add Product</a>@endif</div>@endforelse
    </div>
    <div class="table-footer">
        <span>Showing {{ $products->firstItem() ?? 0 }} to {{ $products->lastItem() ?? 0 }} of {{ $products->total() }} products</span>
        {{ $products->links() }}
    </div>
</div>
<script src="{{ asset('js/live-filter.js') }}?v=10037" defer></script>
@endsection