<head>
    <script type="text/javascript" src="<?= site_url() ?>js/jquery-ui-timepicker-addon.js"></script>
</head>
<script type="text/javascript">
var params=0;
$(function(){

         $( "#showhidesearch" ).button({
            icons: {
                primary: "ui-icon-search"
            },
            text: true
        });
            $('#datepicker').datetimepicker({  showSecond: true,dateFormat: 'yy-mm-dd',timeFormat: 'hh:mm:ss' });
            $('#datepicker2').datetimepicker({  showSecond: true,dateFormat: 'yy-mm-dd',timeFormat: 'hh:mm:ss' });

        $("#search").click(function(){

            loadGrid();

        });
          $("#showhidesearch").click(function(){
            if(document.getElementById('searchbartop').style.display == 'none')
                $("#searchbartop").show("blind", { direction: "vertical" }, 300);
            else
                $("#searchbartop").hide("blind", { direction: "vertical" }, 300);
        });
         jQuery("#view").click( function()
        {
            var rowid;
            rowid = jQuery("#lines").jqGrid('getGridParam','selarrrow');
            if( rowid != 0){
            var selid = jQuery("#lines").jqGrid('getCell', rowid, 'ID');
            if(selid!=false){
                document.location.href="<?= site_url() ?>sales/sales/getreceiptlines/"+selid;
            }
            }
            else{
           $( "#dialog" ).dialog( "open" );
            }
        });
       $("#show").click(function(){
           loadGrid();
});
        });

              function loadGrid(){
              var datefrom = document.getElementById('datepicker');
              var dateto = document.getElementById('datepicker2');

            $("#lines").GridUnload();
            jQuery("#lines").jqGrid({
            url:'<?= site_url() ?>sales/salestotalregister/getsalestotalregister',
            datatype: "json",
            mtype : "post",
             colNames:['BILL DATE','FROM','TO','TOTAL SALE','NON TAXABLE','TAXABLE','5%','13.5%','20%','5%','13.5%','20%','TOTAL TAX'],
            postData: {    datefrom: datefrom.value,dateto: dateto.value,category: params},
            datatype: "json",
            mtype : "post",
            colModel:[
                {name:'BillDate',index:'BillDate', width:50,editable:true,align:"left", sorttype:'date', formatter:'date', formatoptions: {newformat:'d-M-Y'}, editoptions:{size:10}},
                {name:'ReceiptNo',index:'ReceiptNo', width:50,editable:false,align:"center",editoptions:{readonly:true,size:10}},
                {name:'ReceiptNoTo',index:'ReceiptNoTo', width:50,editable:false,align:"center",editoptions:{readonly:true,size:10}},
                {name:'Total',index:'Total', width:50,formatter:'currency', formatoptions: {thousandsSeparator:','},editable:false,align:"right",editoptions:{readonly:true,size:10}},
                {name:'NonTaxable',index:'NonTaxable',width:75,editable:true,align:"right",formatter:'currency', formatoptions: {thousandsSeparator:','},editoptions:{size:10}},
                {name:'Taxable',index:'Taxable',width:50,editable:true,align:"right",formatter:'currency', formatoptions: {thousandsSeparator:','},editoptions:{size:10}},
                {name:'Sale5%',index:'Sale5%', width:50,editable:false,align:"right",formatter:'currency', formatoptions: {thousandsSeparator:','},editoptions:{readonly:true,size:10}},
                {name:'Sale13.5%',index:'Sale13.5%', width:50,editable:false,align:"right",formatter:'currency', formatoptions: {thousandsSeparator:','},editoptions:{readonly:true,size:10}},
                {name:'Sale20%',index:'Sale20%', width:50,editable:false,align:"right",formatter:'currency', formatoptions: {thousandsSeparator:','},editoptions:{readonly:true,size:10}},
                {name:'Vat5%',index:'Vat5%', width:50,editable:false,align:"right",formatter:'currency', formatoptions: {thousandsSeparator:','},editoptions:{readonly:true,size:10}},
                {name:'Vat13.5%',index:'Vat13.5%', width:50,editable:false,align:"right",formatter:'currency', formatoptions: {thousandsSeparator:','},editoptions:{readonly:true,size:10}},
                {name:'Vat20%',index:'Vat20%', width:50,editable:false,align:"right",formatter:'currency', formatoptions: {thousandsSeparator:','},editoptions:{readonly:true,size:10}},
                {name:'Tax',index:'Tax', width:50,editable:false,align:"right",formatter:'currency', formatoptions: {thousandsSeparator:','},editoptions:{readonly:true,size:10}},
//                {name:'Debit',index:'Debit', width:50,editable:false,align:"right",formatter:'currency', formatoptions: {thousandsSeparator:','},editoptions:{readonly:true,size:10}},
//                {name:'Cash',index:'Cash', width:50,editable:false,align:"right",formatter:'currency', formatoptions: {thousandsSeparator:','},editoptions:{readonly:true,size:10}},
            ],
            rowNum:0,
//            rowList:[15,30,100000000],
            rownumbers: true,
            rownumWidth: 40,
             height: 'auto',
            autowidth:true,
//            width: 900,
            pager: '#pgtoolbar1',
            sortname: 'TICKETID',
            viewrecords: true,
            footerrow: true,
            userDataOnFooter: true,
            sortorder: "desc",
            multiselect: true,
            loadComplete: function() {
                           $("option[value=100000000]").text('All');

                          var reportSum = jQuery('#lines').jqGrid('getCol', 'Total', false, 'sum');
                          var Sum = jQuery('#lines').jqGrid('getCol', 'NonTaxable', false, 'sum');
                          var SumT = jQuery('#lines').jqGrid('getCol', 'Taxable', false, 'sum');
                          var SumTAX = jQuery('#lines').jqGrid('getCol', 'Tax', false, 'sum');
                          var SumDEBT = jQuery('#lines').jqGrid('getCol', 'Debit', false, 'sum');
                          var SumCASH = jQuery('#lines').jqGrid('getCol', 'Cash', false, 'sum');
                          var Sumfive = jQuery('#lines').jqGrid('getCol', 'Sale5%', false, 'sum');
                          var Sumthirty = jQuery('#lines').jqGrid('getCol', 'Sale13.5%', false, 'sum');
                          var Sumtwenty = jQuery('#lines').jqGrid('getCol', 'Sale20%', false, 'sum');
                          var fiveTax = jQuery('#lines').jqGrid('getCol', 'Vat5%', false, 'sum');
                          var thirtyTax = jQuery('#lines').jqGrid('getCol', 'Vat13.5%', false, 'sum');
                          var TwentyTax = jQuery('#lines').jqGrid('getCol', 'Vat20%', false, 'sum');


                          jQuery('#lines').jqGrid('footerData', 'set',
                          {
                              'BillDate': 'Total:',
                                'Total': reportSum

                           });
                           jQuery('#lines').jqGrid('footerData', 'set',
                          {
                              'BillDate': 'Total:',
                                'NonTaxable': Sum
                              
                           });
                           jQuery('#lines').jqGrid('footerData', 'set',
                          {
                              'BillDate': 'Total:',
                                'Taxable': SumT

                           });
                           jQuery('#lines').jqGrid('footerData', 'set',
                          {
                              'BillDate': 'Total:',
                                'Tax': SumTAX

                           });
                              jQuery('#lines').jqGrid('footerData', 'set',
                          {
                              'BillDate': 'Total:',
                                'Debit': SumDEBT

                           });
                              jQuery('#lines').jqGrid('footerData', 'set',
                          {
                              'BillDate': 'Total:',
                                'Cash': SumCASH

                           });
                            jQuery('#lines').jqGrid('footerData', 'set',
                          {
                              'BillDate': 'Total:',
                                'Sale5%': Sumfive

                           });
                            jQuery('#lines').jqGrid('footerData', 'set',
                          {
                              'BillDate': 'Total:',
                                'Sale13.5%': Sumthirty

                           });
                            jQuery('#lines').jqGrid('footerData', 'set',
                          {
                              'BillDate': 'Total:',
                                'Sale20%': Sumtwenty

                           });
                            jQuery('#lines').jqGrid('footerData', 'set',
                          {
                              'BillDate': 'Total:',
                                'Vat5%': fiveTax

                           });
                            jQuery('#lines').jqGrid('footerData', 'set',
                          {
                              'BillDate': 'Total:',
                                'Vat13.5%': thirtyTax

                           });
                            jQuery('#lines').jqGrid('footerData', 'set',
                          {
                              'BillDate': 'Total:',
                                'Vat20%': TwentyTax

                           });





                          },
                      
            beforeSelectRow: function(rowid, e)
        {
             jQuery("#lines").jqGrid('resetSelection');
                return(true);
        }
        });
        jQuery("#lines").jqGrid('setGroupHeaders', {
useColSpanStyle: true,
groupHeaders:[
    {startColumnName: 'ReceiptNo', numberOfColumns: 2, titleText: '<em>RECEIPT</em>'},
{startColumnName: 'Sale5%', numberOfColumns: 3, titleText: '<em>SALE</em>'},
{startColumnName: 'Vat5%', numberOfColumns: 3, titleText: '<em>VAT</em>'},

]
});
          $("#lines").jqGrid('navGrid', '#pgtoolbar1',{view:false, del:false, search:false, refresh:false, add:false, edit:false, excel:true})
                .navButtonAdd('#pgtoolbar1',{
                                caption:"Export to Excel",
                                buttonicon:"ui-icon-save",
                                onClickButton: function(){
                                  exportExcel();
                                },
                                position:"last"
                            });
//$("#lines").footerData('set',{PRODUCT:'Total', TOTAL:777.88});


 function exportExcel()
        {
            var mya=new Array();
            mya=$("#lines").getDataIDs();  // Get All IDs
            var data=$("#lines").getRowData(mya[0]);     // Get First row to get the labels
            var colNames=new Array();
            var ii=0;
            for (var i in data){colNames[ii++]=i;}    // capture col names
        var html="";
            for(k=0;k<colNames.length;k++)
            {
            html=html+colNames[k]+",";     // output each Column as tab delimited
            }
            html=html+"\n";
            for(i=0;i<mya.length;i++)
                {
                data=$("#lines").getRowData(mya[i]); // get each row
                for(j=0;j<colNames.length;j++)
                    {
                    html=html+data[colNames[j]]+","; // output each column as tab delimited
                    }
                html=html+"\n";  // output each row with end of line

                }
            html=html+"\n";  // end of line at the end

document.forms[0].exportdata.value=html;
            document.forms[0].method='POST';
            document.forms[0].action='<?php echo site_url('sales/salestotalregister/exportcsv'); ?>';  // send it to server which will open this contents in excel file
            document.forms[0].target='_blank';
            document.forms[0].submit();
            }
}



    $(document).ready(function() {
        $("button").button();
              loadGrid(null);
    });

</script>
<!-- CUSTOMER AUTOCOMPLETE -->
<style>
    .ui-autocomplete-loading { background: white url('<?= site_url() ?>public/images/ui-anim_basic_16x16.gif') right center no-repeat; }
</style>

<script type="text/javascript">
    $(function() {
        $( "#customers" ).autocomplete({
            source: function(request, response) {
                $.ajax({ url: "<?php echo site_url('partner/customers/getcustomersautocomplete'); ?>",
                    data: { term: $("#customers").val()},
                    dataType: "json",
                    type: "POST",
                    success: function(data){
                        response(data);

                    }
                });
            },
            minLength: 1
        });
    });
</script>
<script type="text/javascript">
    $(function() {
        $( "#productgroup" ).autocomplete({
            source: function(request, response) {
                $.ajax({ url: "<?php echo site_url('warehouses/getwarehouseautocomplete'); ?>",
                    data: { term: $("#productgroup").val()},
                    dataType: "json",
                    type: "POST",
                    success: function(data){
                        response(data);

                    }
                });
            },
            minLength: 1
        });
    });
</script>
<script type="text/javascript">
    $(function() {
        $( "#products" ).autocomplete({
            source: function(request, response) {
                $.ajax({ url: "<?php echo site_url('inventory/searchproducts/getproductsautocomplete'); ?>",
                    data: { term: $("#products").val()},
                    dataType: "json",
                    type: "POST",
                    success: function(data){
                        response(data);

                    }
                });
            },
            minLength: 1
        });
        });
</script>

<script>
	$(function() {
		$( "#radio" ).buttonset();

	});
	</script>
<script>
	// increase the default animation speed to exaggerate the effect
	$.fx.speeds._default = 1000;
	$(function() {
		$( "#dialog" ).dialog({
			autoOpen: false,
			show: "blind",
			hide: "explode",buttons: {
				Ok: function() {
					$( this ).dialog( "close" );
				}
			}

		});

	});
	</script>


<div class="demo">

<div id="dialog" title="Message">
	<p>Please select a row !</p>
</div>

</div><!-- End demo -->
<div class="main content clearfix">
<div class="page-heading">
            <h2> Sales Log Summary</h2>
        </div>
        <table border="0" width="100%" cellpadding="0" cellspacing="0" id="content-table">
            <tr>
                <th rowspan="3" class="sized"><img src="<?= site_url() ?>images/shared/side_shadowleft.jpg" width="20" height="300" alt="" /></th>
                <th class="topleft"></th>
                <td id="tbl-border-top"></td>
                <th class="topright"></th>
                <th rowspan="3" class="sized"><img src="<?= site_url() ?>images/shared/side_shadowright.jpg" width="20" height="300" alt="" /></th>
            </tr>
            <tr>
                <td id="tbl-border-left"></td>
                <td>
                    <div id="content-table-inner">
                        <div id="table-content">
                            <?php
                            if ($this->session->flashdata('msgt') == 'E') {
                                echo '
				<div id="message-red">
				<table border="0" width="100%" cellpadding="0" cellspacing="0">
				<tr>
					<td class="red-left">' . $this->session->flashdata('msg') . '</td>
					<td class="red-right"><a class="close-red"><img src="' . site_url() . 'images/table/icon_close_red.gif"   alt="" /></a></td>
				</tr>
				</table>
				</div>
						';
                            }
                            if ($this->session->flashdata('msgt') == 'S') {
                                echo '
					<div id="message-green">
					<table border="0" width="100%" cellpadding="0" cellspacing="0">
					<tr>
						<td class="green-left">' . $this->session->flashdata('msg') . '</a></td>
						<td class="green-right"><a class="close-green"><img src="' . site_url() . 'images/table/icon_close_green.gif"   alt="" /></a></td>
					</tr>
					</table>
					</div>
					';
                            }
                            ?>
                            <!--  start product-table ..................................................................................... -->
                             <div id="toolbartop">
                            <table>
                                 <th valign="middle"><span style="color:red;"></span>Date:</th>
                                <td>
                                    <input name="datefrom" type="text" id="datepicker" value="<?php echo  date('Y-m-d') ; ?>" class="inp-form-small"/>
                                </td>
                                <th valign="middle"><span style="color:red;"></span>Date To:</th>
                                <td>
                                    <input name="dateto" type="text" id="datepicker2" class="inp-form-small"/>
                                </td>


                                <td>
<!--                                    <div id="radio">

<input type="radio" id="radio1" name="radio"  onclick="params = 1;" checked="checked" /><label for="radio1">By Category</label>
<input type="radio" id="radio2" name="radio" onclick="params = 2;" /><label for="radio2">By Warehouse</label>
<input type="radio" id="radio3" name="radio" onclick="params = 3;" /><label for="radio3">By Tariff</label>
                                       </div>-->
                                   </td>
                                <td>
                                  <span class="button-strip">
                                    <button id="show" name="add">Show</button></span>
                                </td>
                               </table>
                             </div>
                               <form method="post" action="<?php echo site_url('sales/getsalestotalregister/exportcsv'); ?>">
    <input type="hidden" name="exportdata" id="exportdata" value="" />
</form>
                            <div align="center">
                            <table id="lines"></table>
                            </div>
                            <div id="pgtoolbar1"></div>
                        </div>
                    </div>
                            </td>
                            <td id="tbl-border-right"></td>
                            </tr>
                            <tr>
                                <th class="sized bottomleft"></th>
                                <td id="tbl-border-bottom">&nbsp;</td>
                                <th class="sized bottomright"></th>
                            </tr>
                            </table>
                            </div>