@extends('layouts.main')

@push('styles')
    <link href="{{ asset('elite/bower_components/bootstrap-datepicker/bootstrap-datepicker.min.css') }}" rel="stylesheet" type="text/css" />
    <link href="{{ asset('elite/bower_components/select2/select2.min.css') }}" rel="stylesheet" />
@endpush

@section('content')
    <div class="row bg-title">
        <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12">
            <h4 class="page-title">{{ __('surgery.theatre_module_surgery') }}</h4>
        </div>
        <div class="col-lg-8 col-sm-8 col-md-8 col-xs-12">
            <ol class="breadcrumb">
                <li><a href="{{ route('home') }}">{{ __('home.dashboard') }}</a></li>
                <li><a href="{{ route('theatre_surgery.index') }}">{{ __('surgery.surgeries') }}</a></li>
                <li class="active">{{ __('surgery.create_surgery') }}</li>
            </ol>
        </div>
    </div>
    <div class="row">
        <div class="col-sm-12">
            @include('patients::allergies.header')
        </div>
    </div>
<br/>


    @if(isset($surgeries) && count($surgeries) > 0)
    <div class="row">
        <div class="col-md-12">
            <div class="panel">
                <div class="panel-body">
                    <div class="table-responsive">
                        <b>{{ __('surgery.previous_surgeries_from_episode') }} <font color="blue">{{ streamline_date(get_name($episode_id, 'id', 'created_at', 'patient_episodes')) }}</font></b>
                        <table class="table color-bordered-table success-bordered-table">
                            <thead>
                            <th>{{ __('surgery.surgery') }}</th>
                            <th>{{ __('surgery.anaesthetist') }}</th>
                            <th>{{ __('surgery.surgeon') }}</th>
                            <th>{{ __('surgery.time_of_commencement') }}</th>
                            <th>{{ __('surgery.date') }}</th>
                            <th></th>
                            <th></th>
                            </thead>
                            <tbody>
                            @foreach($surgeries as $item)
                                <tr>
                                    <td>
                                        @php
                                        $procedures_array = explode(",", $item->procedure_id);
                                    @endphp
                                    @for ($i = 0; $i < count($procedures_array); $i++)
                                        - {{ get_name($procedures_array[$i],'id','name','procedures') }}<br>
                                    @endfor
                                    </td>
                                    <td>{{ get_full_name($item->surgeon, 'id', 'first_name', 'last_name', 'users') }}</td>
                                    <td>{{ get_full_name(get_name($item->anaesthesia_id,'id','anaesthetist','anaesthesias'),'id','first_name','last_name','users') }}</td>
                                    <td>{{ get_name($item->anaesthesia_id,'id','time_commenced','anaesthesias') }}</td>
                                    <td>{{ streamline_date($item->created_at) }}</td>
                                    <td><a class="btn btn-sm btn-info" href="{{ route('theatre_surgery.details', $item->id) }}">{{ __('surgery.view_details') }}</a></td>
                                    <td><a class="btn btn-sm btn-success" href="/theatre_surgery/{{ $item->id }}/edit">Edit Details</a></td>
                                </tr>
                            @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
    @endif

    <div class="row">
        <div class="col-sm-12">
            @include('flash::message')

            @php 
                $consultation = \Streamline\Models\Consultation::where(['episode_id' => $episode_id, 'patient_id' => $patient_id])->first();
            @endphp

            @foreach ($errors->all() as $error)
                <div><font color="red">{{ $error }}</font></div>
            @endforeach

            <div class="white-box">
                <h3>{{ __('surgery.create_surgery') }}</h3><br>
                {{ Form::open(['route' => 'theatre_surgery.store','data-toggle'=>'validator']) }}

                @if(!is_null($anaesthesia))
                    {{Form::hidden('anaesthesia_id', $anaesthesia->id)}}
                @endif
                {{Form::hidden('anaesthesia_complete', $anaesthesia_complete)}}

                <div class="row">
                    <div class="col-sm-12">
                        <div class="table-responsive">
                            <table class="table table-hover color-table success-table table-bordered">
                                <thead>
                                    <tr>
                                        <th>{{ __('inpatient.primary_diagnosis') }}</th>
                                        <th>{{ __('inpatient.prompt') }}</th>
                                        <th>{{ __('inpatient.references') }}</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                        <td style="width: 30%;">
                                            <div class="form-group">
                                                {{ Form::select('primary_diagnosis', $diagnoses, $consultation ? $consultation->primary_diagnosis : "", ['class' => 'form-control select_field col-sm-12 compulsory', 'required', 'id' => 'primary_diagnosis']) }}
                                            </div>
                                        </td>
                                        <td style="width: 45%; color: #C85F6A;"><div class="well well-sm" id="primary_diagnosis_prompt">{{ (isset($consultation->primary_diagnosis) && $consultation->primary_diagnosis != 0) ? $diagnoses_all->firstWhere('id',$consultation->primary_diagnosis)->prompts : "" }}&nbsp;</div></td>
                                        <td style="width: 25%">
                                            <div class="well well-sm" id="primary_diagnosis_reference">
                                                @if(!is_null($consultation) && $consultation->primary_diagnosis != 0)
                                                    @php
                                                        $reference_names = explode(",", get_name($consultation->primary_diagnosis, 'id', 'reference_names', 'diagnoses'));
                                                        $reference_areas = explode(",", get_name($consultation->primary_diagnosis, 'id', 'reference_areas', 'diagnoses'));
                                                    @endphp
                                                    @for($i = 0; $i < count($reference_names); $i++)
                                                        @if(isset($reference_areas[$i]) && isset($reference_names[$i]))
                                                            <a href="{{ $reference_areas[$i] }}" target='_blank'> {{ $reference_names[$i] }} </a> <span style='color: red'> | </span>
                                                        @endif
                                                    @endfor
                                                @endif
                                            </div>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <a data-toggle="modal" data-target="#diagnosisModal" class="label labelLeft label-info pull-left" style="color: #fff;">{{ __('consultations.add_new_diagnosis') }}</a>
                                        </td>
                                        <td colspan="2"></td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>

                        <hr/>

                        <div class="table-responsive">
                            <table class="table color-table success-table table-condensed table-bordered" id="other_diagnosis_table">
                                <thead>
                                <tr>
                                    <th class="text-center">#</th>
                                    <th>{{ __('inpatient.other_diagnosis') }}</th>
                                    <th>{{ __('inpatient.prompt') }}</th>
                                    <th>{{ __('inpatient.references') }}</th>
                                </tr>
                                </thead>
                                <tbody>
                                @php
                                    $other_diagnoses = [];

                                    if($consultation){
                                        $other_diagnoses = @unserialize($consultation->other_diagnoses);
                                    }                                
                                @endphp

                                @if(empty($other_diagnoses))
                                    <tr>
                                        <td><input type="checkbox" name="chk" id="chk"></td>
                                        <td style="width: 30%;">
                                            {{ Form::select('other_diagnosis[]', $diagnoses, '', ['class' => 'form-control col-sm-12 sec_d']) }}
                                        </td>
                                        <td style="width: 45%"><div class="well well-sm" id="secondary_diagnosis_prompt1">&nbsp;</div></td>
                                        <td style="width: 25%"><div class="well well-sm" id="secondary_diagnosis_reference1">&nbsp;</div></td>
                                    </tr>
                                @else
                                    @foreach($other_diagnoses as $diagnosis)
                                        <tr>
                                            <td><input type="checkbox" name="chk" id="chk"></td>
                                            <td style="width: 30%;">
                                                {{ Form::select('other_diagnosis[]', $diagnoses, $diagnosis, ['class' => 'form-control col-sm-12 select sec_d']) }}
                                            </td>
                                            <td style="width: 45%; color: #C85F6A;"><div class="well well-sm" id="secondary_diagnosis_prompt1">{{ is_object($diagnoses_all->firstWhere('id',$diagnosis)) ? $diagnoses_all->firstWhere('id',$diagnosis)->prompts : '' }}&nbsp;</div></td>
                                            <td style="width: 25%"><div class="well well-sm" id="secondary_diagnosis_reference1">{{ is_object($diagnoses_all->firstWhere('id',$diagnosis)) ? $diagnoses_all->firstWhere('id',$diagnosis)->reference_names : '' }}&nbsp;</div></td>
                                        </tr>
                                    @endforeach
                                @endif
                                </tbody>
                            </table>
                        </div>

                        <a class="btn btn-success btn-xs m-t-10" id="add_row" onclick="addRow('other_diagnosis_table')">{{ __('inpatient.add_row') }}</a>
                        <a class="btn btn-danger btn-xs m-t-10" id="delete_row" onclick="deleteRow('other_diagnosis_table')">{{ __('inpatient.delete_row') }}</a>
                    </div>

                    <div class="col-sm-5">
                        <br><br>
                        <div class="form-group">
                            {{ Form::label('procedure_id', __('surgery.surgical_procedure')) }}
                            {{ Form::select('procedure_id[]',$procedures,$anaesthesia_complete ? $anaesthesia->procedure_id : '',['class' => 'form-control select compulsory', 'required', 'data-error'=>'','id'=>'procedure_id', 'multiple'=>'true']) }}
                            <div class="help-block with-errors"></div>
                            <a href="#modal_new_procedure" data-toggle="modal" id="new_procedure_modal"><small> New procedure </small></a>
                        </div>

                        <div class="row">
                            <div class="form-group col-sm-6">
                                {{ Form::label('surgeon',__('surgery.surgeon')) }}
                                {{ Form::select('surgeon', $doctors, '', ['class' => 'form-control compulsory', 'required', 'data-error'=>'', 'id'=>'surgeon', 'onchange'=>'get_cadre(this.value)']) }}
                                <div class="help-block with-errors"></div>
                                <input type="hidden" id="surgeon_temporary" name="surgeon_temporary">
                                <a href="#modal_new_surgeon" data-toggle="modal" id="new_surgeon_modal"><small>add new surgeon</small></a>
                            </div>

                            <div class="form-group col-sm-6">
                                {{ Form::label('cadre',__('surgery.cadre')) }}
                                {{ Form::text('cadre','',['class' => 'form-control', 'data-error'=>'','id'=>'cadre','readonly'=>'true']) }}
                                <div class="help-block with-errors"></div>
                            </div>
                        </div>

                        <div class="row" id="procedure_amount_info" style="display: none;">
                            <div class="col-sm-12">
                                <div class="alert alert-info">
                                    <button type="button" class="close" data-dismiss="alert">×</button>
                                    <span>The total amount of this selected procedure is <span id="procedure_amount"></span></span>
                                </div>
                            </div>
                        </div>


                        <div class="form-group">
                            {{ Form::hidden('procedure_hospital_fee', 0, ['class' => 'form-control performance_fee', 'readonly', 'id' => 'procedure_hospital_fee']) }}

                            {{ Form::label('staff_fee', 'Staff fee (PF: Professional Fee)') }}
                            {{ Form::number('procedure_performance_fee', 0, ['class' => 'form-control performance_fee', 'id' => 'first_procedure_performance_fee']) }}
                        </div>

                        <div class="form-group">
                            {{ Form::label('scrub_nurse',__('surgery.scrub_nurse')) }}
                            {{ Form::select('scrub_nurse', $nursing, 0, ['class' => 'form-control compulsory required', 'data-error'=>'','id'=>'scrub_nurse']) }}
                            <div class="help-block with-errors"></div>
                            <input type="hidden" id="scrub_nurse_temporary" name="scrub_nurse_temporary">
                            <a href="#modal_new_nurse" data-toggle="modal" id="new_nurse_modal"><small> add new nurse </small></a>
                        </div>

                        <div class="form-group">
                            {{ Form::label('authorised_swab_check',__('surgery.scrub_check_authorized_by')) }}
                            {{ Form::select('authorised_swab_check', $nursing, 0,['class' => 'form-control compulsory required', 'data-error'=>'','id'=>'authorised_swab_check']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('date_surgery_completed',__('surgery.date_surgery_completed')) }}
                            <div class="input-group">
                                {{ Form::text('date_surgery_completed',date('Y-m-d'),['class' => 'form-control','readonly','id'=>'datepicker-autoclose']) }}
                                <span class="input-group-addon"><i class="icon-calender"></i></span>
                            </div>
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('time_surgery_completed',__('surgery.time_surgery_completed')) }}
                            {{ Form::time('time_surgery_completed','',['class' => 'form-control', 'data-error'=>'','id'=>'time_surgery_completed']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('estimated_blood_loss',__('surgery.estimated_blood_loss')) }}
                            {{ Form::number('estimated_blood_loss','',['class' => 'form-control', 'data-error'=>'','id'=>'estimated_blood_loss']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('comments',__('surgery.comments')) }}
                            {{ Form::textarea('comments','',['class' => 'form-control', 'data-error'=>'','id'=>'comments']) }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div>
                            {{ __('surgery.completed_by') }} <span style="color: green; font-weight: bold;"> {{ auth()->user()->first_name }} {{ auth()->user()->last_name }}</span> {{ __('surgery.on') }} <span style="color: green; font-weight: bold;"> {{ streamline_date(date('d-m-Y')) }}</span>
                        </div>
                    </div>

                    <div class="col-sm-1"></div>

                    <div class="col-sm-5">
                        <br><br>
                        <div class="form-group">
                            {{ Form::label('surgery_type',__('surgery.surgery_type')) }}
                            <br>
                            {{ Form::radio('surgery_type', 1, false, ["required"]) }} {{ __('surgery.elective') }} &nbsp;&nbsp;
                            {{ Form::radio('surgery_type', 2, false, ["required"]) }} {{ __('surgery.emergency') }}
                            <div class="help-block with-errors"></div>
                        </div>

                        <div class="form-group">
                            {{ Form::label('assistant_surgeon',__('surgery.assistant_surgeon')) }}
                            {{ Form::select('assistant_surgeon', $doctors, 0, ['class' => 'form-control compulsory', 'data-error'=>'','id'=>'assistant_surgeon','required']) }}
                            <input type="hidden" id="assistant_surgeon_temporary" name="assistant_surgeon_temporary">
                            <div class="help-block with-errors"></div>
                            <a href="#modal_new_assistant_surgeon" data-toggle="modal" id="new_assisant_surgeon_modal"><small>{{ __('surgery.add_new_assistant_surgeon') }}</small></a>
                        </div>

                        <div class="form-group">
                            {{ Form::label('other_scrub_nurse',__('surgery.other_scrub_staff')) }}
                            {{ Form::select('other_scrub_staff', $nursing, 0,['class' => 'form-control', 'data-error'=>'','id'=>'other_scrub_staff','required']) }}
                            <div class="help-block with-errors"></div>
                            <input type="hidden" id="other_scrub_staff_temporary">
                            <a href="#modal_other_scrub_staff" data-toggle="modal" id="other_scrub_stuff_modal"><small> {{ __('surgery.add_new_scrub_staff') }} </small></a>
                        </div>

                        <div class="form-group">
                            {{ Form::label('theatre_location',__('surgery.theatre_location')) }}
                            {{ Form::select('theatre_location',$theatre_locations,'',['class' => 'form-control', 'data-error'=>'','id'=>'theatre_location']) }}
                            <div class="help-block with-errors"></div>
                            <a href="#modal_new_theatre_location" data-toggle="modal" id="new_theatre_location_modal"><small> {{ __('surgery.add_new_theatre_location') }} </small></a>
                        </div>

                        <div class="form-group">
                            {{ Form::label('theatre_incharge',__('theatre_surgeries.designated_incharge')) }}
                            {{ Form::select('theatre_incharge', $theatre_in_charge_users, 0,['class' => 'form-control compulsory', 'data-error'=>'','id'=>'theatre_incharge','required']) }}
                            <div class="help-block with-errors"></div>
                            <input type="hidden" id="theatre_incharge_temporary" name="theatre_incharge_temporary">
                            <a href="#modal_new_scrub_staff" data-toggle="modal" id="new_scrub_staff_modal"><small> {{ __('surgery.add_new_nurse') }} </small></a>
                        </div>

                        <div class="form-group">
                            {{ Form::label('outcome',__('surgery.outcome')) }}
                            {{ Form::select('outcome',$outcomes, is_null($episode_consultation_outcome) ? '' :  $episode_consultation_outcome ,['class' => 'form-control', 'data-error'=>'','id'=>'outcome','required']) }}
                        </div>

                        <div id="admitted_div" @if($episode_consultation_outcome != 1) style="display: none" @endif>
                            <div class="form-group">
                                {{ Form::label('ward_id',__('consultations.select_ward')) }}
                                <div class="input-group">
                                    {{ Form::select('ward_id', $wards, isset($ward_id) ? $ward_id :  '', ['class' => 'form-control compulsory']) }}
                                </div>
                            </div>

                            <div class="form-group">
                                {{ Form::label('admitted_on',__('consultations.admitted_on')) }}
                                <div class="input-group">
                                    {{ Form::text('admitted_on', isset($admission_date) ? Carbon\Carbon::parse($admission_date)->format('Y-m-d') : date('Y-m-d'),['class' => 'form-control datepicker-autoclose compulsory', 'readonly']) }}
                                    <span class="input-group-addon"><i class="icon-calender"></i></span>
                                </div>
                            </div>
                        </div>

                        <div id="home_with_followup_div" @if($episode_consultation_outcome != 3) style="display: none"@endif>
                            <!-- <div class="form-group">
                                <div class="input-group">
                                    {{ Form::text('followup_where',isset($episode_consultation_details->followup_where) ? $episode_consultation_details->followup_where : '',['class' => 'form-control compulsory', 'placeholder'=>'Where?']) }}
                                </div>
                            </div> -->

                            <div class="form-group">
                                {{ Form::label('followup_clinic_allocation', 'Assign Clinic') }}
                                {{ Form::select('followup_clinic_allocation', $clinics, 0, ['class' => 'form-control col-sm-12 compulsory']) }}
                            </div>

                            <div class="form-group">
                                {{ Form::label('followup_in_charge', __('consultations.assign_incharge')) }}
                                <select name="followup_in_charge" class="form-control col-sm-12 compulsory">
                                    <option value="0" selected>{{ __('consultations.not_assigned') }}</option>
                                    @foreach($users as $user)
                                        <option value="{{ $user->id }}">{{ $user->first_name }} {{ $user->last_name }}</option>
                                    @endforeach
                                </select>
                            </div>

                            <div class="form-group">
                                {{ Form::label('followup_when',__('consultations.when')) }}
                                <div class="input-group">
                                    {{ Form::text('followup_when',isset($episode_consultation_details->followup_when) ? Carbon\Carbon::parse($episode_consultation_details->followup_when)->format('Y-m-d') : date('Y-m-d'),['class' => 'form-control compulsory datepicker-autoclose','readonly']) }}
                                    <span class="input-group-addon"><i class="icon-calender"></i></span>
                                </div>
                            </div>

                            <div class="form-group">
                                {{ Form::label('followup_in_time', __('consultations.appointment_time')) }}
                                {{ Form::time('followup_in_time',isset($episode_consultation_details->referred_to) ? $episode_consultation_details->followup_time : '',['class' => 'form-control']) }}
                            </div>
                        </div>

                        <div id="referred_div" @if($episode_consultation_outcome != 4) style="display: none" @endif>
                            <div class="form-group">
                                {{ Form::label('referral_id',__('consultations.referred_to')) }}
                                <div class="input-group">
                                    {{ Form::select('referral_id', $referrals, isset($episode_consultation_details->referred_to) ? $episode_consultation_details->referred_to : '', ['class' => 'form-control compulsory']) }}
                                </div>
                            </div>
                        </div>

                        <!-- <div id="admitted_div" style="display: none;">
                            <div class="form-group">
                                {{ Form::label('ward_id',__('surgery.select_ward')) }}
                                <div class="input-group">
                                    {{ Form::select('ward_id', $wards, '', ['class' => 'form-control compulsory', 'ward_id']) }}
                                </div>
                            </div>

                            <div class="form-group">
                                {{ Form::label('admitted_on',__('surgery.admitted_on')) }}
                                <div class="input-group">
                                    {{ Form::text('admitted_on',date('d/m/Y'),['class' => 'form-control datepicker-autoclose compulsory', 'readonly', 'id'=>'admitted_on']) }}
                                    <span class="input-group-addon"><i class="icon-calender"></i></span>
                                </div>
                            </div>
                        </div>
                        <div id="home_with_followup_div" style="display: none;">
                            <div class="form-group">
                                <div class="input-group">
                                    {{ Form::text('followup_where','',['class' => 'form-control compulsory', 'placeholder'=>__('surgery.where')]) }}
                                </div>
                            </div>

                            <div class="form-group">
                                {{ Form::label('followup_when',__('surgery.when')) }}
                                <div class="input-group">
                                    {{ Form::text('followup_when','',['class' => 'form-control compulsory datepicker-autoclose','readonly','id'=>'followup_when']) }}
                                    <span class="input-group-addon"><i class="icon-calender"></i></span>
                                </div>
                            </div>
                        </div>
                        <div id="referred_div" style="display: none;">
                            <div class="form-group">
                                {{ Form::label('referral_id',__('surgery.referred_to')) }}
                                <div class="input-group">
                                    {{ Form::select('referral_id', $referrals, '', ['class' => 'form-control compulsory']) }}
                                </div>
                            </div>
                        </div> -->

                        <div class="form-group row" id="sundries_used_div">
                            <div class="col-sm-8">
                                {{ Form::label('sundries_used','Sundries used') }}
                                {{ Form::select('sundries_used[]',$sundries_array,'',['class' => 'form-control sundries_sutures select_field', 'data-error'=>'','id'=>'vicryl_sutures_used']) }}
                            </div>
                            <div class="col-sm-4">
                                {{ Form::label('sundries_quantity_used','Quantity used') }}
                                {{ Form::number('sundries_quantity_used[]','',['class' => 'form-control', 'data-error'=>'']) }}
                            </div>
                        </div>
                        <a href="#" id="addOption">Add other sundries used</a><br><br>

                        <div class="form-group row" id="extras_used_div">
                            <div class="col-sm-8">
                                {{ Form::label('extras_used','Extras used') }}
                                {{ Form::text('extras_used[]','',['class' => 'form-control', 'data-error'=>'']) }}
                            </div>
                            <div class="col-sm-4">
                                {{ Form::label('extras_cost','Cost') }}
                                {{ Form::number('extras_cost[]','',['class' => 'form-control', 'data-error'=>'']) }}
                            </div>
                        </div>
                        <a href="#" id="addOptionExtras">Add other extras used</a><br><br>

                        <div class="form-group" id="wrapper">
                            <div id="drugs_div">
                                <div class="row drugs_row1">
                                    <div class="col-md-6">
                                        <label class="">{{ __('anaesthetics.other_drugs_given') }}</label>
                                        {{ Form::select('drugs[]', $drugs, '', ['class' => 'form-control select_field other_drug_id','style'=>'margin-bottom: 5px;', 'id' => 'other_drug_id_0']) }}
                                    </div>
                                    <div class="col-md-3">
                                        <label class="">{{ __('anaesthetics.dose') }}</label>
                                        {{ Form::number('dose[]', '', ['class' => 'form-control other_drug_dose', 'id' => 'other_drug_dose_0']) }}
                                    </div>
                                    <div class="col-md-3">
                                        <label class="">{{ __('anaesthetics.units') }}</label>
                                        {{ Form::select("units[]", $units, "", ["class" => "form-control select other_drug_unit", 'id' => 'other_drug_unit_0']) }}
                                    </div>
                                </div>
                            </div>
                        </div>
                        <a href="#" id="add-drug-row">{{ __('anaesthetics.add_more_drugs') }}</a><br><br>

                        <div class="alert-danger" style="padding: 10px">
                            <button type="button" class="close" data-dismiss="alert">×</button>
                            {{ __('surgery.if_any_risks_alert') }}.
                        </div>

                        <div class="form-group" style="padding-top: 10px; float: right;">
                            {{ Form::submit(__('surgery.complete'),['class' => 'btn btn-success', 'onclick'=>'return confirm_outcome()']) }}
                        </div>
                    </div>
                </div>
                {{ Form::close() }}
            </div>
        </div>
    </div>

    <!-- start modals -->
    <div class="modal fade" id="modal_new_procedure" tabindex="-1" role="dialog">
        <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="exampleModalLabel1">New procedure</h4>
                </div>
                <div class="modal-body">
                    <div class="container-fluid">
                        <div class="row">
                            <div class="col-md-12">
                                @include('theatre::theatre_surgeries.add.add_procedure')
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                    <input type="button" class="btn btn-success" id="submitNewProcedure" value="Save"/>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade" id="modal_new_surgeon" tabindex="-1" role="dialog">
        <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="exampleModalLabel1">{{ __('surgery.register_new_surgeon') }}</h4>
                </div>
                <div class="modal-body">
                    <div class="container-fluid">
                        <div class="row">
                            <div class="col-md-12">
                                @include('theatre::theatre_surgeries.add.add_surgeon')
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                    <input type="button" class="btn btn-success" id="submitSurgeon" value="Save"/>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade" id="modal_new_assistant_surgeon" tabindex="-1" role="dialog">
        <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="exampleModalLabel1">{{ __('surgery.register_new_assistant_surgeon') }}</h4>
                </div>
                <div class="modal-body">
                    <div class="container-fluid">
                        <div class="row">
                            <div class="col-md-12">
                                @include('theatre::theatre_surgeries.add.add_assistant_surgeon')
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                    <input type="button" class="btn btn-success" id="submitAssistantSurgeon" value="Save"/>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade" id="modal_new_nurse" tabindex="-1" role="dialog">
        <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="exampleModalLabel1">{{ __('surgery.register_new_nurse') }}</h4>
                </div>
                <div class="modal-body">
                    <div class="container-fluid">
                        <div class="row">
                            <div class="col-md-12">
                                @include('theatre::theatre_surgeries.add.add_nurse')
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                    <input type="button" class="btn btn-success" id="submitNurse" value="Save"/>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade" id="modal_new_theatre_location" tabindex="-1" role="dialog">
        <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="exampleModalLabel1">{{ __('surgery.register_new_theatre_location') }}</h4>
                </div>
                <div class="modal-body">
                    <div class="form-group">
                        <label>{{ __('surgery.theatre_location') }}</label>
                        <input class="form-control compulsory" id="theatre_location_name" name="theatre_location_name" type="text" />
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                    <input type="button" class="btn btn-success" id="submitTheatreLocation" value="Save"/>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade" id="modal_other_scrub_staff" tabindex="-1" role="dialog">
        <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="exampleModalLabel1">{{ __('surgery.register_new_scrub_nurse') }}</h4>
                </div>
                <div class="modal-body">
                    <div class="container-fluid">
                        <div class="row">
                            <div class="col-md-12">
                                @include('theatre::theatre_surgeries.add.add_scrub_staff')
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                    <input type="button" class="btn btn-success" id="submitOtherScrubStaff" value="Save"/>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade" id="modal_new_scrub_staff" tabindex="-1" role="dialog">
        <div class="modal-dialog modal-lg" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="exampleModalLabel1">Register a new scrub nurse</h4>
                </div>
                <div class="modal-body">
                    <div class="container-fluid">
                        <div class="row">
                            <div class="col-md-12">
                                @include('theatre::theatre_surgeries.add.add_scrub_nurse')
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                    <input type="button" class="btn btn-success" id="submitScrubNurse" value="Save"/>
                </div>
            </div>
        </div>
    </div>

    @include('patients::consultations.add_diagnosis')
    <!-- end of modals -->
@endsection

@push('scripts')
    <script src="{{ asset('elite/bower_components/bootstrap-datepicker/bootstrap-datepicker.min.js') }}"></script>
    <script src="{{ asset('elite/bower_components/select2/select2.min.js') }}"></script>
    <script>
        function submitDiagnosis(){
            var diagnosis_name = $("#diagnosis_name").val();
            var icd10_code = $("#icd10_code").val();
            var hmis_no_outpatient = $("#hmis_no_outpatient").val();
            var hmis_no_inpatient = $("#hmis_no_inpatient").val();
            var hmis_category = $("#hmis_category").val();
            var diagnosis_prompts = $("#diagnosis_prompts").val();
            var chronic_yes = $("#chronic_yes").val();
            var chronic_no = $("#chronic_no").val();
            var chronic_status = null;

            if($('#chronic_yes').is(':checked')){
                chronic_status = 1;
            } else if($('#chronic_no').is(':checked')){
                chronic_status = 0;
            }

            if ($("#diagnosis_name").val() === "" || !$("#diagnosis_name").val()) {
                alert("Please make sure that you fill in a diagnosis name");
                return false;
            }

            var data = {'diagnosis_name':diagnosis_name, 'icd10_code': icd10_code, 'hmis_no_outpatient': hmis_no_outpatient, 'hmis_no_inpatient': hmis_no_inpatient, 'hmis_category': hmis_category, 'diagnosis_prompts': diagnosis_prompts, chronic_status: 'chronic_status'};

            $.ajax({
                method: 'POST',
                url: '/consultation/add_diagnosis',
                data: data,
                success: function(response){
                    if(!isNaN(response)){
                        //response = last inserted id
                        $('.primaryDiagnosis').append($('<option>', {
                            value: response,
                            text: diagnosis_name
                        }));
                        $('.primaryDiagnosis').val(response);//preselect the newly added referral
                        $('#diagnosisModal').modal('hide'); //manually hide the modal
                    } else {
                        alert("error occurred");
                    }
                },
                error: function(jqXHR, textStatus, errorThrown) {
                    alert(JSON.stringify(jqXHR));
                    console.log(JSON.stringify(jqXHR));
                }
            });
        }

        function confirm_outcome(){
            let outcome = $('#outcome').val();

            if(outcome === ""){
                alert("Please select an outcome before completing surgery");
                return false;
            } else {
                // check if outcome is admitted and no ward is selected
                let ward_id = $('#ward_id').val();
                if (outcome == 1 && ward_id == ''){
                    alert("Please select a ward where the patient is going to be admitted");
                    return false;
                } else {
                    return true;
                }
            }
        }

        function get_cadre(id){
            var user_id = id;
            $.ajax({
                type:'get',
                url: '/get_cadre',
                data: { user_id : user_id},
                cache: false,
                success: function (response) {
                    //console.log(response);
                    $('#cadre').val(response);
                }
            });
        };

    </script>
    <script type="text/javascript">
        $(document).ready(function () {
            generalSelect2Set();

            $('#datepicker-autoclose,#admitted_on,#followup_when').datepicker({
                autoclose: true,
                todayHighlight: true,
                format: 'yyyy-mm-dd',
            });

            $("#outcome").change(function () {
                var id = $(this).val();

                switch (id) {
                    case "1": // Admitted
                        $('#admitted_div').show();
                        $('#home_with_followup_div').hide();
                        $('#referred_div').hide();
                        break;

                    case "3": // Home with follow up
                        $('#home_with_followup_div').show();
                        $('#admitted_div').hide();
                        $('#referred_div').hide();
                        break;

                    case "4": // Referred
                        $('#referred_div').show();
                        $('#home_with_followup_div').hide();
                        $('#admitted_div').hide();
                        break;

                    default:
                        $('#admitted_div').hide();
                        $('#home_with_followup_div').hide();
                        $('#referred_div').hide();
                        break;
                }
            });

            function handleAjaxError(jqXHR, textStatus, errorThrown){
                console.log(jqXHR, textStatus, errorThrown);
                if(jqXHR.status === 500){
                    alert("User Name or Email Already Exist");
                }
            }

            $('#submitTheatreLocation').click(function () {
                var name = $('#theatre_location_name').val();
                if (name === '') {
                    alert("Please fill out the name");
                } else {
                    $.ajax({
                        type: "post",
                        url: "/add_new_theatre_location",
                        data: {name: name},
                        cache: false,
                        success: function (result) {
                            $('#theatre_location').append($('<option>', {
                                value: result,
                                text: name
                            }));
                            $('#theatre_location').val(result);//preselect the newly added location
                            $('#modal_new_theatre_location').modal('hide'); //manually hide the modal
                        },
                        error: function (error) {
                            console.log(error);
                        }
                    });
                }
            });

            $('#submitNurse').click(function () {

                console.log('saving nurses eryday');

                var first_name = $('#n_first_name').val();
                var last_name = $('#n_last_name').val();
                var phone_number = $('#n_phone_number').val();
                var email = $('#n_email').val();
                var position_id = $('#n_position_id').val();
                var user_name = $('#n_user_name').val();
                var secret_pin = $('#n_secret_pin').val();
                var security_question = $('#n_security_question').val();
                var security_answer = $('#n_security_answer').val();
                var registration_number = $('#n_registration_number').val();

                if (first_name === '') {
                    alert("Please fill out the first name");
                }else if(last_name === ''){
                    alert("Please fill out the last name");
                }else if(phone_number === ''){
                    alert("Please fill out the phone number");
                }else if(email === ''){
                    alert('Please fill out the email')
                }else if(position_id === ''){
                    alert('Please fill out the position of the staff being created');
                }else if(user_name === ''){
                    alert('Please fill out the user name for the staff');
                }else if(secret_pin === ''){
                    alert('Please fill out the secret pin ');
                }else if(security_question === ''){
                    alert('Please Select a security question');
                }else if(security_answer === ''){
                    alert('Please fill out an answer for the select question');
                }else if(registration_number === ''){
                    alert('Please fill out the registration number');
                }else {

                    let data = {
                        'first_name' : first_name,
                        'last_name' : last_name,
                        'phone_number' : phone_number,
                        'email': email,
                        'position_id' : position_id,
                        'user_name' : user_name,
                        'secret_pin' : secret_pin,
                        'security_question' : security_question,
                        'security_answer' : security_answer,
                        'registration_number': registration_number,
                    };
                    console.log(JSON.stringify(data));
                    $.ajax({
                        type: "post",
                        url: '/quick_add_user',
                        data: data,
                        cache: false,

                        success: function (result) {
                            console.log(JSON.stringify(result));
                            $('#scrub_nurse').append($('<option>', {
                                value: result,
                                text: (first_name + ' ' +last_name)
                            }));
                            $('#scrub_nurse').val(name);
                            $('#scrub_nurse_temporary').val(name);
                            $('#modal_new_nurse').modal('hide');
                        },
                        error: handleAjaxError
                    });
                }
            });

            $('#submitOtherScrubStaff').click(function () {

                console.log('saving nurses eryday');

                var first_name = $('#ss_first_name').val();
                var last_name = $('#ss_last_name').val();
                var phone_number = $('#ss_phone_number').val();
                var email = $('#ss_email').val();
                var position_id = $('#ss_position_id').val();
                var user_name = $('#ss_user_name').val();
                var secret_pin = $('#ss_secret_pin').val();
                var security_question = $('#ss_security_question').val();
                var security_answer = $('#ss_security_answer').val();
                var registration_number = $('#ss_registration_number').val();

                if (first_name === '') {
                    alert("Please fill out the first name");
                }else if(last_name === ''){
                    alert("Please fill out the last name");
                }else if(phone_number === ''){
                    alert("Please fill out the phone number");
                }else if(email === ''){
                    alert('Please fill out the email')
                }else if(position_id === ''){
                    alert('Please fill out the position of the staff being created');
                }else if(user_name === ''){
                    alert('Please fill out the user name for the staff');
                }else if(secret_pin === ''){
                    alert('Please fill out the secret pin ');
                }else if(security_question === ''){
                    alert('Please Select a security question');
                }else if(security_answer === ''){
                    alert('Please fill out an answer for the select question');
                }else if(registration_number === ''){
                    alert('Please fill out the registration number');
                }else {

                    let data = {
                        'first_name' : first_name,
                        'last_name' : last_name,
                        'phone_number' : phone_number,
                        'email': email,
                        'position_id' : position_id,
                        'user_name' : user_name,
                        'secret_pin' : secret_pin,
                        'security_question' : security_question,
                        'security_answer' : security_answer,
                        'registration_number': registration_number,
                    };
                    console.log(JSON.stringify(data));
                    $.ajax({
                        type: "post",
                        url: '/quick_add_user',
                        data: data,
                        cache: false,

                        success: function (result) {
                            console.log(JSON.stringify(result));
                            $('#other_scrub_staff').append($('<option>', {
                                value: result,
                                text: (first_name + ' ' +last_name)
                            }));
                            $('#other_scrub_staff').val(first_name + ' ' +last_name);//preselect the newly added location
                            $('#other_scrub_staff_temporary').val(first_name + ' ' +last_name);
                            $('#modal_other_scrub_staff').modal('hide'); //manually hide the modal
                        },
                        error: handleAjaxError
                    });
                }
            });

            $('#submitScrubNurse').click(function () {

                var first_name = $('#sn_first_name').val();
                var last_name = $('#sn_last_name').val();
                var phone_number = $('#sn_phone_number').val();
                var email = $('#sn_email').val();
                var position_id = $('#sn_position_id').val();
                var user_name = $('#sn_user_name').val();
                var secret_pin = $('#sn_secret_pin').val();
                var security_question = $('#sn_security_question').val();
                var security_answer = $('#sn_security_answer').val();
                var registration_number = $('#sn_registration_number').val();

                if (first_name === '') {
                    alert("Please fill out the first name");
                }else if(last_name === ''){
                    alert("Please fill out the last name");
                }else if(phone_number === ''){
                    alert("Please fill out the phone number");
                }else if(email === ''){
                    alert('Please fill out the email')
                }else if(position_id === ''){
                    alert('Please fill out the position of the staff being created');
                }else if(user_name === ''){
                    alert('Please fill out the user name for the staff');
                }else if(secret_pin === ''){
                    alert('Please fill out the secret pin ');
                }else if(security_question === ''){
                    alert('Please Select a security question');
                }else if(security_answer === ''){
                    alert('Please fill out an answer for the select question');
                }else if(registration_number === ''){
                    alert('Please fill out the registration number');
                }else {

                    let data = {
                        'first_name' : first_name,
                        'last_name' : last_name,
                        'phone_number' : phone_number,
                        'email': email,
                        'position_id' : position_id,
                        'user_name' : user_name,
                        'secret_pin' : secret_pin,
                        'security_question' : security_question,
                        'security_answer' : security_answer,
                        'registration_number': registration_number,
                    };

                    $.ajax({
                        type: "post",
                        url: '/quick_add_user',
                        data: data,
                        cache: false,

                        success: function (result) {
                            console.log(JSON.stringify(result));
                            $('#scrub_nurse').append($('<option>', {
                                value: result,
                                text: (first_name + ' ' +last_name)
                            }));
                            $('#scrub_nurse').val(name);
                            $('#scrub_nurse_temporary').val(name);
                            $('#modal_new_nurse').modal('hide');
                        },
                        error: handleAjaxError
                    });

                    var name = $('#scrub_nurse_name').val();
                    if (name === '') {
                        alert("Please fill out the name");
                    } else {

                        $('#theatre_incharge').append($('<option>', {
                            value: first_name + ' ' +last_name,
                            text: first_name + ' ' +last_name
                        }));

                        $('#theatre_incharge').val(first_name + ' ' +last_name);//preselect the newly added location
                        $('#theatre_incharge_temporary').val(first_name + ' ' +last_name);
                        $('#modal_new_scrub_staff').modal('hide'); //manually hide the modal
                    }

                }

            });

            $("#submitSurgeon").click(function () {

                var first_name = $('#sg_first_name').val();
                var last_name = $('#sg_last_name').val();
                var phone_number = $('#sg_phone_number').val();
                var email = $('#sg_email').val();
                var position_id = $('#sg_position_id').val();
                var user_name = $('#sg_user_name').val();
                var secret_pin = $('#sg_secret_pin').val();
                var security_question = $('#sg_security_question').val();
                var security_answer = $('#sg_security_answer').val();
                var registration_number = $('#sg_registration_number').val();

                if (first_name === '') {
                    alert("Please fill out the first name");
                }else if(last_name === ''){
                    alert("Please fill out the last name");
                }else if(phone_number === ''){
                    alert("Please fill out the phone number");
                }else if(email === ''){
                    alert('Please fill out the email')
                }else if(position_id === ''){
                    alert('Please fill out the position of the staff being created');
                }else if(user_name === ''){
                    alert('Please fill out the user name for the staff');
                }else if(secret_pin === ''){
                    alert('Please fill out the secret pin ');
                }else if(security_question === ''){
                    alert('Please Select a security question');
                }else if(security_answer === ''){
                    alert('Please fill out an answer for the select question');
                }else if(registration_number === ''){
                    alert('Please fill out the registration number');
                }else {

                    let data = {
                        'first_name' : first_name,
                        'last_name' : last_name,
                        'phone_number' : phone_number,
                        'email': email,
                        'position_id' : position_id,
                        'user_name' : user_name,
                        'secret_pin' : secret_pin,
                        'security_question' : security_question,
                        'security_answer' : security_answer,
                        'registration_number': registration_number,
                    };
                    $.ajax({
                        type: "post",
                        url: '/quick_add_user',
                        data: data,
                        cache: false,

                        success: function (result) {
                            $('#surgeon').append($('<option>', {
                                value: result,
                                text: first_name +' '+last_name
                            }));
                            $('#surgeon').val(name);//preselect the newly added location
                            $('#surgeon_temporary').val(name);
                            $('#modal_new_surgeon').modal('hide'); //manually hide the modal
                        },
                        error: handleAjaxError
                    });
                }

            });

            $('#submitAssistantSurgeon').click(function () {

                var first_name = $('#asg_first_name').val();
                var last_name = $('#asg_last_name').val();
                var phone_number = $('#asg_phone_number').val();
                var email = $('#asg_email').val();
                var position_id = $('#asg_position_id').val();
                var user_name = $('#asg_user_name').val();
                var secret_pin = $('#asg_secret_pin').val();
                var security_question = $('#asg_security_question').val();
                var security_answer = $('#asg_security_answer').val();
                var registration_number = $('#asg_registration_number').val();

                if (first_name === '') {
                    alert("Please fill out the first name");
                }else if(last_name === ''){
                    alert("Please fill out the last name");
                }else if(phone_number === ''){
                    alert("Please fill out the phone number");
                }else if(email === ''){
                    alert('Please fill out the email')
                }else if(position_id === ''){
                    alert('Please fill out the position of the staff being created');
                }else if(user_name === ''){
                    alert('Please fill out the user name for the staff');
                }else if(secret_pin === ''){
                    alert('Please fill out the secret pin ');
                }else if(security_question === ''){
                    alert('Please Select a security question');
                }else if(security_answer === ''){
                    alert('Please fill out an answer for the select question');
                }else if(registration_number === ''){
                    alert('Please fill out the registration number');
                }else {

                    let data = {
                        'first_name' : first_name,
                        'last_name' : last_name,
                        'phone_number' : phone_number,
                        'email': email,
                        'position_id' : position_id,
                        'user_name' : user_name,
                        'secret_pin' : secret_pin,
                        'security_question' : security_question,
                        'security_answer' : security_answer,
                        'registration_number': registration_number,
                    };
                    console.log(JSON.stringify(data));
                    $.ajax({
                        type: "post",
                        url: '/quick_add_user',
                        data: data,
                        cache: false,

                        success: function (result) {
                            console.log(JSON.stringify(result));
                            $('#assistant_surgeon').append($('<option>', {
                                value: result,
                                text: (first_name +' '+last_name)
                            }));
                            $('#assistant_surgeon').val(name);//preselect the newly added location
                            $('#assistant_surgeon_temporary_temporary').val(name);
                            $('#modal_new_assistant_surgeon').modal('hide'); //manually hide the modal
                        },
                        error: handleAjaxError
                    });
                }
            });

            var sundriesArray = {!! json_encode($sundries_array) !!};
            
            var options = '';//initialize the options tag
            options += '<option value>--Select --</option>';
            for (var sundry in sundriesArray) {
                if (sundriesArray.hasOwnProperty(sundry)) {
                    options += '<option value=' + sundry + '>' + sundriesArray[sundry] + '</option>';
                }
            }

            //adding a new procedure
            $("#submitNewProcedure").click(function () {
                console.log('procedure save initialized');

                var name = $('#new_procedure_name').val();
                var non_insured_price = $('#new_procedure_non_insured_price').val();
                var insured_price = $('#new_procedure_insured_price').val();
                var yes = $('#new_procedure_insured_yes').val();
                var no = $('#new_procedure_insured_no').val();
                var insurance = 0;
                if ($('#new_procedure_insured_yes').is(':checked')) {
                    insurance = 1;
                }
                var category = $('#new_procedure_category').val();
                var hmis_number = $('#new_procedure_hmis_number').val();
                var account_id = $('#new_procedure_account_id').val();
                var hmis_no_outpatient = $('#new_procedure_hmis_no_outpatient').val();
                var hmis_category = $('#new_procedure_hmis_category').val();
                var hmis_no_inpatient = $('#new_procedure_hmis_no_inpatient').val();
                var hmis_category_inpatient = $('#new_procedure_hmis_category_inpatient').val();

                if (name === '') {
                    alert("Please fill out the name");
                }else if(non_insured_price === ''){
                    alert("Please fill out the price");
                }else if(category === ''){
                    alert('Please fill out the category')
                }else {

                    let data = {
                        'name' : name,
                        'non_insured_price' : non_insured_price,
                        'insured_price' : insured_price,
                        'insurance': insurance,
                        'category' : category,
                        'hmis_number' : hmis_number,
                        'account_id' : account_id,
                        'hmis_no_outpatient' : hmis_no_outpatient,
                        'hmis_category' : hmis_category,
                        'hmis_no_inpatient' : hmis_no_inpatient,
                        'hmis_category_inpatient': hmis_category_inpatient,
                    };
                    $.ajax({
                        type: "post",
                        url: '/quick_add_procedure',
                        data: data,
                        cache: false,

                        success: function (result) {
                            $('#procedure_id').append($('<option>', {
                                value: result,
                                text: name
                            }));
                            $('#procedure_id').val(name);//preselect the newly added location
                            $('#modal_new_procedure').modal('hide'); //manually hide the modal
                        }
                    });
                }
            });

            $("#addOption").click(function(e) {
                e.preventDefault();
                $("#sundries_used_div").append("<br>");
                $("#sundries_used_div").append("<div class='col-sm-8'><label for='sundries_used'>Other Sundries used</label><select class='form-control sundries_sutures select_field' onclick='select2set()' name='sundries_used[]'>"+options+"</select></div><div class='col-sm-4'><label for='quantity_used'>Quantity used</label><input class='form-control' name='sundries_quantity_used[]' type='number'></div>");
                generalSelect2Set();
            });

            $("#addOptionExtras").click(function(e) {
                e.preventDefault();
                $("#extras_used_div").append("<br>");
                $("#extras_used_div").append("<div class='col-sm-8'><label for='extras_used'>Other Extras Used</label><input type='text' class='form-control' name='extras_used[]'></div><div class='col-sm-4'><label for='extras_cost'>Cost</label><input class='form-control' name='extras_cost[]' type='number'></div>");
            });

            //make the following dropdwowns searchable
            $("#procedure_id,#authorised_swab_check,#surgeon,#scrub_nurse,#assistant_surgeon,#other_scrub_staff,#theatre_incharge,#vicryl_sutures_used").select2({
                placeholder: "-- select --"
            });

            let drugsArray = {!! json_encode($drugs) !!};

            let drugsoptions = '';//initialize the options tag
            drugsoptions += '<option value>--Select --</option>';
            for (let drug in drugsArray) {
                if (drugsArray.hasOwnProperty(drug)) {
                    drugsoptions += '<option value=' + drug + '>' + drugsArray[drug] + '</option>';
                }
            }

            let unitsArray = {!! json_encode($units) !!};

            let unitsoptions = '';//initialize the options tag
            unitsoptions += '<option value>--Select --</option>';
            for (let unit in unitsArray) {
                if (unitsArray.hasOwnProperty(unit)) {
                    unitsoptions += '<option value=' + unit + '>' + unitsArray[unit] + '</option>';
                }
            }

            /* do this much better dynamic addition :) */
            var max_fields1 = 24; //maximum divs allowed
            var x1 = 1; //initial div count
            $("#add-drug-row").on("click", function (e) {
                e.preventDefault();
                if (x1 < max_fields1) {
                    x1++;
                    let html_text = "<br><div class='row input_fields_wrap1'><div class='col-md-6'><label><?php echo __('anaesthetics.other_drugs_given'); ?></label>";
                    html_text += "<select class='form-control select select_field other_drug_id' name='drugs[]' id='other_drug_id_"+x1+"'>"+drugsoptions+"</select></div>";
                    html_text += "<div class='col-md-3'><label><?php echo __('anaesthetics.dose'); ?></label><input type='number' name='dose[]' class='form-control'/></div>";
                    html_text += "<div class='col-md-3'><label><?php echo __('anaesthetics.units'); ?></label><select class='form-control select' name='units[]' id='other_drug_unit_"+x1+"'>"+unitsoptions+"</select>";
                    html_text += "<a href='#' class='remove_field1' style='color: maroon'><sup>X</sup></a></div></div>";
                    $("#drugs_div").append(html_text);
                    generalSelect2Set();
                }
            });

            $("#wrapper").on("click", ".remove_field1", function (e) {
                e.preventDefault();
                $(this).parent('div').remove();
                x1--;
            });

            $("#procedure_id").change(function(e){
                var procedure_id = $("#procedure_id").val();
                var patient_id = <?php echo $patient_id; ?>

                $.ajax({
                    url: '/get_procedure_hospital_fees/' + procedure_id + '/' + patient_id,
                    success: function(response){
                        //$("#procedure_amount_info").show();
                        $("#procedure_amount").text(response);
                    }
                });
            });

            $('#primary_diagnosis').on('change', function () {
                var data = 'diagnosis_id=' + $(this).val();
                $.ajax({
                    type: "get",
                    url: "/diagnoses/get_diagnosis",
                    data: data,
                    cache: false,
                    success: function (result) {
                        var prompt_and_references = result.split('&&');
                        $('#primary_diagnosis_prompt').html(prompt_and_references[0]);
                        $('#primary_diagnosis_reference').html(prompt_and_references[1]);
                    }
                });
            });

            $('#wrapper').on( 'change', '[id^=other_diagnosis_id_]', function () {
                var data = 'diagnosis_id=' + $(this).val();
                var other_diagnosis_id = $(this).attr('id');
                var nth = other_diagnosis_id.substring(19); //remove "other_diagnosis_id_" from strg to remain with the no e.g 1003
                var prompt_id = parseInt(nth) - 1000;
                var reference_id = prompt_id + 100;
                $.ajax({
                    type: "get",
                    url: "/diagnoses/get_diagnosis",
                    data: data,
                    cache: false,
                    success: function (result) {
                        var prompt_and_references = result.split('&&');
                        if (nth < 1000) {
                            $('#secondary_diagnosis_prompt1').html(prompt_and_references[0]);
                            $('#secondary_diagnosis_reference1').html(prompt_and_references[1]);
                        }
                        else{
                            // this is for prompts and references added dynamically using the addrow button
                            $('#secondary_diagnosis_prompt'+prompt_id).html(prompt_and_references[0]);
                            $('#secondary_diagnosis_reference'+reference_id).html(prompt_and_references[1]);
                        }
                    }
                });
            }); 

            $("#wrapper").on("change", ".other_drug_id", function (e) {
                var row_id = /\d+(?=\D*$)/.exec($(this).attr('id'));
                let selectedOtherDrug = $(this).val();
                let item = $(this).val();
                let patient_id = <?php echo $patient_id; ?>;
                let patient_insurance_status = 0;

                $.ajax({
                    url: '/prescriptions/get_drug_details/',
                    data: {'drug_id':item, 'patient_id':patient_id, 'patient_insurance_status': patient_insurance_status},
                    beforeSend: function() {
                        $(".loader").show();
                    },
                    success: function(response){
                        $(".loader").hide();
                        let arr = JSON.parse(response);
                        console.log(arr);
                        // $('#can_drug_be_prescribed_' + id).val(arr["can_drug_be_prescribed"]);

                        // if (arr["patient_is_allergic"] == 1) {
                        //     $("#patient_allergic_div_" + id).show();
                        // } else {
                        //     $("#patient_allergic_div_" + id).hide();
                        // }

                        // if (arr["drug_is_expired"] == 1) {
                        //     $("#drug_expired_div_" + id).show();
                        // } else {
                        //     $("#drug_expired_div_" + id).hide();
                        // }

                        // if (arr["drug_out_of_stock"] == 1) {
                        //     $("#drug_out_of_stock_div_" + id).show();
                        // } else {
                        //     $("#drug_out_of_stock_div_" + id).hide();
                        // }

                        // if (arr["drug_references"] != 0) {
                        //     $("#references_span_" + id).show();
                        //     $("#references_span_" + id).html(arr["drug_references"]);
                        // } else {
                        //     $("#references_span_" + id).hide();
                        // }

                        // if (arr["pharmacy_comment"] != 0) {
                        //     $("#pharmacy_comment_div_" + id).show();
                        //     $("#pharmacy_comment_text_" + id).text(arr["pharmacy_comment"]);
                        // } else {
                        //     $("#pharmacy_comment_div_" + id).hide();
                        // }

                        // if (arr["covered_by_pat_cat"] != "") {
                        //     $("#drug_pat_cat_coverage_div_" + id).show();
                        //     $("#drug_pat_cat_coverage_text_" + id).text(arr["covered_by_pat_cat"]);
                        // } else {
                        //     $("#drug_pat_cat_coverage_div_" + id).hide();
                        // }

                        // if (arr["covered_by_chi"] != "") {
                        //     $("#drug_chi_coverage_div_" + id).show();
                        //     $("#drug_chi_coverage_div_" + id).html(arr["covered_by_chi"]);
                        // } else {
                        //     $("#drug_chi_coverage_div_" + id).hide();
                        // }

                        // if (arr["prompt"] != 0) {
                        //     $("#prompts_div_" + id).html(arr["prompt"]);
                        // }

                        // if (arr["can_drug_be_prescribed"] == 0) {
                        //     // stop here with the filling in of values
                        //     $(this).val('');
                        // }

                        // $('#drug_unit' + id).text(arr["drug_unit"]);
                        // $('#drug_form' + id).val(arr["drug_form"]);
                        
                        // $(".other_drug_unit_1 option:contains(" + arr["drug_unit"] + ")").attr('selected', 'selected');

                        $("#other_drug_unit_"+row_id+" option").filter(function() {
                            return $(this).text() === arr["drug_unit"];
                        }).attr('selected', 'selected');
                    }
                });
            });
        });

        function addRow(tableID) {

            var table = document.getElementById(tableID);
            var rowCount = table.rows.length;
            var row = table.insertRow(rowCount);
            var colCount = table.rows[0].cells.length;

            for (var i = 0; i < colCount; i++) {

                var newcell = row.insertCell(i);

                newcell.innerHTML = table.rows[1].cells[i].innerHTML;

                /* set new id for the symptom select tag which is found in the first cell of every row
                 * this makes the symptom select tag id dynamic and different for each table row
                 * the id should be the rowCount +1000 to avoid a similar id with prompt div tag id set below
                 */
                if (i == 1) {
                    newcell.childNodes[1].id = 'other_diagnosis_id_'+(rowCount + 1000);
                }
                /*
                 *  set  new value for the prompt div tag
                 */
                if (i == 2) {
                    table.rows[rowCount].cells[2].innerHTML = '';
                    table.rows[rowCount].cells[2].innerHTML = '<div class="well well-sm" id="secondary_diagnosis_prompt' + rowCount + '">&nbsp;</div>';

                }

                if (i == 3) {

                    // var myid = (rowCount + 100);
                    table.rows[rowCount].cells[3].innerHTML = '';
                    table.rows[rowCount].cells[3].innerHTML = '<div class="well well-sm" id="secondary_diagnosis_reference' + (rowCount + 100) + '">&nbsp;</div>';

                    //     alert(myid);
                }

                switch (newcell.childNodes[0].type) {
                    case "text":
    //                newcell.childNodes[0].value = "";
                        break;
                    case "checkbox":
                        newcell.childNodes[0].checked = false;
                        break;
                    case "select":
                        newcell.childNodes[0].selectedIndex = 0;
                        break;
                }
            }
        }

        function deleteRow(tableID) {
            try {
                var table = document.getElementById(tableID);
                var rowCount = table.rows.length;

                for (var i = 0; i < rowCount; i++) {
                    var row = table.rows[i];
                    var chkbox = row.cells[0].childNodes[0];
                    if (null != chkbox && true == chkbox.checked) {
                        if (rowCount <= 2) {
                            alert("<?php echo __('inpatient.delete_rows_warning');?>.");
                            break;
                        }
                        table.deleteRow(i);
                        rowCount--;
                        i--;
                    }
                }
            } catch (e) {
                alert(e);
            }
        }

        function generalSelect2Set() {
            $('.select_field').select2({
                width: "100%"
            });
        }
    </script>
@endpush