Se añaden gráficas para vista de ONU.

src/StatsBundle/Controller/StatsController.php

@@ -485,131 +485,184 @@ class StatsController extends Controller
 
     public function cmtsInterfaceHistoricAction(Request $request)
     {
-    $em = $this->get("doctrine.orm.entity_manager");
-    $endpoint = $this->get('endpoint.mongo');
-    
-    ($request->get('from'))? $from = $request->get('from') : $from = date("Y-m-d H:i:s",strtotime("-3 hour"));
-    ($request->get('to'))? $to = $request->get('to') : $to = date("Y-m-d H:i:s",strtotime("now"));
-    $range = array('from' => $from, 'to' => $to);
-
-    $interface = $em->getRepository("StatsBundle:CmtsInterface")->findOneById($request->get('id'));
-    $cmtsDeviceId = $interface->getCmtsDeviceId();
-    $deviceServerId = $interface->getDeviceServer()->getId();
-    $index = $interface->getIndex();
-
-    $prefix = "d_{$cmtsDeviceId}_s_{$deviceServerId}";
-
-    $series = $targets = array();
-    $targets["in_bandwidth"] = array("target" => "{$prefix}_inbandwidth_if_{$index}");
-    $targets["out_bandwidth"] = array("target" => "{$prefix}_outbandwidth_if_{$index}");
-    $targets["signal"] = array("target" => "{$prefix}_if_signal_{$index}");
-    $targets["on"] = array("target" => "{$prefix}_if_state_on_{$index}");
-    $targets["off"] = array("target" => "{$prefix}_if_state_off_{$index}");
-    
-    $errors = array();
-    
-    foreach($targets as $index => $t) {
+        $em = $this->get("doctrine.orm.entity_manager");
+        $endpoint = $this->get('endpoint.mongo');
         
-        if(!isset($series[$index])) $series[$index] = array('name' => $index, 'data' => array());
-
-        $search = array('targets' => array(0 => $t), 'maxDataPoints' => 5000, 'range' => $range);
-        try {
-            $data = $endpoint->get(json_encode($search),'query', true);
-        } catch(\Exception $e) {
-            $errors[] = array("msg" => "Falla mongo_json_endpoint({$index}): {$e->getMessage()}");
-            $data = array();
-        }
+        ($request->get('from'))? $from = $request->get('from') : $from = date("Y-m-d H:i:s",strtotime("-3 hour"));
+        ($request->get('to'))? $to = $request->get('to') : $to = date("Y-m-d H:i:s",strtotime("now"));
+        $range = array('from' => $from, 'to' => $to);
+
+        $interface = $em->getRepository("StatsBundle:CmtsInterface")->findOneById($request->get('id'));
+        $cmtsDeviceId = $interface->getCmtsDeviceId();
+        $deviceServerId = $interface->getDeviceServer()->getId();
+        $index = $interface->getIndex();
+
+        $prefix = "d_{$cmtsDeviceId}_s_{$deviceServerId}";
+
+        $series = $targets = array();
+        $targets["in_bandwidth"] = array("target" => "{$prefix}_inbandwidth_if_{$index}");
+        $targets["out_bandwidth"] = array("target" => "{$prefix}_outbandwidth_if_{$index}");
+        $targets["signal"] = array("target" => "{$prefix}_if_signal_{$index}");
+        $targets["on"] = array("target" => "{$prefix}_if_state_on_{$index}");
+        $targets["off"] = array("target" => "{$prefix}_if_state_off_{$index}");
+        
+        $errors = array();
+        
+        foreach($targets as $index => $t) {
+
+            if(!isset($series[$index])) $series[$index] = array('name' => $index, 'data' => array());
+
+            $search = array('targets' => array(0 => $t), 'maxDataPoints' => 5000, 'range' => $range);
+            try {
+                $data = $endpoint->get(json_encode($search),'query', true);
+            } catch(\Exception $e) {
+                $errors[] = array("msg" => "Falla mongo_json_endpoint({$index}): {$e->getMessage()}");
+                $data = array();
+            }
 
 
-        if(isset($data[0]) && isset($data[0]['datapoints'])) {
-            $points = array();
-            foreach($data[0]['datapoints'] as $d) {
-                $points[] = array($d[1],$d[0]);
+            if(isset($data[0]) && isset($data[0]['datapoints'])) {
+                $points = array();
+                foreach($data[0]['datapoints'] as $d) {
+                    $points[] = array($d[1],$d[0]);
+                }
+                $series[$index]['data'] = $points;
             }
-            $series[$index]['data'] = $points;
         }
-    }
 
-    if ($request->isMethod('GET')) {
-        return $this->render('StatsBundle:Stats:cmts_interface.html.twig', array(
-                    'series' => $series
-        ));
-    }
+        if ($request->isMethod('GET')) {
+            return $this->render('StatsBundle:Stats:cmts_interface.html.twig', array(
+                        'series' => $series
+            ));
+        }
 
-    return new JsonResponse(array(
-        'series' => $series,
-    ));
+        return new JsonResponse(array(
+            'series' => $series,
+        ));
     }
 
     public function oltPonPortHistoricAction(Request $request)
     {
-    $em = $this->get("doctrine.orm.entity_manager");
-    $endpoint = $this->get('endpoint.mongo');
-    
-    ($request->get('from'))? $from = $request->get('from') : $from = date("Y-m-d H:i:s",strtotime("-3 hour"));
-    ($request->get('to'))? $to = $request->get('to') : $to = date("Y-m-d H:i:s",strtotime("now"));
-    $range = array('from' => $from, 'to' => $to);
-
-    $pon = $em->getRepository("StatsBundle:PonPort")->findOneById($request->get('id'));
-    $oltDeviceId = $pon->getOltDeviceId();
-    $deviceServerId = $pon->getDeviceServer()->getId();
-    $ponPort = str_replace("/",".",$pon->getPonPort());
-
-    $prefix = "d_{$oltDeviceId}_s_{$deviceServerId}";
-
-    $series = $targets = array();
-    $targets["in_bandwidth"] = array("target" => "{$prefix}_inbandwidth_pon_{$ponPort}");
-    $targets["out_bandwidth"] = array("target" => "{$prefix}_outbandwidth_pon_{$ponPort}");
-    $targets["tx"] = array("target" => "{$prefix}_pon_tx_{$ponPort}");
-    $targets["voltage"] = array("target" => "{$prefix}_pon_voltage_{$ponPort}");
-    $targets["temperature"] = array("target" => "{$prefix}_pon_temperature_{$ponPort}");
-    $targets["on"] = array("target" => "{$prefix}_pon_state_on_{$ponPort}");
-    $targets["off"] = array("target" => "{$prefix}_pon_state_off_{$ponPort}");
-    
-    $errors = array();
-    
-    foreach($targets as $index => $t) {
+        $em = $this->get("doctrine.orm.entity_manager");
+        $endpoint = $this->get('endpoint.mongo');
         
-        if(!isset($series[$index])) $series[$index] = array('name' => $index, 'data' => array());
-
-        $search = array('targets' => array(0 => $t), 'maxDataPoints' => 5000, 'range' => $range);
-        try {
-            $data = $endpoint->get(json_encode($search),'query', true);
-        } catch(\Exception $e) {
-            $errors[] = array("msg" => "Falla mongo_json_endpoint({$index}): {$e->getMessage()}");
-            $data = array();
+        ($request->get('from'))? $from = $request->get('from') : $from = date("Y-m-d H:i:s",strtotime("-3 hour"));
+        ($request->get('to'))? $to = $request->get('to') : $to = date("Y-m-d H:i:s",strtotime("now"));
+        $range = array('from' => $from, 'to' => $to);
+
+        $pon = $em->getRepository("StatsBundle:PonPort")->findOneById($request->get('id'));
+        $oltDeviceId = $pon->getOltDeviceId();
+        $deviceServerId = $pon->getDeviceServer()->getId();
+        $ponPort = str_replace("/",".",$pon->getPonPort());
+
+        $prefix = "d_{$oltDeviceId}_s_{$deviceServerId}";
+
+        $series = $targets = array();
+        $targets["in_bandwidth"] = array("target" => "{$prefix}_inbandwidth_pon_{$ponPort}");
+        $targets["out_bandwidth"] = array("target" => "{$prefix}_outbandwidth_pon_{$ponPort}");
+        $targets["tx"] = array("target" => "{$prefix}_pon_tx_{$ponPort}");
+        $targets["voltage"] = array("target" => "{$prefix}_pon_voltage_{$ponPort}");
+        $targets["temperature"] = array("target" => "{$prefix}_pon_temperature_{$ponPort}");
+        $targets["on"] = array("target" => "{$prefix}_pon_state_on_{$ponPort}");
+        $targets["off"] = array("target" => "{$prefix}_pon_state_off_{$ponPort}");
+        
+        $errors = array();
+        
+        foreach($targets as $index => $t) {
+
+            if(!isset($series[$index])) $series[$index] = array('name' => $index, 'data' => array());
+
+            $search = array('targets' => array(0 => $t), 'maxDataPoints' => 5000, 'range' => $range);
+            try {
+                $data = $endpoint->get(json_encode($search),'query', true);
+            } catch(\Exception $e) {
+                $errors[] = array("msg" => "Falla mongo_json_endpoint({$index}): {$e->getMessage()}");
+                $data = array();
+            }
+
+            if(isset($data[0]) && isset($data[0]['datapoints'])) {
+                $points = array();
+                foreach($data[0]['datapoints'] as $d) {
+                    $points[] = array($d[1],$d[0]);
+                }
+                $series[$index]['data'] = $points;
+            }
         }
 
-        if(isset($data[0]) && isset($data[0]['datapoints'])) {
-            $points = array();
-            foreach($data[0]['datapoints'] as $d) {
-                $points[] = array($d[1],$d[0]);
+        $q = $em->getRepository("StatsBundle:Onu")->createQueryBuilder('o');
+        $onus = $q->where($q->expr()->like('o.ponPort', ':ponPort'))
+                ->andWhere('o.oltDeviceId = :oltDeviceId')
+                ->andWhere('o.deviceServer = :deviceServer')
+                ->setParameter('ponPort', "{$pon->getPonPort()}%")
+                ->setParameter('oltDeviceId', $oltDeviceId)
+                ->setParameter('deviceServer', $deviceServerId)
+                ->getQuery()
+                ->getResult();
+
+        $seriesOnus = $targets =  array();
+        if($onus) {
+            foreach($onus as $index => $onu) {
+                $ponPort = str_replace("/",".",$onu->getPonPort());
+                $targets[$onu->getPonSerialNumber()] = array("target" => "{$prefix}_pon_rx_{$ponPort}");
+            }
+
+            foreach($targets as $index => $t) {
+            
+                if(!isset($seriesOnus[$index])) $seriesOnus[$index] = array('name' => $index, 'data' => array());
+            
+                $search = array('targets' => array(0 => $t), 'maxDataPoints' => 5000, 'range' => $range);
+                try {
+                    $data = $endpoint->get(json_encode($search),'query', true);
+                } catch(\Exception $e) {
+                    $errors[] = array("msg" => "Falla mongo_json_endpoint({$index}): {$e->getMessage()}");
+                    $data = array();
+                }
+            
+                if(isset($data[0]) && isset($data[0]['datapoints'])) {
+                    $points = array();
+                    foreach($data[0]['datapoints'] as $d) {
+                        $points[] = array($d[1],$d[0]);
+                    }
+                    $seriesOnus[$index]['data'] = $points;
+                }
             }
-            $series[$index]['data'] = $points;
         }
-    }
 
-    $q = $em->getRepository("StatsBundle:Onu")->createQueryBuilder('o');
-    $onus = $q->where($q->expr()->like('o.ponPort', ':ponPort'))
-            ->andWhere('o.oltDeviceId = :oltDeviceId')
-            ->andWhere('o.deviceServer = :deviceServer')
-            ->setParameter('ponPort', "{$pon->getPonPort()}%")
-            ->setParameter('oltDeviceId', $oltDeviceId)
-            ->setParameter('deviceServer', $deviceServerId)
-            ->getQuery()
-            ->getResult();
-
-    $seriesOnus = $targets =  array();
-    if($onus) {
-        foreach($onus as $index => $onu) {
-            $ponPort = str_replace("/",".",$onu->getPonPort());
-            $targets[$onu->getPonSerialNumber()] = array("target" => "{$prefix}_pon_rx_{$ponPort}");
+        if ($request->isMethod('GET')) {
+            return $this->render('StatsBundle:Stats:olt_ponport.html.twig', array(
+                        'series' => $series,
+                        'seriesOnus' => $seriesOnus
+            ));
         }
 
-        foreach($targets as $index => $t) {
+        return new JsonResponse(array('series' => $series,'seriesOnus' => $seriesOnus));
+    }
+
+    public function onuHistoricAction(Request $request)
+    {
+        $endpoint = $this->get('endpoint.mongo');
+        
+        ($request->get('from'))? $from = $request->get('from') : $from = date("Y-m-d H:i:s",strtotime("-3 hour"));
+        ($request->get('to'))? $to = $request->get('to') : $to = date("Y-m-d H:i:s",strtotime("now"));
+        $range = array('from' => $from, 'to' => $to);
+
+        $psn = strtolower($request->get('ponSerialNumber'));
+
+        $series = $targets = array();
+        $targets["in_bandwidth"] = array("target" => "inbandwidth_onu_{$psn}");
+        $targets["out_bandwidth"] = array("target" => "outbandwidth_onu_{$psn}");
+        $targets["tx"] = array("target" => "onu_tx_{$psn}");
+        $targets["rx"] = array("target" => "onu_rx_{$psn}");
+        $targets["voltage"] = array("target" => "onu_voltage_{$psn}");
+        $targets["temperature"] = array("target" => "onu_temperature_{$psn}");
+        $targets["status"] = array("target" => "onu_status_{$psn}");
         
-            if(!isset($seriesOnus[$index])) $seriesOnus[$index] = array('name' => $index, 'data' => array());
-    
+        $errors = array();
+
+        foreach($targets as $index => $t) {
+
+            if(!isset($series[$index])) $series[$index] = array('name' => $index, 'data' => array());
+
             $search = array('targets' => array(0 => $t), 'maxDataPoints' => 5000, 'range' => $range);
             try {
                 $data = $endpoint->get(json_encode($search),'query', true);
@@ -617,27 +670,23 @@ class StatsController extends Controller
                 $errors[] = array("msg" => "Falla mongo_json_endpoint({$index}): {$e->getMessage()}");
                 $data = array();
             }
-    
+
             if(isset($data[0]) && isset($data[0]['datapoints'])) {
                 $points = array();
                 foreach($data[0]['datapoints'] as $d) {
                     $points[] = array($d[1],$d[0]);
                 }
-                $seriesOnus[$index]['data'] = $points;
+                $series[$index]['data'] = $points;
             }
         }
-    }
 
-    if ($request->isMethod('GET')) {
-        return $this->render('StatsBundle:Stats:olt_ponport.html.twig', array(
-                    'series' => $series,
-                    'seriesOnus' => $seriesOnus
-        ));
-    }
+        if ($request->isMethod('GET')) {
+            return $this->render('StatsBundle:Stats:olt_onu.html.twig', array(
+                        'series' => $series
+            ));
+        }
 
-    return new JsonResponse(array(
-        'series' => $series,
-    ));
+        return new JsonResponse(array('series' => $series,));
     }
 
 }

src/StatsBundle/Resources/public/highcharts/highchartsConfig.js

@@ -37,19 +37,13 @@ Highcharts.setOptions({
         
 
 // https://api.highcharts.com/highstock/tooltip.formatter
-/* Tooltip para gráfica histórica de cm, debe tener definido en la serie el valor useCustomTooltip */
 function bandwidthTooltip() {
         
     var date = new Date(this.x);
     num_day = date.getDate();
     index_weekday = date.getDay();
-//    index_shortMonths = date.getUTCMonth();
     index_shortMonths = date.getMonth();
 
-    console.log(date);
-    console.log(index_weekday);
-    console.log(index_shortMonths);
-
     if(date.getHours() < 10) {h = "0" + date.getHours();} else {h = date.getHours();}
     if(date.getMinutes() < 10) {m = "0" + date.getMinutes();} else {m = date.getMinutes();}
 
@@ -72,6 +66,28 @@ function bandwidthTooltip() {
     return s;
 }
 
+function onuStatusTooltip() {
+        
+    var date = new Date(this.x);
+    num_day = date.getDate();
+    index_weekday = date.getDay();
+    index_shortMonths = date.getMonth();
+
+    if(date.getHours() < 10) {h = "0" + date.getHours();} else {h = date.getHours();}
+    if(date.getMinutes() < 10) {m = "0" + date.getMinutes();} else {m = date.getMinutes();}
+
+    var s = '<span style="font-size:10px">' + weekdays[index_weekday] + ', ' + shortMonths[index_shortMonths] + ' ' + num_day + ', ' + h + ':' + m + '</span>';
+    
+    status = this.y;
+    if(status === 1 || status == 1) {
+        s += '<br/><span style="color:#3f6833"><b>Online</b></span>';
+    } else {
+        s += '<br/><span style="color:#e24d42"><b>Offline</b></span>';
+    }
+    
+    return s;
+}
+
 function customTooltipWithSuffix() {
         
     var date = new Date(this.x);

src/StatsBundle/Resources/views/Onu/base_show.html.twig

@@ -3,8 +3,11 @@
 {% block show %}
     {{ parent() }}
     
+    <script src="{{ asset('bundles/stats/highcharts/code/highcharts.js') }}" type="text/javascript" charset="utf-8"></script>
+    <script src="{{ asset('bundles/stats/highcharts/highchartsConfig.js') }}" type="text/javascript" charset="utf-8"></script>
+    
     {% if object.getDeviceServer().getSaveHistoric() == 1 %}
-    {{ render(controller('StatsBundle:Stats:grafanaOnu', { 'ponSerialNumber':object.ponSerialNumber })) }}
+    {{ render(controller('StatsBundle:Stats:onuHistoric', { 'ponSerialNumber':object.ponSerialNumber })) }}
     {% endif %}
     
 {% endblock %}

src/StatsBundle/Resources/views/Stats/olt_onu.html.twig

@@ -0,0 +1,105 @@
+<div class="row">
+    <div class="col-md-12">
+        <div id="olt_onu_bandwidth" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
+
+        <div id="olt_onu_rf" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
+        
+        <div class="clearfix" style="width: 100%; margin: 0 auto">
+            <div id="olt_onu_voltage" style="min-width: 310px; height: 400px; float: left; width:50%"></div>
+            <div id="olt_onu_temperature" style="min-width: 310px; height: 400px; float: left; width:50%"></div>
+        </div>
+
+        <div id="olt_onu_status" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
+    </div>
+</div>
+
+<script type="text/javascript">
+
+Highcharts.chart('olt_onu_bandwidth', {
+    chart: {type: 'spline'},
+    title: {text: 'Bandwidth ONU'},
+    subtitle: {text: 'IN Bandwidth / OUT Bandwidth'},
+    xAxis: {type: 'datetime',dateTimeLabelFormats: {month: '%e. %b',year: '%b'},title: {text: 'Date'}},
+    yAxis: {labels: {formatter: bandwidthAxisLabel,align: 'left'},min: 0},
+    tooltip: {formatter: bandwidthTooltip},
+    plotOptions: {spline: {marker: {enabled: true}}},
+    series: [{
+        name: "OUT Bandwidth",
+        data: {{series['out_bandwidth']['data']|json_encode}},
+        color: '#e24d42'
+        },{
+        name: "IN Bandwidth",
+        data: {{series['in_bandwidth']['data']|json_encode}},
+        color: '#3f6833'
+    }]
+});
+
+Highcharts.chart('olt_onu_rf', {
+    chart: {type: 'area'},
+    title: {text: 'Radio Frequency'},
+    subtitle: {text: 'TX /RX Power'},
+    xAxis: {type: 'datetime',dateTimeLabelFormats: {month: '%e. %b',year: '%b'},title: {text: 'Date'}},
+    yAxis: {labels: {format: '{value} dB'},min: null},
+    tooltip: {valueSuffix: ' dB',valueDecimals: 2},
+    plotOptions: {spline: {marker: {enabled: true}}},
+    series: [{
+        name: "TX Power",
+        data: {{series['tx']['data']|json_encode}},
+        color: '#6ed0e0',
+        fillOpacity: 0.2
+    },{
+        name: "RX Power",
+        data: {{series['rx']['data']|json_encode}},
+        color: '#4841AD',
+        fillOpacity: 0.2
+    }]
+});
+
+Highcharts.chart('olt_onu_voltage', {
+    chart: {type: 'area'},
+    title: {text: 'Voltage'},
+    subtitle: {text: 'Voltage'},
+    xAxis: {type: 'datetime',dateTimeLabelFormats: {month: '%e. %b',year: '%b'},title: {text: 'Date'}},
+    yAxis: {labels: {format: '{value} V'},min: 0},
+    tooltip: {valueSuffix: ' V',valueDecimals: 2},
+    plotOptions: {spline: {marker: {enabled: true}}},
+    series: [{
+        name: "Voltage",
+        data: {{series['voltage']['data']|json_encode}},
+        color: '#4841AD',
+        fillOpacity: 0.2
+    }]
+});
+
+Highcharts.chart('olt_onu_temperature', {
+    chart: {type: 'area'},
+    title: {text: 'Temperature'},
+    subtitle: {text: 'Temperature'},
+    xAxis: {type: 'datetime',dateTimeLabelFormats: {month: '%e. %b',year: '%b'},title: {text: 'Date'}},
+    yAxis: {labels: {format: '{value} ºC'},min: 0},
+    tooltip: {valueSuffix: ' ºC',valueDecimals: 2},
+    plotOptions: {spline: {marker: {enabled: true}}},
+    series: [{
+        name: "Temperature",
+        data: {{series['temperature']['data']|json_encode}},
+        color: '#B75426',
+        fillOpacity: 0.2
+    }]
+});
+
+Highcharts.chart('olt_onu_status', {
+    chart: {type: 'area'},
+    title: {text: 'Estatus'},
+    subtitle: {text: 'Online / Offline'},
+    xAxis: {type: 'datetime',dateTimeLabelFormats: {month: '%e. %b',year: '%b'},title: {text: 'Date'}},
+    yAxis: { categories: ['Offline', 'Online'], min: 0,stackLabels: {enabled: true,style: {fontWeight: 'bold',color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray'}}},
+    tooltip: {formatter: onuStatusTooltip},
+    plotOptions: {column: {stacking: 'normal',dataLabels: {enabled: true,color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white'}}},
+    series: [{
+        name: 'Status',
+        data: {{series['status']['data']|json_encode}},
+        color: '#3f6833'
+    }]
+});
+
+</script>