erp_app 3.1.16 → 4.0.0

data/public/javascripts/erp_app/organizer/layout.js

@@ -1,32 +1,37 @@
 Ext.ns("Compass.ErpApp.Organizer.Applications");
 
+Ext.define("Compass.ErpApp.Organizer.Applications.ApplicationContainer", {
+    extend: "Ext.tab.Panel",
+    alias: 'widget.applicationcontainer'
+});
+
 Compass.ErpApp.Organizer.Layout = function (config) {
 
     this.layoutConfig = config;
 
     //used to build accordion menu
-    var accordionMenuItems = []
-
+    var accordionMenuItems = [];
     var menu = Ext.create('Ext.menu.Menu', {
-        items:[
+
+        items: [
             {
-                text:'Preferences',
-                iconCls:'icon-gear',
-                handler:function () {
-                    var win = Ext.create("Compass.ErpApp.Organizer.PreferencesWindow", {iconCls:'icon-gear'});
+                text: 'Preferences',
+                iconCls: 'icon-gear',
+                handler: function () {
+                    var win = Ext.create("Compass.ErpApp.Organizer.PreferencesWindow", {iconCls: 'icon-gear'});
                     win.show();
                     win.setup();
                 }
             },
             {
-                text:'Profile',
-                iconCls:'icon-user',
-                handler:function () {
+                text: 'Profile',
+                iconCls: 'icon-user',
+                handler: function () {
                     var win = Ext.create("Ext.window.Window", {
-                        title:'Profile',
-                        iconCls:'icon-user',
-                        items:[
-                            {xtype:'shared_profilemanagementpanel', title:'', height:250}
+                        title: 'Profile',
+                        iconCls: 'icon-user',
+                        items: [
+                            {xtype: 'shared_profilemanagementpanel', title: ''}
                         ]
                     });
                     win.show();
@@ -35,33 +40,46 @@ Compass.ErpApp.Organizer.Layout = function (config) {
         ]
     });
 
-    var toolbar = Ext.create("Ext.toolbar.Toolbar", {
-        items:[
+    this.toolBar = Ext.create("Ext.toolbar.Toolbar", {
+        ui: 'cleantoolbar-dark',
+        dock: 'top',
+        height: 50,
+        style: {
+            paddingLeft: '22px',
+            paddingRight: '15px'
+        },
+        items: [
             {
-                text:'Menu',
-                iconCls:'icon-info',
-                menu:menu
+                ui: 'cleanbutton',
+                text: 'Menu',
+                iconCls: 'icon-info',
+                menu: menu
+            },
+            ' ',
+            {
+                xtype: 'label',
+                style: 'color:white;',
+                text: 'Welcome',
+                itemId: 'organizerWelcomeMsg'
             }
         ]
     });
 
-    this.ToolBar = toolbar;
-
     this.addToToolBar = function (item) {
-        toolbar.add("|");
-        toolbar.add(item);
+        this.toolBar.add(item);
     };
 
     this.setupLogoutButton = function () {
-        toolbar.add("->");
-        toolbar.add({
-            text:'Logout',
-            xtype:'button',
-            iconCls:"icon-exit",
-            defaultAlign:"right",
-            'listeners':{
-                scope:this,
-                'click':function () {
+        this.toolBar.add("->");
+        this.toolBar.add({
+            ui: 'cleanbutton',
+            text: 'Logout',
+            xtype: 'button',
+            iconCls: "icon-exit",
+            defaultAlign: "right",
+            'listeners': {
+                scope: this,
+                'click': function () {
                     Ext.MessageBox.confirm('Confirm', 'Are you sure you want to logout?', function (btn) {
                         if (btn == 'no') {
                             return false;
@@ -81,97 +99,168 @@ Compass.ErpApp.Organizer.Layout = function (config) {
         });
     };
 
-    this.CenterPanel = Ext.create("Ext.Panel", {
-        id:'erp_app_viewport_center',
-        region:'center',
-        margins:'0 0 0 0',
-        layout:'card',
-        activeItem:0,
-        frame:false,
-        minsize:300,
-        items:[]
-    });
-
-    this.NorthPanel = Ext.create("Ext.Panel", {
-        region:'north',
-        height:29,
-        layout:'anchor',
-        margins:'0 0 0 0',
-        cmargins:'0 0 0 0',
-        items:[toolbar]
-    });
+    this.centerPanel = Ext.create("Ext.Panel", {
+        cls: 'masterPanel',
 
-    this.EastPanel = Ext.create("Ext.Panel", {
-        region:'east',
-        hidden:true
+        id: 'erp_app_viewport_center',
+        style: {
+            marginRight: '20px',
+            borderBottomLeftRadius: '5px',
+            borderBottomRightRadius: '5px'
+        },
+        region: 'center',
+        layout: 'card',
+        activeItem: 0,
+        items: []
     });
 
-    var southToolbar = Ext.create("Ext.toolbar.Toolbar", {
-        items:[
+    this.bottomBar = Ext.create("Ext.toolbar.Toolbar", {
+        ui: 'cleantoolbar-dark',
+        dock: 'bottom',
+        height: 50,
+        style: {
+            paddingLeft: '22px',
+            paddingRight: '15px'
+        },
+        items: [
             "->",
             {
-                xtype:"trayclock"
+                ui: 'cleanbutton',
+                xtype: "trayclock"
             }
         ]
     });
 
-    this.SouthToolBar = southToolbar;
+    this.addApplication = function (config) {
+        var menuItems = [],
+            cardHolderId = 'cardHolder' + '_' + config.id;
 
-    this.SouthPanel = Ext.create("Ext.Panel", {
-        region:'south',
-        height:29,
-        layout:'anchor',
-        margins:'0 0 0 0',
-        cmargins:'0 0 0 0',
-        items:[
-            southToolbar
-        ]
-    });
+        Ext.each(config.menuItems, function (menuItem) {
+            menuItems.push({
+                    xtype: 'image',
+                    style: {
+                        cursor: 'pointer'
+                    },
+                    filtersPanelId: 'customerFilters',
+                    src: menuItem.imgSrc,
+                    height: 50,
+                    width: 50,
+                    cls: 'shortcut-image-button',
+                    listeners: {
+                        render: function (component) {
+                            component.getEl().on('click', function (e) {
+                                var masterPanel = Ext.getCmp(config.id),
+                                    tab = masterPanel.down('#' + menuItem.tabItemId);
+
+                                masterPanel.setActiveTab(tab);
+                            }, component);
+                        }
+                    }
+                },
+                {
+                    html: menuItem.title,
+                    style: {
+                        cursor: 'pointer'
+                    }
+                });
+        });
+
+        var menuPanel = {
+            xtype: 'panel',
+            title: config.title,
+            layout: {
+                type: "vbox",
+                align: "center"
+            },
+            id: cardHolderId,
+            listeners: {
+                render: function (c) {
+                    /*
+                     *  We want a listener on each DOM element within this menu to ensure the center panel is set
+                     *  properly when they are clicked. This is because this custom panel does not use the default
+                     *  menu tree panel type, and hence does not inherit the switching behavior automatically.
+                     */
+                    c.items.each(function (item) {
+                        // Wait until each item is rendered to add the click listener, as the panel usually renders before the items within the panel
+                        item.on('render', function () {
+                            this.getEl().on('click', function () {
+                                Compass.ErpApp.Organizer.Layout.setActiveCenterItem(config.id);
+                            });
+                        });
+                    });
+                }
+            },
+            items: menuItems
+        };
 
-    this.addApplication = function (menuPanel, components) {
         accordionMenuItems.push(menuPanel);
-        for (var i = 0; i < components.length; i++) {
-            this.CenterPanel.add(components[i]);
-        }
+
+        //Create the main tab panel which will house instances of the main Task Types
+        var masterPanel = Ext.widget('applicationcontainer', {
+            id: config.id,
+            itemId: config.id,
+            //These tasks we always want open
+            items: config.tabs
+        });
+
+        this.centerPanel.add(masterPanel);
     };
 
     this.setup = function () {
-        this.WestPanel = {
-            region:'west',
-            margins:'0 0 0 0',
-            cmargins:'0 0 0 0',
-            width:200,
-            split:true,
-            collapsible:true,
-            layout:'accordion',
-            items:accordionMenuItems
+        this.westPanel = {
+            id: 'erp_app_viewport_west',
+            style: {
+                marginRight: '10px',
+                marginLeft: '20px',
+                borderRadius: '5px'
+            },
+            region: 'west',
+            width: 200,
+            split: true,
+            layout: 'accordion',
+            items: accordionMenuItems
         };
 
         this.viewPort = Ext.create('Ext.container.Viewport', {
-            layout:'border',
-            border:false,
-            items:[
-                this.NorthPanel,
-                this.WestPanel,
-                this.CenterPanel,
-                this.EastPanel,
-                this.SouthPanel
+            border: false,
+            layout: 'fit',
+            items: [
+                {
+                    xtype: 'panel',
+                    border: false,
+                    layout: 'border',
+                    dockedItems: [
+                        this.toolBar,
+                        this.bottomBar
+                    ],
+                    items: [
+                        this.westPanel,
+                        this.centerPanel,
+                        this.eastPanel
+                    ]
+                }
             ]
         });
+        this.viewPort.down('#organizerWelcomeMsg').setText('Welcome: ' + currentUser.description);
     };
 };
 
-Compass.ErpApp.Organizer.Layout.setActiveCenterItem = function (id, loadRemoteData) {
-    var comp = Ext.ComponentMgr.get('erp_app_viewport_center').query('#' + id).first();
-    Ext.ComponentMgr.get('erp_app_viewport_center').layout.setActiveItem(comp);
+Compass.ErpApp.Organizer.Layout.setActiveCenterItem = function (panel_id, menu_id, loadRemoteData) {
+    // set panel as active
+    var panel = Ext.getCmp('erp_app_viewport_center').down('#' + panel_id);
+    if (panel)
+        Ext.getCmp('erp_app_viewport_center').layout.setActiveItem(panel);
+
+    var menu = Ext.getCmp('erp_app_viewport_west').down('#' + menu_id);
+    if (menu)
+        menu.expand();
 
     if (loadRemoteData === undefined || loadRemoteData) {
-        var hasLoad = ( (typeof comp.loadRemoteData) != 'undefined' );
+        var hasLoad = ( (typeof panel.loadRemoteData) != 'undefined' );
         if (hasLoad) {
-            comp.loadRemoteData();
+            panel.loadRemoteData();
         }
     }
-
 };
 
 

data/public/javascripts/erp_app/organizer/preference_window.js

@@ -1,91 +1,102 @@
-Ext.define("Compass.ErpApp.Organizer.PreferencesWindow",{
-    extend:"Ext.window.Window",
-    alias:"widget.organizer_preferenceswindow",
-    
-    setup:function(){
-        this.form.setup();
+Ext.define("Compass.ErpApp.Organizer.PreferencesWindow", {
+    extend: "Ext.window.Window",
+    alias: "widget.organizer_preferenceswindow",
+    title: 'Preferences',
+    height: 450,
+    width: 500,
+    layout: 'fit',
+
+    setup: function () {
+        this.organizerPreferenceForm.setup();
     },
 
-    buildPreferenceForm: function(form, preferenceTypes){
+    buildPreferenceForm: function (form, preferenceTypes) {
         var self = this;
         form.removeAll(true);
 
-        Ext.each(preferenceTypes, function(preferenceType){
-            var store = []
-            Ext.each(preferenceType.preference_options,function(option){
-                store.push([option.value,option.description])
+        Ext.each(preferenceTypes, function (preferenceType) {
+            var store = [];
+            Ext.each(preferenceType.preference_options, function (option) {
+                store.push([option.value, option.description])
             });
 
-            if(preferenceType.internal_identifier == 'desktop_background')
-            {
+            if (preferenceType.internal_identifier == 'desktop_background') {
                 form.add({
-                    xtype:'combo',
-                    fieldLabel:preferenceType.description,
-                    editable:false,
-                    forceSelection:true,
-                    id:preferenceType.internal_identifier + '_id',
-                    width:150,
+                    xtype: 'combo',
+                    fieldLabel: preferenceType.description,
+                    editable: false,
+                    forceSelection: true,
+                    id: preferenceType.internal_identifier + '_id',
+                    width: 150,
                     triggerAction: 'all',
-                    store:store,
-                    name:preferenceType.internal_identifier,
-                    listeners:{
-                        scope:self,
-                        'select':function(combo){
+                    store: store,
+                    name: preferenceType.internal_identifier,
+                    listeners: {
+                        scope: self,
+                        'select': function (combo) {
                             self.wallpaperImageChange(combo.getValue());
                         }
                     }
                 });
             }
-            else
-            {
+            else {
                 form.add({
-                    xtype:'combo',
-                    editable:false,
-                    forceSelection:true,
-                    id:preferenceType.internal_identifier + '_id',
-                    fieldLabel:preferenceType.description,
-                    name:preferenceType.internal_identifier,
-                    valueField:'field1',
-                    width:150,
+                    xtype: 'combo',
+                    editable: false,
+                    forceSelection: true,
+                    id: preferenceType.internal_identifier + '_id',
+                    fieldLabel: preferenceType.description,
+                    name: preferenceType.internal_identifier,
+                    valueField: 'field1',
+                    width: 150,
                     triggerAction: 'all',
-                    store:store
+                    store: store
                 });
             }
 
         });
     },
 
-    constructor : function(config) {
-        this.form = Ext.create('Compass.ErpApp.Shared.PreferenceForm',{
-            url:'/erp_app/organizer/update_preferences',
-            setupPreferencesUrl:'/erp_app/organizer/setup_preferences',
-            loadPreferencesUrl:'/erp_app/organizer/get_preferences',
-            width:350,
-            defaults:{
-                width:150
+    initComponent: function () {
+        var me = this;
+
+        me.organizerPreferenceForm = Ext.create('Compass.ErpApp.Shared.Preferences.Form', {
+            title: 'Preferences',
+            url: '/erp_app/organizer/update_preferences',
+            setupPreferencesUrl: '/erp_app/organizer/setup_preferences',
+            loadPreferencesUrl: '/erp_app/organizer/get_preferences',
+            defaults: {
+                width: 150
             },
-            listeners:{
-                'beforeAddItemsToForm':function(form, preferenceTypes){
+            listeners: {
+                'beforeAddItemsToForm': function (form, preferenceTypes) {
                     return true;
                 },
-                'beforeSetPreferences':function(form,preferences){
+                'beforeSetPreferences': function (form, preferences) {
                     //self.setPreferences(preferences);
                 },
-                'afterUpdate':function(form,preferences){
+                'afterUpdate': function (form, preferences) {
                     Compass.ErpApp.Utility.promptReload();
                     return false;
                 }
             }
         });
 
-        config = Ext.apply({
-            title:'Preferences',
-            height:150,
-            width:300,
-            items:[this.form],
-            layout:'fit'
-        }, config);
+        me.tabPanel = Ext.create('Ext.tab.Panel', {
+            items: [
+                this.organizerPreferenceForm,
+                {
+                    xtype: 'sharedpreferencesapplicationmanagementpanel',
+                    updatePreferencesUrl: '/erp_app/organizer/application_management/update',
+                    setupPreferencesUrl: '/erp_app/organizer/application_management/setup',
+                    loadPreferencesUrl: '/erp_app/organizer/application_management/preferences',
+                    applicationsUrl: '/erp_app/organizer/application_management/current_user_applications'
+                }
+            ]
+        });
+
+        me.items = [this.tabPanel];
 
-        this.callParent([config]);
+        this.callParent();
     }
 });

data/public/javascripts/erp_app/shared/MoneyField.js

@@ -0,0 +1,119 @@
+/*
+ * GNU General Public License Usage
+ * This file may be used under the terms of the GNU General Public License version 3.0 as published by the Free Software Foundation and appearing in the file LICENSE included in the packaging of this file.  Please review the following information to ensure the GNU General Public License version 3.0 requirements will be met: http://www.gnu.org/copyleft/gpl.html.
+ *
+ * http://www.gnu.org/licenses/lgpl.html
+ *
+ * @description: This class provide aditional format to numbers by extending Ext.form.field.Number
+ *
+ * @author: Greivin Britton
+ * @email: brittongr@gmail.com
+ * @version: 2 compatible with ExtJS 4
+ */
+Ext.define('Ext.ux.form.MoneyField',
+    {
+        extend: 'Ext.form.field.Number',//Extending the NumberField
+        alias: 'widget.moneyfield',//Defining the xtype,
+        currencySymbol: '$',
+        useThousandSeparator: true,
+        thousandSeparator: ',',
+        alwaysDisplayDecimals: false,
+        initComponent: function () {
+            if (this.useThousandSeparator && this.decimalSeparator == ',' && this.thousandSeparator == ',')
+                this.thousandSeparator = '.';
+            else if (this.allowDecimals && this.thousandSeparator == '.' && this.decimalSeparator == '.')
+                this.decimalSeparator = ',';
+
+            this.callParent(arguments);
+        },
+        setValue: function (value) {
+            this.superclass.setValue.call(this, value != null ? value.toString().replace('.', this.decimalSeparator) : value);
+
+            this.setRawValue(this.getFormattedValue(this.getValue()));
+        },
+        getFormattedValue: function (value) {
+            if (Ext.isEmpty(value) || !this.hasFormat())
+                return value;
+            else {
+                var neg = null;
+
+                value = (neg = value < 0) ? value * -1 : value;
+                value = this.allowDecimals && this.alwaysDisplayDecimals ? value.toFixed(this.decimalPrecision) : value;
+
+                if (this.useThousandSeparator) {
+                    if (this.useThousandSeparator && Ext.isEmpty(this.thousandSeparator))
+                        throw ('NumberFormatException: invalid thousandSeparator, property must has a valid character.');
+
+                    if (this.thousandSeparator == this.decimalSeparator)
+                        throw ('NumberFormatException: invalid thousandSeparator, thousand separator must be different from decimalSeparator.');
+
+                    value = value.toString();
+
+                    var ps = value.split('.');
+                    ps[1] = ps[1] ? ps[1] : null;
+
+                    var whole = ps[0];
+
+                    var r = /(\d+)(\d{3})/;
+
+                    var ts = this.thousandSeparator;
+
+                    while (r.test(whole))
+                        whole = whole.replace(r, '$1' + ts + '$2');
+
+                    value = whole + (ps[1] ? this.decimalSeparator + ps[1] : '');
+                }
+
+                return Ext.String.format('{0}{1}{2}', (neg ? '-' : ''), (Ext.isEmpty(this.currencySymbol) ? '' : this.currencySymbol + ' '), value);
+            }
+        },
+        /**
+         * overrides parseValue to remove the format applied by this class
+         */
+        parseValue: function (value) {
+            //Replace the currency symbol and thousand separator
+            return this.superclass.parseValue.call(this, this.removeFormat(value));
+        },
+
+        getSubmitValue: function() {
+            var me = this,
+                value = me.callParent();
+
+            return this.removeFormat(value);
+        },
+
+        /**
+         * Remove only the format added by this class to let the superclass validate with it's rules.
+         * @param {Object} value
+         */
+        removeFormat: function (value) {
+            if (Ext.isEmpty(value) || !this.hasFormat())
+                return value;
+            else {
+                value = value.toString().replace(this.currencySymbol + ' ', '');
+
+                value = this.useThousandSeparator ? value.replace(new RegExp('[' + this.thousandSeparator + ']', 'g'), '') : value;
+
+                return value;
+            }
+        },
+        /**
+         * Remove the format before validating the the value.
+         * @param {Number} value
+         */
+        getErrors: function (value) {
+            return this.superclass.getErrors.call(this, this.removeFormat(value));
+        },
+        hasFormat: function () {
+            return this.decimalSeparator != '.' || (this.useThousandSeparator == true && this.getRawValue() != null) || !Ext.isEmpty(this.currencySymbol) || this.alwaysDisplayDecimals;
+        },
+        /**
+         * Display the numeric value with the fixed decimal precision and without the format using the setRawValue, don't need to do a setValue because we don't want a double
+         * formatting and process of the value because beforeBlur perform a getRawValue and then a setValue.
+         */
+        onFocus: function () {
+            this.setRawValue(this.removeFormat(this.getRawValue()));
+
+            this.callParent(arguments);
+        }
+    });