@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">
					Employee SMS
					<a href="javascript:void(0)" class="pull-right" id="sms-balance" title="SMS Balance">
						<span class="fa fa-money"></span>
					</a>
				</h3>
			</div>
			<div class="panel-body">
				<form class="form-horizontal">
					@csrf

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

					<div class="form-group form-group-sm">
						<div class="col-sm-12">
							<button class="btn btn-primary btn-block" type="button" id="show-employee-users-button">
								<i class="fa fa-list"></i> View Employee
							</button>
						</div>
					</div>
				</form>
			</div>
		</div>
	</div>
</div>

<div class="row">
	<div class="col-md-12">
		<div id="show-employee-users"></div>
	</div>
</div>

<!-- Modal -->
<div class="modal fade" id="getCodeModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	<div class="modal-dialog modal-sm">
		<div class="modal-content">
			<!-- Modal Head -->
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<span aria-hidden="true">&times;</span>
				</button>
				<h4 class="modal-title text-center" id="myModalLabel"> SMS Balance </h4>
			</div>

			<!-- Modal Body -->
			<div class="modal-body" id="getCode" style="text-align: center">
				<!-- ajax success content here.-->
			</div>
			<!-- Modal footer -->
			<div class="modal-footer">
				<button type="button" class="btn btn-danger" data-dismiss="modal">
					<i class="fa fa-close"></i> Close
				</button>
			</div>
		</div>
	</div>
</div>

<script>
$(document).ready(function () {
	$(document).on('click', '#show-employee-users-button', function () {
		var branch = $('#branch').val() || 0;

		if (branch) {
			$.ajax({
				type: 'GET',
				url: baseURL + '/!/SMS/Employee/get_employee_users/' + branch,
				success: function (response) {
					$('#show-employee-users').html(response);
				}
			});
		} else {
			Swal.fire({
				type: 'warning',
				title: 'Warning!',
				text: 'Please select Branch!'
			});
		}
	});

	$(document).on('click', '#select-all', function () {
		var checkedStatus = (this.checked) ? true : false;

		$('#Table_GetEmployeesForSMS tbody tr').find('td:nth-child(2) :checkbox').each(function () {
			$(this).prop('checked', checkedStatus);
		});
	});

	$(document).on('submit', 'form', function () {
		var msg_type = $('input:radio[name=msg_type]:checked').val() || 0;
		var sms_body = $('#sms-body').val() || 0;

		if (msg_type && sms_body) {
			$.ajax({
				type: 'POST',
				url: baseURL + '/!/SMS/Employee/SendSMS',
				data: $('#SMSBodyForm, #show-employee-users-form').serialize(),
				success: function (response) {
					$('#show-employee-users').html(response);
				}
			});
		} else {
			Swal.fire({
				type: 'warning',
				title: 'Warning!',
				text: 'Please select all fields!'
			});
		}
		return false;
	});

	//get sms blance
	$("#sms-balance").on('click', function () {
		$.ajax({
			type: "GET",
			url: baseURL + '/!/SMS/GeneralStudent/GetSMSBalance',
			success: function (response) {
				$("#getCode").html(response);
				$("#getCodeModal").modal('show');
			}
		});
	});
});
</script>

@endsection