{{\App::setLocale(Session::get('locale'))}}
@extends('admin.layouts.app')
@section('title', 'Memo Inbox')
@section('content')
<section class="content">
	<div class="row">
		<div class="col-xs-12">
			<div class="box">
				<div class="box-body">
					<div class="x_panel">
						<div class="x_title">
							<h2>@lang('admin.memo_inbox')</h2>
							<div class="clearfix"></div>
						</div>
						<div class="x_content">
						   <table id="list_msg" class="table table-bordered table-hover">
								<thead>
									<tr>
										<th>#</th>
										<th>@lang('admin.english_memo')</th>
										<th>@lang('admin.zh_memo')</th>
										<th>@lang('admin.ms_memo')</th>
										<th>@lang('admin.document')</th>
										<th>@lang('admin.date')</th>
										<th>@lang('admin.action')</th>
									</tr>
								</thead>
								<tbody>
								</tbody>
							</table>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="col-xs-12">
			<div class="box">
				<div class="box-header"></div>
				<div class="box-body">
					<div class="x_panel">
						<div class="x_content">
						   <form class="form-horizontal" method="post" enctype="multipart/form-data" role="form" name="compose_msg" id="compose_msg">
								{{ csrf_field() }}
								<div class="col-md-12">
									<div class="form-group">
										<label for="comment">@lang('admin.english_memo'):</label>
										<textarea class="edtr form-control" rows="4" id="en_memo" name="en_memo"></textarea>
									</div>
									
									<div class="form-group">
										<label for="comment">@lang('admin.zh_memo'):</label>
										<textarea class="edtr form-control" rows="4" id="zh_memo" name="zh_memo"></textarea>
									</div>
									
									<div class="form-group">
										<label for="comment">@lang('admin.ms_memo'):</label>
										<textarea class="edtr form-control" rows="4" id="ms_memo" name="ms_memo"></textarea>
									</div>
									
									<div class="form-group"> 
										<label for="comment">@lang('admin.document') (PNG,JPG,JPEG,PDF):</label>
										<input required type="file" name="image" id="image" accept=".PNG,.JPG,.JPEG,.PDF">
									</div>
									
									<button class="btn btn-warning pull-right hvr-rectangle-in" type="submit">@lang('admin.send_memo')</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() {
	$('.edtr').wysihtml5();
	
	$("#list_msg").DataTable({
		oLanguage: {
			sLengthMenu: "@lang('word.sLengthMenu')",
			sLoadingRecords: "@lang('word.sLoadingRecords')", 
			sSearch: "@lang('word.sSearch')",
			sZeroRecords: "@lang('word.sZeroRecords')",
			sInfoFiltered: "@lang('word.sInfoFiltered')",
			sInfoEmpty: "@lang('word.sInfoEmpty')",
			sInfo: "@lang('word.sInfo')",
			sEmptyTable: "@lang('word.sEmptyTable')",
			oPaginate: {
				sNext: "@lang('word.sNext')",
				sPrevious: "@lang('word.sPrevious')",
			}
		},  
		processing: !0,
		serverSide: !0,
		ajax: '{{ route("admin.memo.inbox.data") }}',
		lengthMenu: [10, 25, 50, 75, 100],
		columns: [
			{data: "DT_RowIndex",name: "DT_RowIndex"}, 
			{data: "en_memo",name: "en_memo"}, 
			{data: "zh_memo",name: "zh_memo"}, 
			{data: "ms_memo",name: "ms_memo"}, 
			{data: "documents",name: "documents"}, 
			{data: "created_at",name: "created_at"}, 
			{data: "action",name: "action"}, 
		],
		order: [
			[1, "asc"]
		],
	});
	$("#compose_msg").validate({
		rules: {
			en_memo: {
				required: !0,
			},
			zh_memo: {
				required: !0
			},
			ms_memo: {
				required: !0
			},
			image: {
				required: 0
			},
		},
		messages: {
			en_memo: {
				required: "@lang('inbox.msg_subject_required')"
			},
			zh_memo: {
				required: "@lang('inbox.msg_message_required')"
			},
		},
		submitHandler: function(e) {
			swal({
				title: "",
				text: "Processing...",
				imageUrl: "{{asset('assets/images/ajax-loader.gif')}}",
				showConfirmButton: false,
			});
			
			var form = $('#compose_msg').get(0);
			var formData = new FormData(form);
			
			console.log(formData);
			$.ajax({
				url: '{{route("admin.memo.add.save")}}',
				type: 'POST',
				data: formData, 
				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");
					}
				},
				cache: false,
				contentType: false,
				processData: false
			});
		}
	});
	$("#list_msg").on("click",".del_msg", function() {
		swal({
			  title: "",
			  text: "Processing...",
			  imageUrl: "{{asset('assets/images/ajax-loader.gif')}}",
			  showConfirmButton: false,
		});
		$.ajax({
			url:"{{ route('admin.memo.delete.save') }}",
			type:'POST',
			data:{
				mid: $(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