@extends('operations.layout.mainlayout')

@section('content')
{{--    @if(session('role') != 4 || ( !empty($analyzer->ID) && session('profile_id') != $analyzer->PROFILE_ID))--}}
{{--        {{exit("<h1>Unauthorized access</h1>")}}--}}
{{--    @endif--}}
<!-- 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: #e35a80!important;">@if(!empty($analyzer->NAME_EN)){{$analyzer->NAME_EN}} @else Add Analyzer @endif
                    </h1>
                </div><!-- /.col -->
                <div class="col-sm-6">
                    <ol class="breadcrumb float-sm-right">
                        <li class="breadcrumb-item"><a href="/operations">Home</a></li>
                        <li class="breadcrumb-item active">Lab Analyzer Details</li>
                    </ol>
                </div><!-- /.col -->
            </div><!-- /.row -->
        </div><!-- /.container-fluid -->
    </div>
    <!-- /.content-header -->

    <!-- Main content -->
    <section class="content">
        <div class="container-fluid">
            <div class="row">
                <div class="mx-auto col-md-8">

                    <!-- /.card -->

                    <div class="card">

                        <!-- /.card-header -->
                        <div class="card-body">

                            <ul class="nav nav-tabs" id="custom-content-below-tab" role="tablist"
                                style="margin-bottom: 15px;">
                                <li class="nav-item">
                                    <a class="nav-link active"
                                        style="color: #e35a80 !important;@if(empty($analyzer->NAME_EN)) color:#a9a9a9 !important; @endif"
                                        id="custom-content-below-home-tab" data-toggle="pill"
                                        href="#custom-content-below-home" role="tab"
                                        aria-controls="custom-content-below-home" aria-selected="true">Lab Analyzer
                                        Information</a>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link @if(empty($analyzer->NAME_EN)) disabled @endif"
                                        style="color: #e35a80 !important;@if(empty($analyzer->NAME_EN)) color:#a9a9a9 !important; @endif"
                                        id="custom-content-below-messages-tab" data-toggle="pill"
                                        href="#custom-content-below-messages" role="tab"
                                        aria-controls="custom-content-below-messages" aria-selected="false">Analyzer Tests Reference
                                        </a>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link @if(empty($analyzer->NAME_EN)) disabled @endif"
                                        style="color: #e35a80 !important;@if(empty($analyzer->NAME_EN)) color:#a9a9a9 !important; @endif"
                                        id="analyzer-test-codes-tab" data-toggle="pill"
                                        href="#analyzer-test-codes" role="tab"
                                        aria-controls="analyzer-test-codes" aria-selected="false">Analyzer Tests Codes
                                        </a>
                                </li>
                            </ul>

                            <div class="tab-content" id="custom-content-below-tabContent">

                                <div class="tab-pane fade active show" id="custom-content-below-home" role="tabpanel"
                                    aria-labelledby="custom-content-below-home-tab">

                                    <form method="post" action="/operations/profile-analyzers"
                                        enctype="multipart/form-data">
                                        <input id="analyzer_id" type="hidden" name="ID"
                                            value="@if(!empty($analyzer->ID)){{$analyzer->ID}}@endif">
                                        <p><b>Name</b></p>
                                        <div class="row">
                                            <div class="col-md-6">

                                                <div class="input-group mb-3">
                                                    <div class="input-group-prepend">
                                                        <span class="input-group-text">EN</span>
                                                    </div>
                                                    <input required type="text" class="form-control" name="NAME_EN"
                                                        value="@if(!empty($analyzer->NAME_EN)){{$analyzer->NAME_EN}}@endif" />
                                                </div>
                                            </div>
                                            <div class="col-md-6">
                                                <div class="input-group mb-3">
                                                    <div class="input-group-prepend">
                                                        <span class="input-group-text">AR</span>
                                                    </div>
                                                    <input required type="text" class="form-control" name="NAME_AR"
                                                        value="@if(!empty($analyzer->NAME_AR)){{$analyzer->NAME_AR}}@endif" />
                                                </div>
                                            </div>

                                
                                </div>

                                        <div class="row">
                                            <div class="col-md-6">
                                                <p><b>Type</b></p>
                                                <select required class="form-control" name="TYPE_ID" id="type-id">
                                                    <option value="">Select Analyzer Type</option>
                                                    @foreach($types as $type)
                                                    <option
                                                        {{ !empty($analyzer->ANALYZERTYPE) && $analyzer->ANALYZERTYPE->ID == $type->ID ? 'selected' : ''}}
                                                        value="{{$type->ID}}">{{$type->NAME_EN}}</option>
                                                    @endforeach
                                                </select>
                                            </div>
                                            <div class="col-md-6">
                                                <p><b>Processing Branch</b></p>
                                                <select required name="HOSPITAL_ID" class="form-control">
                                                    <option value="">Select Processing Branch</option>
                                                    @foreach($primary_hospitals as $primary)
                                                        <option @if(!empty($analyzer->HOSPITAL_ID) && $primary->ID == $analyzer->HOSPITAL_ID) selected @endif value="{{$primary->ID}}">{{$primary->NAME_EN}}</option>
                                                    @endforeach
                                                </select><br />
                                            </div>
                                        </div>
                                @permission('mange_administration_lab_analyzers')
                                <div class="row"><br />
                                    <div class="col" style="text-align: center;margin-top:10px;">
                                        <input style="width:200px" type="submit" class="btn btn-info"
                                            value="@if(!empty($analyzer->NAME_EN)) Edit Lab Analyzer @else Add Lab Analyzer @endif" />
                                    </div>
                                </div>
                                @endpermission

                                </form>
                                </div>
                    
                                <div class="tab-pane fade" id="custom-content-below-messages" role="tabpanel"
                                aria-labelledby="custom-content-below-messages-tab">
                          
                                <div class="row">
                                    <div class="col">
                                        <table id="analyzer-test-reference-table" class="table table-bordered table-striped">
                                            <thead>
                                                <tr>
                                                    <th>Test Name</th>
                                                    <th>Test Reference</th>
                                                    <th style="width: 130px;">Action</th>
                                                </tr>
                                            </thead>

                                        </table>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col" style="text-align: center">
                                        <button style="width:240px;color:#fff" data-toggle="modal"
                                            data-target="#modal-item" id="add-test-item" class="btn btn-info">Add
                                            Test Reference </button>
                                    </div>
                                </div>
                            </div>
           
                            <div class="tab-pane fade" id="analyzer-test-codes" role="tabpanel"
                                aria-labelledby="analyzer-test-codes-tab">
                                <div class="row">
                                    <div class="col">
                                        <table id="analyzer-test-code-table" class="table table-bordered table-striped">
                                            <thead>
                                                <tr>
                                                    <th>Test Name (EN)</th>
                                                    <th>Test Name (AR)</th>
                                                    <th>Code</th>
                                                    <th>Display Code</th>
                                                    <th>Action</th>
                                                </tr>
                                            </thead>

                                        </table>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="col" style="text-align: center">
                                        <button style="width:240px;color:#fff" data-toggle="modal"
                                            data-target="#modal-tests" id="add-test-item" class="btn btn-info">Add
                                            Test Code </button>
                                    </div>
                                </div>
                            </div>

                    </div>
                    
                    <!-- /.card-body -->
                </div>
                <!-- /.card -->
            </div>
            <!-- /.col -->
        </div>
        <!-- /.row -->
</div>
<!-- /.container-fluid -->
</section>
<!-- /.content -->
</div>
<!-- /.content-wrapper -->


<!-- /.content-wrapper -->
<div class="modal fade" id="modal-tests">
        <div class="modal-dialog modal-xl">
            <div class="modal-content">
                <div class="modal-header">
                    <h3 class="modal-title">Add Tests</h3>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                    <div class="modal-body">
                    <div class="row">
                            <div class="col" style="text-align: center;">
                                <div class="alert alert-danger alert-danger-item" role="alert" style="display: none;"></div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col">
                                <table id="tests-analyzer-codes-table" class="table table-bordered table-striped">
                                    <thead>
                                    <tr style="display: none;">
                                        <th>Test</th>
                                        <th>Action</th>
                                    </tr>
                                    </thead>

                                </table>
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer justify-content-between">
                        <button style="border-radius: 20px;padding:14px;font-size:15px;min-width:150px;" type="button" class="btn btn-default" data-dismiss="modal" id="tests-cancel">{{trans("web.cancel")}}</button>
                    </div>
            </div>
            <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
    </div>

<div class="modal fade" id="modal-item">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <h3 class="modal-title">Add Test Reference</h3>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <form id="collection-form">
                    <div class="modal-body">
                    <input id="analyzer_id" type="hidden" name="ID"
                                            value="@if(!empty($analyzer->ID)){{$analyzer->ID}}@endif">
                        <div class="row">
                            <div class="col" style="text-align: center;">
                                <div class="alert alert-danger alert-danger-hospital" role="alert" style="display: none;"></div>
                            </div>
                        </div>
                        <div class="row" style="margin-top:20px">
                            <div class="col">
                                <p style="font-size:15px;color:#1F3E61;font-weight: 600;margin-bottom: 10px;">Packages</p>
                                <select  class="form-control rhospital_id" id="hospital-test-id" name="hospital-test-id" >
                                    @foreach($packages as $package)
                                        <option value="{{$package->ID}}" has-template="{{$package->HAS_TEMPLATE}}">{{$package->NAME_EN}}</option>
                                    @endforeach
                                </select>
                            </div>
                            <div class="col-md-6" id="ref-range-section">
                                <p style="font-size:15px;color:#1F3E61;font-weight: 600;margin-bottom: 10px;">Profile Reference Range </p>
                                <select  class="form-control" id="test-ref-range" name="test-ref-range">
                                    <option value="">Select Reference Range</option>
                                    @foreach($ref_ranges as $ref_range)
                                        <option value="{{$ref_range->ID}}" >{{$ref_range->NAME_EN}}</option>
                                    @endforeach
                                </select>
                            </div>

                            <div class="col-md-6" style="display: none;" id="template-section">
                                <p style="font-size:15px;color:#1F3E61;font-weight: 600;margin-bottom: 10px;">Templates</p>
                                <select  class="form-control" id="template-ref-range" name="template-ref-range">
                                    <option value="">Select Template</option>
                                    @foreach($templates as $template)
                                        <option value="{{$template->ID}}" >{{$template->NAME_EN}}</option>
                                    @endforeach
                                </select>
                            </div>

                        </div>
                    </div>
                    <div class="modal-footer justify-content-between">
                        <button style="width:130px;" type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                        <button style="width:130px;color:#fff" id="add-analyzer-package-reference"  type="button" class="btn btn-info">Save</button>
                    </div>
                </form>
            </div>
            <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
    </div>
@endsection