@extends('includes.master')
@section('content')    

<div class="right_col" role="main">
  <div class="row">
    <div class="col-md-12 col-sm-12 col-xs-12">
      <div class="x_panel">

        <div class="x_content">
          <p class="text-muted font-13 m-b-30">
          <b style="font-size: 30px">Dashboard</b>
        
         <table id="datatable" class="table table-striped table-bordered">
            <thead>
              <tr >
                <th>Id</th>
                <th>Employee ID</th>
                <th>Employee Name</th>
                <th>Sum Insured</th>
                <th>Age</th>  
                <th>Insurance Company</th>
                <th>TPA Company</th>
                <th>View Family</th>
                <th>Download Ecard</th>                         
              </tr>
              </thead>
           <tbody>
          
    @foreach($query as $kye=>$val)
      <tr>
        <td>{{$kye+1}}</td>
        <td>{{$val->emp_code}}</td>
        <td>{{$val->emp_name}}</td>
        <td>{{$val->sum_insured}}</td>
        <td>{{$val->age}}</td>    
        <td>{{$val->insurer_name}}</td>
        <td>{{$val->tpa_name}}</td>
        <td><a href="#" onclick="get_emp_list_fn('{{$val->emp_code}}')" class="btn btn-primary">View</a></td>
        <td><a href="{{ $val->ecard_url }}" download><button class="btn btn-primary">Download Ecard</button></a></td> 
      </tr>
    @endforeach
            </tbody>
          </table>
        </div>
      </div>
    </div>
  </div>
</div>


<div id="classModal" class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-labelledby="classInfo" aria-hidden="true">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
          ×
        </button>
        <h4 class="modal-title" id="classModalLabel">
          Family Detail
        </h4>
      </div>
      <div class="modal-body">
        <table id="classTable" class="table table-bordered">
          <thead>
           <tr>
           <th>ID</th>
            <th>Member Name</th>
            <th>Relation</th>
            <th>Date of Birth</th>
            <th>Age</th> 
          </tr> 

        </thead>
        <tbody  id="get_empList">

        </tbody>
      </table>
    </div>
    <div class="modal-footer">
      <button type="button" class="btn btn-primary" data-dismiss="modal">
        Close
      </button>
    </div>
  </div>
</div>
</div>

<script type="text/javascript">
  
   function get_emp_list_fn(emp_code){  
    $.get("{{url('get-family-list')}}",{ emp_code: emp_code},function(data, status, xhr) {

     $('#get_empList').empty();
     var arr=Array();
     $.each(data,function(index,val){
      arr.push('<tr><td>'+(index+1) +'</td><td>'+val.emp_name+'</td><td>'+val.relation_ship+'</td><td>'+val.date_of_birth+'</td><td>'+val.age+'</td></tr>');
    });
     $('#get_empList').append(arr);
     $('#classModal').modal('show')

   }).done(function() { })
    .fail(function(jqxhr, settings, ex) { alert('failed, ' + ex); });

  }
</script>
@endsection