Migracia a male opravy
- csrf ocharana, vypnutie pre /log - oprava loggovania pamate - pridanie vue skriptov
This commit is contained in:
76
resources/js/components/NetworkGraph.vue
Executable file
76
resources/js/components/NetworkGraph.vue
Executable file
@@ -0,0 +1,76 @@
|
||||
<template>
|
||||
<div>
|
||||
<dygraphs width="800" :graphData="series" :graphOptions="options"></dygraphs>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: ['raw_data'],
|
||||
name: "LineBase",
|
||||
data() {
|
||||
return {
|
||||
options: {
|
||||
legend: 'always',
|
||||
title: 'Network Graph',
|
||||
xlabel: 'Dátum',
|
||||
labels: ['Dátum','Prijate','Odoslane'],
|
||||
ylabel: 'Bytes',
|
||||
labelsKMG2: true,
|
||||
fillGraph: true
|
||||
},
|
||||
series: [],
|
||||
};
|
||||
},
|
||||
created: function () {
|
||||
// `this` points to the vm instance
|
||||
console.log('created');
|
||||
|
||||
let last_time = null;
|
||||
let last_recv = 0;
|
||||
let last_sent = 0;
|
||||
|
||||
for (var index = 0; index < this.raw_data.length; ++index) {
|
||||
let row = this.raw_data[index];
|
||||
let sent = row["netstat_sent"];
|
||||
let recv = row["netstat_recv"];
|
||||
let created_at = row["created_at"];
|
||||
|
||||
let time = moment(created_at);
|
||||
|
||||
if (last_time == null || time.unix() - last_time.unix() > 900 || recv - last_recv < 0 || sent - last_sent < 0 ) {
|
||||
if (last_time != null) {
|
||||
this.series.push([last_time.toDate(),0,0]);
|
||||
}
|
||||
|
||||
this.series.push([time.toDate(),0,0]);
|
||||
|
||||
last_time = time;
|
||||
last_recv = 0;
|
||||
last_sent = 0;
|
||||
|
||||
continue;
|
||||
}
|
||||
|
||||
let rb = recv - last_recv;
|
||||
let sb = sent - last_sent;
|
||||
let lt = time.unix() - last_time.unix();
|
||||
|
||||
this.series.push([time.toDate(),rb/lt,sb/lt]);
|
||||
|
||||
last_time = time;
|
||||
last_recv = recv;
|
||||
last_sent = sent;
|
||||
|
||||
}
|
||||
console.log(this.series);
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.chart {
|
||||
width: 100%;
|
||||
height: 300px;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user