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

   <!--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"><a href="#">Home</a></li>
            <li class="breadcrumb-item active">Dashboard</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 customer active & inactive</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>ID</th>
                                <th>Name</th>
                                <th>Contact</th>
                                <th>Email</th>
                                <th>Address</th>
                                <th>KAM</th>
                                <th>Approved</th>
                                <th>Status</th>
                                {{-- <th>View</th> --}}
                            </tr>
                        </thead>
                        <tbody>
            
                            @foreach ($work_order as $client)
            
                            <tr>
                                <td width="5%">{{ $loop->iteration }}</td>
                                <td width="20%">
                                    <a href="javaScript:void(0)" onclick="detailsShow({{ $client->servey_id }})">
                                     {{ $client->cu_company }} 
                                    </a>
                                </td>
                                <td width="10%">{{ $client->cu_contactno }}</td>
                                <td width="10%">{{ $client->cu_email }}</td>
                                <td width="20%">{{ $client->cu_address }}</td>
                                <td width="10%"><span class="badge badge-pill btn btn-primary">{{ ucwords($client->kam_name) }}</span></td>
                                <td width="8%">
                                    <button data-id="{{ $client->cu_id }}" class="btn btn-sm btn-primary" data-toggle="modal" data-target='#practice_modal' onClick="open_container2(this);">
                                        Confirm
                                    </button>
                                </td>
                                <td width="10%">
                                    <button data-id="{{ $client->cu_id }}" class="btn btn-sm btn-warning">
                                        Pending
                                    </button>
                                </td>
                        
                        {{-- <td width="7%">
                        <span>
                        <a href="client_view/{{ $client->cu_id }}" class="btn btn-sm btn-info">
                        <i class="fa fa-eye"></i>
                        </a>
                        </span>
                        </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-lg" role="document">
            <div class="modal-content" style="padding: 15px;">
                <div id="modalContent"></div>
            </div>
        </div>
    </div>
</div>

<script>  
    function open_container2(cu_id)
    {
        $.ajax({
            url:'{{ url('work-order') }}',
            type: 'GET',
// dataType: 'JSON',
            data: { cu_id:cu_id.getAttribute('data-id') },
            success: function(data)
            {                
                $("#serveyDetails").modal('show');
                $("#modalContent").html(data);

// $('#cu_id').val(data.data.cu_id);
// $('#cu_name').val(data.data.cu_name);
// $('#area_id').val(data.data.area);
// $('#ty_id').val(data.data.ty_id);
// $('#cu_company').val(data.data.cu_company);
// $('#cu_contactno').val(data.data.cu_contactno);
// $('#cu_email').val(data.data.cu_email);

// $('#cc_address').val(data.data.cc_address);
// $('#cu_short_name').val(data.data.cu_short_name);
// $('#cu_address').val(data.data.cu_address);
// $('#cu_ip').val(data.data.cu_ip);
// $('#station').val(data.data.station);
// $('#index_no').val(data.data.index_no);
// $('#connect_dt').val(data.data.connect_dt);
// $('#status').val(data.data.status);
// $('#approve_status').val(data.data.approve_status);
// $('#send_mail_status').val(data.data.send_mail_status);
// $('#otc_status').val(data.data.otc_status);
// $('#update_by').val(data.data.update_by);
// $('#update_at').val(data.data.update_at);
// $('#updated_at').val(data.data.updated_at);
// $('#create_by').val(data.data.create_by);
// $('#create_dt').val(data.data.create_dt);
// $('#cu_bandwith').val(data.data.cu_bandwith+'MB');
// $('#cu_youtube').val(data.data.cu_youtube+'MB');
// $('#cu_facebook').val(data.data.cu_facebook+'MB');
// $('#cu_data').val(data.data.cu_data+'MB');
// $('#cu_bdix').val(data.data.cu_bdix+'MB');
// $('#kam_id').val(data.data.kam_id);

// $('#practice_modal').modal('show');                
            }
        });
    }
</script>
<script>  
  function detailsShow(id)
    {
        //alert(id);
        //$("#serveyDetails").modal('show');
        $.ajax({
            url:'{{ url('site_survey_details') }}',
            type: 'GET',
            data: { id:id },
            success: function(data){
                $("#serveyDetails").modal('show');
                $("#modalContent").html(data);
            }
        });
    }
 </script>



@endsection