@extends('layouts.master')
@section('title', 'Maintenance Task')

@section('breadcrumb')
<nav aria-label="breadcrumb">
                        <ol class="breadcrumb">
                            <li class="breadcrumb-item"><a href="#">Administrative settings</a></li>
                            <li class="breadcrumb-item active" aria-current="page">Maintenance Master</li>
                        </ol>
                    </nav>
 @endsection

@include('layouts.includes.alert')
@section('content')
<div class="pista-wrapper ">
                        <div class="row">
                            <div class="col-8 row">
                                    <div class="col-4"></div> 
                                    <div class="col-4"></div>
                            </div>
                            <div class="col-4">
                                <div class="float-right">
                                    <!-- <a href="{{ route('company.index') }}"><button type="button" class="btn btn-outline-primary"><i class="fa fa-history"></i> Refresh</button></a>  -->
                                    <a href="{{ route('maintenancetask.create') }}"><button type="button" class="btn btn-outline-primary ml-3"><i class="fa fa-tasks"></i> Add Task</button></a>
                                    
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="detailed-info-table">
                        <div class="info-table">
                             <table  class="table table-striped data-table">
                                <thead class="thead-dark">
                                    <tr>
                                        <th>Maintenance Id</th>
                                        <th>Task Name</th>                                       
                                        <th>Cost</th>
                                        <th>Time Hour(s)</th>
                                        <th>Status</th>
                                        <th class="text-center">Actions</th>    
                                    </tr>
                                    
                                </thead>
                                <tbody class="tbody searchable">

                                </tbody>
                            </table>
                        </div>
                    </div>
<div class="modal-container"></div>
@endsection

@section('script')
<script>
  


        var maintenance_table = $('.data-table').DataTable({            
            order: [[ 0, "desc" ]],
            processing: true,
            serverSide: true,
           // dom: Bfrtip,
            pageLength: 50,
            lengthChange: false,
            ajax: "{{ url('/maintenancetask/ajax-list')}}",
            columns: [
                { data: 'id', name: 'id', visible:false,searchable:false },
                { data: 'task_name', name: 'task_name' },
                { data: 'cost', name: 'cost',searchable:false },
                { data: 'idle_time', name: 'idle_time',searchable:false },
                { data: 'is_active', name: 'is_active',searchable:false },                
                { data: 'action', name: 'action', orderable: false, searchable: false}
            ]
        });

        //$(".dataTables_filter").css("display","none");
        $('.dataTables_search').on( 'keyup click', function () {   // for text boxes
          var v =$(this).val();  // getting search input value
          //maintenance_table.search(v).draw();
          maintenance_table.columns(1).search( v ).draw();
        });
        // $('#maintenance_search').on( 'change', function () {   // for text boxes
        //   var v =$(this).val();  // getting role id
        //  maintenance_table.columns(1).search( v ).draw();
        //  maintenance_table.search(v).draw();
        // });
        $('#unit_id').on( 'change', function () {   // for text boxes
          var v =$(this).val();  // getting role id
         // maintenance_table.columns(5).search( v ).draw();
         maintenance_table.columns(0).search( v ).draw();
        });
        $('#task_id').on( 'change', function () {   // for text boxes
          var v =$(this).val();  // getting role id         
         maintenance_table.columns(1).search( v ).draw();
        });

    function ajax_delete(_id){

    bootbox.confirm("Are you sure you want to Delete!", function(result){
      if(result==true){
        startLoading('Please wait....');
      $.ajax({
        type: "DELETE",
        url : "{{ url('/maintenancetask/delete') }}/"+_id,
        dataType: "JSON",
        data : {"_token": "{{ csrf_token() }}"},
        success: function(data)
        {
          if(data.status === true){  
               startLoading('Data Deleted Successfully.')
              window.location.href = "{{ route('maintenancetask.index') }}";
          }else{
              bootbox.alert('There is error to delete record.');
          }         
        }
      });
    }
  });
    }
    
    function change_status(_id){
      // bootbox.confirm("This is the default confirm!", function(result){ console.log('This was logged in the callback: ' + result); });

     bootbox.confirm({
      message: "Are you sure you want to change status!",
    buttons: {
        confirm: {
            label: 'Yes',
            className: 'btn-success'
        },
        cancel: {
            label: 'No',
            className: 'btn-danger'
        }
    },
    callback: function (result) {
      if(result==true){
        startLoading('Please wait....');
         $('.modal-container').load("{{ url('/maintenance/changestatus') }}/"+_id,function(responseTxt, statusTxt, xhr){
       //modal.find('.modal-body').html(result);   
       if(statusTxt=='success'){
         stopLoading();   
        $('#statusModal').modal({show:true});     
      }
       });
     
    }
  }
      });
    
    }
</script>
@endsection