Skip to content

GeoInt_SIDT
GeoInt_SIDT
Commit 65f57ac2 authored by Ulises Morales Ramírez's avatar Ulises Morales Ramírez
Browse files
Options

cambio de tipo de tabla, filtro de busqueda, paginación

parent 19a83976
Hide whitespace changes
Inline Side-by-side
Showing with 91 additions and 126 deletions
catalog/templates/base_top.html
View file @ 65f57ac2
...@@ -181,10 +181,6 @@ ...@@ -181,10 +181,6 @@
{% block modal1 %}{% endblock %} {% block modal1 %}{% endblock %}
<!-- MODAL 1 --> <!-- MODAL 1 -->
<!-- jQuery 3 -->
<script src="{% static 'catalog/adminlte/bower_components/jquery/dist/jquery.min.js' %}"></script>
<!-- jQuery UI 1.11.4 -->
<script src="{% static 'catalog/adminlte/bower_components/jquery-ui/jquery-ui.min.js' %}"></script>
<!-- Bootstrap 3.3.7 --> <!-- Bootstrap 3.3.7 -->
<script src="{% static 'catalog/adminlte/bower_components/bootstrap/dist/js/bootstrap.min.js' %}"></script> <script src="{% static 'catalog/adminlte/bower_components/bootstrap/dist/js/bootstrap.min.js' %}"></script>
<!-- AdminLTE App --> <!-- AdminLTE App -->
......
catalog/templates/map.html
View file @ 65f57ac2
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=requestAnimationFrame,Element.prototype.classList,URL"></script> <script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=requestAnimationFrame,Element.prototype.classList,URL"></script>
<!-- <script src="https://openlayers.org/en/v4.6.4/build/ol.js"></script>--> <!-- <script src="https://openlayers.org/en/v4.6.4/build/ol.js"></script>-->
<script src="https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.3.0/build/ol.js"></script> <script src="https://cdn.rawgit.com/openlayers/openlayers.github.io/master/en/v5.3.0/build/ol.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="{% static 'catalog/js/openLayers4.js' %}"></script> <script src="{% static 'catalog/js/openLayers4.js' %}"></script>
<script src="{% static 'catalog/js/sidtMap.js' %}"></script> <script src="{% static 'catalog/js/sidtMap.js' %}"></script>
{% endblock %} {% endblock %}
......
reports/static/reports/js/scripts.js
View file @ 65f57ac2
...@@ -10,26 +10,26 @@ function refresh() { ...@@ -10,26 +10,26 @@ function refresh() {
url: 'Reload', url: 'Reload',
success: function (data) { success: function (data) {
$.each(data, function (key, val) { $.each(data, function (key, val) {
console.log(key + " = " + val.purchase_id + "" + val.progress) console.log(key + " = purchase_id: " + val.purchase_id + ", val_progress: " + val.progress);
if (val.progress != 100) { if (val.progress != 100) {
$('#progress_bar' + val.purchase_id + '').attr("aria-valuenow", val.progress); $('#progress_bar' + val.purchase_id).attr("aria-valuenow", val.progress);
$('#progress_bar' + val.purchase_id + '').attr('style', 'width:' + val.progress + '%'); $('#progress_bar' + val.purchase_id).attr('style', 'width:' + val.progress + '%');
document.getElementById('progess_value' + val.purchase_id).innerHTML = val.progress + ' %'; //document.getElementById('progess_value' + val.purchase_id).innerHTML = val.progress + ' %';
$('#progress_bar' + val.purchase_id + '').attr("class", "progress-bar progress-bar-warning progress-bar-striped active"); $('#progress_bar' + val.purchase_id).attr("class", "progress-bar progress-bar-warning progress-bar-striped active");
$('#view_report' + val.purchase_id + '').attr('disabled', 'false'); $('#view_report' + val.purchase_id).attr('disabled', 'false');
$('#action_buttons' + val.purchase_id + '').attr("class", "hidden"); $('#action_buttons' + val.purchase_id).attr("class", "hidden");
$('#main_progess' + val.purchase_id + '').removeClass("hidden"); $('#main_progess' + val.purchase_id).removeClass("hidden");
$('#main_progess' + val.purchase_id + '').attr("class", "progress"); $('#main_progess' + val.purchase_id).attr("class", "progress");
} }
else { else {
$('#progress_bar' + val.purchase_id + '').attr("class", "progress-bar progress-bar-success progress-bar-striped"); //$('#progress_bar' + val.purchase_id).attr("class", "progress-bar progress-bar-success progress-bar-striped");
$('#progress_bar' + val.purchase_id + '').attr("aria-valuenow", val.progress); //$('#progress_bar' + val.purchase_id).attr("aria-valuenow", val.progress);
$('#progress_bar' + val.purchase_id + '').attr('style', 'width:' + val.progress + '%'); //$('#progress_bar' + val.purchase_id).attr('style', 'width:' + val.progress + '%');
document.getElementById('progess_value' + val.purchase_id).innerHTML = val.progress + ' %'; //document.getElementById('progess_value' + val.purchase_id).innerHTML = val.progress + ' %';
$('#view_report' + val.purchase_id + '').removeAttr("disabled"); $('#view_report' + val.purchase_id).removeAttr("disabled");
$('#view_report' + val.purchase_id + '').attr("href", "../reports/T15QZD_sclData/" + val.purchase_id); $('#view_report' + val.purchase_id).attr("href", "../reports/T15QZD_sclData/" + val.purchase_id);
$('#main_progess' + val.purchase_id + '').attr("class", "hidden"); $('#main_progess' + val.purchase_id).attr("class", "hidden");
$('#action_buttons' + val.purchase_id + '').removeClass("hidden"); $('#action_buttons' + val.purchase_id).removeClass("hidden");
} }
}); });
} }
...@@ -42,6 +42,58 @@ $(function () { ...@@ -42,6 +42,58 @@ $(function () {
int = setInterval("refresh()", 1000); int = setInterval("refresh()", 1000);
}); });
$(document).ready(function () {
$('#example').DataTable
({
language:
{
"sProcessing": "Procesando...",
"sLengthMenu": "Mostrar _MENU_ registros",
"sZeroRecords": "No se encontraron resultados",
"sEmptyTable": "Ningún dato disponible en esta tabla",
"sInfo": "Mostrando registros del _START_ al _END_ de un total de _TOTAL_ registros",
"sInfoEmpty": "Mostrando registros del 0 al 0 de un total de 0 registros",
"sInfoFiltered": "(filtrado de un total de _MAX_ registros)",
"sInfoPostFix": "",
"sSearch": "Buscar:",
"sUrl": "",
"sInfoThousands": ",",
"sLoadingRecords": "Cargando...",
"oPaginate":
{
"sFirst": "Primero",
"sLast": "Último",
"sNext": "Siguiente",
"sPrevious": "Anterior"
},
"oAria":
{
"sSortAscending": ": Activar para ordenar la columna de manera ascendente",
"sSortDescending": ": Activar para ordenar la columna de manera descendente"
}
},
responsive:
{
details:
{
type: 'column',
target: 'tr'
}
},
columnDefs:
[{
className: 'control',
orderable: false,
targets: 0
}],
order: [1, 'asc']
});
});
$(function () { $(function () {
$('#reportPage').show(); $('#reportPage').show();
}); });
\ No newline at end of file
reports/templates/Reports.html
View file @ 65f57ac2
{% extends "base_top.html" %} {% extends "base_top.html" %}
{% load staticfiles %} {% load staticfiles %}
{% block headMedia %}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css"/>
<script type="text/javascript" src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
{% endblock %}
{% block messages %} {% block messages %}
<a href="#" class="dropdown-toggle" data-toggle="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">
<i class="fa fa-envelope-o"></i> <i class="fa fa-envelope-o"></i>
...@@ -106,7 +110,7 @@ ...@@ -106,7 +110,7 @@
<span class="pull-right-container"> <span class="pull-right-container">
<span class="label label-primary pull-right"></span> <span class="label label-primary pull-right"></span>
</span> </span>
</a> </a>
</li> </li>
</ul> </ul>
</div> </div>
...@@ -115,7 +119,6 @@ ...@@ -115,7 +119,6 @@
{% block user %} {% block user %}
{% include "user_button.html" %} {% include "user_button.html" %}
{% endblock %} {% endblock %}
{% block content %} {% block content %}
<!-- Content Wrapper. Contains page content --> <!-- Content Wrapper. Contains page content -->
<!-- Main content --> <!-- Main content -->
...@@ -126,8 +129,8 @@ ...@@ -126,8 +129,8 @@
<div class="panel panel-default"> <div class="panel panel-default">
<div class="panel-heading">Reports</div> <div class="panel-heading">Reports</div>
<div class="panel-body" id="mytable"> <div class="panel-body" id="mytable">
<table data-toggle="table" id="example" class="table table-striped table-bordered"
<table data-toggle="table" class="table table-hover table-bordered"> style="width:100%">
<thead> <thead>
<th>Process</th> <th>Process</th>
<th>Purchase date</th> <th>Purchase date</th>
...@@ -147,36 +150,23 @@ ...@@ -147,36 +150,23 @@
<!--td>{{product.clouds}} %</td--> <!--td>{{product.clouds}} %</td-->
<td>{{ product.size }}</td> <td>{{ product.size }}</td>
<td class="text-center"> <td class="text-center">
<div class="progress" id="main_progess{{ product.purchase_id }}" <div class="progress {% if product.progress == 100 %} hidden {% endif %}"
{% if product.progress == 100 %} class="hidden" {% endif %}> id="main_progess{{ product.purchase_id }}">
<div id="progress_bar{{ product.purchase_id }}" role="progressbar" <div id="progress_bar{{ product.purchase_id }}" role="progressbar"
aria-valuenow="{{ product.progress }}" aria-valuenow="{{ product.progress }}"
{% if product.progress == 100 %} class="progress-bar progress-bar-warning progress-bar-striped active"
class="progress-bar progress-bar-success progress-bar-striped" aria-valuemin="0" aria-valuemax="100"
{% else %} style="width:{{ product.progress }}%">
class="progress-bar progress-bar-warning progress-bar-striped active"
{% endif %}
aria-valuemin="0"
aria-valuemax="100" style="width:{{ product.progress }}%">
<p class="text-center" style="color: #0a0a0a" <p class="text-center" style="color: #0a0a0a"
id="progess_value{{ product.purchase_id }}"> id="progess_value{{ product.purchase_id }}">
{% if product.progress == 100 %}
100 %
{% else %}
{{ product.progress }} %
{% endif %}
</p> </p>
</div> </div>
</div> </div>
<div id="action_buttons{{ product.purchase_id }}" {% if product.progress != 100 %} <div id="action_buttons{{ product.purchase_id }}" {% if product.progress != 100 %}
class="hidden" {% endif %}> class="hidden" {% endif %}>
<a id="view_report{{ product.purchase_id }}" title="View Report" <a id="view_report{{ product.purchase_id }}" title="View Report"
{% if product.progress == 100 %} href="../reports/T15QZD_sclData/{{ product.purchase_id }}"
href="#" class="btn btn-success">
{% else %}
href="#"
disabled
{% endif %} class="btn btn-success">
<i class="fa fa-eye"></i> <i class="fa fa-eye"></i>
</a> </a>
<a title="Download zip" {% if product.progress == 100 %} <a title="Download zip" {% if product.progress == 100 %}
...@@ -193,39 +183,16 @@ ...@@ -193,39 +183,16 @@
<i class="fa fa-file-text"></i> <i class="fa fa-file-text"></i>
</a--> </a-->
</div> </div>
</td> </td>
</tr> </tr>
{% endfor %} {% endfor %}
</tbody> </tbody>
</table> </table>
<ul class="pagination">
{% if productList.has_previous %}
<li><a href="?page={{ productList.previous_page_number }}">&laquo;</a></li>
{% else %}
<li class="disabled"><span>&laquo;</span></li>
{% endif %}
{% for i in productList.paginator.page_range %}
{% if productList.number == i %}
<li class="active"><span>{{ i }} <span class="sr-only">(current)</span></span></li>
{% else %}
<li><a href="?page={{ i }}">{{ i }}</a></li>
{% endif %}
{% endfor %}
{% if productList.has_next %}
<li><a href="?page={{ productList.next_page_number }}">&raquo;</a></li>
{% else %}
<li class="disabled"><span>&raquo;</span></li>
{% endif %}
<li class="disabled">
<span>Page {{ productList.number }} of {{ productList.paginator.num_pages }}.</span></li>
</ul>
</div> </div>
</div> </div>
</section> </section>
<!-- /.content --> <!-- /.content -->
</div> </div>
<!-- Footer --> <!-- Footer -->
<footer class=" page-footer font-small special-color-dark pt-5" style="bottom: 0; position: absolute"> <footer class=" page-footer font-small special-color-dark pt-5" style="bottom: 0; position: absolute">
<!-- Footer Elements --> <!-- Footer Elements -->
...@@ -238,7 +205,6 @@ ...@@ -238,7 +205,6 @@
<a href="http://geoint.mx/"> Centro de Investigación en Ciencias de Información Geoespacial.</a> <a href="http://geoint.mx/"> Centro de Investigación en Ciencias de Información Geoespacial.</a>
</div> </div>
<!-- Copyright --> <!-- Copyright -->
</footer> </footer>
<!-- /.Footer --> <!-- /.Footer -->
<!-- Modals --> <!-- Modals -->
...@@ -264,55 +230,6 @@ ...@@ -264,55 +230,6 @@
<!-- /.modals --> <!-- /.modals -->
{% endblock %} {% endblock %}
{% block scripts %} {% block scripts %}
<!--script src="{% static 'reports/js/scripts.js' %}"></script--> <script src="{% static 'reports/js/scripts.js' %}"></script>
<script>
function openmodal(info) {
info2 = info.split(";");
$("#myModal").modal();
$("#log_info").append(info2);
}
function refresh() {
$.ajax({
dataType: "json",
url: 'Reload',
success: function (data) {
$.each(data, function (key, val) {
console.log(key + " = " + val.purchase_id + "" + val.progress)
if (val.progress != 100) {
$('#progress_bar' + val.purchase_id).attr("aria-valuenow", val.progress);
$('#progress_bar' + val.purchase_id).attr('style', 'width:' + val.progress + '%');
document.getElementById('progess_value' + val.purchase_id).innerHTML = val.progress + ' %';
$('#progress_bar' + val.purchase_id).attr("class", "progress-bar progress-bar-warning progress-bar-striped active");
$('#view_report' + val.purchase_id).attr('disabled', 'false');
$('#action_buttons' + val.purchase_id).attr("class", "hidden");
$('#main_progess' + val.purchase_id).removeClass("hidden");
$('#main_progess' + val.purchase_id).attr("class", "progress");
}
else {
$('#progress_bar' + val.purchase_id).attr("class", "progress-bar progress-bar-success progress-bar-striped");
$('#progress_bar' + val.purchase_id).attr("aria-valuenow", val.progress);
$('#progress_bar' + val.purchase_id).attr('style', 'width:' + val.progress + '%');
document.getElementById('progess_value' + val.purchase_id).innerHTML = val.progress + ' %';
$('#view_report' + val.purchase_id).removeAttr("disabled");
$('#view_report' + val.purchase_id).attr("href", "../reports/T15QZD_sclData/" + val.purchase_id);
$('#main_progess' + val.purchase_id).attr("class", "hidden");
$('#action_buttons' + val.purchase_id).removeClass("hidden");
}
});
}
});
};
$(function () {
var int;
refresh();
int = setInterval("refresh()", 1000);
});
$(function () {
$('#reportPage').show();
});
</script>
{% endblock %} {% endblock %}
\ No newline at end of file
reports/views.py
View file @ 65f57ac2
...@@ -133,9 +133,9 @@ def Reports(request): ...@@ -133,9 +133,9 @@ def Reports(request):
############################################## ##############################################
# paginacion # # paginacion #
############################################## ##############################################
paginator = Paginator(productList, 10) # Show 25 contacts per page #paginator = Paginator(productList, 3) # Show 25 contacts per page
page = request.GET.get('page') #page = request.GET.get('page')
productList = paginator.get_page(page) #productList = paginator.get_page(page)
return render(request, 'Reports.html', {"productList": productList}) return render(request, 'Reports.html', {"productList": productList})
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment