@extends('layouts.admin')

@section('page-title', __('messages.products'))

@section('content')
<div class="bg-white dark:bg-gray-800 p-6 rounded-lg shadow">
    
    <div class="flex justify-between items-center mb-4">
        <h1 class="text-2xl font-bold">{{ __('messages.products') }}</h1>
        <a href="{{ route('admin.products.create') }}" class="bg-black text-white px-4 py-2 rounded hover:bg-gray-800">
            + {{ __('messages.add_product') }}
        </a>
    </div>

    @if(session('success'))
        <div class="bg-green-500 text-white p-3 rounded mb-4">{{ session('success') }}</div>
    @endif

    <div class="overflow-x-auto">
        <table class="w-full text-left border-collapse">
            <thead>
                <tr class="bg-gray-100 dark:bg-gray-700">
                    <th class="p-3">#</th>
                    <th class="p-3">{{ __('messages.name') }}</th>
                    <th class="p-3">{{ __('messages.category') }}</th>
                    <th class="p-3">{{ __('messages.price') }}</th>
                    <th class="p-3">{{ __('messages.stock') }}</th>
                    <th class="p-3">{{ __('messages.status') }}</th>
                    <th class="p-3">{{ __('messages.action') }}</th>
                </tr>
            </thead>
            <tbody>
                @forelse($products as $product)
                <tr class="border-b dark:border-gray-700">
                    <td class="p-3">{{ $product->id }}</td>
                    <td class="p-3">{{ $product->name }}</td>
                    <td class="p-3">{{ $product->category->name ?? 'N/A' }}</td>
                    <td class="p-3">{{ currencySymbol() }} {{ number_format(convertCurrency($product->price), 2) }}</td>
                    <td class="p-3">{{ $product->stock }}</td>
                    <td class="p-3">
                        @if($product->is_active)
                            <span class="bg-green-200 text-green-800 px-2 py-1 rounded text-xs">Active</span>
                        @else
                            <span class="bg-red-200 text-red-800 px-2 py-1 rounded text-xs">Inactive</span>
                        @endif
                    </td>
                    <td class="p-3">
                        <a href="{{ route('admin.products.edit', $product) }}" class="text-blue-500">Edit</a> | 
                        <form action="{{ route('admin.products.destroy', $product) }}" method="POST" class="inline" onsubmit="return confirm('Delete?')">
                            @csrf @method('DELETE')
                            <button type="submit" class="text-red-500">Delete</button>
                        </form>
                    </td>
                </tr>
                @empty
                <tr>
                    <td colspan="7" class="p-3 text-center">No products found</td>
                </tr>
                @endforelse
            </tbody>
        </table>
    </div>

    <div class="mt-4">
        {{ $products->links() }}
    </div>
</div>
@endsection