backoffice/application/views/gestion_campagne.php

<link rel="stylesheet" href="<?= base_url('bower_components/bootstrap-datepicker/dist/css/bootstrap-datepicker.min.css') ?>">
<link rel="stylesheet" href="<?= base_url('bower_components/datatables.net-bs/css/dataTables.bootstrap.min.css') ?>">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-multiselect/0.9.15/css/bootstrap-multiselect.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/css/bootstrap-datetimepicker.min.css">
<div class="content-wrapper">
    <!-- Content Header (Page header) -->
    <style>
        .name-link
        {
            color: white;
            text-decoration: none;
        }
    </style>
    <section class="content-header">

        <h1>
            <?= $this->lang->line('Campagne'); ?>
        </h1>
        <?php
        $site_url = base_url();

        if($alert=="ok") {

            if(!$success=="ok"){
                ?>
                <div class='alert alert-danger alert-dismissible col-xs-6'>
                    <button type='button' class='close' data-dismiss='alert' aria-hidden='true'>×</button>
                    <h4><i class='icon fa fa-ban'></i> Erreur!</h4>
                    <?= $message; ?>
                </div>

                <?php
            } else {
                ?>
                <div class="alert alert-success alert-dismissible col-xs-6">
                    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
                    <h4><i class="icon fa fa-check"></i> Success!</h4>
                    <?= $message; ?>
                </div>

                <?php
            }
        }
        ?>
    </section>

    <section class="content">
        <div class="box box-danger">
            <div class="box-header with-border">
            </div>
            <div class="box-body">
                <form name="form_login"  action="<?= base_url('Gestion/campagne') ?>" method="post">
                    <div class="row">
                        <div class="col-sm-4">
                            <div class="form-group">
                                <?php
                                $result=$pays;
                                $numrows=$result->num_rows();
                                if ($numrows > 0) { ?>
                                    <label>Pays :</label>
                                    <select class="form-control" name="pays" required id="pays">
                                        <?php foreach($result->result() as $row) {
                                            echo "<option value='".$row->id."'>".$row->name."</option>";
                                        } ?>
                                    </select>
                                <?php }else{
                                    echo $this->lang->line('Aucun pays');
                                }
                                ?>
                            </div>
                        </div>
                        <div class='col-sm-4'>
                            <div class="form-group">
                                <label>Date de départ :</label>
                                <div class="input-group date" >
                                    <div class="input-group-addon">
                                        <i class="glyphicon glyphicon-calendar"></i>
                                    </div>
                                    <input type="text" class="form-control pull-right" id="date-debut" name="date-debut" value="<?= $debut?>" required>
                                </div>
                            </div>
                        </div>
                        <div class='col-sm-4'>
                            <div class="form-group">
                                <label>Date de fin :</label>
                                <div class="input-group date">
                                    <div class="input-group-addon">
                                        <i class="fa fa-calendar"></i>
                                    </div>
                                    <input type="text" class="form-control pull-right" id="date-fin" name="date-fin" value="<?= $fin?>" required>
                                </div>
                            </div>
                        </div>
                        <div class="col-sm-4 col-sm-offset-4">
                            <input class="btn btn-block btn-danger" name='b'  type='submit'  value='Filtrer pour cette période'/>
                        </div>
                    </div>
                </form>
            </div>
        </div>
        <div class="box box-danger">
                <div class="box-header with-border">
                    <h3 class="box-title">Décompte</h3>
                </div>
                <div class="box-body">
                    <div class="row">
                        <?php
                        for($i=0; $i < $countA; ++$i) {
                            echo "<div class='col-lg-3 col-xs-6'>
                    <div class='small-box bg-aqua'>
                        <div class='inner'>
                            <h4><strong><a class='name-link' href='".base_url('Gestion/redirect_info_agent/?debut='.$debut.'&fin='.$fin.'&agent='.$agents[$i][0])."'>".$agents[$i][0]."</a></strong></h4>
                            <h4>".$agents[$i][2]." points physiques</h4>
                            <h4>".$geo_correct[$i][1]." contacts correctes</h4>
                            <h4>".$agents[$i][1]." points géolocalisés</h4>
                        </div>
                        <div class='icon'>
                                <i class='ion ion-person'></i>
                        </div>
                    </div>
                    </div>";
                        }
                        ?>
                        <div class='col-lg-3 col-xs-6'>
                            <div class='small-box bg-red'>
                                <div class='inner'>
                                    <h3><?= $total_points; ?></h3>
                                    <p>Points géolocalisés</p>
                                </div>
                                <div class='icon'>
                                    <i class='ion ion-person'></i>
                                </div>
                            </div>
                        </div>
                        <div class='col-lg-3 col-xs-6'>
                            <div class='small-box bg-red'>
                                <div class='inner'>
                                    <h3><?= $contact_correct; ?></h3>
                                    <p>Points contact correct</p>
                                </div>
                                <div class='icon'>
                                    <i class='ion ion-person'></i>
                                </div>
                            </div>
                        </div>
                        <div class='col-lg-3 col-xs-6'>
                            <div class='small-box bg-red'>
                                <div class='inner'>
                                    <h3><?= $total_physique; ?></h3>
                                    <p>Points physiques</p>
                                </div>
                                <div class='icon'>
                                    <i class='ion ion-person'></i>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
        </div>
        <div class="box box-danger">
            <div class="box-header with-border">
                <h3 class="box-title">Répartition par réseaux</h3>
            </div>
            <div class="box-body">
                <div class="row">
                    <?php

                    for($i=0; $i < $network_count; ++$i) {
                        echo "<div class='col-lg-3 col-xs-6'>
                    <div class='small-box bg-aqua'>
                        <div class='inner'>
                                <h3>".$networks_compte[$i]."</h3>
                                <p>".$networks_name[$i]."</p>
                        </div>
                        <div class='icon'>
                                    <i class='ion ion-stats-bars'></i>
                        </div>
                    </div>
                    </div>";
                    }
                    ?>
                </div>
            </div>
        </div>
    </section>
</div>

<!-- jQuery 3 -->
<script src="<?= base_url('bower_components/jquery/dist/jquery.min.js') ?>"></script>
<!-- Bootstrap 3.3.7 -->
<script src="<?= base_url('bower_components/bootstrap/dist/js/bootstrap.min.js') ?>"></script>
<!-- DataTables -->
<script src="<?= base_url('bower_components/datatables.net/js/jquery.dataTables.min.js') ?>"></script>
<script src="<?= base_url('bower_components/datatables.net-bs/js/dataTables.bootstrap.min.js') ?>"></script>
<!-- Slimscroll -->
<script src="<?= base_url('bower_components/jquery-slimscroll/jquery.slimscroll.min.js') ?>"></script>
<!-- FastClick -->
<script src="<?= base_url('bower_components/fastclick/lib/fastclick.js') ?>"></script>
<!-- AdminLTE App -->
<script src="<?= base_url('dist/js/adminlte.min.js') ?>"></script>
<!-- AdminLTE for demo purposes -->
<script src="<?= base_url('dist/js/demo.js') ?>"></script>

<script src="<?= base_url('dist/js/demo.js') ?>"></script>

<script src="<?= base_url('bower_components/moment/min/moment.min.js') ?>"></script>
<script src="<?= base_url('bower_components/bootstrap-daterangepicker/daterangepicker.js') ?>"></script>
<script src="<?= base_url('bower_components/bootstrap-datepicker/dist/js/bootstrap-datepicker.min.js') ?>"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/js/bootstrap-datetimepicker.min.js"></script>


<script type="text/javascript">
    //Date picker
    //$('#date-debut').datepicker({autoclose: true,format: 'yyyy-mm-dd'});
    $("#date-debut").datetimepicker({
        format:'YYYY-MM-DD HH:mm:ss',
        locale: moment.locale('fr')
    });
    $('#date-fin').datetimepicker({
        format:'YYYY-MM-DD HH:mm:ss'
    });

</script>

<script>
    $('#pays').change(function(){
        var pays = $(this).val();
        $.ajax({
            url:'<?= base_url('Gestion/getVilleByPays')?>',
            type: 'post',
            data: {pays: pays},
            dataType: 'json',
            success: function(list){
                var len = list.length;

                if(len > 0){

                    var select = document.getElementById('ville');
                    $(select).empty();

                    for (var i in list) {
                        $(select).append("<option value='" + list[i].id + "'>" + list[i].name +"</option>");
                    }

                    var id_ville = list[0].id;

                    $.ajax({
                        url:'<?= base_url('Gestion/getAgentByVilles')?>',
                        type: 'post',
                        data: {id_ville: id_ville},
                        dataType: 'json',
                        success: function(list){
                            var len = list.length;

                            if(len > 0){

                                var select = document.getElementById('agent');

                                $(select).empty();

                                for (var i in list) {
                                    $(select).append("<option value='" + list[i].lastname + "'>" + list[i].lastname +"</option>");
                                }


                            }else{

                                var select = document.getElementById('agent');
                                $(select).empty();

                            }

                        }
                    });


                }else{

                    var select = document.getElementById('ville');
                    $(select).empty();

                    var select2 = document.getElementById('agent');
                    $(select2).empty();
                }

            }
        });
    });

    $('#ville').change(function(){
        var ville = $(this).val();
        $.ajax({
            url:'<?= base_url('Gestion/getAgentByVilles')?>',
            type: 'post',
            data: {id_ville: ville},
            dataType: 'json',
            success: function(list){
                var len = list.length;

                if(len > 0){

                    var select = document.getElementById('agent');

                    $(select).empty();

                    for (var i in list) {
                        $(select).append("<option value='" + list[i].lastname + "'>" + list[i].lastname +"</option>");
                    }


                }else{

                    var select = document.getElementById('agent');
                    $(select).empty();

                }

            }
        });
    });

</script>