vrr/ntopng
2
0
Fork 0
mirror of https://github.com/ntop/ntopng.git synced 2026-05-05 19:15:03 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 4

Fix data-time-picker component and update timeseries

Browse source
This commit is contained in:
uccidibuti 2022-10-04 15:05:28 +02:00
parent 72043222fb
commit 6ea03041d0
3 changed files with 31 additions and 18 deletions
Download patch file Download diff file Expand all files Collapse all files

5
http_src/vue/data-time-range-picker.vue
View file

@ -228,7 +228,7 @@ export default {
// },
change_select_time: function() {
let s_values = this.get_select_values();
let interval_s = s_values[this.selected_time_preset.value];
let interval_s = s_values[this.selected_time_option.value];
let epoch_end = this.get_utc_seconds(Date.now());
let epoch_begin = epoch_end - interval_s;
let status = { epoch_begin: epoch_begin, epoch_end: epoch_end };
@ -328,11 +328,10 @@ export default {
epoch_status: null,
enable_apply: false,
select_time_value: "min_5",
selected_time_option: null,
selected_time_option: { value: "min_5", label: i18n('show_alerts.presets.5_min'), currently_active: false },
wrong_date: false,
flat_begin_date: null,
flat_end_date: null,
selected_time_preset: { value: "min_30", label: i18n('show_alerts.presets.30_min') },
time_preset_list: [
{ value: "min_5", label: i18n('show_alerts.presets.5_min'), currently_active: false },
{ value: "min_30", label: i18n('show_alerts.presets.30_min'), currently_active: true },

16
http_src/vue/modal-traffic-extraction.vue
View file

@ -12,15 +12,15 @@
</div>
<div class="form-group mb-3 col-md-9 text-right asd">
<label class="radio-inline"><input type="radio" name="extract_now" v-model="extract_now" value="true" checked="">{{i18n('traffic_recording.extract_now')}}</label>
<label class="radio-inline"><input type="radio" name="extract_now" v-model="extract_now" value="false">{{i18n('traffic_recording.queue_as_job')}}</label>
<label class="radio-inline" style="margin-left: 1rem;"><input type="radio" name="extract_now" v-model="extract_now" value="true" checked=""> {{i18n('traffic_recording.extract_now')}} </label>
<label class="radio-inline"><input type="radio" name="extract_now" v-model="extract_now" value="false"> {{i18n('traffic_recording.queue_as_job')}} </label>
</div>
</div>
<div v-show="show_menu" class="row" id="pcapDownloadModal_advanced" style="">
<div class="form-group mb-3 col-md-12 has-feedback">
<br>
<label class="form-label">{{i18n('traffic_recording.filter_nbpf')}}<a class="ntopng-external-link" href="https://www.ntop.org/guides/n2disk/filters.html"><i class="fas fa-external-link-alt"></i></a></label>
<label class="form-label">{{i18n('traffic_recording.filter_bpf')}} <a class="ntopng-external-link" href="https://www.ntop.org/guides/n2disk/filters.html"><i class="fas fa-external-link-alt"></i></a></label>
<div class="input-group">
<span class="input-group-addon"><span class="glyphicon glyphicon-filter"></span></span>
<input name="bpf_filter" v-model="bpf_filter" class="form-control input-sm" data-bpf="bpf" autocomplete="off" spellcheck="false">
@ -91,7 +91,7 @@ export default defineComponent({
},
apply: async function() {
if (this.bpf_filter != null && this.bpf_filter != "") {
let url_request = `${base_path}/lua/pro/rest/v2/check/filter.lua?query=${this.bpf_filter}`;
let url_request = `${http_prefix}/lua/pro/rest/v2/check/filter.lua?query=${this.bpf_filter}`;
let res = await ntopng_utility.http_request(url_request, null, false, true);
this.invalid_bpf = !res.response;
if (this.invalid_bpf == true) {
@ -107,10 +107,10 @@ export default defineComponent({
let url_request_params = ntopng_url_manager.obj_to_url_params(url_request_obj);
if (this.extract_now == true) {
let url_request = `${base_path}/lua/rest/v2/get/pcap/live_extraction.lua?${url_request_params}`;
let url_request = `${http_prefix}/lua/rest/v2/get/pcap/live_extraction.lua?${url_request_params}`;
window.open(url_request, '_self', false);
} else {
let url_request = `${base_path}/lua/traffic_extraction.lua?${url_request_params}`;
let url_request = `${http_prefix}/lua/traffic_extraction.lua?${url_request_params}`;
let resp = await ntopng_utility.http_request(url_request, null, false, true);
let job_id = resp.id;
//let job_id = 2;
@ -127,7 +127,7 @@ export default defineComponent({
show: async function(bpf_filter) {
if (bpf_filter == null) {
let url_params = ntopng_url_manager.get_url_params();
let url_request = `${base_path}/lua/pro/rest/v2/get/db/filter/bpf.lua?${url_params}`;
let url_request = `${http_prefix}/lua/pro/rest/v2/get/db/filter/bpf.lua?${url_params}`;
let res = await ntopng_utility.http_request(url_request);
if (res == null || res.bpf == null) {
console.error(`modal-traffic-extraction: ${url_request} return null value`);
@ -149,7 +149,7 @@ export default defineComponent({
this.description = desc;
// let url_params = ntopng_url_manager.get_url_params();
// let url_request = `${base_path}/lua/pro/rest/v2/get/db/filter/bpf.lua?${url_params}`;
// let url_request = `${http_prefix}/lua/pro/rest/v2/get/db/filter/bpf.lua?${url_params}`;
// let res = await ntopng_utility.http_request(url_request);
// this.bpf_filter = res.bpf;
this.bpf_filter = bpf_filter;

28
http_src/vue/page-stats.vue
View file

@ -1,15 +1,17 @@
<!-- (C) 2022 - ntop.org -->
<template>
<div class="col-12 mb-2 mt-2">
<AlertInfo></AlertInfo>
<div class="card h-100 overflow-hidden">
<DataTimeRangePicker style="margin-top:0.5rem;"
:id="id_date_time_picker"
ref="date_time_picker"
@epoch_change="epoch_change">
:id="id_date_time_picker"
ref="date_time_picker"
@epoch_change="epoch_change">
<template v-slot:begin>
</template>
<template v-slot:extra_buttons>
<button v-if="enable_snapshots" class="btn btn-link btn-sm" @click="show_modal_snapshot" :title="_i18n('page_stats.manage_snapshots_btn')"><i class="fas fa-lg fa-camera-retro"></i></button>
<button v-if="show_pcap_download || false" class="btn btn-link btn-sm" @click="show_modal_traffic_extraction" :title="_i18n('traffic_recording.pcap_download')"><i class="fas fa-lg fa-download"></i></button>
</template>
</DataTimeRangePicker>
@ -74,8 +76,7 @@
</div>
</div>
</div>
<!-- <SimpleTable :chart_options="last_chart_options" -->
<!-- ></SimpleTable> -->
<ModalSnapshot v-if="enable_snapshots" ref="modal_snapshot"
:csrf="csrf"
:page="page_snapshots"
@ -86,7 +87,13 @@
<ModalTimeseries
ref="modal_timeseries"
@apply="apply_modal_timeseries"></ModalTimeseries>
@apply="apply_modal_timeseries">
</ModalTimeseries>
<ModalTrafficExtraction
id="page_stats_modal_traffic_extraction"
ref="modal_traffic_extraction">
</ModalTrafficExtraction>
</template>
<script setup>
@ -95,7 +102,9 @@ import { default as Chart } from "./chart.vue";
import { default as DataTimeRangePicker } from "./data-time-range-picker.vue";
import { default as ModalSnapshot } from "./modal-snapshot.vue";
import { default as ModalTimeseries } from "./modal-timeseries.vue";
import { default as SimpleTable } from "./simple-table.vue";
import { default as ModalTrafficExtraction } from "./modal-traffic-extraction.vue";
import { default as AlertInfo } from "./alert-info.vue";
import { default as SelectSearch } from "./select-search.vue";
import { default as Datatable } from "./datatable.vue";
import { default as BootstrapTable } from "./bootstrap-table.vue";
@ -552,6 +561,11 @@ function print_stats_row(col, row) {
return label;
}
const modal_traffic_extraction = ref(null);
function show_modal_traffic_extraction() {
modal_traffic_extraction.value.show();
}
const _i18n = (t) => i18n(t);
</script>