@extends('layouts.admin')
@section('content')

<section class="content">
<div class="row">
        <div class="col-md-3 col-sm-6 col-xs-12">
          <div class="info-box">
            <!-- <span class="info-box-icon bg-aqua"></span> -->
            <a href="{{URL::to('account/occupations/create')}}" >
              <button type="button" class="btn btn-block btn-primary btn-lg"><i class="fa-eplus"></i>Add Occupation</button>
            </a>
            <!-- /.info-box-content -->
          </div>
          <!-- /.info-box -->
        </div>

        <!-- /.col -->
        <div class="col-md-3 col-sm-6 col-xs-12">
          <div class="info-box">
           <a href="{{URL::to('account/industries/import')}}" >
              <button type="button" class="btn btn-block btn-primary btn-lg"><i class="fa-eplus"></i>Import CSV File</button>
            </a>
            <!-- /.info-box-content -->
          </div>
          <!-- /.info-box -->
        </div>
        <!-- /.col -->
      </div>

  <div class="box">
        <div class="box-header">
          <h3 class="box-title">Occupations</h3>
        </div>
        <!-- /.box-header -->
        <div class="box-body">
            <table id="news" class="table table-bordered table-hover">
                <thead>
                  <tr>
                    <th>Created Date</th>
                    <th>Code</th>
                    <th>Name</th>
                    <th>Status</th>
                    <th width="15%" class="actalign">Actions</th>
                  </tr>
                </thead>
                <tbody>
                @if(isset($occupations))
                @foreach($occupations as $occupation)
                 <tr>
                  <td>{{$occupation->created_at}}</td>
                  <td>{{$occupation->occupation_code}} </td>
                  <td>{{$occupation->occupation_name}} </td>
                  @if($occupation->is_active == '1')
                    <td>Active </td>
                  @else
                    <td>Inactive </td>
                  @endif
                  <td class="actalign"> 
                    <a class="text-green" title="View" href="{{URL::to('account/occupations/'.$occupation->id.'')}}">
                      <i class="fa fa-fw fa-eye"></i>
                    </a> 
                    <a class="text-blue" title="Edit" href="{{URL::to('account/occupations/'.$occupation->id.'/edit')}}">
                      <i class="fa fa-fw fa-edit"></i>
                    </a> 
                    <a class="text-red delete-btn" title="Delete" data-id='{{$occupation->id}}'>
                      <i class="fa fa-fw fa-remove"></i>
                    </a> 
                  </td>
                </tr>
                @endforeach
                @endif
              </tbody>
            </table>
        </div>
        <!-- /.box-body -->
        </div>
    </div>
    <a data-target="#ConfirmDelete" role="button" data-toggle="modal" id="trigger"></a>
   
</section>

@stop
@section('pageBottomJs')
<style type="text/css">
  .fa-fw {
    width: 2.285714em;
    text-align: center;
  }
  .info-box {
    min-height: 42px;
  }
  .info-box-icon {
    height: 42px;
  }
  /* for Actions alignments in table */
  .actalign{
    text-align: center;
  }
</style> 
<script src="{{ URL::asset('assets/js/dataTables/jquery.dataTables.min.js') }}"></script>
<script src="{{ URL::asset('assets/js/dataTables/dataTables.bootstrap.min.js') }}"></script>
<link rel="stylesheet" href="{{ URL::asset('assets/js/dataTables/dataTables.bootstrap.css') }}">
<script>
    $(document).ready(function () {

    $('#news').dataTable({
        "paging": true,
        "lengthChange": true,
        "searching": true,
        "ordering": true,
        "info": true,
        "autoWidth": false,
        "order": [[0, 'desc']],
        "aoColumnDefs": [
          {"bSortable": false, "aTargets": [4]}
        ],
      });   

    });

    $(".delete-btn").click(function () {
        var id = $(this).attr("data-id");
        $("#confirmButton").html(
           "<a href='/occupations/destroy/"+ id+"'  class='btn btn-danger'>Confirm</a>"

                );
        $('#modal-title').html(
          '<h4 class="modal-title">Occupation deletion</h4>'
          );
        $('#modal-body').html(
          '<p> Do you really want  to delete this element?</p>'
          );
        $("#trigger").click();
    });

</script>
@stop