Merge branch 'backend/feature/rapports' into dev

backend/assets/VuejsReportIndexAsset.php

+<?php
+/** 
+Copyright distrib (2018) 
+
+contact@opendistrib.net
+
+Ce logiciel est un programme informatique servant à aider les producteurs 
+à distribuer leur production en circuits courts. 
+
+Ce logiciel est régi par la licence CeCILL soumise au droit français et
+respectant les principes de diffusion des logiciels libres. Vous pouvez
+utiliser, modifier et/ou redistribuer ce programme sous les conditions
+de la licence CeCILL telle que diffusée par le CEA, le CNRS et l'INRIA 
+sur le site "http://www.cecill.info".
+
+En contrepartie de l'accessibilité au code source et des droits de copie,
+de modification et de redistribution accordés par cette licence, il n'est
+offert aux utilisateurs qu'une garantie limitée.  Pour les mêmes raisons,
+seule une responsabilité restreinte pèse sur l'auteur du programme,  le
+titulaire des droits patrimoniaux et les concédants successifs.
+
+A cet égard  l'attention de l'utilisateur est attirée sur les risques
+associés au chargement,  à l'utilisation,  à la modification et/ou au
+développement et à la reproduction du logiciel par l'utilisateur étant 
+donné sa spécificité de logiciel libre, qui peut le rendre complexe à 
+manipuler et qui le réserve donc à des développeurs et des professionnels
+avertis possédant  des  connaissances  informatiques approfondies.  Les
+utilisateurs sont donc invités à charger  et  tester  l'adéquation  du
+logiciel à leurs besoins dans des conditions permettant d'assurer la
+sécurité de leurs systèmes et ou de leurs données et, plus généralement, 
+à l'utiliser et l'exploiter dans les mêmes conditions de sécurité. 
+
+Le fait que vous puissiez accéder à cet en-tête signifie que vous avez 
+pris connaissance de la licence CeCILL, et que vous en avez accepté les
+termes.
+*/
+
+namespace backend\assets;
+
+use yii\web\AssetBundle;
+use yii ;
+
+/**
+ * @author Qiang Xue <qiang.xue@gmail.com>
+ * @since 2.0
+ */
+class VuejsReportIndexAsset extends \common\components\MyAssetBundle
+{
+    public $basePath = '@webroot';
+    public $baseUrl = '@web';
+    public $css = [];
+    public $js = [];
+    public $depends = [
+        'common\assets\CommonAsset'
+    ];
+    
+    public function __construct() 
+    {
+        parent::__construct() ;
+        $this->addAsset('js','js/vuejs/report-index.js') ;
+    }
+}

backend/controllers/ReportController.php

+<?php
+
+/** 
+Copyright distrib (2018) 
+
+contact@opendistrib.net
+
+Ce logiciel est un programme informatique servant à aider les producteurs 
+à distribuer leur production en circuits courts. 
+
+Ce logiciel est régi par la licence CeCILL soumise au droit français et
+respectant les principes de diffusion des logiciels libres. Vous pouvez
+utiliser, modifier et/ou redistribuer ce programme sous les conditions
+de la licence CeCILL telle que diffusée par le CEA, le CNRS et l'INRIA 
+sur le site "http://www.cecill.info".
+
+En contrepartie de l'accessibilité au code source et des droits de copie,
+de modification et de redistribution accordés par cette licence, il n'est
+offert aux utilisateurs qu'une garantie limitée.  Pour les mêmes raisons,
+seule une responsabilité restreinte pèse sur l'auteur du programme,  le
+titulaire des droits patrimoniaux et les concédants successifs.
+
+A cet égard  l'attention de l'utilisateur est attirée sur les risques
+associés au chargement,  à l'utilisation,  à la modification et/ou au
+développement et à la reproduction du logiciel par l'utilisateur étant 
+donné sa spécificité de logiciel libre, qui peut le rendre complexe à 
+manipuler et qui le réserve donc à des développeurs et des professionnels
+avertis possédant  des  connaissances  informatiques approfondies.  Les
+utilisateurs sont donc invités à charger  et  tester  l'adéquation  du
+logiciel à leurs besoins dans des conditions permettant d'assurer la
+sécurité de leurs systèmes et ou de leurs données et, plus généralement, 
+à l'utiliser et l'exploiter dans les mêmes conditions de sécurité. 
+
+Le fait que vous puissiez accéder à cet en-tête signifie que vous avez 
+pris connaissance de la licence CeCILL, et que vous en avez accepté les
+termes.
+*/
+
+namespace backend\controllers;
+
+use Yii;
+use yii\filters\AccessControl;
+use common\models\User;
+use common\models\Distribution ;
+
+class ReportController extends BackendController 
+{
+    var $enableCsrfValidation = false;
+
+    public function behaviors() 
+    {
+        return [
+            'access' => [
+                'class' => AccessControl::className(),
+                'rules' => [
+                    [
+                        'allow' => true,
+                        'roles' => ['@'],
+                        'matchCallback' => function ($rule, $action) {
+                            return User::hasAccessBackend() ;
+                        }
+                    ]
+                ],
+            ],
+        ];
+    }
+    
+    public function actionIndex() 
+    {
+        $this->checkProductsPointsSale() ;
+        return $this->render('index') ;
+    }
+    
+    public function actionAjaxInit() 
+    {
+        \Yii::$app->response->format = \yii\web\Response::FORMAT_JSON;
+               
+        $usersArray = User::findBy()->all() ;
+        $pointsSaleArray = PointSale::searchAll() ;
+        
+        // distributions
+        $firstDistribution = Distribution::searchOne([], [
+            'orderby' => 'id ASC'
+        ]) ;
+        $lastDistribution = Distribution::searchOne([], [
+            'orderby' => 'id DESC'
+        ]) ;
+        
+        $firstYear = date('Y',strtotime($firstDistribution->date)) ;
+        $lastYear = date('Y',strtotime($lastDistribution->date)) ;
+        $distributionYearsArray = [] ;
+        for($year = $firstYear; $year <= $lastYear; $year ++) {
+            $distributionYearsArray[] = $year ;
+        }
+        
+        $distributionsArray = Distribution::searchAll([
+            'distribution.active' => 1
+        ], [
+            'orderby' => 'date ASC',
+        ]) ;
+        $distributionsByMonthArray = [] ;
+        foreach($distributionsArray as $distribution) {
+            $month = date('Y-m', strtotime($distribution->date)) ;
+            if(!isset($distributionsByMonthArray[$month])) {
+                $distributionsByMonthArray[$month] = [
+                    'display' => 0,
+                    'year' => date('Y',strtotime($distribution->date)),
+                    'month' => strftime('%B', strtotime($distribution->date)),
+                    'distributions' => []
+                ] ;
+            }
+            $distribution->date = strftime('%A %d %B %Y', strtotime($distribution->date)) ;
+            $distributionsByMonthArray[$month]['distributions'][] = $distribution ;
+        }
+        
+        return  [
+            'usersArray' => $usersArray,
+            'pointsSaleArray' => $pointsSaleArray,
+            'distributionYearsArray' => $distributionYearsArray,
+            'distributionsByMonthArray' => $distributionsByMonthArray
+        ] ;
+    }
+    
+    public function actionAjaxReport() 
+    {
+        \Yii::$app->response->format = \yii\web\Response::FORMAT_JSON;
+        $posts = Yii::$app->request->post();
+        
+        $resArray = [] ;
+
+        $conditionUsers = $this->_generateConditionSqlReport($posts, 'users', 'id_user') ;
+        $conditionPointsSale = $this->_generateConditionSqlReport($posts, 'pointsSale', 'id_point_sale') ;
+        $conditionDistributions = $this->_generateConditionSqlReport($posts, 'distributions', 'id_distribution') ;
+        
+        $res = Yii::$app->db->createCommand("SELECT product.name, SUM(product_order.quantity) AS quantity, SUM(product_order.price * product_order.quantity) AS total
+            FROM `order`, product_order, product
+            WHERE `order`.id = product_order.id_order
+            AND product_order.id_product = product.id
+            ".$conditionUsers."
+            ".$conditionPointsSale."
+            ".$conditionDistributions."
+            GROUP BY product.id
+            ORDER BY product.name ASC
+        ")
+        ->queryAll();
+
+        $totalGlobal = 0 ;
+        foreach($res as $line) {
+            $total = Price::format(round($line['total'], 2)) ;
+            if($line['quantity'] > 0) {
+                $resArray[] = [
+                    'name' => $line['name'],
+                    'quantity' => $line['quantity'],
+                    'total' => $total,
+                ] ;
+                $totalGlobal += $total ;
+            }
+        }
+        
+        $resArray[] = [
+            'name' => '',
+            'quantity' => '',
+            'total' => '<strong>'.Price::format(round($totalGlobal, 2)).'</strong>',
+        ] ;
+        
+        return $resArray ;
+    }
+    
+    public function _generateConditionSqlReport($posts, $name, $fieldOrder) 
+    {
+        $condition = '' ;
+        if(isset($posts[$name]) && strlen($posts[$name])) {
+            $idsArray = explode(',', $posts[$name]) ;
+            for($i = 0; $i < count($idsArray); $i++) {
+                $idsArray[$i] = (int) $idsArray[$i] ;
+            }
+            $condition = 'AND `order`.'.$fieldOrder.' IN ('.implode(',',$idsArray).') ' ;
+        }
+        return $condition ;
+    }
+    
+}

backend/views/distribution/index.php

 $this->setPageTitle('Distributions') ;
 
 ?>
-<div id="app-distribution-index">
+<div id="app-distribution-index" class="app-vuejs">
     <?php if(strlen($date)): ?>
         <span id="distribution-date"><?= $date; ?></span> 
     <?php endif; ?>
     <div id="loading" v-if="showLoading">
         <img src="<?= Yii::$app->urlManagerBackend->getBaseUrl(); ?>/img/loader.gif" alt="Chargement ..." />
     </div>
-    <div id="wrapper-app-distribution-index" :class="{'loaded': !loading}">
+    <div id="wrapper-app-distribution-index" :class="'wrapper-app-vuejs '+(loading ? '' : 'loaded')">
         <div class="col-md-4">
             <div id="calendar">
                 <v-date-picker

backend/views/layouts/left.php

                         'icon' => 'line-chart',
                         'url' => '#',
                         'items' => [
+                            ['label' => 'Rapports','icon' => 'pencil-square-o','url' => ['/report/index'], 'visible' => User::isCurrentProducer()],
                             ['label' => 'Chiffre d\'affaire','icon' => 'line-chart','url' => ['/stats/index'], 'visible' => User::isCurrentProducer()],
                             ['label' => 'Produits','icon' => 'table','url' => ['/stats/products'], 'visible' => User::isCurrentProducer()],
                         ],

backend/views/report/index.php

+<?php
+
+/** 
+Copyright distrib (2018) 
+
+contact@opendistrib.net
+
+Ce logiciel est un programme informatique servant à aider les producteurs 
+à distribuer leur production en circuits courts. 
+
+Ce logiciel est régi par la licence CeCILL soumise au droit français et
+respectant les principes de diffusion des logiciels libres. Vous pouvez
+utiliser, modifier et/ou redistribuer ce programme sous les conditions
+de la licence CeCILL telle que diffusée par le CEA, le CNRS et l'INRIA 
+sur le site "http://www.cecill.info".
+
+En contrepartie de l'accessibilité au code source et des droits de copie,
+de modification et de redistribution accordés par cette licence, il n'est
+offert aux utilisateurs qu'une garantie limitée.  Pour les mêmes raisons,
+seule une responsabilité restreinte pèse sur l'auteur du programme,  le
+titulaire des droits patrimoniaux et les concédants successifs.
+
+A cet égard  l'attention de l'utilisateur est attirée sur les risques
+associés au chargement,  à l'utilisation,  à la modification et/ou au
+développement et à la reproduction du logiciel par l'utilisateur étant 
+donné sa spécificité de logiciel libre, qui peut le rendre complexe à 
+manipuler et qui le réserve donc à des développeurs et des professionnels
+avertis possédant  des  connaissances  informatiques approfondies.  Les
+utilisateurs sont donc invités à charger  et  tester  l'adéquation  du
+logiciel à leurs besoins dans des conditions permettant d'assurer la
+sécurité de leurs systèmes et ou de leurs données et, plus généralement, 
+à l'utiliser et l'exploiter dans les mêmes conditions de sécurité. 
+
+Le fait que vous puissiez accéder à cet en-tête signifie que vous avez 
+pris connaissance de la licence CeCILL, et que vous en avez accepté les
+termes.
+*/
+
+\backend\assets\VuejsReportIndexAsset::register($this);
+
+$this->setTitle('Rapports') ;
+$this->addBreadcrumb('Rapports') ;
+
+?>
+<div id="app-report-index" class="app-vuejs">
+    <div id="loading" v-if="showLoading">
+        <img src="<?= Yii::$app->urlManagerBackend->getBaseUrl(); ?>/img/loader.gif" alt="Chargement ..." />
+    </div>
+    <div id="wrapper-app-report-index" :class="'wrapper-app-vuejs '+(loading ? '' : 'loaded')">
+        <div id="parameters" class="col-md-6">
+            <div id="nav-sections-report">
+                <a v-for="section in sections" :class="'btn-section btn '+(currentSection == section.id ? 'btn-primary' : 'btn-default')" @click="changeSection(section)"><span :class="'fa '+section.icon"></span> {{ section.name }}<span v-if="currentSection == section.id"> <span class="glyphicon glyphicon-triangle-bottom"></span></span></a>
+            </div>
+            <div id="section-users" class="panel panel-default section" v-show="currentSection == 'users'">
+                <div class="panel-body">
+                    <div id="wrapper-search-user">
+                        <span class="glyphicon glyphicon-search"></span>
+                        <input type="text" class="form-control" id="input-search-user" placeholder="Rechercher" v-model="termSearchUser" />
+                    </div>
+                    <div class="content-max-height">
+                        <ul id="list-users">
+                            <li v-for="user in usersArray" v-if="!termSearchUser.length || (termSearchUser.length && (user.lastname.toLowerCase().indexOf(termSearchUser.toLowerCase()) != -1 || user.name.toLowerCase().indexOf(termSearchUser.toLowerCase()) != -1 ))">
+                                <input type="checkbox" :id="'user_'+user.user_id" v-model="user.checked" @change="reportChange" /> 
+                                <label :for="'user_'+user.user_id" v-html="user.lastname+' '+user.name"></label>
+                            </li>
+                        </ul>
+                    </div>
+                </div>
+            </div>
+            <div id="section-points-sale" class="panel panel-default section" v-show="currentSection == 'points-sale'">
+                <div class="panel-body">
+                    <div class="content-max-height">
+                        <ul class="list" id="list-points-sale">
+                            <li v-for="pointSale in pointsSaleArray">
+                                <input type="checkbox" :id="'pointsale_'+pointSale.id" v-model="pointSale.checked" @change="reportChange" /> 
+                                <label :for="'pointsale_'+pointSale.id" v-html="pointSale.name"></label>
+                            </li>
+                        </ul>
+                    </div>
+                </div>
+            </div>
+            <div id="section-distributions" class="panel panel-default section" v-show="currentSection == 'distributions'">
+                <div class="panel-body">
+                    <div id="wrapper-select-year">
+                        <select class="form-control" v-model="distributionYear">                        
+                            <option v-for="year in distributionYearsArray">{{ year }}</option>
+                        </select>
+                    </div>
+                    <div class="content-max-height">
+                        <div class="distribution-month" v-for="distributionsMonth in distributionsByMonthArray" v-if="distributionsMonth.year == distributionYear && distributionsMonth.distributions.length > 0">
+                            <a class="btn btn-default link-month-distribution" @click="distributionsMonth.display = !distributionsMonth.display">{{ distributionsMonth.month }} <span class="glyphicon glyphicon-menu-down"></span></a>
+                            <ul v-if="distributionsMonth.display">
+                                <li v-for="distribution in distributionsMonth.distributions">
+                                    <input type="checkbox" :id="'distribution_'+distribution.id" v-model="distribution.checked" @change="reportChange" />
+                                    <label :for="'distribution_'+distribution.id">{{ distribution.date }}</label>
+                                </li>
+                            </ul>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <div class="col-md-6">
+            <div id="report" class="panel panel-default">
+                <div class="panel-heading">
+                    <h2 class="panel-title">Rapport</h2>
+                </div>
+                <div class="panel-body">
+                    <div id="summary">
+                        <div class="alert alert-info" v-if="!countUsers() && !countPointsSale() && !countDistributions()">
+                            Veuillez sélectionner un utilisateur et/ou un point de vente et/ou une distribution.
+                        </div>
+                        <div class="section" v-if="countUsers() > 0">
+                            <h3><span class="fa fa-users"></span> {{ countUsers() }} Utilisateurs</h3>
+                            <template v-for="user in usersArray" v-if="user.checked">
+                                <span v-html="user.name+' '+user.lastname"></span><span class="comma">, </span>
+                            </template>
+                        </div>
+                        <div class="section" v-if="countPointsSale() > 0">
+                            <h3><span class="fa fa-map-marker"></span> {{ countPointsSale() }} Points de vente</h3>
+                            <template v-for="pointSale in pointsSaleArray" v-if="pointSale.checked">
+                                <span v-html="pointSale.name"></span><span class="comma">, </span>
+                            </template>
+                        </div>
+                        <div class="section" v-if="countDistributions() > 0">
+                            <h3><span class="fa fa-calendar"></span> {{ countDistributions() }} Distributions</h3>
+                            <template v-for="distributionsMonth in distributionsByMonthArray">
+                                <template v-for="distribution in distributionsMonth.distributions" v-if="distribution.checked">
+                                    <span v-html="distribution.date"></span><span class="comma">, </span>
+                                </template>
+                            </template>
+                        </div>
+                    </div>
+                    <div id="report" v-if="countUsers() || countPointsSale() || countDistributions()">
+                        <div class="content-report section" v-if="showReport">
+                            <h3><span class="fa fa-pencil-square-o"></span> Rapport</h3>
+                            <table class="table table-bordered" v-if="tableReport.length > 1">
+                                <thead>
+                                    <tr>
+                                        <th>Produit</th>
+                                        <th>Quantité</th>
+                                        <th>Total</th>
+                                    </tr>
+                                </thead>
+                                <tbody>
+                                    <tr v-for="line in tableReport">
+                                        <td>{{ line.name }}</td>
+                                        <td>{{ line.quantity }}</td>
+                                        <td v-html="line.total"></td>
+                                    </tr>
+                                </tbody>
+                            </table>
+                            <div class="alert alert-warning" v-else>
+                                Aucune donnée disponible pour ces critères.
+                            </div>
+                        </div>
+                        <a class="btn btn-primary" @click="generateReport()" v-else="!showReport"><span class="fa fa-pencil-square-o"></span> Générer</a>
+                    </div>
+                </div>
+            </div>
+        </div>
+        
+    </div>
+</div>

backend/web/js/vuejs/distribution-index.js

 
+/** 
+Copyright distrib (2018) 
+
+contact@opendistrib.net
+
+Ce logiciel est un programme informatique servant à aider les producteurs 
+à distribuer leur production en circuits courts. 
+
+Ce logiciel est régi par la licence CeCILL soumise au droit français et
+respectant les principes de diffusion des logiciels libres. Vous pouvez
+utiliser, modifier et/ou redistribuer ce programme sous les conditions
+de la licence CeCILL telle que diffusée par le CEA, le CNRS et l'INRIA 
+sur le site "http://www.cecill.info".
+
+En contrepartie de l'accessibilité au code source et des droits de copie,
+de modification et de redistribution accordés par cette licence, il n'est
+offert aux utilisateurs qu'une garantie limitée.  Pour les mêmes raisons,
+seule une responsabilité restreinte pèse sur l'auteur du programme,  le
+titulaire des droits patrimoniaux et les concédants successifs.
+
+A cet égard  l'attention de l'utilisateur est attirée sur les risques
+associés au chargement,  à l'utilisation,  à la modification et/ou au
+développement et à la reproduction du logiciel par l'utilisateur étant 
+donné sa spécificité de logiciel libre, qui peut le rendre complexe à 
+manipuler et qui le réserve donc à des développeurs et des professionnels
+avertis possédant  des  connaissances  informatiques approfondies.  Les
+utilisateurs sont donc invités à charger  et  tester  l'adéquation  du
+logiciel à leurs besoins dans des conditions permettant d'assurer la
+sécurité de leurs systèmes et ou de leurs données et, plus généralement, 
+à l'utiliser et l'exploiter dans les mêmes conditions de sécurité. 
+
+Le fait que vous puissiez accéder à cet en-tête signifie que vous avez 
+pris connaissance de la licence CeCILL, et que vous en avez accepté les
+termes.
+*/
 
 var app = new Vue({
     el: '#app-distribution-index',

backend/web/js/vuejs/producer-update.js

 
+/** 
+Copyright distrib (2018) 
+
+contact@opendistrib.net
+
+Ce logiciel est un programme informatique servant à aider les producteurs 
+à distribuer leur production en circuits courts. 
+
+Ce logiciel est régi par la licence CeCILL soumise au droit français et
+respectant les principes de diffusion des logiciels libres. Vous pouvez
+utiliser, modifier et/ou redistribuer ce programme sous les conditions
+de la licence CeCILL telle que diffusée par le CEA, le CNRS et l'INRIA 
+sur le site "http://www.cecill.info".
+
+En contrepartie de l'accessibilité au code source et des droits de copie,
+de modification et de redistribution accordés par cette licence, il n'est
+offert aux utilisateurs qu'une garantie limitée.  Pour les mêmes raisons,
+seule une responsabilité restreinte pèse sur l'auteur du programme,  le
+titulaire des droits patrimoniaux et les concédants successifs.
+
+A cet égard  l'attention de l'utilisateur est attirée sur les risques
+associés au chargement,  à l'utilisation,  à la modification et/ou au
+développement et à la reproduction du logiciel par l'utilisateur étant 
+donné sa spécificité de logiciel libre, qui peut le rendre complexe à 
+manipuler et qui le réserve donc à des développeurs et des professionnels
+avertis possédant  des  connaissances  informatiques approfondies.  Les
+utilisateurs sont donc invités à charger  et  tester  l'adéquation  du
+logiciel à leurs besoins dans des conditions permettant d'assurer la
+sécurité de leurs systèmes et ou de leurs données et, plus généralement, 
+à l'utiliser et l'exploiter dans les mêmes conditions de sécurité. 
+
+Le fait que vous puissiez accéder à cet en-tête signifie que vous avez 
+pris connaissance de la licence CeCILL, et que vous en avez accepté les
+termes.
+*/
+
 var app = new Vue({
     el: '#app-producer-update',
     data: {

backend/web/js/vuejs/report-index.js

+
+var app = new Vue({
+    el: '#app-report-index',
+    data: {
+        loading: true,
+        showLoading: true,
+        showReport: false,
+        tableReport: [],
+        currentSection: 'users',
+        sections: [
+            {
+              name: 'Utilisateurs',
+              id: 'users',
+              icon: 'fa-users',
+            },
+            {
+                name: 'Points de vente',
+                id: 'points-sale',
+                icon: 'fa-map-marker',
+            },
+            {
+                name: 'Distributions',
+                id: 'distributions',
+                icon: 'fa-calendar',
+            }
+        ],
+        termSearchUser: '',
+        usersArray: [],
+        pointsSaleArray: [],
+        distributionYearsArray: [],
+        distributionYear: null,
+        distributionsByMonthArray: []
+    },
+    mounted: function() {
+        this.init() ;
+    },
+    methods: {
+        init: function() {
+            var app = this ;
+            axios.get("ajax-init",{params: {}})
+                .then(function(response) {
+                    app.usersArray = response.data.usersArray ;
+                    app.pointsSaleArray = response.data.pointsSaleArray ;
+                    app.distributionYearsArray = response.data.distributionYearsArray ;
+                    app.distributionYear = app.distributionYearsArray[app.distributionYearsArray.length - 1] ;
+                    app.distributionsByMonthArray = response.data.distributionsByMonthArray ;
+                    
+                    app.loading = false ;
+                    app.showLoading = false ;
+                });
+        },
+        changeSection: function(section) {
+            this.currentSection = section.id ;
+        }, 
+        countUsers: function() {
+            var count = 0 ;
+            for(var i = 0; i < this.usersArray.length; i++) {
+                if(this.usersArray[i].checked) {
+                    count ++ ;
+                }
+            }
+            return count ;
+        },
+        countPointsSale: function() {
+            var count = 0 ;
+            for(var i = 0; i < this.pointsSaleArray.length; i++) {
+                if(this.pointsSaleArray[i].checked) {
+                    count ++ ;
+                }
+            }
+            return count ;
+        },
+        countDistributions: function() {
+            var count = 0 ;
+            for(var i in this.distributionsByMonthArray) {
+                for(var j = 0; j < this.distributionsByMonthArray[i].distributions.length; j++) {
+                    if(this.distributionsByMonthArray[i].distributions[j].checked) {
+                        count ++ ;
+                    }
+                }
+            }
+            return count ;
+        },
+        generateReport: function() {
+            var app = this ;
+            app.showLoading = true ;
+            
+            var data = new FormData();
+            var idsUsersArray = [] ;
+            for(var i = 0; i < app.usersArray.length; i++) {
+                if(app.usersArray[i].checked) {
+                    idsUsersArray.push(app.usersArray[i].user_id) ;
+                }
+            }
+            var idsPointsSaleArray = [] ;
+            for(var i = 0; i < app.pointsSaleArray.length; i++) {
+                if(app.pointsSaleArray[i].checked) {
+                    idsPointsSaleArray.push(app.pointsSaleArray[i].id) ;
+                }
+            }
+            
+            var idsDistributionsArray = [] ;
+            for(var i in this.distributionsByMonthArray) {
+                for(var j = 0; j < this.distributionsByMonthArray[i].distributions.length; j++) {
+                    if(this.distributionsByMonthArray[i].distributions[j].checked) {
+                        idsDistributionsArray.push(app.distributionsByMonthArray[i].distributions[j].id) ;
+                    }
+                }
+            }
+
+            data.append('users', idsUsersArray);
+            data.append('pointsSale', idsPointsSaleArray);
+            data.append('distributions', idsDistributionsArray);
+            
+            axios.post("ajax-report",data)
+                .then(function(response) {
+                    app.tableReport = response.data ;
+                    app.showLoading = false ;
+                    app.showReport = true ;
+                });
+            
+        },
+        reportChange: function() {
+            this.showReport = false;
+        }
+    }
+});

backend/web/sass/_adminlte.scss

         
         .btn-default {
             color: #333 ;
+            background-color: white ;
         }
         
         .btn-primary {

backend/web/sass/distribution/_index.scss

 
 .distribution-index {
     
+    .content-header {
+        .date {
+            font-weight: bold ;
+        }
+    }
+    
     #wrapper-app-distribution-index {
         display: none ;
         &.loaded {
         }
     }
     
-    .content-header {
-        .date {
-            font-weight: bold ;
-        }
-    }
-    
     #app-distribution-index {
         position: relative ;
     }
         display: none ;
     }
     
-    #loading {
-        position: fixed ; 
-        top: 50% ;
-        left: 50% ;
-        width: 100px ;
-        height: 100px ;
-        @include border-radius(50px) ;
-        background-color: white ;
-        z-index: 10 ;
-        @include box-shadow(0px 0px 5px #d0d0d0) ;
-        
-        img {
-            position: relative ;
-            top: 35px ;
-            left: 35px ;
-            width: 30px ;
-            height: 30px ;
-        }
-    }
-    
     #calendar {
         margin-bottom: 15px ;
         .c-header .c-title-layout .c-title-popover .c-title-anchor .c-title[data-v-2083cb72] {
         }
     }
     
-    .modal-mask {
-        position: fixed;
-        z-index: 9998;
-        top: 0;
-        left: 0;
-        width: 100%;
-        height: 100%;
-        background-color: rgba(0, 0, 0, .5);
-        display: table;
-        transition: opacity .3s ease;
-      }
-
-      .modal-wrapper {
-        display: table-cell;
-        vertical-align: middle;
-      }
-
-      .modal-container {
-        width: 70%;
-        margin: 0px auto;
-        padding: 20px 30px;
-        background-color: #fff;
-        border-radius: 2px;
-        box-shadow: 0 2px 8px rgba(0, 0, 0, .33);
-        transition: all .3s ease;
-        font-family: Helvetica, Arial, sans-serif;
-      }
-      
-    .modal-header {
-        padding-bottom: 0px ;
-        h3 {
-            margin-top: 0;
-            color: #333;
-            text-transform: uppercase ;
-            margin-bottom: 0px ;
-        }
-    }
-
-      .modal-body {
-        margin: 20px 0;
-        max-height: 300px ;
-        height: 300px ;
-        overflow-y: scroll ;
-      }
-
-      .modal-default-button {
-        float: right;
-      }
-
-      /*
-       * The following styles are auto-applied to elements with
-       * transition="modal" when their visibility is toggled
-       * by Vue.js.
-       *
-       * You can easily play with the modal transition by editing
-       * these styles.
-       */
-
-      .modal-enter {
-        opacity: 0;
-      }
-
-      .modal-leave-active {
-        opacity: 0;
-      }
-
-      .modal-enter .modal-container,
-      .modal-leave-active .modal-container {
-        -webkit-transform: scale(1.1);
-        transform: scale(1.1);
-      }
-
-    
 }
 

backend/web/sass/report/_index.scss

+/** 
+Copyright distrib (2018) 
+
+contact@opendistrib.net
+
+Ce logiciel est un programme informatique servant à aider les producteurs 
+à distribuer leur production en circuits courts. 
+
+Ce logiciel est régi par la licence CeCILL soumise au droit français et
+respectant les principes de diffusion des logiciels libres. Vous pouvez
+utiliser, modifier et/ou redistribuer ce programme sous les conditions
+de la licence CeCILL telle que diffusée par le CEA, le CNRS et l'INRIA 
+sur le site "http://www.cecill.info".
+
+En contrepartie de l'accessibilité au code source et des droits de copie,
+de modification et de redistribution accordés par cette licence, il n'est
+offert aux utilisateurs qu'une garantie limitée.  Pour les mêmes raisons,
+seule une responsabilité restreinte pèse sur l'auteur du programme,  le
+titulaire des droits patrimoniaux et les concédants successifs.
+
+A cet égard  l'attention de l'utilisateur est attirée sur les risques
+associés au chargement,  à l'utilisation,  à la modification et/ou au
+développement et à la reproduction du logiciel par l'utilisateur étant 
+donné sa spécificité de logiciel libre, qui peut le rendre complexe à 
+manipuler et qui le réserve donc à des développeurs et des professionnels
+avertis possédant  des  connaissances  informatiques approfondies.  Les
+utilisateurs sont donc invités à charger  et  tester  l'adéquation  du
+logiciel à leurs besoins dans des conditions permettant d'assurer la
+sécurité de leurs systèmes et ou de leurs données et, plus généralement, 
+à l'utiliser et l'exploiter dans les mêmes conditions de sécurité. 
+
+Le fait que vous puissiez accéder à cet en-tête signifie que vous avez 
+pris connaissance de la licence CeCILL, et que vous en avez accepté les
+termes.
+*/
+
+.report-index {
+    
+    #wrapper-app-report-index {
+        display: none ;
+        &.loaded {
+            display: block ;
+        }
+    }
+    
+    #parameters {
+        #nav-sections-report {
+            .btn-section {
+                margin-right: 5px ;
+            }
+        }
+
+        .section {
+            margin-top: 10px ;
+            .content-max-height {
+                max-height: 400px ;
+                overflow-y: scroll ;
+
+                ul {
+                    list-style-type: none ;
+                    margin-left: 0px ;
+                    padding-left: 5px ;
+
+                    li {
+                        input {
+                            position: relative ;
+                            top: 2px ;
+                        }
+                        label {
+                            font-weight: normal;
+                            margin-bottom: 0px ;
+                        }
+                    }
+                }
+            }
+        }
+        #section-users {
+            #wrapper-search-user {
+                margin-bottom: 10px ;
+                position: relative ;
+                .glyphicon-search {
+                    position: absolute ;
+                    top: 10px ;
+                    right: 16px ;
+                    color: gray ;
+                }
+            }
+        }
+        #section-points-sale {
+
+        }
+        #section-distributions {
+            #wrapper-select-year {
+                margin-bottom: 10px ;
+            }
+
+            .distribution-month {
+                margin-bottom: 10px ;
+                .link-month-distribution {
+                    display: block ;
+                    text-transform: capitalize ;
+                    text-align: left ;
+
+                    .glyphicon {
+                        float: right ;
+                    }
+                }
+            }
+        }
+    }
+    
+    #report {
+        
+        .section {
+            margin-bottom: 15px ;
+            
+            h3 {
+                margin: 0px ;
+                padding: 0px ;
+                font-size: 16px ;
+                text-transform: uppercase ;
+            }
+            .comma:last-child {
+                display: none ;
+            }
+        }
+        
+    }
+}

backend/web/sass/screen.scss

     }
 }
 
+.app-vuejs {
+    #loading {
+        position: fixed ; 
+        top: 50% ;
+        left: 50% ;
+        width: 100px ;
+        height: 100px ;
+        @include border-radius(50px) ;
+        background-color: white ;
+        z-index: 10 ;
+        @include box-shadow(0px 0px 5px #d0d0d0) ;
+
+        img {
+            position: relative ;
+            top: 35px ;
+            left: 35px ;
+            width: 30px ;
+            height: 30px ;
+        }
+    }
+}
+
+/* modals */
+
+.modal-mask {
+    position: fixed;
+    z-index: 9998;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background-color: rgba(0, 0, 0, .5);
+    display: table;
+    transition: opacity .3s ease;
+}
+
+.modal-wrapper {
+    display: table-cell;
+    vertical-align: middle;
+}
+
+.modal-container {
+    width: 70%;
+    margin: 0px auto;
+    padding: 20px 30px;
+    background-color: #fff;
+    border-radius: 2px;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, .33);
+    transition: all .3s ease;
+    font-family: Helvetica, Arial, sans-serif;
+}
+
+.modal-header {
+    padding-bottom: 0px ;
+    h3 {
+        margin-top: 0;
+        color: #333;
+        text-transform: uppercase ;
+        margin-bottom: 0px ;
+    }
+}
+
+.modal-body {
+    margin: 20px 0;
+    max-height: 300px ;
+    height: 300px ;
+    overflow-y: scroll ;
+}
+
+.modal-default-button {
+    float: right;
+}
+
+/*
+* The following styles are auto-applied to elements with
+* transition="modal" when their visibility is toggled
+* by Vue.js.
+*
+* You can easily play with the modal transition by editing
+* these styles.
+*/
+
+.modal-enter {
+    opacity: 0;
+}
+
+.modal-leave-active {
+    opacity: 0;
+}
+
+.modal-enter .modal-container,
+.modal-leave-active .modal-container {
+    -webkit-transform: scale(1.1);
+    transform: scale(1.1);
+}
+
 // liste de commandes
 .site-index, .user-commandes {
     #last-orders, #history-orders {
 @import "user/_credit.scss" ; 
 @import "user/_form.scss" ; 
 @import "producer/_update.scss" ; 
-@import "point_sale/_index.scss" ; 
+@import "point_sale/_index.scss" ; 
+@import "report/_index.scss" ;