@extends('layouts/ums_layout')
@section('title', '| New Course Registration')
@section('content')

<style type="text/css">
.searchRow td{padding: 5px;}
.table tr:nth-child(odd) {
 background-color: white !important; 
 border: 1.5px solid #eee;
}
.table-hover tr:hover td {
  background: #d7dce1;
}
</style>

<div class="row add-data-form"  style="padding-bottom: 1%">
  <div class="col-md-12">
    <div class="col-md-2"></div>
    <div class="col-md-8 fullbody">
      <div class="viewTitle" style="border-bottom: 1px solid white;">
        <a href="{{url('ums/viewCourseRegistration/')}}" class="btn btn-info pull-right addViewBtn"><i class="glyphicon glyphicon-th-list viewIcon">
        </i>Course Registration List</a>
      </div>
      <div class="panel panel-default panel-border">
        <div class="panel-heading">
          <div class="panel-title">Edit Course Registration</div>
        </div>
        <div class="panel-body">
          <div class="row">
            <div class="col-md-12">
              <div class="col-md-8">
                {!! Form::open(array('url' => '', 'id' => '', 'role' => 'form', 'class'=>'form-horizontal form-groups')) !!}
                {!! Form::text('id', $value = $editCourseRegistration->id, ['class' => 'form-control hidden', 'id' => 'id', 'type' => 'text']) !!}
                <div class="form-group">
                  {!! Form::label('studentId', 'Student ID:', ['class' => 'col-sm-3 control-label']) !!}
                  <div class="col-sm-9">
                   <select class ="form-control select2" id = "studentId" name="studentId">
                    <option value="">Select one</option>
                    @foreach($student as $students)
                    <option value="{{$students->id}}">{{$students->studentCode}} ({{$students->firstName}})</option>
                    @endforeach
                  </select>
                  <p id='studentIde' style="max-height:3px;"></p>
                </div>
              </div>



              <div class="form-group">
                {!! Form::label('programId', 'Program Name:', ['class' => 'col-sm-3 control-label']) !!}
                <div class="col-sm-9">
                 <select class ="form-control select2" id = "programId" name="programId">
                  <option value="">Select one</option>
                  @foreach($program as $programs)
                  <option value="{{$programs->id}}">{{$programs->fullname}}</option>
                  @endforeach
                </select>
                <p id='programIde' style="max-height:3px;"></p>
              </div>
            </div>


            <div class="form-group">
              {!! Form::label('trimesterId', 'Trimester:', ['class' => 'col-sm-3 control-label']) !!}
              <div class="col-sm-9">
               <select class ="form-control" id = "trimesterId" name="progtrimesterIdramId">
                <option value="">Select one</option>
                @foreach($trimester as $trimesters)
                <option value="{{$trimesters->id}}">{{$trimesters->name}} ({{$trimesters->year}})</option>
                @endforeach
              </select>
              <p id='trimesterIde' style="max-height:3px;"></p>
            </div>
          </div>


          <div class="form-group">
            {!! Form::label('name', 'Search Course:', ['class' => 'col-sm-3 control-label']) !!}
            <div class="col-sm-9">
              <input list="searchResult" id="searchKey" name="searchKey" class="form-control">
              <table style="position: relative;z-index: 10;background-color: #fff;" id="searchTable" class="table table-condensed table-hover table-bordered clickable"> 
              </table>
              <p id='courseName' style="max-height:3px;"></p>
            </div>
          </div>


          {!! Form::hidden('registrationId', $value = null, ['class' => 'form-control', 'id' => 'registrationId', 'type' => 'hidden', 'placeholder' => 'code']) !!}

          {!! Form::hidden('code', $value = null, ['class' => 'form-control', 'id' => 'code', 'type' => 'hidden', 'placeholder' => 'code']) !!}

          {!! Form::hidden('creditHour', $value = null, ['class' => 'form-control', 'id' => 'code', 'type' => 'hidden', 'placeholder' => 'code']) !!}

          {!! Form::hidden('courseId', $value = null, ['class' => 'form-control', 'id' => 'courseId', 'type' => 'hidden', 'placeholder' => 'course']) !!}

          {!! Form::hidden('programId', $value = null, ['class' => 'form-control', 'id' => 'programId', 'type' => 'hidden', 'placeholder' => 'Program']) !!}

          {!! Form::hidden('amount', $value = null, ['class' => 'form-control', 'id' => 'amount', 'type' => 'hidden', 'placeholder' => 'amount']) !!}

          <div class="form-group">
            {{-- {!! Form::label('submit', ' ', ['class' => 'col-sm-12 control-label']) !!}--}}
            <div style="padding-right: 30px;">
              <button class="btn btn-info" id="addCourseList" style="float: right; " type="button">Add</button>
            </div>
          </div>
        </div>
        <div class="row" style="padding-bottom: 20px">
          <div class="col-md-0"></div>
          <div class="col-md-12" style="padding: 0px 45px 0px 45px; " >
            <table id="courseTable" class="table table-bordered table-hover">
              <thead>
                <tr>
                  <th>#SL</th>
                  <th>Code</th>
                  <th>Title</th>
                  <th>Credit Hour</th>
                  <th>Amount</th>
                  <th>Action</th>
                </tr>
              </thead>
              <tbody>
              </tbody>
            </table>

            <p id='tableJVe' style="max-height:3px; color: red;"></p>
          </div>
          <div class="col-md-0"></div>
        </div>
        <div class="form-group">
          {!! Form::label('submit', ' ', ['class' => 'col-sm-3 control-label']) !!}
          <div class="col-sm-9 text-right">
            {!! Form::button('Save', ['id' => 'add', 'class' => 'btn btn-info']) !!}
            {{ Form::reset('Reset', ['class' => 'btn btn-warning']) }}
            <a href="{{url('ums/viewCourseRegistration/')}}" class="btn btn-danger closeBtn">Close</a>
            <span id="success" style="color:green; font-size:16px;" class="pull-right"></span>
          </div>
        </div>


        {!! Form::close()  !!}

        <div class="col-md-4 emptySpace vert-offset-top-4"><img src="{{ URL::to('/') }}/images/image15.png" width="90%" height="" style="float:right"></div>
      </div>
    </div>
  </div>
</div>
<div class="footerTitle" style="border-top:1px solid white"></div>
</div>
<div class="col-md-2"></div>
</div>
</div>
@endsection 
@php 
// echo '<pre>';print_r($viewCourseRegDetails);exit;
@endphp
<script src="{{asset('js/jquery-1.11.1.min.js')}}"></script>

<script type="text/javascript">
  $(document).ready(function(){
    $("#startDate").datepicker({
      changeMonth: true,
      changeYear: true,
      dateFormat: 'yy-mm-dd',

    }); 

    var courseDataArray =
    {
      'registrationDetails': [],
      'registrationSummary': {},
    };

    $("#searchKey").keyup(function(){
      $("#searchTable").show();
      var searchKey = $(this).val();
      $.ajax({
        type: 'post',
        url: "{{url('/ums/searchCourseRegistration')}}",
        data: {
          '_token': $('input[name=_token]').val(),
          'searchKey': searchKey,
          'trimesterId': $("#trimesterId").val(),

        },
        success: function(data) {
          var dataResult = JSON.parse(data);
          var rowHtml = '';
          if(dataResult.length>0)
          {
           for(var i in dataResult)
           {
            rowHtml+= '<tr class="searchRow"><td data-courseid="'+dataResult[i].id+'"  data-title="'+dataResult[i].title+'"  data-credithour="'+dataResult[i].creditHour+'" data-code="'+dataResult[i].code+'" data-amount="'+dataResult[i].amount+'" data-programid="'+dataResult[i].programId+'">'+dataResult[i].title+' ( '+dataResult[i].code+' )</td></tr>';
          }
        }
        else
        {  
          rowHtml+= '<tr class="searchRow"><td style="color:red">No Course Offered for Registration Yet</td></tr>';
        }
        $("#searchTable").html(rowHtml);
      }
    });
    })


    $("#searchTable").on('click', 'td', function(event) 
    {
      $('input[name="searchKey"]').val($(this).attr('data-title') +' ('+ $(this).attr('data-code')+')');
      $('input[name="courseId"]').val($(this).attr('data-courseid'));
      $('input[name="programId"]').val($(this).attr('data-programid'));
      $('input[name="code"]').val($(this).attr('data-code'));
      $('input[name="creditHour"]').val($(this).attr('data-credithour'));
      $('input[name="amount"]').val($(this).attr('data-amount'));
      $("#searchTable").hide();
    });

    $("#add").click(function(){
     console.log(courseDataArray);
     $.ajax({
      type: 'post',
      url: "{{url('/ums/courseRegistrationUpdate')}}",
      data: {
        '_token': $('input[name=_token]').val(),
        'data': courseDataArray,
        'registrationId': $('input[name=registrationId]').val(),
        'deleteIds': deleteIds
      },
      success: function(data) {
       var dataResult = JSON.parse(data);
       if(dataResult=="success")
       {
        swal("Success!", "Course Registration Updated Successfully!", "success");
        window.location = '{{url('/ums/viewCourseRegistration')}}';
      }
    }
  });
   });

    window.onload = function() {

      <br />
<b>Warning</b>:  Undefined variable $viewCourseRegDetails in <b>/home/shikkhaplus/public_html/resources_16_05_2024/views/ums/register/courseRegistration/editCourseRegistration.blade.php</b> on line <b>240</b><br />
<br />
<b>Warning</b>:  foreach() argument must be of type array|object, null given in <b>/home/shikkhaplus/public_html/resources_16_05_2024/views/ums/register/courseRegistration/editCourseRegistration.blade.php</b> on line <b>240</b><br />
       table_render();
     };



     $("#addCourseList").click(function(){
      courseData = {};
      var error = false;
      courseData.studentName = $("#studentId :selected").text();
      courseData.studentId = $("#studentId").val();
      courseData.code = $('input[name="code"]').val();
      courseData.creditHour = $('input[name="creditHour"]').val();
      courseData.amount = $('input[name="amount"]').val();
      courseData.courseName = $('input[name="searchKey"]').val();
      courseData.courseId = $('input[name="courseId"]').val();
      courseData.id = "";

      if(courseData.courseId==''|| courseData.courseName=='')
      {
        $('#courseName').append('<span style="color:red;">Please Select Course</span>');
        error = true;
        return false;
      }
      else
      {
       $('#courseName').html('');
       error = false;
     }


     if(courseData.studentId=='')
     {
      $('#studentIde').append('<span style="color:red;">Please Select Student</span>');
      error = true;
      return false;
    }
    else
    {
      $('#studentIde').html('');
      error = false;
    }

    $.each(courseDataArray['registrationDetails'], function( index, value ) 
    {
      if(courseData.courseId==value.courseId)
      {
        alert("This curse is already taken bellow. Please select another one.");
        $('input[name="searchKey"]').val('');
        $('input[name="searchKey"]').focus();
        error = true;
        return false;
      }
    });


    if(error==false)
    {
      courseDataArray['registrationDetails'].push(courseData);
         //console.log(courseDataArray);
         table_render();
       }
       else
       {
        return false;
      }
    });



     function table_render()
     {
      var table_data = '';
      var i = 1;
      var totalCreditHour = 0;
      var courseNumber = 0;
      var amount = 0;
      $.each(courseDataArray['registrationDetails'], function( index, value ) {
            // console.log(value);
            table_data += '<tr id="'+index+'">';
            table_data += '<td>'+i+'</td>';
            table_data += '<td>'+value.code+'</td>';
            table_data += '<td>'+value.courseName+'</td>';
            table_data += '<td>'+value.creditHour+'</td>';
            table_data += '<td>'+value.amount+'</td>';
            //table_data += '<td>'+value.creditHour+'</td>';
            totalCreditHour = parseInt(totalCreditHour) + parseInt(value.creditHour);
            amount = parseInt(amount) + parseInt(value.amount);
            courseNumber++;
            table_data += '<td><span data-id="'+value.id+'" data-rowid="'+index+'" class="glyphicon glyphicon-trash removeClass"></span></td>';
            table_data += '</tr>';
            i++;
          });
      courseDataArray['registrationSummary'].creditHour = totalCreditHour;
      courseDataArray['registrationSummary'].courseNumber = courseNumber;
      courseDataArray['registrationSummary'].amount = amount;
      courseDataArray['registrationSummary'].studentId =  $("#studentId").val(),
      courseDataArray['registrationSummary'].trimesterId =  $("#trimesterId").val(),
      courseDataArray['registrationSummary'].programId =  $("#programId").val(),
      $("#courseTable >tbody").html(table_data);
      $('input[name="code"]').val('');
      $('input[name="creditHour"]').val('');
      $('input[name="courseName"]').val('');
      $('input[name="courseId"]').val('');
      $('input[name="amount"]').val('');
      $('input[name="searchKey"]').val('');
      $('input[name="searchKey"]').focus();
    }


    var deleteIds = [];
    $("#courseTable").on('click', 'span', function(event) 
    {
     var rowId = $(this).attr('data-rowid');
     var deleteId = $(this).attr('data-id');
     $.each(courseDataArray['registrationDetails'], function( index, value ) {
      if(rowId==index)
      {
        courseDataArray['registrationDetails'].splice(index,1);
      }
    });

     if(deleteId)
     {
      deleteIds.push(deleteId);
    }
    table_render();
    console.log(deleteIds);
  });


    var studentId = '<br />
<b>Warning</b>:  Undefined variable $editCourseRegistration in <b>/home/shikkhaplus/public_html/resources_16_05_2024/views/ums/register/courseRegistration/editCourseRegistration.blade.php</b> on line <b>382</b><br />
<br />
<b>Warning</b>:  Attempt to read property "studentId" on null in <b>/home/shikkhaplus/public_html/resources_16_05_2024/views/ums/register/courseRegistration/editCourseRegistration.blade.php</b> on line <b>382</b><br />
';
    var registrationId = '<br />
<b>Warning</b>:  Undefined variable $editCourseRegistration in <b>/home/shikkhaplus/public_html/resources_16_05_2024/views/ums/register/courseRegistration/editCourseRegistration.blade.php</b> on line <b>383</b><br />
<br />
<b>Warning</b>:  Attempt to read property "id" on null in <b>/home/shikkhaplus/public_html/resources_16_05_2024/views/ums/register/courseRegistration/editCourseRegistration.blade.php</b> on line <b>383</b><br />
';
    $('#studentId').val(studentId);
    $('#registrationId').val(registrationId);
    $('#studentId').prop("selected", true);

    var programId = '<br />
<b>Warning</b>:  Undefined variable $editCourseRegistration in <b>/home/shikkhaplus/public_html/resources_16_05_2024/views/ums/register/courseRegistration/editCourseRegistration.blade.php</b> on line <b>388</b><br />
<br />
<b>Warning</b>:  Attempt to read property "programId" on null in <b>/home/shikkhaplus/public_html/resources_16_05_2024/views/ums/register/courseRegistration/editCourseRegistration.blade.php</b> on line <b>388</b><br />
';
    $('#programId').val(programId);
    $('#programId').prop("selected", true);

    var trimesterId = '<br />
<b>Warning</b>:  Undefined variable $editCourseRegistration in <b>/home/shikkhaplus/public_html/resources_16_05_2024/views/ums/register/courseRegistration/editCourseRegistration.blade.php</b> on line <b>392</b><br />
<br />
<b>Warning</b>:  Attempt to read property "trimesterId" on null in <b>/home/shikkhaplus/public_html/resources_16_05_2024/views/ums/register/courseRegistration/editCourseRegistration.blade.php</b> on line <b>392</b><br />
';
    $('#trimesterId').val(trimesterId);
    $('#trimesterId').prop("selected", true);



  });
</script>