<style type="text/css">


    .panel.panel-default.panel-body{
        margin-top: 20px;
    }


    .label-circle {


    }
    .table-background-odd{
        background-color: #f3e3e0;

    }
    .table-background-even{
        background-color: #f6f0ee  
    }
    .table-background-head{
        background-color: #e8eff4;  
    }




    .spinner{
        margin-top: 8px;
        margin-left: -5px;
        display: none;
    }
    .form_label{
        margin-top: 4px;
    }
    .td_success{
        background-color: green;
    }
    .td_danger{
        background-color: red;
    }
    .td_dots{
        background-color: blue;
    }
    .td_outside{
        background-color: #0099FF;
    }
    .td_remain{
        background-color: #5bc0de;
    }
    .permanent_patient_id{
        cursor: pointer;
    }

    .table-user-information tbody tr td{
        text-align: center;
        color: #269abc;

    }
    .table-user-information{
        margin-top: -12px;

    }


    .table-user-information > tbody > tr {
        border-top: 1px solid rgb(221, 221, 221);
    }

    .table-user-information > tbody > tr:first-child {
        border-top: 0;
    }


    .table-user-information > tbody > tr > td {
        border-top: 0;
    }



    #mira-pregnant-list-view{
        border: 2px solid #dddddd;
    }
    #mira-pregnant-list-view > thead > tr > th,
    #mira-pregnant-list-view > tbody > tr > th,
    #mira-pregnant-list-view > tfoot > tr > th,
    #mira-pregnant-list-view > thead > tr > td,
    #mira-pregnant-list-view > tbody > tr > td,
    #mira-pregnant-list-view > tfoot > tr > td {
        border: 2px solid #dddddd;

    }
    #mira-pregnant-list-view{
        width: 100%;
        overflow-x: scroll;
    }

    .field-coordinator-patient-dose .panel{

    }
    .verticalLine {
        border:solid #ecf2f2;
    }
    .text-setting{
        margin-top: 4px;
    }
</style>
<div class="panel"> 
    <?php $this->load->view('mira_work_details_button') ?>
    <hr style="margin-bottom: 0;margin-top: 0">
    <hr style="margin-bottom: 12px;margin-top: 0">
    <div class="row">
        <div class="col-lg-3"><p class="text-center" data-placement="top" data-toggle="tooltip" title=""><span>Worker&nbsp;Name:&nbsp;<strong><?= $region_detail[0]['user_name'] ?></strong></span></p></div>
        <div class="col-lg-3"><p class="text-center" data-placement="top" data-toggle="tooltip" title=""><span>Region&nbsp;Name:&nbsp;<strong><?= $region_detail[0]['region_name'] ?></strong></span></p></div>
        <div class="col-lg-3"><p class="text-center" data-placement="top" data-toggle="tooltip" title=""><span>Joing&nbsp;Date&nbsp;<strong><?= date('d-m-Y H:i:s', strtotime($region_detail[0]['user_create_date'])) ?></strong></span></p></div>
    </div>

    <hr style="margin-bottom: 0;margin-top: 0">
    <hr style="margin-bottom: 0;margin-top: 0">


    <div class="panel-body">

        <table id="mira-pregnant-list-view" class="table table-bordred table-striped table-hover">
            <thead>

                <tr>
                    <th class="text-center">#</th>
                    <th class="text-center">Pregnant&nbsp;ID</th>
                    <th class="text-center">House&nbsp;No.</th>
                    <th class="text-center">Women&nbsp;Name</th>
                    <th class="text-center">Week</th>
                    <th class="text-center">LPM&nbsp;Date</th>
                    <th class="text-center">Registered&nbsp;Date</th>
                    <th class="text-center">Pregnancy&nbsp;Status</th>
                    <th class="text-center">ANC1</th>
                    <th class="text-center">ANC2</th>
                    <th class="text-center">ANC3</th>
                    <th class="text-center">ANC4</th>
                    <th class="text-center">Outcome</th>
                    <th class="text-center">Edit</th>
                </tr>
            </thead>
            <tbody>
                <?php
                if (isset($pregnantList) and $pregnantList) {
                    for ($i = 0; $i < count($pregnantList); $i++) {
                        ?>
                        <tr id="<?= 'tr' . $pregnantList[$i]['pregnant_id'] ?>">
                            <td class="text-center"><?= ($i + 1) ?></td>
                            <td class="text-center"><?= "PR" . $pregnantList[$i]['pregnant_id'] ?></td>
                            <td class="text-center"><?= $pregnantList[$i]['house_number'] ?></td>
                            <td class="text-center"><?= str_replace(' ', '&nbsp;', $pregnantList[$i]['name']) ?></td>
                            <?php
                            if ($pregnantList[$i]['delivery_status'] == -999) {
                                $day = floor((time() - strtotime($pregnantList[$i]['pregnant_date'])) / (60 * 60 * 24));
                            } else {
                                $day = floor((strtotime($pregnantList[$i]['closing_date']) - strtotime($pregnantList[$i]['pregnant_date'])) / (60 * 60 * 24));
                            }


                            if ($day % 7 == 0) {
                                $num_week = (int) ($day / 7);
                            } else {
                                $num_week = (int) ($day / 7) + 1;
                            }
                            ?>

                            <td class="text-center"><?= $num_week ?></td>
                            <td class="text-center"><?= date('d-m-Y', strtotime($pregnantList[$i]['pregnant_date'])); ?></td>
                            <td class="text-center"><?= date('d-m-Y', strtotime($pregnantList[$i]['registration_date'])); ?></td>
                            <?php if ($pregnantList[$i]['delivery_status'] == -999) { ?>
                                <td class="text-center"><span id="<?= 'td' . $pregnantList[$i]['pregnant_id'] ?>" class="label label-default">Running...</span></td>
                            <?php } elseif ($pregnantList[$i]['delivery_status'] == 1) {
                                ?>
                                <td class="text-center"><span id="<?= 'td' . $pregnantList[$i]['pregnant_id'] ?>" class="label label-success">Delivered</span></td>
                            <?php } elseif ($pregnantList[$i]['delivery_status'] == 2) { ?>
                                <td class="text-center"><span id="<?= 'td' . $pregnantList[$i]['pregnant_id'] ?>" class="label label-primary">Aborted</span></td>
                            <?php } elseif ($pregnantList[$i]['delivery_status'] == 3) { ?>
                                <td class="text-center"><span id="<?= 'td' . $pregnantList[$i]['pregnant_id'] ?>" class="label label-warning">Migrated</span></td>
                            <?php } elseif ($pregnantList[$i]['delivery_status'] == 4) { ?>
                                <td class="text-center"><span id="<?= 'td' . $pregnantList[$i]['pregnant_id'] ?>" class="label label-danger">Died</span></td>
                            <?php } elseif ($pregnantList[$i]['delivery_status'] == 5) { ?>
                                <td class="text-center"><span id="<?= 'td' . $pregnantList[$i]['pregnant_id'] ?>" class="label label-info">Other</span></td>
                            <?php }
                            ?>




                            <?php if ($pregnantList[$i]['anc_data']['anc1'] == 0) { ?>
                                <td class="text-center"><span class="label label-danger"><i class="fa fa-times"></i></span></td>
                            <?php } else if ($pregnantList[$i]['anc_data']['anc1'] == 1) { ?>
                                <td class="text-center"><span class="label label-success"><i class="fa fa-check"></i></span></td>
                            <?php } elseif ($pregnantList[$i]['anc_data']['anc1'] == 2) { ?>
                                <td class="text-center"><span class="label label-warning"><i class="fa fa-arrow-down"></i></span></td>
                            <?php } else if ($pregnantList[$i]['anc_data']['anc1'] == 3) { ?>
                                <td class="text-center"><span class="label label-info">--</span></td>
                            <?php }
                            ?>   


                            <?php if ($pregnantList[$i]['anc_data']['anc2'] == 0) { ?>
                                <td class="text-center"><span class="label label-danger"><i class="fa fa-times"></i></span></td>
                            <?php } else if ($pregnantList[$i]['anc_data']['anc2'] == 1) { ?>
                                <td class="text-center"><span class="label label-success"><i class="fa fa-check"></i></span></td>
                            <?php } elseif ($pregnantList[$i]['anc_data']['anc2'] == 2) { ?>
                                <td class="text-center"><span class="label label-warning"><i class="fa fa-arrow-down"></i></span></td>
                            <?php } else if ($pregnantList[$i]['anc_data']['anc2'] == 3) { ?>
                                <td class="text-center"><span class="label label-info">--</span></td>
                            <?php }
                            ?>


                            <?php if ($pregnantList[$i]['anc_data']['anc3'] == 0) { ?>
                                <td class="text-center"><span class="label label-danger"><i class="fa fa-times"></i></span></td>
                            <?php } else if ($pregnantList[$i]['anc_data']['anc3'] == 1) { ?>
                                <td class="text-center"><span class="label label-success"><i class="fa fa-check"></i></span></td>
                            <?php } elseif ($pregnantList[$i]['anc_data']['anc3'] == 2) { ?>
                                <td class="text-center"><span class="label label-warning"><i class="fa fa-arrow-down"></i></span></td>
                            <?php } else if ($pregnantList[$i]['anc_data']['anc3'] == 3) { ?>
                                <td class="text-center"><span class="label label-info">--</span></td>
                            <?php }
                            ?>



                            <?php if ($pregnantList[$i]['anc_data']['anc4'] == 0) { ?>
                                <td class="text-center"><span class="label label-danger"><i class="fa fa-times"></i></span></td>
                            <?php } else if ($pregnantList[$i]['anc_data']['anc4'] == 1) { ?>
                                <td class="text-center"><span class="label label-success"><i class="fa fa-check"></i></span></td>
                            <?php } elseif ($pregnantList[$i]['anc_data']['anc4'] == 2) { ?>
                                <td class="text-center"><span class="label label-warning"><i class="fa fa-arrow-down"></i></span></td>
                            <?php } else if ($pregnantList[$i]['anc_data']['anc4'] == 3) { ?>
                                <td class="text-center"><span class="label label-info">--</span></td>
                            <?php }
                            ?>

                            <?php if ($pregnantList[$i]['delivery_location'] == 0) { ?>
                                <td class="text-center">Pending..</td>
                            <?php } elseif ($pregnantList[$i]['delivery_location'] == 1) { ?>
                                <td class="text-center">Hospital</td>
                            <?php } else { ?>
                                <td class="text-center">Home</td>
                            <?php } ?>   

                            <td class="text-center"><p style="margin: 0" data-placement="top" data-toggle="tooltip" title="Edit"><button style="margin: 0" type="button" class="btn btn-info btn-xs pregnant-edit-data" data-title="editUser" data-toggle="modal" data-target="#pregnantEdit"  value="<?= $pregnantList[$i]['pregnant_id'] ?>"><span class="glyphicon glyphicon-pencil"></span></button></p></td>
                        </tr>
                        <?php
                    }
                }
                ?>

            </tbody>
        </table>

    </div>
    <div class="panel-footer" style="margin-top: -36px">

        <div class="row">
            <div class="col-lg-6">
                <ul class="pagination pagination-large" id="pagination">
                    <?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"><a href="<?= base_url('mira-work-detail-result/' . ($activePage - 1).'/'.$region_detail[0]['region_code']) ?>"><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('mira-work-detail-result/' . ($i + 1) . '/' .$region_detail[0]['region_code'] ) ?>><span><?= ($i + 1) ?></span></a></li>
                                <?php 
                            }


                            if (($i + 1) == $totalPage) {
                                if ($totalPage == $activePage) {
                                    ?>
                                    <li class="disabled page"><span>Next</span></li>
                                    <?php
                                } else {
                                    
                                        ?>

                                        <li class="page"><a href =<?= base_url('mira-work-detail-result/' . ($activePage + 1) . '/' .$region_detail[0]['region_code'] ) ?>><span>Next</span></a></li>
                                    <?php 
                                }
                            }
                        }
                    }
                    ?>
                </ul>
            </div>

        </div>

    </div>

    <div class="modal fade" id="pregnantEdit" 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">Edit Pregnant LMC Date</h4>
                </div>
                <div class="modal-body">
                    <input id="pregnant_id" type="hidden" name="pregnant_id" value="">
                    <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">Pregnant Current Status</span>
                                    <select name="pregnant_status" id="pregnant_status" class="form-control">
                                        <option value="0" selected="true" disabled=""> Select Status</option>
                                        <option value="-999">Running</option>
                                        <option value="1">Delivered</option>
                                        <option value="2">Aborted</option>
                                        <option value="4">Died</option>
                                        <option value="3">Migrated</option>
                                        <option value="5">Other</option>
                                    </select>
                                </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="datetimepicker2" data-date-format="dd-mm-yyyy">
                                    <span class="input-group-addon">
                                        <span>Please Select LPM Date</span>
                                    </span>

                                    <input type="text" required="true" class="form-control" value="" name="lpm_date" id="lpm_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-pregnant" type="button" class="btn btn-warning" style="width: 100%;"><span class="glyphicon glyphicon-ok-sign"></span> Update</button>
                        </div>
                        <div class="col-md-1 col-md-push-3 spinner" id="pregnant_update_spinner" style="display: none;margin-top: 5px">
                            <i class="fa fa-spinner fa-spin"></i>
                        </div>
                    </div>
                </div>
            </div>

        </div>

    </div>


</div>
<script type="text/javascript">
    $(document).ready(function () {
        $('#datetimepicker2').datepicker({
            format: 'dd-mm-yyyy'

        });
        $('.pregnant-edit-data').click(function () {
            $('#pregnant_id').val($(this).val());
        });
        $('#update-pregnant').click(function () {
            $('#pregnant_update_spinner').css('display', 'block');
            $.ajax({
                url: '<?= base_url('pregnant_list_update') ?>',
                data: {
                    pregnant_id: $('#pregnant_id').val(),
                    lpm_date: $('#lpm_date').val(),
                    pregnant_status: $('#pregnant_status').val()

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

                    $('#pregnant_update_spinner').css('display', 'none');
                    $('#pregnantEdit').modal('hide');

                    var pregnant_women_data = JSON.parse(data);
                    if (pregnant_women_data['status']) {
                        if ($('#pregnant_status').val() == '-999') {
                            $('#tr' + $('#pregnant_id').val()).remove();
                        } else {
                            if (parseInt($('#pregnant_status').val()) == 1) {
                                $('#td' + $('#pregnant_id').val()).addClass('label-success');
                                $('#td' + $('#pregnant_id').val()).text('Delivered');
                            } else if (parseInt($('#pregnant_status').val()) == 2) {
                                $('#td' + $('#pregnant_id').val()).addClass('label-primary');
                                $('#td' + $('#pregnant_id').val()).text('Aborted');
                            } else if (parseInt($('#pregnant_status').val()) == 3) {
                                $('#td' + $('#pregnant_id').val()).addClass('label-warning');
                                $('#td' + $('#pregnant_id').val()).text('Migrated');
                            } else if (parseInt($('#pregnant_status').val()) == 4) {
                                $('#td' + $('#pregnant_id').val()).addClass('label-danger');
                                $('#td' + $('#pregnant_id').val()).text('Died');
                            } else if (parseInt($('#pregnant_status').val()) == 5) {
                                $('#td' + $('#pregnant_id').val()).addClass('label-info');
                                $('#td' + $('#pregnant_id').val()).text('Other');
                            }

                        }

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

                }
            });
        });


        $('#region_code').change(function () {

            var region_code = parseInt($('#region_code').val());
            $('#pregnant_list_update_spinner').css('display', 'block');
            $('#mira-pregnant-list-view tbody tr').remove();
            $('#pagination li').remove();
            $.ajax({
                url: '<?= base_url('pregnant_list_view_jquery') ?>',
                data: {
                    region_code: region_code
                },
                type: "POST",
                success: function (data, textStatus, jqXHR) {
                    $('#pregnant_list_update_spinner').css('display', 'none');
                    var pregnant_women_data = JSON.parse(data);
                    if (pregnant_women_data['pregnantList']) {
                        for (var i = 0; i < pregnant_women_data['pregnantList'].length; i++) {
                            $("#mira-pregnant-list-view tbody").append('<tr></tr>');
                            var pregnant_date = getDateFormat(pregnant_women_data['pregnantList'][i]['pregnant_date']);
                            var register_date = getDateFormat(pregnant_women_data['pregnantList'][i]['registration_date']);

                            $('#mira-pregnant-list-view tbody tr:last').append('<td class="text-center">' + (i + 1) + '</td>');
                            $('#mira-pregnant-list-view tbody tr:last').append('<td class="text-center">' + "PR" + pregnant_women_data['pregnantList'][i]['pregnant_id'] + '</td>');
                            $('#mira-pregnant-list-view tbody tr:last').append('<td class="text-center">' + pregnant_women_data['pregnantList'][i]['house_number'] + '</td>');
                            $('#mira-pregnant-list-view tbody tr:last').append('<td class="text-center">' + pregnant_women_data['pregnantList'][i]['name'] + '</td>');
                            $('#mira-pregnant-list-view tbody tr:last').append('<td class="text-center">' + pregnant_women_data['pregnantList'][i]['current_week'] + '</td>');
                            $('#mira-pregnant-list-view tbody tr:last').append('<td class="text-center">' + pregnant_date + '</td>');
                            $('#mira-pregnant-list-view tbody tr:last').append('<td class="text-center">' + register_date + '</td>');
                            switch (pregnant_women_data['pregnantList'][i]['delivery_status']) {
                                case '-999':
                                    $('#mira-pregnant-list-view tbody tr:last').append('<td class="text-center"><span class="label label-default">Running...</span></td>');
                                    break;
                                case '1':
                                    $('#mira-pregnant-list-view tbody tr:last').append('<td class="text-center"><span class="label label-success">Delivered</span></td>');
                                    break;
                                case '2':
                                    $('#mira-pregnant-list-view tbody tr:last').append('<td class="text-center"><span class="label label-primary">Aborted</span></td>');
                                    break;
                                case '3':
                                    $('#mira-pregnant-list-view tbody tr:last').append('<td class="text-center"><span class="label label-warning">Migrated</span></td>');
                                    break;
                                case '4':
                                    $('#mira-pregnant-list-view tbody tr:last').append('<td class="text-center"><span class="label label-danger">Died</span></td>');
                                    break;
                                case '5':
                                    $('#mira-pregnant-list-view tbody tr:last').append('<td class="text-center"><span class="label label-info">Other</span></td>');
                                    break;
                            }

                        }
                    }
                    // This block is working for pagination.
                    if (pregnant_women_data['totalPage'] && parseInt(pregnant_women_data['totalPage']) > 1) {
                        var current_page = parseInt(pregnant_women_data['activePage']);
                        var total_page = parseInt(pregnant_women_data['totalPage']);
                        var region_code = parseInt(pregnant_women_data['regionCode']);
                        previousPage(current_page, region_code, 'pagination');
                        forLoop(current_page, total_page, region_code, 'pagination');
                        nextPage(current_page, total_page, region_code, 'pagination');
                    }
                }
            });
        });
    });
    //    function nextDoubleClick(startingindex, regioncode, selectorid) {
    //        $('#' + selectorid).append('<li class ="disabled"><span>. .. ...</span></li>');
    //        $('#' + selectorid).append('<li class="page"><a href =' + '<?= base_url('women_list_view') ?>' + '/' + (startingindex + 5) + '/' + regioncode + '><span><i class="fa fa-angle-double-right" aria-hidden="true"></i><i class="fa fa-angle-double-right" aria-hidden="true"></i></span></a></li>');
    //    }
    //    function previousDoubleClick(startingindex, regioncode, selectorid) {
    //
    //        $('#' + selectorid).append('<li class="page"><a href =' + '<?= base_url('women_list_view') ?>' + '/' + (startingindex - 5) + '/' + regioncode + '><span><i class="fa fa-angle-double-left" aria-hidden="true"></i><i class="fa fa-angle-double-left" aria-hidden="true"></i></span></a></li>');
    //        $('#' + selectorid).append('<li class ="disabled"><span>... .. .</span></li>');
    //    }

    function previousPage(startingindex, regioncode, selectorid) {
        $('#' + selectorid).append('<li class ="disabled"><span><i class="fa fa-angle-double-left" aria-hidden="true"></i></span></li>');
    }
    function nextPage(startingindex, lastindex, regioncode, selectorid) {
        $('#' + selectorid).append('<li class="page"><a href =' + '<?= base_url('pregnant_list_view') ?>' + '/' + (startingindex + 1) + '/' + regioncode + '><span>Next</span></a></li>');
    }
    function forLoop(startingindex, lastindex, regioncode, selectorid) {
        for (var i = 1; i <= lastindex; i++) {
            if (i === startingindex) {
                $('#' + selectorid).append('<li class="active page"><span>' + i + '</span></li>');
            } else {
                $('#' + selectorid).append('<li class="page"><a href=' + '<?= base_url('pregnant_list_view') ?>' + '/' + i + '/' + regioncode + '><span>' + i + '</span></a></li>');
            }

        }
    }
    function getDateFormat(date) {
        var split_date_array1 = date.split('-');
        var split_date_array2 = split_date_array1[2].split(' ');
        return (split_date_array2[0] + '-' + split_date_array1[1] + '-' + split_date_array1[0]);
    }
</script>