

<style>
    .select2-container.select2-container-multi{
        height:auto !important;
        overflow-x: hidden !important;
        overflow-y:scroll !important;
    }
    .table thead tr >th{

        background-color:#4c0870;
        width:16% !important;
        color:#fff;
    }

    .table thead tr th[class*='sorting_'] {
        color: #fff;
    }
    .bg-master-lighter {
        border:none;
        background-color:#fff;
        border-top:1px solid #ddd;  
    }


    .ValSpan {
        opacity:0;
    }
    .datepicker thead tr .dow {
        color:#4c0870  !important;
    }
    .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;
    }
    .dropdown-menu>li>a{
        color:#000 !important;
        opacity: 1;
    }
    .DropDownForForms > .dropdown-menu{
        height:auto;
        cursor: pointer;
        overflow-y:auto;
    }
    #Name,.Name{
        text-transform: capitalize;
    }
    .newitem{

        font-size: 1.0em;
        text-align: center;
    }

</style>

<script src="<?php echo THEME_PATH; ?>/plugins/moment/moment.min.js"></script>

<script>


    function DecimalNumber(num) {
        return public_round_number(num);
        var num = parseFloat(num).toFixed(2)+'',
            rgx = /(\d+)(\d{3}[\d,]*\.\d{2})/;

        while (rgx.test(num)) {
            num = num.replace(rgx, '$1' + ',' + '$2');
            num = num.replace('-', "");
        }
        return num;
    }
</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('expense_report');?></div>
            <div class="row">
                <div class="input-group  col-md-2 center-margin pull-left" >

                    <h5><?php print CommonLanguage::getMessage('opening_balance');?></h5>
                    <input type="checkbox" checked id="opening_balance" name="opening_balance"/>

                </div>
                <div class="col-md-6">
                    <h5><?php print CommonLanguage::getMessage('accounts');?></h5>
                <select id="Expense_Accounts" class="full-width " multiple tabindex="-1" data-init-plugin="select2">
                    <?php for ($i =0 ;$i<count($expense_accounts);$i++) : ?>
                        <option value= <?php echo $expense_accounts[$i]['Account_Code'] ?>> <?php echo $expense_accounts[$i]['Account_Name'] ?> </option>
                    
                  <?php endfor ?>
                </select>
                </div>
                <div class="input-daterange input-group pull-right" id="datepicker-range">
                    <input id="From_To_Date" type="text" class="form-control" name="From_To_Date" >

                </div>


            </div>
            <div class="pull-right col-md-3" style="margin-right:-15px">
                <?php echo Forms::CurrencyDropDown(1,'complete')?>
            </div>
            <div class="clearfix"></div>
        </div>
        <div class="panel-body">


            <table class="table " id="expenseReportTable">
                <thead>
                    <tr>
                        <th class="v-align-middle text-left " style="width:2% !important;"><?php print CommonLanguage::getMessage('Code');?></th>
                        <th class="v-align-middle text-left bold" style="width:30% !important;"><?php print CommonLanguage::getMessage('Name');?></th>
                        <th class="v-align-middle text-center" style="width:20% !important;"> <?php print CommonLanguage::getMessage('old_balance');?></th>
                        <th class="v-align-middle text-center" style="width:20% !important;"> <?php print CommonLanguage::getMessage('current_balance');?></th>
                        <th class="v-align-middle text-center" style="width:20% !important;"> <?php print CommonLanguage::getMessage('overall_balance');?></th>


                    </tr>
                </thead>
                <tbody>
                    <?php

for($x=0;$x<count($expenselist)-1;$x++){
    $CurItem = $expenselist[$x];
    for($i=0;$i<count($CurItem)-1;$i++){
        $data = $CurItem[$i];
                    ?>
                    <tr>
                        <td class="text-left CODE text-black" ><a style="color:black !important;" href="<?php echo SITE_LINK; ?>ACC/ledger/<?php echo $data["Code"];?>"><span style="color:black !important;"><?php echo $data["Code"]; ?></span></a></td>
                        <td class="text-left " ><span class="Name"><?php echo $data["Name"]; ?></span></td>
                        <td class="text-center" ><span class="DefaultCurrency"></span> <span class="TrialBalanceValue0 "><?php echo $data["Old_Balance"] >= 0 ? "<script> document.write (public_round_number($data[Old_Balance]))</script>" : "(<script> document.write (public_round_number($data[Old_Balance]))</script>)" ;?></span></td>
                        <td class="text-center" ><span class="DefaultCurrency"></span> <span class="TrialBalanceValue0 "><?php echo $data["Current_Balance"] >= 0 ? "<script> document.write (public_round_number($data[Current_Balance]))</script>"  : "(<script> document.write (public_round_number($data[Current_Balance]))</script>)";?></span></td>
                        <td class="text-center" ><span class="DefaultCurrency"></span> <span class="TrialBalanceValue0 "><?php echo $data["All_Balance"] >= 0 ? "<script> document.write (public_round_number($data[All_Balance]))</script>"  : "(<script> document.write (public_round_number($data[All_Balance]))</script>)";?></span></td>
                    </tr>
                    <?php } ?>      

                    <tr style="color: #000;">
                        <td class="text-left bold" style="font-size: 1.0em;background-color:#e5e5e5"><span id="Code" ><?php echo $CurItem['Two_Digits']["Code"]; ?></span></td>
                        <td class="text-left bold" style="font-size: 1.0em;background-color:#e5e5e5"><span id="Name"><?php echo $CurItem['Two_Digits']["Name"]; ?></span></td>
                        <td class="text-center bold" style="font-size: 1.0em;background-color:#e5e5e5"><span class="DefaultCurrency"></span> <span class="TrialBalanceValue0 "><?php $old = $CurItem['Two_Digits']['Old_Balance'] ; echo $CurItem['Two_Digits']["Old_Balance"] >= 0 ? "<script> document.write (public_round_number($old))</script>"  : "(<script> document.write (public_round_number($old))</script>)"  ;?></span></td>
                        <td class="text-center bold" style="font-size: 1.0em;background-color:#e5e5e5"><span class="DefaultCurrency"></span> <span class="TrialBalanceValue0 "><?php $current = $CurItem['Two_Digits']['Current_Balance'];  echo $CurItem['Two_Digits']["Current_Balance"] >= 0 ? "<script> document.write (public_round_number($current))</script>"  : "(<script> document.write (public_round_number($current))</script>)";?></span></td>
                        <td class="text-center bold" style="font-size: 1.0em;background-color:#e5e5e5"><span class="DefaultCurrency"></span> <span class="TrialBalanceValue0 "><?php $all = $CurItem['Two_Digits']['All_Balance']; echo $CurItem['Two_Digits']["All_Balance"] >= 0 ? "<script> document.write (public_round_number($all))</script>"  : "(<script> document.write (public_round_number($all))</script>)";?></span></td>
                    </tr>
                    <?php } ?>
                </tbody>
                <tr style="color: #4c0870;">
                    <td></td>
                    <td class="text-left bold" style="font-size: 1.0em;"><span ><?php print CommonLanguage::getMessage('total');?></span></td>

                    <td class="text-center bold" style="font-size: 1.0em;"><span class="DefaultCurrency"></span> <span class="TrialBalanceValue0 "><?php $old = $expenselist['Totals']["Old_Balance"]; echo $expenselist['Totals']["Old_Balance"] >= 0 ? "<script> document.write (public_round_number($old))</script>" : "(<script> document.write (public_round_number($old))</script>)"  ;?></span></td>
                    <td class="text-center bold" style="font-size: 1.0em;"><span class="DefaultCurrency"></span> <span class="TrialBalanceValue0 "><?php $current = $expenselist['Totals']["Current_Balance"]; echo $expenselist['Totals']["Current_Balance"] >= 0 ? "<script> document.write (public_round_number($current))</script>" : "(<script> document.write (public_round_number($current))</script>)"  ;?></span></td>
                    <td class="text-center bold" style="font-size: 1.0em;"><span class="DefaultCurrency"></span> <span class="TrialBalanceValue0 "><?php $all = $expenselist['Totals']["All_Balance"]; echo $expenselist['Totals']["All_Balance"] >= 0 ? "<script> document.write (public_round_number($all))</script>" : "(<script> document.write (public_round_number($all))</script>)"  ;?></span></td>
                </tr>
            </table>

        </div>
    </div>
</div>






<script>
    var menu, fromdate = <?php echo json_encode($from_day)?>,is_actual = <?php echo json_encode($Is_Actual)?>, today = <?php echo json_encode($today)?>;



    $(function(){




        new Switchery($("#opening_balance").get(0),{color: $.Pages.getColor("complete")})
        new Switchery($("#salaries").get(0),{color: $.Pages.getColor("complete")})
        var table = $('#expenseReportTable');
        menu = '<div class="block-area" id="custom-select">'
            +'<div class="row">'
            +'<div class="col-md-2 m-b-15">'
            +'<select class="select">'
            +'<option value="10">10</option>'
            +'<option value="20">20</option>'
            +'<option value="30">30</option>'   
            +'<option value="50">50</option>'
            +'<option value="100">100</option>'
            +'<option value="200">200</option>'
            +'</select>'
            +'</div>'
            +'</div>'
            +'</div>'
        var settings = {
            "sPaginationType": "bootstrap",
            "pagingType": "full_numbers", 
            "destroy": true,
            "scrollCollapse": true,
            "aaSorting":[],
            oLanguage: {
                sLengthMenu: menu
            },
            "iDisplayLength": 10    
        };
        table.dataTable(settings);

        $('#search-table').on("keyup",function() {
            table.fnFilter($(this).val());
        });




        $("input[name=From_To_Date]").daterangepicker({
            locale: {
                format: 'YYYY-MM-DD'
            },

            startDate: fromdate

        },     function(start, end,label){
            window.startDate = start.format("YYYY-MM-DD"),
                window.endDate = end.format("YYYY-MM-DD")

        });
        $("#From_To_Date").on("change",function(){

            ExpenseReportAjax();
        })
        $("#CurrencyDropDown .dropdown-menu li").click(function(){
            setTimeout(function(){

                ExpenseReportAjax();
            },1000)
        })

    })
    $("#opening_balance").on("change",function(){

        ExpenseReportAjax();
    })	
    $("#Expense_Accounts").on("change",function(){
        ExpenseReportAjax();
    })
    function ExpenseReportAjax(){


        var CurrentDate =  {
        };
        CurrentDate.is_actual = is_actual;
        CurrentDate.From_Date = window.startDate ? window.startDate : fromdate;
        CurrentDate.To_Date = window.endDate ? window.endDate : today;
        CurrentDate.Currency_ID=$("#CurrencyDropDown button input").val();
        CurrentDate.Expense_Accounts=$("#Expense_Accounts").val();
        CurrentDate.Opening_Balance = $("#opening_balance").is(":checked")? 1 : 0;
        console.log(CurrentDate)

        $('#expenseReportTable').DataTable().destroy();
        $("#expenseReportTable tbody").empty();
        $("#AjaxIsBusy").removeClass("HideMe")
        $.ajax({
            url:"ACCAjax/expenseReportAjax",
            data:CurrentDate,
            dataType:"json",
            complete:function(v,vv){
                if(vv == "success" ){
                    var Data  = v.responseJSON;
                    currencysymbol= Data[1];

                    //                    console.log(Data[0]['Totals']['Old_Balance'])
                    var DataLen=Object.keys(Data[0]).length
                    for(var i=0;i<(DataLen-1);i++){
                        var CurItem = Data[0][i];
                        var DetLen = Object.keys(CurItem).length
                        for(var j=0;j<DetLen-1;j++){// 5 is the count of the additional 5 entreis in every Data[i]


                            var TR  = "<tr>"
                            TR += "<td class='text-left CODE text-black' ><a href='<?php echo SITE_LINK; ?>ACC/ledger/"+CurItem[j]["Code"]+"'><span >"+CurItem[j]["Code"]+"</span></a></td>"
                            TR += "<td class='text-left' ><span class='Name'>"+CurItem[j]["Name"]+"</span></td>"
                            TR+="<td class='text-center' > <span class='TrialBalanceValue0'>"+(CurItem[j]["Old_Balance"] < 0 ? '('+(public_round_number(CurItem[j]["Old_Balance"]))+')' : (public_round_number(CurItem[j]["Old_Balance"])))+"</span></td>"
                            TR+="<td class='text-center' > <span class='TrialBalanceValue0'>"+(CurItem[j]["Current_Balance"] < 0 ? '('+(public_round_number(CurItem[j]["Current_Balance"]))+')' : (public_round_number(CurItem[j]["Current_Balance"])))+"</span></td>"
                            TR+="<td class='text-center' ><span class='TrialBalanceValue0'>"+(CurItem[j]["All_Balance"] < 0 ? '('+(public_round_number(CurItem[j]["All_Balance"]))+')' : (public_round_number(CurItem[j]["All_Balance"])))+"</span></td></tr>"
                            TR = $(TR)
                            $("#expenseReportTable > tbody:last").append(TR)
                            //							$("#expenseReportTable tbody").append(TR)

                        }
                        var trtotal ="<tr style='color: #000;'>"
                        trtotal+="<td class='text-left bold' style='font-size: 1.0em;background-color:#e5e5e5'><span id='Code'>"+CurItem['Two_Digits']["Code"]+"</span></td>"
                        trtotal+="<td class='text-left bold' style='font-size: 1.0em;background-color:#e5e5e5'><span id='Name'>"+CurItem['Two_Digits']["Name"]+"</span></td>"
                        trtotal+="<td  class='text-center bold' style='font-size: 1.0em;background-color:#e5e5e5'><span id='Main_Balance' ><span >"+(CurItem['Two_Digits']['Old_Balance'] <0 ? '('+(public_round_number(CurItem['Two_Digits']["Old_Balance"]))+')' : (public_round_number(CurItem['Two_Digits']["Old_Balance"])))+"</span></span></td>"
                        trtotal+="<td  class='text-center bold' style='font-size: 1.0em;background-color:#e5e5e5'><span id='Main_Balance' ><span >"+(CurItem['Two_Digits']['Current_Balance'] <0 ? '('+(public_round_number(CurItem['Two_Digits']["Current_Balance"]))+')' : (public_round_number(CurItem['Two_Digits']["Current_Balance"])))+"</span></span></td>"
                        trtotal+="<td  class='text-center bold' style='font-size: 1.0em;background-color:#e5e5e5'><span id='Main_Balance' >  <span >"+ (CurItem['Two_Digits']['All_Balance'] <0  ? ((CurItem['Two_Digits']["All_Balance"])) :(public_round_number(CurItem['Two_Digits']["All_Balance"])))+"</span></span></td></tr>"
                        trtotal = $(trtotal)
                        $("#expenseReportTable > tbody:last").append(trtotal)
                        //                            $("#expenseReportTable tbody").append(trtotal)
                    }


                    var finaltr="<tr style='color: #4c0870;'>"
                    finaltr+="<td></td>"
                    finaltr+="<td class='text-left bold' style='font-size: 1.0em;'><span >Total</span></td>"
                    finaltr+="<td  class='text-center bold' style='font-size: 1.0em;'><span > <span >"+(Data[0]['Totals']['Old_Balance'] <0 ?  '('+(public_round_number(Data[0]['Totals']['Old_Balance']))+')' : (public_round_number(Data[0]['Totals']['Old_Balance'])))+"</span></span></td>"
                    finaltr+="<td  class='text-center bold' style='font-size: 1.0em;'><span > <span >"+(Data[0]['Totals']['Current_Balance'] <0 ?  '('+(public_round_number(Data[0]['Totals']['Current_Balance']))+')' : (public_round_number(Data[0]['Totals']['Current_Balance'])))+"</span></span></td>"
                    finaltr+="<td  class='text-center bold' style='font-size: 1.0em;'><span > <span >"+(Data[0]['Totals']['All_Balance'] <0 ?   '('+(public_round_number(Data[0]['Totals']['All_Balance']))+')' : (public_round_number(Data[0]['Totals']['All_Balance'])))+"</span></span></td></tr>"
                    finaltr = $(finaltr)
                    $("#expenseReportTable > tbody:last").append(finaltr)



                }


                RebuildTable()
                $("#expenseReportTable > tbody:first").empty()
//        	$(".PrintThisTableButton").attr({"data-title":"Expense Report","data-balance":currencysymbol+' '+Data['Totals']["All_Balance"],"data-old":currencysymbol+' '+Data[0]['Totals']['Old_Balance'],"data-current=":currencysymbol+' '+Data[0]['Totals']['Current_Balance'],"data-currency":$("#CurrencyDropDown > button>span").html(),"data-table":"#expenseReportTable","data-date":"From:"+ window.startDate+" To:"+ window.endDate})
            }   



        })//end of ajax complete

    }

    function RebuildTable(){
        menu = '<div class="block-area" id="custom-select">'
            +'<div class="row">'
            +'<div class="col-md-2 m-b-15">'
            +'<select class="select">'
            +'<option value="10">10</option>'
            +'<option value="20">20</option>'
            +'<option value="30">30</option>'   
            +'<option value="50">50</option>'
            +'<option value="100">100</option>'
            +'<option value="200">200</option>'
            +'</select>'
            +'</div>'
            +'</div>'
            +'</div>'
        $('#expenseReportTable').dataTable({

            "sPaginationType": "bootstrap",
            "pagingType": "full_numbers", 
            "destroy": true,
            "scrollCollapse": true,
            "aaSorting":[],
            oLanguage: {
                sLengthMenu: menu
            },
            "iDisplayLength": 10
        });
        $('#search-table').on("keyup",function() {
            $('#expenseReportTable').dataTable().fnFilter($(this).val());
        });
    }


    function FixFloatVal(what){
        return what.replace(/\.0$|\.00$|\.000$/,"");	
    }

    // to remove many digits after the period
    $(function(){$(".ValSpan").each(function(){$(this).html(AddCommas(parseFloat($.trim($(this).text())).toFixed(3))).animate({opacity:1})})})


</script>


