@extends ('Layouts.Application')

@section ('MainContent')

<div class="row">
	<div class="col-sm-12">
		<div class="panel panel-default">
			<div class="panel-heading">
				<h3 class="panel-title">Result Template Allocation</h3>
			</div>
			<div class="panel-body">
				@if (\App\Models\Permission::checkLinkPermission('ResultTemplateAllocationController', 'Settings', 'create'))
					<a class="btn btn-primary btn-xs" href="{{ route('LoggedIn.Settings.resultTemplateAllocation.allocation') }}">
						<i class="fa fa-plus-circle"></i> Add New
					</a>
				@endif
			</div>

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

<script language="JavaScript" type="text/javascript">
$(document).ready(function() {
	var dataSet = @json($allocatedData);
	let columns = [
		{
			title: "Sl",
			render: function (data, type, row, meta) {
				return meta.row + meta.settings._iDisplayStart + 1;
			}
		},
		{
			title: "Class",
			data: "ClassName",
		},
		{
			title: "Academic Year",
			data: "academic_year",
		},
		{
			title: "Exam Type",
			data: "exam_type_name"
		},
		{
			title: "Template Name",
			data: "template_name",
		},
		{
			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>';
			}
		}
	];

	$("#allocation-table").DataTable({
		data: dataSet,
		columns: columns,
		"order": []
	});
});
</script>

@endsection