<style>
    .dropdown-toggle {
        background-color:#4c0870;
        border-color : #4c0870;
    }

    .dropdown-toggle:hover{
        background-color:#4c0870;
        border-color : #4c0870;
    }

    #tableWithSearch thead tr >th{
        background-color:#4c0870;
        color:#fff;
        width: 16% !important;
    }
    #tableWithSearch thead tr th[class*='sorting_'] {
        color: #fff;
    }
    .bg-master-lighter {
        border:none;
        background-color:#fff;
        border-top:1px solid #ddd;  
    }
    .btn-group {
        background-color:#ed9421 !important;
        color:#fff;
    }
    .btn-default{
        border: none;
        background-color: #eee;
    }
    .btn-default:hover{
        background-color:#ed9421 !important;
        color:#fff;
        border: none;
    }
    .table-responsive {

        overflow-x: visible; 
    }
    .dropdown-menu>li>a:hover, .dropdown-menu>li>a:focus{
        background-color:#ed9421 !important; ;
        color:#fff;

    }
    .datepicker table tr td.day:hover {
        background: #4c0870  !important;
        color:#fff;
    }
    .datepicker table tr td.active {
        background-color: #4c0870  !important;
    }
    .datepicker thead tr .datepicker-switch {
        color: #4c0870   !important;
        font-size: 13px;
    }
    .datepicker table tr td span.active {
        background-color: #4c0870  !important;
    }
    .datepicker table tr td span:hover {
        background-color: #4c0870  !important;
        color:#fff;
    }
    datepicker thead tr .next:before, .datepicker thead tr .prev:before {
        color: #4c0870  !important;
        font-family: 'FontAwesome';
        font-size: 10px;
    }
    .datepicker thead tr .next:before, .datepicker thead tr .prev:before {
        color: #4c0870  !important;
        font-family: 'FontAwesome';
        font-size: 10px;
    }
    .complete ,.btn-group  .active{
        background-color:#ed9421 !important;
        color:#fff;
    }
    .MonthPicker,.YearPicker,.FromToPicker{
        display:none;
    }
    .actionButton{
        background-color:#4c0870;
    }
</style>
<script src="<?php echo THEME_PATH; ?>/plugins/moment/moment.min.js"></script>
<div class="container-fluid container-fixed-lg bg-white">
    <div class="panel panel-transparent">
        <div class="panel-heading">
            <div class="panel-title"><?php print CommonLanguage::getMessage('deposit_withdrawal_list'); ?></div>
            <div class="input-group  col-md-3" >
                <span class="input-group-addon bg-complete"><i class="fa fa-calendar"></i></span>
                <input id="From_To_Date" type="text" class="form-control" name="From_To_Date" >
            </div> 
            <?php if (($permissions->hasPermission('addDepositWithDrawal') && !$Is_Actual) || ($permissions->hasPermission('addDepositWithDrawalActual') && $Is_Actual)) { ?>
                <div class="col-md-3 pull-right">    
                    <div class="floatingContainer ">
                        <a href="ACC/addDepositWithDrawal<?php echo ($Is_Actual ? '/act' : '') ?>" >
                            <div class="actionButton" >
                                <p class="floatingText"><span class="floatingTextBG"><?php echo CommonLanguage::getMessage('add') ?></span></p>
                            </div>
                        </a>
                    </div>
                </div>
            <?php } ?>


        </div>
        <div class="panel-body">
            <table class="table table-bordered table-hover demo-table-search" id="tableWithSearch">
                <thead>
                    <tr>
                        <th class="text-center" >#</th>
                        <th class="text-center" ><?php print CommonLanguage::getMessage('From'); ?></th>
                        <th class="text-center" ><?php print CommonLanguage::getMessage('from_amount'); ?></th>
                        <th class="text-center" ><?php print CommonLanguage::getMessage('To'); ?></th>
                        <th class="text-center" ><?php print CommonLanguage::getMessage('to_amount'); ?></th>
                        <th class="text-center" ><?php print CommonLanguage::getMessage('description'); ?></th>
                        <th class="text-center"><?php print CommonLanguage::getMessage('Date'); ?></th>
                        <th class="text-center"><?php print CommonLanguage::getMessage('Action'); ?></th>
                    </tr>
                </thead>
                <tbody>


                </tbody>
                <tfoot>
                <th>  <?php if ($permissions->hasPermission($Is_Actual ?"delete_multi_act_deposit" : "delete_multi_deposit")) { ?>
                        <button class="btn btn-complete m-b-10 full-width" id="delete_all"><?php echo CommonLanguage::getMessage('Delete'); ?></button>
                    <?php } if ($permissions->hasPermission($Is_Actual ? 'convert_multi_act_deposit_to_official' : 'convert_multi_deposit_to_actual')) { ?>
                        <button class="btn btn-complete full-width" id="change_actual"><?php echo CommonLanguage::getMessage($Is_Actual ? 'to_official' : 'to_actual'); ?></button>
                    <?php } ?>
                </th>
                <th colspan="7"></th>
                </tfoot>
            </table>
        </div>

    </div>
</div>
<div class="modal fade" id="ConfirmDelete" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header text-left">
                <h4 class="modal-title bold"><?php print CommonLanguage::getMessage('Confirm_Delete') ?></h4>
                <div id="delete_alert"></div>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-md-12 m-t-10">
                        <p><?php print CommonLanguage::getMessage('about_delete_record') ?>&nbsp;<span id="rec_nb" class="bold red-star"></span></p>
                        <p><?php print CommonLanguage::getMessage('Proceed_Delete') ?></p>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal"><?php print CommonLanguage::getMessage('Close') ?></button>
                <button type="button" class="btn btn-danger width-auto" id="rec_delete"><?php print CommonLanguage::getMessage('delete') ?></button>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="change_actual_modal" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <div id="change_act_alert"></div>
                <h4 class="modal-title"><?php print CommonLanguage::getMessage($Is_Actual ? 'to_official_alert' : 'to_actual_alert') ?></h4>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-md-12 m-t-10">
                        <span id="act_nb" class="bold red-star"></span>
                        <p><?php print CommonLanguage::getMessage('proceed') . ' ?' ?></p>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal"><?php print CommonLanguage::getMessage('Close') ?></button>
                <button type="button" class="btn btn-danger width-auto" id="change_act_btn"><?php print CommonLanguage::getMessage('proceed') ?></button>
            </div>
        </div>
    </div>
</div>


<script>

    var title = <?php echo json_encode(CommonLanguage::getMessage('deposit_withdrawal_list')); ?>;
    var Is_Actual = <?php echo $Is_Actual ? 1 : 0; ?>;
    var today = <?php echo json_encode($today) ?>,
            rec_to_delete = [], rec_nb_del = [], rec_to_change = [], rec_nb_act = [];
    $(function () {
        ChangeTable()
        $("input[name=From_To_Date]").daterangepicker({
        }, function (start, end, label) {
            window.startDate = start.format("YYYY-MM-DD"),
                    window.endDate = end.format("YYYY-MM-DD")
            ChangeTable();

        });

//        $("#tableWithSearch").on("click", ".delete_dep", function () {
//            var entry_value = $(this).parents('.Action').attr('data-id');
//            var data = {
//                id: entry_value
//            };
//            IncludeDeleteModal(common_delete_modal, data, function () {
//                ChangeTable();
//            }, "ACCAjax/delete_deposit_withdrawal");
//        })
        
          $("#delete_all").on("click", function () {
            rec_to_delete = []
            rec_nb_del = []
            $("#tableWithSearch .del_td:checked").each(function () {
                rec_to_delete.push($(this).attr("data-id"));
                rec_nb_del.push($(this).attr("data-nb"));
            })
            if ($("#tableWithSearch .del_td:checked").length > 0) {
                $("#rec_nb").html(rec_nb_del.join())
                $("#ConfirmDelete").modal("show")
            }
        })
        $("#tableWithSearch").on("click", ".delete_dep", function () {
            $('#rec_delete').attr('disabled', false);
            rec_to_delete = [$(this).parents(".Action").attr("data-id")];
            $("#rec_nb").html($(this).parents("tr").find("td:eq(0)").text())
            $("#ConfirmDelete").modal("show");
        })
        $("#rec_delete").on("click", function () {
            $.ajax({
                url: "ACCAjax/delete_deposit_withdrawal",
                method: "GET",
                data: {ids: rec_to_delete},
                complete: function (v1, v2) {
                    if (v2 == 'success') {
                        if (v1.responseText == 'ok') {
                            $("#delete_alert").attr("class", "alert alert-success").html('<?php echo CommonLanguage::getMessage('Deleted_Successfully')?>')
                            rec_to_delete = []
                            ChangeTable()
                            setTimeout(function () {
                                $("#ConfirmDelete").modal("hide")
                                $("#delete_alert").addClass("hidden")
                            }, 1500)
                        } else {
                            $("#delete_alert").attr("class", "alert alert-danger").html(v1.responseText)
                        }
                    }
                }
            });
        })
        $("#tableWithSearch").on("click", "input.check_all_td", function (e) {
            var is_checked = $(this).is(":checked");
            var row = $("#tableWithSearch").dataTable().fnGetNodes();
            for (var i = 0; i < row.length; i++) {
                $(row[i]).find("input.del_td").prop("checked", is_checked);
            }
        });
        $("#tableWithSearch").on("click", ".change_actual", function () {
            rec_to_change = [$(this).parents(".Action").attr("data-id")];
            $("#act_nb").html($(this).parents("tr").find("td:eq(0)").text())
            $("#change_actual_modal").modal("show")
        })
        $("#change_actual").on("click", function () {
            rec_to_change = []
            rec_nb_act = []
            $("#tableWithSearch .del_td:checked").each(function () {
                rec_to_change.push($(this).attr("data-id"));
                rec_nb_act.push($(this).attr("data-nb"));
            })
            if ($("#tableWithSearch .del_td:checked").length > 0) {
                $("#act_nb").html(rec_nb_act.join())
                $("#change_actual_modal").modal("show")
            }
        })
        $("#change_act_btn").on("click", function () {
            $.ajax({
                url: "ACCAjax/change_deposit_actual",
                method: "POST",
                data: {id: rec_to_change, is_actual: Is_Actual ? 0 : 1},
                complete: function (v1, v2) {
                    if (v2 == 'success') {
                        if (v1.responseText == 'OK') {
                            $("#change_act_alert").attr("class", "alert alert-success").html('<?php echo CommonLanguage::getMessage('Submitted_Successfully') ?>')
                            rec_to_change = []
                            ChangeTable()
                            setTimeout(function () {
                                $("#change_actual_modal").modal("hide")
                                $("#change_act_alert").addClass("hidden")
                            }, 1500)
                        } else {
                            $("#change_act_alert").attr("class", "alert alert-danger").html(v1.responseText)
                        }
                    }
                }
            })
        })
    })

    function ChangeTable() {
        var DataArr = {
            hidden: Is_Actual ? 1 : 0,
            DW_List_Date_From: window.startDate ? window.startDate : today,
            DW_List_Date_To: window.endDate ? window.endDate : today
        };


        RebuildDataTable(title, [0, 1, 2, 3, 4, 5], 'ACCAjax/viewDepositeWithDrawalActual', DataArr);

    }




</script>

