<?php
  include VIEWPATH.'includes/new_header.php';
  ?>
  <!-- fullCalendar -->
  <!-- <link rel="stylesheet" href="<?php echo $nouveau_url ?>plugins/fullcalendar/main.css"> -->

  
<body class="hold-transition sidebar-mini">
<!-- Site wrapper -->
<div class="wrapper">
  <?php
  include VIEWPATH.'includes/new_top_menu.php';
  include VIEWPATH.'includes/new_menu_principal.php';
  ?>

  

  <!-- Content Wrapper. Contains page content -->
  <div class="content-wrapper">
    <!-- Content Header (Page header) -->
    <section class="content-header">
      <div class="container-fluid">
        <div class="row mb-2">
          <div class="col-sm-6">
            <h1>Dashboard Stock</h1>
          </div>
          <div class="col-sm-6">
           
          </div>
        </div>
      </div><!-- /.container-fluid -->
    </section>

    <!-- Main content -->
    <section class="content">

      <!-- Default box -->
      <div class="card">

        <div class="card-body">

      <form method="POST" action="<?=base_url('dashboard/Dashboard_Stock')?>" id="myform">
            

              <div class="form-row">


              <!-- <div class="col-md-4">
                <label>Statut du congé</label> 
                    <select class="custom-select" name="STATUS_CONGE" id="STATUS_CONGE" onchange="get_info()">
                          <option>-- Select --</option>
                          <?php
                          foreach ($typeconge as $typeconge) { ?>

                           <option value="<?php echo $typeconge['STATUS_CONGE'] ?>" <?php echo  set_select('STATUS_CONGE', $typeconge['STATUS_CONGE']); ?> <?= ($STATUS_CONGE == $typeconge['STATUS_CONGE'])?"selected":"" ?> ><?php echo $typeconge['DESCRIPTION']?></option>


                           


                         <?php }
                          ?>
                        </select>
              </div> -->




                 <div class="col-md-4">
                <label>Du</label>
               
                  <input type="date"  name="DATE1" id="DATE1" class="form-control" onchange="get_info()" value="<?=set_value('DATE1')?>">
              </div>


               <div class="col-md-4">
                <label>Au</label>

                  <input type="date" name="DATE2" id="DATE2" class="form-control" onchange="get_info()" value="<?=set_value('DATE2')?>">
                </div>
              </div>

</form>




          <div class="row col-md-12">
      <div class="col-md-6" id="container"></div>
       <div class="col-md-6" id="container4"></div>
       <div class="col-md-6" id="container1"></div>
       <div class="col-md-6" id="container5"></div>
       

        </div>

      <div class="row col-md-12">
      <!-- <div class="col-md-6" id="container2"></div> -->
       <div class="col-md-12" id="container3"></div>

        </div>
        <div class="row col-md-12">
      <!-- <div class="col-md-6" id="container2"></div> -->
       <div class="col-md-12" id="container2"></div>

        </div>


        </div>

      </div>
      <!-- /.card -->

    </section>
    <!-- /.content -->
  </div>
  <!-- /.content-wrapper -->

  <?php
 include VIEWPATH.'includes/new_copy_footer.php';  
  ?>
  <!-- /.control-sidebar -->
</div>
<!-- ./wrapper -->
<?php
  include VIEWPATH.'includes/new_script.php';
  ?>

<script src="<?php echo $nouveau_url ?>higthchart/code/highcharts.js"></script>
<script src="<?php echo $nouveau_url ?>higthchart/code/modules/sankey.js"></script>
<script src="<?php echo $nouveau_url ?>higthchart/code/modules/organization.js"></script>
<script src="<?php echo $nouveau_url ?>higthchart/code/modules/exporting.js"></script>
<script src="<?php echo $nouveau_url ?>higthchart/code/modules/accessibility.js"></script>

</body>
</html>
<script>


         function get_info() {
       
       myform.action= myform.action;
        myform.submit();
      } 
  

</script>

<!---rapport 1-->

<script type="text/javascript">
    Highcharts.chart('container', {
    chart: {
        type: 'line'
    },
    title: {
        text: 'Evolution entree stock'
    },
    // subtitle: {
    //     text: 'Source: ' +
    //         '<a href="https://en.wikipedia.org/wiki/List_of_cities_by_average_temperature" ' +
    //         'target="_blank">Wikipedia.com</a>'
    // },
    xAxis: {
        categories: [
            'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep',
            'Oct', 'Nov', 'Dec'
        ]
    },
    yAxis: {
        title: {
            text: 'Nombre'
        }
    },
    plotOptions: {
        line: {
            dataLabels: {
                enabled: true
            },
            enableMouseTracking: false
        }
    },
    series: [{
        name: '20L',
        data: [
            16.0, 18.2, 23.1, 27.9, 32.2, 36.4, 39.8, 38.4, 35.5, 29.2,
            22.0, 17.8
        ]
    }, {
        name: '1.5L',
        data: [
            -2.9, -3.6, -0.6, 4.8, 10.2, 14.5, 17.6, 16.5, 12.0, 6.5,
            2.0, -0.9
        ]
    }]
});
</script>
<script type="text/javascript">
    Highcharts.chart('container4', {
    chart: {
        type: 'line'
    },
    title: {
        text: 'Evolution sorti stock'
    },
    // subtitle: {
    //     text: 'Source: ' +
    //         '<a href="https://en.wikipedia.org/wiki/List_of_cities_by_average_temperature" ' +
    //         'target="_blank">Wikipedia.com</a>'
    // },
    xAxis: {
        categories: [
            'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep',
            'Oct', 'Nov', 'Dec'
        ]
    },
    yAxis: {
        title: {
            text: 'Nombre'
        }
    },
    plotOptions: {
        line: {
            dataLabels: {
                enabled: true
            },
            enableMouseTracking: false
        }
    },
    series: [{
        name: '20L',
        data: [
            16.0, 18.2, 23.1, 27.9, 32.2, 36.4, 39.8, 38.4, 35.5, 29.2,
            22.0, 17.8
        ]
    }, {
        name: '500ml',
        data: [
            -2.9, -3.6, -0.6, 4.8, 10.2, 14.5, 17.6, 16.5, 12.0, 6.5,
            2.0, -0.9
        ]
    }]
});
</script>



<script type="text/javascript">

Highcharts.chart('container1', {
    chart: {
        plotBackgroundColor: null,
        plotBorderWidth: null,
        plotShadow: false,
        type: 'pie'
    },
    title: {
        text: 'Stock Actuelle vide'
    },
    tooltip: {
        pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
    },
    accessibility: {
        point: {
            valueSuffix: '%'
        }
    },
    plotOptions: {
        pie: {
            allowPointSelect: true,
            cursor: 'pointer',
            dataLabels: {
                enabled: false
            },
            showInLegend: true
        }
    },
    series: [{
        name: 'Brands',
        colorByPoint: true,
        data: [{
            name: '20L',
            y: 74.77,
            sliced: true,
            selected: true
        },  {
            name: '1.5L',
            y: 12.82
        },  {
            name: '500ml',
            y: 4.63
        }
        // {
        //     name: 'Safari',
        //     y: 2.44
        // },
        //  {
        //     name: 'Internet Explorer',
        //     y: 2.02
        // },
        //  {
        //     name: 'Other',
        //     y: 3.28
        // }
    ]
    }]
});

</script>

<script type="text/javascript">

Highcharts.chart('container5', {
    chart: {
        plotBackgroundColor: null,
        plotBorderWidth: null,
        plotShadow: false,
        type: 'pie'
    },
    title: {
        text: 'Stock Actuelle plein'
    },
    tooltip: {
        pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
    },
    accessibility: {
        point: {
            valueSuffix: '%'
        }
    },
    plotOptions: {
        pie: {
            allowPointSelect: true,
            cursor: 'pointer',
            dataLabels: {
                enabled: false
            },
            showInLegend: true
        }
    },
    series: [{
        name: 'Brands',
        colorByPoint: true,
        data: [{
            name: '20L',
            y: 74.77,
            sliced: true,
            selected: true
        },  {
            name: '1.5L',
            y: 12.82
        },  {
            name: '500ml',
            y: 4.63
        }
        // {
        //     name: 'Safari',
        //     y: 2.44
        // },
        //  {
        //     name: 'Internet Explorer',
        //     y: 2.02
        // },
        //  {
        //     name: 'Other',
        //     y: 3.28
        // }
    ]
    }]
});

</script>


<script type="text/javascript">

Highcharts.chart('container2kk', {
    chart: {
        type: 'bar'
    },
    title: {
        text: 'Production'
    },
    // subtitle: {
    //     text: 'Source: <a ' +
    //         'href="https://en.wikipedia.org/wiki/List_of_continents_and_continental_subregions_by_population"' +
    //         'target="_blank">Wikipedia.org</a>'
    // },
    xAxis: {
        categories: ['Africa', 'America', 'Asia', 'Europe'],
        title: {
            text: null
        },
        gridLineWidth: 1,
        lineWidth: 0
    },
    yAxis: {
        min: 0,
        title: {
            text: 'Population (millions)',
            align: 'high'
        },
        labels: {
            overflow: 'justify'
        },
        gridLineWidth: 0
    },
    tooltip: {
        valueSuffix: ' millions'
    },
    plotOptions: {
        bar: {
            borderRadius: '50%',
            dataLabels: {
                enabled: true
            },
            groupPadding: 0.1
        }
    },
    legend: {
        layout: 'vertical',
        align: 'right',
        verticalAlign: 'top',
        x: -40,
        y: 80,
        floating: true,
        borderWidth: 1,
        backgroundColor:
            Highcharts.defaultOptions.legend.backgroundColor || '#FFFFFF',
        // shadow: true
    },
    credits: {
        enabled: false
    },
    series: [{
        name: 'Year 1990',
        data: [632, 727, 3202, 721]
    }, {
        name: 'Year 2000',
        data: [814, 841, 3714, 726]
    }, {
        name: 'Year 2021',
        data: [1393, 1031, 4695, 745]
    }]
});

</script>


<script type="text/javascript">

Highcharts.chart('container3', {
    chart: {
        type: 'column'
    },
    title: {
        text: 'Motif perte stock'
    },
    subtitle: {
        text:
            'Source: <a target="_blank" ' +
            'href="https://www.indexmundi.com/agriculture/?commodity=corn">indexmundi</a>'
    },
    xAxis: {
        categories: ['USA', 'China', 'Brazil', 'EU', 'Argentina', 'India'],
        crosshair: true,
        accessibility: {
            description: 'Countries'
        }
    },
    yAxis: {
        min: 0,
        title: {
            text: '1000 metric tons (MT)'
        }
    },
    tooltip: {
        valueSuffix: ' (1000 MT)'
    },
    plotOptions: {
        column: {
            pointPadding: 0.2,
            borderWidth: 0
        }
    },
    series: [
        {
            name: 'Corn',
            data: [387749, 280000, 129000, 64300, 54000, 34300]
        },
        {
            name: 'Wheat',
            data: [45321, 140000, 10000, 140500, 19500, 113500]
        }
    ]
});

</script>
<script>
Highcharts.chart('container2', {

title: {
    text: 'Production',
    align: 'left'
},

// subtitle: {
//     text: 'By Job Category. Source: <a href="https://irecusa.org/programs/solar-jobs-census/" target="_blank">IREC</a>.',
//     align: 'left'
// },

yAxis: {
    title: {
        text: 'Number of Employees'
    }
},

xAxis: {
    accessibility: {
        rangeDescription: 'Range: 2010 to 2022'
    }
},

legend: {
    layout: 'vertical',
    align: 'right',
    verticalAlign: 'middle'
},

plotOptions: {
    series: {
        label: {
            connectorAllowed: false
        },
        pointStart: 2010
    }
},

series: [{
    name: 'Installation & Developers',
    data: [
        43934, 48656, 65165, 81827, 112143, 142383,
        171533, 165174, 155157, 161454, 154610, 168960, 171558
    ]
}, {
    name: 'Manufacturing',
    data: [
        24916, 37941, 29742, 29851, 32490, 30282,
        38121, 36885, 33726, 34243, 31050, 33099, 33473
    ]
}, {
    name: 'Sales & Distribution',
    data: [
        11744, 30000, 16005, 19771, 20185, 24377,
        32147, 30912, 29243, 29213, 25663, 28978, 30618
    ]
}, {
    name: 'Operations & Maintenance',
    data: [
        null, null, null, null, null, null, null,
        null, 11164, 11218, 10077, 12530, 16585
    ]
}, {
    name: 'Other',
    data: [
        21908, 5548, 8105, 11248, 8989, 11816, 18274,
        17300, 13053, 11906, 10073, 11471, 11648
    ]
}],

responsive: {
    rules: [{
        condition: {
            maxWidth: 500
        },
        chartOptions: {
            legend: {
                layout: 'horizontal',
                align: 'center',
                verticalAlign: 'bottom'
            }
        }
    }]
}

});
</script>