@extends('Admin/layout')
@section('title','Sales Data Import')
@section('content')
@if(has_permission('Sales Data','Create'))
<div class="container-fluid">
    <div class="row">
        <div class="col-xxl-12">
            <div class="card">
            <div class="card-header align-items-center d-flex">
                <h4 class="card-title mb-0 flex-grow-1">Sales Data Import</h4>
            </div>
            <!-- end card header -->
            <div class="card-body">
                <div class="live-preview">
                <form action="{{ route('visitportal.salesDataImport') }}" method="POST" class="needs-validation" enctype="multipart/form-data" id="upload_form"  novalidate>
                {{ csrf_field() }}
                    <input type="hidden" name="actiontype" value="{{$actiontype}}"/>
                    <div class="row">


                                <div class="col-md-2" >
                                    <label for="validationDefault01" class="form-label">Year</label>
                                    <select id="year" name="year" data-choices class="form-control" required>
                                        <option value="">Select Year</option>
                                        
                                            @for($i = $start_year;  $i <= $end_year; $i++ )
                                                <option value="{{$i}}" {{$year == $i ? 'selected' : '' }}>{{$i}}</option>
                                            @endfor
                                        

                                    </select>
                                </div>

                            
                                <div class="col-md-2" >
                                    <label for="validationDefault01" class="form-label">Month</label>
                                    <select id="month" name="month" data-choices class="form-control" required>
                                        <option value="">Select Month</option>
                                        @if($months)
                                            @foreach($months as $key => $value)
                                            <option value="{{$key + 1}}" {{$month == ($key + 1) ? 'selected' : '' }}>{{$value}}</option>
                                            @endforeach
                                        @endif

                                    </select>
                                </div>

                               


                                <div class="col-md-3">
                                    <div class="form-group mb-4">
                                    <label class="form-label">File Upload <span class="custom_err">*</span></label>
                                        <div class="custom-file text-left">
                                            <input type="file" name="file" class="custom-file-input" id="customFile" value="{{$tmp_filename}}" accept=".csv" >
                                            <label class="custom-file-label" for="customFile">Choose file</label>
                                        </div>
                                    </div>
                                </div>
                               
                                <div class="col-md-3" style="margin-top: 20px;">
                                    <div class="form-group mb-4">
                                        <!-- <button class="btn btn-secondary">OK</button> -->
                                    <input class="btn btn-primary" type="button" name="btn" value="submit"  id="checkfiledata" >
                                      <p>Download Excel: <a href="{{env('APP_URL')}}/assets/SampleSaleData.csv">Download Here</a></p>
                                    </div>
                                </div>

                                <div class="col-md-2" style="margin-top: 20px;display:none;" id="importbtn" >
                                    <div class="form-group mb-4" id="importbtnstatus" style="display:none;">
                                        <input type="button" name="btn1" value="import" class="btn btn-success" id="import">
                                    </div>
                                </div>

                        <!--end col-->
                       
                    </div>
                    <!--end row-->
                </form>
                </div>
            
            </div>
            </div>
        </div>
        <!-- end col -->
    </div>
    <div class="row">
        <div class="card display" style="display:none;">
            <div class="card-body" >
                <div class="row" >
                    <div class="col-md-3" >
                        <p style="color:#000; font-weight:bold;">Total Data : <span id="total_data">{{$total_data}}</span></p>
                    </div>
                    <div class="col-md-3">
                        <p style="color:blue; font-weight:bold;">Correct Data : <span id="correct_data">{{$correct_data}}</span></p>
                    </div>
                    <div class="col-md-6">
                        <p style="color:red; font-weight:bold;">Wrong Data : <span id="wrong_data">{{$wrong_data}}</span> 
                        <span onclick="downloadErrorFile()" style="color:green;cursor:pointer;">Download Error File</span>
                    </p>
                    </div>
                </div>
            </div>
        </div>
        <div class="card display" style="display:none;">
            <div class="card-body">
                <div class="table-responsive">
                    <h1 >Data List</h1>
                    <table class="table table-striped table-bordered">
                        <thead>
                            <tr>
                                <th>S.No</th>
                                <th>Associate Name</th>
                                <th>Sum of areas</th>
                                <th>Rera No</th>
                                <th>Pin</th>
                                <th>Upliner Name</th>
                                <th>Remarks</th>
                            </tr>
                        </thead>
                        <tbody id="table1">
                                                        @if(!empty($wrongSaleData))
                                @foreach($wrongSaleData as $key => $value)
                                                                    <tr>
                                        <th>1</th>
                                    
                                        <th>{{$value[0]}}</th>
                                        <th>{{$value[1]}}</th>
                                        <th>{{$value[2]}}</th>
                                        <th>{{$value[3]}}</th>
                                        <th>{{$value[4]}}</th>
                                        <th style="color:red;">{{$value[5]}}</th>
                                    </tr>
                                                                    @endforeach
                            @endif
                        </tbody>
                        
                    </table>  
                </div>
            </div>
        </div>
    </div>

</div>
<script src="{{ URL::asset('assets/js/jquery.min.js') }}"></script>
<script>
        $(document).ready(function(){
            $("#import").click(function(){    
                if (confirm('Are you sure want to import data')) {
                    uploadData(this.id);
                }  
            });
        });
        $(document).ready(function(){
            $("#checkfiledata").click(function(){   
               
                 uploadData(this.id);
            });
        });
        function uploadData(actionType){
           
            // $('#upload_form').on('submit', function(event){
               
                var fd = new FormData();
                var year = $("#year").val();
                fd.append('year',year);
                var month = $("#month").val();
                fd.append('month',month);
                var customFile = $('#customFile')[0].files;
                // Check file selected or not
                if(customFile.length > 0 ){
                fd.append('file',customFile[0]);
                }else{
                fd.append('file_url',$("#customFile").val());
                }

                fd.append('actionType',actionType);
                fd.append('_token',$('meta[name="csrf-token"]').attr('content'));
                event.preventDefault();
                $.ajax({
                url:"{{route('visitportal.submit-sales-data')}}",
                method:"POST",
                data:fd,
                dataType:'json',
                contentType:false,
                cache:false,
                processData:false,
                beforeSend: function() {
                    $('#loader').removeClass('hidden')
                },
                success:function(data)
                {
                    var tr;
                    $("#table1").empty();
                    
                    if(data.status == '400')
                    {
                     alert(data.message);
                     return false;
                    }else if(data.status == '201'){
                        alert(data.message);
                        location.reload();
                    }
                    else
                    {
                        var list = data.wrongSaleData;    
                        if (list != null && list != undefined && list.length >0) {
                            $.each(list, function (index, item) {
                                
                                tr = $('<tr/ >');
                                tr.append('<td>' + (index+1) + '</td>');
                                tr.append('<td>' + item[0] + '</td>');
                                tr.append('<td>' + item[1] + '</td>');
                                tr.append('<td>' + item[2] + '</td>');   
                                tr.append('<td>' + item[3] + '</td>');    
                                tr.append('<td>' + item[4] + '</td>');    
                                tr.append('<td style="color:red;">' + item[5] + '</td>');
                                $('#table1').append(tr);
                            })
                        }
                    
                        $("#total_data").text(data.total_data);
                        $("#correct_data").text(data.correct_data);
                        $("#wrong_data").text(data.wrong_data);
                        if(data.importbtnstatus == true){
                            $("#importbtnstatus").css('display', 'block');
                        }
                        
                        $('.display').css('display', 'block');
                        $('#importbtn').css('display', 'block');
                    }
                },
                complete: function(){
                    $('#loader').addClass('hidden')
                },
                });

            // });
            // $("#upload_form").submit();
        }
        </script>
      
	 
    <script>
        function downloadErrorFile(){
           var filedata = [];
           var myTab = document.getElementById('table1');

            // LOOP THROUGH EACH ROW OF THE TABLE AFTER HEADER.
            for (i = 1; i < myTab.rows.length; i++) {

                // GET THE CELLS COLLECTION OF THE CURRENT ROW.
                var objCells = myTab.rows.item(i).cells;
                var tempData = [];
                // LOOP THROUGH EACH CELL OF THE CURENT ROW TO READ CELL VALUES.
                for (var j = 0; j < objCells.length; j++) {
                    // info.innerHTML = info.innerHTML + ' ' + objCells.item(j).innerHTML;
                    tempData[j] = objCells.item(j).innerHTML;
                }
                filedata.push(tempData);
                // info.innerHTML = info.innerHTML + '<br />';     // ADD A BREAK (TAG).
            }

                var searchModel = {errordata : filedata,  'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')};
                
                event.preventDefault();
                $.ajax({
                    url:"{{route('visitportal.salesDataexportCSVErrorFile')}}",
                    method:"POST",
                    data:JSON.stringify(searchModel),
                    dataType:'json',
                    // contentType:'text/csv',
                    headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
                    // cache:false,
                    // processData:false,
                    beforeSend: function() {
                        $('#loader').removeClass('hidden')
                    },
                    success:function(data)
                    {
                        
                    
                    },
                    complete: function(data){
                        
                        var responseText = data.responseText;
                        console.log(responseText);
                        
                         /*
                        * Make CSV downloadable
                        */
                        var downloadLink = document.createElement("a");
                        var fileData = ['\ufeff'+responseText];

                        var blobObject = new Blob(fileData,{
                            type: "text/csv;charset=utf-8;"
                        });

                        var url = URL.createObjectURL(blobObject);
                        downloadLink.href = url;
                        downloadLink.download = "saleDataErrorFile.csv";

                        /*
                        * Actually download CSV
                        */
                        document.body.appendChild(downloadLink);
                        downloadLink.click();
                        document.body.removeChild(downloadLink);
                        $('#loader').addClass('hidden')
                    },
                });
            // console.log(filedata);
        }
    </script>

@endif
@endsection