Browse Source

[ADD] agregado grafico de ingreso y egreso

Rodney Elpidio Enciso Arias 7 years ago
parent
commit
6fd413bb2a

+ 3 - 0
data/charts_data.xml

@@ -40,5 +40,8 @@
         <record model="chart.list" id="widget_WidgetBank">
             <field name="name">WidgetBank</field>
         </record>
+        <record model="chart.list" id="chart_ChartIngresoEgreso">
+            <field name="name">ChartIngresoEgreso</field>
+        </record>
     </data>
 </openerp>

+ 24 - 0
static/src/js/dashboard.js

@@ -170,6 +170,30 @@ function dashboard_reporting_widget (instance, widget) {
                 });
             });
 
+            // *************************** Ingreso Egreso
+            var wChartIngresoEgreso = new widgets.ChartIngresoEgresoWidget(self);
+            wChartIngresoEgreso.fetchCurrentUser().then(function(CurrentUser){
+                return CurrentUser;
+            }).then(function(CurrentUser){
+                wChartIngresoEgreso.fetchResUser(CurrentUser).then(function(chart_ids){
+                    return chart_ids;
+                }).then(function(chart_ids){
+                    var charts = chart_ids[0].chart_ids;
+                    wChartIngresoEgreso.fetchChartList(charts).then(function(ChartList){
+                        return ChartList;
+                    }).then(function(ChartList){
+                        var chart =  _.flatten(_.filter(ChartList,function (inv) {
+                            return inv.name == 'ChartIngresoEgreso';
+                        }));
+                        if(chart.length > 0){
+                            wChartIngresoEgreso.renderElement();
+                            wChartIngresoEgreso.start();
+                            self.grid.addWidget(wChartIngresoEgreso.$el, 0, 0, wChartIngresoEgreso.size.width,  wChartIngresoEgreso.size.height, true);
+                        }
+                    });
+                });
+            });
+
 
 
 

+ 1 - 0
static/src/js/main.js

@@ -23,6 +23,7 @@ openerp.eiru_reporting_dashboard = function (instance) {
         widget_balance(dashboard);
         widget_cash(dashboard);
         widget_bank(dashboard);
+        chart_ingreso_egreso(dashboard);
     }catch(e){
         // error
     }

+ 317 - 0
static/src/js/widgets/chart_ingreso_egreso.js

@@ -0,0 +1,317 @@
+function chart_ingreso_egreso (widget) {
+    "use strict";
+
+    var model = openerp;
+
+    widget.ChartIngresoEgresoWidget = widget.Base.extend({
+        template: 'ChartIngresoEgreso',
+        data: [],
+
+        events: {
+            'click .week': 'showWeeks',
+            'click .days': 'showDays',
+            'click .month': 'showMonths',
+        },
+
+        init: function (parent) {
+            this._super(parent, {
+                width: 6,
+                height: 4
+            });
+        },
+        start: function () {
+            var self = this;
+            self.fetchInitial();
+        },
+        fetchInitial:function() {
+            var self = this;
+            self.$el.block({
+                message: null,
+                overlayCSS: {
+                    backgroundColor: '#FAFAFA'
+                }
+            });
+
+            self.$el.find('.widget-content.widget-loading').css('display','flex');
+
+            self.fecthAccountBankStatementLine().then(function (AccountBankStatementLine) {
+                return AccountBankStatementLine;
+            }).then(function (AccountBankStatementLine) {
+                self.AccountBankStatementLine = AccountBankStatementLine;
+                return self.showMonths();
+            });
+        },
+
+        // Usuario Logeado
+        fetchCurrentUser: function() {
+            var self = this;
+            var ResUser = new model.web.Model('res.users');
+            return ResUser.call('get_user', {
+                context: new model.web.CompoundContext()
+            });
+        },
+
+        // Lista de Graficos disponibles para el usuario
+        fetchResUser: function(id) {
+            var self = this;
+            var defer = $.Deferred();
+            var fields = ['id','name','chart_ids'];
+            var domain = [['id','=',id]];
+            var ResUser = new model.web.Model('res.users');
+            ResUser.query(fields).filter(domain).all().then(function (results) {
+                defer.resolve(results);
+            });
+
+            return defer;
+        },
+
+        // Obtener detalles de la lista de graficos
+        fetchChartList: function(chart_ids) {
+            var self = this;
+            var defer = $.Deferred();
+            var fields = ['id','name'];
+            var domain = [['id','in',chart_ids]];
+            var ChartList = new model.web.Model('chart.list');
+            ChartList.query(fields).filter(domain).all().then(function (results) {
+                defer.resolve(results);
+            });
+            return defer;
+        },
+
+        fecthAccountBankStatementLine: function() {
+            var self = this;
+            var defer = $.Deferred();
+            var fields = ['id','date','partner_id','amount'];
+            // var domain = [['state','in',['paid','open']]];
+            var AccountBankStatementLine = new model.web.Model('account.bank.statement.line');
+            AccountBankStatementLine.query(fields).filter().all().then(function (results) {
+                defer.resolve(results);
+            });
+            return defer;
+        },
+
+        // Obtener Lineas de caja por mes
+        
+        getInAccountBankStatementLine:function(mes) {
+            var self = this;
+            if (mes < 10){
+                var fecha = moment().format('YYYY')+'-'+'0'+mes;    
+            }else{
+                var fecha = moment().format('YYYY')+'-'+mes;    
+            }
+            return _.flatten(_.filter(self.AccountBankStatementLine,function (inv) {
+                return moment(inv.date).format('YYYY-MM') === fecha & inv.amount > 0;
+            }));
+        },
+
+        getOutAccountBankStatementLine:function(mes) {
+            var self = this;
+            if (mes < 10){
+                var fecha = moment().format('YYYY')+'-'+'0'+mes;    
+            }else{
+                var fecha = moment().format('YYYY')+'-'+mes;    
+            }
+            return _.flatten(_.filter(self.AccountBankStatementLine,function (inv) {
+                return moment(inv.date).format('YYYY-MM') === fecha & inv.amount < 0;
+            }));
+        },
+
+        // Obtener lineas de caja por esta semana
+
+        getInWeekAccountBankStatementLine:function(day) {
+            var self = this;
+            var week = moment().week();
+            return _.flatten(_.filter(self.AccountBankStatementLine,function (inv) {
+                return moment(inv.date).week() === week & moment(inv.date).isoWeekday() === day & inv.amount > 0;
+            }));
+        },
+
+        getOutWeekAccountBankStatementLine:function(day) {
+            var self = this;
+            var week = moment().week();
+            return _.flatten(_.filter(self.AccountBankStatementLine,function (inv) {
+                return moment(inv.date).week() === week & moment(inv.date).isoWeekday() === day & inv.amount < 0;
+            }));
+        },
+
+        // Obtener lineas de caja por dias
+
+        getInDaysAccountBankStatementLine:function(day) {
+            var self = this;
+            var date = moment().subtract(day, 'days').format('YYYY-MM-DD');
+            return _.flatten(_.filter(self.AccountBankStatementLine,function (inv) {
+                return moment(inv.date).format('YYYY-MM-DD') === date & inv.amount > 0;
+            }));
+        },
+
+        getOutDaysAccountBankStatementLine:function(day) {
+            var self = this;
+            var date = moment().subtract(day, 'days').format('YYYY-MM-DD');
+            return _.flatten(_.filter(self.AccountBankStatementLine,function (inv) {
+                return moment(inv.date).format('YYYY-MM-DD') === date & inv.amount < 0; 
+            }));
+        },
+  
+        // Mostrar por meses
+        showMonths: function() {
+            var self = this;
+            var title = ['Enero', 'Febrero', 'Marzo','Abril','Mayo','Junio','Julio','Agosto','Septiembre','Octubre','Noviembre','Diciembre'];
+            var inStatement;
+            var OutStatement;
+            var mes = 0;
+            var dataIn = [];
+            var dataOut = [];
+            for (var i = 1; i <= 12; i++) {
+                inStatement = self.getInAccountBankStatementLine(i);
+                var total = _.reduce(_.map(inStatement,function(item) {
+                    return item.amount;
+                }),function(memo, num) {
+                    return memo + num;
+                },0);
+                dataIn.push(total);
+            }
+            for (var i = 1; i <= 12; i++) {
+                OutStatement = self.getOutAccountBankStatementLine(i);
+                var total = _.reduce(_.map(OutStatement,function(item) {
+                    return item.amount;
+                }),function(memo, num) {
+                    return memo + num;
+                },0);
+                dataOut.push(total);
+            }
+            self.$el.unblock();
+            self.$el.find('.widget-content.widget-loading').css('display','none');
+            self.fetchChart(dataIn, dataOut, title);
+        },
+
+        // Mostrar por semana Actual
+        showWeeks: function() {
+            var self = this;
+            var title = ['Lunes', 'Martes', 'Miercoles','Jueves','Viernes','Sabado','Domingo'];
+            var inStatement;
+            var OutStatement;
+            var mes = 0;
+            var dataIn = [];
+            var dataOut = [];
+            for (var i = 1; i <= 12; i++) {
+                inStatement = self.getInWeekAccountBankStatementLine(i);
+                var total = _.reduce(_.map(inStatement,function(item) {
+                    return item.amount;
+                }),function(memo, num) {
+                    return memo + num;
+                },0);
+                dataIn.push(total);
+            }
+            for (var i = 1; i <= 12; i++) {
+                OutStatement = self.getOutWeekAccountBankStatementLine(i);
+                var total = _.reduce(_.map(OutStatement,function(item) {
+                    return item.amount;
+                }),function(memo, num) {
+                    return memo + num;
+                },0);
+                dataOut.push(total);
+            }
+            self.$el.unblock();
+            self.$el.find('.widget-content.widget-loading').css('display','none');
+            self.fetchChart(dataIn, dataOut, title);
+        },
+
+        // Mostrar grafico por dias
+        showDays: function() {
+            var self = this;
+            var title = [];
+            var inStatement;
+            var OutStatement;
+            var mes = 0;
+            var dataIn = [];
+            var dataOut = [];
+            for (var i = 15; i >= 0; i--) {
+                inStatement = self.getInDaysAccountBankStatementLine(i);
+                var total = _.reduce(_.map(inStatement,function(item) {
+                    return item.amount;
+                }),function(memo, num) {
+                    return memo + num;
+                },0);
+                dataIn.push(total);
+                title.push(moment().subtract(i, 'days').format('DD / MM'));
+            }
+            for (var i = 15; i >= 0; i--) {
+                OutStatement = self.getOutDaysAccountBankStatementLine(i);
+                var total = _.reduce(_.map(OutStatement,function(item) {
+                    return item.amount;
+                }),function(memo, num) {
+                    return memo + num;
+                },0);
+                dataOut.push(total);
+            }
+            self.$el.unblock();
+            self.$el.find('.widget-content.widget-loading').css('display','none');
+            self.fetchChart(dataIn, dataOut, title);
+        },
+
+        // Generar Grafico
+        fetchChart: function (dataIn,dataOut,title) {
+            var self = this;
+            var label = title;
+            var bodyIn = dataIn;
+            var bodyOut = dataOut;
+            var item;
+
+            // Global method for setting Y axis number format.
+            Chart.scaleService.updateScaleDefaults('linear', {
+              ticks: {
+                callback: function(tick) {
+                    return tick.toLocaleString('de-DE');
+                }
+              }
+            });
+            Chart.defaults.global.tooltips.callbacks.label = function(tooltipItem, data) {
+                var dataset = data.datasets[tooltipItem.datasetIndex];
+                var datasetLabel = dataset.label || '';
+                return datasetLabel +  dataset.data[tooltipItem.index].toLocaleString('de-DE');
+            };
+            var chart = new Chart(this.$el.find(".widget-content").find('canvas'), {
+                type: 'line',
+                data: {
+                    labels: label,
+                    datasets: [
+                        {
+                            label: 'Ingreso  ',
+                            data: bodyIn,
+                            backgroundColor: '#e3f2fd',
+                            borderColor: '#64b5f6',
+                            borderWidth: 2,
+                            fill: false,
+                        },
+                        {
+                            label: 'Egreso  ',                            
+                            data: bodyOut,
+                            backgroundColor: '#c8e6c9',
+                            borderColor: '#66bb6a',
+                            borderWidth: 2,
+                            fill: false,
+                        }
+                    ]
+                },
+                options: {
+                    responsive: true,
+                    title: {
+                        display: true,
+                    },
+                    hover: {
+                        mode: 'nearest',
+                        intersect: true
+                    },
+                    layout: {
+                        padding: {
+                            top: 5,
+                            bottom: 15,
+                            left : 0,
+                            rigth: 0,
+                        }
+                    },
+                }
+            });
+        },
+    });
+}

+ 38 - 0
static/src/xml/widgets/chart_ingreso_egreso.xml

@@ -0,0 +1,38 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<template xml:space="preserve">
+    <t t-name="ChartIngresoEgreso">
+        <t t-call="WidgetReportingBaseTemplate">
+            <h2  class="widget-title">
+                <div class="row">
+                    <div class="col-xs-6">
+                        <i class="fa fa-bar-chart" aria-hidden="true"></i>
+                        <span>Ingreso - Egreso</span> 
+                    </div>
+                    <div class="col-xs-6">
+                        <div class="col-xs-6 col-xs-offset-9">
+                            <div class="btn-group btn-group-xs">
+                                <a type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                                <span class="caret"></span>
+                                <span class="sr-only">Toggle Dropdown</span>
+                                </a>
+                                <ul class="dropdown-menu dropdown-menu-right">
+                                    <li><a class="days">15 dias</a></li>
+                                    <li><a class="month">Meses</a></li>
+                                    <li role="separator" class="divider"></li>
+                                    <li><a class="week">Esta Semana</a></li>
+                                </ul>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </h2>
+            <div class="widget-content">
+                <br/>
+                <canvas></canvas>
+            </div>
+            <div class="widget-content widget-loading">
+                <i class='fa fa-cog fa-spin fa-3x fa-fw'></i>
+            </div>
+        </t>
+    </t>
+</template>

+ 1 - 0
templates.xml

@@ -25,6 +25,7 @@
                 <script type="text/javascript" src="/eiru_reporting_dashboard/static/src/js/widgets/widget_balance.js" />
                 <script type="text/javascript" src="/eiru_reporting_dashboard/static/src/js/widgets/widget_cash.js" />
                 <script type="text/javascript" src="/eiru_reporting_dashboard/static/src/js/widgets/widget_bank.js" />
+                <script type="text/javascript" src="/eiru_reporting_dashboard/static/src/js/widgets/chart_ingreso_egreso.js" />
 
                 <!-- Dashboard Main  -->
                 <script type="text/javascript" src="/eiru_reporting_dashboard/static/src/js/dashboard.js" />