<style type="text/css">
    .panel.panel-default.panel-body{
        margin-top: 20px;
    }







    #patient_dose_taken_phase1_table{
        border: 1px solid #dddddd;
    }
    #patient_dose_taken_phase1_table > thead > tr > th,
    #patient_dose_taken_phase1_table > tbody > tr > th,
    #patient_dose_taken_phase1_table > tfoot > tr > th,
    #patient_dose_taken_phase1_table > thead > tr > td,
    #patient_dose_taken_phase1_table > tbody > tr > td,
    #patient_dose_taken_phase1_table > tfoot > tr > td {
        border: 1px solid #dddddd;

    }
    #patient_dose_taken_phase1_table{
        display:inline-block;
        width: 100%;
        overflow-x: scroll;
    }
    .datepicker{
        margin-left:174px;
    }








</style>



<div class="panel panel-success">

    <div class="panel-heading">
        <div class="row">
            <div class="col-lg-4 col-lg-offset-4">
                <h3 class="text-success text-center">Child Immunization List</h3>
            </div>
        </div>
    </div>

    <div class="panel-body" style="margin-top: -14px">
        <table class="table tatable-bordered table-hover tableborder" id="patient_dose_taken_phase1_table">
            <thead>         
                <tr >
                    <th class="text-center" rowspan="2">H.No.</th> 
                    <th class="text-center" rowspan="2">Mother&nbsp;Name</th>
                    <th class="text-center" rowspan="2">Child&nbsp;Name</th>
                    <th class="text-center" rowspan="2">Date&nbsp;Of&nbsp;Birth</th>
                    <th class="text-center" colspan="<?= count($vaccine_list) ?>">Vaccine&nbsp;Code</th>
                </tr>
                <tr>
                    <?php
                    for ($i = 0; $i < count($vaccine_list); $i++) {
                        ?>
                        <th class="text-center"><?= str_replace(' ', '&nbsp;', str_replace('-', '&nbsp;', $vaccine_list[$i]['vaccine_name'])); ?></th>
                    <?php } ?>


                </tr>
            </thead>
            <tbody>
                <?php
                if (isset($child_list) and $child_list) {
                    for ($i = 0; $i < count($child_list); $i++) {
                        ?>
                        <tr>

                            <td class="text-center"><?= $child_list[$i]['house_number'] ?></td>

                            <td class="text-center"><?= str_replace(' ', '&nbsp', $child_list[$i]['name']) ?></td>

                            <td class="text-center"><?= str_replace(' ', '&nbsp', $child_list[$i]['child_name']) ?></td>  

                            <td class="text-center"><?= str_replace(' ', '&nbsp', date('d-m-Y', strtotime($child_list[$i]['dob']))); ?></td> 
                            <?php
                            for ($j = 0; $j < count($child_list[$i]['vaccine_list']); $j++) {
                                if ($child_list[$i]['vaccine_list'][$j]['status'] == 1) {
                                    ?>
                                    <td class="text-center"><span class="label label-success label-circle"><i class="fa fa-check" aria-hidden="true"></i></span></td> 
                                <?php } elseif ($child_list[$i]['vaccine_list'][$j]['status'] == 0) { ?>
                                    <td class="text-center"><span class="label label-info label-circle"><i class="fa fa-arrow-down" aria-hidden="true"></i></span></td> 
                                <?php } elseif ($child_list[$i]['vaccine_list'][$j]['status'] == 2) { ?>
                                    <td class="text-center"><span class="label label-warning label-circle"><i class="fa fa-clock-o" aria-hidden="true"></i></span></td>              
                                <?php } elseif ($child_list[$i]['vaccine_list'][$j]['status'] == 3) { ?>
                                    <td class="text-center" id="<?= $child_list[$i]['child_id'] . '_' . $child_list[$i]['vaccine_list'][$j]['vaccine_id'] ?>"><p style="margin: 0" data-placement="top" data-toggle="tooltip" title="Missed Dose Update"><button style="margin: 0" type="button" class="btn btn-danger btn-xs missed-update-data" data-title="missedDoseUpdate" data-toggle="modal" data-target="#missedDoseUpdate"  value="<?= $child_list[$i]['child_id'] . '_' . $child_list[$i]['vaccine_list'][$j]['vaccine_id'] ?>"><i class="fa fa-times"></i></button></p></td>
                                    <?php
                                }
                            }
                            ?>

                        </tr>
                    <?php } ?>

                    <?php
                }
                ?>

            </tbody>
        </table>

    </div>
    <div class="panel-footer" style="margin-top: -38px">
        <div class="row">
            <div class="col-lg-6">
                <ul class="pagination pagination-large">
                    <?php
                    if (isset($totalPage) and $totalPage and $totalPage > 1) {
                        for ($i = 0; $i < $totalPage; $i++) {
                            if ($i == 0) {
                                if ($activePage == 1) {
                                    ?>
                                    <li class="disabled"><span>«</span></li>
                                <?php } else { ?>
                                    <li class="page" value="<?= ($activePage - 1) ?>"><a href="<?= base_url('child_report/' . ($activePage - 1)) ?>"><span>«</span></a></li>
                                    <?php
                                }
                            }


                            if (($i + 1) == $activePage) {
                                ?>

                                <li class="active page"><span><?= ($i + 1) ?></span></li>  
                            <?php } else { ?>
                                <li class="page"><a href="<?= base_url('child_report/' . ($i + 1)) ?>"><span><?= ($i + 1) ?></span></a></li>
                                <?php
                            }


                            if (($i + 1) == $totalPage) {
                                if ($totalPage == $activePage) {
                                    ?>
                                    <li class="disabled page"><a href="<?= base_url('child_report/' . ($activePage + 1)) ?>"><span>Next</span></a></li>
                                <?php } else { ?>
                                    <li class="page"><a href="<?= base_url('child_report/' . ($activePage + 1)) ?>"><span>Next</span></a></li>
                                    <?php
                                }
                            }
                        }
                    }
                    ?>
                </ul>

            </div>
            <div class="col-lg-6" style="margin-top: 20px">
                <p class="text-center">
                    <span class="label label-info ">Next Vaccine</span>
                    <span class="label label-warning ">Vaccine Due</span>
                    <span class="label label-success ">Done</span>
                    <span class="label label-danger ">Missed</span>
                </p>
            </div>
        </div>
    </div>
</div>
<div class="modal fade modal-custom-css" id="missedDoseUpdate" tabindex="-1" role="dialog" aria-labelledby="edit" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></button>
                <h4 class="modal-title" id="Heading">Update&nbsp;Missed&nbsp;Dose</h4>
            </div>
            <div class="modal-body">
                <input id="start_date" type="hidden" name="start_date" value="">
                <input id="end_date" type="hidden" name="end_date" value="">

                <input id="child_id_vaccine_id" type="hidden" name="child_id_vaccine_id" value="12-10-2016">
                <div class="row">
                    <div class="col-md-10 col-md-push-1">
                        <div class="form-group">
                            <div class="input-group">
                                <span class="input-group-addon"><i aria-hidden="true"></i>Vaccine&nbsp;Code</span>
                                <input type="text" disabled id="vaccine_code" name="vaccine_code" class="form-control" value="">
                            </div>                    
                        </div> 
                    </div>
                </div>

                <div class="row">
                    <div class="col-md-10 col-md-push-1">
                        <div class="form-group">
                            <div class="input-group date" id="datetimepicker_dose_taken_date" data-date-format="dd-mm-yyyy">
                                <span class="input-group-addon">
                                    <span>Dose&nbsp;Taken&nbsp;Date</span>
                                </span>

                                <input type="text" class="form-control" value="" name="dose_taken_date" id="dose_taken_date" placeholder="dd-mm-yyyy"/>
                                <span class="input-group-addon">
                                    <span class="glyphicon glyphicon-calendar"></span>
                                </span>
                            </div>                   
                        </div> 
                    </div>
                </div>




            </div>
            <div class="modal-footer ">
                <div class="row">
                    <div class="col-md-6 col-md-push-3">
                        <button id="update-missed" type="button" class="btn btn-warning" style="width: 100%;"><span class="glyphicon glyphicon-ok-sign"></span>Update&nbsp;Missed&nbsp;Dose</button>
                    </div>
                    <div class="col-md-1 col-md-push-3 spinner" id="update_missed_spinner" style="display: none;margin-top: 5px">
                        <i class="fa fa-spinner fa-spin"></i>
                    </div>
                </div>
            </div>
        </div>

    </div>

</div>
<script type="text/javascript">
    $(document).ready(function () {
        $('#datetimepicker_dose_taken_date').datepicker({
            changeMonth: true,
            changeYear: true,
            autoclose:true,
            dateFormat: 'dd-mm-yy'
            
        });

        $('.missed-update-data').click(function () {
            var child_id_vaccine_id = $(this).val();
          
            $('#child_id_vaccine_id').val(child_id_vaccine_id);
            $.ajax({
                url: '<?= base_url('vaccine_rule') ?>',
                data: {
                    child_id_vaccine_id: child_id_vaccine_id,
                },
                type: "POST",
                success: function (data, textStatus, jqXHR) {
                    var vaccine_rule_data = JSON.parse(data);
                    if (vaccine_rule_data['status']) {
                        
                        $('#datetimepicker_dose_taken_date').datepicker('setStartDate', vaccine_rule_data['startDate']);
                        $('#datetimepicker_dose_taken_date').datepicker('setEndDate', vaccine_rule_data['endDate']);
                        $('#vaccine_code').val(vaccine_rule_data['vaccine_code']);

                    }
                }
            });

        });


        $('#update-missed').click(function () {
            $('#update_missed_spinner').css('display', 'block');
            var child_id_vaccine_id = $('#child_id_vaccine_id').val();
            var dose_taken_date=$('#dose_taken_date').val();
     
            $.ajax({
                url: '<?= base_url('update-missed-dose') ?>',
                data: {
                    child_id_vaccine_id: child_id_vaccine_id,
                    dose_taken_date:dose_taken_date

                },
                type: "POST",
                success: function (data, textStatus, jqXHR) {

                    $('#update_missed_spinner').css('display', 'none');
                    $('#missedDoseUpdate').modal('hide');

                    var anc_update_data = JSON.parse(data);
                    if (anc_update_data['status']) {

                        $('#' + child_id_vaccine_id).children().remove();
                        $('#' + child_id_vaccine_id).append('<span class="label label-success"><i class="fa fa-check"></i></span>');



                    } else {
                        alert('Update fail!!');
                    }

                }
            });
        });
    });
</script>




