{% load static %}

<!doctype html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang=""> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8" lang=""> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9" lang=""> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang=""> <!--<![endif]-->
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>SENSORES</title>

    {% block head %}


    {% endblock head %}

    <meta name="description" content="acceso">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <link rel="apple-touch-icon" href="/static/images/QRAUqs9.png">
    <link rel="shortcut icon" href="/static/images/QRAUqs9.png">

    <link rel="stylesheet" href="/static/assets/css/normalize.min.css">
    <link rel="stylesheet" href="/static/assets/css/bootstrap.min.css">
    <link rel="stylesheet" href="/static/assets/css/font-awesome.min.css">
    <link rel="stylesheet" href="/static/assets/css/themify-icons.css">
    <link rel="stylesheet" href="/static/assets/css/pe-icon-7-stroke.min.css">
    <link rel="stylesheet" href="/static/assets/css/flag-icon.min.css">
    <link rel="stylesheet" href="/static/assets/css/cs-skin-elastic.css">
    <link rel="stylesheet" href="/static/assets/css/lib/datatable/buttons.bootstrap.min.css">
    <link rel="stylesheet" href="/static/assets/css/lib/datatable/buttons.dataTables.min.css">
    <link rel="stylesheet" href="/static/assets/css/lib/datatable/dataTables.bootstrap.min.css">
    <link rel="stylesheet" href="/static/assets/css/style.css">

    <!-- 
    <link rel="stylesheet" href="/static/lib/datatables-1.10.20/css/dataTables.bootstrap4.min.css"/>
    <link rel="stylesheet" href="/static/lib/datatables-1.10.20/plugins/responsive-2.2.3/css/responsive.bootstrap4.min.css"/>
    <script type="text/javascript" src="https://cdn.jsdelivr.net/html5shiv/3.7.3/html5shiv.min.js"></script> -->
    <link href="/static/assets/css/chartist.min.css" rel="stylesheet">
    <link href="/static/assets/css/jqvmap.min.css" rel="stylesheet">

    <link href="/static/assets/css/weather-icons.css" rel="stylesheet" />
    <link href="/static/assets/css/fullcalendar.min.css" rel="stylesheet" />
    <script src="/static/assets/js/c6b758e399.js" crossorigin="anonymous"></script>

   <style>
    
    #weatherWidget .currentDesc {
        color: #ffffff!important;
    }
        .traffic-chart {
            min-height: 335px;
        }
        #flotPie1  {
            height: 150px;
        }
        #flotPie1 td {
            padding:3px;
        }
        #flotPie1 table {
            top: 20px!important;
            right: -10px!important;
        }
        .chart-container {
            display: table;
            min-width: 270px ;
            text-align: left;
            padding-top: 10px;
            padding-bottom: 10px;
        }
        #flotLine5  {
             height: 105px;
        }

        #flotBarChart {
            height: 150px;
        }
        #cellPaiChart{
            height: 160px;
        }

    </style>
</head>

<body>
    <!-- Left Panel -->
    <aside id="left-panel" class="left-panel">
        <nav class="navbar navbar-expand-sm navbar-default">
            <div id="main-menu" class="main-menu collapse navbar-collapse">
                <ul class="nav navbar-nav">
                    <li class="active">
                        <a href="{% url 'index' %}">PRINCIPAL</a>
                    </li>
                    <li class="menu-item-has-children dropdown">
                        <a href="{% url 'altasensoresf' %}" >ALTA SENSORES</a>
                    </li>
                    <!--
                    <li class="menu-item-has-children dropdown">
                        <a href="{% url 'sensoresfijos' %}" > <i class="menu-icon fa fa-laptop"></i>Sensores Fijos en tiempo real</a>
                    </li>
                    -->
                    <li class="menu-item-has-children dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">REGISTRO EN TIEMPO REAL</a>
                            {% for menu in menus %}
                                {% if menu.activo == 'SI' %}
                                    <li style="text-transform: uppercase;"><a href="{% url 'sensoresfijosdianew' menu.idsensor %}"><i class="menu-icon fa fa-laptop"></i>{{ menu.nombre }}</a></li>
                                {% endif %}
                            {% endfor %}
                    </li>


                    
                    
                    <li class="menu-item-has-children dropdown">
                        <a href="{% url 'sensoresf' %}">CONSULTA HISTORIAL DE LECTURAS</a>
                    </li>

                    

                    

                    

                    
                    
                </ul>
            </div><!-- /.navbar-collapse -->
        </nav>
    </aside>
    <!-- /#left-panel -->
    <!-- Right Panel -->
    <div id="right-panel" class="right-panel">
        <!-- Header-->
        <header id="header" class="header">
            <div class="top-left">
                <div class="navbar-header">
                    <a class="navbar-brand" href="{% url 'index' %}"><img src="/static/images/logocds.jpg" alt="Logo"></a>
                    <a class="navbar-brand hidden" href="{% url 'index' %}"><img src="/static/images/logocds.jpg" alt="Logo"></a>
                    <a id="menuToggle" class="menutoggle"><i class="fa fa-bars"></i></a>
                </div>
            </div>
            <div class="top-right">
                <div class="header-menu">
                    <div class="header-left">
                        <button class="search-trigger"><i class="fa fa-search"></i></button>
                        <div class="form-inline">
                            <form class="search-form">
                                <input class="form-control mr-sm-2" type="text" placeholder="Search ..." aria-label="Search">
                                <button class="search-close" type="submit"><i class="fa fa-close"></i></button>
                            </form>
                        </div>

                        <div class="dropdown for-notification">
                            <button class="btn btn-secondary dropdown-toggle" type="button" id="notification" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                <i class="fa fa-bell"></i>
                                <span class="count bg-danger">0</span>
                            </button>
                            <div class="dropdown-menu" aria-labelledby="notification">
                                <p class="red">Notificaciones</p>
                                <!--
                                <a class="dropdown-item media" href="#">
                                    <i class="fa fa-check"></i>
                                    <p>Server #1 overloaded.</p>
                                </a>
                                
                                <a class="dropdown-item media" href="#">
                                    <i class="fa fa-info"></i>
                                    <p>Server #2 overloaded.</p>
                                </a>
                                <a class="dropdown-item media" href="#">
                                    <i class="fa fa-warning"></i>
                                    <p>Server #3 overloaded.</p>
                                </a>
                                -->
                            </div>
                        </div>

                        <div class="dropdown for-message">
                            <button class="btn btn-secondary dropdown-toggle" type="button" id="message" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                <i class="fa fa-envelope"></i>
                                <span class="count bg-primary"></span>
                            </button>
                            <div class="dropdown-menu" aria-labelledby="message">
                                <p class="red">Correos</p>
                                <!--
                                <a class="dropdown-item media" href="#">
                                    <span class="photo media-left"><img alt="avatar" src="/static/images/avatar/1.jpg"></span>
                                    <div class="message media-body">
                                        <span class="name float-left">Jonathan Smith</span>
                                        <span class="time float-right">Just now</span>
                                        <p>Hello, this is an example msg</p>
                                    </div>
                                </a>
                                <a class="dropdown-item media" href="#">
                                    <span class="photo media-left"><img alt="avatar" src="/static/images/avatar/2.jpg"></span>
                                    <div class="message media-body">
                                        <span class="name float-left">Jack Sanders</span>
                                        <span class="time float-right">5 minutes ago</span>
                                        <p>Lorem ipsum dolor sit amet, consectetur</p>
                                    </div>
                                </a>
                                <a class="dropdown-item media" href="#">
                                    <span class="photo media-left"><img alt="avatar" src="/static/images/avatar/3.jpg"></span>
                                    <div class="message media-body">
                                        <span class="name float-left">Cheryl Wheeler</span>
                                        <span class="time float-right">10 minutes ago</span>
                                        <p>Hello, this is an example msg</p>
                                    </div>
                                </a>
                                <a class="dropdown-item media" href="#">
                                    <span class="photo media-left"><img alt="avatar" src="/static/images/avatar/4.jpg"></span>
                                    <div class="message media-body">
                                        <span class="name float-left">Rachel Santos</span>
                                        <span class="time float-right">15 minutes ago</span>
                                        <p>Lorem ipsum dolor sit amet, consectetur</p>
                                    </div>
                                </a>
                                -->
                            </div>
                        </div>
                    </div>

                    <div class="user-area dropdown float-right">
                        {% if user.is_authenticated %}
                        <a href="#" class="dropdown-toggle active" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                            <img class="user-avatar rounded-circle" src="/static/images/logo2.png" alt="User Avatar">
                        </a>
                        {% else %}
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                            <img class="user-avatar rounded-circle" src="/static/images/logo2.png" alt="User Avatar">
                        </a>
                        {% endif %}

                        <div class="user-menu dropdown-menu">
                            {% if user.is_authenticated %}
                            <a class="nav-link" href="{% url 'index' %}"><i class="fa fa- user"></i>{{ user.username }}</a>
                            
                            <a class="nav-link" href="{% url 'salir' %}"><i class="fa fa-power -off"></i>Salir</a>

                            {% else %}
                            <a class="nav-link" href="{% url 'acceder' %}"><i class="fa fa- user"></i>Login</a>
                            <a class="nav-link" href="{% url 'registro' %}"><i class="fa fa- user"></i>Registro</a>
                            {% endif %}
                        </div>
                    </div>

                </div>
            </div>
        </header>
        <!-- /#header -->
        {% if messages %}
        <div class="row mt-3 mb-3">
          <div class="col-12">
            {% for message in messages %}
            <div class="alert alert-{{ message.tags }}">
              {{ message }}
            </div>
            {% endfor %}
        
          </div>
        </div>
        
        {% endif %}
  
  
        {% block content %}







        {% endblock content %}
        <div class="clearfix"></div>
        <!-- Footer -->
        <footer class="site-footer" >
            <div class="footer-inner bg-white">
                <div class="row">
                    <div class="col-sm-12">
                        <span class="copyright" style="color: #000000;">
                            Copyright ©  
                            <script>
                              document.write(new Date().getFullYear())
                            </script>
                            Hecho por Depto. Biomedica, Ing. de Software e Ing. Mecatronica{ Generacion 2019 - 2022 } 
                        </span>
                    </div>
                    
   
                </div>
            </div>
        </footer>
        <!-- /.site-footer -->
    </div>
    <!-- /#right-panel -->

    <!-- Scripts -->
    <script src="/static/assets/js/jquery.min.js"></script>
    <script src="/static/assets/js/popper.min.js"></script>
    <script src="/static/assets/js/bootstrap.min.js"></script>
    <script src="/static/assets/js/jquery.matchHeight.min.js"></script>
    <script src="/static/assets/js/main.js"></script>

    <!--  Chart js -->
    <script src="/static/assets/js/Chart.bundle.min.js"></script>

    <!--Chartist Chart-->
    <script src="/static/assets/js/chartist.min.js"></script>
    <script src="/static/assets/js/chartist-plugin-legend.min.js"></script>

    <script src="/static/assets/js/jquery.flot.min.js"></script>
    <script src="/static/assets/js/jquery.flot.pie.min.js"></script>
    <script src="/static/assets/js/jquery.flot.spline.min.js"></script>

    <script src="/static/assets/js/jquery.simpleWeather.min.js"></script>
    <script src="/static/assets/js/weather-init.js"></script>

    <script src="/static/assets/js/moment.min.js"></script>
    <script src="/static/assets/js/fullcalendar.min.js"></script>
    <script src="/static/assets/js/init/fullcalendar-init.js"></script>


    
    <script src="/static/assets/js/lib/data-table/datatables.min.js"></script>
    <script src="/static/assets/js/lib/data-table/dataTables.bootstrap.min.js"></script>
    <script src="/static/assets/js/lib/data-table/dataTables.buttons.min.js"></script>
    <script src="/static/assets/js/lib/data-table/buttons.bootstrap.min.js"></script>
    <script src="/static/assets/js/lib/data-table/jszip.min.js"></script>
    <script src="/static/assets/js/lib/data-table/vfs_fonts.js"></script>
    <script src="/static/assets/js/lib/data-table/buttons.html5.min.js"></script>
    <script src="/static/assets/js/lib/data-table/buttons.print.min.js"></script>
    <script src="/static/assets/js/lib/data-table/buttons.colVis.min.js"></script>
    <script src="/static/assets/js/init/datatables-init.js"></script>




    <script type="text/javascript">
        $(document).ready(function() {
            $('#example').DataTable({
                "pageLength": 100,
                "order": [[0, "desc" ]],
        });
    } );
    </script>
    
    

    

{% block javascript %}


{% endblock javascript %}


</body>
</html>

