{include file="header.html"}
<!--// nodelist.html //-->

{title value=$layout.pagetitle}

{$lastonline_limit = get_conf('phpui.lastonline_limit')}

<div class="container-fluid">
<div class="panel panel-delfault" style="padding:4px;">
    
    <form method="GET" action="?m=nodelist" name="choosefilter">
    <input type="submit" class="hiddenbtn">
    <input type="hidden" name="m" value="nodelist">
    <input type="hidden" name="page" value="1">
    <input type="hidden" name="operator" value="{$listdata.operator}">
    
    <div class="row" style="background:#F6F6F6;border-bottom:solid 1px #CCCCCC;padding:2px;margin-left:1px;margin-right:1px;padding:1px;">
    
    <div class="col-xs-12 col-sm-12 col-md-3" style="text-align:left;vertical-align:top;margin:0px;padding-top:1px;padding-bottom:1px;">
	<a class='btn btn-default' onclick="wyczysc_filtr();" href="javascript:void(0);" {tip text="wyczyść filtr"}>{fontimg src="cancel" tip="wyczyść filtr"}</a>
	<a href="?m=nodelist&refresh" class="btn btn-default" style="font-size:9pt;" {tip text="odśwież"}>{fontimg src="refresh" style="font-size:9pt;"}</a>
	<a href="javascript:void(0);" onclick="document.choosefilter.submit();" class="btn btn-default" {tip text="Ustaw filtr"}>{fontimg src="filter" style="color:#FFFFFF;"} Filtruj</a>
    </div>
    
    <div class="col-xs-12 col-sm-12 col-md-3 hide_finances" style="text-align:right;margin-top:6px;{if $listdata.hidefin}display:none;{/if}" id="show_profit">
    </div>
    
    <div class="col-xs-12 col-sm-12 col-md-3 hide_finances" style="text-align:right;margin-top:6px;{if $listdata.hidefin}display:none;{/if}" id="show_liabilites">
    </div>
    
    <div class="col-xs-12 col-sm-12 col-md-3 hide_finances" style="text-align:right;margin-top:6px;{if $listdata.hidefin}display:none;{/if}" id="show_surcharge">
    </div>
    
</div>

    
    <table width="100%" cellpadding="3" cellspacing="0">
	<tr>
	    <td width="1%" style="white-space:nowrap;text-align:right;vertical-align:middle;">{trans('Status:')}</td>
	    <td width="23%">
		    <select name="s" class="form-control form-control-sm selectpicker{if $listdata.state} actives{/if}" style="width:100%;">
			<option value=""{if !$listdata.state} selected{/if}>{trans("- all -")}</option>
			<option value="1"{if $listdata.state eq 1} selected{/if}>{trans("connected<!plural:item>")}</option>
			<option value="2"{if $listdata.state eq 2} selected{/if}>{trans("disconnected<!plural:item>")}</option>
			<option value="3"{if $listdata.state eq 3} selected{/if}>{trans("online")}</option>
			<option value="4"{if $listdata.state eq 4} selected{/if}>{trans("no nodeassignments")}</option> 
			<option value="5"{if $listdata.state eq 5} selected{/if}>{trans("with blockade")}</option> 
			<option value="6"{if $listdata.state eq 6} selected{/if}>{trans("with warning")}</option> 
		    </select>
	    </td>
	    
	    <td width="1%" style="white-space:nowrap;text-align:right;vertical-align:middle;">{trans('Network:')}</td>
	    <td width="23%">
		    <select style="width:100%;" name="n" class="form-control form-control-sm selectpicker{if $listdata.network} actives{/if}">
			<option value="" {if !$listdata.network} selected {/if}>{trans("- all networks -")}</option>
			{section name=networks loop=$networks}
			<option value="{$networks[networks].id}" {if $listdata.network eq $networks[networks].id} selected {/if}>{$networks[networks].name|truncate:30:"...":true}</option>
			{/section}
		    </select>
	    </td>
	    
	    <td width="1%" style="white-space:nowrap;text-align:right;vertical-align:middle;">{trans('Group:')}</td>
	    <td width="23%">
		    <select style="width:100%;" name="ng" class="form-control form-control-sm selectpicker{if $listdata.nodegroup} actives{/if}">
			<option value="" {if !$listdata.nodegroup} selected {/if}>{trans("- all groups -")}</option>
			{foreach from=$nodegroups item=nodegroup}
			<option value="{$nodegroup.id}" {if $listdata.nodegroup eq $nodegroup.id} selected {/if}>{$nodegroup.name|truncate:30:"...":true}</option>
			{/foreach}
		    </select>
	    </td>
	    
	    <td width="1%" style="white-space:nowrap;text-align:right;vertical-align:middle;">{trans('Customers Group:')}</td>
	    <td width="23%">
		    <select style="width:100%;" name="g" class="form-control form-control-sm selectpicker{if $listdata.customergroup} active{/if}">
			<option value="" {if !$listdata.customergroup} selected {/if}>{trans("- all groups -")}</option>
			{section name=customergroups loop=$customergroups}
			<option value="{$customergroups[customergroups].id}" {if $listdata.customergroup eq $customergroups[customergroups].id} selected {/if}>{$customergroups[customergroups].name|truncate:30:"...":true}</option>
			{/section}
		    </select>
	    </td>
	    
	</tr>
	<tr>
	
	    <td width="1%" style="white-space:nowrap;text-align:right;vertical-align:middle;">NAS</td>
	    <td width="23%">
		    <select style="width:1100%;" name="nas" class="form-control form-control-sm selectpicker{if $listdata.nas} active{/if}">
			<option value=""></option>
			{section name='naslist' loop=$naslist}
			<option value="{$naslist[naslist].id}"{if $listdata.nas == $naslist[naslist].id} selected{/if}>{$naslist[naslist].name}</option>
			{/section}
		    </select>
	    </td>
	    
	    <td width="1%" style="white-space:nowrap;text-align:right;vertical-align:middle;"></td>
	    <td width="23%">
	    </td>
	    
	    <td width="1%" style="white-space:nowrap;text-align:right;vertical-align:middle;"></td>
	    <td width="23%">
	    </td>
	    
	    <td width="1%" style="white-space:nowrap;text-align:right;vertical-align:middle;"></td>
	    <td width="23%">
	    </td>
	</tr>
    </table>
    
    </form>





<div style="padding-right:2px;margin-top:15px;">
    <table id="nodelist" class="table table-hover table-bordered table-striped" cellpadding="3" cellspacing="0">
	<thead>
	    <tr>
		<th>LP</th>				<!--// 0 //-->
		<th class="not-export-col">Info</th>	<!--// 1 //-->
		<th>ID</th>				<!--// 2 //-->
		<th>Terminal</th>			<!--// 3 //-->
		<th>Klient</th>				<!--// 4 //-->
		<th>IP (Pub IP)<br>MAC adres</th>	<!--// 5 //-->
		<th>Podłączony do<br>NAS</th>		<!--// 6 //-->
		<th>Medium<br>Technologia</th>		<!--// 7 //-->
		<th class="not-export-col">&nbsp;</th>	<!--// 8 //-->
	    </tr>
	</thead>
    </table>
</div>


</div> <!--// panel //-->
</div> <!--// container-fluid //-->

{literal}
<script type="text/javascript" language="JavaScript">
<!--
    function wyczysc_filtr() {
	$("div.dataTables_filter input[type='search']").val('').keyup();
	setTimeout(function(){
	    self.location.href='?m=nodelist&page=1&s=&n=&ng=&nas=&g=&search=no';
	},100);
    }
    
    function change_operator(sel) {
	    var $val = sel.value;
	    document.choosefilter.operator.value = $val;
	    $.get('?m=nodelist_ajax',{
		ajax : 1,
		popup : 1,
		action : 'change_operator',
		oper : $val,
	    }).done(function(result){
		setTimeout(function(){
		    dt.api().draw();
		},30);
	    });
	    
    }
    
    function format(d) {
	return '<div class="slider panel panel-info" id="getdatasilder_' + d.id + '"></div>';
    }
    
    $(document).ready(function(){
	
	dt = $("#nodelist").dataTable({
		'serverSide'	: true,
		'processing'	: false,
		'responsive'	: true,
		'ajax'		: {
					'url'	: "?m=nodelist_ajax&popup=1&ajax=1",
					'type'	: "POST",
				},
		'columns'	: [
					{
						"data"			: "lp",
						"name"			: "lp",
						"orderable"		: false,
						"searchable"		: false,
						"sClass"		: "textright node-card not-export-list nodeinfo",
						"width"			: "1%",
					},{
						"className" 		: "details-control textcenter",
						"orderable" 		: false,
						"searchable" 		: false,
						"data" 			: null,
						'defaultContent' 	: '',
						"width"			: "1%"
					},{
						"data"			: "idstr",
						"name"			: "id",
						"sClass"		: "textleft nowrap nodeinfo node-card",
						"width"			: "1%",
					},{
						"data"			: "name",
						"name"			: "name",
						"sClass"		: "textleft nowrap nodeinfo node-card",
						"width"			: "20%",
					},{
						"data"			: "owner",
						"name"			: "klient",
						"sClass"		: "textleft customerinfo node-card",
						"width"			: "auto",
					},{
						"data"			: "ip",
						"name"			: "ip",
						"sClass"		: "textleft nowrap node-card",
						"width"			: "1%",
					},{
						"data"			: "devname",
						"name"			: "devname",
						"sClass"		: "textleft netdevinfo nowrap node-card",
						"width"			: "1%",
					},{
						"data"			: "medium",
						"name"			: "medium",
						"sClass"		: "textleft nodeinfo node-card",
						"width"			: "1%",
					},{
						"data"			: null,
						"name"			: "link",
						"defaultContent"	: '',
						"orderable"		: false,
						"searchable"		: false,
						"sClass"		: "textright nowrap quicklink not-export-list",
						"width"			: "1%",
					}
				],
		"language" 	: 
				{
					buttons: {
						colvis : "Widok"
					},
					"url" : "img/Polish.json"
				},
		'lengthMenu' 	: [[10,25,50,100,200],[10,25,50,100,200]],
		'order' 	: [[{/literal}{if get_profile('nlorder')}{get_profile('nlorder')}{else}3{/if}{literal},"{/literal}{if get_profile('nldirection')}{get_profile('nldirection')}{else}asc{/if}{literal}"]],
		'sDom' 		: '<"row"<"col-md-2"l><"col-md-6"B><"col-md-4"f>><"row"<"col-md-6"i><"col-md-6"p>>rtip',
		stateSave 	: true,
		buttons 	: [
					{
						extend : 'copyHtml5',
						exportOptions : {
							columns : ':visible:not(.not-export-col)'
						}
					},
					{
						extend : 'csvHtml5',
						exportOptions 	: 
						{
						    columns 	: ':visible:not(.not-export-col)',
						    format 	: {
									body : function(data,column,row) 
									{
										if (column != 0 ) 
										{
//											data = data.replace(/<br\s*\/?>/ig, "");
											data = data.replace(/&nbsp;/ig, "");
											data = data.replace(/(?:\r\n|\r|\n)/ig, " ");
//											data = data.replace(/\r\s*\/?>/ig, "");
											data = data.replace(/<.*?>/ig, "");
										}
										return data;
									}
								}
						}
					},
					{
						extend : 'excelHtml5',
						exportOptions : 
						{
							columns : ':visible:not(.not-export-col)'
						}
					},
					{
						extend : 'pdfHtml5',
						exportOptions : 
						{
							columns : ':visible:not(.not-export-col)'
						},
						header : true,
						customize : function(config) 
						{
							config.pageSize = 'A4';
							config.defaultStyle.fontSize = 7;
							config.styles.tableHeader.width = '100%';
							config.styles.tableHeader.fontSize = 7;
							config.styles.tableHeader.bold = true;
							config.styles.tableHeader.color = '#000000';
							config.styles.tableHeader.fillColor = '#CCCCCC';
							config.styles.title.alignment = 'left';
							config.styles.title.bold = true;
							config.styles.title.fontSize = 10;
						}
					},
					{
						extend : 'colvis',
						columns : [0,1,2,3,4,5,6],
						columnDefs:[
								{
									className :'select-checkbox',
									targets : 0
								}
						]
					},
				],
			
		initComplete 	: function() {
					    },
				
		'pageLength' 	: {/literal}{if get_profile('pagelimit')}{get_profile('pagelimit')}{else}10{/if}{literal},
		
		
		'fnRowCallback' : function(nRow, aData, iDisplayIndex, iDisplayIndexFull) {
			
			
			var column_count = $("#nodelist thead th").length -1;
			
			$('td',nRow).eq(column_count).append("<i class='nodeaccess fa fa-fw'></i>");
			$('td',nRow).eq(column_count).append("<i class='nodeblock fa fa-fw fa-lock'></i>");
			$('td',nRow).eq(column_count).append("<i class='nodewarn fa fa-fw fa-exclamation-triangle'></i>");
			$('td',nRow).eq(column_count).append("<i class='nodeedit fa fa-edit'></i>");
			$('td',nRow).eq(column_count).append("<i class='nodeinfo fa fa-info-circle'></i>");
			
			if (aData.access > 0) { 
			    $('.nodeaccess',nRow).addClass('fa-toggle-on');
			} else {
			    $('.nodeaccess',nRow).addClass('fa-toggle-off');
			    $('.node-card',nRow).addClass('blend'); 
			}
			
			if (aData.blockade == 1) {
			    $('.nodeblock',nRow).addClass('danger'); 
			}
			
			if (aData.warning == 1) {
			    $('.nodewarn',nRow).addClass('warning');
			}
		}
	
	}); // end dataTable;
	
	
	$("#nodelist tbody").on('click','tr td.details-control',function() {
		
		var tr = $(this).closest('tr');
		var row = dt.api().row( tr );
		
		if (row.child.isShown() ) {
			
			$('div.slider',row.child()).slideUp("fast",function() {
				row.child.hide();
				tr.removeClass('shown');
			});
			
		} else {
			
			row.child(format(row.data()),'no-padding').show();
			
			$("#getdatasilder_" + row.data().id).load("?m=nodelist_details&popup=1&ajax=1&id=" + row.data().id,function(){
				tr.addClass('shown');
				$('div.slider',row.child()).slideDown("fast");
			});
			
		}
		
	});
	
	
	// set access
	$("#nodelist tbody").on('click','i.nodeaccess',function(){
		var tr = $(this).closest('tr');
		var row = dt.api().row( tr );
		
		if ($(this).hasClass('fa-toggle-on')) {
		    $(this).removeClass('fa-toggle-on');
		    $(this).addClass('fa-toggle-off');
		    $('.node-card',tr).addClass('blend');
		    $.get('?m=nodelist_ajax',{
			id : row.data().id,
			action : 'node_access',
			set	: 0,
			ajax	: 1,
			popup 	: 1,
		    });
		} else {
		    $(this).removeClass('fa-toggle-off');
		    $(this).addClass('fa-toggle-on');
		    $('.node-card',tr).removeClass('blend');
		    $.get('?m=nodelist_ajax',{
			id : row.data().id,
			action : 'node_access',
			set	: 1,
			ajax	: 1,
			popup 	: 1,
		    });
		}
	});
	
	
	
	// set blockade
	$("#nodelist tbody").on('click','i.nodeblock',function(){
		var tr = $(this).closest('tr');
		var row = dt.api().row( tr );
		if ($(this).hasClass('danger')) {
		    $(this).removeClass('danger');
		    $.get('?m=nodelist_ajax',{
			id : row.data().id,
			action : 'node_blockade',
			set	: 0,
			ajax	: 1,
			popup 	: 1,
		    });
		} else {
		    $(this).addClass('danger');
		    $.get('?m=nodelist_ajax',{
			id : row.data().id,
			action : 'node_blockade',
			set	: 1,
			ajax	: 1,
			popup 	: 1,
		    });
		}
	});
	
	// set warning
	$("#nodelist tbody").on('click','i.nodewarn',function(){
		var tr = $(this).closest('tr');
		var row = dt.api().row( tr );
		if ($(this).hasClass('warning')) {
		    $(this).removeClass('warning');
		    $.get('?m=nodelist_ajax',{
			id : row.data().id,
			action : 'node_warning',
			set	: 0,
			ajax	: 1,
			popup 	: 1,
		    });
		} else {
		    $(this).addClass('warning');
		    $.get('?m=nodelist_ajax',{
			id : row.data().id,
			action : 'node_warning',
			set	: 1,
			ajax	: 1,
			popup 	: 1,
		    });
		}
	});
	
	
	// node edit
	$("#nodelist tbody").on('click','i.nodeedit',function(){
	    var tr = $(this).closest('tr');
	    var row = dt.api().row( tr );
	    self.location.href='?m=nodeedit&id=' + row.data().id;
	});
	
	
	// otwieramy karte terminala , kliknięcie na .nodeinfo
	$("#nodelist tbody").on('click','tr td.nodeinfo',function(){
		var tr = $(this).closest('tr');
		var row = dt.api().row( tr );
		self.location.href='?m=nodeinfo&id=' + row.data().id;
	});
	
	$("#nodelist tbody").on('click','tr td.customerinfo',function(){
		var tr = $(this).closest('tr');
		var row = dt.api().row( tr );
		self.location.href='?m=customerinfo&id=' + row.data().ownerid;
	});
	

	
	setTimeout(function(){ 
	    $("div.dataTables_filter").append("<select id='nloperator' class='form-control input-sm' onchange='change_operator(this);' style='margin-left:2px;' title='Operator wyszukiwania'><option value='or'>OR</option><option value='and'>AND</option></select>");
	    $("#nloperator").val('{/literal}{$listdata.operator}{literal}');
	}, 500);
    
    }); // end document ready

//-->
</script>
{/literal}

{include file="footer.html"}