@extends('layouts.note_layout')
@section('title', 'EndoCapture')
@section('con-top')

@endsection


@section('style')
<style>
    *{
        font-size: 18px;
    }
    .first-fill{
        border:none !important;
        border-collapse: collapse !important;
        /* border-top: #fff !important; */
    }
    .table-bordered{
        border:none !important;
    }
    #tb_size tr td,#tb_size tr th{
        font-size: 16px;
        line-height: 16px;
    }
    .text-input4,.text-input4:focus{
        border: 1px solid rgb(180, 177, 177);
        outline: none;
        width: 5em;
        text-align: center;
    }

    .cn{
        align-items: center;
    }
    .checkbox,.radio{
        font-size: 18px !important;
    }
    #tb_appen thead tr td:nth-child(1),#tb_appen thead tr td:nth-child(3),#tb_appen thead tr td:nth-child(4),#tb_appen thead tr td:nth-child(5),#tb_appen thead tr td:nth-child(6){
        width: 6%;
    }
    #tb_appen thead tr td:nth-child(2),#tb_appen thead tr td:nth-child(8){width: 15%;}
    #tb_appen thead tr td:nth-child(7){width: 40%;}
    .text-input5, .text-input5:focus {
        border: 1px solid rgb(209, 208, 208);
        outline: none;
        width: 85%;
        text-align: center;
    }
</style>
@endsection


@section('modal')
<div class="modal fade" id="pt_detail" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title" id="exampleModalLabel">รายละเอียดผู้ป่วย</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div class="modal-body">
            <div class="row m-0">
                <div class="col-lg border-right border-dark">
                    <div class="row m-0">
                        <div class="col-xl-5">
                            <div class="row m-0">
                                <div class="col-lg-12 text-center">
                                    <img src="{{url('')}}/public/images/avatar.png" alt="งิงิ" srcset="" class="w-50">
                                </div>
                                <div class="col-lg-12 mt-5 h3 text-center text-danger"> HN : 1234567890</div>
                                <div class="col-lg-12 text-center mt-2"><button type="button" class="btn btn-outline-dark">Edit Patient profile</button></div>
                            </div>
                        </div>
                        <div class="col-xl-7 p-0">
                            <div class="row m-0">
                                <div class="col-lg-12"><b>ชื่อ : </b>{{ @$json->patientname }}</div>
                                <div class="col-lg-12 mt-2"><b>ID/Passport : </b>1234567890</div>
                                <div class="col-lg-12 mt-2"><b>อายุ : </b>{{ @$json->age }}</div>
                                <div class="col-lg-12 mt-2"><b>เพศ : </b>{{ @$json->gender_name }}</div>
                                <div class="col-lg-12 mt-2"><b>ติดต่อ : </b>{{ @$json->email }}</div>
                                <div class="col-lg-12 mt-2"><b>ติดต่อฉุกเฉิน : </b>ไม่พบข้อมูล</div>
                                <div class="col-lg-12 mt-2"><b>หมู่เลือด : </b>ไม่พบข้อมูล</div>
                                <div class="col-lg-12 mt-2"><b>สิทธิการรักษา : </b>ไม่พบข้อมูล</div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg">
                    <div class="row m-0">
                        <div class="col-xl-6 p-0">
                            <div class="row m-0">
                                <div class="col-lg-12"><b class="border-bottom border-dark">ผลการซักประวัติ</b></div>
                                <div class="col-lg-12 mt-3"><b>อาการนำมา : </b>10543</div>
                                <div class="col-lg-12 mt-3"><b>ประวัติความเจ็บป่วย : </b>Room 1</div>
                                <div class="col-lg-12 mt-3"><b>ประวัติการใช้ยา : </b>ไม่พบข้อมูล</div>
                                <div class="col-lg-12 mt-3"><b>ประวัติการแพ้ยา : </b>ไม่พบข้อมูล</div>
                                <div class="col-lg-12 mt-3"><b>ประวัติการแพ้อาหาร : </b>ไม่พบข้อมูล</div>
                                <div class="col-lg-12 mt-3"><b>ประวัติการผ่าตัด : </b>ไม่พบข้อมูล</div>
                            </div>
                        </div>
                        <div class="col-xl-6 p-0">
                            <div class="row m-0">
                                <div class="col-lg-12">&emsp;</div>
                                <div class="col-lg-12 mt-3"><b>ประวัติการตั้งครรภ์ :</b>ไม่พบข้อมูล</div>
                                <div class="col-lg-12 mt-3"><b>ประวัติการส่องกล้อง :</b>ไม่พบข้อมูล</div>
                                <div class="col-lg-12 mt-3"><b>ประวัติการดื่มสุรา :</b>ไม่พบข้อมูล</div>
                                <div class="col-lg-12 mt-3"><b>ประวัติการสูบบุหรี่ :</b>ไม่พบข้อมูล</div>
                                <div class="col-lg-12 mt-3"><b>Provisional Diagnosis :</b>ไม่พบข้อมูล</div>
                                <div class="col-lg-12 mt-3"><b>Status :</b><span class="label label-inline">ซักประวัติ</span></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-secondary w-100" data-dismiss="modal">Close</button>
        </div>
      </div>
    </div>
</div>
@endsection


@section('content')
@php
    $id     = $_GET['id'];
    $note   = DB::table('tb_casenote')->where('note_id',$id)->first();
    $json   = jsonDecode($note->note_casejson);
    $nurse  = DB::table('users')->where('user_type','nurse')->get();
@endphp
<div class="row m-0">
    <div class="col-lg-12 ipad-none">
        <div class="card">
            <div class="card-body">
                <div class="row m-0">
                    <div class="col-lg-4 border-right border-dark">
                        <div class="row m-0">
                            <div class="col-lg-5">
                                <div class="row m-0">
                                    <div class="col-lg-12">
                                        <img src="{{url('')}}/public/images/avatar.png" alt="งิงิ" srcset="" class="img-fluid">
                                    </div>
                                    <div class="col-lg-12 mt-5 h3 text-center text-danger"> HN : {{ $json->hn }}</div>
                                    <div class="col-lg-12 text-center mt-2"><button type="button" class="btn btn-outline-dark">Edit Patient profile</button></div>
                                </div>
                            </div>
                            <div class="col-lg-7 p-0">
                                <div class="row m-0">
                                    <div class="col-lg-12"><b>ชื่อ : </b>{{ @$json->patientname }}</div>
                                    <div class="col-lg-12 mt-2"><b>ID/Passport : </b>1234567890</div>
                                    <div class="col-lg-12 mt-2"><b>อายุ : </b>{{ @$json->age }}</div>
                                    <div class="col-lg-12 mt-2"><b>เพศ : </b>{{ @$json->gender_name }}</div>
                                    <div class="col-lg-12 mt-2"><b>ติดต่อ : </b>{{ @$json->email }}</div>
                                    <div class="col-lg-12 mt-2"><b>ติดต่อฉุกเฉิน : </b>ไม่พบข้อมูล</div>
                                    <div class="col-lg-12 mt-2"><b>หมู่เลือด : </b>ไม่พบข้อมูล</div>
                                    <div class="col-lg-12 mt-2"><b>สิทธิการรักษา : </b>ไม่พบข้อมูล</div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-8">
                        <div class="row m-0">
                            <div class="col-lg-5 p-0">
                                <div class="row m-0">
                                    <div class="col-lg-12"><b class="border-bottom border-dark">ผลการซักประวัติ</b></div>
                                    <div class="col-lg-12 mt-3"><b>อาการนำมา : </b>10543</div>
                                    <div class="col-lg-12 mt-3"><b>ประวัติความเจ็บป่วย : </b>Room 1</div>
                                    <div class="col-lg-12 mt-3"><b>ประวัติการใช้ยา : </b>ไม่พบข้อมูล</div>
                                    <div class="col-lg-12 mt-3"><b>ประวัติการแพ้ยา : </b>ไม่พบข้อมูล</div>
                                    <div class="col-lg-12 mt-3"><b>ประวัติการแพ้อาหาร : </b>ไม่พบข้อมูล</div>
                                    <div class="col-lg-12 mt-3"><b>ประวัติการผ่าตัด : </b>ไม่พบข้อมูล</div>
                                </div>
                            </div>
                            <div class="col-lg-5 p-0">
                                <div class="row m-0">
                                    <div class="col-lg-12">&emsp;</div>
                                    <div class="col-lg-12 mt-3"><b>ประวัติการตั้งครรภ์ :</b>ไม่พบข้อมูล</div>
                                    <div class="col-lg-12 mt-3"><b>ประวัติการส่องกล้อง :</b>ไม่พบข้อมูล</div>
                                    <div class="col-lg-12 mt-3"><b>ประวัติการดื่มสุรา :</b>ไม่พบข้อมูล</div>
                                    <div class="col-lg-12 mt-3"><b>ประวัติการสูบบุหรี่ :</b>ไม่พบข้อมูล</div>
                                    <div class="col-lg-12 mt-3"><b>Provisional Diagnosis :</b>ไม่พบข้อมูล</div>
                                    <div class="col-lg-12 mt-3"><b>Status :</b><span class="label label-inline">ซักประวัติ</span></div>
                                </div>
                            </div>
                            <div class="col-lg-2 p-0">
                                <div class="row m-0 h-100">
                                    <div class="col-lg-12 m-auto">
                                        <a href="javascript:void(0)" class="btn btn-light-danger font-weight-bold w-100">
                                            <span class="svg-icon svg-icon-4x"><!--begin::Svg Icon | path:C:\wamp64\www\keenthemes\themes\metronic\theme\html\demo1\dist/../src/media/svg/icons\Code\Stop.svg--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="24px" height="24px" viewBox="0 0 24 24" version="1.1">
                                                <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
                                                    <rect x="0" y="0" width="24" height="24"/>
                                                    <path d="M12,22 C6.4771525,22 2,17.5228475 2,12 C2,6.4771525 6.4771525,2 12,2 C17.5228475,2 22,6.4771525 22,12 C22,17.5228475 17.5228475,22 12,22 Z M12,20 C16.418278,20 20,16.418278 20,12 C20,7.581722 16.418278,4 12,4 C7.581722,4 4,7.581722 4,12 C4,16.418278 7.581722,20 12,20 Z M19.0710678,4.92893219 L19.0710678,4.92893219 C19.4615921,5.31945648 19.4615921,5.95262146 19.0710678,6.34314575 L6.34314575,19.0710678 C5.95262146,19.4615921 5.31945648,19.4615921 4.92893219,19.0710678 L4.92893219,19.0710678 C4.5384079,18.6805435 4.5384079,18.0473785 4.92893219,17.6568542 L17.6568542,4.92893219 C18.0473785,4.5384079 18.6805435,4.5384079 19.0710678,4.92893219 Z" fill="#000000" fill-rule="nonzero" opacity="0.3"/>
                                                </g>
                                            </svg><!--end::Svg Icon--></span>
                                            <br>
                                            Cancel
                                        </a>
                                        <a href="javascript:void(0)" class="btn btn-light-warning font-weight-bold mt-3 w-100">
                                            <span class="svg-icon svg-icon-4x"><!--begin::Svg Icon | path:C:\wamp64\www\keenthemes\themes\metronic\theme\html\demo1\dist/../src/media/svg/icons\Communication\Write.svg--><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="24px" height="24px" viewBox="0 0 24 24" version="1.1">
                                                <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
                                                    <rect x="0" y="0" width="24" height="24"/>
                                                    <path d="M12.2674799,18.2323597 L12.0084872,5.45852451 C12.0004303,5.06114792 12.1504154,4.6768183 12.4255037,4.38993949 L15.0030167,1.70195304 L17.5910752,4.40093695 C17.8599071,4.6812911 18.0095067,5.05499603 18.0083938,5.44341307 L17.9718262,18.2062508 C17.9694575,19.0329966 17.2985816,19.701953 16.4718324,19.701953 L13.7671717,19.701953 C12.9505952,19.701953 12.2840328,19.0487684 12.2674799,18.2323597 Z" fill="#000000" fill-rule="nonzero" transform="translate(14.701953, 10.701953) rotate(-135.000000) translate(-14.701953, -10.701953) "/>
                                                    <path d="M12.9,2 C13.4522847,2 13.9,2.44771525 13.9,3 C13.9,3.55228475 13.4522847,4 12.9,4 L6,4 C4.8954305,4 4,4.8954305 4,6 L4,18 C4,19.1045695 4.8954305,20 6,20 L18,20 C19.1045695,20 20,19.1045695 20,18 L20,13 C20,12.4477153 20.4477153,12 21,12 C21.5522847,12 22,12.4477153 22,13 L22,18 C22,20.209139 20.209139,22 18,22 L6,22 C3.790861,22 2,20.209139 2,18 L2,6 C2,3.790861 3.790861,2 6,2 L12.9,2 Z" fill="#000000" fill-rule="nonzero" opacity="0.3"/>
                                                </g>
                                            </svg><!--end::Svg Icon--></span>
                                            <br>
                                            Edit
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="col-lg-12 mt-3">
        <div class="card">
            <div class="card-body">
                <div class="row m-0">
                    <div class="col-lg-4 p-0"><b class="border-bottom border-dark">ผลการซักประวัติ</b></div>
                    <div class="col-lg-8 p-0"><b class="border-bottom border-dark">ผลตรวจทางห้องทดลอง</b></div>
                </div>
                <div class="row m-0">
                    <div class="col-lg-4 p-0">
                        <div class="row m-0 mt-2">
                            <div class="col-lg-12 p-0 mt-5"><b>สภาพเเรกรับ : </b>&ensp; รู้สึกตัว - เปลนั่ง - 0.9% NSS</div>
                            <div class="col-lg-12 p-0 mt-5"><b>การประเมินด้านร่างกาย : </b>&ensp; ผ่าน <i class="far fa-check-circle text-success"></i></div>
                            <div class="col-lg-12 p-0 mt-5"><b>การประเมินด้านจิตใจ : </b>&ensp; ผู้ป่วยมีความวิตกกังวลเล็กน้อย.</div>
                        </div>
                    </div>
                    <div class="col-lg-8 p-0">
                        <table class="table table-bordered text-center mt-2" id="tb_size">
                            <tr>
                                <th class="first-fill"></th>
                                <th colspan="3">CBC</th>
                                <th colspan="3">COAGULATION</th>
                                <th colspan="3">LFT</th>
                            </tr>
                            <tr>
                                <td>การตรวจ</td>
                                <td>HCT (%)</td>
                                <td>WBC (UL)</td>
                                <td>Plet (UL)</td>
                                <td>PT (Sec)</td>
                                <td>PTT</td>
                                <td>INR</td>
                                <td>AST-SGOT (UL)</td>
                                <td>ALT-SGPT (UL)</td>
                                <td>ASP (UL)</td>
                                <td>Bilirubin (mg/dl)</td>
                            </tr>
                            <tr>
                                <td>เกณฑ์</td>
                                <td>> 25%</td>
                                <td>> 1,500</td>
                                <td>> 70,000</td>
                                <td>10.1 - 13.1</td>
                                <td>-</td>
                                <td>< 1.2</td>
                                <td>0 - 40</td>
                                <td>0 - 40</td>
                                <td>39 - 117</td>
                                <td>0 - 1.5</td>
                            </tr>
                            <tr>
                                <td>ผลตรวจ</td>
                                <td class="text-success">50%</td>
                                <td class="text-success">1,500</td>
                                <td class="text-success">100,000</td>
                                <td class="text-success">12</td>
                                <td class="text-success">5</td>
                                <td class="text-danger">16</td>
                                <td class="text-danger">60</td>
                                <td class="text-danger">60</td>
                                <td class="text-success">85</td>
                                <td class="text-success">14</td>
                            </tr>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="col-lg-12 mt-3">
        <div class="accordion accordion-toggle-arrow" id="accordionExample1">
            <div class="card">
                <div class="card-header bg-success">
                    <div class="card-title h3 text-light" data-toggle="collapse" data-target="#collapseOne1">
                        Procedure : EGD
                    </div>
                </div>
                <div id="collapseOne1" class="collapse show" data-parent="#accordionExample1">
                    <div class="card-body">
                        <div class="row m-0">
                            {{-- <div class="col-lg-6">
                                <div class="row m-0">
                                    <div class="col-lg-12"><b>Anesthesia</b></div>
                                </div>
                                <div class="row m-0 mt-3">
                                    <div class="col-lg-3">
                                        <label class="checkbox checkbox-warning">
                                            {!!combox($json,'anesthesia_topical01')!!}
                                            <span></span>
                                            &emsp;Topical
                                        </label>
                                    </div>
                                    <div class="col-lg-3">
                                        <label class="checkbox checkbox-warning">
                                            {!!combox($json,'anesthesia_iv_sedation01')!!}
                                            <span></span>
                                            &emsp;IV Sedation
                                        </label>
                                    </div>
                                    <div class="col-lg-3">
                                        <label class="checkbox checkbox-warning">
                                            {!!combox($json,'anesthesia_et_intubation01')!!}
                                            <span></span>
                                            &emsp;ET Intubation
                                        </label>
                                    </div>
                                    <div class="col-lg-3">
                                        <label class="checkbox checkbox-warning">
                                            {!!combox($json,'anesthesia_tracheostomy01')!!}
                                            <span></span>
                                            &emsp;Tracheostomy
                                        </label>
                                    </div>
                                </div>
                                <div class="row m-0 mt-3">
                                    <div class="col-lg-12">
                                        {!!comtxt($json,'anesthesia_other','form-control')!!}
                                    </div>
                                </div>
                            </div> --}}
                            <div class="col-lg-12">
                                <div class="row m-0">
                                    <div class="col-lg-12"><b>Medication</b></div>
                                </div>
                                <div class="row m-0">
                                    <div class="col-lg-4 mt-3">
                                        <div class="row m-0 cn">
                                            <div class="col-lg-5 p-0">
                                                <label class="checkbox checkbox-warning">
                                                    {!!combox($json,'medication_buscopan01')!!}
                                                    <span></span>
                                                    &emsp;Buscopan
                                                </label>
                                            </div>
                                            <div class="col-lg-5 p-0">
                                                {!!comtxt($json,'medication_buscopantext01','text-input5')!!}
                                                {{-- <input type="number" name="" class="text-input4"> --}}
                                            </div>
                                            <div class="col-lg-2 p-0">mg.</div>
                                        </div>
                                    </div>
                                    <div class="col-lg-4 mt-3">
                                        <div class="row m-0 cn">
                                            <div class="col-lg-5 p-0">
                                                <label class="checkbox checkbox-warning">
                                                    {!!combox($json,'medication_propofol01')!!}
                                                    <span></span>
                                                    &emsp;Propofol
                                                </label>
                                            </div>
                                            <div class="col-lg-5 p-0">
                                                {!!comtxt($json,'medication_propofoltext01','text-input5')!!}
                                                {{-- <input type="number" name="" class="text-input4"> --}}
                                            </div>
                                            <div class="col-lg-2 p-0">mg.</div>
                                        </div>
                                    </div>
                                    <div class="col-lg-4 mt-3">
                                        <div class="row m-0 cn">
                                            <div class="col-lg-5 p-0">
                                                <label class="checkbox checkbox-warning">
                                                    {!!combox($json,'medication_dormicum01')!!}
                                                    <span></span>
                                                    &emsp;Dormicum
                                                </label>
                                            </div>
                                            <div class="col-lg-5 p-0">
                                                {!!comtxt($json,'medication_dormicumtext01','text-input5')!!}
                                                {{-- <input type="number" name="" class="text-input4"> --}}
                                            </div>
                                            <div class="col-lg-2 p-0">mg.</div>
                                        </div>
                                    </div>
                                    <div class="col-lg-4 mt-3">
                                        <div class="row m-0 cn">
                                            <div class="col-lg-5 p-0">
                                                <label class="checkbox checkbox-warning">
                                                    {!!combox($json,'medication_pethidine01')!!}
                                                    <span></span>
                                                    &emsp;Pethidine
                                                </label>
                                            </div>
                                            <div class="col-lg-5 p-0">
                                                {!!comtxt($json,'medication_pethidinetext01','text-input5')!!}
                                                {{-- <input type="number" name="" class="text-input4"> --}}
                                            </div>
                                            <div class="col-lg-2 p-0">mg.</div>
                                        </div>
                                    </div>
                                    <div class="col-lg-4 mt-3">
                                        <div class="row m-0 cn">
                                            <div class="col-lg-5 p-0">
                                                <label class="checkbox checkbox-warning">
                                                    {!!combox($json,'medication_diazepam01')!!}
                                                    <span></span>
                                                    &emsp;Diazepam
                                                </label>
                                            </div>
                                            <div class="col-lg-5 p-0">
                                                {!!comtxt($json,'medication_diazepamtext01','text-input5')!!}
                                                {{-- <input type="number" name="" class="text-input4"> --}}
                                            </div>
                                            <div class="col-lg-2 p-0">mg.</div>
                                        </div>
                                    </div>
                                    <div class="col-lg-12 mt-5 p-0">
                                        <div class="row m-0 mt-5 cn">
                                            <div class="col-lg-8">
                                                {!!comtxt($json,'medication_other01','form-control')!!}
                                                {{-- <input type="text" name="" id="" class="form-control" placeholder="Medication other"> --}}
                                            </div>
                                            <div class="col-lg-2">
                                                {!!comtxt($json,'medication_othersub01','form-control')!!}
                                                {{-- <input type="text" name="" id="" class="form-control"> --}}
                                            </div>
                                            <div class="col-lg-2"><select name="" id="" class="form-control"><option value="">mg.</option></select></div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row m-0 mt-5">
                            <div class="col-lg-12">
                                <table class="table table-borderless text-center" id="tb_appen">
                                    <thead>
                                        <tr>
                                            <td>Time</td>
                                            <td>BP (mmHg)</td>
                                            <td>P</td>
                                            <td>RR</td>
                                            <td>SpO<sub>2</sub></td>
                                            <td>LOC</td>
                                            <td>O<sub>2</sub></td>
                                            <td>อาการ</td>
                                            <td>Remark</td>
                                        </tr>
                                    </thead>
                                    <tbody id="add_fill">
                                        <tr>
                                            <td><button class="btn btn-light-dark font-weight-bold btn-sm st_time" onclick="st_time(0)">Check</button></td>
                                            <td>{!!comtxt($json,'tb01_bp','form-control')!!}</td>
                                            <td>{!!comtxt($json,'tb01_p','form-control')!!}</td>
                                            <td>{!!comtxt($json,'tb01_rr','form-control')!!}</td>
                                            <td>{!!comtxt($json,'tb01_spo','form-control')!!}</td>
                                            <td>{!!comtxt($json,'tb01_loc','form-control')!!}</td>
                                            <td>{!!comtxt($json,'tb01_o2','form-control')!!}</td>
                                            <td>{!!comtxt($json,'tb01_symptom','form-control')!!}</td>
                                            <td>{!!comtxt($json,'tb01_remark','form-control')!!}</td>
                                        </tr>
                                        <tr>
                                            <td><button class="btn btn-light-dark font-weight-bold btn-sm st_time" onclick="st_time(1)">Check</button></td>
                                            <td>{!!comtxt($json,'tb02_bp','form-control')!!}</td>
                                            <td>{!!comtxt($json,'tb02_p','form-control')!!}</td>
                                            <td>{!!comtxt($json,'tb02_rr','form-control')!!}</td>
                                            <td>{!!comtxt($json,'tb02_spo','form-control')!!}</td>
                                            <td>{!!comtxt($json,'tb02_loc','form-control')!!}</td>
                                            <td>{!!comtxt($json,'tb02_o2','form-control')!!}</td>
                                            <td>{!!comtxt($json,'tb02_symptom','form-control')!!}</td>
                                            <td>{!!comtxt($json,'tb02_remark','form-control')!!}</td>
                                        </tr>
                                    </tbody>
                                    <tbody>
                                        <tr>
                                            <td><button class="btn btn-light-success font-weight-bold" onclick="add_tr()">+Add</button></td>
                                            <td colspan="6"></td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                        {{-- <div class="row m-0 mt-5 pt-5">
                            <div class="col-lg-4"></div>
                            <div class="col-lg-8 p-0">
                                <div class="row m-0 mt-2 cn">
                                    <div class="col-lg-3 text-right">Nurse Circulate</div>
                                    <div class="col-lg-4">
                                        <select name="" id="" class="form-control">
                                            <option value="" selected disabled hidden>Select</option>
                                            @forelse($nurse as $n)
                                                <option value='{{ $n->id }}'>{{ $n->name }}</option>
                                            @empty
                                                <option>ไม่ข้อมูล</option>
                                            @endforelse
                                        </select>
                                    </div>
                                    <div class="col-lg-4"><select name="" id="" class="form-control"><option value=""></option></select></div>
                                    <div class="col-lg-1"><button class="btn btn-light-primary font-weight-bold">บันทึก</button></div>
                                </div>
                                <div class="row m-0 mt-2 cn">
                                    <div class="col-lg-3 text-right">Nurse Circulate</div>
                                    <div class="col-lg-4">
                                        <select name="" id="" class="form-control">
                                            <option value="" selected disabled hidden>Select</option>
                                            @forelse($nurse as $n)
                                                <option value='{{ $n->id }}'>{{ $n->name }}</option>
                                            @empty
                                                <option>ไม่ข้อมูล</option>
                                            @endforelse
                                        </select>
                                    </div>
                                    <div class="col-lg-4"><select name="" id="" class="form-control"><option value=""></option></select></div>
                                    <div class="col-lg-1"></div>
                                </div>
                            </div>
                        </div> --}}
                    </div>
                </div>
            </div>
        </div>
    </div>


    <div class="col-lg-12 mt-3">
        <div class="accordion accordion-toggle-arrow" id="accordionExample2">
            <div class="card">
                <div class="card-header bg-info">
                    <div class="card-title h3 text-light" data-toggle="collapse" data-target="#collapseOne2">
                        Procedure : Colonoscopy
                    </div>
                </div>
                <div id="collapseOne2" class="collapse show" data-parent="#accordionExample2">
                    <div class="card-body">
                        <div class="row m-0">
                            <div class="col-lg-12">
                                <div class="row m-0">
                                    <div class="col-lg-12"><b>Medication</b></div>
                                </div>
                                <div class="row m-0">
                                    <div class="col-lg-4 mt-3">
                                        <div class="row m-0 cn">
                                            <div class="col-lg-5 p-0">
                                                <label class="checkbox checkbox-warning">
                                                    {!!combox($json,'medication_buscopan01')!!}
                                                    <span></span>
                                                    &emsp;Buscopan
                                                </label>
                                            </div>
                                            <div class="col-lg-5 p-0">
                                                {!!comtxt($json,'medication_buscopantext01','text-input5')!!}
                                            </div>
                                            <div class="col-lg-2 p-0">mg.</div>
                                        </div>
                                    </div>
                                    <div class="col-lg-4 mt-3">
                                        <div class="row m-0 cn">
                                            <div class="col-lg-5 p-0">
                                                <label class="checkbox checkbox-warning">
                                                    {!!combox($json,'medication_propofol01')!!}
                                                    <span></span>
                                                    &emsp;Propofol
                                                </label>
                                            </div>
                                            <div class="col-lg-5 p-0">
                                                {!!comtxt($json,'medication_propofoltext01','text-input5')!!}
                                            </div>
                                            <div class="col-lg-2 p-0">mg.</div>
                                        </div>
                                    </div>
                                    <div class="col-lg-4 mt-3">
                                        <div class="row m-0 cn">
                                            <div class="col-lg-5 p-0">
                                                <label class="checkbox checkbox-warning">
                                                    {!!combox($json,'medication_dormicum01')!!}
                                                    <span></span>
                                                    &emsp;Dormicum
                                                </label>
                                            </div>
                                            <div class="col-lg-5 p-0">
                                                {!!comtxt($json,'medication_dormicumtext01','text-input5')!!}
                                            </div>
                                            <div class="col-lg-2 p-0">mg.</div>
                                        </div>
                                    </div>
                                    <div class="col-lg-4 mt-3">
                                        <div class="row m-0 cn">
                                            <div class="col-lg-5 p-0">
                                                <label class="checkbox checkbox-warning">
                                                    {!!combox($json,'medication_pethidine01')!!}
                                                    <span></span>
                                                    &emsp;Pethidine
                                                </label>
                                            </div>
                                            <div class="col-lg-5 p-0">
                                                {!!comtxt($json,'medication_pethidinetext01','text-input5')!!}
                                            </div>
                                            <div class="col-lg-2 p-0">mg.</div>
                                        </div>
                                    </div>
                                    <div class="col-lg-4 mt-3">
                                        <div class="row m-0 cn">
                                            <div class="col-lg-5 p-0">
                                                <label class="checkbox checkbox-warning">
                                                    {!!combox($json,'medication_diazepam01')!!}
                                                    <span></span>
                                                    &emsp;Diazepam
                                                </label>
                                            </div>
                                            <div class="col-lg-5 p-0">
                                                {!!comtxt($json,'medication_diazepamtext01','text-input5')!!}
                                            </div>
                                            <div class="col-lg-2 p-0">mg.</div>
                                        </div>
                                    </div>
                                    <div class="col-lg-12 mt-5 p-0">
                                        <div class="row m-0 mt-5 cn">
                                            <div class="col-lg-8">
                                                {!!comtxt($json,'medication_other01','form-control')!!}
                                            </div>
                                            <div class="col-lg-2">
                                                {!!comtxt($json,'medication_othersub01','form-control')!!}
                                            </div>
                                            <div class="col-lg-2"><select name="" id="" class="form-control"><option value="">mg.</option></select></div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row m-0 mt-5">
                            <div class="col-lg-12">
                                <table class="table table-borderless text-center" id="tb_appen2">
                                    <thead>
                                        <tr>
                                            <td>Time</td>
                                            <td>BP (mmHg)</td>
                                            <td>P</td>
                                            <td>RR</td>
                                            <td>SpO<sub>2</sub></td>
                                            <td>LOC</td>
                                            <td>O<sub>2</sub></td>
                                            <td>อาการ</td>
                                            <td>Remark</td>
                                        </tr>
                                    </thead>
                                    <tbody id="add_fill2">
                                        <tr>
                                            <td><button class="btn btn-light-dark font-weight-bold btn-sm st_time2" onclick="st_time2(0)">Check</button></td>
                                            <td>{!!comtxt($json,'tb01_bp','form-control')!!}</td>
                                            <td>{!!comtxt($json,'tb01_p','form-control')!!}</td>
                                            <td>{!!comtxt($json,'tb01_rr','form-control')!!}</td>
                                            <td>{!!comtxt($json,'tb01_spo','form-control')!!}</td>
                                            <td>{!!comtxt($json,'tb01_loc','form-control')!!}</td>
                                            <td>{!!comtxt($json,'tb01_o2','form-control')!!}</td>
                                            <td>{!!comtxt($json,'tb01_symptom','form-control')!!}</td>
                                            <td>{!!comtxt($json,'tb01_remark','form-control')!!}</td>
                                        </tr>
                                        <tr>
                                            <td><button class="btn btn-light-dark font-weight-bold btn-sm st_time2" onclick="st_time2(1)">Check</button></td>
                                            <td>{!!comtxt($json,'tb02_bp','form-control')!!}</td>
                                            <td>{!!comtxt($json,'tb02_p','form-control')!!}</td>
                                            <td>{!!comtxt($json,'tb02_rr','form-control')!!}</td>
                                            <td>{!!comtxt($json,'tb02_spo','form-control')!!}</td>
                                            <td>{!!comtxt($json,'tb02_loc','form-control')!!}</td>
                                            <td>{!!comtxt($json,'tb02_o2','form-control')!!}</td>
                                            <td>{!!comtxt($json,'tb02_symptom','form-control')!!}</td>
                                            <td>{!!comtxt($json,'tb02_remark','form-control')!!}</td>
                                        </tr>
                                    </tbody>
                                    <tbody>
                                        <tr>
                                            <td><button class="btn btn-light-success font-weight-bold" onclick="add_tr2()">+Add</button></td>
                                            <td colspan="6"></td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection




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

    function call_ajax(hn,type){
        alert('HN : '+hn+' TYPE : '+type);
    }
    ///// editnow /////
    $('.savejson').bind('focusout', function() {

        var this_id     = $(this).attr('id');
        var this_name   = $(this).attr('name');
        var this_type   = $(this).attr('type');

        if (this_type == "checkbox") {
            $.post('{{ url('jquery') }}', {
                event   : 'notesavejson',
                idhtml  : this_id,
                value   : $(this).prop('checked'),
                table   : 'tb_case',
                idname  : 'note_id',
                id      : '{{ $note->note_id }}',
                procedure: '0',
            }, function(data, status) {});
        } else {
            setTimeout(function() {
                $.post('{{ url('jquery') }}', {
                    event   : 'notesavejson',
                    idhtml  : this_id,
                    value   : $('#' + this_id).val(),
                    table   : 'tb_case',
                    idname  : 'note_id',
                    id      : '{{ $note->note_id }}',
                    procedure: '0',
                }, function(data, status) {
                    console.log(data);
                });
            }, 1000);
        }
    });

    $('.savejson_checkbox').focusout(function() {
        var this_name = $(this).attr('name');
        var allVals = [];
        $('[name=' + this_name + ']:checked').each(function() {
            allVals.push($(this).val());
        });
        var val = JSON.stringify(allVals);
        $.post('{{ url('jquery') }}', {
            event: 'notesavejson_checkbox',
            idhtml: this_name,
            value: val,
            table: 'tb_case',
            idname: 'note_id',
            id: '{{ $note->note_id }}',
            procedure: 0,
        }, function(data, status) {});
    });

    {!! viewmode() !!}

    $('.detectbodyafter').focusout(function() {
        detectbody('after');
    });

    $("#btn_appdetectafter").click(function() {
        var str = "";
        str += '<tr>';
        str +=
            '<td style="padding: 5px;"><input type="text" name="after_arr_time"    class="detectbodyafter form-control"></td>';
        str +=
            '<td style="padding: 5px;"><input type="text" name="after_arr_bp"      class="detectbodyafter form-control"></td>';
        str +=
            '<td style="padding: 5px;"><input type="text" name="after_arr_p"       class="detectbodyafter form-control"></td>';
        str +=
            '<td style="padding: 5px;"><input type="text" name="after_arr_rr"      class="detectbodyafter form-control"></td>';
        str +=
            '<td style="padding: 5px;"><input type="text" name="after_arr_spo"     class="detectbodyafter form-control"></td>';
        str +=
            '<td style="padding: 5px;"><input type="text" name="after_arr_loc"     class="detectbodyafter form-control"></td>';
        str +=
            '<td style="padding: 5px;"><input type="text" name="after_arr_o"       class="detectbodyafter form-control"></td>';
        str +=
            '<td style="padding: 5px;"><input type="text" name="after_arr_symptom" class="detectbodyafter form-control"></td>';
        str +=
            '<td style="padding: 5px;"><input type="text" name="after_arr_remark"  class="detectbodyafter form-control"></td>';
        str += '</tr>';
        $("#tabledetectafter").append(str);
        $('.detectbodyafter').focusout(function() {
            detectbody('after');
        });
    });

    $('.detectbodyactive').focusout(function() {
        detectbody('active');
    });

    $("#btn_appdetectactive").click(function() {
        var str = "";
        str += '<tr>';
        str +=
            '<td style="padding: 5px;"><input type="text" name="active_arr_time"    class="detectbodyactive form-control"></td>';
        str +=
            '<td style="padding: 5px;"><input type="text" name="active_arr_bp"      class="detectbodyactive form-control"></td>';
        str +=
            '<td style="padding: 5px;"><input type="text" name="active_arr_p"       class="detectbodyactive form-control"></td>';
        str +=
            '<td style="padding: 5px;"><input type="text" name="active_arr_rr"      class="detectbodyactive form-control"></td>';
        str +=
            '<td style="padding: 5px;"><input type="text" name="active_arr_spo"     class="detectbodyactive form-control"></td>';
        str +=
            '<td style="padding: 5px;"><input type="text" name="active_arr_loc"     class="detectbodyactive form-control"></td>';
        str +=
            '<td style="padding: 5px;"><input type="text" name="active_arr_o"       class="detectbodyactive form-control"></td>';
        str +=
            '<td style="padding: 5px;"><input type="text" name="active_arr_symptom" class="detectbodyactive form-control"></td>';
        str +=
            '<td style="padding: 5px;"><input type="text" name="active_arr_remark"  class="detectbodyactive form-control"></td>';
        str += '</tr>';
        $("#tabledetectactive").append(str);
        $('.detectbodyactive').focusout(function() {
            detectbody('active');
        });
    });



    function detectbody(actwhen) {
        var arr_time = [];
        $('[name=' + actwhen + '_arr_time]').each(function() {
            arr_time.push($(this).val());
        });
        var arr_bp = [];
        $('[name=' + actwhen + '_arr_bp]').each(function() {
            arr_bp.push($(this).val());
        });
        var arr_p = [];
        $('[name=' + actwhen + '_arr_p]').each(function() {
            arr_p.push($(this).val());
        });
        var arr_rr = [];
        $('[name=' + actwhen + '_arr_rr]').each(function() {
            arr_rr.push($(this).val());
        });
        var arr_spo = [];
        $('[name=' + actwhen + '_arr_spo]').each(function() {
            arr_spo.push($(this).val());
        });
        var arr_loc = [];
        $('[name=' + actwhen + '_arr_loc]').each(function() {
            arr_loc.push($(this).val());
        });
        var arr_o = [];
        $('[name=' + actwhen + '_arr_o]').each(function() {
            arr_o.push($(this).val());
        });
        var arr_symptom = [];
        $('[name=' + actwhen + '_arr_symptom]').each(function() {
            arr_symptom.push($(this).val());
        });
        var arr_remark = [];
        $('[name=' + actwhen + '_arr_remark]').each(function() {
            arr_remark.push($(this).val());
        });
        var val_time = JSON.stringify(arr_time);
        var val_bp = JSON.stringify(arr_bp);
        var val_p = JSON.stringify(arr_p);
        var val_rr = JSON.stringify(arr_rr);
        var val_spo = JSON.stringify(arr_spo);
        var val_loc = JSON.stringify(arr_loc);
        var val_o = JSON.stringify(arr_o);
        var val_symptom = JSON.stringify(arr_symptom);
        var val_remark = JSON.stringify(arr_remark);
        $.post("{{ url('jquery') }}", {
            event: 'detectbody',
            cid: '{{ $note->note_id }}',
            actwhen: actwhen,
            val_time: val_time,
            val_bp: val_bp,
            val_p: val_p,
            val_rr: val_rr,
            val_spo: val_spo,
            val_loc: val_loc,
            val_o: val_o,
            val_symptom: val_symptom,
            val_remark: val_remark,
        }, function(data, status) {
            console.log(data);
        });
    }

</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('chat message', function(msg) {
    });
    $('.btn-step2-before-operation').click(function(){
        var hn = $(this).attr('hn');
        $.post('{{url('note')}}',{
            event   : 'operation_before',
            hn      : hn
        },function(data,status){
            socket.emit('queue','refreshdata');
        });
    });
</script>

<script>
    function add_tr(){
        var x = $(".st_time").length
        var tr = "<tr>";
        tr += "<td><button class='btn btn-light-dark font-weight-bold btn-sm st_time' onclick='st_time("+x+")'>Check</button></td>";
        for(i=1;i<=8;i++){
        tr += "<td><input type=\"text\" name=\"\" class=\"form-control\"></td>";
        }
        tr += "</tr>";
        $("#add_fill").append(tr)
    }
    function st_time(data){
        var dt = new Date();
        var time = dt.getHours() + ":" + dt.getMinutes();
        if($($(".st_time")[data]).text()=='Check'){
            $($(".st_time")[data]).text(time)
        }else{
            $($(".st_time")[data]).text('Check')
        }
    }
</script>
<script>
    function add_tr2(){
        var x = $(".st_time2").length
        var tr = "<tr>";
        tr += "<td><button class='btn btn-light-dark font-weight-bold btn-sm st_time2' onclick='st_time2("+x+")'>Check</button></td>";
        for(i=1;i<=8;i++){
        tr += "<td><input type=\"text\" name=\"\" class=\"form-control\"></td>";
        }
        tr += "</tr>";
        $("#add_fill2").append(tr)
    }
    function st_time2(data){
        var dt = new Date();
        var time = dt.getHours() + ":" + dt.getMinutes();
        if($($(".st_time2")[data]).text()=='Check'){
            $($(".st_time2")[data]).text(time)
        }else{
            $($(".st_time2")[data]).text('Check')
        }
    }
</script>
@endsection