<?php 
	$header_file=APPPATH.'views/include/header.php';
	require($header_file);
	$sidenav_file=APPPATH.'views/include/sidenav.php';
	require($sidenav_file);	?>
  
    <!-- BEGIN: Content-->
    <div class="app-content content">
      <div class="content-overlay"></div>
      <div class="content-wrapper">
        <div class="content-header row">
          <div class="content-header-left col-md-12 col-12 mb-2 breadcrumb-new">
            <h3 class="content-header-title mb-0 d-inline-block">Report</h3>
            <div class="row breadcrumbs-top d-inline-block">
              <div class="breadcrumb-wrapper col-12">
                <ol class="breadcrumb">
                  <li class="breadcrumb-item"><a href="#">Home</a>
                  </li>
                  <li class="breadcrumb-item"><a href="#">Report</a>
                  </li>
                  <li class="breadcrumb-item active">Category Wise Value Purchase
                  </li>
                </ol>
              </div>
            </div>
          </div>
          
        </div>
        <div class="content-body"><!-- Basic form layout section start -->
<section id="basic-form-layouts">
	<div class="row justify-content-md-center " ng-app="reportApp">
		<div class="col-md-12" ng-controller="reportCtrl">
			<div class="card">
				
				<div class="card-content collapse show">
					<div class="card-body">
					<form autocomplete="off" method="POST" action="<?php echo site_url('ExcelReport/searchCategoryCostVolume/');?>">
					<div class="row">
								<div class="col-md-3">
									<div class="form-group">
										<!--<input class="form-control pickadate datepicker picker__input picker__input--active" type="text" name="fmonth"  id="fmonth" required data-uk-datepicker="{format:'DD-MM-YYYY'}" placeholder="From Date">-->
									<input type="text" name="fmonth" id="fmonth" class="form-control date-picker">
									<?php 
                                    //$my_string = "Hello World!";//echo json_encode($my_string);
									?>
									</div>
								</div>
								<div class="col-md-3">
									<div class="form-group">
										<!--<input class="form-control pickadate datepicker picker__input picker__input--active" type="text" name="tmonth"  id="tmonth" required data-uk-datepicker="{format:'DD-MM-YYYY'}" placeholder="To Date">-->
										<input type="text" name="tmonth" id="tmonth" class="form-control date-picker">
									</div>
								</div>
								<div class="col-md-2">
									<div class="form-group">
										<select id="branch" name="branch" class="form-control select2" >
											<option value="">Branch</option>
											<?php  foreach($branch as $row)
												{
											?>
												<option value="<?php echo "$row->branch_name"; ?>"><?php echo $row->branch_name; ?></option>
											<?php
												} 
											?>
										</select>
									</div>
								</div>
							
								<div class="col-md-1">
									<div class="form-group">
										<input type="submit" name="submit" class="btn btn-primary " value="Search" > <!--ng-click="fetchAvgCostReport()"-->
									</div>
								</div>
							</div>
						</form>
							<!--	<div ng-if="acrcount==0">
										<h6>No Records</h6>
								</div>
								<div ng-if="acrcount!=0" id="tresponse" class="table-responsive">
								
    								<table id="user_table" class="table table-striped table-bordered nowrap dtable" >
    									<thead>
    										<tr>
    											<th ng-repeat="key in getKeys(acr[0])">{{key}}</th>
    										</tr>
    									</thead>
    									<tbody>
    										<tr ng-repeat="row in acr">
    											<td ng-repeat="col in getKeys(acr[1])">{{row[col] | myNumber : 2}}</td>
    										</tr>
    									</tbody>
    								</table>
    								
    								
    							</div>-->
    							 <div id="raw_material"> </div>
							</div>
							
							
					</div>
				</div>
			</div>
		</div>
	</div>

</section>
<!-- // Basic form layout section end -->
        </div>
      </div>
    </div>
    <?php //require('include/theme_customizer.php');?>

<?php 
    $footer_file=APPPATH.'views/include/footer.php';
	require($footer_file);
?>
<script type="text/javascript">
<?php if(isset($_POST['submit'])) {
			
			$start = $month = strtotime($_POST['fmonth']);
			$end = strtotime($_POST['tmonth']);
}        
?>   
$(function() {
	var item = [];
	var items = "", item_name = "";
	var fproduct = "";
	var count = 1;
/*	var fmonth = $('#fmonth1').val();
	var tmonth = $('#tmonth1').val();
//	var dt = new Date(fmonth);
     dt.setMonth( dt.getMonth() + 1 );
    //var months = (tmonth.getFullYear() - fmonth.getFullYear()) * 12;
   // var x = monthDiff(new Date(fmonth), new Date(tmonth));
   //var x = monthDiff(new Date(2000, 01), new Date(2000, 02));
  // var months = tmonth.getMonth() - fmonth.getMonth() + (12 * (to.getFullYear() - from.getFullYear()));

//	alert(dt);*/
	$.getJSON('https://gsrgroup.biz/inv_demo_carnival/avgcat_list.json',function(data) {
		
		
			items += "<table border='1' class='table table-striped table-bordered nowrap dtable'>";
		//	items += "<tr><th>Category Name</th><th>Item Name</th><th>UOM</th><th style='width:100px'>Qty</th><th>Remarks</th></tr>";
		   items += "<tr><th>Category Name</th><?php while($month <= $end){ $smonth=date('Y-m-d', $month);   $lmonth=date('Y-m-t', $month); ?><th><?php  echo date('F Y', $month);$month = strtotime("+1 month", $month); ?></th><?php } ?></tr>";
			for(i in data.products)
			{
				
				//	$.each(data.products[i].items, function(j,e) {
				items += "<tr>" + "<td>" + data.products[i].category_name + "</td>";
				for(j in data.products[i].items)
				{
					items += "<td>" + data.products[i].items[j].grn_price + "</td>";
				} 
				items += "</tr>";
			//}
			}
			count++;
			items += "</table>"; 
			
		//}
		//alert(items);
		$('#raw_material').append(items);
		//$(items).appendTo("#item_table tbody");
	});
});
</script>
<script>
	
	var fetch = angular.module('reportApp',[]);
	fetch.controller('reportCtrl', ['$scope', '$http', '$timeout', function ($scope, $http, $timeout) {
						
		$scope.fetchAvgCostReport = function(){
			
			var fmonth = angular.element(document.getElementById("fmonth"));
			window.localStorage["fmonthval"] = fmonth.val();
			var tmonth = angular.element(document.getElementById("tmonth"));
			window.localStorage["tmonthval"] = tmonth.val();
					
			var branch = angular.element(document.getElementById("branch"));
			window.localStorage["branchval"] = branch.val();
			//$scope.acr = [];
						
			window.location.reload(true);
		}
		
		$scope.fmonth1 = window.localStorage["fmonthval"];
		$scope.tmonth1 = window.localStorage["tmonthval"];
		$scope.branch = window.localStorage["branchval"];
		console.log($scope.fmonth1);
		console.log($scope.tmonth1);
		console.log($scope.branch1);
		//$scope.branch2 = JSON.stringify($scope.branch1);
		$scope.acrcount = 0;
		$http({
			method: 'POST',
				url: '<?php echo base_url(); ?>index.php/ExcelReport/fetchAvgCatCostReport',
				headers: {'Content-Type': 'application/json'},
				data: JSON.stringify({fmonth:$scope.fmonth1,tmonth:$scope.tmonth1,branch:$scope.branch})
			}).then(function successCallback(response) {
			
				// Assign response to users object
				$scope.acr = response.data;
				$scope.acrcount = response.data.length;
				if($scope.acrcount == 3569)
				{
				    $scope.acrcount = 0;
				}
				else
				{
				    $scope.acrcount = response.data.length;
				}
				console.log($scope.acrcount);
								
				//datatable
				angular.element(document).ready(function() {  
					dTable = $('#user_table')  
					dTable.DataTable({
						dom: 'Bfrtip',
						"searching": true,
						buttons: [
							'csv', 'excel', 'pdf', 'print'
						]
					}); 
					
				});
		
				$scope.getKeys = function(obj) {
					return Object.getOwnPropertyNames(obj).slice(0, -1)
				}
			});
			window.localStorage.clear();
	}]);
	
	fetch.filter('myNumber', ['$filter', function($filter) {
        return function(value, fractionSize) {
            if (!angular.isNumber(value)) {
                return value;
            }

            return $filter('number')(value, fractionSize);
        }
    }]);
</script>
<script type="text/javascript">
	$(function() {
		$('.date-picker').datepicker({
			changeMonth: true,
			changeYear: true,
			showButtonPanel: true,
			dateFormat: 'MM yy',
			onClose: function(dateText, inst) { 
				$(this).datepicker('setDate', new Date(inst.selectedYear, inst.selectedMonth, 1));
			}
		});
	});	
</script>
	</body>
</html>