@extends('admin.layouts.app')
@section('title', 'Inbox')
@section('content')
<section class="content">
	<div class="row">
		<div class="col-xs-8">
			<div class="box">
				<div class="box-header"></div>
				<div class="box-body">
					<div class="x_panel">
						<div class="x_title">
							<h2>Inbox</h2>
							<div class="clearfix"></div>
						</div>
						<div class="x_content">
						   <table id="list_msg" class="table table-bordered table-hover">
								<thead>
									<tr>
										<th>#No</th>
										<th>From</th>
										<th>To</th>
										<th>Subject</th>
										<th>Message</th>
										<th>Date</th>
										<th>Action</th>
									</tr>
								</thead>
								<tbody>
								</tbody>
							</table>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="col-xs-4">
			<div class="box">
				<div class="box-header"></div>
				<div class="box-body">
					<div class="x_panel">
						<div class="x_title">
							<h2>Compose Message</h2>
							<div class="clearfix"></div>
						</div>
						<div class="x_content">
						   <form class="form-horizontal" action="" role="form" method="post" name="compose_msg" id="compose_msg">
								{{ csrf_field() }}
								<div class="col-md-12">
									<div class="form-group">
										<label for="comment">Send to all member?:</label>
										<input id="sendtoall" name="sendtoall" type="checkbox">
									</div>
									<div class="form-group" id="member_id_txt">
										<label for="comment">Member Username:</label>
										<input class="form-control" placeholder="1001" name="msg_to" id="msg_to" value="" type="text">
									</div>
									<div class="form-group">
										<label for="comment">Subject:</label>
										<input class="form-control" placeholder="Subject" name="msg_subject" id="msg_subject" value="" type="text">
									</div>
									<div class="form-group">
										<label for="comment">Your Message:</label>
										<textarea class="form-control" rows="4" id="msg_message" name="msg_message"></textarea>
									</div>
									<button class="btn btn-warning pull-right hvr-rectangle-in" type="submit">Send Message</button>
								</div>
							</form>
						</div>
					</div>
				</div>
			</div>
		</div>
    </div>
</section>
  
@endsection
@section('extra-script')
<link rel="stylesheet" href="{{asset('css/sweetalert.css')}}">
<script src="{{asset('js/sweetalert.min.js')}}"></script>
<script src="//cdn.datatables.net/1.10.15/js/jquery.dataTables.min.js"></script>
<link href="//cdn.datatables.net/1.10.15/css/jquery.dataTables.min.css" rel="stylesheet">
<script src="//cdn.datatables.net/1.10.15/js/dataTables.material.min.js"></script>
<style>
.error {
  color: red;
}
.dataTables_processing{position:absolute!important;top:50%!important;left:50%!important;width:250px!important;height:80px!important;margin-left:-125px!important;margin-top:-15px!important;padding:15px 0 30px!important;border:1px solid #ddd!important;text-align:center!important;color:#444!important;font-size:14px!important;background:url(../img/loading_bar.gif) no-repeat center 38px #fff!important;box-shadow:2px 2px 5px #444!important;-moz-box-shadow:2px 2px 5px #444!important;-webkit-box-shadow:2px 2px 5px #444!important;z-index:9999!important}</style>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.16.0/jquery.validate.min.js"></script>

<script>
$(function() {
	$("#list_msg").DataTable({
		processing: !0,
		serverSide: !0,
		ajax: '{{ route("admin.message.datatable") }}',
		lengthMenu: [10, 25, 50, 75, 100],
		columns: [
			{data: "DT_RowIndex",name: "DT_RowIndex"}, 
			{data: "msg_from",name: "msg_from"}, 
			{data: "msg_to",name: "msg_to"}, 
			{data: "subject",name: "subject"}, 
			{data: "message",name: "message"}, 
			{data: "created_at",name: "created_at"}, 
			{data: "action",name: "action"}, 
		],
		order: [
			[1, "asc"]
		],
	});
	$("#compose_msg").validate({
		rules: {
			msg_to: {
				required: function(e) {
					if($("#sendtoall").is(':checked')){
						return false;
					}else{
						return true;
					}
				}
			},
			msg_subject: {
				required: !0,
			},
			msg_message: {
				required: !0
			},
		},
		messages: {
			msg_to: {
				required: "@lang('inbox.msg_to_required')"
			},
			msg_subject: {
				required: "@lang('inbox.msg_subject_required')"
			},
			msg_message: {
				required: "@lang('inbox.msg_message_required')"
			},
		},
		submitHandler: function(e) {
			swal({
				title: "",
				text: "Processing...",
				imageUrl: "{{asset('assets/images/ajax-loader.gif')}}",
				showConfirmButton: false,
			});
			$.ajax({
				url: '{{route("admin.message.compose")}}',
				type: 'POST',
				data: $('#compose_msg').serialize(),
				success: function(data) {
					if (data.error == 200) {
						swal({
							title: "Message",
							text: data.message,
							type: "success",
						}, function() {
							window.location.reload();
						});
					} else {
						swal("Message", data.message, "error");
					}
				}
			});
		}
	});
	$("#list_msg").on("click",".del_msg", function() {
		swal({
			  title: "",
			  text: "Processing...",
			  imageUrl: "{{asset('assets/images/ajax-loader.gif')}}",
			  showConfirmButton: false,
		});
		$.ajax({
			url:"{{ route('admin.message.delete') }}",
			type:'POST',
			data:{
				msg_id: $(this).attr('data-value'),
				"_token": "{{ csrf_token() }}",
				"uid": "{{ Auth::guard('admin')->id() }}",
				},
			success:function(data){
				if(data.error==200){
					swal({
						title: "Message",
						text: data.message,
						type: "success",
						},
						function(){
							 window.location.reload();
						});			
				}
				else{
					swal("Message", data.message, "error");
				}
			}
			 
		});
	})
});
</script>
@endsection