@extends ('Layouts.Application')

@section ('MainContent')

<style>
@media only screen and (max-width: 767px) {
  #show-subjects {
    margin-top: 5px;
  }
}
</style>

<div class="row">
  <div class="col-sm-12">
    <div class="panel panel-default">
      <div class="panel-heading">
        <h3 class="panel-title">
          <strong>
            Subject Privileges

            @if (\App\Models\Permission::checkLinkPermission('SubjectPrivilegeController', 'Settings', 'create'))
              <a class="btn btn-primary btn-xs pull-right" href="{{ route('LoggedIn.Settings.Subject.Create') }}">
                <i class="fa fa-plus-circle"></i> Add New Privilege
              </a>
            @endif
          </strong>
        </h3>
      </div>
      <div class="panel-body">
        <form class="form-inline">
          @include ('includes.branch_shift_version_names', ['labelColWidth' => 1, 'fieldColWidth' => 2])
          
          @include ('includes.class_names', ['labelColWidth' => 1, 'fieldColWidth' => 2])
          
          @include ('includes.group_names', ['labelColWidth' => 1, 'fieldColWidth' => 2])


          <div class="col-sm-1">
            <button type="button" class="btn btn-primary btn-sm" id="show-subjects">
              <i class="fa fa-eye"> Show</i>
            </button>
          </div>
        </form>
      </div>

      <div class="table-responsive">
        <table class="table table-striped table-bordered table-hover" id="subject-table">
        </table>
      </div>
    </div>
  </div>
</div>

@if (\App\Models\Permission::checkLinkPermission('SubjectPrivilegeController', 'Settings', 'edit'))
<script>
  var canEditSubject = true;
</script>
@endif

<script>
$(document).ready(function () {
  var dataSet = @json($subjects);

  let columns = [
    {
      title: "Subject Name",
      data: "subject_name"
    },
	{
    	title: "Branach-Shif-Version",
    	data: null,
    	render: function (data) {
    		return data.school_version_name;
    	}
	},
    {
      title: "Class",
      data: "ClassName",
    },
    {
      title: "Group",
      data: "GroupName",
    },
    {
      title: "Status",
      data: "is_active",
      render: function (data) {
        return data == 1 ? '<span class="label label-success">Active</span>' : '<span class="label label-danger">Inactive</span>';
      }
    }
  ];

  if (canEditSubject) {
    columns.push({
      title: "Link",
      data: "id",
      render: function (data) {
        return '<a class="btn btn-primary btn-small" href="' + baseURL + '/!/Settings/SubjectPrivileges/'
          + data + '/edit"><i class="fa fa-pencil-square-o"></i> Edit</a>';
      }
    });
  }

  $('#subject-table').DataTable({
    data: dataSet,
    columns: columns
  });

	$(document).on('click', '#show-subjects', function () {
	    
		var branch_and_version_id = $('#branch_and_version').val();
		var class_id = $('#class_name').val();
		var group_id = $('#group_name').val();

		if (branch_and_version_id && class_id && group_id) {
			$.ajax({
				type: 'GET',
				url: baseURL + '/!/Settings/Subject/show_subjects/' + branch_and_version_id + '/' + class_id + '/' + group_id,
				success: function (response) {
					$('#subject-table').dataTable().fnClearTable();
					$('#subject-table').dataTable().fnAddData(response);
				}
			});
		}
	});
});
</script>

@endsection