@extends('layouts.app')

@section('content')
<div class="page-header"><h2>  {{ $pageTitle }} <small>Configuration</small> </h2></div>

<div class="card" >
	<div class="card-body"> 
		@include('sximo.module.tab',array('active'=>'table','type'=>$type))
 {!! Form::open(array('url'=>'sximo/module/savetable/'.$module_name, 'class'=>'form-horizontal form-material','id'=>'grTable')) !!}

		
		
	<div class="infobox infobox-success">
	  <p> <strong>New Feature ! ( LIMIT TO ) </strong> Type User ID's using (,) into spesific column to limit the column only viewd by them </p>	
	</div>

	 <div class="table-responsive">
			<table class="table table-hover" id="table">
			<thead class="no-border">
			  <tr>
				<td class="thead">No</td>
				
				<td class="thead">Field</td>
				<td class="thead" width="70"> Limit</td>
				<td class="thead"><i class="icon-link"></i></td>
				<td class="thead" data-hide="phone">Title / Caption </td>
				<td class="thead" data-hide="phone">Show</td>
				<td class="thead" data-hide="phone">VD </td>
				<td class="thead" data-hide="phone">ST</td>
				<td class="thead" data-hide="phone">DW</td>
				<td class="thead" data-hide="phone" style="width:70px;">Widtd</td>
				<td class="thead" data-hide="phone" style="width:70px;">Align</td>				
				<td class="thead" data-hide="phone"> Format As </td>
			  </tr>
			 </thead> 
			<tbody class="no-border-x no-border-y">	
						  			  </tbody>
			</table>
			</div>
	 <div class="infobox infobox-warning mt-2">
	  
	   <b> NOTE :  </b> | <b>(DW)</b>  = Download | <b> (VD) </b> = View Detail | <b>( ST )</b> = Sortable <br />
	  <p> <strong>Tips !</strong> Drag and drop rows to re ordering lists </p>	
	</div>	
					
	<button type="submit" class="btn btn-primary"> Save Changes </button>
	<input type="hidden" name="module_id" value="{{ $row->module_id }}" />
	{!! Form::close() !!}	

</div>

</div>
<style type="text/css">
	.popover-content { font-size: 13px; }

</style>

<script type="text/javascript">

$(document).ready(function() {

	$('.format_info').popover()

	var fixHelperModified = function(e, tr) {
		var $originals = tr.children();
		var $helper = tr.clone();
		$helper.children().each(function(index) {
			$(this).width($originals.eq(index).width())
		});
		return $helper;
		},
		updateIndex = function(e, ui) {
			$('td.index', ui.item.parent()).each(function (i) {
				$(this).html(i + 1);
			});
			$('.reorder', ui.item.parent()).each(function (i) {
				$(this).val(i + 1);
			});			
		};
		
	$("#table tbody").sortable({
		helper: fixHelperModified,
		stop: updateIndex
	});		
});
</script>
<script type="text/javascript">
  $(document).ready(function(){