<div class="col-lg-6 col-sm-6 col-xs-12">
        <div class="databox databox-xxlg databox-vertical databox-inverted">
            <div class="databox-top bg-whitesmoke no-padding" style="-webkit-box-shadow: 0 0 3px rgba(0,0,0,.2);-moz-box-shadow: 0 0 3px rgba(0,0,0,.2);box-shadow: 0 0 3px rgba(0,0,0,.2);
">
                <div class="databox-row row-2 bg-orange no-padding">
                    <div class="databox-cell cell-1 text-align-center no-padding padding-top-5">
                        <span class="databox-number white">
                            <i id="weeklysales_spinner" style="display: none;" class="fa fa-spinner fa-spin"></i>
                            <i id="weeklysales_icon" class="fa fa-bar-chart-o no-margin"></i></span>
                    </div>
                    <div class="databox-cell cell-8 no-padding padding-top-5 text-align-left">
                        <span class="databox-number white"><?php echo $this->lang->line("WEEKLYSALESSTAT"); ?></span>
                    </div>
                    <div class="databox-cell cell-3 text-align-right padding-10">
                        <span class="databox-text white"><?= date('d F') ?></span>
                    </div>
                </div>
                <div class="databox-row row-4">
                    <div class="databox-cell cell-6 no-padding padding-10 padding-left-20 text-align-left">

                    </div>
                    <div class="databox-cell cell-2 no-padding padding-10 text-align-left">
                        <span id="salesweek" class="databox-number orange no-margin">0</span>
                        <span class="databox-text darkgray no-margin"><?php echo $this->lang->line("THISWEEK"); ?></span>
                    </div>
                    <div class="databox-cell cell-2 no-padding padding-10 text-align-left">
                        <span id="salesyesterday" class="databox-number orange no-margin">0</span>
                        <span class="databox-text darkgray no-margin"><?php echo $this->lang->line("YESTERDAY"); ?></span>
                    </div>
                    <div class="databox-cell cell-2 no-padding padding-10 text-align-left">
                        <span id="salestoday" class="databox-number orange no-margin">0</span>
                        <span class="databox-text darkgray no-margin"><?php echo $this->lang->line("TODAY"); ?></span>
                    </div>
                </div>
                <div class="databox-row row-6 no-padding">
                    <div class="databox-sparkline">
                        <span id="weeklysales-data" data-sparkline="line" data-height="126px" data-width="100%" data-linecolor="#37c2e2"
                              data-spotcolor="#fafafa" data-minspotcolor="#fafafa" data-maxspotcolor="#ffce55"
                              data-highlightspotcolor="#f5f5f5 " data-highlightlinecolor="#f5f5f5"
                              data-linewidth="2" data-spotradius="0">

                        </span>
                    </div>
                </div>
            </div>
            <div id="weeklysales-days" class="databox-bottom bg-sky no-padding">


            </div>
        </div>
    </div>
<script>
$(document).ready(function() {
    $("#weeklysales_spinner").show();
    $("#weeklysales_icon").hide();
        $.ajax({ url: "<?= base_url() ?>dashboard/databoxes/weeklysales",
                    data: {},
                    dataType: "json",
                    type: "POST",
                    success: function(data){


    var html = '';
    var salesdata = '';
                var len = data.length;
                var weektotal = 0.00;
                for (var i = 0; i< len; i++) {
                 
            html+="<div class='databox-cell cell-2 text-align-center no-padding padding-top-5'>"+
                    "<span class='databox-header white'>"+data[i]['date']+"</span></div>";
    if(i==0) salesdata+=data[i]['total'];
    else salesdata+=","+data[i]['total'];
    weektotal=weektotal +  +data[i]['total'];
                }
$("#weeklysales-data").append(salesdata);
$("#weeklysales-days").append(html);
$("#salesweek").text(weektotal.toFixed(2));
$("#salesyesterday").text(data[i-2]['total']);
$("#salestoday").text(data[i-1]['total']);

                        	
/*Line*/
            var sparklinelines = $('[data-sparkline=line]');
            $.each(sparklinelines, function () {
                $(this).sparkline('html', {
                    type: 'line',
                    disableHiddenCheck: true,
                    height: $(this).data('height'),
                    width: $(this).data('width'),
                    fillColor: getcolor($(this).data('fillcolor')),
                    lineColor: getcolor($(this).data('linecolor')),
                    spotRadius: $(this).data('spotradius'),
                    lineWidth: $(this).data('linewidth'),
                    spotColor: getcolor($(this).data('spotcolor')),
                    minSpotColor: getcolor($(this).data('minspotcolor')),
                    maxSpotColor: getcolor($(this).data('maxspotcolor')),
                    highlightSpotColor: getcolor($(this).data('highlightspotcolor')),
                    highlightLineColor: getcolor($(this).data('highlightlinecolor'))
                });
            });
                
                
                $("#weeklysales_spinner").hide();
                $("#weeklysales_icon").show();
                    }
                    
                    
                });
    
});
</script>