@extends('layouts.admin')
@section('title', 'Riwayat Pembelian - SI Apotek')

@section('content')
<div class="flex justify-between items-center mb-6">
    <h2 class="text-2xl font-semibold text-gray-700">Riwayat Pembelian (Restock)</h2>
    <a href="{{ route('purchases.create') }}" class="bg-emerald-600 text-white px-4 py-2 rounded-lg font-medium hover:bg-emerald-700 transition flex items-center gap-2 shadow-sm">
        <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"></path></svg>
        Catat Pembelian Baru
    </a>
</div>

@if(session('success'))
<div class="p-4 mb-4 text-sm text-emerald-700 bg-emerald-100 rounded-lg flex items-center gap-2" role="alert">
    <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path></svg>
    {{ session('success') }}
</div>
@endif

<div class="bg-white rounded-lg shadow-sm border border-gray-100 overflow-hidden">
    <div class="overflow-x-auto">
        <table class="w-full whitespace-no-wrap">
            <thead>
                <tr class="text-xs font-semibold tracking-wide text-left text-gray-500 uppercase border-b bg-gray-50">
                    <th class="px-4 py-3">Tanggal</th>
                    <th class="px-4 py-3">Admin</th>
                    <th class="px-4 py-3">Supplier</th>
                    <th class="px-4 py-3">Total Belanja</th>
                    <th class="px-4 py-3 text-right">Aksi</th>
                </tr>
            </thead>
            <tbody class="divide-y">
                @forelse($purchases as $p)
                <tr class="text-gray-700 hover:bg-gray-50 transition-colors">
                    <td class="px-4 py-3 text-sm font-semibold">{{ \Carbon\Carbon::parse($p->date)->format('d/m/Y') }}</td>
                    <td class="px-4 py-3 text-sm">{{ $p->user->name }}</td>
                    <td class="px-4 py-3 text-sm">{{ $p->supplier->name }}</td>
                    <td class="px-4 py-3 text-sm font-bold text-emerald-600">Rp {{ number_format($p->total_amount, 0, ',', '.') }}</td>
                    <td class="px-4 py-3 text-sm text-right">
                        <div class="flex justify-end gap-2">
                            <a href="{{ route('purchases.show', $p->id) }}" class="px-3 py-1 text-xs font-medium text-blue-700 bg-blue-100 rounded hover:bg-blue-200 transition-colors">Detail</a>
                            
                            <a href="{{ route('purchases.edit', $p->id) }}" class="px-3 py-1 text-xs font-medium text-amber-700 bg-amber-100 rounded hover:bg-amber-200 transition-colors">Edit</a>

                            <form action="{{ route('purchases.destroy', $p->id) }}" method="POST" class="inline" onsubmit="return confirm('Yakin ingin menghapus transaksi ini? Stok yang masuk dari transaksi ini akan ditarik kembali!');">
                                @csrf
                                @method('DELETE')
                                <button type="submit" class="px-3 py-1 text-xs font-medium text-red-700 bg-red-100 rounded hover:bg-red-200 transition-colors">Hapus</button>
                            </form>
                        </div>
                    </td>
                </tr>
                @empty
                <tr>
                    <td colspan="5" class="px-4 py-8 text-center text-gray-500">
                        <p>Belum ada riwayat transaksi pembelian.</p>
                    </td>
                </tr>
                @endforelse
            </tbody>
        </table>
    </div>
</div>
@endsection
