@extends('layouts.layouts_ipad.layouts_Newipad')


@section('style')
    <style>
        .progress-nav .progress {
            left: 7% !important;
            top: 66% !important;
            width: 90% !important;
        }

        .form-select-superdark {
            --vz-input-bg: #000000;
            color: #fff;
            border: 1px solid #bbbbbb;

        }

        .form-select-superdark:focus {
            background: #000;
            color: #fff;
            border: 1px solid #bbbbbb;

        }

        tbody,
        td,
        tfoot,
        th,
        thead,
        tr {
            border-style: none !important;
        }

        .vital-table tr td:nth-child(1) {
            width: 5%;
        }

        .vital-table tr td:nth-child(2) {
            width: 5%;
        }

        .vital-table tr td:nth-child(3) {
            width: 5%;
        }

        .vital-table tr td:nth-child(4) {
            width: 5%;
        }

        .vital-table tr td:nth-child(5) {
            width: 5%;
        }

        .vital-table tr td:nth-child(6) {
            width: 5%;
        }

        .vital-table tr td:nth-child(7) {
            width: 15%;
        }

        .vital-table tr td:nth-child(8) {
            width: 15%;
        }



        ::-webkit-scrollbar {
            width: 5px;
        }



        .border-head {
            border: 1px solid #2B2F34;
            border-radius: 4px;
        }
        .fs-caselist {
            font-size: 15px;
        }
    </style>
@endsection

@section('tophead')
    Cases List
@endsection

@section('modal')
@endsection
@section('content')

        @include('tablet.nursenote.wizard.layoutsheader')

        <div class="tab-content text-muted">
            <div class="tab-pane active" id="appointment" role="tabpanel">
                <div class="row px-4">

                    <div class="col-12 fs-caselist font-gray">
                        <strong>Operation Detail</strong>
                    </div>
                    <div class="row mt-3">
                        <div class="col-2 fs-caselist">
                            Operation Date :
                        </div>
                            @php
                            $datetime = isset($case->appointment) ? format_date($case->appointment, 'd/m/Y h:i') : '';
                            @endphp
                        <div class="col-2" style="color: #CED4DA;">
                            {{$datetime}}
                        </div>
                    </div>
                    <div class="row mt-3">
                        <div class="col-2 fs-caselist">
                            Physician :
                        </div>

                        <div class="col-3 fs-caselist"  style="color: #CED4DA;">
                            {{$case->doctorname}}
                        </div>
                    </div>
                    <div class="row mt-3">
                        <div class="col-2 fs-caselist">
                            Pre-Diagnosis :
                        </div>

                        <div class="col-2 text-white fs-caselist">
                            {{ @$caseall[0]['prediagnostic_other'] }} {{ @$caseall[1]['prediagnostic_other'] }} {{ @$caseall[2]['prediagnostic_other'] }}
                        </div>
                    </div>



                    {{-- <div class="col-4 py-0 font-gray fs-caselist">
                        Date / Time
                    </div>
                    <div class="col-4 py-0 font-gray fs-caselist">
                        Physician
                    </div>
                    <div class="col-4"></div>
                    <div class="col-4  font-gray mt-2 fs-caselist">
                        @php
                            $datetime = isset($case->appointment) ? format_date($case->appointment, 'd/m/Y h:i') : '';
                        @endphp
                        <input type="text" name="date" id="date" class="form-control savejson"
                            value="{{ @$datetime }}" readonly>
                    </div>
                    <div class="col-4 font-gray mt-2">
                        <select class="form-select savejson selectpicker c_physician " id="s_endoscopist"
                            name="case_physicians01" data-live-search="true" required data-choices disabled>
                            <option value=""></option>
                            @foreach (isset($doctor) ? $doctor : [] as $data)
                                @php
                                    $doctorname = $data['user_prefix'] . $data['user_firstname'] . ' ' . $data['user_lastname'];
                                @endphp
                                <option value="{{ $data['id'] }}" @if ($case->doctorname == $doctorname) selected @endif>
                                    {{ $data['user_prefix'] }}{{ $data['user_firstname'] }} {{ $data['user_lastname'] }}
                                </option>
                            @endforeach
                        </select>
                    </div> --}}


                    <div class="col-4  mt-3 py-0 font-gray fs-caselist">
                        Treatment Coverage
                    </div>
                    <div class="col-4 mt-3 py-0 font-gray fs-caselist">
                        Operation Room
                    </div>
                    <div class="col-4"></div>



                    <div class="col-4 font-gray mt-2">
                        <select id="treatment_coverage" name="treatment_coverage" class="form-select">
                            <option value=""></option>
                            @foreach (isset($tb_treatmentcoverage) ? $tb_treatmentcoverage : [] as $data)
                                @php
                                    $data = (object) $data;
                                @endphp
                                @if ($data->name == @$case->treatment_coverage)
                                    <option value="{{ $data->name }}" selected>{{ $data->name }}
                                    </option>
                                @else
                                    <option value="{{ $data->name }}">{{ $data->name }}</option>
                                @endif
                            @endforeach
                        </select>
                        <script>
                            $("#treatment_coverage").select2();
                            $('#treatment_coverage').on('select2:close', function(e) {
                                var value = $('#treatment_coverage').val();
                                $.post('{{ url('api/photomove') }}', {
                                    event: 'savejson',
                                    name: "treatment_coverage",
                                    value: value,
                                    table: "tb_case",
                                    field: 'case_json',
                                    id: '{{ @$cid }}',
                                    comcreate: '{{ @$case->comcreate }}',
                                    procedure: '{{ @$procedure->code }}',
                                }, function(data, status) {});
                            });
                        </script>
                    </div>
                    <div class="col-4   font-gray mt-2">
                        <select name="room" id="room" class="savejson editroom form-select" disabled>
                            <option value=""></option>
                            @isset($room)
                                @foreach ($room as $r)
                                    @php
                                        $r = (object) $r;
                                    @endphp
                                    <option value="{{ $r->room_name }}" @if ($r->room_name == $case->room) selected @endif>
                                        {{ $r->room_name }}
                                    </option>
                                    {{-- <option value="{{$r->room_id}}" @if ($r->room_name == @$case->room) selected @endif >{{$r->room_name}}</option> --}}
                                @endforeach
                            @endisset
                        </select>
                    </div>

                    <div class="col-4"></div>
                    {{-- <div class="col-12 mt-2 py-0 font-gray fs-caselist">
                        Pre-Diagnosis
                    </div>
                    <div class="col-12 mt-2 py-0">
                        <input type="text" class="form-control form-control-dark"
                            value="{{ @$caseall[0]['prediagnostic_other'] }} {{ @$caseall[1]['prediagnostic_other'] }} {{ @$caseall[2]['prediagnostic_other'] }}"
                            readonly>

                    </div> --}}

                    @if (@$tablet->operationrecord)
                        <div class="col-4 mt-3 py-0 font-gray fs-caselist">
                            Procedure (Select to record operation)
                        </div>
                        <div class="col-4"></div>
                        <div class="col-4"></div>
                        <div class="col-4 mt-2 py-0 font-gray">
                            {{-- @dd($caseall); --}}
                            <input type="text" class="form-control form-control-dark"
                                value="{{ @$caseall[0]['procedurename'] }}">
                        </div>
                        <div class="col-8 mt-2 py-0 font-gray">
                            <button type="button" class="btn btn-danger btn-label w-lg waves-effect right waves-light"
                                @if (isset($caseall[0]['procedurename'])) onclick="to_procedure('{{ $caseall[0]['_id'] }}')" @endif><i
                                    class=" ri-check-double-fill label-icon align-middle fs-16"></i> Select</button>
                        </div>
                        <div class="col-4 mt-2 py-0">
                            <input type="text" class="form-control form-control-dark"
                                value="{{ @$caseall[1]['procedurename'] }}">
                        </div>
                        <div class="col-8 mt-2 py-0 font-gray">
                            <button type="button" class="btn btn-danger w-lg btn-label waves-effect right waves-light"
                                @if (isset($caseall[1]['procedurename'])) onclick="to_procedure('{{ $caseall[1]['_id'] }}')" @endif><i
                                    class=" ri-check-double-fill label-icon align-middle fs-16"></i> Select</button>
                        </div>
                        <div class="col-4 mt-2 py-0">
                            <input type="text" class="form-control form-control-dark"
                                value="{{ @$caseall[2]['procedurename'] }}">
                        </div>
                        <div class="col-8 mt-2 py-0 font-gray">
                            <button type="button" class="btn btn-danger w-lg btn-label waves-effect right waves-light"
                                @if (isset($caseall[2]['procedurename'])) onclick="to_procedure('{{ $caseall[2]['_id'] }}')" @endif><i
                                    class=" ri-check-double-fill label-icon align-middle fs-16"></i> Select</button>
                        </div>
                    @endif




                </div>
            </div>




            <div class="tab-pane" id="Nurse" role="tabpanel">
                <div class="card-body">
                    <form action="#" class="form-steps" autocomplete="off">
                        <div class="text-center pt-3 pb-4 mb-1"></div>
                        <div class="row">
                            <div class="col-2"></div>
                            <div class="col-8 text-center">
                                <div id="custom-progress-bar " class="progress-nav mb-4">
                                    <div class="progress" style="height: 1px;">
                                        <div class="progress-bar" role="progressbar" style="width: 0%;" aria-valuenow="0"
                                            aria-valuemin="0" aria-valuemax="100"></div>
                                    </div>

                                    <ul class="nav nav-pills progress-bar-tab custom-nav " role="tablist"
                                        style="text-align: -webkit-center;">

                                        @if (@$tablet->note_historytaking01)
                                            <li class="nav-item" role="presentation">
                                                <span>History Taking 1</span>
                                                <button class="nav-link rounded-pill step-process" data-step="history1"
                                                    data-progressbar="custom-progress-bar " id="pills-gen-info-tab"
                                                    data-bs-toggle="pill" data-bs-target="#pills-gen-info" type="button"
                                                    role="tab" aria-controls="pills-gen-info" aria-selected="true">
                                                    1
                                                </button>
                                            </li>
                                        @endif

                                        @if (@$tablet->note_historytaking02)
                                            <li class="nav-item" role="presentation">
                                                <span>History Taking 2</span>
                                                <button class="nav-link rounded-pill active step-process"
                                                    data-progressbar="custom-progress-bar" id="pills-info-desc-tab"
                                                    data-bs-toggle="pill" data-step="history2"
                                                    data-bs-target="#pills-info-desc" type="button" role="tab"
                                                    aria-controls="pills-info-desc" aria-selected="false">2</button>
                                            </li>
                                        @endif

                                        @if (@$tablet->note_operation)
                                            <li class="nav-item" role="presentation">
                                                <span>Operation</span>

                                                <button class="nav-link rounded-pill step-process"
                                                    data-progressbar="custom-progress-bar" id="pills-success-tab"
                                                    data-bs-toggle="pill" data-step="operation"
                                                    data-bs-target="#pills-success" type="button" role="tab"
                                                    aria-controls="pills-success" aria-selected="false">3</button>
                                            </li>
                                        @endif

                                        @if (@$tablet->note_recovery)
                                            <li class="nav-item" role="presentation">
                                                <span>Recovery</span>
                                                <button class="nav-link rounded-pill step-process"
                                                    data-progressbar="custom-progress-bar" id="pills-recovery-nav"
                                                    data-bs-toggle="pill" data-step="recovery"
                                                    data-bs-target="#pills-recovery-tab" type="button" role="tab"
                                                    aria-controls="pills-recovery-tab" aria-selected="false">4</button>
                                            </li>
                                        @endif

                                        @if (@$tablet->note_followup)
                                            <li class="nav-item" role="presentation">
                                                <span>Follow-Up</span>
                                                <button class="nav-link rounded-pill step-process"
                                                    data-progressbar="custom-progress-bar" id="pills-followup-nav"
                                                    data-bs-toggle="pill" data-step="followup"
                                                    data-bs-target="#pills-followup-tab" type="button" role="tab"
                                                    aria-controls="pills-followup-tab" aria-selected="false">5</button>
                                            </li>
                                        @endif

                                    </ul>
                                </div>
                            </div>
                            <div class="col-2"></div>
                        </div>

                        <div class="tab-content">
                            <div class="tab-pane fade show " id="pills-gen-info" role="tabpanel"
                                aria-labelledby="pills-gen-info-tab">

                            </div>
                            @include('tablet.nursenote.wizard.history01')
                            @include('tablet.nursenote.wizard.history02')
                            @include('tablet.nursenote.wizard.operation')
                            @include('tablet.nursenote.wizard.recovery')
                            @include('tablet.nursenote.wizard.followup')

                        </div>




                        {{-- <div class=" tab-pane fade show " id="pills-gen-info" role="tabpanel"
                            aria-labelledby="pills-info-desc-tab">
                        </div> --}}



                        <div class="row mt-3">
                            <div class="col-4"></div>
                            <div class="col-4 text-end align-self-center">
                                <h5 class="text-white">Recorded by</h5>
                            </div>
                            <div class="col-4">
                                <select class="form-select form-select-superdark save-note" id="nurse_record"
                                    type="text" data-choices>
                                    @if (uget('user_type') == 'nurse')
                                        <option value="{{ uid() }}" selected>{{ uget('user_prefix') }}
                                            {{ uget('user_firstname') }} {{ uget('user_lastname') }}
                                        </option>
                                    @else
                                        <option label="Choose..."></option>
                                        @foreach (isset($nurse) ? $nurse : [] as $data)
                                            @php
                                                $data = (object) $data;
                                            @endphp
                                            @isset($note->history2['nurse_record'])
                                                @if ($note->history2['nurse_record'] == $data->id)
                                                    <option value="{{ @$data->id }}" selected>{{ @$data->user_prefix }}
                                                        {{ @$data->user_firstname }} {{ @$data->user_lastname }}</option>
                                                @else
                                                    <option value="{{ @$data->id }}">{{ @$data->user_prefix }}
                                                        {{ @$data->user_firstname }} {{ @$data->user_lastname }}</option>
                                                @endif
                                            @else
                                                <option value="{{ @$data->id }}">{{ @$data->user_prefix }}
                                                    {{ @$data->user_firstname }} {{ @$data->user_lastname }}</option>
                                            @endisset
                                        @endforeach
                                    @endif
                                </select>

                            </div>
                            @if (Request::segment(2) != 'registration')
                                <div class="col-12 text-end mt-3">
                                    <input type="hidden" name="process" value="history2">
                                    <button
                                        class="btn btn-primary btn-label waves-effect right waves-light"><span>Confirm</span><i
                                            class="ri-check-double-line label-icon align-middle fs-16 ms-2"></i></button>
                                </div>
                            @endif
                        </div>
                </div>
            </div>
            </form>


            <div class="tab-pane" id="billingrecord" role="tabpanel">
                <div class="row m-0">
                    <div class="card-ipad font-gray p-3">
                        <div class="col-12">
                            <span class="fs-14">Procedure Billing (Additional)</span>
                        </div>
                        <div class="row">
                            <div class="col-lg-10 mt-3">
                                <div class="row">
                                    <div class="col-10">
                                        <input type="text" class="form-control form-control-dark"
                                            placeholder="Code or Description">
                                    </div>
                                    <div class="col-2">
                                        <button class="btn btn-icon btn-secondary"><i class="ri-search-line"></i></button>
                                    </div>

                                </div>
                                <div class="row align-items-center">
                                    <div class="col-2">
                                        45.23
                                    </div>
                                    <div class="col-8">
                                        Colonoscopic with biopsy
                                    </div>
                                    <div class="col-2">
                                        <i class="ri-delete-bin-5-fill text-danger ms-1 ri-2x"></i>
                                    </div>
                                    <div class="col-2">
                                        45.23
                                    </div>
                                    <div class="col-8">
                                        Colonoscopic with polypectomy cancer
                                    </div>
                                    <div class="col-2">
                                        <i class="ri-delete-bin-5-fill text-danger ms-1 ri-2x"></i>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-2 text-end">
                                <button class="btn btn-success w-100" style="height: 100px;">
                                    <i class="ri-dossier-fill ri-2x"></i>
                                    <span class="d-block fs-16">Save</span>
                                </button>
                            </div>
                        </div>
                    </div>
                    <div class="row m-0 bg-softless-dark ">
                        <div class="col-12 m-0 p-0">
                            <table class="table table-nowrap text-white table-borderless mb-0 ">
                                <thead>
                                    <tr class="bg-softless-dark font-gray ">
                                        <td>Procedure Code</td>
                                        <td style="width: 45%;">Procedure Detail (check box)</td>
                                        <td>Procedure Description</td>

                                    </tr>
                                </thead>
                                <tbody class="font-gray " style="background: #25292D;">
                                    <tr>
                                        <td>45.23</td>
                                        <td>Biopsy</td>
                                        <td>Colonoscopy with biopsy</td>
                                    </tr>
                                    <tr>
                                        <td>45.23</td>
                                        <td>Polypectomy (large intestine)</td>
                                        <td>Endoscopic polypectomy of large intestine</td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
                <div class="row m-0  mt-3 ">
                    <div class="card-ipad font-gray p-3">
                        <div class="col-12">
                            <span class="fs-14">Accessory Billing (Additional)</span>
                        </div>
                        <div class="row">
                            <div class="col-lg-10 mt-3">
                                <div class="row">
                                    <div class="col-10">
                                        <input type="text" class="form-control form-control-dark"
                                            placeholder="Code or Description">
                                    </div>
                                    <div class="col-2">
                                        <button class="btn btn-icon btn-secondary"><i class="ri-search-line"></i></button>
                                    </div>

                                </div>
                                <div class="row align-items-center">
                                    <div class="col-2">
                                        13532
                                    </div>
                                    <div class="col-8">
                                        Endoloop
                                    </div>
                                    <div class="col-2">
                                        <i class="ri-delete-bin-5-fill text-danger ms-1 ri-2x"></i>
                                    </div>
                                    <div class="col-2">
                                        5343
                                    </div>
                                    <div class="col-8">
                                        Distal Cap
                                    </div>
                                    <div class="col-2">
                                        <i class="ri-delete-bin-5-fill text-danger ms-1 ri-2x"></i>
                                    </div>
                                </div>
                            </div>
                            <div class="col-lg-2 text-end">
                                <button class="btn btn-success w-100" style="height: 100px;">
                                    <i class="ri-dossier-fill ri-2x"></i>
                                    <span class="d-block fs-16">Save</span>
                                </button>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row m-0 bg-softless-dark ">
                    <div class="col-12 m-0 p-0">
                        <table class="table table-nowrap text-white table-borderless mb-0 ">
                            <thead>
                                <tr class="bg-softless-dark font-gray ">
                                    <td>Accessory Code</td>
                                    <td style="width: 45%;">Accessory Description</td>
                                    <td>Volume</td>

                                </tr>
                            </thead>
                            <tbody class="font-gray " style="background: #25292D;">
                                <tr>
                                    <td>13532</td>
                                    <td>Biopsy</td>
                                    <td><input type="text" class="form-control form-control-superdark w-25"></td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>

        </div>

@endsection

@section('script')

<script>
    $(document).ready(function(){

    })
</script>
    <script>
        $(".btn_changestatus").click(function() {
            let datatype = $(this).attr("data-type");
            let hn = $(this).attr("hn");
            console.log(datatype + hn);

            $.post('{{ url('api/case') }}', {
                event: 'statuschange',
                cid: "{{ $case->_id }}",
                datatype: datatype,
                hn: hn,
            }, function(d, s) {

            });
        });

        function to_procedure(_id) {
            if (_id != '') {
                location.href = `{{ url('tablet/procedure') }}/${_id}/edit`
            }
        }
    </script>
@endsection
