@extends('admin/admin')
	
	@section('content')
	<!-- Breadcrumb-->
	<ol class="breadcrumb">
	  <li class="breadcrumb-item">{{Auth::user()->roles->name}}</li>
	  <li class="breadcrumb-item">
		<a href="{{route('list_userCampaign')}}">{{ __('Campaign') }}</a>
	  </li>
	  <li class="breadcrumb-item active">{{ __('News List') }}</li>
	  <!-- Breadcrumb Menu-->
	  <li class="breadcrumb-menu d-md-down-none">
		
	  </li>
	</ol>
    <!-- Page Content -->
    <div class="container-fluid dashboard-container-new">
        <div class="row justify-content-center">
			<div class="col-sm-12">
                <div class="card">
                  <div class="card-header">
                    <strong>{{ __('News') }}</strong> {{ __('List') }}
                                                  
                      <div class="card-header-actions">
                        <a class="btn btn-sm btn-primary" href="{{url('admin/campaign/user/list')}}" role="button"><i class="fa fa-dot-circle-o"></i> {{ __('Campaign List') }}</a>
                      </div>
                      
                    </div>
					<div id="out" class="alert-success">
						@if (session()->has('success'))
							<h6><center>{{ session('success') }}</center></h6> 

						@endif
					</div>
					
                  <div class="card-body">
					<div class="messages">
					</div>
					
                    <table class="table table-responsive-sm table-hover table-outline mb-0 display" id="template_list">
                       
						<thead class="thead-light">
						
                            <tr>
						    <th >{{ __('Title') }}</th>
							<th >{{ __('Recipient Name')}}</th>
							<th >{{ __('Recipient Phone Number')}}</th>
							<th >{{ __('Recipient Email')}}</th>
							<th >{{ __('Campaign') }}</th>
							<th >{{ __('Created By')}}</th>
							<th >{{ __('News URL') }}</th>
						    <th>{{ __('Action') }}</th>
                            </tr>
							
                        </thead>
                        <tbody>
                         
                        </tbody>
						<tfoot>
							<tr>
							<td><input type="text" data-column="0"  size="10" class="search-input-text"></td>
							<td><input type="text" data-column="1"  size="10" class="search-input-text"></td>
							<td><input type="text" data-column="2"  size="10" class="search-input-text"></td>
							<td><input type="text" data-column="3"  size="10" class="search-input-text"></td>
							<td></td>
							<td></td>
							<td></td>
							<td></td>
							
							</tr>
						</tfoot>
                    </table>          

                  </div>
                  
                </div>
              </div>
		</div>
		
    </div>
@endsection 
@section('footer-scripts')
@parent
<script>
jQuery(document).ready(function() {
	
	jQuery('#template_list').DataTable( {
		"processing": true,
        "serverSide": true,
	    "ajax":{
			'type': 'POST',
			 'url': APP_URL+'/user/news/list',
			 "dataType": 'json',
			 'data':{_token: '{!! csrf_token() !!}',campaign_id:'{!! $campaign_id!!}'}
		},
		 "order": [[ 0, "desc" ]],
		 columnDefs: [
		   { orderable: false, targets: [-1,-2,-3,-4,-5,-6,-7,-8] }
		]
		
    });
	
	jQuery('.search-input-text').on( 'keyup', function () {   // for text boxes
		var i =jQuery(this).attr('data-column');  // getting column index
		var v =jQuery(this).val();  // getting search input value
		
		jQuery('#template_list').DataTable().columns(i).search(v).draw();
		
	});
	jQuery('.search-input-select').on( 'change', function () {   // for select box
		var i =jQuery(this).attr('data-column');
		var v =jQuery(this).val();
		jQuery('#template_list').DataTable().columns(i).search(v).draw();
	});
	
	
	jQuery(document).on('click','.change_status',function(){
		var id = jQuery(this).data('status');
		
		jQuery.ajax({
			url: APP_URL+'/template/ajax_change_template_status',
			type:'post',
			data:{id:id,_token: '{!! csrf_token() !!}'},
			success: function(res)
			{
				//jQuery('.success-span').html('Status changed successfully');
				jQuery('.messages').html('<div class="alert alert-success alert-dismissible fade show" role="alert"><strong>Success!</strong> status changed successfully.<button class="close" type="button" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">×</span></button></div>');
				window.setTimeout(function() {
				jQuery(".alert").fadeTo(500, 0).slideUp(500, function(){
					jQuery(this).remove(); 
				});
			}, 2000);

			}
		});
	});
	
	
	jQuery(document).on('click','.delete-news',function(){
		var news_id = jQuery(this).data('unews');
		
		if (confirm("Do you want to delete?")) {
		jQuery.ajax({
			url: APP_URL+'/user/ajax_news_delete',
			type:'post',
			data:{news_id:news_id,_token: '{!! csrf_token() !!}'},
			success:function(res)
			{
				jQuery('#template_list').DataTable().ajax.reload();
				window.setTimeout(function() {
				jQuery(".alert").fadeTo(500, 0).slideUp(500, function(){
					jQuery(this).remove(); 
				});
			}, 2000);
			}
		});
		}
	});
	
	
	jQuery(document).on('click','.copy-btn',function(){
		var id_string = jQuery(this).attr('id');
		var id_array = id_string.split("-");
		var id = id_array[1];
		
		var copyText = jQuery('#new_url-'+id).attr('href');
		
		document.addEventListener('copy', function(e) {
		  e.clipboardData.setData('text/plain', copyText);
		  e.preventDefault();
	   }, true);
	   document.execCommand('copy');  
		//alert('copied text: ' + copyText); 
		jQuery(this).text('Copied');
		setTimeout(function(){ jQuery('#'+id_string).text('Copy URL'); }, 3000);
		
	});
	window.setTimeout(function() {
				jQuery(".alert").fadeTo(500, 0).slideUp(500, function(){
					jQuery(this).remove(); 
				});
			}, 2000);
	jQuery('.dataTables_filter').hide();
});

</script>
@endsection