@extends('layouts.main')

@push('styles')
<link href="{{ asset('elite/bower_components/typeahead.js-master/dist/typehead-min.css') }}" rel="stylesheet">
<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" />
@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">{{ __('patients.view') }}</h4>
    </div>
    <div class="col-lg-9 col-sm-8 col-md-8 col-xs-12">
        <ol class="breadcrumb">
            <li><a href="{{ route('home') }}">{{ __('patients.dashboard') }}</a></li>
            <li><a href="{{ route('patients.index') }}">{{ __('patients.patients') }}</a></li>
            <li class="active">{{ __('patients.view') }}</li>
        </ol>
    </div>
</div>

<div class="white-box">
    @include('flash::message')
    {{ Form::open(['route' => 'patients.search', 'method' => 'ANY', 'role' => 'search']) }}

    <div class="row">
        <div class="col-md-2">
            <div class="form-group" id="patient_numbers">
                {{ Form::text('number', '', ['class' => 'form-control typeahead', 'placeholder' => 'Patient number', 'autocomplete' => 'off', 'spellcheck' => false]) }}
            </div>
        </div>

        <div class="col-md-2" @if(!is_eye_module_enabled()) style='display: none' @endif>
            <div class="form-group" id="previous_numbers">
                {{ Form::text('previous_id', '', ['class' => 'form-control typeahead', 'placeholder' => 'Previous Number', 'autocomplete' => 'off', 'spellcheck' => false]) }}
            </div>
        </div>

        <div class="col-md-4">
            <div class="form-group" id="full_names">
                {{ Form::text('full_name', '', ['class' => 'form-control typeahead', 'placeholder' => 'Patient Name', 'autocomplete' => 'off', 'spellcheck' => false]) }}
            </div>
        </div>

        <div class="col-md-2">
            <div class="form-group" id="villages">
                {{ Form::text('village', '', ['class' => 'form-control typeahead', 'placeholder' => 'Village', 'autocomplete' => 'off', 'spellcheck' => false]) }}
            </div>
        </div>

        <div class="col-md-2">
            <button type="submit" class="btn btn-rounded btn-success"><span class="glyphicon glyphicon-search"></span> {{ __('patients.search') }}</button>
            <span class="label label-info float-right" style="font-size: 12.5px;"> {{ count($patient_numbers) }} {{ __('patients.patients_registered') }}</span>
        </div>
    </div>

    @if(isset($criteria))
    <p>{{ __('patients.search_criteria') }} : <code>{{ $criteria }}</code></p>
    @endif
    {{ Form::close() }}

    <div class="table-responsive">
        <table class="table success-table table-sm table-striped table-hover" style="color: white;">
            <thead >
                <tr style="background-color: #00c292; color: white;">
                    <th>{{ __('patients.patient_number') }}</th>
                    <th>{{ __('patients.full_names') }}</th>
                    <th>{{ __('patients.gender') }}</th>
                    <th>{{ __('patients.age') }}</th>
                    <th>{{ __('patients.phone') }}</th>
                    <th>{{ __('patients.category') }}</th>
                    <th>{{ __('patients.village') }}</th>
                    <th></th>
                    <th></th>
                    <th></th>
                </tr>
            </thead>
            <tbody>
            @foreach($patients as $patient)
                <tr>
                    <td>{{ $patient->number }}</td>
                    <td>{!! insurance_flag($patient->id) !!}</td>
                    <td>
                        @if($patient->gender == 1)
                            {{ __('patients.male') }}
                        @else
                            {{ __('patients.female') }}
                        @endif
                    </td>
                    <td>{{ get_patients_age($patient->date_of_birth) }}</td>
                    <td>{{ $patient->phone }}</td>
                    <td>{{ $categories[$patient->category_id] ?? "N/A" }}</td>
                    <td>{{ $villages[$patient->village_id] ?? '' }}</td>
                    <td><a href="/patients/{{ $patient->id }}/" class="btn btn-rounded btn-info btn-sm"><i class="fa fa-info-circle"></i> {{ __('patients.details') }}</a></td>
                    <td>
                        <a href="/patients/{{ $patient->id }}/edit/" class="btn btn-warning btn-rounded btn-sm"><i class="fa fa-pencil"></i> {{ __('patients.edit') }}</a>
                    </td>
                    <td>
                        <a href="/patient_episodes/set_patient_id/{{ $patient->id }}" class="btn btn-rounded btn-primary btn-sm"><i class="fa fa-hand-pointer-o"></i> <strong>{{ __('patients.select') }}</strong></a>
                    </td>
                </tr>
            @endforeach
            </tbody>

        </table>
    </div>
    {{ $patients->links() }}
</div>
@endsection

@push('scripts')
<!-- Typehead Plugin JavaScript -->
<script src="{{ asset('elite/bower_components/typeahead.js-master/dist/typeahead.bundle.min.js') }}"></script>

<!-- Data table javascript -->
<script src="{{ asset('elite/bower_components/datatables/jquery.dataTables.min.js') }}"></script>
<script src="{{ asset('elite/tables/js/dataTables.buttons.min.js') }}"></script>
<script src="{{ asset('elite/tables/js/buttons.flash.min.js') }}"></script>
<script src="{{ asset('elite/tables/js/jszip.min.js') }}"></script>
<script src="{{ asset('elite/tables/js/pdfmake.min.js') }}"></script>
<script src="{{ asset('elite/tables/js/vfs_fonts.js') }}"></script>
<script src="{{ asset('elite/tables/js/buttons.html5.min.js') }}"></script>
<script src="{{ asset('elite/tables/js/buttons.print.min.js') }}"></script>
<script src="{{ asset('elite/tables/js/buttons.colVis.min.js') }}"></script>

<script type="text/javascript">

var substringMatcher = function (strs) {
    return function findMatches(q, cb) {
        var matches, substringRegex;

        // an array that will be populated with substring matches
        matches = [];

        // regex used to determine if a string contains the substring `q`
        substrRegex = new RegExp(q, 'i');

        // iterate through the pool of strings and for any string that
        // contains the substring `q`, add it to the `matches` array
        $.each(strs, function (i, str) {
            if (substrRegex.test(str)) {
                matches.push(str);
            }
        });

        cb(matches);
    };
};

$('#patient_numbers .typeahead').typeahead(
        {
            hint: true,
            highlight: true,
            minLength: 1
        },
        {
            name: 'patient_numbers',
            source: substringMatcher(<?php echo json_encode($patient_numbers); ?>)
        }
);

$('#previous_numbers .typeahead').typeahead(
    {
        hint: true,
        highlight: true,
        minLength: 1
    },
    {
        name: 'previous_numbers',
        source: substringMatcher(<?php echo json_encode($previous_ids); ?>)
    }
);

$('#villages .typeahead').typeahead(
        {
            hint: true,
            highlight: true,
            minLength: 1
        },
        {
            name: 'villages',
            source: substringMatcher(<?php echo json_encode(array_values($villages)); ?>)
        }
);

$('#full_names .typeahead').typeahead(
        {
            hint: true,
            highlight: true,
            minLength: 1
        },
        {
            name: 'full_names',
            source: substringMatcher(<?php echo json_encode($full_names); ?>)
        }
);

$('.table').DataTable({
    dom: 'Bfrtip',
    pageLength: 200,
    buttons: [
        'copy',
        {extend: 'csv',
            message: "<php echo __('patients.registered_patients')?>",
            exportOptions: {
                columns: [0, 1, 2, 3, 4, 5, 6]
            },
        },
        {extend: 'excel',
            message: "<php echo __('patients.registered_patients')?>",
            exportOptions: {
                columns: [0, 1, 2, 3, 4, 5, 6]
            },
            sheetName: "<php echo __('patients.registered_patients')?>"
        },
        {extend: 'pdf',
            message: "<php echo __('patients.registered_patients')?>",
            orientation: 'portrait',
            pageSize: 'LETTER',
            exportOptions: {
                columns: [0, 1, 2, 3, 4, 5, 6]
            },
            customize: function (doc) {
                doc.defaultStyle.fontSize = 10;
//                    doc.styles.tableHeader.alignment = 'left';
            }
        },
        {extend: 'print',
            message: "<php echo __('patients.registered_patients')?>",
            exportOptions: {
                columns: [0, 1, 2, 3, 4, 5, 6]
            },
            customize: function (win) {
                $(win.document.body)
                        .css('font-size', '10pt')
                        .css('background', '#fff')
                        .prepend(
                                '<img src="<?php echo asset('uploads/logo/logo-sm.png'); ?>" style="position:absolute; top:0; right:0;" />'
                                );
                $(win.document.body).find('table')
                        .addClass('compact')
                        .css('font-size', 'inherit');
            }
        }
    ]
});

$('.sorting').removeClass('sorting');//remove the sorting class
$('.sorting_asc').removeClass('sorting_asc');//remove the sorting class
</script>
@endpush