@extends('market.layout.master')
@section('ptitle', 'Marketing')
@section('page_title', 'Dashboard')
@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>CBB Business - 2 Years Subscription (10Mbps-100Mbps)</h6></div>
			<div id="dyn1" class="shownpars cuss responsive">
				<a class="tOptions" title="Options"><img src="{{ url('assets/img/icons/options') }}" alt="" /></a>
				<table id="business24low" cellpadding="0" cellspacing="0" border="0" class="dTable tMedia">
					<thead>
						<tr>
							<th>#</th>
							<th>Speed</th>
							<th>Contract (M)</th>
							<th>Range Activation</th>
							<th>Commission (%)</th>
							<th>Category</th>
							<th width="90">Actions</th>
						</tr>
					</thead>
				</table>
			</div>
		</div>

		<div class="widget grid12" style="margin-left: 0px;margin-top: 50px;">
			<div class="whead"><h6>CBB Business - 2 Years Subscription (300Mbps-1Gbps)</h6></div>
			<div id="dyn1" class="shownpars cuss responsive">
				<a class="tOptions" title="Options"><img src="{{ url('assets/img/icons/options') }}" alt="" /></a>
				<table id="business24high" cellpadding="0" cellspacing="0" border="0" class="dTable tMedia">
					<thead>
						<tr>
							<th>#</th>
							<th>Speed</th>
							<th>Contract (M)</th>
							<th>Range Activation</th>
							<th>Commission (%)</th>
							<th>Category</th>
							<th width="90">Actions</th>
						</tr>
					</thead>
				</table>
			</div>
		</div>

		<div class="widget grid12" style="margin-left: 0px;margin-top: 50px;">
			<div class="whead"><h6>CBB Business - 1 Years Subscription (10Mbps-100Mbps)</h6></div>
			<div id="dyn1" class="shownpars cuss responsive">
				<a class="tOptions" title="Options"><img src="{{ url('assets/img/icons/options') }}" alt="" /></a>
				<table id="business12low" cellpadding="0" cellspacing="0" border="0" class="dTable tMedia">
					<thead>
						<tr>
							<th>#</th>
							<th>Speed</th>
							<th>Contract (M)</th>
							<th>Range Activation</th>
							<th>Commission (%)</th>
							<th>Category</th>
							<th width="90">Actions</th>
						</tr>
					</thead>
				</table>
			</div>
		</div>

		<div class="widget grid12" style="margin-left: 0px;margin-top: 50px;">
			<div class="whead"><h6>CBB Business - 1 Years Subscription (300Mbps-1Gbps)</h6></div>
			<div id="dyn1" class="shownpars cuss responsive">
				<a class="tOptions" title="Options"><img src="{{ url('assets/img/icons/options') }}" alt="" /></a>
				<table id="business12high" cellpadding="0" cellspacing="0" border="0" class="dTable tMedia">
					<thead>
						<tr>
							<th>#</th>
							<th>Speed</th>
							<th>Contract (M)</th>
							<th>Range Activation</th>
							<th>Commission (%)</th>
							<th>Category</th>
							<th width="90">Actions</th>
						</tr>
					</thead>
				</table>
			</div>
		</div>
		
		
		<div class="dialog-delete" title="Delete Commission">
            <p id="inner-delete"></p>
        </div>
		
		<!-- <div class="widget grid2 widgetH"></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 commission?</p>";

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

	$(document).ready(function(){

		var origin   = window.location.origin; 
		var curr = '<?php echo $staffDetails->_id ?>';

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

			$('#business24low').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('/marketing/get-commission-listB24-low') }}",
				"columns": [
				{ "data": "index","name": "index"},
				{ "data": "packageR","name": "packageR"},
				{ "data": "contract","name": "contract"},				
				{ "data": "ranges","name": "ranges"},
				{ "data": "comm","name": "comm"},
				{ "data": "category","name": "category"},
				{ "data": "action","name": "action"}, 
				],	
				 "columnDefs": [		
					{
						"render": function ( data, type, row ) {
							var link = "{{ url('/marketing/commission/edit-commissionB') }}"+"/"+data;
							return '<a href="'+link+'" class="tablectrl_medium bLightBlue tipS" title="Edit Dealer"><span class="iconb" data-icon="&#xe003;"></span></a> <a class="tablectrl_medium bRed tipS delModule" onclick="deleteA(\''+data+'\',\'' + row.name + '\', )" title="Delete Agent"><span class="iconb" data-icon="&#xe136;"></span></a>';
						},
						"targets": 6
					},
				],				
			});

			$('#business24high').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('/marketing/get-commission-listB24-high') }}",
				"columns": [
				{ "data": "index","name": "index"},
				{ "data": "packageR","name": "packageR"},
				{ "data": "contract","name": "contract"},				
				{ "data": "ranges","name": "ranges"},
				{ "data": "comm","name": "comm"},
				{ "data": "category","name": "category"},
				{ "data": "action","name": "action"}, 
				],	
				 "columnDefs": [		
					{
						"render": function ( data, type, row ) {
							var link = "{{ url('/marketing/commission/edit-commissionB') }}"+"/"+data;
							return '<a href="'+link+'" class="tablectrl_medium bLightBlue tipS" title="Edit Dealer"><span class="iconb" data-icon="&#xe003;"></span></a> <a class="tablectrl_medium bRed tipS delModule" onclick="deleteA(\''+data+'\',\'' + row.name + '\', )" title="Delete Agent"><span class="iconb" data-icon="&#xe136;"></span></a>';
						},
						"targets": 6
					},
				],				
			});

			$('#business12low').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('/marketing/get-commission-listB12-low') }}",
				"columns": [
				{ "data": "index","name": "index"},
				{ "data": "packageR","name": "packageR"},
				{ "data": "contract","name": "contract"},				
				{ "data": "ranges","name": "ranges"},
				{ "data": "comm","name": "comm"},
				{ "data": "category","name": "category"},
				{ "data": "action","name": "action"}, 
				],	
				 "columnDefs": [		
					{
						"render": function ( data, type, row ) {
							var link = "{{ url('/marketing/commission/edit-commissionB') }}"+"/"+data;
							return '<a href="'+link+'" class="tablectrl_medium bLightBlue tipS" title="Edit Dealer"><span class="iconb" data-icon="&#xe003;"></span></a> <a class="tablectrl_medium bRed tipS delModule" onclick="deleteA(\''+data+'\',\'' + row.name + '\', )" title="Delete Agent"><span class="iconb" data-icon="&#xe136;"></span></a>';
						},
						"targets": 6
					},
				],				
			});	

			$('#business12high').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('/marketing/get-commission-listB12-high') }}",
				"columns": [
				{ "data": "index","name": "index"},
				{ "data": "packageR","name": "packageR"},
				{ "data": "contract","name": "contract"},				
				{ "data": "ranges","name": "ranges"},
				{ "data": "comm","name": "comm"},
				{ "data": "category","name": "category"},
				{ "data": "action","name": "action"}, 
				],	
				 "columnDefs": [		
					{
						"render": function ( data, type, row ) {
							var link = "{{ url('/marketing/commission/edit-commissionB') }}"+"/"+data;
							return '<a href="'+link+'" class="tablectrl_medium bLightBlue tipS" title="Edit Dealer"><span class="iconb" data-icon="&#xe003;"></span></a> <a class="tablectrl_medium bRed tipS delModule" onclick="deleteA(\''+data+'\',\'' + row.name + '\', )" title="Delete Agent"><span class="iconb" data-icon="&#xe136;"></span></a>';
						},
						"targets": 6
					},
				],				
			});
			//===== Modal =====//
			$('.dialog-delete').dialog({
				autoOpen: false, 
				width: 400,
				modal: true,
				buttons: {
					"Yes!": function () {


						$.ajax({
							type: "post",
							url: "{{ url('/marketing/commission/delete-commission') }}",
							data: { "_token": "{{ csrf_token() }}", "id": $(this).data("id") },
							success:function(data)
							{
								if(data == "true"){
									window.location.reload();
								}else if(data == "false"){
									alert("ERROR!! Cant Delete Commission !");
								}
							}
						});
					},
					"Cancel": function () {
						$(this).dialog("close");
						$('.dialog-delete').removeAttr('data-id'); 
					}
				}
			});	

			$('.tipS').tipsy({gravity: 's',fade: true, html:true});
		});
	</script>
@endsection