@extends('layouts.layout_queue')
@section('style')
<link href="{{url('')}}/public/css/queues/queue.css" rel="stylesheet" type="text/css" />
<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;
    }
</style>
@endsection

@section('content')
<div class="row m-0">
    <div class="col-lg">
        <a href="{{url('queue')}}" class="card text-center h-100">
            <div class="card-header bg-green-header p-3"><h2 class="m-0 text-light">ผู้ป่วยทั้งหมดวันนี้</h2></div>
            <div class="card-body bg-green-body p-5"><h1 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-s p-3"><h1 class="m-0 text-light">{{$data['name']}}</h1></div>
                <div class="card-body bg-green-body p-5"><h1 class="m-0 text-dark">{{$data['count']}}</h1></div>
            </a>
        </div>
    @endforeach

</div>

<div class="row m-0 mt-2">
    <div class="col-lg-6 mt-3">
        <div class="card">
            <div class="card-body p-3">
                <h5 class="text-success">รายละเอียดรายการ</h5>
                <table class="table table-borderless">
                    <thead>
                        <tr>
                            <th>รายการ</th>
                            <th>จำนวนทั้งหมด</th>
                            <th>จำนวนที่รอ</th>
                            {{-- <th>ระยะเวลารอคิวเฉลี่ย</th>
                            <th>ระยะเวลาเฉลี่ยในรายการ</th> --}}
                            <th></th>
                        </tr>
                    </thead>
                    <tbody>
                        {{-- @dd($queueall) --}}
                        @foreach ($tb_queuetype as $data)
                        <tr>
                            <td>{{$data['name']}}</td>
                            <td>{{$data['countall']}}</td>
                            <td>{{$data['count']}}</td>
                            <td><i class="far fa-folder"></i></td>
                            {{-- <td>01:30 min.</td>
                            <td>15:30 min.</td> --}}
                        </tr>
                        @endforeach



                        {{-- <tr>
                            <td>ผู้ป่วยนัดหมาย</td>
                            <td>20</td>
                            <td>20</td>
                            <td>01:30 min.</td>
                            <td>15:30 min.</td>
                        </tr>
                        <tr>
                            <td>ผู้ป่วยส่องกล้อง</td>
                            <td>13</td>
                            <td>13</td>
                            <td>05:40 min.</td>
                            <td>301:40 min.</td>
                        </tr>
                        <tr>
                            <td>ผู้ป่วย Fibroscan</td>
                            <td>10</td>
                            <td>10</td>
                            <td>02:30 min.</td>
                            <td>15:30 min.</td>
                        </tr>
                        <tr>
                            <td>อื่นๆ</td>
                            <td>7</td>
                            <td>7</td>
                            <td>01:30 min.</td>
                            <td>05:30 min.</td>
                        </tr> --}}
                    </tbody>
                </table>
            </div>
        </div>
    </div>



    <div class="col-lg-6 mt-3">
        <div class="card">
            <div class="card-body p-3">
                <h5 class="text-success">รายการข้ามคิวและยกเลิกคิว</h5>
                <table class="table table-borderless">
                    <thead>
                        <tr>
                            <th>รายการ</th>
                            <th>การข้ามคิว</th>
                            <th>การยกเลิกคิว</th>
                            <th></th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($tb_queuetype as $data)
                        <tr>
                            <td>{{$data['name']}}</td>
                            <td>{{$data['countskip']}}</td>
                            <td>{{$data['countcancel']}}</td>
                            <td><i class="far fa-folder"></i></td>
                        </tr>
                        @endforeach

                        {{-- <tr>
                            <td>ผู้ป่วยนัดหมาย</td>
                            <td>1</td>
                            <td>0</td>
                            <td><i class="far fa-folder"></i></td>
                        </tr>
                        <tr>
                            <td>ผู้ป่วยส่องกล้อง</td>
                            <td>4</td>
                            <td>0</td>
                            <td><i class="far fa-folder"></i></td>
                        </tr>
                        <tr>
                            <td>ผู้ป่วย Fibroscan</td>
                            <td>0</td>
                            <td>0</td>
                            <td><i class="far fa-folder"></i></td>
                        </tr>
                        <tr>
                            <td>อื่นๆ</td>
                            <td>5</td>
                            <td>2</td>
                            <td><i class="far fa-folder"></i></td>
                        </tr> --}}


                    </tbody>
                </table>
            </div>
        </div>
    </div>
    <div class="col-lg-6 mt-3">
        <div class="card">
            <div class="card-body p-3">
                <h5 class="text-success">Transection Detail</h5>
                <table class="table table-borderless">
                    <thead>
                        <tr>
                            <th>เลขบัตรคิว</th>
                            <th>รายการ</th>
                            <th>ระยะเวลารอคิว</th>
                            <th>Status</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($queuelast as $data)
                        <tr>
                            <td>{{$data->q_number}}</td>
                            @php
                                $type = DB::table('tb_queuetype')->where('qtype_code',$data->q_type)->first();
                            @endphp
                            <td>{{@$type->qtype_name}}</td>
                            <td>{{$data->q_start}}</td>
                            <td>รอซักประวัติ</td>
                        </tr>
                        @endforeach






                        {{-- <tr>
                            <td>A01</td>
                            <td>ผู้ป่วยนัดหมาย</td>
                            <td>04.40 min</td>
                            <td>ซักประวัติ</td>
                        </tr>
                        <tr>
                            <td>A02</td>
                            <td>ผู้ป่วยส่องกล้อง</td>
                            <td>04.40 min</td>
                            <td>ซักประวัติ</td>
                        </tr>
                        <tr>
                            <td>A03</td>
                            <td>ผู้ป่วยส่องกล้อง</td>
                            <td>04.40 min</td>
                            <td>ซักประวัติ</td>
                        </tr>
                        <tr>
                            <td>A04</td>
                            <td>ผู้ป่วยส่องกล้อง</td>
                            <td>04.40 min</td>
                            <td>ทำหัตถการ</td>
                        </tr> --}}
                    </tbody>
                </table>
            </div>
        </div>
    </div>

    <div class="col-lg-6 mt-3">
        <div class="card">
            <div class="card-body p-3">
                <h5 class="text-success">รายละเอียดช่องบริการ</h5>
                <table class="table table-borderless">
                    <thead>
                        <tr>
                            <th>ช่องบริการ</th>
                            <th>ชื่อผู้ให้บริการ</th>
                            <th>ระยะเวลาเข้าระบบ</th>
                            <th>Status</th>
                        </tr>
                    </thead>


                    <tbody>
                        @foreach ($queuehold as $data)
                        <tr>
                            @php
                                $type = DB::table('tb_queuetype')->where('qtype_code',$data->q_type)->first();
                            @endphp
                            <td>{{$type->qtype_name}}</td>
                            <td>{{$data->q_number}}</td>
                            <td>{{$data->q_start}}</td>
                            <td>รอซักประวัติ</td>
                        </tr>
                        @endforeach
                        {{-- <tr>
                            <td>ซักประวัติ01</td>
                            <td>พว.สดายุ ทองลอย</td>
                            <td>04:40 hr.</td>
                            <td>ซักประวัติ</td>
                        </tr>
                        <tr>
                            <td>ซักประวัติ02</td>
                            <td>พว.สมหญิง สมบูรณ์</td>
                            <td>02:40 hr.</td>
                            <td>เรียกคิว</td>
                        </tr>
                        <tr>
                            <td>นัดหมาย01</td>
                            <td>พว.สดายุ ทองคำดี</td>
                            <td>07:40 hr.</td>
                            <td>นัดหมาย</td>
                        </tr>
                        <tr>
                            <td>ซักประวัติ01</td>
                            <td>พว.สดายุ ทองลอย</td>
                            <td>04:40 hr.</td>
                            <td>ซักประวัติ</td>
                        </tr> --}}
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>
@endsection



@section('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) {
        location.reload();
    });
</script>

@endsection