@extends('layouts.app')

@section('title', 'Detail Slip Gaji')

@section('content')
<div class="container-fluid">
    <div class="d-flex justify-content-between align-items-center mb-4">
        <h1 class="h3 mb-0 text-gray-800">Detail Slip Gaji</h1>
        <div>
            <a href="{{ route('payroll.index') }}" class="btn btn-secondary">
                <i class="fas fa-arrow-left"></i> Kembali
            </a>
            @if(!$payroll->is_paid)
                <form action="{{ route('payroll.mark-paid', $payroll) }}" method="POST" class="d-inline">
                    @csrf
                    @method('PATCH')
                    <button type="submit" class="btn btn-success" onclick="return confirm('Tandai sebagai sudah dibayar?')">
                        <i class="fas fa-check"></i> Tandai Sudah Dibayar
                    </button>
                </form>
            @endif
            <button onclick="window.print()" class="btn btn-info">
                <i class="fas fa-print"></i> Cetak
            </button>
        </div>
    </div>

    @if(session('success'))
        <div class="alert alert-success alert-dismissible fade show" role="alert">
            {{ session('success') }}
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
        </div>
    @endif

    <div class="card shadow mb-4" id="slip-gaji">
        <div class="card-body">
            <!-- Header Slip Gaji -->
            <div class="text-center mb-4">
                <h3 class="mb-0">UD. BAROKAH</h3>
                <p class="mb-0">Gudang Kayu</p>
                <h5 class="mt-3 mb-0">SLIP GAJI KARYAWAN</h5>
                <p>{{ $payroll->no_slip }}</p>
            </div>

            <hr>

            <!-- Informasi Karyawan -->
            <div class="row mb-4">
                <div class="col-md-6">
                    <table class="table table-borderless table-sm">
                        <tr>
                            <td width="40%"><strong>Nama Karyawan</strong></td>
                            <td>: {{ $payroll->employee->nama_karyawan }}</td>
                        </tr>
                        <tr>
                            <td><strong>Tanggal Slip</strong></td>
                            <td>: {{ $payroll->tanggal_slip->format('d F Y') }}</td>
                        </tr>
                    </table>
                </div>
                <div class="col-md-6">
                    <table class="table table-borderless table-sm">
                        <tr>
                            <td width="40%"><strong>Periode</strong></td>
                            <td>: {{ $payroll->periode_awal->format('d/m/Y') }} s/d {{ $payroll->periode_akhir->format('d/m/Y') }}</td>
                        </tr>
                        <tr>
                            <td><strong>Status Pembayaran</strong></td>
                            <td>: 
                                @if($payroll->is_paid)
                                    <span class="badge bg-success">Sudah Dibayar</span>
                                @else
                                    <span class="badge bg-warning text-dark">Belum Dibayar</span>
                                @endif
                            </td>
                        </tr>
                    </table>
                </div>
            </div>

            <!-- Detail Pekerjaan -->
            <h6 class="font-weight-bold mb-3">Detail Pekerjaan:</h6>
            <div class="table-responsive mb-4">
                <table class="table table-bordered table-sm">
                    <thead class="thead-light">
                        <tr>
                            <th width="4%">No</th>
                            <th width="8%">Tanggal</th>
                            <th width="8%">Jenis</th>
                            <th width="12%">No. Transaksi</th>
                            <th width="15%">Mitra</th>
                            <th width="12%">Jenis Kendaraan</th>
                            <th width="10%" class="text-center">Volume (m³)</th>
                            <th class="text-end">Nilai Upah</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach($payroll->lines as $index => $line)
                            @php
                                $worklog = $line->worklog;
                                $jenis = $worklog->jenis_transaksi === 'pembelian' ? 'Pembelian' : 'Penjualan';
                                $jenisClass = $worklog->jenis_transaksi === 'pembelian' ? 'bg-primary' : 'bg-success';
                                
                                if ($worklog->jenis_transaksi === 'pembelian') {
                                    $noTransaksi = $worklog->purchase ? $worklog->purchase->no_pembelian : '-';
                                    $mitra = $worklog->supplier ? $worklog->supplier->nama_supplier : '-';
                                } else {
                                    $noTransaksi = $worklog->delivery ? $worklog->delivery->no_surat_jalan : '-';
                                    $mitra = $worklog->delivery && $worklog->delivery->customer ? $worklog->delivery->customer->nama_customer : '-';
                                }
                            @endphp
                            <tr>
                                <td>{{ $index + 1 }}</td>
                                <td>{{ $worklog->tanggal->format('d/m/Y') }}</td>
                                <td><span class="badge {{ $jenisClass }} text-white">{{ $jenis }}</span></td>
                                <td><small>{{ $noTransaksi }}</small></td>
                                <td>{{ $mitra }}</td>
                                <td>{{ $worklog->vehicleType ? $worklog->vehicleType->nama_jenis_kendaraan : '-' }}</td>
                                <td class="text-center">{{ number_format($worklog->total_volume, 4, ',', '.') }}</td>
                                <td class="text-end">Rp {{ number_format($worklog->nilai_upah, 0, ',', '.') }}</td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>

            <!-- Rincian Pembayaran -->
            <div class="row">
                <div class="col-md-6 offset-md-6">
                    <table class="table table-bordered">
                        <tr>
                            <td><strong>Subtotal</strong></td>
                            <td class="text-end">Rp {{ number_format($payroll->subtotal, 0, ',', '.') }}</td>
                        </tr>
                        <tr>
                            <td>Potongan Wajib</td>
                            <td class="text-end text-danger">- Rp {{ number_format($payroll->potongan_wajib, 0, ',', '.') }}</td>
                        </tr>
                        <tr>
                            <td>Potongan Sukarela</td>
                            <td class="text-end text-danger">- Rp {{ number_format($payroll->potongan_sukarela, 0, ',', '.') }}</td>
                        </tr>
                        <tr>
                            <td>Pinjaman</td>
                            <td class="text-end text-danger">- Rp {{ number_format($payroll->pinjaman, 0, ',', '.') }}</td>
                        </tr>
                        <tr class="table-success">
                            <td><strong>Total yang Diterima</strong></td>
                            <td class="text-end"><strong>Rp {{ number_format($payroll->total_dibayar, 0, ',', '.') }}</strong></td>
                        </tr>
                    </table>
                </div>
            </div>

            <!-- Tanda Tangan -->
            <div class="row mt-5">
                <div class="col-6 text-center">
                    <p>Yang Menerima,</p>
                    <br><br><br>
                    <p>{{ $payroll->employee->nama_karyawan }}</p>
                </div>
                <div class="col-6 text-center">
                    <p>Mengetahui,</p>
                    <br><br><br>
                    <p>___________________</p>
                    <small>Admin/Owner</small>
                </div>
            </div>
        </div>
    </div>
</div>

<style>
@media print {
    .sidebar, .navbar, .btn, .alert, .breadcrumb {
        display: none !important;
    }
    .card {
        border: none !important;
        box-shadow: none !important;
    }
    .main-content {
        padding: 0 !important;
    }
    body {
        background: white !important;
    }
}
</style>
@endsection