@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">
                                    <div class="row mb-3">
                                        <div class="col-sm-6">
                                            <strong>Request Date:</strong> {{ $workOrder->request_date }}
                                        </div>
                                        <div class="col-sm-6">
                                            <strong>Complete Date:</strong> {{ $workOrder->complete_date }}
                                        </div>
                                    </div>

                                    <div class="row mb-3">
                                        <div class="col-sm-6">
                                            <strong>Work Order Type:</strong> {{ $workOrder->wotype->name }}
                                        </div>
                                        <div class="col-sm-6">
                                            <strong>PM | Not PM:</strong> {{ $workOrder->wo_origin ? 'PM' : 'Not PM' }}
                                        </div>
                                    </div>

                                    <div class="row mb-3">
                                        <div class="col-sm-6">
                                            <strong>Time Type:</strong> {{ $workOrder['timeType']->description }}
                                        </div>
                                        <div class="col-sm-6">
                                            <strong>Zone:</strong> {{ $workOrder['zone']->description }}
                                        </div>
                                    </div>

                                    <div class="row mb-3">
                                        <div class="col-sm-6">
                                            <strong>Technician:</strong> {{ $workOrder['technician']->full_name }}
                                        </div>
                                        <div class="col-sm-6">
                                            <strong>Facility:</strong> {{ $workOrder['facility']->name }}
                                        </div>
                                    </div>

                                    <div class="row mb-3">
                                        <div class="col-sm-6">
                                            <strong>Repair Center:</strong> {{ $workOrder['repairCenter']->name }}
                                        </div>
                                        <div class="col-sm-6">
                                            <strong>Trade:</strong> {{ $workOrder['trade']->name }}
                                        </div>
                                    </div>

                                    <div class="row mb-3">
                                        <div class="col-sm-6">
                                            <strong>Task Type:</strong> {{ $workOrder['taskType']->name }}
                                        </div>
                                        <div class="col-sm-6">
                                            <strong>Task:</strong> {{ $workOrder['task']->name }}
                                        </div>
                                    </div>

                                    <div class="row mb-3">
                                        <div class="col-sm-6">
                                            <strong>Status:</strong> {{ $workOrder['status']->name }}
                                        </div>
                                        <div class="col-sm-6">
                                            <strong>Priority:</strong> {{ $workOrder['priority']->name }}
                                        </div>
                                    </div>

                                    <div class="row mb-3">
                                        <div class="col-sm-6">
                                            <strong>Vendor:</strong> {{ $workOrder['vendor']->name }}
                                        </div>
                                        <div class="col-sm-6">
                                            <strong>Shift:</strong> {{ implode(', ', $workOrder['shift']->work_days) }}
                                        </div>
                                    </div>

                                    <div class="row mb-3">
                                        <div class="col-sm-6">
                                            <strong>Requester:</strong> {{ $workOrder['requester']->name }}
                                        </div>
                                    </div>

                                    <h2>Building Details</h2>
                                    <div class="row mb-3">
                                        <div class="col-sm-6">
                                            <strong>Building:</strong> {{ $workOrder['building']->name }}
                                        </div>
                                        <div class="col-sm-6">
                                            <strong>Floor:</strong> {{ $workOrder['floor']->floor_code }}
                                        </div>
                                    </div>

                                    <div class="row mb-3">
                                        <div class="col-sm-6">
                                            <strong>Area:</strong> {{ $workOrder['area']->code }}
                                        </div>
                                    </div>

                                    <div class="row mb-3">
                                        <div class="col-sm-6">
                                            <strong>Labour Hours:</strong> {{ $workOrder->labour_hours }}
                                        </div>
                                    </div>

                                    <div class="row">
                                        <div class="col-sm-12">
                                            <a href="{{ route('admin.work_orders.list') }}" class="btn btn-primary">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');

            // 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('</head><body >');
            printWindow.document.write(detail.outerHTML);
            printWindow.document.write('</body></html>');

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