@extends('layouts.app')

@section('sidebar')
@include('sidebar')
@stop
@section('content')
<div class="m-content">

    <div class="m-form m-form--label-align-right m--margin-top-20 m--margin-bottom-30">
        @if(session('success'))
            <div class="alert alert-success">
                {!!session('success') !!}
            </div>
        @endif      
        <div class="row align-items-center">
            <div class="col-xl-8 order-2 order-xl-1">
                <form method="post" action="{{url('excel-file-action')}}" enctype="multipart/form-data">
                    @csrf
                    <div class="form-group m-form__group row align-items-center">
                        <div class="col-md-4">
                                @php $options = ['add-credit','trasnfer-fund']; @endphp
                                <select class="form-control" id="select-api" name="selectapi"> 
                                      <option  selected disabled>Select Option</option>  
                                      @if (count($options) > 0)
                                          @foreach ($options as $option)
                                            <option @if(old('selectapi')  == $option ) selected @endif value="{{$option}}">{{$option}}</option> 
                                          @endforeach
                                      @endif
                                </select>
                                <span class="sampleFile" id="sampleFile-add-credit" style="display: none"> <a  href="https://ceo.sevenstarfx.com/sample-file/add-credit.xlsx" download> Sample File  Add Credit</a></span>
                                <span class="sampleFile" id="sampleFile-trasnfer-fund" style="display: none"> <a href="https://ceo.sevenstarfx.com/sample-file/fund-transfer.xlsx" download> Sample File Trasnfer Fund</a></span>
                                @if ($errors->has('selectapi'))
                                    <span class="text-danger">{{ $errors->first('selectapi') }}</span>
                                @endif
                        </div>

                        <div class="col-md-4">
                            <input type="file" class="form-control m-input" name="file" accept=".xlsx, .xls" id="file">
                            @if ($errors->has('file'))
                                    <span class="text-danger">{{ $errors->first('file') }}</span>
                                @endif
                        </div>
                       
                        <div class="col-md-4">
                            <button type="submit" class="btn btn-primary"> Upload
                            </button>
                        </div>
                        
                    </div>
                </form>
            </div> 
            
            
        </div>
    </div>
    
    <div class="m-portlet m-portlet--full-height ">
       
        <div class="m-portlet__head">
            <div class="m-portlet__head-caption">
                <div class="m-portlet__head-title">
                    <h3 class="m-portlet__head-text">
                        Excel history

                    </h3>
                </div>
            </div>
        </div>
        
        <div class="m-portlet__body">
            <table class="m_datatable table table-striped- table-bordered table-hover table-checkable" id="excel-history">
                <thead>
                    <tr>
                        <th>Select API</th>
                        <th>Admin</th>
                        <th>Date Of Submit</th>
                        <th>Action</th>
                    </tr>
                </thead>
                <tbody></tbody>
            </table>
        </div>
    </div>
</div>
@endsection

@section('script')
{{ Html::script('custom/eModal/eModal.js') }}
{{ Html::script('custom/datatables/datatables.bundle.js') }}
<script type="text/javascript">

    (function($){
        var table = '';
        sampleFile('');
        $('#select-api').on('change', function () {
            sampleFile($(this).val())
        });

        function sampleFile(params) {
            $('.sampleFile').css('display','none');
            $('#sampleFile-'+params).css('display','block');
        }

		$(document).ready(function () {

            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });

            

            $('#excel-history').each(function() {
                var aoColumns = [];
                var table;
                table = $(this).DataTable({
                    'responsive': true,
                    'searchDelay': 500,
                    'processing': true,
                    "oLanguage": {
                        "sProcessing": '<div class="m-loader m-loader--brand m-loader--left"><span>Please wait...</span></div>',
                    },
                    "serverSide": true,
                    "ajax": {
                        "url": base_url + "/excel-file-dataTable",
                        "type": "GET",
                        "order": [[ 0, "desc" ]],
                        "dom": "<'row'<'col-sm-12'tr>>" +
                            "<'row'<'col-sm-12 col-md-6'l><'col-sm-12 col-md-6'p>>",
                        "success": function(data) {
                            if (data.error !== 'No Permission') {
                                aoColumns = [
                                    { data: 'selectapi', name: 'selectapi'},
                                    { data: 'name', name: 'name'},
                                    { data: 'created_at', name: 'created_at'},
                                    { data: 'action', name: 'action', orderable: false, searchable: false }
                                ];
                                // Reinitialize DataTable with updated aoColumns
                                table.destroy();
                                table = $('#excel-history').DataTable({
                                    'responsive': true,
                                    'searchDelay': 500,
                                    'processing': true,
                                    "oLanguage": {
                                        "sProcessing": '<div class="m-loader m-loader--brand m-loader--left"><span>Please wait...</span></div>',
                                    },
                                    "serverSide": true,
                                    "ajax": {
                                        "url": base_url + "/excel-file-dataTable",
                                        "type": "GET",
                                        "order": [[ 0, "desc" ]],
                                        "dom": "<'row'<'col-sm-12'tr>>" +
                                            "<'row'<'col-sm-12 col-md-6'l><'col-sm-12 col-md-6'p>>"
                                    },
                                    "aoColumns": aoColumns
                                });
                            }else{
                                table.destroy();
                                swal(data.error, data[0], 'error') //warning,success,error,info,question
                                .then((isOK) => {
                                    window.location.href = base_url + "/no/permission";
                                });
                            }
                        }
                    }
                });
            });


            
                    

		});

        // Search Start

        // Status type Vise Search
        $('#document_status').on('change', function () {
                table.column('6').search($(this).val()).draw();
        });

        // Document type vise search
        $('#document_type').on('change', function () {
            table.column('3').search($(this).val()).draw();
        });

        $('#document_status, #document_type').selectpicker();

        // General search after 3 character entered
        $("#general-search")
        .unbind() // Unbind previous default bindings
        .bind("keyup", function(e) { // Bind our desired behavior
            var data = $(this).val();
            // If the length is 3 or more characters, or the user pressed ENTER, search
            if(data.length >= 3 || e.keyCode == 13 || e.keyCode == 8){
                table.search(data).draw();
            }
            // Ensure we clear the search if they backspace far enough
            if(this.value.length == 0) {
                table.search("").draw();
            }
        });

        // Search End

     ;
        /** end Verify Client **/
        function saveDocuments()
        {
            $('#document-form').submit();
        }
        /** Document Verification **/
        $(document).on('click', 'a.tutorial-delete', function(event){
            var id = $(this).attr('data-id');
            swal({
                    title: 'Are you sure!',
                    text: 'You won`t be able to revert this!',
                    type: "warning",
                    showCancelButton: !0,
                    confirmButtonText: "Yes, Confirm It!"
                }).then(function(e) {
                    //$.blockUI({ css: { backgroundColor: '#f00', color: '#fff'} });
                    if( e.value ) {
                        $.blockUI({ message: '<img src="{{ URL::to("images/loading.svg") }}" height="100%" width="100%" />', css: { border:'none', backgroundColor:'transparent' , top: '0%' , bottom: '0%'} });
                        var csrfToken = $('meta[name="csrf-token"]').attr('content');
                        
                        $.ajax({
                            url: "{{ url('tutorial/delete') }}", 
                            method: 'POST',
                            data:{
                                id : id,
                                _token : csrfToken,
                            },
                            dataType: 'json',
                            beforeSend:function(){
                                
                            },
                            complete: function(){
                                
                            },
                            success: function(res){
                                if (res.status == true) {
                                    swal("Deleted!", "Your tutorial deleted.", "success")
                                    .then((isOK) => {
                                        $('#tutorial').DataTable().ajax.reload();
                                        $.unblockUI();
                                    });
                                }else{
                                    swal("Oops...!", res.msg, "error")
                                    .then((isOK) => {
                                        $('#tutorial').DataTable().ajax.reload();
                                        $.unblockUI();
                                    });
                                }
                            }
                        });
                    }
                })
        });
        $(document).on('click', 'a.tutorial-approv', function(event){
            var id = $(this).attr('data-id');
            var secret = $(this).attr('secret-id');

            var url = base_url+"/tutorial/action/"+id+"/"+secret;
            var options = {
                url: url,
                title:'Nominee Detatils',
                size: 'md',
                buttons: [
                    {text: 'Cancel', style: 'btn btn-secondary', close: true },
                    {text: 'Submit', style: 'btn btn-primary',   close: false, click: saveDocuments }
                ]
            };
            eModal.ajax(options);
        });
        function saveDocuments()
        {
            $('#document-form').submit();
            table.ajax.reload( null, false );
        }

	})(jQuery);
    eModal.setModalOptions({ backdrop: 'static', keyboard: false });
</script>
@endsection