@extends('operations.layout.mainlayout')

@section('content')
    <style>
        #critical-report-table th {
            white-space: nowrap;
        }
        .select2-container--default .select2-selection--multiple .select2-selection__choice {
            color: #020202;
        }
    </style>
    <!-- Content Wrapper. Contains page content -->
    <div class="content-wrapper">
        <!-- Content Header (Page header) -->
        <div class="content-header">
            <div class="container-fluid card">
                <div class="row mb-2">
                    <div class="col-sm-6 card-body">
                        <h1 class="m-0 text-dark" style="color: var(--blazma-text)!important;">Test Details Result Report</h1>
                    </div><!-- /.col -->
                    <div class="col-sm-6">

                    </div><!-- /.col -->
                </div><!-- /.row -->
            </div><!-- /.container-fluid -->
        </div>
        <!-- /.content-header -->

        <!-- Main content -->
        <section class="content">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-12">

                        <!-- /.card -->
                        <div class="col-12 col-sm-12 col-md-12">
                            <br/>
                            <div class="card bg-light">
                                <div class="card-header text-muted border-bottom-0">
                                </div>
                                <form id="test-result-form" method="get" action="" style="width:100%;">
                                    <div class="card-body pt-0">
                                        <div class="row">
                                            <div class="col-12">
                                                <input type="hidden" id="is-qual">
                                                <input type="hidden" id="is-bad-positive">
                                                <input type="hidden" id="test-type">
                                                <input type="hidden" name="export" value="0" id="export-input">
                                                <div class="row">
                                                    <div class="col-md-4">
                                                        <span class="text-muted text-sm"><b>Result Date from</b></span>
                                                        <input required name="date_from" type="text"
                                                               class="form-control" id="r-sample-date-from"
                                                               value="@if(!empty($date_from)){{$date_from}} @else{{date('Y-m-01 00:00')}}@endif"/>
                                                    </div>
                                                    <div class="col-md-4">
                                                        <span class="text-muted text-sm"><b>Result Date to</b></span>
                                                        <input required id="r-sample-date-to" class="form-control"
                                                               type="text" name="date_to"
                                                               value="@if(!empty($date_to)){{$date_to}}@else{{date('Y-m-t 23:59')}}@endif">
                                                    </div>
                                                    <div class="col-md-4">
                                                        <span class="text-muted text-sm"><b>Unit</b></span>
                                                        <select multiple="multiple" class="form-control rhospital_id" name="unit_id[]" id="p-sample-unit-id">
                                                            <option value="">Select Unit</option>
                                                            @foreach($units as $unit)
                                                                <option  value="{{$unit->ID}}" @if(!empty($unit_ids)) @if(in_array($unit->ID,$unit_ids)) selected @endif @endif>{{$unit->NAME_EN}}</option>
                                                            @endforeach
                                                        </select>
                                                    </div>
                                                </div>
                                                <div class="row mt-3">
                                                    <div class="col-md-4">
                                                        <span class="text-muted text-sm"><b>Registration Branch</b></span>
                                                        <select required class="form-control rhospital_id multi" id="p-registration-branch"  multiple="multiple" name="registration_branch[]" @if(!empty(session('role')) && session('role') == 12) required @endif>
                                                            <option value="" disabled>Select Registration Branch</option>
                                                            @foreach($registration_branches as $branch)
                                                                <option class="hospital-option" value="{{$branch->ID}}"  @if(!empty($registration_branche_ids)) @if(in_array($branch->ID,$registration_branche_ids)) selected @endif @endif >{{$branch->NAME_EN}}</option>
                                                            @endforeach
                                                        </select>
                                                        <div class="custom-control custom-switch">
                                                            <input type="checkbox" class="custom-control-input" @if(isset($all_hospital)) checked @endif value="1" name="all_hospital" id="select-all">
                                                            <label class="custom-control-label" for="select-all"  style="margin-right: 10px;font-weight: 300;"> Select All</label>
                                                        </div>
                                                    </div>
                                                    <div class="col-md-4 d-none">
                                                        <span class="text-muted text-sm"><b>Processing Branch</b></span>
                                                        <select multiple="multiple" class="form-control rhospital_id" name="processing_branch[]" id="p-sample-processing-branch">
                                                            <option value="">Select Processing Branch</option>
                                                            @foreach($hospitals as $branch)
                                                                <option  value="{{$branch->ID}}"   @if(!empty($processing_branches)) @if(in_array($branch->ID,$processing_branches)) selected @endif @endif >{{$branch->NAME_EN}}</option>
                                                            @endforeach
                                                        </select><br/>
                                                    </div>
                                                    <div class="col-md-4">
                                                        <span class="text-muted text-sm"><b>Tests</b></span>
                                                        <select name="test_id" class="form-control rhospital_id" id="p-sample-test-ids" required>
                                                            <option value="" selected disabled>Select Test</option>
                                                            @foreach($packages as $package)
                                                                <option value="{{$package->ID}}"  @if(!empty($test_ids)) @if($package->ID == $test_ids) selected @endif @endif >{{$package->NAME_EN}}</option>
                                                            @endforeach
                                                        </select><br/>
                                                    </div>
                                                    <div class="col-md-4">
                                                        <span class="text-muted text-sm"><b>Clients</b></span>
                                                        <select name="client_id"  class="form-control rhospital_id" id="p-sample-client-ids">
                                                            <option value="">Select Client</option>
                                                            @foreach($companies as $company)
                                                                <option value="{{$company->ID}}"   @if(!empty($client_ids)) @if(in_array($company->ID,$client_ids)) selected @endif @endif >{{$company->COMPANY_NAME}}{{!empty($company->CLIENT_CODE)?' ('.$company->CLIENT_CODE.')':''}}</option>
                                                            @endforeach
                                                        </select><br/>
                                                    </div>
                                                </div>
                                                <div class="test-details-row d-none">
                                                    <hr>
                                                    <div class="row mt-3">
                                                        <div class="col-md-4">
                                                            <span class="text-muted text-sm"><b>Test Type</b></span>
                                                            <input type="text" class="form-control" id="test-type-placeholder" disabled/>
                                                        </div>
                                                        <div class="col-md-8" id="range-fields">
                                                        </div>
                                                    </div>
                                                </div>

                                            </div>
                                        </div>

                                    </div>
                                    <div class="card-footer">
                                        <div class="text-right">
                                            <button type="submit" name="submit" value="submit" class="btn btn-sm btn-info">
                                                <i class="fas fa-search"></i> Submit
                                            </button>
                                            <a href="#" id="export-link" target="_blank" class="btn btn-sm btn-success">
                                                <i class="fas fa-download"></i> Export Excel
                                            </a>
                                            {{--<button  type="submit" name="export" id="export-btn" value="export" class="btn btn-sm btn-success">
                                                <i class="fas fa-download"></i> Export Excel
                                            </button>--}}
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                        <div class="card">
                            <!-- /.card-header -->
                            <div class="card-body">

                                <table id="test-details-results-report-table" class="table table-bordered table-striped">
                                    <thead>
                                    <tr>
                                        <th>Test ID</th>
                                        <th>Test Name</th>
                                        <th>ID No</th>
                                        <th>Patient Name</th>
                                        <th>Mobile No</th>
                                        <th>Date</th>
                                        <th>Result</th>
                                        <th>Range From</th>
                                        <th>Range To</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    @foreach($orders as $order)
                                        <tr>
                                            <td>{{$order->LAB_CATEGORY_PACKAGE_ID ?? ''}}</td>
                                            <td>{{$order->test_name ?? ''}}</td>
                                            <td>{{$order->IDENTIFICATION ?? ''}}</td>
                                            <td>{{$order->MOBILE_NUMBER ?? ''}}</td>
                                            <td>{{$order->PATIENT_NAME ?? ''}}</td>
                                            <td>{{$order->RESULT_TIME ?? ''}}</td>
                                            <td>{{$order->RESULT ?? ''}}</td>
                                            <td>{{$order->MIN_NORMAL ?? ''}}</td>
                                            <td>{{$order->MAX_NORMAL ?? ''}}</td>
                                        </tr>
                                    @endforeach
                                    </tbody>
                                </table>
                            </div>
                            <!-- /.card-body -->
                        </div>
                        <!-- /.card -->
                    </div>
                    <!-- /.col -->
                </div>
                <!-- /.row -->
            </div>
            <!-- /.container-fluid -->
        </section>
        <!-- /.content -->
    </div>
    <!-- /.content-wrapper -->

@endsection

@section('footer-scripts')
    <script>

        $(document).ready(function() {
            var urlParams = new URLSearchParams(window.location.search);
            var testId = urlParams.get('test_id');

            if (testId) {
                $("#p-sample-test-ids").val(testId).trigger('change');
            }
        });

        $('#r-sample-date-from').daterangepicker({
            singleDatePicker: true,
            timePicker: true,
            timePicker24Hour: true,
            locale: {
                format: 'YYYY-MM-DD HH:mm'
            },
        })

        $('#r-sample-date-to').daterangepicker({
            singleDatePicker: true,
            timePicker: true,
            timePicker24Hour: true,
            locale: {
                format: 'YYYY-MM-DD HH:mm'
            },
        })
        var testDetailsResultsDataTable = $("#test-details-results-report-table").DataTable({
            dom: 'lBfrtip',
            "searching": false,
            "buttons" : [
                'copy', {
                    extend: 'csv',
                    charset: 'UTF-8',
                    bom: true,
                    footer: true,
                    filename: 'TestResultDetailsReport',
                    title: 'Test Result Details Report'
                }, 'excel', 'pdf', 'print'
            ],
            "lengthMenu": [[10, 25, 50, 100, 500,1000,5000,10000,100000], [10, 25, 50, 100, 500, 1000,5000,10000,100000]],
            "responsive": true,
            "autoWidth": false,
            "order": [[ 0, "asc" ]],
            "paging": true,
            columns: [
                { data: "ID" },
                { data: "test_name" },
                { data: "IDENTIFICATION" },
                { data: "MOBILE_NUMBER" },
                { data: "PATIENT_NAME" },
                { data: "RESULT_TIME" },
                { data: "RESULT", defaultContent: "" },
                { data: "MIN_NORMAL", defaultContent: "" },
                { data: "MAX_NORMAL", defaultContent: "" }
            ]

        });

        $("#p-sample-test-ids").change(function(){
            var testId = $(this).val();
            var hospitalId = $('#p-registration-branch').val();

            $.ajax({
                url: "/operations/test-reference-details",
                method: "GET",
                data:{
                    test_id: testId,
                    hospital_id: hospitalId
                },
                success: function(response) {
                    var testType = response.test_type;
                    $("#test-type-placeholder").val(testType);
                    $("#range-fields").empty();

                    if (testType === "numeric") {
                        $('#test-type').val('numeric');
                        var rangeInputs = `
                    <div class="col-md-6">
                        <span class="text-muted text-sm"><b>Range From</b></span>
                        <input type="number" id="range-from" name="range_from" class="form-control">
                    </div>
                    <div class="col-md-6">
                        <span class="text-muted text-sm"><b>Range To</b></span>
                        <input type="number" id="range-to" name="range_to" class="form-control">
                    </div>
                `;
                        $("#range-fields").html(rangeInputs);
                    }

                    if (testType === "non-numeric") {
                        $('#test-type').val('non-numeric');
                        var qualitativeOptions = response.qualitative_options;
                        if (qualitativeOptions && Object.keys(qualitativeOptions).length > 0) {
                            var dropdown = `
                        <div class="col-md-6">
                            <span class="text-muted text-sm"><b>Non-Numeric Value</b></span>
                            <select class="form-control" name="non_numeric_value">
                                <option value="">Select Value</option>
                    `;
                            $('#is-qual').val(1);
                            (qualitativeOptions?.[1] ?? '') === 'Negative' ? $('#is-bad-positive').val(1) : '';

                            for (var key in qualitativeOptions) {
                                dropdown += `<option value="${key}">${qualitativeOptions[key]}</option>`;
                            }
                            dropdown += `</select>
                        </div>
                    `;
                            $("#range-fields").html(dropdown);
                        } else {
                            var labCategoryPackage = response.lab_category_package;
                            if (labCategoryPackage && labCategoryPackage.lABCATEGORYPACKAGERESULT && labCategoryPackage.lABCATEGORYPACKAGERESULT.length > 0) {
                                var labCategoryPackageDropdown = `
                            <div class="col-md-6 main-options">
                                <span class="text-muted text-sm"><b>Category Package Options</b></span>
                                <select class="form-control" name="lab_category_package" id="lab-category-package">
                                    <option value="">Select Category Option</option>
                        `;
                                for (var i = 0; i < labCategoryPackage.lABCATEGORYPACKAGERESULT.length; i++) {
                                    var packageResult = labCategoryPackage.lABCATEGORYPACKAGERESULT[i];
                                    labCategoryPackageDropdown += `<option value="${packageResult.ID}">${packageResult.NAME_EN}</option>`;
                                }
                                labCategoryPackageDropdown += `</select>
                            </div>
                        `;
                                $("#range-fields").append(labCategoryPackageDropdown);

                                $("#lab-category-package").change(function(){
                                    var selectedPackageId = $(this).val();
                                    var selectedPackageResult = labCategoryPackage.lABCATEGORYPACKAGERESULT.find(function(result) {
                                        return result.ID == selectedPackageId;
                                    });
                                    $("#range-fields .col-md-6.package-options").remove();
                                    if (selectedPackageResult) {
                                        if (selectedPackageResult.TYPE === 'SELECT') {
                                            var packageOptionsDropdown = `
                                        <div class="col-md-6 package-options">
                                            <span class="text-muted text-sm"><b>Package Detailed Options</b></span>
                                            <select class="form-control" name="package_options">
                                                <option value="">Select Package Option</option>
                                    `;
                                            for (var i = 0; i < selectedPackageResult.LABCATEGORYPACKAGERESULTOPTIONS.length; i++) {
                                                var resultOption = selectedPackageResult.LABCATEGORYPACKAGERESULTOPTIONS[i];
                                                packageOptionsDropdown += `<option value="${resultOption.ID}">${resultOption.NAME_EN}</option>`;
                                            }
                                            packageOptionsDropdown += `</select>
                                        </div>
                                    `;
                                            $("#range-fields").append(packageOptionsDropdown);
                                        } else if (selectedPackageResult.TYPE === 'DOUBLE') {
                                            var rangeInputs = `
                                        <div class="col-md-6 package-options">
                                            <span class="text-muted text-sm"><b>Range From</b></span>
                                            <input type="number" id="range-from" name="range_from" class="form-control">
                                        </div>
                                        <div class="col-md-6 package-options">
                                            <span class="text-muted text-sm"><b>Range To</b></span>
                                            <input type="number" id="range-to" name="range_to" class="form-control">
                                        </div>
                                    `;
                                            $("#range-fields").append(rangeInputs);
                                        }
                                    } else {
                                        $("#range-fields .col-md-12.mt-3").remove();
                                    }
                                });
                            }
                        }
                    }

                    $(".test-details-row").removeClass("d-none");
                },
                error: function(xhr, status, error) {
                    console.log(error);
                }
            });
        });

        $("#test-result-form").submit(function(event) {
            event.preventDefault();

            var testId = $("#p-sample-test-ids").val();
            var client_id = $("#p-sample-client-ids").val();
            var hospitalId = $("#p-registration-branch").val();
            var resultId = $("#lab-category-package").val();
            var packageOptions = $("select[name='package_options']").val();
            var rangeFrom = $("#range-from").val();
            var rangeTo = $("#range-to").val();
            var unitId = $("#p-sample-unit-id").val();
            var dateFrom = $("#r-sample-date-from").val();
            var dateTo = $("#r-sample-date-to").val();
            var testType = $("#test-type").val();
            var isQual = $("#is-qual").val();
            var isBadPositive = $("#is-bad-positive").val();
            var nonNumericValue = $("select[name='non_numeric_value']").val();

            var data = {
                test_id: testId,
                hospital_id: hospitalId,
                result_id: resultId,
                package_options: packageOptions,
                range_from: rangeFrom,
                range_to: rangeTo,
                unit_id: unitId,
                date_from: dateFrom,
                date_to: dateTo,
                test_type: testType,
                client_id : client_id,
                is_qual: isQual,
                is_bad_positive: isBadPositive,
                non_numeric_value: nonNumericValue
            };

            $.ajax({
                url: "/operations/tests-result-details-report",
                data: data,
                success: function(response) {
                    console.log(response)
                    testDetailsResultsDataTable.clear().rows.add(response.data).draw();
                },
                error: function(xhr, status, error) {
                    console.log(error);
                    if (xhr.status === 422) {
                        var errors = xhr.responseJSON.errors;
                        $(".error-message").remove();
                        $.each(errors, function(field, messages) {
                            var errorMessage = '<span class="error-message">' + messages[0] + '</span>';
                            $("#" + field).after(errorMessage);
                        });
                    } else {
                        alert("An error occurred while submitting the test details. Please try again.");
                        console.log(error);
                    }
                }
            });
        });

        $("#export-link").click(function(e) {
            e.preventDefault();

            var testId = $("#p-sample-test-ids").val();
            var hospitalId = $("#p-registration-branch").val();
            var resultId = $("#lab-category-package").val();
            var packageOptions = $("select[name='package_options']").val();
            var rangeFrom = $("#range-from").val();
            var rangeTo = $("#range-to").val();
            var unitId = $("#p-sample-unit-id").val();
            var dateFrom = $("#r-sample-date-from").val();
            var dateTo = $("#r-sample-date-to").val();
            var testType = $("#test-type").val();
            var isQual = $("#is-qual").val();
            var allHospitals = $("#select-all").val();
            var client_id = $("#p-sample-client-ids").val();
            var nonNumericValue = $("select[name='non_numeric_value']").val();

            var exportUrl = "/operations/tests-result-details-report?export=1" +
                "&test_id=" + encodeURIComponent(testId) +
                "&hospital_id=" + encodeURIComponent(hospitalId) +
                "&result_id=" + encodeURIComponent(resultId) +
                "&package_options=" + encodeURIComponent(packageOptions) +
                "&range_from=" + encodeURIComponent(rangeFrom) +
                "&range_to=" + encodeURIComponent(rangeTo) +
                "&unit_id=" + encodeURIComponent(unitId) +
                "&date_from=" + encodeURIComponent(dateFrom) +
                "&date_to=" + encodeURIComponent(dateTo) +
                "&client_id=" + encodeURIComponent(client_id) +
                "&test_type=" + encodeURIComponent(testType) +
                "&is_qual=" + encodeURIComponent(isQual) +
                "&all_hospital=" + encodeURIComponent(allHospitals) +
                "&non_numeric_value=" + encodeURIComponent(nonNumericValue);

            window.open(exportUrl, "_blank");
        });

        $('#select-all').on("click", function (e) {
            if($("#select-all").is(':checked'))
            {
                $("#p-registration-branch > .hospital-option").prop("selected","selected");
                $("#p-registration-branch").trigger("change");
            }
            else{
                $("#p-registration-branch > .hospital-option").prop("selected","");
                $("#p-registration-branch").trigger("change");
            }

        });

    </script>
@endsection