@extends('layouts.app')

@section('title', $item->name_en)

@section('content')
<x-breadcrumb :items="[
    ['label' => 'Items', 'url' => route('items.index')],
    ['label' => $item->name_en],
]" />

<x-page-header :title="$item->name_en" :subtitle="$item->item_code">
    <x-slot name="actions">
        <a href="{{ route('items.edit', $item) }}" class="procure-btn"><i class="fas fa-edit"></i> Edit</a>
        <button type="button" class="procure-btn text-danger"
            onclick="confirmAction({
                title: 'Delete Item',
                message: 'Delete this item?',
                confirmText: 'Delete',
                onConfirm: function() { document.getElementById('delete-item-form').submit(); }
            })"><i class="fas fa-trash"></i> Delete</button>
        <form id="delete-item-form" action="{{ route('items.destroy', $item) }}" method="POST" class="d-none">
            @csrf @method('DELETE')
        </form>
    </x-slot>
</x-page-header>

<div class="row">
    <div class="col-lg-6 mb-3">
        <div class="procure-form-card h-100">
            <div class="d-flex justify-content-between mb-3">
                <h5 class="font-weight-bold mb-0">Item Details</h5>
                <x-status-badge :status="$item->status" />
            </div>
            <div class="row">
                <div class="col-6">
                    <p class="procure-detail-label">Code</p>
                    <p class="procure-detail-value">{{ $item->item_code }}</p>
                </div>
                <div class="col-6">
                    <p class="procure-detail-label">Name (AR)</p>
                    <p class="procure-detail-value" dir="rtl">{{ $item->name_ar ?? '—' }}</p>
                </div>
                <div class="col-6">
                    <p class="procure-detail-label">Category</p>
                    <p class="procure-detail-value">{{ $item->categoryRelation->name ?? $item->category ?? '—' }}</p>
                </div>
                <div class="col-6">
                    <p class="procure-detail-label">UOM</p>
                    <p class="procure-detail-value">{{ $item->unit_of_measure }}</p>
                </div>
                <div class="col-6">
                    <p class="procure-detail-label">Batch Tracking</p>
                    <p class="procure-detail-value">{{ $item->requires_batch_tracking ? 'Required' : 'Not required' }}</p>
                </div>
                <div class="col-6">
                    <p class="procure-detail-label">Reorder Lead Time</p>
                    <p class="procure-detail-value">{{ $item->reorder_lead_time_days !== null ? $item->reorder_lead_time_days.' days' : '—' }}</p>
                </div>
                <div class="col-6">
                    <p class="procure-detail-label">Safety Stock</p>
                    <p class="procure-detail-value">{{ $item->safety_stock_qty ?? '—' }}</p>
                </div>
                <div class="col-6">
                    <p class="procure-detail-label">Minimum Stock</p>
                    <p class="procure-detail-value">{{ $item->minimum_stock_qty ?? '—' }}</p>
                </div>
            </div>
            @if($item->description)
                <p class="procure-detail-label">Description</p>
                <p class="procure-detail-value">{{ $item->description }}</p>
            @endif
        </div>
    </div>
    <div class="col-lg-6 mb-3">
        <x-chart-card title="Recent Price History">
            @if(($priceHistory ?? collect())->isEmpty())
                <x-empty-state icon="fas fa-chart-line" title="No price data" message="Price history will appear after purchases or imports." />
            @else
                <table class="procure-table">
                    <thead>
                        <tr><th>Supplier</th><th>Price</th><th>Date</th></tr>
                    </thead>
                    <tbody>
                        @foreach($priceHistory as $ph)
                            <tr>
                                <td>{{ $ph->supplier->name ?? '—' }}</td>
                                <td>{{ number_format($ph->unit_price, 4) }} {{ $ph->currency }}</td>
                                <td>{{ optional($ph->effective_date)->format('Y-m-d') }}</td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            @endif
        </x-chart-card>
    </div>
</div>
@endsection