@extends('layouts.layout_capture')


@section('title', 'EndoCapture')

@section('style')
<link href="{{url('')}}/public/assets5/css/layout_home.css" rel="stylesheet" type="text/css" />
<style>
.fetal-biometry td{padding: 5px;width: 15%;}
.dating-table td{padding-left: 10px;min-width: 40px;}
.dating-table tr:first-child td{padding: 8px 5px !important;}
.row{align-items: center;}
td{white-space: nowrap;}
.card-graph{
    overflow-x: auto;
    height: 99em;
}
</style>
<style>
    .card-graph ul {
        list-style-type: none;
    }

    .card-graph li {
        display: inline-block;
    }

    .card-graph input[type="checkbox"][id^="myCheckbox"] {
        display: none;
    }

    .card-graph label {
        border: 1px solid #fff;
        padding: 10px;
        display: block;
        position: relative;
        margin: 10px;
        cursor: pointer;
    }

    .card-graph label:before {
        background-color: white;
        color: green;
        content: " ";
        display: block;
        border-radius: 50%;
        border: 1px solid green;
        position: absolute;
        top: -2px;
        left: -5px;
        width: 25px;
        height: 25px;
        text-align: center;
        line-height: 28px;
        transition-duration: 0.4s;
        transform: scale(0);
    }

    .card-graph label img {

        transition-duration: 0.2s;
        transform-origin: 50% 50%;
    }

    .card-graph :checked + label {
        border-radius: 7px;
        border-color: greenyellow;
    }

    .card-graph :checked + label:before {
        content: "✓";
        background-color: greenyellow;
        transform: scale(1);
    }

    .card-graph :checked + label img {
        transform: scale(0.9);
        z-index: -1;
    }
    .form-check > label{
        text-decoration: underline;
        color: black;
    }
</style>
@endsection

@section('modal')

@endsection


@section('content')
{{-- <div class="col-12">
    <div class="card mb-5 pb-2">
        <div class="card-body">
            <div class="row mt-3">
                <div class="col-lg-12"><b>Indication</b></div>
                <div class="col-lg-12">
                    <input type="text" name="indication" id="indication" class="form-control form-control-sm save-json {{data_check_bg(@$json->indication)}}" placeholder="Growth scan." value="{{@$json->indication}}">
                </div>
            </div>
            <div class="row mt-3">
                <div class="col-lg-12"><b><u>History</u></b></div>
                <div class="col-lg-12">
                    <input type="text" name="history" id="history" class="form-control form-control-sm bg-light save-json {{data_check_bg(@$json->history)}}" value="{{@$json->history}}">
                </div>
            </div>
            <div class="row mt-3">
                <div class="col-lg-12"><b>Pregnacy</b></div>
                <div class="col-1"></div>
                <div class="col-1 p-0 text-right">Number of fetuses</div>
                <div class="col-2">
                    <select name="number_of_fetuses" id="number_of_fetuses" class="form-control form-control-sm save-json">
                        @for ($i=1;$i<5;$i++)
                        <option value="{{$i}}" @if(@$json->number_of_fetuses==$i) selected @endif>{{$i}}</option>
                        @endfor
                    </select>
                </div>
            </div>
            <div class="row mt-3">
                <div class="col-12"><b><u>Dating</u></b></div>
                <div class="col-12">
                    <table class="table table-bordered table-p-0 bg-light dating-table">
                        <tr>
                            <td class="pl-2" colspan="2">Method of dating</td>
                            <td class="pl-2">Date</td>
                            <td colspan="5" class="pl-2">Details</td>
                            <td class="text-center">Gest age</td>
                            <td class="text-center">EGD</td>
                        </tr>
                        <tr>
                            <td class="bg-white" colspan="2">&nbsp;
                                <input class="form-check-input" type="radio" name="flexRadioDefault" id="flexRadioDefault1">
                                <label class="form-check-label" for="flexRadioDefault1">
                                    LMP
                                </label>
                            </td>
                            <td>
                                <input type="date" name="" id="" class="form-control form-control-sm">
                            </td>
                            <td class="text-right">
                                Cycle&nbsp;
                            </td>
                            <td>
                                <input type="text" name="" id="" class="form-control form-control-sm">
                            </td>
                            <td class="text-right">
                                Cycle length&nbsp;
                            </td>
                            <td>
                                <input type="number" name="" id="" class="form-control form-control-sm">
                            </td>
                            <td class="text-center">d</td>
                            <td>
                                <input type="text" name="" id="" class="form-control form-control-sm">
                            </td>
                            <td>
                                <input type="date" name="" id="" class="form-control form-control-sm">
                            </td>
                            <td></td>
                        </tr>
                        <tr>
                            <td class="bg-white" colspan="2">&nbsp;
                                <input class="form-check-input" type="radio" name="flexRadioDefault" id="flexRadioDefault1">
                                <label class="form-check-label" for="flexRadioDefault1">
                                    Stated EGD
                                </label>
                            </td>
                            <td>
                                <input type="date" name="" id="" class="form-control form-control-sm">
                            </td>
                            <td colspan="5">
                                <input type="number" name="" id="" class="form-control form-control-sm">
                            </td>
                            <td>
                                <input type="text" name="" id="" class="form-control form-control-sm">
                            </td>
                            <td>
                                <input type="date" name="" id="" class="form-control form-control-sm">
                            </td>
                            <td></td>
                        </tr>
                        <tr>
                            <td class="bg-white">&nbsp;
                                    <input class="form-check-input" type="radio" name="flexRadioDefault" id="flexRadioDefault1">
                                    <label class="form-check-label" for="flexRadioDefault1">
                                        U/S
                                    </label>
                            </td>
                            <td></td>
                            <td>
                                <input type="date" name="" id="" class="form-control form-control-sm">
                            </td>
                            <td class="text-right">
                                based upon&nbsp;
                            </td>
                            <td>
                                <input type="text" name="" id="" class="form-control form-control-sm">
                            </td>
                            <td colspan="3"></td>
                            <td>
                                <input type="text" name="" id="" class="form-control form-control-sm">
                            </td>
                            <td>
                                <input type="date" name="" id="" class="form-control form-control-sm">
                            </td>
                            <td></td>
                        </tr>
                        <tr class="border-0 bg-white">
                            <td colspan="11" class="border-0">&nbsp;</td>
                        </tr>
                        <tr>
                            <td colspan="2" class="text-right">Assigned dating&nbsp;</td>
                            <td colspan="7"><input type="text" name="" id="" class="form-control form-control-sm"></td>
                            <td>
                                <input type="date" name="" id="" class="form-control form-control-sm">
                            </td>
                            <td></td>
                        </tr>
                    </table>
                </div>
            </div>
            <div class="row mt-3">
                <div class="col-lg-12"><b>General Evaluation</b></div>
            </div>
            <div class="row">
                <div class="col-1"></div>
                <div class="col-1 text-right p-0">Cardiac activity</div>
                <div class="col-4"><select name="cardiac_activity" id="cardiac_activity" class="form-control form-control-sm save-json"><option value=""></option></select></div>
                <div class="col"></div>
                <div class="col-1 text-right p-0">Fetal movements</div>
                <div class="col-4"><select name="fetal_movements" id="fetal_movements" class="form-control form-control-sm save-json"><option value=""></option></select></div>
            </div>
            <div class="row mt-1">
                <div class="col-1"></div>
                <div class="col-1 text-right p-0">FHR</div>
                <div class="col-1"><input type="text" name="fhr" id="fhr" class="form-control form-control-sm save-json {{data_check_bg(@$json->fhr)}}" value="{{@$json->fhr}}"></div>
                <div class="col p-0">bpm</div>
                <div class="col-1 text-right p-0">Presentation</div>
                <div class="col-4"><select name="presentation" id="presentation" class="form-control form-control-sm save-json"><option value=""></option></select></div>
            </div>
            <div class="row mt-1">
                <div class="col-1"></div>
                <div class="col-1 text-right p-0"><a href="javascript:;"><u>Placenta</u></a></div>
                <div class="col"><input type="text" name="placenta" id="placenta" class="form-control form-control-sm save-json {{data_check_bg(@$json->placenta)}}" value="{{@$json->placenta}}"></div>
            </div>
            <div class="row mt-1">
                <div class="col-1"></div>
                <div class="col-1 text-right p-0"><a href="javascript:;"><u>Umbilical Cord</u></a></div>
                <div class="col"><input type="text" name="umbilical_cord" id="umbilical_cord" class="form-control form-control-sm save-json {{data_check_bg(@$json->umbilical_cord)}}" value="{{@$json->umbilical_cord}}"></div>
            </div>
            <div class="row mt-1">
                <div class="col-1"></div>
                <div class="col-1 text-right p-0"><a href="javascript:;"><u>Amniotic Fluid</u></a></div>
                <div class="col"><input type="text" name="amniotic_fluid" id="amniotic_fluid" class="form-control form-control-sm save-json {{data_check_bg(@$json->amniotic_fluid)}}" value="{{@$json->amniotic_fluid}}"></div>
            </div>
            <div class="row mt-3">
                <div class="col-lg-12"><b>Non Stress Test</b></div>
            </div>
            <div class="row">
                <div class="col-1"></div>
                <div class="col-1 text-right p-0 text-nowrap">NST interpretation</div>
                <div class="col-1"><select name="nst_interpretation_01" id="nst_interpretation_01" class="form-control form-control-sm save-json"></select></div>
                <div class="col-3"><select name="nst_interpretation_02" id="nst_interpretation_02" class="form-control form-control-sm save-json"></select></div>
                <div class="col"></div>
                <div class="col-1 text-right p-0 text-nowrap">Accelerations</div>
                <div class="col-1"><select name="accelerations01" id="accelerations01" class="form-control form-control-sm save-json"><option value=""></option></select></div>
                <div class="col-3"><select name="accelerations02" id="accelerations02" class="form-control form-control-sm save-json"><option value=""></option></select></div>
            </div>
            <div class="row mt-1">
                <div class="col-1"></div>
                <div class="col-1 text-right p-0 text-nowrap">Test duration</div>
                <div class="col-1"><input type="text" name="test_duration" id="test_duration" class="form-control form-control-sm save-json {{data_check_bg(@$json->test_duration)}}" value="{{@$json->test_duration}}"></div>
                <div class="col p-0">min</div>
                <div class="col-1 text-right p-0 text-nowrap">Decelerations</div>
                <div class="col-4"><select name="decelerations" id="decelerations" class="form-control form-control-sm save-json"><option value=""></option></select></div>
            </div>
            <div class="row mt-1">
                <div class="col-1"></div>
                <div class="col-1 text-right p-0 text-nowrap">Baseline FHR</div>
                <div class="col-1"><input type="text" name="baseline_fhr" id="baseline_fhr" class="form-control form-control-sm save-json {{data_check_bg(@$json->baseline_fhr)}}" value="{{@$json->baseline_fhr}}"></div>
                <div class="col p-0">bpm</div>
                <div class="col-1 text-right p-0 text-nowrap">Uterine activity</div>
                <div class="col-4"><select name="uterine_activity" id="uterine_activity" class="form-control form-control-sm save-json"><option value=""></option></select></div>
            </div>
            <div class="row mt-1">
                <div class="col-1"></div>
                <div class="col-1 text-right p-0 text-nowrap">Acoustic stimulation</div>
                <div class="col-2">
                    <input class="form-check-input save-json" type="radio" name="acoustic_stimulation" id="acoustic_stimulation_yes" value="yes" @if(@$json->acoustic_stimulation=='yes') checked @endif>
                    <label class="form-check-label" for="acoustic_stimulation_yes">
                        yes
                    </label>
                </div>
                <div class="col-2">
                    <input class="form-check-input save-json" type="radio" name="acoustic_stimulation" id="acoustic_stimulation_no" value="no" @if(@$json->acoustic_stimulation=='no') checked @endif>
                    <label class="form-check-label" for="acoustic_stimulation_no">
                        no
                    </label>
                </div>
            </div>
            <div class="row mt-1">
                <div class="col-1"></div>
                <div class="col-1 text-right p-0">Other</div>
                <div class="col"><input type="text" name="acoustic_stimulation_other" id="acoustic_stimulation_other" class="form-control form-control-sm save-json {{data_check_bg(@$json->acoustic_stimulation_other)}}" value="{{@$json->acoustic_stimulation_other}}"></div>
            </div>
            <div class="row mt-3">
                <div class="col-lg-12"><b>Biophysical Profile</b></div>
            </div>
            <div class="row mt-1">
                <div class="col-1"></div>
                <div class="col-1 text-right p-0 text-nowrap">Breating movements</div>
                <div class="col-4"><select name="breating_movements" id="breating_movements" class="form-control form-control-sm save-json"></select></div>
                <div class="col"></div>
                <div class="col-1 text-right p-0 text-nowrap">NST</div>
                <div class="col-4"><select name="nst" id="nst" class="form-control form-control-sm save-json"></select></div>
            </div>
            <div class="row mt-1">
                <div class="col-1"></div>
                <div class="col-1 text-right p-0 text-nowrap">Body movements</div>
                <div class="col-4"><select name="body_movements" id="body_movements" class="form-control form-control-sm save-json"></select></div>
                <div class="col"></div>
            </div>
            <div class="row mt-1">
                <div class="col-1"></div>
                <div class="col-1 text-right p-0 text-nowrap">Fetal tone</div>
                <div class="col-4"><select name="fetal_tone" id="fetal_tone" class="form-control form-control-sm save-json"></select></div>
                <div class="col"></div>
                <div class="col-1 text-right p-0 text-nowrap">Total score</div>
                <div class="col-4"><select name="total_score" id="total_score" class="form-control form-control-sm save-json"></select></div>
            </div>
            <div class="row mt-1">
                <div class="col-1"></div>
                <div class="col-1 text-right p-0 text-nowrap">AF volume</div>
                <div class="col-4"><select name="af_volume" id="af_volume" class="form-control form-control-sm save-json"></select></div>
                <div class="col"></div>
                <div class="col-1 text-right p-0 text-nowrap">Interpretation</div>
                <div class="col-4"><select name="interpretation" id="interpretation" class="form-control form-control-sm save-json"></select></div>
            </div>
            <div class="row mt-1">
                <div class="col-1"></div>
                <div class="col-1 text-right p-0">Other</div>
                <div class="col"><input type="text" name="interpretation_other" id="interpretation_other" class="form-control form-control-sm save-json {{data_check_bg(@$json->interpretation_other)}}" value="{{@$json->interpretation_other}}"></div>
            </div>
            <div class="row align-items-start">
                <div class="col-lg-6 p-0">
                    <div class="row mt-3"><div class="col-lg-12"><b><u>Fetal Biometry</u></b></div></div>
                    <div class="row">
                        <div class="col-12">
                            <table class="table table-borderless bg-light fetal-biometry">
                                <tr>
                                    <td>BPD</td>
                                    <td class="text-right">94.3</td>
                                    <td>mm</td>
                                    <td>40w 3d</td>
                                    <td>99%</td>
                                    <td>Thai Siriraj selection</td>
                                </tr>
                                <tr>
                                    <td>HC</td>
                                    <td class="text-right">331.1</td>
                                    <td>mm</td>
                                    <td>40w 6d</td>
                                    <td>94%</td>
                                    <td>Thai Siriraj selection</td>
                                </tr>
                                <tr>
                                    <td>AC</td>
                                    <td class="text-right">354.7</td>
                                    <td>mm</td>
                                    <td>39w 6d</td>
                                    <td>97%</td>
                                    <td>Thai Siriraj selection</td>
                                </tr>
                                <tr>
                                    <td>femur</td>
                                    <td class="text-right">64.9</td>
                                    <td>mm</td>
                                    <td>36w 3d</td>
                                    <td>18%</td>
                                    <td>Thai Siriraj selection</td>
                                </tr>
                            </table>
                        </div>
                    </div>
                    <div class="row mt-1"><div class="col-lg-12"><b><u>Fetal Weight Calculation:</u></b></div></div>
                    <div class="row">
                        <div class="col-12">
                            <table class="table table-borderless bg-light fetal-biometry">
                                <tr>
                                    <td>EFW</td>
                                    <td class="text-right">3.312</td>
                                    <td>g</td>
                                    <td>38w 3 d</td>
                                    <td>52%</td>
                                    <td>Hadlock</td>
                                </tr>
                                <tr>
                                    <td>EFW (lb,oz)</td>
                                    <td class="text-right">7lb 5</td>
                                    <td>oz</td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                </tr>
                                <tr>
                                    <td>EFW by</td>
                                    <td class="text-right">Hadlock(BPD-HC-AC-FL)</td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                </tr>
                            </table>
                        </div>
                    </div>
                    <div class="row mt-1">
                        <div class="col-1"></div>
                        <div class="col-1 text-right p-0">Other</div>
                        <div class="col"><input type="text" name="fetal_weight_calculation_other" id="fetal_weight_calculation_other" class="form-control form-control-sm save-json {{data_check_bg(@$json->fetal_weight_calculation_other)}}" value="{{@$json->fetal_weight_calculation_other}}"></div>
                    </div>
                    <div class="row mt-1"><div class="col-lg-12"><b><u>Fetal Doppler</u></b></div></div>
                    <div class="row">
                        <div class="col-12">
                            <table class="table table-borderless bg-light fetal-biometry">
                                <tr class="border-bottom">
                                    <td colspan="6">Umbilical Artery</td>
                                </tr>
                                <tr>
                                    <td>PI</td>
                                    <td class="text-right">0.76</td>
                                    <td></td>
                                    <td></td>
                                    <td>46%</td>
                                    <td>Acharya</td>
                                </tr>
                                <tr>
                                    <td>RI</td>
                                    <td class="text-right">0.53</td>
                                    <td></td>
                                    <td></td>
                                    <td>41%</td>
                                    <td>Acharya</td>
                                </tr>
                                <tr>
                                    <td>PS</td>
                                    <td class="text-right">34.65</td>
                                    <td>cm/s</td>
                                    <td></td>
                                    <td>4%</td>
                                    <td>Ebbing</td>
                                </tr>
                                <tr>
                                    <td>ED</td>
                                    <td class="text-right">16.23</td>
                                    <td>cm/s</td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                </tr>
                                <tr>
                                    <td>TAmax</td>
                                    <td class="text-right">24.15</td>
                                    <td>cm/s</td>
                                    <td></td>
                                    <td>5%</td>
                                    <td>Ebbing</td>
                                </tr>
                                <tr>
                                    <td>MD</td>
                                    <td class="text-right">13.29</td>
                                    <td>cm/s</td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                </tr>
                                <tr>
                                    <td>S / D</td>
                                    <td class="text-right">2.13</td>
                                    <td></td>
                                    <td></td>
                                    <td>38%</td>
                                    <td>Acharya</td>
                                </tr>
                                <tr>
                                    <td>HR</td>
                                    <td class="text-right">129</td>
                                    <td>bpm</td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                </tr>
                                <tr><td colspan="6">&nbsp;</td></tr>
                                <tr class="border-bottom">
                                    <td colspan="6">Umbilical Artery :</td>
                                </tr>
                                <tr>
                                    <td>PI</td>
                                    <td class="text-right">0.76</td>
                                    <td></td>
                                    <td></td>
                                    <td>46%</td>
                                    <td>Acharya</td>
                                </tr>
                                <tr>
                                    <td>RI</td>
                                    <td class="text-right">0.53</td>
                                    <td></td>
                                    <td></td>
                                    <td>41%</td>
                                    <td>Acharya</td>
                                </tr>
                                <tr>
                                    <td>PS</td>
                                    <td class="text-right">34.65</td>
                                    <td>cm/s</td>
                                    <td></td>
                                    <td>4%</td>
                                    <td>Ebbing</td>
                                </tr>
                                <tr>
                                    <td>ED</td>
                                    <td class="text-right">16.23</td>
                                    <td>cm/s</td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                </tr>
                                <tr>
                                    <td>TAmax</td>
                                    <td class="text-right">24.15</td>
                                    <td>cm/s</td>
                                    <td></td>
                                    <td>5%</td>
                                    <td>Ebbing</td>
                                </tr>
                                <tr>
                                    <td>MD</td>
                                    <td class="text-right">13.29</td>
                                    <td>cm/s</td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                </tr>
                                <tr>
                                    <td>S / D</td>
                                    <td class="text-right">2.13</td>
                                    <td></td>
                                    <td></td>
                                    <td>38%</td>
                                    <td>Acharya</td>
                                </tr>
                                <tr>
                                    <td>HR</td>
                                    <td class="text-right">129</td>
                                    <td>bpm</td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                </tr>
                                <tr><td colspan="6">&nbsp;</td></tr>
                                <tr class="border-bottom">
                                    <td colspan="6">Right Mid Cerebral Artery :</td>
                                </tr>
                                <tr>
                                    <td>PI</td>
                                    <td class="text-right">1.09</td>
                                    <td></td>
                                    <td></td>
                                    <td>2%</td>
                                    <td>Ebbing</td>
                                </tr>
                                <tr>
                                    <td>RI</td>
                                    <td class="text-right">0.67</td>
                                    <td></td>
                                    <td></td>
                                    <td>35%</td>
                                    <td><u>Bahlmann</u></td>
                                </tr>
                                <tr>
                                    <td>PS</td>
                                    <td class="text-right">80.12</td>
                                    <td>cm/s</td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                </tr>
                                <tr>
                                    <td>ED</td>
                                    <td class="text-right">26.47</td>
                                    <td>cm/s</td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                </tr>
                                <tr>
                                    <td>TAmax</td>
                                    <td class="text-right">49.24</td>
                                    <td>cm/s</td>
                                    <td></td>
                                    <td>+3.1SD</td>
                                    <td>Ebbing</td>
                                </tr>
                                <tr>
                                    <td>MD</td>
                                    <td class="text-right">22.39</td>
                                    <td>cm/s</td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                </tr>
                                <tr>
                                    <td>S / D</td>
                                    <td class="text-right">3.03</td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                </tr>
                                <tr>
                                    <td>HR</td>
                                    <td class="text-right">131</td>
                                    <td>bpm</td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                </tr>
                            </table>
                        </div>
                    </div>
                </div>
                <div class="col-lg p-0 card-graph">
                    <ul class="row mt-3 m-0">
                        @for ($i=0;$i<count($chart);$i++)

                        <li class="col-4">
                            <input type="checkbox" id="myCheckbox{{$i}}" name="charts[]" value="{{$chart[$i]}}" class="ck-json"
                                @if(isset($charts[$i]))
                                    @if(in_array($chart[$i],$charts))
                                        checked
                                    @endif
                                @endif
                            />
                            <label for="myCheckbox{{$i}}">
                                <img src="{{url('')}}/public/images/chart/{{$chart[$i]}}.jpg" class="img-fluid">
                            </label>
                        </li>
                        @endfor
                    </ul>
                </div>
            </div>


            <div class="row mt-1">
                <div class="col-1"></div>
                <div class="col-1 text-right p-0">Impression</div>
                <div class="col"><input type="text" name="impression" id="impression" class="form-control form-control-sm save-json {{data_check_bg(@$json->impression)}}" value="{{@$json->impression}}"></div>
            </div>
            <div class="row mt-1">
                <div class="col-1"></div>
                <div class="col-1 text-right p-0">Other</div>
                <div class="col"><input type="text" name="impression_other" id="impression_other" class="form-control form-control-sm save-json {{data_check_bg(@$json->impression_other)}}" value="{{@$json->impression_other}}"></div>
            </div>
            <div class="row mt-3">
                <div class="col-lg-12"><b><u>Maternal Doppler</u></b></div>
                <div class="col-lg-12">
                    <input type="text" name="maternal_doppler" id="maternal_doppler" class="form-control form-control-sm bg-light save-json {{data_check_bg(@$json->maternal_doppler)}}" value="{{@$json->maternal_doppler}}">
                </div>
            </div>
            <div class="row mt-1">
                <div class="col-1"></div>
                <div class="col-1 text-right p-0">Impression</div>
                <div class="col"><input type="text" name="maternal_impression" id="maternal_impression" class="form-control form-control-sm save-json {{data_check_bg(@$json->maternal_impression)}}" value="{{@$json->maternal_impression}}"></div>
            </div>
            <div class="row mt-1">
                <div class="col-1"></div>
                <div class="col-1 text-right p-0">Other</div>
                <div class="col"><input type="text" name="maternal_other" id="maternal_other" class="form-control form-control-sm save-json {{data_check_bg(@$json->maternal_other)}}" value="{{@$json->maternal_other}}"></div>
            </div>
            <div class="row mt-3">
                <div class="col-lg-12"><b>Comment</b></div>
                <div class="col-lg-12">
                    <input type="text" name="maternal_comment" id="maternal_comment" class="form-control form-control-sm save-json {{data_check_bg(@$json->maternal_comment)}}" value="{{@$json->maternal_comment}}">
                </div>
            </div>
            <div class="row mt-3">
                <div class="col-lg-12"><b>Impression</b></div>
                <div class="col-lg-12">
                    <textarea name="textarea_impression" id="textarea_impression" rows="3" class="form-control form-control-sm save-json {{data_check_bg(@$json->textarea_impression)}}">{{@$json->textarea_impression}}</textarea>
                </div>
            </div>
            <div class="row mt-3">
                <div class="col-lg-12"><b>Follow-up</b></div>
                <div class="col-lg-12">
                    <input type="text" name="follow_up" id="follow_up" class="form-control form-control-sm save-json {{data_check_bg(@$json->follow_up)}}" value="{{@$json->follow_up}}">
                </div>
            </div>
            <div class="row mt-3">
                <div class="col"></div>
                <div class="col-auto"><a href="{{url('reportendocapture')}}/{{@$case->case_id}}" class="btn btn-primary">Report</a></div>
            </div>

        </div>
    </div>
    <div class="mb-5 pb-5"></div>
</div> --}}
<div class="row m-0 alt">
    <div class="col-3">
        <div class="card">
            <div class="card-body">
                <div class="row m-0">
                    <div class="col-6"><b class="h4">PID : 1525352</b></div>
                    <div class="col-6">
                        <b>Suratchanut Chitrat</b><br/>
                        <label class="lead">24 Sep,1993 (29) / M</label>
                    </div>
                </div>
            </div>
        </div>
        <div class="card mt-2">
            <div class="card-body">
                <div class="row m-0">
                    <div class="col p-2">
                        <b class="h4">Study Detail</b>
                    </div>
                    <div class="col-auto"><a href="{{url('registration')}}/1" class="btn btn-soft-primary waves-effect waves-light btn-sm"><i class="las la-edit"></i> Edit</a></div>
                </div>
                <table class="table table-borderless">
                    <tr>
                        <th>Date/Time :</th>
                        <td>19/09/2022 9:00</td>
                    </tr>
                    <tr>
                        <th>Modality :</th>
                        <td>US</td>
                    </tr>
                    <tr>
                        <th>Procedure :</th>
                        <td>OB/GYNE</td>
                    </tr>
                </table>
            </div>
        </div>
    </div>
    <div class="col">
        <div class="card">
            <div class="card-header align-items-center d-flex plb">
                <div class="flex-shrink-0 ms-2">
                    <ul class="nav justify-content-end nav-tabs-custom rounded card-header-tabs border-bottom-0" role="tablist">
                        <li class="nav-item">
                            <a class="nav-link" data-bs-toggle="tab" href="#home2" role="tab">
                                Medical History
                            </a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link active" data-bs-toggle="tab" href="#procedure_report" role="tab">
                                Procedure Report
                            </a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" data-bs-toggle="tab" href="#messages2" role="tab">
                                Picture/Graph
                            </a>
                        </li>
                    </ul>
                </div>
                <div class="flex-grow-1 oveflow-hidden text-end">
                    <a class="btn btn-primary" href="{{url('reportendocapture')}}/{{@$case->case_id}}">Generate Report</a>
                </div>

            </div>
            <div class="card-body">
                <!-- Tab panes -->
                <div class="tab-content text-muted">
                    <div class="tab-pane" id="home2" role="tabpanel">
                        A
                    </div>
                    <div class="tab-pane active" id="procedure_report" role="tabpanel">
                        @component('Terra.case.report.growth_scan',$component)@endcomponent
                    </div>
                    <div class="tab-pane" id="messages2" role="tabpanel">
                        C
                    </div>
                </div>
            </div><!-- end card-body -->
        </div><!-- end card -->
    </div>
</div>

@endsection






@section('lpage')
Case
@endsection
@section('rpage')
Cases
@endsection
@section('rppage')
Create
@endsection


@section('script')
{{-- @dd($case) --}}
<script src="{{url('')}}/public/assets5/libs/prismjs/prism.js"></script>
<script src="{{asset('public/js/jquery.min.js')}}"></script>
<script>
    $.ajaxSetup({headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')}});
    $(".ck-json").click(function(){
        var ch_size =  $(".ck-json").length
        var ck_array = [];
        var x = 0;
        for(i=0;i<ch_size;i++){
            if($($(".ck-json")[i]).is(':checked')){
                ck_array[x] = $($(".ck-json")[i]).val()
                x++;
            }
        }
        var json_ck = JSON.stringify(ck_array)
        // console.log(json_ck);
        save_json('charts',json_ck)
    })

    $(".save-json").on('change',function(){
        var name = $(this).attr('name')
        var val  = $(this).val()
        if($(this).attr('type')=='checkbox'){
            if($(this).is(':checked')){
                val = 'true';
            }else{
                val = 'false';
            }
        }
        // alert(name+' = '+val)
        save_json(name,val)
    })



    function save_json(name,value){
        $.post('{{url('photomove')}}',{
            event       : 'savejson',
            name        : name,
            value       : value,
            table       : 'tb_case',
            field       : 'case_json',
            id          : "{{@$case->case_id}}",
            comcreate   : "{{@$case->comcreate}}",
            procedure   : "{{@$case->case_procedure}}",
        },function(data,status){});
    }

    $(".form-control").on('keyup change',function(){
        if($(this).val().length>0){
            $(this).addClass('bg-soft-info')
        }else{
            $(this).removeClass('bg-soft-info')
        }
    })
</script>
@endsection