@extends('admin.layouts.master')
@section('styles')
<link rel="stylesheet" href="{{asset('admin/plugins/select2/css/select2.min.css')}}">
  <link rel="stylesheet" href="{{asset('admin/plugins/select2-bootstrap4-theme/select2-bootstrap4.min.css')}}">
@endsection
@section('contents')
 <div class="content-wrapper">
    <div class="page-header">
      <h3 class="page-title">Employee Nomination</h3>
      <nav aria-label="breadcrumb">
        <ol class="breadcrumb">
          <li class="breadcrumb-item"><a href="#">Dashboard</a></li>
          <li class="breadcrumb-item active" aria-current="page"> Employee Nomination</li>
        </ol>
      </nav>
    </div>
    <div class="row">
      <div class="col-lg-12 grid-margin stretch-card">
         <div class="card">
          <div class="card-body">
              <h4 class="card-title">Start searching to see specific employee details here </h4>
          </div>  
          <div class="row">
            <div class="col-md-4">
              <select class="form-control" name="employee" id="employee">
                <option value="">Please Select Employee</option>

                @foreach($employee as $value)
                <option value="{{$value->id}}">{{$value->name}}</option>
                @endforeach
                
              </select>
            </div>
            <div class="col-md-4">
              <input type="button" class="btn btn-success" onclick="getNameUser()" value="Search" />
            </div>
          </div>
        </div>
      </div>

      <div class="col-lg-12 grid-margin stretch-card " id="employee-data">
       
        
      </div>
     
    </div>
  </div>    
@endsection
@section('scripts')
<script src='https://cdn.jsdelivr.net/npm/fullcalendar@6.0.0/index.global.min.js'></script>
<script src="{{asset('admin/plugins/select2/js/select2.full.min.js')}}"></script>
<script>
  function getNameUser() {
     var employee = $('#employee').val();
     // alert(employee);
      $.ajax({
            url: '{{route('get-employee-nomination')}}',
            type: "get",
            data: {employee:employee},
            success: function (response) {
              // console.log(response);
              $('#employee-data').html(response.data);
            },
            error: function(jqXHR, textStatus, errorThrown) {
               console.log(textStatus, errorThrown);
            }
      });
  }
  $(document).ready(function() {
  });
  function addMember(){

    $('.add-id').html('');
    $('.all-clean').val('');
    $('#title-button').html('Admin');
    $('.modal-add-nomine').modal('toggle');
  }
  function addMemberNew(){

    $('.modal-add-nomine').modal('toggle');
   
    var employee = $('#employee').val();
     // alert(employee);
      $.ajax({
            url: '{{route('add-employee-member')}}',
            type: "get",
            data: {employee:employee},
            success: function (response) {
              // console.log(response);
              $('#employee-data').html(response.data);
            },
            error: function(jqXHR, textStatus, errorThrown) {
               console.log(textStatus, errorThrown);
            }
      });
  }
  function editSubAdmin(id,department,designation,title,name,email,mobile,joining_Date) {
    $('.add-id').html('<input type="hidden" name="id" value="'+id+'">');
    $('#title').val(title);
    $('#department').val(department);
    $('#designation').val(designation);
    $('#name').val(name);
    $('#email').val(email);
    $('#mobile').val(mobile);
    $('#joining_Date').val(joining_Date);
    $('#title-button').html('Update');
    $('.modal-add').modal('toggle');
  }
  $('#department').on('change', function() {
      var department = $('#department').val();
      $.ajax({
          url: '{{route('get-designation')}}',
          type: "get",
          data: {department:department},
          success: function (response) {
            // alert(response.success);
            console.log(response);
            $("#designation").empty();
            $("#designation").append('<option value="">Plese select designation</option>');
            for ( var i = 0, l = response.designation.length; i < l; i++ ) {
               $("#designation").append('<option value=' + response.designationId[i] + '>' + response.designation[i] + '</option>');
            }
          },
          error: function(jqXHR, textStatus, errorThrown) {
             console.log(textStatus, errorThrown);
          }
      });
  });
  function isNumberKey(evt) {
    var charCode = (evt.which) ? evt.which : event.keyCode;
    if ((charCode < 48 || charCode > 57))
        return false;

    return true;
 }
 function changeData(type) {
    $.ajax({
        url: '{{route('change-data-type')}}',
        type: "get",
        data: {department:department},
        success: function (response) {
          alert(response.success);
          
        },
        error: function(jqXHR, textStatus, errorThrown) {
           console.log(textStatus, errorThrown);
        }
    });
 }


</script>

@endsection