slider de reportes

parent 9ae0f876
......@@ -318,4 +318,34 @@ select::-ms-expand {
border-top-color: #ffa74f;
border-width: 11px;
margin-left: -11px;
}
\ No newline at end of file
}
/*progress bar effect*/
/*left and right arrows for slider with font-awesome*/
.fas.fa-chevron-left {
position: absolute;
left: 0;
top: 40%;
margin-left: 5px;
color: rgba(11, 15, 192, 0.5);
font-size: 60px;
z-index: 100;
}
.fas.fa-chevron-right {
position: absolute;
right: 0;
top: 40%;
margin-right: 5px;
color: rgba(11, 15, 192, 0.5);
font-size: 60px;
z-index: 100;
}
\ No newline at end of file
......@@ -120,16 +120,19 @@
{% block content %}
<!-- Content Wrapper. Contains page content -->
<!-- Main content -->
<div id="timeLine" class="container floating-panel slidecontainer" style="position:absolute; display:block; bottom: 40px; left: 12%; width: 500px; z-index: 1000">
<div id="timeLine" class="container floating-panel slidecontainer"
style="position:absolute; display:block; bottom: 40px; left: 12%; width: 500px; z-index: 1000">
<div class="range-control" id="rangecontrol">
<div id="rangecontrol2"></div>
<div id="rangecontrol2"></div>
<input class="cross-range" id="inputRange" type="range" min="0" max="{{ labels|length|add:'-1' }}" step="1" value="0" data-thumbwidth="20" style="background: transparent;">
<input class="cross-range" id="inputRange" type="range" min="0" max="{{ labels|length|add:'-1' }}" step="1"
value="0" data-thumbwidth="20" style="background: transparent;">
<datalist class="range__list" id="number">
{% for label in labels %}
<option class="range__opt" value="{{ label }}">{{ label|slice:"6:8" }}/{{ label|slice:"4:6" }}/{{label|slice:"0:4" }}</option>
<option class="range__opt"
value="{{ label }}">{{ label|slice:"6:8" }}/{{ label|slice:"4:6" }}/{{ label|slice:"0:4" }}</option>
{% endfor %}
</datalist>
......@@ -153,7 +156,7 @@
<div id="selectRight" class="container floating-panel"
style="position:absolute; display:none; bottom: 50px; left: 75%; width: 300px; z-index: 1000">
<div>
<div id="rangecontrol4"></div>
<div id="rangecontrol4"></div>
<!--<select onchange="selectRight(this.value)" id="selectRightCompare">
{% for label in labels %}
<option value="{{label}}" >{{ label|slice:"6:8" }}/{{ label|slice:"4:6" }}/{{label|slice:"0:4" }}</option>
......@@ -209,14 +212,19 @@
</div>
</div>
<div id="reportPage" class="wrapper" style="background-color: #ecf0f5">
<div id="minimap" class="minimap"></div>
<section class="content">
<a href="#" id="button_left" title="Previous" onclick="previus_report({{ request.path_info|slice:"9:" }})"><i class="fas fa-chevron-left"></i></a>
<a href="#" id="button_right" title="Next" onclick="next_report({{ request.path_info|slice:"9:" }})"><i class="fas fa-chevron-right"></i></a>
<div class="row col-lg-11 title">
<div class="box box-success box-solid info">
<div class="box-header with-border">
<h3>{{ searchInfo.title }}, {{ searchInfo.startDate }} to {{ searchInfo.endDate}}</h3>
<h3>{{ searchInfo.title }}, {{ searchInfo.startDate }} to {{ searchInfo.endDate }}</h3>
<h6>{{ searchInfo.report_name }}</h6>
<!-- /.box-tools -->
</div>
......@@ -370,15 +378,15 @@
var pixelPostion = slider3.clientWidth * sliderPos;
addImageLayer({
layerDate: valor
layerDate: valor
});
$("#tooltiptext").empty();
$("#tooltiptext").append(fecha);
$("#rangecontrol2").empty();
$("#rangecontrol2").append('<span class="arrow_box" id="tooltiptext">'+fecha+'</span>');
$('.arrow_box').css({'left':Math.round(pixelPostion-35) + 'px'})
$("#rangecontrol2").append('<span class="arrow_box" id="tooltiptext">' + fecha + '</span>');
$('.arrow_box').css({'left': Math.round(pixelPostion - 35) + 'px'})
});
$('input[id="selectLeftCompare"]').on('input', function () {
......@@ -400,13 +408,11 @@
var pixelPostion = slider3.clientWidth * sliderPos;
$("#tooltiptext2").empty();
$("#tooltiptext2").append(fecha);
$("#rangecontrol3").empty();
$("#rangecontrol3").append('<span class="arrow_box_left" id="tooltiptext2">'+fecha+'</span>');
$('.arrow_box_left').css({'left':Math.round(pixelPostion-35) + 'px'})
$("#rangecontrol3").append('<span class="arrow_box_left" id="tooltiptext2">' + fecha + '</span>');
$('.arrow_box_left').css({'left': Math.round(pixelPostion - 35) + 'px'})
});
......@@ -429,13 +435,11 @@
var pixelPostion = slider3.clientWidth * sliderPos;
$("#tooltiptext3").empty();
$("#tooltiptext3").append(fecha);
$("#rangecontrol4").empty();
$("#rangecontrol4").append('<span class="arrow_box_right" id="tooltiptext3">'+fecha+'</span>');
$('.arrow_box_right').css({'left':Math.round(pixelPostion-35) + 'px'})
$("#rangecontrol4").append('<span class="arrow_box_right" id="tooltiptext3">' + fecha + '</span>');
$('.arrow_box_right').css({'left': Math.round(pixelPostion - 35) + 'px'})
});
</script>
......@@ -444,76 +448,78 @@
const legendOnClickHandler = function (e, legendItem) {
const index = legendItem.datasetIndex;
const ch = this.chart;
const checkbox_id = '#sclcheck-'+legendItem.text.toLowerCase().replace(/\s/g, '-');
const checkbox_id = '#sclcheck-' + legendItem.text.toLowerCase().replace(/\s/g, '-');
// isDatasetVisible return the opposite status?
if (ch.getDatasetMeta(index).hidden === null) {
ch.getDatasetMeta(index).hidden = false;
ch.getDatasetMeta(index).hidden = false;
} else {
ch.getDatasetMeta(index).hidden = !ch.getDatasetMeta(index).hidden;
ch.getDatasetMeta(index).hidden = !ch.getDatasetMeta(index).hidden;
}
ch.update();
const layerInput = $(checkbox_id+" :input");
const layerInput = $(checkbox_id + " :input");
layerInput.prop("checked", !ch.getDatasetMeta(index).hidden);
if (layerInput.prop("checked")) {
addImageLayer({
layerName: layerInput.val()
});
addImageLayer({
layerName: layerInput.val()
});
} else {
removeLayer(layerInput.val());
removeLayer(layerInput.val());
}
};
const showSCLcheckboxes = function (datasets) {
if (!datasets || datasets.length < 1) {
return;
}
datasets.forEach(function(data) {
let checkbox_id = '#sclcheck-'+data.label.toLowerCase().replace(' ','-');
$(checkbox_id).show();
$(checkbox_id+" :input").prop("checked", false);
});
if (!datasets || datasets.length < 1) {
return;
}
datasets.forEach(function (data) {
let checkbox_id = '#sclcheck-' + data.label.toLowerCase().replace(' ', '-');
$(checkbox_id).show();
$(checkbox_id + " :input").prop("checked", false);
});
}
const getSelectedLayersName = function () {
const inputs = $("input[name=layer_type]:checked");
let values = []
const inputs = $("input[name=layer_type]:checked");
let values = []
Object.keys(inputs).forEach(key => {
let value = inputs[key].value;
if (value) {values.push(value)}
});
Object.keys(inputs).forEach(key => {
let value = inputs[key].value;
if (value) {
values.push(value)
}
});
return values;
return values;
}
const getChartDataIndex = function (id) {
const datasetsLabels = myChart.config.data.datasets.map(data =>
'sclcheck-' + data.label.toLowerCase().replace(' ', '-')
);
return datasetsLabels.indexOf(id);
const datasetsLabels = myChart.config.data.datasets.map(data =>
'sclcheck-' + data.label.toLowerCase().replace(' ', '-')
);
return datasetsLabels.indexOf(id);
}
$('input[name=layer_type]').on('click', function() {
const input = $(this);
const index = getChartDataIndex(input.parent().attr('id'));
$('input[name=layer_type]').on('click', function () {
const input = $(this);
const index = getChartDataIndex(input.parent().attr('id'));
if (index > -1) {
myChart.getDatasetMeta(index).hidden=!input.prop("checked");
myChart.update();
}
if (index > -1) {
myChart.getDatasetMeta(index).hidden = !input.prop("checked");
myChart.update();
}
if (input.prop("checked")) {
addImageLayer({
layerName: input.val()
});
} else {
removeLayer(input.val());
}
if (input.prop("checked")) {
addImageLayer({
layerName: input.val()
});
} else {
removeLayer(input.val());
}
});
var label;
......@@ -530,6 +536,7 @@
let clouds = "{{ searchInfo.clouds }}";
let oldLabel = "{{defaultDataSet}}";
let labels = {{labels}};
let lista_productos = {{ lista }}
var config = {{graphData}};
let polygon = "{{searchInfo.polygon}}"
......@@ -538,13 +545,36 @@
maintainAspectRatio: false,
// scales: { xAxes: [{ stacked: true }], yAxes: [{ stacked: true }] },
legend: {
display: true,
onClick: legendOnClickHandler,
display: true,
onClick: legendOnClickHandler,
}
};
showSCLcheckboxes(config.data.datasets);
{% endautoescape %}
function next_report(number) {
let index = lista_productos.indexOf(number);
index++;
if (index >= lista_productos.length)
index = 0;
console.log(lista_productos[index]);
window.location.replace("../reports/"+lista_productos[index]);
}
function previus_report(number) {
let index = lista_productos.indexOf(number);
index--;
if (index <= lista_productos.length)
index = 0;
console.log(lista_productos[index]);
window.location.replace("../reports/"+lista_productos[index]);
}
</script>
<script type="text/javascript" src="{% static 'reports/js/reportImg.js' %}"></script>
<script type="text/javascript" src="{% static 'reports/js/reportPdf.js' %}"></script>
......
......@@ -47,6 +47,7 @@ def report_L2ASCL(request, purchase_id):
template = "sclData.html"
reporteDir = 'mask'
folders = ""
productList = []
purchase = Purchase.objects.values('user__email', 'is_public', 'name', 'search__search_name',
'search__process_id__name','description','aggreg_date').get(pk=purchase_id)
email = purchase['user__email']
......@@ -90,13 +91,34 @@ def report_L2ASCL(request, purchase_id):
#PDFGenerator(request, path, reporteDir, datasets,searchInfo)
pass
if request.user.is_authenticated:
product_list = Purchase.objects.values('id').filter(
user_id__in=[request.user.id],
purchased=1,
is_public = True,
progress=100
)
else:
product_list = Purchase.objects.values('id').filter(
is_public=True,
progress=100,
user__email= email
)
for producto in product_list:
productList.append(
producto['id'],
)
print (product_list)
return render(request, template, {"graphData": json.dumps(graphData),
"searchInfo": searchInfo, "IMAGE_PATH": image_path,
"SCL_PATH": SCL_path, 'dafaultLabel': defaultLabel,
'defaultDataSet': defaultDataset, "folders": folders,
"zone": reporteDir, "purchaseID": purchase_id,
"labels": graphData['data']['labels'],
"email": email})
"email": email,"lista":productList})
# -------------------------------------------------------------------------------def Reports(request):
......@@ -145,10 +167,11 @@ def Reports(request):
progress = 60
if 'Finalizing...' in open(log_info).read():
progress = 100
# item = Purchase.objects.filter(pk=producto['id'])
# item = Purchase.objects.get(pk=producto['id'])
# item.progress = progress
# item.save()
#item = Purchase.objects.filter(pk=producto['id'])
item = Purchase.objects.get(pk=producto['id'])
item.progress = progress
item.save()
with open(log_info, 'r') as myfile:
log = myfile.read().replace('\n', '')
......
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