@extends('Admin/layout')
@section('title','Associate Import')
@section('content')
@if(has_permission('Associate','Import'))
<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">Associate Import</h4>
            </div>
            <!-- end card header -->
            <div class="card-body">
                <div class="live-preview">
                <form action="" 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-3">
                                    <div class="form-group mb-4">
                                    <label class="form-label">Upload Associate Data <span class="text-danger">*</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 Associate 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>
<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){
                $("#overlay").fadeIn(300);
                var fd = new FormData();
                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.uploadAssociateData')}}",
                    method:"POST",
                    data:fd,
                    dataType:'json',
                    contentType:false,
                    cache:false,
                    processData:false,
                    beforeSend: function() {
                        $("#overlay").fadeIn(300);
                    },
                    success:function(data)
                    {
                        var tr;
                        $("#table1").empty();
                        
                        if(data.status == '400')
                        {
                            Toastify({
                                text: data.message,
                                className: "danger",
                                style: {
                                background: "linear-gradient(to right, #f06548, #f06548)",
                                }
                            }).showToast();
                      
                        return false;
                        }else if(data.status == '201'){
                            Toastify({
                                text: data.message,
                                className: "danger",
                                style: {
                                background: "linear-gradient(to right, #f06548, #f06548)",
                                }
                            }).showToast();
                            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(){
                        setTimeout(function(){
                            $("#overlay").fadeOut(300);
                        },500);
                    },
                });

            // });
            // $("#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