@extends('layouts.internal')

@section('content')
@section('breadcrumb')
<div class="c-subheader justify-content-between px-3">
<ol class="breadcrumb border-0 m-0 px-0 px-md-3">
<li class="breadcrumb-item"><a href="/"><i class="fa fa-home"></i></a></li>
@if(url()->previous() != url()->current())
<li class="breadcrumb-item"><a href="{{url()->previous()}}">&leftarrow; Previous Page</a></li>
@endif						
<li class="breadcrumb-item"><a href="{{route('newsletter.index')}}">News Letters</a></li>

</ol>
</div>
@endsection


  
          <div class="card ">
          <div class="card-body">
          <div class="table-responsive">
           
            @if(session()->has('success'))
        <div class="alert alert-success">
            {{ session()->get('success') }}
        </div>
        @endif
        @php 
                $frequency = mailFrequency();
              @endphp
            <table id="tbl-list" class="table table-bordered datatable">
            <a class="btn btn-success" href="{{ route('newsletter.create') }}">Create New</a>

                <thead>
                    <tr>
						<th>Subject</th>
						<th>Mail Frequency</th>
						<th>Action</th>
                    </tr>
                </thead>
				<tbody>
					@foreach($records as $record)
					<tr>
						<td style="width:15%;">{{$record->subject}}</td>
						<td style="width:15%;">{{($frequency[$record->mail_frequency] ?? '')}}</td>
						<td style="width:15%;">
						<a href="{{ route('newsletter.edit',$record->id) }}" class="edit" title="Edit" data-toggle="tooltip"><i class="fa fa-pencil-square-o" aria-hidden="true"></i></a>
						<a href="{{ route('newsletterDelete',$record->id) }}" class="edit" title="Delete" data-toggle="tooltip"  onclick="return confirm('Are you sure you want to delete this item?');"><i class="fa fa fa-trash" aria-hidden="true"></i></a>
						<a href="javascript:;" onclick="previewMail('{{$record->id}}', '{{$record->subject}}')" class="edit" title="Preview" data-toggle="tooltip" ><i class="fa fa-eye" aria-hidden="true"></i></a>
						<a href="javascript:;" onclick="sentMail('{{$record->id}}')" class="edit" title="Sent Mail" data-toggle="tooltip" ><i class="fa fa-envelope" aria-hidden="true"></i></a>
                  	</td>
						
					</tr>
					@endforeach
				</tbody>
            </table>
            </div>
</div>

<div class="modal fade" id="previewModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" style="display: none;" aria-hidden="true">
      <div class="modal-dialog modal-lg modal-dialog-scrollable" role="document">
         <div class="modal-content">
            <div class="modal-header">
               <h4 class="modal-title"></h4>
               <button class="close" type="button" onclick="closePopup('previewModal')"><span aria-hidden="true">×</span></button>
            </div>
            <div class="modal-body">
            </div>
         </div>
      </div>
   </div>
   
<script>
$(document).ready(function () {
    $('.datatable').dataTable({
    "bLengthChange": false});
    $('.datatable').attr('style', 'border-collapse: collapse !important');
} );

function previewMail(id, subject){
   
    $.get("{{url('i/newsletter')}}/"+id, function(data) {
            $("#previewModal").find('.modal-title').html(subject);
            $("#previewModal").find('.modal-body').html(data.html);
            $("#previewModal").modal('show');
    });
}

function sentMail(id, subject){
    $('.ajax-loader').css("visibility", "visible");
    $.post("{{url('i/newsletter/mail/sent')}}/"+id, '', function(data) {
        $('.ajax-loader').css("visibility", "hidden");  
        toastr.success(data.message);
        
    });
}
</script>
@endsection