@extends ('Layouts.Application')

@section ('MainContent')

<div class="row">
	<div class="col-md-12">
		<div class="panel panel-default">
			<div class="panel-heading"><strong>Student Absent Payment Details</strong></div>
			<div class="panel-body">
				@include ('Layouts.ErrorSuccessAndWarninMessages')

				<form class="form-horizontal" role="form" onsubmit="return false;">
					@csrf

					<div class="form-group form-group-sm">
						@include (
							'includes.branch_shift_version_names_block_column',
							['required' => true, 'fieldColWidth' => 2]
						)

						@include ('includes.class_names_block_column', ['required' => true, 'fieldColWidth' => 2])

						@include ('includes.group_names_block_column', ['required' => true, 'fieldColWidth' => 2])

						@include ('includes.section_names_block_column', ['required' => true, 'fieldColWidth' => 2])

						@include ('includes.academic_years_block_column', ['required' => true, 'fieldColWidth' => 2])

						<div class="col-sm-2">
							<label for="branch" class="text-danger control-label text-right">Month</label>
							<select class="form-control" name="generate_month" id="generate_month">
								<option value="">Select</option>
								<option value="1">January</option>
								<option value="2">February</option>
								<option value="3">March</option>
								<option value="4">April</option>
								<option value="5">May</option>
								<option value="6">June</option>
								<option value="7">July</option>
								<option value="8">August</option>
								<option value="9">September</option>
								<option value="10">October</option>
								<option value="11">November</option>
								<option value="12">December</option>
							</select>
						</div>
					</div>

					<div class="form-group form-group-sm">
						<div class="col-sm-12">
							<button type="button" class="btn btn-primary btn-sm btn-block" id="show-absent-student-button">
								<i class="fa fa-list" aria-hidden="true"></i> View Absent Amount
							</button>
						</div>
					</div>
				</form>

				<div id="student_info"></div>
			</div>
		</div>
	</div>
</div>

<script type="text/javascript">
$(document).ready(function () {
	$("#branch_and_version").trigger('change');

	$('#show-absent-student-button').click(function () {
		var generateMonth = $('#generate_month').val() || 0;
		var branch_and_version_id = $('#branch_and_version').val() || 0;
		var class_id = $('#class_name').val() || 0;
		var group_id = $('#group_name').val() || 0;
		var section_id = $('#section_name').val() || 0;
		var academic_year = $('#academic_year').val() || 0;
		var route_parameters = generateMonth + '/' + branch_and_version_id + '/' + class_id
			+ '/' + group_id + '/' + section_id + '/' + academic_year;

		$.ajax({
			url: baseURL + '/!/Attendance/StudentAbsentPayment/viewOrPrint/' + route_parameters,
			type: 'GET',
			success: function (response) {
				$('#student_info').html(response);
				$("input.waive_amount[type='text']").blur(function () {
					var max = parseFloat($(this).attr('max'));
					if ($(this).val() > max) {
						alert("Waive Amount cannot larger than Absent Amount");
						$(this).val(0);
					}
				});
			}
		});

		return false;
	});

	$(document).on('click', '#studentAbsentW_Payment_btn', function () {
		var formdata = $('#student_payment_form').serialize();
		var url = baseURL + '/!/Attendance/StudentAbsentPayment/waive';

		$.ajax({
			data: formdata,
			url: url,
			type: 'post',
			success: function (response) {
				$('#student_info').html(response);
			}
		});
		return false;
	});
});
</script>

@endsection