Rev 2 | Autoría | Ultima modificación | Ver Log |
<?php
$acl = $this->viewModel()->getRoot()->getVariable('acl');
$currentUser = $this->currentUserHelper();
$routeReports = $this->url('microlearning/reports/devices');
$roleName = $currentUser->getUserTypeId();
$this->headLink()->appendStylesheet($this->basePath('plugins/nprogress/nprogress.css'));
$this->inlineScript()->appendFile($this->basePath('plugins/nprogress/nprogress.js'));
$this->inlineScript()->appendFile($this->basePath('plugins/jsrender/jsrender.js'));
$this->headStyle()->captureStart();
echo <<<CSS
#tableDevices {
display: flex;
flex-flow: column;
width: 100%;
}
#tableDevices thead {
flex: 0 0 auto;
}
#tableDevices tbody {
flex: 1 1 auto;
display: block;
overflow-y: auto;
overflow-x: hidden;
}
#tableDevices tr {
width: 100%;
display: table;
table-layout: fixed;
}
CSS;
$this->headStyle()->captureEnd();
$this->inlineScript()->captureStart();
echo <<<JS
jQuery( document ).ready(function( $ ) {
$.fn.changeFilter = function() {
NProgress.start();
$.ajax({
'dataType' : 'json',
'accept' : 'application/json',
'method' : 'get',
'url' : $('#form-filter').attr('action'),
'data' : $('#form-filter').serialize(),
}).done(function(response) {
if(response['success']) {
$('#tableDevices tbody').empty();
$('#tableDevices tbody').append(
$( "#deviceRowTemplate" ).render( response['data'] )
);
} else {
if(jQuery.type(response['data']) == 'string') {
$.fn.showError(response['data']);
} else {
$.each(response['data'], function( fieldname, errors ) {
$.fn.showFormErrorValidator('#form-slide-video-edit #' + fieldname, errors);
});
}
}
}).fail(function( jqXHR, textStatus, errorThrown) {
$.fn.showError(textStatus);
}).always(function() {
NProgress.done();
});
return false;
}
$('#form-filter #company_id').change(function(e) {
e.preventDefault();
$.fn.changeFilter();
});
$('#form-filter #function_id').change(function(e) {
e.preventDefault();
$.fn.changeFilter();
});
$('#form-filter #group_id').change(function(e) {
e.preventDefault();
$.fn.changeFilter();
});
$('#form-filter #institution_id').change(function(e) {
e.preventDefault();
$.fn.changeFilter();
});
$('#form-filter #program_id').change(function(e) {
e.preventDefault();
$.fn.changeFilter();
});
$('#form-filter #partner_id').change(function(e) {
e.preventDefault();
$.fn.changeFilter();
});
$('#form-filter #sector_id').change(function(e) {
e.preventDefault();
$.fn.changeFilter();
});
$('#form-filter #student_type_id').change(function(e) {
e.preventDefault();
$.fn.changeFilter();
});
$.fn.changeFilter();
});
JS;
$this->inlineScript()->captureEnd();
?>
<!-- Content Header (Page header) -->
<section class="content-header">
<div class="container-fluid">
<div class="row mb-2">
<div class="col-sm-12">
<h1>LABEL_DEVICES</h1>
</div>
</div>
</div><!-- /.container-fluid -->
</section>
<section class="content">
<div class="container-fluid">
<div class="row">
<div class="col-12">
<div class="card card-primary collapsed-card">
<div class="card-header">
<h3 class="card-title">LABEL_FILTERS</h3>
<div class="card-tools">
<button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fa fa-filter"></i></button>
</div>
<!-- /.card-tools -->
</div>
<!-- /.card-header -->
<div class="card-body">
<form name="form-filter" id="form-filter" action="<?php echo $routeReports ?>">
<?php
$fields = [
[
'label' => 'LABEL_COMPANIES',
'name' => 'company_id',
],
[
'label' => 'LABEL_FUNCTIONS',
'name' => 'function_id',
],
[
'label' => 'LABEL_GROUPS',
'name' => 'group_id',
],
[
'label' => 'LABEL_INSTITUTIONS',
'name' => 'institution_id',
],
[
'label' => 'LABEL_PROGRAMS',
'name' => 'program_id',
],
[
'label' => 'LABEL_PARTNERS',
'name' => 'partner_id',
],
[
'label' => 'LABEL_SECTORS',
'name' => 'sector_id',
],
[
'label' => 'LABEL_STUDENT_TYPES',
'name' => 'student_type_id',
],
];
$column = 0;
foreach($fields as $field) :
if($column == 0) {
echo '<div class="row">';
}
$column++;
?>
<div class="col-md-6 col-sm-12">
<div class="form-group">
<?php
$element = $form->get( $field['name'] );
$element->setOptions(['label' => $field['label'] ]);
$element->setAttributes(['class' => 'form-control']);
echo $this->formLabel($element);
echo $this->formSelect($element);
?>
</div>
</div>
<?php
if($column == 2) {
$column = 0;
echo '</div>';
}
?>
<?php endforeach; ?>
<?php if($column) {
echo '</div>';
}
?>
</form>
</div>
<!-- /.card-body -->
</div>
</div>
</div>
<div class="row">
<div class="col-12">
<div class="card">
<!-- /.card-header -->
<div class="card-body p-0">
<table class="table table-responsive" id="tableDevices" >
<thead>
<tr>
<th>LABEL_FIRST_NAME</th>
<th>LABEL_LAST_NAME</th>
<th>LABEL_EMAIL</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
<!-- /.card-body -->
</div>
</div>
</div>
</div>
</section>
<script id="deviceRowTemplate" type="text/x-jsrender">
<tr>
<td> {{>first_name}} </td>
<td> {{>last_name}} </td>
<td> {{>email}} </td>
</tr>
{{if devices}}
<tr>
<td colspan="3">
<table class="table table-bordered">
<thead>
<tr>
<td>Marca</td>
<td>Fabricante</td>
<td>Modelo</td>
<td>Plataforma</td>
<td>Versión</td>
<td>Ult.uso</td>
</tr>
</thead>
<tbody>
{{for devices}}
<tr>
<td>{{>brand}}</td>
<td>{{>manufacturer}}</td>
<td>{{>model}}</td>
<td>{{>platform}}</td>
<td>{{>version}}</td>
<td>{{>updated_on}}</td>
</tr>
{{/for}}
</tbody>
</table>
</td>
</tr>
{{/if}}
</script>