@extends('layouts.layout_queue')
@section('style')
<link href="{{url('public/css/queues/queue.css')}}" rel="stylesheet" type="text/css">
<meta name="csrf-token" content="{{csrf_token()}}">
<style>
    .bg-green-header{
        background: #197D6E;
        color: #fff;
    }
    .bg-green-body{
        background: #197d6e62;
    }
    .bg-green-header-s{
        background: #b2cfcb;
        color: #fff;
    }
    .bg-green-body-s{
        background: #d3d6d6;
    }

    .s-b:hover > .bg-green-header-s{
        transition: 0.6s;
        background: #197D6E;
        color: #fff;
    }
    .s-b:hover > .bg-green-body-s{
        transition: 0.6s;
        background: #197d6e62;
    }

    .btn-select{
        background: #b2cfcb;
        padding: 1em;
    }
    .btn-unselect{
        padding: 1em;
        background: #197D6D;
    }
    .menu_call{
        display: none;
    }
    .menu_call.active{
        display: -webkit-box;
    }
    .menu_calls{
        display: none;
    }
    .menu_calls.active{
        display: -webkit-box;
    }
</style>
@endsection

@section('content')

    <div class="modal fade" id="modal_del" tabindex="-1" role="dialog" data-backdrop="static"  aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content">
            <div class="modal-header p-2 bg-danger">
            <h5 class="modal-title text-light" id="exampleModalLongTitle"><i class="fas fa-trash text-danger"></i> <z id="del_status_gen">&emsp;</z></h5>
            <button type="button" class="close text-light" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">&times;</span><i class="fas fa-times text-light icon-2x"></i>
            </button>
            </div>
            <div class="modal-body">
                <div class="row m-0">
                    <div class="col-lg-9">
                        เลขคิว : <z id="number_del"></z><br>
                        HN : <z id="hn_del"></z>
                    </div>
                    <div class="col-lg-12 mt-2">
                        <button type="button" class="btn btn-danger w-100" id="id_del" data-dismiss="modal" aria-label="Close">ยืนยันการยกเลิกคิว</button>
                    </div>
                </div>
            </div>
        </div>
        </div>
    </div>

<div class="row m-0">

    <div class="col-lg">
        <a href="{{url("queue")}}" class="card s-b text-center">
            <div class="card-header bg-green-header-s p-3"><h2 class="m-0 text-light">ผู้ป่วยทั้งหมดวันนี้</h2></div>
            <div class="card-body bg-green-body-s p-5"><h1 id="queueall" class="m-0 text-dark">{{$queueall}}</h1></div>
        </a>
    </div>

    @foreach($tb_queuetype as $data)
        <div class="col-lg">
            <a href="{{url("queue")}}/{{$data['code']}}" class="card s-b text-center">
                <div class="card-header bg-green-header{{$data['active']}} p-3"><h1 class="m-0 text-light">{{$data['name']}}</h1></div>
                <div class="card-body bg-green-body p-5">
                    <h1 id="count{{$data['code']}}" class="m-0 text-dark">
                        {{$data['count']}}
                    </h1>
                </div>
            </a>
        </div>
    @endforeach
</div>


<div class="row m-0 mt-3">
    <div class="col-lg-7 p-0">
        <div class="row m-0">

            <div class="col-lg-12 pr-0">
                <div class="card">
                    <div class="card-body row">
                        <div class="col-6">
                            <input id="hn_print" type="text" class="form-control" placeholder="H.N.">
                        </div>
                        <div class="col-6">
                            <a  href_mockup ="{{url('mockup_queue4')}}"
                                class       ="btn btn-light w-100 text-queue add_queue callmodal"
                                qtype_code  ="{{$type_detail->qtype_code}}"
                                qtype_prefix="{{$type_detail->qtype_prefix}}"
                            >
                                <h2 class="display-7">Print Queue</h2>
                            </a>
                        </div>


                        <b>รายการ {{$type_detail->qtype_name}}</b>
                        <table class="table table-borderless">
                            <thead>
                                <tr>
                                    <th>เลขคิว</th>
                                    <th>HN</th>
                                    <th>ชื่อ</th>
                                    <th>เวลาที่รอ</th>
                                    <th>#</th>
                                    <th>#</th>
                                    <th>#</th>
                                </tr>
                            </thead>
                            <tbody id="list_normal"></tbody>
                        </table>
                    </div>
                </div>
            </div>

            <div class="col-lg-12 mt-2 pr-0">
                <div class="card">
                    <div class="card-body">
                        <b>รายการที่ข้าม</b>
                        <table class="table table-borderless">
                            <thead>
                                <tr>
                                    <th>เลขคิว</th>
                                    <th>HN</th>
                                    <th>ชื่อ</th>
                                    <th>เวลาที่รอ</th>
                                    <th></th>
                                </tr>
                            </thead>
                            <tbody id="list_skip"></tbody>
                        </table>
                    </div>
                </div>
            </div>

        </div>
    </div>


    <div class="col-lg-5 p-0">
        <div class="row m-0 h-100">
            <div class="col-lg-12">
                <div class="card h-100">
                    <div class="card-body">

                        <div id="button3" class="row m-0 menu_call active" style="display:{{$holdtype['button3']}}">
                            <div class="col-lg-4 p-1">
                                <button id="btncallagain" class="btn btn-select w-100" queuenumber="{{$holdtype['number']}}"><i class="fab fa-google-play icon-3x text-dark mb-2"></i> <h2 class="m-0">เรียกซ้ำ</h2></button>
                            </div>
                            <div class="col-lg-4 p-1">
                                <button id="btnskip" class="btn btn-unselect text-light w-100 btnback" queueid="{{$holdtype['id']}}"><i class="fas fa-angle-double-right icon-3x text-light mb-2"></i><h2 class="m-0">ข้ามคิว</h2></button>
                            </div>
                            <div class="col-lg-4 p-1">
                                <button id="btnsuccess" class="btn btn-unselect text-light w-100 btnback"><i class="far fa-check-circle icon-3x text-light mb-2"></i><h2 class="m-0">เสร็จสิ้น</h2></button>
                            </div>
                        </div>

                        <div id="button1" class="row m-0 menu_calls active" style="display: {{$holdtype['button1']}}">
                            <div class="col-lg-12 p-1">
                                <button id="btncallfirst" class="btn btn-unselect w-100 h2 text-light" id="call3"><i class="fas fa-play icon-4x text-light"></i> &emsp; เรียกคิว {{$type_detail->qtype_name}}</button>
                            </div>
                        </div>

                        <div class="row m-0 mt-5 mb-5 pt-5 pb-5">
                            <div class="col-lg-6 text-center">
                                <h3>รายการที่กำลังเรียกคิว</h3>
                                <input id="q_id" type="hidden" value="{{$holdtype['id']}}">
                                <h3 id="q_number"></h3></div>
                            <div class="col-lg-6 text-center">
                                <h3>เวลาที่ใช้</h3>
                                <h3 id="q_timeuse"></h3>
                            </div>
                        </div>
                        <div class="row m-0">
                            <div class="col-lg-9">
                                <div class="row m-0">
                                    <div class="col-lg-4"><b>HN : </b></div>
                                    <div class="col-lg"><input id="q_hn" type="text"  class="form-control form-control-sm"></div>
                                </div>
                                <div class="row m-0">
                                    <div class="col-lg-4"><b>เบอร์โทร : </b></div>
                                    <div class="col-lg"><input id="q_tel" type="text"  class="form-control form-control-sm"></div>
                                </div>
                            </div>
                            <div class="col-lg-3 h-100">
                                <button type="button" onclick="edit_pt()" class="btn btn-success h-100">Save</button>
                            </div>
                        </div>
                        <div class="col-lg-12">
                            <div class="row m-0">
                                <div class="col-lg-4"><b>ชื่อ : </b></div>
                                <div class="col-lg"><span id="q_patientname"></span></div>
                            </div>
                            <div class="row m-0">
                                <div class="col-lg-4"><b>ระยะเวลาที่รอ : </b></div>
                                <div id="q_timewait" class="col-lg-8"></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="col-lg-12">&nbsp;</div>
    @if($type_detail->qtype_operation=="capture")
        <div class="col-lg-12">
            <div class="card">
                <div class="card-body">
                    <b>Activity</b>
                    <table class="table table-borderless">
                        <thead>
                            <tr>
                                <th>เลขคิว</th>
                                <th>HN</th>
                                <th>ชื่อ</th>
                                <th>เวลาที่รอ</th>
                                <th></th>
                            </tr>
                        </thead>
                        <tbody id="list_discharge"></tbody>
                        <tbody id="list_operation"></tbody>
                        <tbody id="list_recovery"></tbody>
                        <tbody id="list_success"></tbody>
                    </table>
                </div>
            </div>
        </div>
    @endif


</div>



<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content">
            <div class="modal-body">
                <h1 class="display-3 mt-3 text-center">Print Queue</h1>
                <img src="{{url('public/images/loading02.gif')}}" width="100%">
            </div>
        </div>
    </div>
</div>
@endsection



@section('script')
<script>
    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    });
</script>

<script src='{{url('resources/box/js/box01.js')}}'></script>
<script src="http://{{webconfig('server_name')}}:3000/socket.io/socket.io.js"></script>
<script>
    var socket = io.connect('http://{{webconfig('server_name')}}:3000');
    socket.on('queue', function(msg) {
        refreshdata();

        var calling = msg.search("calling");

        if(calling>0){
            var ex = JSON.parse(msg);
            QueueCALL(ex.calling);
        }
    });

    function edit_pt(){
        var q_id  = $("#q_id").val()
        var q_hn  = $("#q_hn").val()
        var q_tel = $("#q_tel").val()
        if(q_id){
            $.post("{{url('jquery')}}",
            {
                event   : 'edit_q_pt',
                q_id    : q_id,
                q_hn    : q_hn,
                q_tel   : q_tel,
            },
            function(data,status){
                if(data==1){
                    Swal.fire("แก้ไขสำเร็จ", "", "success");
                }else{
                    Swal.fire("เกิดข้อผิดพลาด", "กรุณาลองใหม่อีกครั้ง", "warning");
                }
            });
        }
    }
    function refreshdata(){
        $.post('{{url('queue')}}',{
            event:'refreshdata'
        },function(data,status){
            var obj             = JSON.parse(data);


            console.log(data,obj);

            var normal          = JSON.stringify(obj.normal{{$qtype}});
            var skip            = JSON.stringify(obj.skip{{$qtype}});

            var operation       = JSON.stringify(obj.operation{{$qtype}});
            var success         = JSON.stringify(obj.success{{$qtype}});
            var discharge       = JSON.stringify(obj.discharge{{$qtype}});
            var recovery        = JSON.stringify(obj.recovery{{$qtype}});

            var hold            = JSON.parse(JSON.stringify(obj.hold{{$qtype}}));
            holddata(hold.queue);
            console.log(hold);

            $("#queueall").html(obj.queueall);

            box('#list_normal'      ,normal,    '{{url($type_detail->qtype_html)}}');
            box('#list_skip'        ,skip,      '{{url($type_detail->qtype_skip)}}');

            box('#list_operation'   ,operation, '{{url('resources/box/endoqueue/queue_operation.html')}}');
            box('#list_discharge'   ,discharge, '{{url('resources/box/endoqueue/queue_discharge.html')}}');
            box('#list_recovery'    ,recovery,  '{{url('resources/box/endoqueue/queue_recovery.html')}}');
            box('#list_success'     ,success,   '{{url('resources/box/endoqueue/queue_discharge.html')}}');

            @foreach($tb_queuetype as $data)
                @php($code=$data['code'])
                $('#count{{$code}}').html(obj.code{{$code}});
            @endforeach

        });
    }

    function holddata(data){
        if (data[0]!==undefined){
            // QueueCALL(data[0].q_number);
            $("#btnskip").attr('queueid',data[0].q_id);
            $("#btncallagain").attr('queuenumber',data[0].q_number);

            $("#q_id").val(data[0].q_id);
            $("#q_number").html(data[0].q_number);
            $("#q_timeuse").html(data[0].q_start);
            $("#q_hn").val(data[0].q_hn);
            $("#q_tel").val(data[0].q_tel);
            $("#q_patientname").html(data[0].q_patientname);
            $("#q_timewait").html(data[0].q_start);
        }
    }



    setTimeout(()=>{refreshdata();},500);

    var ขอเชิญหมายเลข    = new Audio("{{fileconfig('sound/queue/th/เชิญหมายเลข.wav')}}");
    var sound0  = new Audio("{{fileconfig('sound/queue/th/0.wav')}}");
    var sound1  = new Audio("{{fileconfig('sound/queue/th/1.wav')}}");
    var sound2  = new Audio("{{fileconfig('sound/queue/th/2.wav')}}");
    var sound3  = new Audio("{{fileconfig('sound/queue/th/3.wav')}}");
    var sound4  = new Audio("{{fileconfig('sound/queue/th/4.wav')}}");
    var sound5  = new Audio("{{fileconfig('sound/queue/th/5.wav')}}");
    var sound6  = new Audio("{{fileconfig('sound/queue/th/6.wav')}}");
    var sound7  = new Audio("{{fileconfig('sound/queue/th/7.wav')}}");
    var sound8  = new Audio("{{fileconfig('sound/queue/th/8.wav')}}");
    var sound9  = new Audio("{{fileconfig('sound/queue/th/9.wav')}}");
    var soundA  = new Audio("{{fileconfig('sound/queue/th/A.wav')}}");
    var soundC  = new Audio("{{fileconfig('sound/queue/th/C.wav')}}");

    var calling = false;

    $('#btn_order_queue').click(function(){
        if(calling===false){Calling();}
    });




    $('.btn-call-top-queue').click(function(){
        var status = $(this).attr('status');
        // alert("status : "+status);
    });

    function Calling(){
        console.log("Calling");
        calling=true;
        $.post('{{url('queue')}}',{
            event:"calling",
        },function(data,status){
            var json = JSON.parse(data);
            if(json.agian==true){
                socket.emit('queue','{"calling":"'+json.queuenumber+'"}');
                // QueueCALL();
                setTimeout(() => {
                   Calling();
                }, 7000);
            }else{
                calling = false;
            }
        });
    }


    function QueueCALL(number){
        const myArr = number.split("");
        ขอเชิญหมายเลข.play();
        setTimeout(() => {myArr.forEach(numberQUEUE);}, 1000);
    }

    function numberQUEUE(item, index) {
        var time = (1+index)*1000;
        setTimeout(() => {
            if(item=="A"){soundA.play()}
            if(item=="C"){soundC.play()}
            if(item=="0"){sound0.play()}
            if(item=="1"){sound1.play()}
            if(item=="2"){sound2.play()}
            if(item=="3"){sound3.play()}
            if(item=="4"){sound4.play()}
            if(item=="5"){sound5.play()}
            if(item=="6"){sound6.play()}
            if(item=="7"){sound7.play()}
            if(item=="8"){sound8.play()}
            if(item=="9"){sound9.play()}
        }, time);
    }



    $(".callmodal").click(function(){
        $('#exampleModal').modal('show');
    });

    $(".add_queue").click(function(){
        var hn              = $("#hn_print").val();
        var qtype_code      = $(this).attr('qtype_code');
        var qtype_prefix    = $(this).attr('qtype_prefix');
        var value = "none";
        if(value!=null){
            $.post("{{url('queue')}}",{
                event           : "queue_new",
                self_ip         : "{{configTYPE('queue','queue_print_ip')}}",
                hn              : hn,
                value           : value,
                qtype_code      : qtype_code,
                qtype_prefix    : qtype_prefix,
            },function(data, status){
                socket.emit('queue','refreshdata');
                setTimeout(() => {
                    $('#exampleModal').modal('hide');
                }, 1500);
                $("#hn_print").val("");
            });
        }else{}

        $('#text_new_hn').val('');
        $('#text_old_hn').val('');

    });









</script>

<script>
    var count_time  = 0;
    var hour        = 0;
    var minute      = 0;
    setInterval(function(){
        count_time = $(".q_start").length;
        for(x=0;x<count_time;x++){
            hour = parseInt($($(".q_start")[x]).attr('hour'));
            minute = parseInt($($(".q_start")[x]).attr('minute'));
            if(minute>=60){
                hour = hour+1;
                minute = 0;
            }else{
                minute = minute+1;
            }
            $($(".q_start")[x]).attr('hour',hour);
            $($(".q_start")[x]).attr('minute',minute);
            $($(".q_start")[x]).text(hour+' ชั่วโมง '+minute+' นาที');
            hour = 0;
            minute = 0;
        }
     }, 60000);
</script>



<script>


    setInterval(() => {
        $.post('{{url('queue')}}',{event:"send2cloud"},function(data,stutus){
            console.log('send2cloud',data);
        });
    }, 10000);


</script>





<script>


    //function skip_all() {$.post("{{url('api/jquery')}}",{event : "skip_all",},  function(data, status){});}

    //
    $("#hn_n_new").hide();
    // Add New HN

    $("#agenew").on('keyup keypress blur change',function(e){
        if($(this).val() >120){
                $(this).val(120);
        }

        $.post("{{url('jquery')}}",
        {
            event   : 'age_change',
            age     : $("#agenew").val(),
        },
        function(data,status){
            var obj = JSON.parse(data);
            $("#birthyear").val(obj[0]);
        });
    });

    $(".add-new-hn").click(function(){
        var data_type = $(this).attr('q_type');
        var value = $('#text_old_hn').val();

        if(data_type=="regis"){value = $('#text_new_hn').val();}

        if(value!=null){
            $.post("{{url('queue')}}",
            {
                event       : "queue_new",
                self_ip         : "{{$self_ip}}",
                value       : value,
                data_type   : data_type
            },
            function(data, status)
            {
                // if(parseInt(data)==1){
                    Swal.fire("Success", "การเพิ่ม HN สำเร็จ", "success");
                    socket.emit('queue','add_n_hn');
                // }else{
                //     Swal.fire("Fail !", "การเพิ่ม HN ล้มเหลว", "error");
                // }
            });
        }else{
            Swal.fire("Fail !", "การเพิ่ม HN ล้มเหลว", "error");
        }
            $('#text_new_hn').val('');
            $('#text_old_hn').val('');
    });


    $(".add-none-hn").click(function(){
        var data_type   = "regis";
        var value       = 'q'+ Math.floor((Math.random() * 100000) + 1);
        $.post("{{url('queue')}}",
        {
            event       : "queue_new",
            self_ip         : "{{$self_ip}}",
            value       : value,
            data_type   : data_type
        },
        function(data, status){socket.emit('queue','refreshdata');});
    });




    $(".check_null").keyup(function(){
        var check_data_null = $(this).val();
        if(check_data_null.length==0){
            $(this).addClass('border-danger');
        }else{
            $(this).removeClass('border-danger');
        }
    })

    // Add Patient
    function add_pt(){
        var hn = $("#text_new_hn").val()
        var an = $("#pt_an").val()
        var citizen = $("#pt_pass").val()
        var prefix = $("#pt_prefix").val()
        var firstname = $("#pt_firstname").val()
        var lastname = $("#pt_lastname").val()
        var gender = $("#pt_sex").val()
        var birthdate = $("#birthyear").val()+'-'+$("#birthmonth").val()+'-'+$("#birthday").val()
        var age = $("#agenew").val()
        var email = $("#pt_email").val()
        var allergic = $("#pt_medi").val()
        var congenital_disease = $("#pt_detail").val()
        var emer_name = $("#h_alert").val()
        var phone = $("#pt_phone").val()
        var check_data = 0;
        var text = '';
        var class_input = 'border-danger';
        if(hn==undefined){
            text = 'คุณยังไม่ได้กรอก HN ! <br>'
            $("#text_new_hn").addClass(class_input);
            check_data++;
        }
        if(prefix.length==0){
            $("#pt_prefix").addClass(class_input);
            text += 'คุณยังไม่ได้กรอก คำนำหน้าชื่อ ! <br>'
            check_data++;
        }
        if(firstname.length==0){
            $("#pt_firstname").addClass(class_input);
            text += 'คุณยังไม่ได้กรอก ชื่อ ! <br>'
            check_data++;
        }
        if(lastname.length==0){
            $("#pt_lastname").addClass(class_input);
            text += 'คุณยังไม่ได้กรอก นามสกุล ! <br>'
            check_data++;
        }
        if(age.length==0){
            $("#agenew").addClass(class_input);
            text += 'คุณยังไม่ได้กรอก อายุ หรือ ปีเกิด ! <br>'
            check_data++;
        }
        if(check_data==0){
            $.post("{{url('')}}/api/jquery",
            {
                event               : 'add_new_pt',
                hn                  : hn,
                an                  : an,
                citizen             : citizen,
                prefix              : prefix,
                firstname           : firstname,
                lastname            : lastname,
                gender              : gender,
                birthdate           : birthdate,
                email               : email,
                allergic            : allergic,
                congenital_disease  : congenital_disease,
                emer_name           : emer_name,
                phone               : phone,
            },
            function(data,status){
                $('#new_hn').modal('hide')
                ajax_hn(hn)
            });
        }else{
            Swal.fire("Good job!", text, "error");
        }
    }

    function ajax_hn(hn){
        $.post("{{url('queue')}}",{
            event       : "queue_new",
            self_ip         : "{{$self_ip}}",
            value       : hn,
            data_type   : "regis"
        },function(data, status){
            if(parseInt(data)==1){
                Swal.fire("Success", "การเพิ่ม HN สำเร็จ", "success");
                socket.emit('queue','add_n_hn');

            }else{
                Swal.fire("Fail !", "การเพิ่ม HN ล้มเหลว", "error");
            }
        });
    }
    //

    // Focus Text In Modal
    $('#btn_new_hn').click(function(){
        setTimeout(function(){
            $('#text_new_hn').focus();
            }, 2000);
    })
    $('#operation_appoint').click(function(){
        setTimeout(function(){
            $('#text_old_hn').focus();
        }, 2000);
    })
    //

    // Check HN
    $("#birthyear,#birthmonth,#birthday").change(function(){
        $.post("{{url('jquery')}}",
        {
            event   : 'birth_change',
            day     : $("#birthday").val(),
            month   : $("#birthmonth").val(),
            year    : $("#birthyear").val()
        },
        function(data,status){
            var obj = JSON.parse(data);
            $("#agenew").val(obj[0]);
        });
    });

    function clear_hn(){
        $('#text_new_hn').val(null);
    }

    $("#text_new_hn").focusout(function(){
        check_hn($(this).val(),1)
    })

    $("#text_old_hn").focusout(function(){
        check_hn($(this).val(),2)
    })

    function check_hn(hn,type){
        $.post("{{url('')}}/api/jquery",
            {
                event   : "check_hn",
                hn   : hn,
            },
            function(data, status)
            {
                var check_hn = JSON.parse(data);
                if(type==1){
                    if(check_hn.count==1){
                        $("#hn_return").html(check_hn.hn)
                        $("#name_return").html(check_hn.firstname+' '+check_hn.lastname)
                        $('#change_hn').modal('show')
                        $("#hn_n_new").hide();
                    }else{
                        $("#hn_n_new").show();
                    }
                }else{
                    if(check_hn.count==1){
                        $("#hn_return_old").html(check_hn.hn)
                        $("#name_return_old").html(check_hn.firstname+' '+check_hn.lastname)
                        $('#change_hn_old').modal('show')
                    }else{

                    }
                }
            });
    }
    //


    $("#operation_appoint").click(function(){
        $.post("{{url('queue')}}",{
            event   : "operation_appoint",
        },function(data, status){
            var hn_json_return = JSON.parse(data)
            var tr_return = "";
            hn_json_return.forEach(function(object) {
                var hn = String(object.hn);
                tr_return += "<tr id='"+hn+"'>";
                tr_return += "<td>"+object.hn+"</td>";
                tr_return += "<td>"+object.firstname+" "+object.lastname+"</td>";
                tr_return += "<td><button class='btn btn-success' onclick=select_hn_return('"+hn+"')>เลือก</button></td>";
                tr_return += "</tr>";
                $("#hn_show_select").append(tr_return);
                tr_return = "";
            });
        });
    });


    function select_hn_return(hn){
        $("#"+hn).slideUp();

        $.post("{{url('queue')}}",
        {
            event       : "queue_new",
            self_ip         : "{{$self_ip}}",
            value       : hn,
            data_type   :"appoint"
        },
        function(data, status)
        {
            if(parseInt(data)==1){
                Swal.fire("Success", "การเพิ่ม HN สำเร็จ", "success");
                socket.emit('queue','add_n_hn');

            }else{
                Swal.fire("Fail !", "การเพิ่ม HN ล้มเหลว", "error");
            }
        });
    }

    // Print
    function reprint_q(q_id){
        // alert();
        $.post("{{url('queue')}}",{
            event   : "re_print",
            q_id    : q_id,
        },function(data, status){
            console.log(data);
        });
    }

    function nextstep(q_id){
        $.post("{{url('queue')}}",{
            event   : "queue_next",
            q_id    : q_id,
        },function(data, status){
            socket.emit('queue','refreshdata');
        });
    }


    $("#wait_call").click(function(){
        $(".left_wait").removeClass('dp-none');
        $("#tb_wait_detail").addClass('dp-none');
    });
    $("#wait_detail").click(function(){
        $(".left_wait").removeClass('dp-none');
        $("#td_wait_call").addClass('dp-none');
    });


    // Send Data To Modal
    function callmodal(status,this_id,this_type,this_number,this_hn){
        var bg_color = 'bg-danger';
        var text_header = 'เรียกคิวซักประวัติ';

        if(status=="regis_history"){
            var bg_color = 'bg-danger';
            var text_header = 'เรียกคิวซักประวัติ';
        }

        if(status=="regis_appoint"){
            var bg_color = 'bg-warning';
            var text_header = 'เรียกคิวนัดหมาย';
        }

        if(status=="wait_history"){
            var bg_color = 'bg-yellow';
            var text_header = 'เรียกคิวซักประวัติ';
        }

        if(status=="operation_before"){
            var bg_color = 'bg-green';
            var text_header = 'เรียกคิวเตรียมตัวทำหัตถการ';
        }

        var this_color= ['bg-danger','bg-warning','bg-yellow','bg-green'];
        for(i=0;i<4;i++){
            $('#this_header').removeClass(this_color[i]);
        }

        console.log(status,this_id,this_type,this_number,this_hn);


        $.post('{{url('queue')}}',{
            event:"calling_add",
            q_number:this_number
        },function(){
            if(calling===false){Calling();}
        });

        $('#this_header').addClass(bg_color);
        $('#id_call').attr('call_id',this_id);
        $('#id_call').attr('call_status',status);
        $('#id_call').attr('call_type',this_type);

        $('#id_next').attr('call_id',this_id);
        $('#id_next').attr('call_status',status);
        $('#id_next').attr('call_type',this_type);

        $('#id_skip').attr('call_id',this_id);
        $('#id_skip').attr('call_status',status);
        $('#id_skip').attr('call_type',this_type);

        $('#id_call').attr('call_hn',this_hn);

        $('#number_call').html(this_number);
        $('#hn_call').html(this_hn);
        $("#id_app").attr('href',"{{url('note')}}/"+this_hn+"/edit?queue=1")
        $('#call_status_gen').html(text_header);
    }

    // Data Modal Delete
    function delmodal(status,this_id,this_type,this_number,this_hn){
        var text_header = 'ยืนยันการลบคิว';
        $('#id_del').attr('del_id',this_id);
        $('#id_del').attr('del_status',status);
        $('#id_del').attr('del_type',this_type);
        $('#number_del').html(this_number);
        $('#hn_del').html(this_hn);
        $('#del_status_gen').html(text_header);
    }
    //


    $("#id_call").click(function(){
        var queue_id     = $(this).attr('call_id')
        var pt_type      = $(this).attr('call_type')
        var status_temp  = $(this).attr('call_status')
        var number_call  = $('#number_call').html();
        $.post('{{url('queue')}}',{
            event   :"calling_add",
            q_number:number_call
        },function(){
            if(calling===false){Calling();}
        });
    })


    // Delete Queue
    $('#id_del').click(function(){
        var q_id     = $(this).attr('del_id')
        $.post("{{url('queue')}}",{
            event        : "queue_del",
            q_id         : q_id,
        },function(data, status){
            if(parseInt(data)==1){
                Swal.fire("Success", "ยกเลิกคิว สำเร็จ", "success");
                socket.emit('queue','refreshdata');
            }else{
                Swal.fire("Fail !", "ยกเลิกคิว ล้มเหลว", "error");
            }
        });
    })



    // Queue To Next Process
    $("#id_skip").click(function(){
        var q_id = $(this).attr('call_id')
        $.post("{{url('queue')}}",{
            event   : "queue_skip",
            q_id    : q_id,
        },function(data, status){
            if(parseInt(data)==1){
                Swal.fire("Success", "การข้ามคิว สำเร็จ", "success");
                socket.emit('queue','refreshdata');
            }else{
                Swal.fire("Fail !", "การข้ามคิว ล้มเหลว", "error");
            }
        });
    });

    $("#id_next").click(function(){
        var q_id = $(this).attr('call_id')
        $.post("{{url('queue')}}",{
            event   : "queue_next",
            q_id    : q_id,
        },function(data, status){
            socket.emit('queue','refreshdata');
        });
    });


    // Function Switch Tab
    $("#wait_for_detail").click(function(){
        $(".right_wait").removeClass('dp-none');
        $("#tb_wait_procedure").addClass('dp-none');
        $("#tb_go_home").addClass('dp-none');
        $("#tb_rest_procedure").addClass('dp-none');
    });
    $("#wait_procedure").click(function(){
        $(".right_wait").removeClass('dp-none');
        $("#tb_wait_for_detail").addClass('dp-none');
        $("#tb_rest_procedure").addClass('dp-none');
        $("#tb_go_home").addClass('dp-none');
    });
    $("#go_home").click(function(){
        $(".right_wait").removeClass('dp-none');
        $("#tb_wait_procedure").addClass('dp-none');
        $("#tb_wait_for_detail").addClass('dp-none')
        $("#tb_rest_procedure").addClass('dp-none');
    });
    $("#rest_procedure").click(function(){
        $(".right_wait").removeClass('dp-none');
        $("#tb_wait_procedure").addClass('dp-none');
        $("#tb_wait_for_detail").addClass('dp-none')
        $("#tb_go_home").addClass('dp-none');
    });
    //


    // document.getElementById("text_new_hn").addEventListener("keyup", function() {
    //     if (/^[a-zA-Z0-9-]+$/.test(this.value)) {
    //         // document.getElementById("show_lang_in_here").innerHTML = "English";
    //     } else {
    //         this.value = "";
    //     }
    // });

    // document.getElementById("pt_firstname").addEventListener("keyup", function() {
    //     if (/^[a-zA-Zกขฃคฅฆงจฉชซฌญฎฏฐฑฒณดตถทธนบปผฝพฟภมยรฤลฦวศษสหฬอฮฯะัาำิีึืฺุูเแโใไๅๆ็่้๊๋์]+$/.test(this.value)) {
    //             // document.getElementById("show_lang_in_here").innerHTML = "English";
    //     } else {
    //         str = this.value;
    //         str = str.substring(0, str.length - 1);
    //         this.value = str;
    //     }
    // });

    // document.getElementById("pt_lastname").addEventListener("keyup", function() {
    //     if (/^[a-zA-Zกขฃคฅฆงจฉชซฌญฎฏฐฑฒณดตถทธนบปผฝพฟภมยรฤลฦวศษสหฬอฮฯะัาำิีึืฺุูเแโใไๅๆ็่้๊๋์]+$/.test(this.value)) {
    //         // document.getElementById("show_lang_in_here").innerHTML = "English";
    //         } else {
    //             str = this.value;
    //             str = str.substring(0, str.length - 1);
    //             this.value = str;
    //     }
    // });
</script>


<script>

    $("#button1").click(function(){
        $("#button1").hide();
        $("#button3").show();
    });

    $(".btnback").click(function(){
        $("#button3").hide();
        $("#button1").show();
    });

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

        $.post('{{url('queue')}}',{
            event       : "callfirst",
            code        : "{{$qtype}}",
            firsttime   : "true",
        },function(data,status){
            var queuenumber = data;
            socket.emit('queue','refreshdata');
            socket.emit('queue','{"calling":"'+queuenumber+'"}');
        });

    });


    $("#btncallagain").click(function(){
        var queuenumber = $(this).attr("queuenumber");
        socket.emit('queue','{"calling":"'+queuenumber+'"}');
        QueueCALL(queuenumber);
    });


    $("#btnsuccess").click(function(){
        var q_id = $('#q_id').val();
        $.post('{{url('queue')}}',{
            event   : "queuesuccess",
            q_id    : q_id
        },function(data,status){
            socket.emit('queue','refreshdata');
        });

        $("#q_id").val("0");
        $("#q_number").html('');
        $("#q_timeuse").html('');
        $("#q_hn").val('');
        $("#q_tel").val('');
        $("#q_patientname").html('');
        $("#q_timewait").html('');
    });

    $("#btnskip").click(function(){
        var q_id = $(this).attr('queueid')
        $.post("{{url('queue')}}",{
            event   : "queue_skip",
            q_id    : q_id,
        },function(data, status){
            if(parseInt(data)==1){
                Swal.fire("Success", "การข้ามคิว สำเร็จ", "success");
                socket.emit('queue','refreshdata');
            }else{
                Swal.fire("Fail !", "การข้ามคิว ล้มเหลว", "error");
            }
        });

        $("#q_id").val("0");
        $("#q_number").html('');
        $("#q_timeuse").html('');
        $("#q_hn").val('');
        $("#q_tel").val('');
        $("#q_patientname").html('');
        $("#q_timewait").html('');
    });


</script>




@endsection