@extends('layouts.backend')
@section('extraCss')
<style type="text/css">
span.multiselect-native-select {
    position: relative;
    display: block;
}
.btn-group, .btn-group-vertical {
    display: block;
}
.custom-select, .dropdown-item {
    width: 100% !important;
}
</style>
@endsection
@section('mainContentArea')
    <div class="card card-default">
        <div class="card-header">
            <h4>GST Master</h4>
             <button class="btn btn-success float-right btn-sm" type="button"  data-toggle="modal" data-target="#gstModel" id="add-gst" style="float:right; margin:10px;">
              <i class="fa fas fa-plus"></i> Add GST</button>
        </div>
        <div class="card-body">
          
         
            <table class="table table-bordered table-striped">
                <thead>
                    <tr>
                        <th>S.No</th> 
                        <th>Section</th>
                        <th>Subsection</th>                        
                        <th>HSN Description</th>
                        <th>HSN Code</th>
                        <th>GST</th>
                        <th>GST Slab</th>
                        <th>Lower Tax(%)</th>
                        <th>Upper Tax(%)</th>
                        <th>Status</th>
                        <th colspan="2">Actions</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach ($categoryList as $key => $group)                
                        <tr>
                            <td>{{$key + $categoryList->firstItem() }}</td> 
                            <td>{{ empty($group->sectionInfo->name) ? 'N/A' : $group->sectionInfo->name }}</td>
                            <td>{{ empty($group->subsectionInfo->name) ? 'N/A' : $group->subsectionInfo->name }}</td>
                            <td>{{ empty($group->hsnDes) ? 'N/A' : $group->hsnDes }}</td>
                            <td>{{ empty($group->hsncode) ? 'N/A' : $group->hsncode }}</td>
                            <td>{{ ($group->gststatus === 1) ? 'Inclusive' : 'Exclusive' }}</td>
                            <td>{{ empty($group->inputGst) ? 0 : $group->inputGst }}</td>
                            <td>{{ empty($group->lower_tax) ? 0 : $group->lower_tax }}</td>
                            <td>{{ empty($group->upper_tax) ? 0 : $group->upper_tax }}</td>
                            <td>{{ ($group->status === 1) ? 'Pending' : 'Approve' }}</td>
                            <td>
                                @if($group->status == 1)
                                   <a data-id="{{ $group->id }}" id="edit-post" class="btn btn-xs btn-info btn-sm"><i class="fa fas fa-pencil"></i> </a>
                               
                                @endif
                                 <a data-id="{{ $group->id }}" id="view-post" class="btn btn-xs btn-info btn-sm"><i class="fa fas fa-eyes"></i>View</a>
                            </td>                          
                           
                        </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
        @php if($categoryList->count() > 0) { @endphp {!! $categoryList->appends(request()->input())->links() !!} @php } @endphp
    </div>

<!-- Modal -->
<div class="modal fade" id="gstModel" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content">
            <!-- Modal Header -->
            <div class="modal-header" >
              <h5> Add GST Details</h5>
              <button type="button" class="close" data-dismiss="modal">&times;</button> 
               
            </div>
            
            <!-- Modal Body -->
            <div class="modal-body">
                <div class="alert alert-danger print-error-msg" style="display:none">
                    <ul></ul>
                </div>
                <form role="form" method="post" id="upload_form" enctype="multipart/form-data">
                    {{ csrf_field() }}
                    <div class="form-group ">
                        <label for="cate_type"> Category </label> 
                        <select name="section[]" id="section" class="form-control" required>  
                              <option value="">select</option>                  
                              @foreach($parentList as $section)
                              <option value="{{ $section->id }}" >{{ $section->name  }}</option>
                               @endforeach
                        </select>
                       
                    </div>
                    <div class="form-group">
                        <label for="inputName">Section</label>                                             
                         <select name="subsection[]" id="subsection"  class="form-control" required>                  
                         </select>
                         <input id="subid" type="hidden">
                    </div>
                    <div class="form-group">
                        <label for="inputName">Sub Section</label>                                             
                        <select name="subsubsection[]" id="subsubsection" class="form-control" required>                  
                        </select>
                        <input id="subsubid" type="hidden">
                    </div>

                   <!--  <div class="form-group">
                        <label for="inputName">SubSection</label>                                             
                        <select name="subsubsectionn[]" id="subsubsectionn" class="input-mdd" multiple="multiple">                  
                        </select>
                    </div> -->

                    <div class="form-group">
                        <label for="inputMessage"> HSN Description</label>                        
                        <textarea class="form-control" name="hsnDes" id="hsnDes" placeholder="Enter HSN description" required></textarea>
                    </div>
                   
                    <div class="form-group">
                        <label for="inputName">HSN Code</label>
                        
                        <input type="text" class="form-control" name = "hsncode" id="hsncode" placeholder="Enter HSN code" required />
                    </div>  

                   <!--  <div class="form-group">
                        <label for="inputMessage">GST Inclusive/Exclusive </label>
                        <select name="gststatus" id="gststatus" class="form-control" required>
                                <option value="">select</option>                               
                                <option value="1" {{ ( (!empty(request("gststatus")) && (request("gststatus") === 1)) ? "selected" : "") }}>Inclusive</option>
                                <option value="0" {{ ( (!empty(request("gststatus")) && (request("gststatus") === 0)) ? "selected" : "") }}>Exclusive</option>
                        </select>       
                    </div> -->
                    <div class="form-group">
                        <label for="inputName">GST Slab </label>     
                        <input id="catid" type="hidden">                  
                        <input type="number" min='0' class="form-control" id="inputGst" name="inputGst" placeholder="Enter GST Slab" required />                       
                    </div>
                    <div class="form-group">
                        <label for="lower_tax">Lower Tax </label>                       
                        <input type="number" min='0' class="form-control" id="lower_tax" name="lower_tax" placeholder="Enter lower tax" required />                       
                    </div>
                    <div class="form-group">
                        <label for="upper_tax">Upper Tax </label>                       
                        <input type="number" min='0' class="form-control" id="upper_tax" name="upper_tax" placeholder="Enter upper tax" required />                       
                    </div>
                    <div class="form-group" id="divstatus" style="display:none">
                        <label for="status">Approve </label>
                        <select name="status" id="status" class="form-control" required>
                                <option value="">select</option>                               
                                <option value="1" {{ ( (!empty(request("status")) && (request("status") === 1)) ? "selected" : "") }}>Pending</option>
                                <option value="2" {{ ( (!empty(request("status")) && (request("status") === 2)) ? "selected" : "") }}>Approve</option>
                        </select>       
                    </div>
                    
                </form>
            </div>
            
            <!-- Modal Footer -->
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                <button type="submit" class="btn btn-primary " id="btn-save" onclick="submitGSTForm()">SUBMIT</button>
            </div>
        </div>
    </div>
</div>
   
@endsection

@section('extraJs')
<script type="text/javascript">
$('body').on('click', '#add-gst', function () {       
        $('#section').val('');       
        $('#subsection').val('');
        $('#subsubsection').val('');
        $('#hsnDes').val('');
        $('#hsncode').val(''); 
       // $('#gststatus').val('');
        $('#inputGst').val('');  
        $('#lower_tax').val('');
        $('#upper_tax').val('');
        $("#divstatus").css('display','none');
        $('#gstModel .modal-dialog .modal-content .modal-header h5').html("Add GST Details");
        $('#gstModel .modal-dialog .modal-content .modal-footer #btn-save').html("Send For Approval");
});

// $(document).ready(function(){
//      $('#upload_form').submit(function(e) {
//             e.preventDefault();            
//             var formData = new FormData(this);
//      });
// });            

function submitGSTForm(){
    var section = $('#section').val();  
    var subsection = $('#subsection').val();  
    var subsubsection = $('#subsubsection').val();   
    var hsnDes = $('#hsnDes').val();
    var hsncode = $('#hsncode').val();  
   // var gststatus =  $('#gststatus').val();
    var inputGst =  $('#inputGst').val();
    var catid =  $('#catid').val();
    var lower_tax =  $('#lower_tax').val();
    var upper_tax =  $('#upper_tax').val();
    var status =  $('#status').val();
    //console.log(subsubsection); return 
    if(section.trim() == '' ){
        alert('Please select category.');
        $('#section').focus();
        return false;
    }else if(subsection.trim() == '' ){
        alert('Please select section.');
        $('#subsection').focus();
        return false;
    }else if(subsubsection.trim() == '' ){
        alert('Please select subsection.');
        $('#subsubsection').focus();
        return false;
    }
    else if(hsnDes.trim() == '' ){
        alert('Please enter Hsn description.');
        $('#hsnDes').focus();
        return false;
    }else if(hsncode.trim() == '' ){
        alert('Please enter Hsn code.');
        $('#hsncode').focus();
        return false;
    }
    //else if(gststatus.trim() == '' ){
    //     alert('Please select category status.');
    //     $('#gststatus').focus();
    //     return false;
    // }
    else if(inputGst.trim() == '' ){
        alert('Please enter GST rate.');
        $('#inputGst').focus();
        return false;
    }else if(lower_tax.trim() == '' ){
        alert('Please enter lower tax.');
        $('#lower_tax').focus();
        return false;
    }else if(upper_tax.trim() == '' ){
        alert('Please enter upper tax.');
        $('#upper_tax').focus();
        return false;
    }else{
        var _token   = $('meta[name="csrf-token"]').attr('content'); 
        $.ajax({
            type: "get",
            url: "{{ route('gst-save') }}",
            data: {
            section: section,            
            subsection:subsection,
            subsubsection:subsubsection,
            hsnDes:hsnDes,   
            hsncode: hsncode,
            // gststatus:gststatus,
            inputGst:inputGst, 
            lower_tax:lower_tax, 
            upper_tax : upper_tax,
            status : status,
            catid : catid,                   
            _token: _token
            },
            dataType: "json",
            beforeSend: function () {
                $('.submitBtn').attr("disabled","disabled");
               
            },           
            success: function(response) { 
                
                console.log(response.error)
                if($.isEmptyObject(response.error)){
                        var reason = JSON.stringify(response);  
                        var parsed = JSON.parse(reason);            
                        console.log(parsed);
                        if (parsed.status == false) {
                        toastr.error(parsed.info);
                        $('.submitBtn').removeAttr("disabled");
                        } else {
                        toastr.success(parsed.info);
                        
                        window.location.reload('true');    
                        }
                }else{
                        printErrorMsg(response.error);
                    }
            }           
        });

        function printErrorMsg (msg) {
            $(".print-error-msg").find("ul").html('');
            $(".print-error-msg").css('display','block');
            $.each( msg, function( key, value ) {
                $(".print-error-msg").find("ul").append('<li>'+value+'</li>');
            });
        }
    }
}

$('body').on('click', '#edit-post', function () { 
      var post_id = $(this).data('id');
      $("#divstatus").css('display','none');

      var _token   = $('meta[name="csrf-token"]').attr('content'); 
        $.ajax({
            type: "get",
            url: "{{ route('gst-edit') }}",
            data: {
            id:  post_id,        
            _token: _token
            },
            dataType: "json",                       
            success: function(data) { console.log(data);
                  $("#section option[value=" + data.section + "]").attr('selected', true);
                  section(data.section);

                  
                  subsection(data.subsection);
                  
                  $('#gstModel .modal-dialog .modal-content .modal-header h5').html("Edit GST Details");
                  $('#gstModel .modal-dialog .modal-content .modal-footer #btn-save').html("Send for Approval");
                  $('#gstModel').modal('show');  
                   
                 
                  $('#hsnDes').val(data.hsnDes);
                  $('#hsncode').val(data.hsncode); 
                
                  $('#inputGst').val(data.inputGst); 
                  $('#catid').val(data.id);
                  $('#subid').val(data.subsection);
                  $('#subsubid').val(data.subsubsection_id);
                  $('#lower_tax').val(data.lower_tax);
                  $('#upper_tax').val(data.upper_tax);
                  
                  //$("#gststatus option[value=" + data.gststatus + "]").attr('selected', true);
                  //$("#subsection option[value=" + data.subsection + "]").attr('selected', true);
            }
        });
      
});

$('body').on('click', '#view-post', function () { 
      var post_id = $(this).data('id');
      var _token   = $('meta[name="csrf-token"]').attr('content'); 
        $.ajax({
            type: "get",
            url: "{{ route('gst-edit') }}",
            data: {
            id:  post_id,        
            _token: _token
            },
            dataType: "json",                       
            success: function(data) { console.log(data);
                  $("#section option[value=" + data.section + "]").attr('selected', true);
                   section(data.section);                  
                  subsection(data.subsection);
                  
                  $('#gstModel .modal-dialog .modal-content .modal-header h5').html("View GST Details");
                  $('#gstModel .modal-dialog .modal-content .modal-footer #btn-save').html("Approval");
                  $('#gstModel').modal('show');  
                 
                  $('#hsnDes').val(data.hsnDes);
                  $('#hsncode').val(data.hsncode); 
                
                  $('#inputGst').val(data.inputGst); 
                  $('#catid').val(data.id);
                  $('#subid').val(data.subsection);
                  $('#subsubid').val(data.subsubsection_id);
                  $('#lower_tax').val(data.lower_tax);
                  $('#upper_tax').val(data.upper_tax);
                 // $('#status').val(data.status);
                  $("#divstatus").css('display','block');
                 // $("#gststatus option[value=" + data.gststatus + "]").attr('selected', true);
                  $("#status option[value=" + data.status + "]").attr('selected', true);
                 
            }
        });
      
});

$(function () {

  $('#section').on('change', function (event) {
      section($('#section').val());
  }); 

  $('#subsection').on('change', function (event) {   
      subsection($('#subsection').val());
  }); 

});

function section(section)
{    
    var _token   = $('meta[name="csrf-token"]').attr('content');

    $.ajax({
    url:"{{ route('section-subsection-list') }}",
    method:"get",
    data:{section: section, _token:_token},
    success:function(res)
    { 

    if(res){ console.log(res);
    $("#subsection").empty();
    $("#subsection").append('<option value="">Select Section</option>');
    $.each(res,function(key,value){
      console.log(key,value); 
      $("#subsection").append('<option value="'+value.id+'">'+value.name+'</option>');   
    }); 
    var subsection = $('#subid').val();
   // console.log(subsection); return false;
    if(subsection != '')
    {
        $("#subsection option[value=" + subsection + "]").attr('selected', true);
    }
      
    }else{
    $("#subsection").empty();
    }
    }    

    })
}

function subsection(subsection)
{  
    var _token   = $('meta[name="csrf-token"]').attr('content');

    $.ajax({
    url:"{{ route('section-subsection-list') }}",
    method:"get",
    data:{section: subsection, _token:_token},
    success:function(res)
    { 

    if(res){ console.log(res);
    $("#subsubsection").empty();
      $("#subsubsection").append('<option value="">Select Section</option>');
    $.each(res,function(key,value){
      console.log(key,value); 
      $("#subsubsection").append('<option value="'+value.id+'">'+value.name+'</option>');   
    }); 
    var subsubsection = $('#subsubid').val();
    console.log(subsubsection);
    if ( subsubsection != '') {
        $("#subsubsection option[value=" + subsubsection + "]").attr('selected', true);
    };
   

    }else{
    $("#subsubsection").empty();
    }
    }    

    })
}

</script>
@endsection