@extends('layouts.note_layout')
@section('title', 'EndoNote')
@section('style')
<link href="{{url('')}}/public/css/patient/index.css" rel="stylesheet" type="text/css" />

@endsection

@section('content')
<div class="clearfix"></div>

<div class="row" style="margin: 0;">
	<div class="col-lg-12">
        <div class="card">
            <div class="card-header">
                <form action="" method="get">
                    <div class="row">
                        <div class="col-lg-2 pdx">
                            {{Html::link('patient/create','Add new patient ',['class'=>'btn btn-secondary btn-rounded waves-light waves-effect w-md w100']) }}
                        </div>
                        <div class="col-lg-4"></div>
                        <div class="col-lg-4 pdx">
                            <input type="search" name="search" class="form-control" style="width:100%" placeholder="ค้นหาผู้ป่วย">
                        </div>
                        <div class="col-lg-2 pdx">
                            <span class="form-group-btn" >
                                <button type="submit" class="btn btn-success" style="width:100%"><i class="flaticon2-search-1 icon-md"></i>Search</button>
                            </span>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
<div class="row" style="margin: 0;margin-top: 1em;">
    <div class="col-lg-5">
        <div class="card">
            <div class="card-body">
                <div class="table-rep-plugin table-responsive">
                    <table id="tech-companies-1" class="table table-hover" data-add-focus-btn="">
                        <thead>
                        <tr>
                            <th>HN</th>
                            <th>Name</th>
                            <th>Age</th>
                            <th width="90" class="text-center">Select</th>
                        </tr>
                        </thead>
                        <tbody>
                            @php
                                $m = 1;
                                $newset = "";
                            @endphp
                            @forelse($patient as $l)

                                @php
                                    if($newset != $l->hn){
                                        $newset = $l->hn;
                                        $m=1;
                                    }else{
                                        $m++;
                                    }
                                    $count_case = DB::table('tb_case')->where('case_hn',$l->hn)->count();
                                @endphp

                            @if($m==1)
                            <tr>
                                <td>{{ $l->hn }}</td>
                                <td>{{ $l->firstname }} {{ $l->lastname }}</td>
                            @php
                                $datetime1 = date_create($l->birthdate);
                                $datetime2 = date_create(date('Y-m-d'));
                                if($datetime1==false){
                                    $datetime1 = date_create(date('Y-m-d'));
                                }
                                $interval = date_diff($datetime1, $datetime2);

                                $age = $interval->format('%y');
                                if($age>150){
                                    $datetime1 = date_create($l->birthdate);
                                    $year = date('Y')+543;
                                    $datetime2 = date_create(date("$year-m-d"));

                                $interval = date_diff($datetime1, $datetime2);

                                $age = $interval->format('%y');
                                }
                            @endphp
                                <td>{{ $age }}</td>
                                <td>
                                    <button class="btn btn-icon waves-effect waves-light btn-info search_val" style="width: 100%;" btn_id="{{$l->patient_id}}" btn_name="{{$l->firstname}} {{$l->lastname}}" btn_hn="{{$l->hn}}"><i class="far fa-folder-open"></i></button>
                                </td>
                            </tr>
                            @endif
                            @empty
                            <tr>
                                <td colspan="9">No data!!! </td>
                            </tr>
                            @endforelse
                        </tbody>
                    </table>
                </div>

                {{$patient->appends(request()->input())->links()}}
            </div>
        </div>
    </div>


    <div class="col-lg-7">
        <div class="card" style="height: 100%;">
            <div class="card-header" style="padding-bottom: 1em;">
                <div class="row">
                    <div class="col-lg-6">
                        <h5 id="btn_name"></h5>
                        <h5 id="btn_hn"></h5>
                        <k id="link_edit"></k>
                    </div>
                    <div class="col-lg-6 text-right">
                        <h2>HISTORY</h2>
                        <k id="btn_create"></k>
                    </div>
                </div>

            </div>
            <div class="card-body">
                <table class="table table-striped">
                        <thead class="">
                            <tr>
                                <th scope="col">Case ID</th>
                                <th scope="col">Status</th>
                                <th scope="col">Doctor</th>
                                <th scope="col">Procedure</th>
                                <th scope="col">Date</th>
                                <th></th>
                            </tr>
                        </thead>
                        <tbody id="td_data">
                            <tr>
                                <th scope="row" colspan="6" class="text-center">No data !!</th>
                            </tr>
                        </tbody>
                  </table>
            </div>
        </div>
    </div>
</div>

@endsection




@section('script')
<script>
    $.ajaxSetup({ headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') } });
    $('.search_val').click(function(){
        var mockup      = "";
        var btn_id      = $(this).attr('btn_id');
        var this_name   = $(this).attr('btn_name');
        var this_hn     = $(this).attr('btn_hn');
        var this_url    = "{{url('')}}";
        $('#btn_name').text("Name : "+this_name);
        $('#btn_hn').text("HN : "+this_hn);
        $('#btn_create').html("<a href='"+this_url+"/registration/"+btn_id+"' class='btn btn-primary btn-lg'><i class='fa fa-plus'></i> New case</a>");
        $('#link_edit').html("<a href='"+this_url+"/patient/"+btn_id+"/edit?prepage={{url()->full()}}' "+"class='btn btn-warning btn-lg'><i class='far fa-edit icon-sm'></i>&nbsp;Edit patient info</a>");
        $("#td_data").html("<tr><td colspan='6' style='text-align: center;'><div class='loadingio-spinner-bars-zy9i70wgs1m'><div class='ldio-vfu9b3lacsh'><div></div><div></div><div></div><div></div></div></div></td></tr>");
        $.post("{{url('jquery')}}",{
            event       : 'query_patient',
            this_hn     :  this_hn,
            this_url    : this_url,
        },function(data,status){
            // mockup
                mockup += "<tr>";
                mockup += "<td>1</td>";
                mockup += "<td><span class='label label-warning label-pill label-inline mr-2 h4'> Registered </span></td>";
                mockup += "<td>"+this_name+"</td>"
                mockup += "<td>EGD</td><td>2021-10-24 </td>"
                mockup += "<td class='text-right'><a class='btn btn-secondary text-dark btn-sm' href='#''><i class='far fa-calendar-times'></i></a>";
                mockup += "<a data-toggle='popover' data-trigger='hover' data-content='PDF Note' data-placement='top'"+"href='"+"{{url('notepdf')}}"+"' class='btn btn-info btn-sm' data-original-title='' title=''><i class='far fa-folder-open'></i></a>";
                mockup += "</td>";
                mockup += "</tr>";
            // mockup


            $("#td_data").html(mockup);
            $('[data-toggle="popover"]').popover();
        });
    });
    $(document).ajaxSuccess(function() {
        $('[data-toggle="popover"]').popover();
    });
</script>
@endsection