@extends('layout')
@section('content')

@if (session('status'))
<div class="alert alert-success" role="alert">
    <button type="button" class="close" data-dismiss="alert">×</button>
    {{ session('status') }}
</div>
@elseif(session('failed'))
<div class="alert alert-danger" role="alert">
    <button type="button" class="close" data-dismiss="alert">×</button>
    {{ session('failed') }}
</div>
@endif


   <!--Content Header (Page header)-->
   <div class="content-header row align-items-center m-0">
    <nav aria-label="breadcrumb" class="col-sm-4 order-sm-last mb-3 mb-sm-0 p-0 ">
        <ol class="breadcrumb d-inline-flex font-weight-600 fs-13 bg-white mb-0 float-sm-right">
            <li class="breadcrumb-item">Customer</li>
            <li class="breadcrumb-item active">Pending Work Order</li>
        </ol>
    </nav>
    <div class="col-sm-8 header-title p-0">
        <div class="media">
            <div class="header-icon text-success mr-3"><i class="typcn typcn-spiral"></i></div>
            <div class="media-body">
                <h1 class="font-weight-bold">Pending Work Order</h1>
                <small>With new customer</small>
            </div>
        </div>
    </div>
</div>

<div class="body-content">
   <div class="row">
       <div class="col-lg-12">
           <div class="card">
               <div class="card-body">
                   <div class="table-responsive">
                     <table class="table display table-bordered table-striped table-hover basic dataTable no-footer" id="DataTables_Table_0" role="grid" aria-describedby="DataTables_Table_0_info">
                        <thead>
                            <tr>
                            <th>SL</th>
                            <th>Company</th>
                            @if((Auth::user()->getRoleNames()[0]=='Support') || (Auth::user()->getRoleNames()[0]=='Infrastructure'))
                            <th>Processing</th>
                            @else
                            <th>Name</th>
                            <th>Designation</th>
                            <th>Mobile</th>
                            <th>Email</th>                            
                            @endif

                            <th>KAM</th>
                            <th>
                            {{-- Forward --}}
                            </th>
                            
                            </tr>
                            </thead>
                            <tbody>

                                                        @foreach ($result as $key=>$client)
                                                        <tr id="row_to_hide_{{ $key }}">
                            <td>{{ $client->code }}</td>
                            <td class="text-capitalize"><a href="javaScript:void(0)" onclick="detailsShow({{ $client->survey_id }})"> {{ $client->company_name }} </a></td>

                            @if((Auth::user()->getRoleNames()[0]=='Support'))
                            <td>
                                <div class="custom-control custom-switch">
                                    <input type="checkbox" class="custom-control-input" id="support_processing{{ $client->id }}" name="support_processing{{ $client->id }}" value="{{ $client->id }}" onchange="processingStart({{ $client->id }})" @if($client->support_processing=="Yes") checked @endif>
                                    <label class="custom-control-label" for="support_processing{{ $client->id }}"></label>
                                </div>
                            </td>
                            @elseif((Auth::user()->getRoleNames()[0]=='Infrastructure'))
                            <td>
                                <div class="custom-control custom-switch">
                                    <input type="checkbox" class="custom-control-input" id="infrastructure_processing{{ $client->id }}" name="infrastructure_processing{{ $client->id }}" value="{{ $client->id }}" onchange="processingStart({{ $client->id }})" @if($client->infrastructure_processing=="Yes") checked @endif>
                                    <label class="custom-control-label" for="infrastructure_processing{{ $client->id }}"></label>
                                </div>
                            </td>
                            @else
                            <td>{{ $client->accounts_name }}</td>
                            <td>{{ $client->accounts_designation }}</td>
                            <td>{{ $client->accounts_mobile }}</td>
                            <td>{{ $client->accounts_email }}</td>
                            @endif                            
                            
                            <td>{{ $client->kam }}</td>
                            <td id="status_change{{ $client->id }}">
                                                        <button type="button" class="btn btn-sm btn-info" onclick="IPConfig({{$client->id}},{{$client->survey_id}})"><i class="typcn typcn-cog-outline"></i> IP Configuration</button>
                                                        </td>
                            
                            </tr>
                            <tr id="message{{ $key }}" style="display:none;">
                                <td colspan="7">
                                    <input type="text" name="note" id="note{{ $key }}" class="form-control" placeholder="Remark">
                                </td>
                                <td>
                                    <button type="button" class="btn btn-sm btn-success" onclick="reviewSubmit({{ $key }},'{{ $client->id }}','{{ $client->survey_id }}')">Submit</button>
                                </td>
                            </tr>
                            @endforeach
                            
                            </tbody>
                     </table>
                   </div>
               </div>
           </div>
       </div>
   </div> 
</div><!--/.body content-->
</div>

<div class="modal fade" id="serveyDetails" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-body">
        <div class="modal-dialog modal-xl" role="document">
            <div class="modal-content" style="padding: 15px;">
                <div id="modalContent"></div>
            </div>
        </div>
    </div>
</div>

<input type="hidden" id="userType" value="{{ Auth::user()->getRoleNames()[0] }}">

<script type="text/javascript">

function approvel_change_status(sl,approve_status,cu_id,survey_id)
{
    
    let confirmAction = confirm("Are you sure you want to approved this workorder?");
    if (confirmAction) {
      //alert();
        $.ajax({
        type: "GET",
        url: '/approvel_change_status',
        data: {'status': approve_status, 'id': cu_id, 'survey_id': survey_id},
        success: function(data){
            
            $('#row_to_hide_'+sl).remove();

            Toastify({
              text: "Successfully workorder Forward",
              duration: 4000,
              destination: "https://github.com/apvarun/toastify-js",
              newWindow: true,
              close: true,
              gravity: "top", // `top` or `bottom`
              positionRight: true, // `true` or `false`
              backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
            }).showToast();

        }
        });
        return false;
    } 
}

function review(sl,cu_id,survey_id)
{
    $("#message"+sl).toggle();
}

function reviewSubmit(sl,cu_id,survey_id)
{
    var note = $("#note"+sl).val();
    if(note=="")
    {
        $('#note'+sl).css('border-color', 'red');
        return false    
    }
    $('#note'+sl).css('border-color', '');
    
    $.ajax({
        type: "GET",
        url: '/review',
        data: {'id': cu_id, 'note': note},
        success: function(data){
            
            // $('#row_to_hide_'+sl).remove();
            $("#msg"+sl).show();
            $("#message"+sl).hide();
            $("#forward"+sl).hide();

            Toastify({
              text: "Successfully workorder Review send",
              duration: 4000,
              destination: "https://github.com/apvarun/toastify-js",
              newWindow: true,
              close: true,
              gravity: "top", // `top` or `bottom`
              positionRight: true, // `true` or `false`
              backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
            }).showToast();

        }
        });
}


function POPConfig(id,servey_id)
{
    //alert(id);
    $.ajax({
        url:'{{ url('pop-config') }}',
        type: 'GET',
        data: {cu_id:id, servey_id:servey_id},
        success: function(data)
        {                
            $("#serveyDetails").modal('show');
            $("#modalContent").html(data);               
        }
    });
}

function IPConfig(id,servey_id)
{
    //alert(id);
    $.ajax({
        url:'{{ url('work-order') }}',
        type: 'GET',
        data: {cu_id:id, servey_id:servey_id},
        success: function(data)
        {                
            $("#serveyDetails").modal('show');
            $("#modalContent").html(data);               
        }
    });
}

function detailsShow(id)
{
    $.ajax({
        url:'{{ url('client_details') }}',
        type: 'GET',
        data: { id:id },
        success: function(data){
            $("#serveyDetails").modal('show');
            $("#modalContent").html(data);
        }
    });
}

function processingStart(id)
{    
    var userType = $("#userType").val();

    if(userType=='Support')
    {
        var checkBox = document.getElementById("support_processing"+id);
        if (checkBox.checked == true)
        {
            var checked = "Yes";
        }
        else
        {
            var checked = "No";
        }
    }
    else
    {
        var checkBox = document.getElementById("infrastructure_processing"+id);
        if (checkBox.checked == true)
        {
            var checked = "Yes";
        }
        else
        {
            var checked = "No";
        }
    } 

    $.ajax({
        type: "GET",
        url: '/work-order-processing',
        data: {'id': id, 'checked':checked},
        success: function(data){
            
            Toastify({
              text: "Work Order Processing...",
              duration: 4000,
              destination: "https://github.com/apvarun/toastify-js",
              newWindow: true,
              close: true,
              gravity: "top", // `top` or `bottom`
              positionRight: true, // `true` or `false`
              backgroundColor: "linear-gradient(to right, #00b09b, #96c93d)",
            }).showToast();

        }
        });
}

</script>


@endsection