@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/datatables/jquery.dataTables.min.css') }}" rel="stylesheet"
        type="text/css" />
    <link href="{{ asset('elite/tables/css/buttons.dataTables.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-3 col-md-4 col-sm-4 col-xs-12">
            <h4 class="page-title">{{ __('dentals.dental_usage') }}</h4>
        </div>
        <div class="col-lg-9 col-sm-8 col-md-8 col-xs-12">
            <ol class="breadcrumb">
                <li><a href="{{ route('home') }}"><i class="fa fa-home"></i> {{ __('dentals.home') }}</a></li>
                <li class="active"><i class="fa fa-bank"></i> {{ __('dentals.dental_usage') }}</li>
            </ol>
        </div>
    </div>

    @include('investigations::dentals.menu')

    @include('flash::message')

    <div class="row">
        <div class="col-md-8">
            <div class="row">
                <div class="col-md-12">
                    <div class="panel">
                        <div class="panel-heading">{{ __('dentals.previous_dentals_usage') }}</div>
                        <div class="panel-body">
                            <table class="table">
                                <thead>
                                    <tr>
                                        <th>#</th>
                                        <th>{{ __('dentals.name') }}</th>
                                        <th>{{ __('labs.quantity') }}</th>
                                        <th>{{ __('labs.cost') }}</th>
                                        <th>{{ __('labs.date') }}</th>
                                        <th>{{ __('labs.recorded_by') }}</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @if (!empty($dental_usages))
                                        @php $counter = 1; @endphp
                                        @foreach ($dental_usages as $result)
                                            <tr>
                                                <td>
                                                    {{ $counter }}.
                                                </td>
                                                <td>
                                                    {{ get_name($result->dental_id, 'id', 'name', 'dentals') }}
                                                </td>
                                                <td>
                                                    {{ $result->usage_quantity }}
                                                </td>
                                                <td>
                                                    {{ ugandan_shillings($result->usage_quantity_cost) }}
                                                </td>
                                                <td>
                                                    {{ streamline_date($result->created_at) }}
                                                </td>
                                                <td>
                                                    {{ get_full_name($result->created_by, 'id', 'first_name', 'last_name', 'users') }}
                                                </td>
                                            </tr>
                                            @php $counter++; @endphp
                                        @endforeach
                                    @else
                                        <td colspan="6"><span style="color: red;">Please search for records</span></td>
                                    @endif
                                </tbody>

                                <tfoot>
                                    <tr>
                                        <th>#</th>
                                        <th>{{ __('dentals.name') }}</th>
                                        <th>{{ __('labs.quantity') }}</th>
                                        <th>{{ __('labs.cost') }}</th>
                                        <th>{{ __('labs.date') }}</th>
                                        <th>{{ __('labs.recorded_by') }}</th>
                                    </tr>
                                </tfoot>
                            </table>
                        </div>
                    </div>
                </div>
                <div class="col-md-12">
                    @include('flash::message')
                    <div class="panel">
                        <div class="panel-body">
                            {{ Form::open(['route' => 'dentals.store_dental_usage', 'data-toggle' => 'validator', 'method' => 'POST']) }}
                            <div class="row">
                                <div class="col-md-12">
                                    <div class="pull-left">
                                        <a href="javascript:void(0)" class="text-center db">
                                            @php $hospital_information = \Streamline\Models\HospitalInformation::first(); @endphp
                                            <img src="{{ asset($hospital_information->logo) }}"
                                                style="max-height: 160px; margin: auto; max-width: 260px;"
                                                alt="Home" /><br />
                                        </a>
                                        <address>
                                            <h3> &nbsp;<b class="text-danger">{{ $hospital_information->name }}</b></h3>
                                            <p class="text-muted m-l-5">{{ $hospital_information->phone_number }},
                                                {{ $hospital_information->email }},
                                                <br />
                                                {{ get_name($hospital_information->sub_county, 'id', 'name', 'subcounties') }},
                                                {{ get_name($hospital_information->district, 'id', 'name', 'districts') }},
                                                <br /> {{ $hospital_information->country }}.
                                            </p>
                                        </address>
                                    </div>
                                    <div class="pull-right text-right">
                                        <address>
                                            <p class="m-t-30"><b>{{ __('labs.date') }} : </b> <i
                                                    class="fa fa-calendar"></i>
                                                {{ streamline_date_time(\Carbon\Carbon::now()->toDateTimeString()) }}</p>
                                        </address>

                                        <div class="form-group">
                                            {{ Form::label('dates', __('labs.enter_dates')) }}
                                            <select class="form-control compulsory" name="dates" id="dates" required>
                                                <option value="">-{{ __('labs.select') }}-</option>
                                                <option value="today">{{ __('labs.today') }}</option>
                                                <option value="custom_date_range">{{ __('labs.date_range') }}</option>
                                            </select>
                                        </div>

                                        <div id="sDate" style="display: none;">
                                            <div class="form-group">
                                                {{ Form::label('start_date', __('labs.date_on')) }}
                                                <div class="input-group">
                                                    {{ Form::text('start_date', '', ['class' => 'form-control required compulsory', 'readonly', 'id' => 'start_date']) }}
                                                    <span class="input-group-addon"><i class="icon-calender"></i></span>
                                                </div>
                                            </div>
                                        </div>
                                        <div id="eDate" style="display: none;">
                                            <div class="form-group">
                                                {{ Form::label('end_date', __('labs.end_date')) }}
                                                <div class="input-group">
                                                    {{ Form::text('end_date', '', ['class' => 'form-control required compulsory', 'readonly', 'id' => 'end_date']) }}
                                                    <span class="input-group-addon"><i class="icon-calender"></i></span>
                                                </div>
                                            </div>
                                        </div>

                                    </div>
                                </div>
                            </div>
                            <br />

                            <div class="row">
                                <div class="col-12">
                                    <h3><b>{{ __('dentals.dental_usage') }}</b></h3>
                                </div>
                            </div>
                            <br />

                            @php
                                $options = "<option value=''>--" . __('labs.select') . '--</option>';
                                foreach ($dentals as $item) {
                                    $options .= "<option value='$item->id'>$item->name</option>";
                                }
                            @endphp


                            <div class="input_fields_wrap">
                                <div class="row">
                                    <div class="span1"></div>
                                    <div class="col-3">
                                        <div class=" control-group">
                                            <label class="control-label" for="item">{{ __('dentals.name') }} :</label>
                                            <div class="form-group">
                                                <select name='labItem[]' id='lab-item_0'
                                                    class="form-control calculate select">
                                                    <option>- {{ __('labs.select') }} -</option>
                                                    @foreach ($dentals as $item)
                                                        <option style='color: orange;' value='{{ $item->id }}'>
                                                            {{ $item->name }}</option>
                                                    @endforeach
                                                </select>
                                            </div>
                                        </div>
                                    </div><!-- Item -->

                                    @php
                                        $options = "<option value=''>- " . __('labs.select') . ' -</option>';
                                        foreach ($dentals as $item) {
                                            $options .= "<option value='$item->id'>$item->name</option>";
                                        }
                                    @endphp

                                    <div class='col-2'>
                                        <div class="form-group">
                                            <label class='control-label'
                                                class=''>{{ __('labs.available_quantity') }}</label>
                                            <div class=''>
                                                <input type='text' name='availableQty[]' id ='available-qty_0'
                                                    class='form-control compulsory' readonly>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="col-2">
                                        <div class="form-group">
                                            <label class="control-label">{{ __('labs.quantity_required') }}</label>
                                            <input type='text' name='requiredQty[]' id ='required-qty_0'
                                                class='form-control compulsory'>
                                        </div>
                                    </div>

                                    <div class='col-2'>
                                        <div class="form-group">
                                            <label class='control-label' class=''>{{ __('labs.unit_cost') }}</label>
                                            <input type='text' name='unitCost[]' id ='cost_0' class='form-control'
                                                readonly>
                                        </div>
                                    </div>

                                    <div class='col-2'>
                                        <div class="form-group">
                                            <label class='control-label'
                                                class=''>{{ __('labs.total_cost') }}</label>
                                            <input type='text' name='totalCost[]' id ='total-cost_0'
                                                class='form-control' readonly>
                                        </div>
                                    </div>


                                    {{-- <div class="col-1">
                                        <div class="form-group text-right" style="margin-top: 30px; margin-left: 3px;">
                                            <a class="label label-success add_item" style="color: white"><i class="fa fa-plus"></i> {{ __('labs.add_item') }}</a>
                                        </div>
                                    </div> --}}
                                </div>
                            </div>

                            <div class="row">
                                <div class='col-3'>
                                    <button type="submit" id="add_item" style="display: none"
                                        class ="btn btn-info btn-rounded float-right add_item"><i class="fa fa-plus"></i>
                                        {{ __('labs.add_item') }}</button>
                                </div>
                                <div class='col-6'></div>
                                <div class='col-3'>
                                    <button type="submit" id="submit_usage" style="display: none"
                                        class ="btn btn-success btn-rounded float-right">{{ __('labs.submit_usage') }}</button>
                                </div>
                            </div>
                            {{ Form::close() }}
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="panel">
                <div class="panel-heading">{{ __('dentals.dental_stock') }}</div>
                <div class="panel-body">
                    <table class="table">
                        <thead>
                            <tr>
                                <th>{{ __('dentals.name') }}</th>
                                <th>{{ __('labs.store_stock') }}</th>
                                <th>{{ __('dentals.dental_stock') }}</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach ($dentals as $item)
                                <tr>
                                    <td>{{ $item->name }}</td>
                                    <td>{{ $item->store_stock }}</td>
                                    <td>{{ $item->pharmacy_stock }}</td>
                                </tr>
                            @endforeach
                        </tbody>
                        <tfoot>
                            <tr>
                                <th>{{ __('dentals.name') }}</th>
                                <th>{{ __('labs.store_stock') }}</th>
                                <th>{{ __('dentals.dental_stock') }}</th>
                            </tr>
                        </tfoot>
                    </table>
                </div>
            </div>
        </div>
    </div>
@endsection

@push('scripts')
    <script src="{{ asset('elite/bower_components/datatables/jquery.dataTables.min.js') }}"></script>
    <script src="{{ asset('elite/bower_components/select2/select2.min.js') }}"></script>
    <script type="text/javascript"
        src="{{ asset('elite/bower_components/bootstrap-datepicker/bootstrap-datepicker.min.js') }}"></script>

    <script>
        $('#start_date').datepicker({
            autoclose: true,
            todayHighlight: true,
            format: 'dd-mm-yyyy'
        });

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

        $(document).ready(function() {

            $(".input_fields_wrap").on('change', "select,input", function() {
                //            var i = parseInt(this.id.replace("item_", ""), 10);
                var i = parseInt(this.id.substr(this.id.indexOf("_") + 1));

                var lab_item_select = $("#lab-item_" + i);
                var lab_item = $("#lab-item_" + i).val();
                var available_qty = $("#available-qty_" + i);
                var cost = $('#cost_' + i);
                var total_cost = $('#total-cost_' + i);

                if (lab_item === "") {
                    alert("<?php echo __('labs.select_lab_item'); ?>");
                    return false;
                }

                $.ajax({
                    method: 'POST',
                    url: '{{ route('dentals.get_dental_quantity') }}',
                    data: {
                        'id': lab_item,
                        _token: '{{ csrf_token() }}',
                    },

                    success: function(response) {

                        available_qty.val(response['pharmacy_stock']);
                        cost.val(response['non_insured_price']);

                        var required_qty = $('#required-qty_' + i);
                        if (response['pharmacy_stock'] >= required_qty.val()) {
                            $("[id^='cost_']").each(function() {
                                total = Number($(this).val()) * required_qty.val();
                            });
                            total_cost.val(total);
                            if (total > 0) {
                                $('#submit_usage').show();
                                $('#add_item').show();
                            }

                        } else {
                            alert('<?php echo __('labs.amount_not_available'); ?>');
                            required_qty.val(0);
                            $('#submit_usage').hide();
                            $('#add_item').hide();
                        }

                    },
                    error: function(error) {
                        console.log(error);
                    }
                });
                .9
            });
        })

        var max_fields = 20; //maximum input boxes allowed
        var wrapper = $(".input_fields_wrap"); //Fields wrapper
        var add_button = $(".add_item"); //Add button ID

        var x = 1; //initlal text box count

        $(add_button).click(function(e) { //on add input button click
            e.preventDefault();
            if (x < max_fields) { //max input box allowed
                x++; //text box increment

                $(wrapper).append("\
                    <div class='row'>\n\
                        <div class='span1'></div>\n\
                        <div class='col-3'>\n\
                            <div class='form-group'>" +
                    "<div class='controls'>\n\
                            <select name='labItem[]' id='lab-item_" + x + "' class='form-control compulsory'>" +

                    "<?php echo $options; ?>" +

                    "</select>\n\
                </div>\n\
            </div>\n\
        </div>\n\
        <div class='col-2'>\n\
            <div>\n\
                <div class='form-group'>" +
                    "<input type='number' name='availableQty[]' id ='available-qty_" + x + "' class='form-control compulsory' readonly>\n\
                                </div>\n\
                            </div>\n\
                        </div>\n\
                        <div class='col-2'>\n\
                            <div class='form-group'>" +
                    "<div class='controls'>\n\
                             <input type='number' name='requiredQty[]' id='required-qty_" + x +
                    "' class='form-control compulsory'>" +
                    "\n\
                    </div>\n\
                </div>\n\
            </div>\n\
            <div class='col-2'>\n\
                <div>\n\
                    <div class='form-group'>\n\
                        <input type='text' name='unitCost[]' id='cost_" + x + "' class='form-control' readonly>\n\
                        </div>\n\
                            </div>\n\
                        </div>\n\
                        \<div class='col-2'>\n\
                <div>\n\
                    <div class='form-group'>\n\
                        <input type='text' name='totalCost[]' id='total-cost_" + x + "' class='form-control' readonly>\n\
                        </div>\n\
                            </div>\n\
                        </div>\n\
                        \ <div class='col-1'>\n\
                <div class=''>\n\
                    <div class='form-group text-right'>\n\
                        &nbsp;<a href='#' class='remove_field btn btn-sm btn-rounded btn-danger' style='margin-top:-15px;' title='Delete item'><i class='fa fa-trash'></i></a>\n\
                        </div>\n\
                            </div>\n\
                        </div>\n\
                    </div>\n\
                </div>\n\
            </div>\n\
            ");
                $('#lab-item_' + x).select2(); //add input box
            }
        });

        $(wrapper).on("click", ".remove_field", function(e) { //user click on remove text
            e.preventDefault();
            $(this).parent('div').parent('div').parent('div').parent('div').remove();

            var final_total = 0;
            var total_field = $("#total_amount");

            $("[id^='amount_']").each(function() {
                final_total += Number($(this).val());
            });
            total_field.val(final_total);
            x--;
        });

        $('.select').select2({
            placeholder: "-- <?php echo __('labs.select'); ?> --"
        });
        $('.table').DataTable({
            "pageLength": 10,
            order: [],
        });

        $('#dates').change(function(e) {
            if ($(this).val() === "custom_date_range") {
                $("#sDate").show();
                $("#eDate").show();
            } else {
                $("#eDate").hide();
                $("#sDate").hide();
            }
        });
    </script>
@endpush