@extends('layouts.app', ['class' => 'g-sidenav-show bg-gray-100'])

@section('content')
    @include('layouts.navbars.auth.topnav', ['title' => 'Detail Generate PPS'])

    <div class="card shadow-lg mx-4">
        <div class="card-body p-3">
            <div class="row gx-4">
                <div class="col-lg">
                    <div class="nav-wrapper d-flex gap-2">
                        <button class="btn btn-secondary mb-0" onclick="history.back()">
                            <i class="fas fa-circle-left me-1"></i>
                            <span class="font-weight-bold">Kembali</span>
                        </button>
                        @if ($authorize->pdf == '1')
                            <a href="{{ route('genpps.viewpdf', ['idencrypt' => encrypt($header->id_pps)]) }}" target="_blank"
                                class="btn btn-danger mb-0">
                                <i class="fas fa-file-pdf me-1"></i>
                                <span class="font-weight-bold">PDF</span>
                            </a>
                        @endif

                    </div>
                </div>
            </div>
        </div>
    </div>

    @push('css')
        <style>
            .text-uppercase {
                text-transform: uppercase;
            }
        </style>
    @endpush

    <div class="container-fluid py-4">
        <div class="row">
            <div class="col-md-12">
                <div class="card mb-4">
                    <div class="card-header pb-0">
                        <h6 class="mb-0 text-uppercase text-sm font-weight-bold">Informasi PPS</h6>
                    </div>
                    <div class="card-body">
                        <hr class="horizontal dark mt-0">
                        <div class="row">
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label class="form-control-label">No PPS/SJS</label>
                                    <input type="text" class="form-control bg-light font-weight-bold"
                                        value="{{ $header->no_pps }}" disabled>
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label class="form-control-label">ID PS</label>
                                    @if(!empty($header->id_ps))
                                        <input type="text" class="form-control bg-light" value="{{ $header->id_ps }}" disabled>
                                    @else
                                        <input type="text" class="form-control bg-light text-muted fst-italic" value="without PS" disabled>
                                    @endif
                                </div>
                            </div>
                            @if(!empty($header->id_ps))
                                <div class="col-md-4">
                                    <div class="form-group">
                                        <label class="form-control-label">Tanggal PS</label>
                                        <input type="text" class="form-control bg-light"
                                            value="{{ $header->ps_date ? \Carbon\Carbon::parse($header->ps_date)->format('d/m/Y') : '-' }}"
                                            disabled>
                                    </div>
                                </div>
                            @else
                                <div class="col-md-4">
                                    <div class="form-group">
                                        <label class="form-control-label">Tanggal Pengiriman</label>
                                        <input type="text" class="form-control bg-light"
                                            value="{{ $header->tanggal_pengiriman ? \Carbon\Carbon::parse($header->tanggal_pengiriman)->format('d/m/Y') : '-' }}"
                                            disabled>
                                    </div>
                                </div>
                            @endif
                        </div>

                        <div class="row">
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label class="form-control-label">Customer</label>
                                    <input type="text" class="form-control bg-light" value="{{ $header->customer ?? '-' }}"
                                        disabled>
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label class="form-control-label">Customer Ship To</label>
                                    <input type="text" class="form-control bg-light" value="{{ $header->customer_ship_to_ps ?? $header->customer_ship_to_web ?? '-' }}"
                                        disabled>
                                </div>
                            </div>
                            <div class="col-md-4">
                                <div class="form-group">
                                    <label class="form-control-label">Customer End User</label>
                                    <input type="text" class="form-control bg-light" value="{{ $header->end_user_web ?? '-' }}"
                                        disabled>
                                </div>
                            </div>
                            @if(!empty($header->id_ps))
                                <div class="col-md-4">
                                    <div class="form-group">
                                        <label class="form-control-label">Salesman</label>
                                        <input type="text" class="form-control bg-light"
                                            value="{{ $header->salesman_web ?? $header->salesman_ps ?? '-' }}" disabled>
                                    </div>
                                </div>
                                <div class="col-md-4">
                                    <div class="form-group">
                                        <label class="form-control-label">Alamat Pengiriman</label>
                                        <textarea class="form-control bg-light" rows="2"
                                            disabled>{{ $header->alamat_pengiriman ?? ($header->alamat_pengiriman_ps ?? '-') }}</textarea>
                                    </div>
                                </div>
                            @else
                                <div class="col-md-8">
                                    <div class="form-group">
                                        <label class="form-control-label">Alamat Pengiriman</label>
                                        <textarea class="form-control bg-light" rows="2"
                                            disabled>{{ $header->alamat_pengiriman ?? ($header->alamat_pengiriman_ps ?? '-') }}</textarea>
                                    </div>
                                </div>
                            @endif
                        </div>
                    </div>
                </div>

                <div class="card">
                    <div class="card-header pb-0">
                        <h6 class="mb-0 text-uppercase text-sm font-weight-bold">Detail Item</h6>
                    </div>
                    <div class="card-body p-0">
                        <hr class="horizontal dark mt-0 mx-3">
                        <div class="table-responsive px-3 pb-3">
                            <table class="table table-sm align-items-center mb-0">
                                <thead style="background-color: #00b7bd4f;">
                                    <tr>
                                        <th class="text-center">No</th>
                                        <th>PP / PET</th>
                                        <th class="text-center">Gsm</th>
                                        <th style="width: 150px; min-width: 150px;">No Roll</th>
                                        <th style="width: 150px; min-width: 150px;">No Jumbo</th>
                                        <th>Color</th>
                                        <th class="text-center">Width</th>
                                        <th class="text-center">Length</th>
                                        <th class="text-center">Grade</th>
                                        <th class="text-center">Qty</th>
                                        <th class="text-center">Qty Filled</th>
                                        <th>Remark</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @forelse($items as $i => $item)
                                        @php
                                            $isRejected = !empty($item->flag_rejection) && $item->flag_rejection == '1';
                                            $rowStyle = $isRejected ? 'style="background-color: #ffe6e6;"' : '';
                                        @endphp
                                        <tr {{ $rowStyle }}>
                                            <td class="text-center text-sm">{{ $i + 1 }}
                                                @if($isRejected)
                                                    <span class="badge bg-danger text-xs ms-1">REJECT FROM SAP</span>
                                                @endif
                                            </td>
                                            <td class="text-sm">{{ $item->material_code ?? '-' }}</td>
                                            <td class="text-center text-sm">{{ $item->gsm ?? '-' }}</td>
                                            <td class="text-sm text-uppercase">{{ strtoupper($item->no_roll ?? '-') }}</td>
                                            <td class="text-sm text-uppercase">{{ strtoupper($item->nomor_jumbo ?? '-') }}</td>
                                            <td class="text-sm">{{ $item->color ?? '-' }}</td>
                                            <td class="text-center text-sm">{{ $item->width ?? '-' }}</td>
                                            <td class="text-center text-sm">{{ $item->length ?? '-' }}</td>
                                            <td class="text-center text-sm">{{ $item->grade ?? '-' }}</td>
                                            <td class="text-center text-sm">
                                                {{ $item->qty_sales ?? '-' }}
                                                @if (!empty($item->sales_unit))
                                                    {{ strtoupper($item->sales_unit) }}
                                                @endif
                                            </td>
                                            <td class="text-center text-sm font-weight-bold text-primary">
                                                {{ $item->qty_filled ?? '-' }}
                                                @if (!empty($item->sales_unit))
                                                    {{ strtoupper($item->sales_unit) }}
                                                @endif
                                            </td>
                                            <td class="text-sm">{{ $item->remark ?? $item->note ?? '-' }}</td>
                                        </tr>
                                    @empty
                                        <tr>
                                            <td colspan="11" class="text-center py-3 text-secondary">
                                                Tidak ada detail item untuk ID PS ini.
                                            </td>
                                        </tr>
                                    @endforelse
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection