Rev 16918 | Autoría | Comparar con el anterior | Ultima modificación | Ver Log |
<?php
$acl = $this->viewModel()->getRoot()->getVariable('acl');
$currentUser = $this->currentUserHelper();
$routeReports = $this->url('microlearning/reports/devices-and-access');
$roleName = $currentUser->getUserTypeId();
$allowDownload = $acl->isAllowed($roleName, 'microlearning/reports/devices-and-access/excel') ? 1 : 0;
$this->headLink()->appendStylesheet($this->basePath('assets/vendors/select2/css/select2.min.css'));
$this->headLink()->appendStylesheet($this->basePath('assets/vendors/select2-bootstrap5-theme/select2-bootstrap-5-theme.css'));
$this->inlineScript()->appendFile($this->basePath('assets/vendors/select2/js/select2.min.js'));
$this->headLink()->appendStylesheet($this->basePath('assets/vendors/nprogress/nprogress.css'));
$this->inlineScript()->appendFile($this->basePath('assets/vendors/nprogress/nprogress.js'));
$this->inlineScript()->appendFile($this->basePath('assets/vendors/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']['items'] )
);
if(response['data']['link_download']) {
$('button.btn-download').data('href', response['data']['link_download']);
$('button.btn-download').show();
} else {
$('button.btn-download').hide();
}
} 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 select').change(function(e) {
e.preventDefault();
$.fn.changeFilter();
});
$('#form-filter select').select2({
theme: 'bootstrap-5',
width: '100%',
});
$('#form-filter #student_type_id').change(function(e) {
e.preventDefault();
$.fn.changeFilter();
});
$('button.btn-refresh').click(function(e) {
e.preventDefault();
$.fn.changeFilter();
});
$('button.btn-download').click(function(e) {
e.preventDefault();
var action = $(this).data('href');
NProgress.start();
$.ajax({
'dataType' : 'json',
'method' : 'get',
'url' : action,
}).done(function(response) {
if(response['success']) {
var anchor = window.document.createElement("a");
anchor.href = 'data:application/octet-stream;charset=utf-8;base64,' + response['data']['content'] ;
anchor.download = response['data']['basename'];
document.body.appendChild(anchor);
anchor.click(); // IE: "Access is denied"; see: https://connect.microsoft.com/IE/feedback/details/797361/ie-10-treats-blob-url-as-cross-origin-and-denies-access
document.body.removeChild(anchor);
} else {
$.fn.showError(response['data']);
}
}).fail(function( jqXHR, textStatus, errorThrown) {
showError(textStatus);
}).always(function() {
NProgress.done();
});
});
$.fn.changeFilter();
});
JS;
$this->inlineScript()->captureEnd();
?>
<div class="container">
<div class="card" id="">
<div class="card-header">
<h6 class="card-title">LABEL_DEVICES_AND_ACCESS</h6>
</div>
<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-6 mt-3">
<?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>
<?php
if($column == 2) {
$column = 0;
echo '</div>';
}
?>
<?php endforeach; ?>
<?php if($column) {
echo '</div>';
}
?>
<div class="row">
<div class="col-12 mt-3">
<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>
</div>
</div>
<div class="card-footer text-right">
<button type="button" class="btn btn-info btn-refresh"><i class="fa fa-sync"></i> LABEL_REFRESH </button>
<?php if($allowDownload) : ?>
<button type="button" class="btn btn-info btn-download"><i class="fa fa-download"></i> LABEL_DOWNLOAD </button>
<?php endif;?>
</div>
</div>
</div>
<script id="deviceRowTemplate" type="text/x-jsrender">
<tr>
<td> {{>first_name}} </td>
<td> {{>last_name}} </td>
<td> {{>email}} </td>
</tr>
<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>Push</td>
<td>Ult.uso</td>
</tr>
</thead>
<tbody>
<tr>
<td>{{>brand}}</td>
<td>{{>manufacturer}}</td>
<td>{{>model}}</td>
<td>{{>platform}}</td>
<td>{{>version}}</td>
<td>{{>token}}</td>
<td>{{>updated_on}}</td>
</tr>
<tbody>
</table>
</td>
</tr>
</script>