@extends('layouts.main')

@section('content')
    <div class="content-wrapper">
        <!-- Content -->
        <div class="container-xxl flex-grow-1 container-p-y">
            <div class="d-flex justify-content-between">
                @include('include.breadcrumb', ['breadcrumbs' => $breadcrumbs])
                <button onclick="printDetail()" class="btn btn-primary">Print Report</button>
            </div>
            <div class="row" id="work-order-detail">
                <div class="col-md-12">
                    <div class="my-5">
                        <div class="col-xxl">
                            <div class="card mb-4">
                                <div class="card-header">
                                    <h5 class="mb-0">Work Order Details</h5>
                                </div>
                                <div class="card-body">
                                    <!-- Use a table to align the details properly -->
                                    <table class="table table-bordered">
                                        <tbody>
                                            <tr>
                                                <td><strong>Request Date:</strong></td>
                                                <td>{{ $workOrder->request_date }}</td>
                                                <td><strong>Complete Date:</strong></td>
                                                <td>{{ $workOrder->complete_date }}</td>
                                            </tr>
                                            <tr>
                                                <td><strong>Work Order Type:</strong></td>
                                                <td>{{ $workOrder->wotype->name }}</td>
                                                <td><strong>PM | Not PM:</strong></td>
                                                <td>{{ $workOrder->wo_origin ? 'PM' : 'Not PM' }}</td>
                                            </tr>
                                            <tr>
                                                <td><strong>Time Type:</strong></td>
                                                <td>{{ $workOrder['timeType']->description }}</td>
                                                <td><strong>Zone:</strong></td>
                                                <td>{{ $workOrder['zone']->description }}</td>
                                            </tr>
                                            <tr>
                                                <td><strong>Technician:</strong></td>
                                                <td>{{ $workOrder['technician']->full_name }}</td>
                                                <td><strong>Facility:</strong></td>
                                                <td>{{ $workOrder['facility']->name }}</td>
                                            </tr>
                                            <tr>
                                                <td><strong>Repair Center:</strong></td>
                                                <td>{{ $workOrder['repairCenter']->name }}</td>
                                                <td><strong>Trade:</strong></td>
                                                <td>{{ $workOrder['trade']->name }}</td>
                                            </tr>
                                            <tr>
                                                <td><strong>Task Type:</strong></td>
                                                <td>{{ $workOrder['taskType']->name }}</td>
                                                <td><strong>Task:</strong></td>
                                                <td>{{ $workOrder['task']->name }}</td>
                                            </tr>
                                            <tr>
                                                <td><strong>Status:</strong></td>
                                                <td>{{ $workOrder['status']->name }}</td>
                                                <td><strong>Priority:</strong></td>
                                                <td>{{ $workOrder['priority']->name }}</td>
                                            </tr>
                                            <tr>
                                                <td><strong>Vendor:</strong></td>
                                                <td>{{ $workOrder['vendor']->name }}</td>
                                                <td><strong>Shift:</strong></td>
                                                <td>{{ implode(', ', $workOrder['shift']->work_days) }}</td>
                                            </tr>
                                            <tr>
                                                <td><strong>Requester:</strong></td>
                                                <td>{{ $workOrder['requester']->name }}</td>
                                                <td><strong>Building:</strong></td>
                                                <td>{{ $workOrder['building']->name }}</td>
                                            </tr>
                                            <tr>
                                                <td><strong>Floor:</strong></td>
                                                <td>{{ $workOrder['floor']->floor_code }}</td>
                                                <td><strong>Area:</strong></td>
                                                <td>{{ $workOrder['area']->code }}</td>
                                            </tr>
                                            <tr>
                                                <td><strong>Labour Hours:</strong></td>
                                                <td colspan="3">{{ $workOrder->labour_hours }}</td>
                                            </tr>
                                        </tbody>
                                    </table>

                                    <div class="row mt-3">
                                        <div class="col-sm-12">
                                            <a href="{{ route('admin.work_orders.list') }}"
                                                class="btn btn-primary back">Back to
                                                Work Orders</a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@push('footer-script')
    <script>
        function printDetail() {
            // Get the work order detail element
            const detail = document.getElementById('work-order-detail');

            const backButton = detail.querySelector('a.back');
            if (backButton) {
                backButton.remove();
            }

            // Create a new window
            const printWindow = window.open('', '', 'height=600,width=800');

            // Write the content to the new window
            printWindow.document.write('<html><head><title>Work Order Details</title>');
            printWindow.document.write('<style>');
            printWindow.document.write('table { width: 100%; border-collapse: collapse; }');
            printWindow.document.write('table, th, td { border: 1px solid black; padding: 8px; }');
            printWindow.document.write('</style></head><body>');
            printWindow.document.write(detail.outerHTML);
            printWindow.document.write('</body></html>');

            // Print the content
            printWindow.document.close();
            printWindow.print();
        }
    </script>
@endpush