@extends('layouts.app') {{-- Sesuaikan dengan layout Anda --}}
@section('title', 'Buat Surat Jalan')
@section('page_title', 'Buat Surat Jalan')

@section('content')
<section class="bg-white">
    {{-- <h1 class="text-2xl font-bold mb-6">Buat Surat Jalan</h1> --}}

    @if ($errors->has('error'))
        <div class="bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded relative mb-4" role="alert">
            <strong class="font-bold">Error!</strong>
            <span class="block sm:inline">{{ $errors->first('error') }}</span>
        </div>
    @endif

    <form action="{{ route('surat-jalan.store') }}" method="POST" class="bg-white p-6 rounded-lg shadow-md">
        @csrf

        {{-- Input tersembunyi untuk salable_id dan salable_type --}}
        <input type="hidden" name="salable_id" value="{{ $penjualan->id }}">
        <input type="hidden" name="salable_type" value="{{ $penjualan_type }}">

        {{-- Informasi Penjualan (Read-only) --}}
        <div class="mb-4">
            <label class="block text-gray-700 text-sm font-bold mb-2" for="penjualan_info">
                Info Penjualan ({{ class_basename($penjualan) }} ID: {{ $penjualan->id }})
            </label>
            <p class="text-gray-700 text-base">
                @if(method_exists($penjualan, 'pelanggan'))
                    Pelanggan: {{ $penjualan->pelanggan->nama ?? 'N/A' }} |
                @endif
                Tanggal: {{ $penjualan->tanggal_kirim ?? $penjualan->tanggal_penjualan ?? 'N/A' }}
            </p>
        </div>
        <hr class="my-4">

        {{-- Input Detail Surat Jalan --}}
        <div class="mb-4">
            <label class="block text-gray-700 text-sm font-bold mb-2" for="tanggal_pengiriman">
                Tanggal Pengiriman <span class="text-red-500">*</span>
            </label>
            <input class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline" id="tanggal_pengiriman" type="date" name="tanggal_pengiriman" value="{{ old('tanggal_pengiriman', now()->toDateString()) }}" required>
            @error('tanggal_pengiriman')
                <p class="text-red-500 text-xs italic">{{ $message }}</p>
            @enderror
        </div>

        <div class="mb-4">
            <label class="block text-gray-700 text-sm font-bold mb-2" for="nama_kurir">
                Nama Kurir
            </label>
            <input class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline" id="nama_kurir" type="text" name="nama_kurir" value="{{ old('nama_kurir') }}">
             @error('nama_kurir')
                <p class="text-red-500 text-xs italic">{{ $message }}</p>
            @enderror
        </div>

        <div class="mb-4">
            <label class="block text-gray-700 text-sm font-bold mb-2" for="catatan">
                Catatan
            </label>
            <textarea class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline" id="catatan" name="catatan" rows="3">{{ old('catatan') }}</textarea>
             @error('catatan')
                <p class="text-red-500 text-xs italic">{{ $message }}</p>
            @enderror
        </div>

        <hr class="my-4">

        <h3 class="text-lg font-semibold mb-4">Detail Barang yang Dikirim:</h3>
        
        {{-- Dinamis di sini, Anda bisa menggunakan JavaScript untuk mengisi ini --}}
        {{-- Atau buat field manual jika jumlah produk terbatas --}}
        <div id="detail-items-container">
            {{-- Contoh Field Manual jika Anda punya data penjualan yang selalu sama --}}
            {{-- Perlu disesuaikan jika Anda ingin mengisi otomatis berdasarkan detail penjualan --}}
            @if(isset($penjualan->details) && $penjualan->details->count() > 0)
                @foreach($penjualan->details as $index => $detail)
                    <div class="grid grid-cols-4 gap-4 mb-4 p-4 border rounded-lg bg-gray-50">
                        <div>
                            <label class="block text-gray-700 text-sm font-bold mb-2">Produk</label>
                            <input type="text" value="{{ $detail->produkJadi->nama ?? 'N/A' }}" readonly class="bg-gray-200 text-gray-700 py-2 px-3 rounded-lg w-full">
                            <input type="hidden" name="details[{{$index}}][produk_jadi_id]" value="{{ $detail->produkJadi->id }}">
                        </div>
                        <div>
                            <label class="block text-gray-700 text-sm font-bold mb-2">Kuantitas Kirim</label>
                            <input type="number" step="any" name="details[{{$index}}][kuantitas]" value="{{ old("details.$index.kuantitas", $detail->kuantitas_kirim) }}" required class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
                             @error("details.$index.kuantitas")
                                <p class="text-red-500 text-xs italic">{{ $message }}</p>
                            @enderror
                        </div>
                        <div>
                            <label class="block text-gray-700 text-sm font-bold mb-2">Harga Satuan</label>
                            <input type="number" step="any" name="details[{{$index}}][harga_satuan]" value="{{ old("details.$index.harga_satuan", $detail->harga_satuan) }}" required class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
                             @error("details.$index.harga_satuan")
                                <p class="text-red-500 text-xs italic">{{ $message }}</p>
                            @enderror
                        </div>
                        {{-- Kolom untuk Detail Penjualan (jika relevan) --}}
                        {{-- Anda bisa menampilkan sisa kuantitas dari detail penjualan di sini --}}
                        {{-- Untuk saat ini, kita asumsikan semua yang ada di detail penjualan dikirim --}}
                    </div>
                @endforeach
            @else
                <p class="text-gray-500">Tidak ada detail produk yang dapat dikirim dari penjualan ini.</p>
            @endif
        </div>

        <div class="flex items-center justify-between mt-8">
            <button type="submit" class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline transform hover:scale-105 transition duration-300 ease-in-out">
                Simpan Surat Jalan
            </button>
            <a href="{{ url()->previous() }}" class="inline-block align-baseline font-bold text-sm text-blue-500 hover:text-blue-800">
                Batal
            </a>
        </div>
    </form>
</section>
@endsection