KOKINIO - MANAGER
Edit File: 56766c9004e9ad5ae15d079c3ee09d0c
<style> table{ font-size: 10px; width: 100%; } thead, tbody, tr, td, th { display: block; } tr:after { content: ' '; display: block; visibility: hidden; clear: both; } thead th { height: 100%; /*text-align: left;*/ } tbody { height: 600px; overflow-y: auto; } thead { /* fallback */ } tbody td, thead th { width: 5%; float: left; } </style> <div class="block-title"> <h2><strong>Peso Unidad (<?php echo e((isset($year))? $year : date('Y')); ?>)</strong> </h2> <div class="block-options pull-right"> <button onclick="Metrica.tableFilter(this)" id="filter" class="btn btn-default btn-xs btn-filter"><span class="glyphicon glyphicon-filter"></span> Filter</button> </div> </div> <div class="row"> <div class="filterable"> <table class="table table-borderless table-striped table-vcenter table-responsive"> <thead> <tr class="filters"> <th class="text-left" style="width: 280px"><input type="text" class="form-control text-center" placeholder="Cliente" disabled></th> <th class="text-right" style="font-size:12px">1</th> <th class="text-right" style="font-size:12px">2</th> <th class="text-right" style="font-size:12px">3</th> <th class="text-right" style="font-size:12px">4</th> <th class="text-right" style="font-size:12px">5</th> <th class="text-right" style="font-size:12px">6</th> <th class="text-right" style="font-size:12px">7</th> <th class="text-right" style="font-size:12px">8</th> <th class="text-right" style="font-size:12px">9</th> <th class="text-right" style="font-size:12px">10</th> <th class="text-right" style="font-size:12px">11</th> <th class="text-right" style="font-size:12px">12</th> </tr> </thead> <tbody> <?php if(isset($unidades)): ?> <?php foreach($unidades as $value): ?> <tr> <td class="text-left" style="width: 280px;padding:0px"><?php echo e($value->cliente); ?></td> <td class="text-right" style="padding:0px"><?php echo e(round($value->mes_1,3)); ?></td> <td class="text-right" style="padding:0px"><?php echo e(round($value->mes_2,3)); ?></td> <td class="text-right" style="padding:0px"><?php echo e(round($value->mes_3,3)); ?></td> <td class="text-right" style="padding:0px"><?php echo e(round($value->mes_4,3)); ?></td> <td class="text-right" style="padding:0px"><?php echo e(round($value->mes_5,3)); ?></td> <td class="text-right" style="padding:0px"><?php echo e(round($value->mes_6,3)); ?></td> <td class="text-right" style="padding:0px"><?php echo e(round($value->mes_7,3)); ?></td> <td class="text-right" style="padding:0px"><?php echo e(round($value->mes_8,3)); ?></td> <td class="text-right" style="padding:0px"><?php echo e(round($value->mes_9,3)); ?></td> <td class="text-right" style="padding:0px"><?php echo e(round($value->mes_10,3)); ?></td> <td class="text-right" style="padding:0px"><?php echo e(round($value->mes_11,3)); ?></td> <td class="text-right" style="padding:0px"><?php echo e(round($value->mes_12,3)); ?></td> </tr> <?php endforeach; ?> <?php else: ?> <tr><td colspan="14">No hay información disponible</td></tr> <?php endif; ?> </tbody> </div> </div> <script type="text/javascript"> $('.filterable .filters input').keyup(function(e){ /* Ignore tab key */ var code = e.keyCode || e.which; if (code == '9') return; /* Useful DOM data and selectors */ var $input = $(this), inputContent = $input.val().toLowerCase(), $panel = $input.parents('.filterable'), column = $panel.find('.filters th').index($input.parents('th')), $table = $panel.find('.table'), $rows = $table.find('tbody tr'); /* Dirtiest filter function ever ;) */ var $filteredRows = $rows.filter(function(){ var value = $(this).find('td').eq(column).text().toLowerCase(); return value.indexOf(inputContent) === -1; }); /* Clean previous no-result if exist */ $table.find('tbody .no-result').remove(); /* Show all rows, hide filtered ones (never do that outside of a demo ! xD) */ $rows.show(); $filteredRows.hide(); /* Prepend no-result row if all rows are filtered */ if ($filteredRows.length === $rows.length) { $table.find('tbody').prepend($('<tr class="no-result text-center"><td colspan="'+ $table.find('.filters th').length +'">No result found</td></tr>')); } }); </script>