Untitled

<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>Reporte de Mantenimientos</title>
        <script src="js/highcharts.js"></script>
        <script src="js/exporting.js"></script>
        <script src="js/export-data.js"></script>
    </head>
    <body>

<table align="center"> <tr><td>
   <thead><center><h1>PERIODO DE MANTENIMIENTOS</h1></center></thead>
     <form method="POST">
        <td><b>Desde:</b></td>
    <td>
        <b>     <link rel="stylesheet" type="text/css" href="css/tcal.css" />
                <script type="text/javascript" src="js/tcal.js"></script>
                <div><input type="text" name="date" class="tcal" value="" /></div>

</b>
    </td>

<td> <b> Hasta:</b></td>
<td>
    <b>     <link rel="stylesheet" type="text/css" href="css/tcal.css" />
            <script type="text/javascript" src="js/tcal.js"></script>
            <div><input type="text" name="date2" class="tcal" value="" /></div>

</b>


      </td>
        <td> <input type="submit" name="aceptar" value="Aceptar"></td>

    </tr>
    </form>
    </table> <br />


<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>

    <script type="text/javascript">

Highcharts.chart('container', {
    chart: {
        type: 'column'
    },
    title: {
        text: ''
    },
    subtitle: {
        text: ''
    },
    xAxis: {
        categories: ['Ene','Feb','Mar','Abr','May','Jun','Jul','Ago','Sept','Oct','Nov','Dic'],
        crosshair: true
    },
    yAxis: {
        min: 0,
        title: {
            text: ''
        }
    },
    tooltip: {
        headerFormat: '<span style="font-size:10px">{point.key}</span><table>',
        pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
            '<td style="padding:0"><b>{point.y:1f}% </b></td></tr>',
        footerFormat: '</table>',
        shared: true,
        useHTML: true
    },
    plotOptions: {
        column: {
            pointPadding: 0.2,
            borderWidth: 0
        }
    },
    series: [
    {
        name: 'Mantenimiento Inmediato',
        data: [

<?php
        if (isset($_POST['aceptar']))
            {
                 $consulta="SELECT Tipo_mante, COUNT(Tipo_mante) AS Cantidad, MONTHNAME(Fecha) AS mes
                             FROM solicitud
                            WHERE Tipo_Mante =  'Inmediato'
                            GROUP BY Tipo_mante, YEAR(Fecha), MONTH(Fecha) AND Fecha BETWEEN '".$_POST["date"]."' AND '".$_POST["date2"]."'";

                            $result=$cone->query($consulta);
                             if($result->num_rows >0)
                             {
                                while($row = $result->fetch_assoc())
                                {
                                    echo "['".$row["Tipo_mante"]."',".$row["Cantidad"]."]";
                                }
                            }
            }
    ?>


}
    ]
});
        </script>
    </body>
</html>