@extends('customer-service.layout.master')
@section('ptitle','Customer Service')
@section('page_title', 'Customers & Subscribers')
@section('subpage', 'Graph & Summary Report')
@section('img_profile', asset($user->StaffDetail->user_pic))
@section('login_name', $user->StaffDetail->name )
@section('last_login', $user->last_login_at )

@section('content')
	<style>
		.ui-tabs .ui-tabs-nav li.ui-tabs-active a { color: #EA5730 !important; }
		.ui-widget-content .bRed { color: #fff !important; }
	</style>
	<!-- Table dealer -->
	<div class="fluid">
		<div class="widget grid12">		
			<div class="whead"><h6>Customer's List  ( Resident & Business )</h6></div>
			<div id="dyn1" class="responsive shownpars cuss">
				<a class="tOptions" title="Options"><img src="{{ url('assets/img/icons/options') }}" alt="" /></a>
				@if($user->StaffDetail->position == 'Customer Service')
				<table id="customer" cellpadding="0" cellspacing="0" border="0" class="dTable tMedia" width="100%">
					<thead>
						<tr>
							<th>#</th>
							<th>Type Application</th>
							<th>Customer Name</th>
							<th>Contact No.</th>
							<th>Unit No.</th>
							<th>Building</th>
							<th>Project Type</th>
							<th>Street</th>
							<!-- <th>Postcode</th> -->
							<th>Need Phone</th>
							<th>Email</th>
							<th>W/O</th>
							<th width="90">Actions</th>
						</tr>
					</thead>
				</table>
				@elseif($user->StaffDetail->position == 'Careline')
				<table id="view_customer" cellpadding="0" cellspacing="0" border="0" class="dTable tMedia" width="100%">
					<thead>
						<tr>
							<th>#</th>
							<th>Type Application</th>
							<th>Customer Name</th>
							<th>Contact No.</th>
							<th>Unit No.</th>
							<th>Building</th>
							<th>Project Type</th>
							<th>Street</th>
							<th>Need Phone</th>
							<th>Email</th>
						</tr>
					</thead>
				</table>
				@endif
			</div> 		
			<div class="dialog-delete" title="Delete Customer">
		        <p id="inner-delete"></p>
		    </div>		
		</div>
	</div>
@endsection

@section('external_js')
<script>
	function deleteA(cid,name) {
		var cid = cid;
		var name = name;

		$('.dialog-delete').attr('data-id' , cid); 
		document.getElementById("inner-delete").innerHTML = "<p>Are you sure want to delete this Customer ( " + name + " )?</p>";

		$('.dialog-delete').dialog('open');
		return false;
	};

	$(document).ready(function(){
		var origin   = window.location.origin; 

			//===== Dynamic table toolbars =====//		
			
			$('#dyn1 .tOptions').click(function () {
				$('#dyn .tablePars').slideToggle(200);
			});	
			
			$('.tOptions').click(function () {
				$(this).toggleClass("act");
			});
			
			//======= Filter data table ========//

			 var table = $('#customer').DataTable({
				"bJQueryUI": false,
				"bAutoWidth": true,
				"bSort": false,
				"sPaginationType": "full_numbers",
				"sDom": '<"tablePars"fl>t<"tableFooter"ip>',
				"oLanguage": {
					"sLengthMenu": "<span class='showentries'>Show entries:</span> _MENU_"
				},
				"ordering": false,
				"serverSide": true,
				"processing": true,
				"ajax": "{{ url('/customer-service/get-all-new-customer/null/null/null') }}",
				"columns": [
					{ "data": "formT","name": "formT"},
					{ "data": "type","name": "type"},
					{ "data": "name","name": "name"},
					{ "data": "phone","name": "phone"},
					{ "data": "unit","name": "unit"},
					{ "data": "building","name": "building"},
					{ "data": "projectT", "name": "projectT"},
					{ "data": "street","name": "street"},
					// { "data": "postcode", "name": "postcode"},
					{ "data": "need_phone","name": "need_phone"},
					{ "data": "email","name": "email"},
					{ "data": "action1","name": "action1"}, 
					{ "data": "action2","name": "action2"}, 
				],	
				 "columnDefs": [
				 	{
						"render": function ( data, type, row ) {
							if (data.indexOf("New/") >= 0) {
								var split = data.split('/');
								return '<small class="label label-warning">'+split[0]+'</small>&nbsp;'+split[1];
							}else {
								return data;
							}
						},
						"targets": 0
					},
					{
						"render": function ( data, type, row ) {
							if (data.indexOf("D/") >= 0) {
								var split = data.split('/');
								return '<small class="label label-purple">'+split[0]+'</small> &nbsp;'+split[1];
							}else {
								return data;
							}
						},
						"targets": 2
					},
					{
						"render": function ( data, type, row ) {
							if(data == 'unverified'){
								var link = "{{ url('/customer-service/update-email-status') }}"+"/"+row.action2;
								return '<div class="btn-group"><a href="" class="tablectrl_medium bRed tipS" data-toggle="dropdown" original-title="Waiting for verifying"><span class="iconb" data-icon=""></span></a>  <ul class="dropdown-menu pull-right"><li><a href="'+link+'">Force Verify</a></li></ul></div>';
							}else {
								return '<a class="tablectrl_medium bGreen isDisabled tipS" link-disabled="" original-title="Success verifying"><span class="iconb" data-icon=""></span></a>';
							}
						},
						"targets": 9
					},
					{
						"render": function ( data, type, row ) {
							if(data != ''){
									if (data.indexOf("Non/") >= 0) {
										var split = data.split('Non/');
										var link = "{{ url('/customer-service/work-order/add/schedule') }}"+"/non-prelaid/"+split[1];
										return '<a href="'+link+'" class="tablectrl_medium bPurple tipS" title="Non Prelaid<"><span>Non Prelaid</span></a>';
									}else {
										var link = "{{ url('/customer-service/work-order/add/schedule') }}"+"/prelaid/"+data;
										return '<a href="'+link+'" class="tablectrl_medium bPurple tipS" title="Create New W/O"><span>W/O</span></a>';
									}
							}else {
								return data;
							}
						},
						"targets": 10
					},
					{
						"render": function ( data, type, row ) {
							var link = "{{ url('/customer-service/edit/customer') }}"+"/"+data;
							var link2 = "{{ url('/customer-service/customer/pdf') }}"+"/"+data;
							return '<a target="_blank" href="'+link2+'" class="tablectrl_medium bPurple tipS" original-title="View Subscribers"><span class="iconb" data-icon=""></span></a> <a href="'+link+'" class="tablectrl_medium bLightBlue tipS" title="Edit Agent"><span class="iconb" data-icon="&#xe003;"></span></a> <a class="tablectrl_medium bRed tipS delModule" onclick="deleteA(\''+data+'\',\'' + row.name + '\', )" title="Delete Customer"><span class="iconb" data-icon="&#xe136;"></span></a>';
						},
						"targets": 11
					}
				],			
			});	

			var table3 = $('#view_customer').DataTable({
				"bJQueryUI": false,
				"bAutoWidth": true,
				"bSort": false,
				"sPaginationType": "full_numbers",
				"sDom": '<"tablePars"fl>t<"tableFooter"ip>',
				"oLanguage": {
					"sLengthMenu": "<span class='showentries'>Show entries:</span> _MENU_"
				},
				"ordering": false,
				"serverSide": true,
				"processing": true,
				"ajax": "{{ url('/customer-service/get-all-new-customer/null/null/null') }}",
				"columns": [
					{ "data": "formT","name": "formT"},
					{ "data": "type","name": "type"},
					{ "data": "name","name": "name"},
					{ "data": "phone","name": "phone"},
					{ "data": "unit","name": "unit"},
					{ "data": "building","name": "building"},
					{ "data": "projectT","name":"projectT"},
					{ "data": "street","name": "street"},
					// { "data": "postcode", "name": "postcode"},
					{ "data": "need_phone","name": "need_phone"},
					{ "data": "email","name": "email"},
				],	
				 "columnDefs": [
				 	{
						"render": function ( data, type, row ) {
							if (data.indexOf("New/") >= 0) {
								var split = data.split('/');
								return '<small class="label label-warning">'+split[0]+'</small>&nbsp;'+split[1];
							}else {
								return data;
							}
						},
						"targets": 0
					},
					{
						"render": function ( data, type, row ) {
							if (data.indexOf("D/") >= 0) {
								var split = data.split('/');
								return '<small class="label label-purple">'+split[0]+'</small> &nbsp;'+split[1];
							}else {
								return data;
							}
						},
						"targets": 2
					},
					{
						"render": function ( data, type, row ) {
							if(data == 'unverified'){
								return '<a href="" class="tablectrl_medium bRed tipS" data-toggle="dropdown" original-title="Waiting for verifying"><span class="iconb" data-icon=""></span></a>';
							}else {
								return '<a class="tablectrl_medium bGreen isDisabled tipS" link-disabled="" original-title="Success verifying"><span class="iconb" data-icon=""></span></a>';
							}
						},
						"targets": 9
					},
				],			
			});	

			//===== Modal =====//
			$('.dialog-delete').dialog({
				autoOpen: false, 
				width: 400,
				modal: true,
				buttons: {
					"Yes!": function () {
						var id = $(this).data('id');
						// window.alert(email);
						$.ajax({
							type: "POST",
							url: "{{ url('/customer-service/delete-new-customer') }}",
							data: { "_token": "{{ csrf_token() }}", id: id },
							success:function(data)
							{
								if(data == "true"){
									window.location.reload();
								}else if(data == "false"){
									alert("ERROR!! Cant Delete Customer !");
								}
							}
						});
					},
					"Cancel": function () {
						$(this).dialog("close");
						$('.dialog-delete').removeAttr('data-id'); 
					}
				}
			});		

			$('.tipS').tipsy({gravity: 's',fade: true, html:true});
		
			/*** Filter ***/
			$('#fbtype,#fbbuilding,#fbdealer').on('change', function() {
				var link = "{{ url('/customer-service/get-all-new-customer') }}" +"/"+$('#fbtype').val()+"/"+$('#fbbuilding').val()+"/"+$('#fbdealer').val();
				table.ajax.url( link ).load();
			});		
		});
	</script>
@endsection