@extends('layouts.main')
@section('title','Evaluator candidate mapping')
@section('content')
<div class="pcoded-content">
  <div class="hme-loading-mask">
    <div class="hme-loading-container">
        <div class="hme-dual-ring"></div>
        <div>Please wait, Loading...</div>
    </div>
  </div>
  <div class="pcoded-inner-content p-0">
    <div class="main-body">
      <div class="page-wrapper p-0">
        <div class="page-header p-15 m-b-0 pro-page-heading1">
          <div class="page-header-title">
            <h4>Evaluator Candidate Mapping</h4>
          </div>

          <!-- Flesh Message Start -->
          @if(Session::has('status'))
            <div class="alert alert-success background-success">
              <button type="button" class="close m-t-0" data-dismiss="alert" aria-label="Close">
                <i class="hiremee-multiply text-white"></i>
              </button>
              <strong>Success</strong> {{ Session::get('status')}}
            </div>
            @elseif(Session::has('error')) 
              <div class="alert alert-danger background-danger">
              <button type="button" class="close m-t-0" data-dismiss="alert" aria-label="Close">
                <i class="hiremee-multiply text-white"></i>
              </button>
              <strong>Error!</strong> {{ Session::get('error') }}
            </div>
          @endif
         
          <!-- Flesh Message End -->
          
          <div class="page-header-breadcrumb p-r-10">
            <ul class="breadcrumb-title">
              <li class="breadcrumb-item">
                @if(Auth::guard('corporate')->user()->user_type == 1)
                  <a href="{{secure_url('company/dashboard') }}">
                @elseif(Auth::guard('corporate')->user()->user_type == 2)
                  <a href="{{secure_url('recruiter/dashboard') }}">
                @endif 
                    <span class="hiremee-home"></span>
                  </a>
              </li>
              <li class="breadcrumb-item"><a href="{{ secure_url('pro/user/evaluator/mapping') }}">Manage Mapping</a></li>
            </ul>
          </div>
        </div>

        <div class="page-body">
           {!! Form::open(["id" => "evalualtor_mapping", "name" => "evalualtor_mapping","method"=>"post","url"=>'pro/evaluator/candidate/submit-mapping']) !!}
          <div class="pageheader">
            <div class="row">
              <div class="col col-md-6 d-flex align-items-center ml-3">
                Evaluator Candidate Mapping
              </div>
            </div>

            <!-- @author Naveenkumar S @version 21.0 -->
              <!-- Start -->
             
              <div class="d-flex align-items-start" style="margin-top: 19px;">
                <div class="col-md-3 text-left  f-w-400"><p class="l-h-0">Please select the User:</p>
                  <div class="input-group">
                    <select class="form-control hme-select-style js-select2" id="evaluator" placeholder="Select User" name="evaluator">
                      <option value="">Please select the User</option>
                      @foreach($corporate_user_dropdown as $user)
                        @php 
                          $role_id = "";
                          $username = $user->recruiterProfile->first_name . "(";
                          foreach($user->getProRoles->whereIn("role_id", [5, 7]) as $role) {
                            $username = ($role->role_id == 5) ? $username . " Evaluator " : $username . " Proof reader ";
                            $role_id = ($role_id == "") ? $role->role_id : $role_id . "," . $role->role_id;
                          }
                          $username = $username . ")";
                          $username = str_replace("  ", " ,", $username);
                        @endphp


                        <option value="{{ $user->id}}" data-role="{{ $role_id }}">{{ $username }}</option>
                      @endforeach
                    </select>
                  </div>
                </div>  
                <div id="assessment_type_field_div" class="form-radio ml-2"><p class="l-h-0">Assessment Type: </p>
                  <div class="radio radiofill radio-primary radio-inline">
                    <label>
                      <input name="assessment_type" class="assessment_type" value="1" type="radio" ><i class="helper"></i>Corporate
                    </label>
                  </div>
                  <div class="radio radiofill radio-primary radio-inline">
                      <label>
                        <input name="assessment_type" class="assessment_type" value="2" type="radio"><i class="helper"></i>Test Inventory
                      </label>
                  </div>
                </div>
 <div class="col-md-4 text-left  f-w-400"><p class="l-h-0">Assessment: </p>
                  <div >
                    <select class="form-control  hme-select-style js-select2" id="assessment_ids" placeholder="Please select the assessments" name="assessment_ids" width="100%">
                      <opion class="w-100">Please select the assessments</opion>
                    </select>
                    <p> <i id="assessment_selection_info">Select "User" and "Assessment Type" to get "Assessment" list</i></p>
                  </div>
                </div>
               
                <div class="col-md-2" style="margin-top: 16px;">
                 
                   <button class="btn btn-primary" type="button" id="get_candidate">List candidates</button> &nbsp;<br>
                   <button class="btn btn-primary d-none" style="margin-top: 10px;" type="button" id="add_mapping">Add Mapping</button>
                </div>
              </div>
             
              <br>
              <!-- End -->
            </div>
            <div id="table_content">
              
            </div>
              {!! Form::close() !!}
          </div>
          <!--<div class="col-md-12 mb-4">
            <div class="text-center">
                <button class="btn btn-outline-info " style="margin: 15px;" id="load_more_assessment" data-page='1'>Load more...</button>
                
            </div>
          </div>-->

        </div>
      </div>
    </div>
  </div>
<div class="md-modal m-w-980 md-effect-1" id="assessment_cmd_view">
   <div class="md-content">
      <button type="button" class="btn btn-primary btn-icon-custom waves-effect md-close login-close-btn" id="clear_assessment_modal"><span class="hiremee-multiply f-18"></span></button>
      <div class="row p-l-15 p-r-15">
         <div class="col-sm-12 col-lg-12">
            <div class="page-header-title m-t-10 m-b-20">
               <h4 class="g-l-b">Assessment comments View</h4>
            </div>
            <div class="min-h-250">
            <div class="form-group" id="_load_assessment_cmd">
            </div>
          </div>
         </div>
      </div>
   </div>
</div>
<div class="md-overlay"></div>
@endsection

@section('footer')
  
  <script type="text/javascript">
    $(function() {
        $("#load_more_assessment").hide();
        $('.assessment_type').prop('checked',false);
        $("#evaluator").change(function() {

          var roles = $(this).find("option:selected").data("role").toString();

          var is_proof_reader = (roles.indexOf('7') != -1) ? true : false;
          var is_evaluator = (roles.indexOf('5') != -1) ? true : false;
          var assessment_type
          var evaluator_id = $(this).val();

          if(is_proof_reader && !is_evaluator) {
            $("#assessment_type_field_div").hide();
            assessment_type = 1;
            $("#assessment_selection_info").html('Select "User" to get "Assessment" list');
          } else {
            $("#assessment_type_field_div").show();
            assessment_type = $("input[name='assessment_type']:checked").val();
            $("#assessment_selection_info").html('Select "User" and "Assessment Type" to get "Assessment" list');
          }
          var show_comments = true;
          if(is_evaluator && !is_proof_reader) {
            show_comments = false;
          }

          if(assessment_type && evaluator_id) {
            getAssessmentDropdownList(evaluator_id, assessment_type);
          }
          //getUserAssessmentList(evaluator_id, 1, show_comments);
          

        });

    $('#table_content').on('click','.page-item',function(e){
        e.preventDefault();
        var x = $(this);
        
        var url=x.closest('li').find('a').attr('href')
        getCandidateList(url);
          
      })

      $('#get_candidate').click(function(e){
         getCandidateList();
      });

      $('#table_content').on('click','#checkall',function(){
          if(this.checked){
            $(".assessment_id_checkbox").each(function(){
              this.checked=true;
              $('#add_mapping').removeClass('d-none');
            })              
          }else{
            $(".assessment_id_checkbox").each(function(){
              this.checked=false;
              $('#add_mapping').addClass('d-none');
            })              
          }
           });
     });
    $('#table_content').on('click','.assessment_id_checkbox',function(){
         if($('.assessment_id_checkbox:checked').length > 0){ 
          $('#add_mapping').removeClass('d-none');
         }else{
          $('#add_mapping').addClass('d-none');
         }
    });

      function getCandidateList(url=''){
        if(url == ''){
          url=baseUrl+'/pro/assessment-map/candidate/list';
        }
        valid = true;
         var evaluator = $("#evaluator").val();
           if(evaluator == "" || evaluator == undefined) {
            swal(
                "Warning!",
                "Please select the evaluator",
                "warning"
              );
            valid = false;
            return false;
          }

         var assessments = $("#assessment_ids").val();
         
         
          var roles = $("#evaluator").find("option:selected").data("role").toString();
          var is_proof_reader = (roles.indexOf('7') != -1) ? true : false;
          var is_evaluator = (roles.indexOf('5') != -1) ? true : false;
          var assessment_type;
          if(is_proof_reader && !is_evaluator) {
            $("#assessment_type_field_div").hide();
            assessment_type = 1;
          } else {
            $("#assessment_type_field_div").show();
            assessment_type = $("input[name='assessment_type']:checked").val();
          }

          var show_comments = true;
          if(is_evaluator && !is_proof_reader) {
            show_comments = false;
          }

          var valid = true;

          if(assessments == "" || assessments == undefined) {
            swal(
                "Error!",
                "Please select the assessment",
                "error"
              );
            valid = false;
          }

          if(valid) {

            $.ajax({
              url: url,
              dataType: "json",
              type: "get",
              data: {"assessment_ids": assessments, "assessment_type": assessment_type,"evaluator":evaluator},
              beforeSend:function(){
                $('.hme-loading-mask').fadeIn();
              },
              success: function(data) {
                $('.hme-loading-mask').fadeOut();
               $("#table_content").html(data.content); 
              }
            });
          }
      }

    function getAssessmentDropdownList(evaluator_id, assessment_type) {
      $.ajax({
        url: baseUrl+'/pro/evaluator/candidate/assessment-dropdown/'+evaluator_id,
        dataType: "json",
        type: "get",
        data: { "type" : assessment_type},
        async: false,
        beforeSend:function(){
          $('.hme-loading-mask').fadeIn();
        },
        success: function(data) {
          $('.hme-loading-mask').fadeOut();
          var option = "<option class='w-100' value=''>Select the assessment</option>";

          $.each(data.dropdown_assessment_list, function(id, optionvalue) {
            option = option + "<option class='w-100' value='" +  id + "'>" + optionvalue + "</option>";
          });
          console.log(option);
          $("#assessment_ids").html(option);
          
        }, 
        error: function (req, status, error) {
          alert("Something went wrong");
          console.log(req);
          console.log(status);
          console.log(error);
        }
      });
    }

    function getUserAssessmentList(evaluator_id, page = 1, show_comments = false) {
      $.ajax({
        url: baseUrl+'/pro/user/assessment/mapping/list/'+evaluator_id,
        dataType: "json",
        type: "get",
        data: {"page": page},
        success: function(data) {
          if(data.page > 1) {
            $("#table_content").append(data.render);
          } else {
            $("#table_content").html(data.render);
          }
          if(data.hasMorePage) {
            $("#load_more_assessment").show();
          } else {
            $("#load_more_assessment").hide();
          }
          if(show_comments) {
            $(".proofreader_ass_cmds").show();
          } else {
            $(".proofreader_ass_cmds").hide();
          }
        }, 
        error: function (req, status, error) {
          alert("Something went wrong");
          console.log(req);
          console.log(status);
          console.log(error);
        }
      });
    }

    $(function() {
      $("#add_mapping").click(function() {
          var evaluator = $("#evaluator").val();

           if(evaluator == "" || evaluator == undefined) {
            swal(
                "Warning!",
                "Please select the evaluator",
                "warning"
              );
            valid = false;
            return false;
          }
          if($('#table_content .singleCheck:checked').length == 0){
            swal(
                "Warning!",
                "Please select candidate",
                "warning"
              );
            valid = false;
            return false;
          }

         var assessments = $("#assessment_ids").val();
          var roles = $("#evaluator").find("option:selected").data("role").toString();
          var is_proof_reader = (roles.indexOf('7') != -1) ? true : false;
          var is_evaluator = (roles.indexOf('5') != -1) ? true : false;
          var assessment_type;
          if(is_proof_reader && !is_evaluator) {
            $("#assessment_type_field_div").hide();
            assessment_type = 1;
          } else {
            $("#assessment_type_field_div").show();
            assessment_type = $("input[name='assessment_type']:checked").val();
          }

          var show_comments = true;
          if(is_evaluator && !is_proof_reader) {
            show_comments = false;
          }

          var valid = true;

          if(assessments == "" || assessments == undefined) {
            swal(
                "Error!",
                "Please select the assessment",
                "error"
              );
            valid = false;
          }

          if(valid) {
            $('#evalualtor_mapping').submit();
          }
      });
    });

   
        $(document).on("click", "input[name='assessment_type']:checked", function() {

          var evaluator_id = $("#evaluator").val();
          var assessment_type = $(this).val();

          if(evaluator_id && assessment_type) {
            var page = 1;

            var roles = $("#evaluator").find("option:selected").data("role").toString();
            var is_proof_reader = (roles.indexOf('7') != -1) ? true : false;
            var is_evaluator = (roles.indexOf('5') != -1) ? true : false;
            var show_comments = true;

            if(is_evaluator && !is_proof_reader) {
              show_comments = false;
            }

            getAssessmentDropdownList(evaluator_id, assessment_type);
            //getUserAssessmentList(evaluator_id, page, show_comments);
          }
          
        });

      $(function() {
        $("#load_more_assessment").click(function() {
          var evaluator = $("#evaluator").val();
          var page = parseInt($(this).data("page")) + parseInt(1);

          var roles = $("#evaluator").find("option:selected").data("role").toString();
          var is_proof_reader = (roles.indexOf('7') != -1) ? true : false;
          var is_evaluator = (roles.indexOf('5') != -1) ? true : false;

          var show_comments = true;
          if(is_evaluator && !is_proof_reader) {
            show_comments = false;
          }

          getUserAssessmentList(evaluator, page, show_comments);
	  $(this).data("page", page);
        });
      });
  $(document).on('click','.proofreader_ass_cmds',function(){ 
   var ass_id = $(this).attr('data-assessment_id');
   var evaluator_id = $(this).attr('data-evaluator_id');
   $.ajax({
      type: "get",
      url: baseUrl +"/pro/assessment/proofreader-commads",
      data:{"assessment_id":ass_id, "evaluator_id": evaluator_id},
      dataType:'html',
      cache:false,  
      success: function(data) {
            $('#assessment_cmd_view').addClass('md-show');
            $("body").find("#_load_assessment_cmd").html(data);
          }
        });
});
  
$('#clear_assessment_modal').click(function(){
    $('#_load_assessment_cmd').html("");
    $('#assessment_cmd_view').removeClass('md-show');
   });




  </script>
@endsection