erp_app 4.0.0 → 4.2.0

data/app/assets/javascripts/erp_app/shared/crm/PartyDetailsPanel.js

@@ -0,0 +1,344 @@
+Ext.define("Compass.ErpApp.Shared.Crm.PartyDetailsPanel", {
+    extend: "Ext.panel.Panel",
+    alias: 'widget.crmpartydetailspanel',
+    cls: 'crmpartydetailspanel',
+    layout: 'border',
+    items: [],
+    contactWidgetXtypes: [
+        'phonenumbergrid',
+        'emailaddressgrid',
+        'postaladdressgrid'
+    ],
+
+    /**
+     * @cfg {Array} additionalTabs
+     * Array of additional tab panels to add.
+     */
+    additionalTabs: [],
+
+    /**
+     * @cfg {Int} partyId
+     * Id of party being edited.
+     */
+    partyId: null,
+
+    /**
+     * @cfg {Array | Object} partyRelationships
+     * Party Relationships to include in the details of this party, is an config object with the following options
+     *
+     * @param {String} title
+     * title of tab
+     *
+     * @param {String} relationshipType
+     * relationship type internal_identifier
+     *
+     * @param {String} relationshipDirection {from | to}
+     * if we are getting the to or from side of relationships
+     *
+     * @param {String} toRoleType
+     * RoleType internal_identifier for to side
+     *
+     * @param {String} fromRoleType
+     * RoleType internal_identifier for from side
+     *
+     * @param {String} allowedPartyType
+     * Party type that can be created {Both | Individual | Organization}.
+     *
+     * @param {Array | Object} partyRelationships
+     *
+     * @example
+     * {
+            title: 'Employees',
+            relationshipType: 'employee_customer',
+            toRoleType: 'customer',
+            fromRoleType: 'employee',
+            allowedPartyType: 'Individual',
+            partyRelationships: [
+                {
+                    title: 'Family',
+                    relationshipType: 'employee_family_member',
+                    toRoleType: 'employee',
+                    fromRoleType: 'family_member',
+                    allowedPartyType: 'Individual'
+                }
+            ]
+        }
+     */
+    partyRelationships: [],
+
+    /**
+     * @cfg {Array} contactPurposes
+     * Array of contactPurposes that can be added to a contact.
+     *
+     * @example
+     * {
+     *   fieldLabel: 'Default',
+     *   internalIdentifier: 'default'
+     * }
+     */
+    contactPurposes: [
+        {
+            fieldLabel: 'Default',
+            internalIdentifier: 'default'
+        }
+    ],
+
+    /**
+     * @cfg {String} contactPurposesTitle
+     * Title of contact purposes fieldset.
+     */
+    contactPurposesTitle: 'Contact Purpose',
+
+    initComponent: function () {
+        var me = this,
+            tabPanels = [];
+
+        me.addEvents(
+            /*
+             * @event contactcreated
+             * Fires when a contact is created
+             * @param {Compass.ErpApp.Shared.Crm.PartyDetailsPanel} this
+             * @param {String} ContactType {PhoneNumber, PostalAddress, EmailAddress}
+             * @param {Record} record
+             */
+            'contactcreated',
+            /*
+             * @event contactupdated
+             * Fires when a contact is updated
+             * @param {Compass.ErpApp.Shared.Crm.PartyDetailsPanel} this
+             * @param {String} ContactType {PhoneNumber, PostalAddress, EmailAddress}
+             * @param {Record} record
+             */
+            'contactupdated',
+            /*
+             * @event contactdestroyed
+             * Fires when a contact is destroyed
+             * @param {Compass.ErpApp.Shared.Crm.PartyDetailsPanel} this
+             * @param {String} ContactType {PhoneNumber, PostalAddress, EmailAddress}
+             * @param {Record} record
+             */
+            'contactdestroyed'
+        );
+
+        contactsPanel = Ext.create('widget.panel', {
+            title: 'Contacts',
+            layout: 'border',
+            itemId: 'contactsContainer',
+            items: [
+                {
+                    xtype: 'panel',
+                    style:{
+                        borderRight: 'solid 2px black'
+                    },
+                    header: false,
+                    collapsible: true,
+                    region: 'west',
+                    width: 155,
+                    items: Ext.create('widget.dataview', {
+                        autoScroll: true,
+                        store: Ext.create('Ext.data.SimpleStore', {
+                            fields: ['title', 'xtype', 'iconSrc'],
+                            data: [
+                                ['Phone Numbers', 'phonenumbergrid', '/assets/icons/phone/phone_16x16.png'],
+                                ['Email Addresses', 'emailaddressgrid', '/assets/icons/mail/mail_16x16.png'],
+                                ['Postal Addressses', 'postaladdressgrid', '/assets/icons/home/home_16x16.png']
+                            ]
+                        }),
+                        selModel: {
+                            mode: 'SINGLE',
+                            listeners: {
+                                selectionchange: function (dataView, selection) {
+                                    if (selection) {
+                                        selection = selection.first();
+
+                                        var selectedContactContainer = me.down('#contactsContainer').down('#selectedContactContainer'),
+                                            selectedContact = selectedContactContainer.down(selection.data.xtype);
+
+                                        selectedContactContainer.layout.setActiveItem(selectedContact);
+                                    }
+                                }
+                            }
+                        },
+                        listeners: {
+                            viewready: function (dataView) {
+                                dataView.getSelectionModel().select(dataView.store.first());
+                            }
+                        },
+                        trackOver: true,
+                        cls: 'crm-contacts-list',
+                        itemSelector: '.crm-contacts-list-item',
+                        overItemCls: 'crm-contacts-list-item-hover',
+                        tpl: '<tpl for="."><img class="crm-contacts-list-icon" src="{iconSrc}" /><div class="crm-contacts-list-item">{title}</div></tpl>'
+                    })
+                },
+                {
+                    xtype: 'panel',
+                    flex: 1,
+                    itemId: 'selectedContactContainer',
+                    cls: 'selectedContactContainer',
+                    region: 'center',
+                    layout: 'card',
+                    items: [
+                        {
+                            xtype: 'phonenumbergrid',
+                            contactPurposesTitle: 'Use Phone Number for:',
+                            contactPurposes: me.contactPurposes,
+                            partyId: me.partyId,
+                            listeners: {
+                                contactcreated: {fn: me.contactCreated, scope: me},
+                                contactupdated: {fn: me.contactUpdated, scope: me},
+                                contactdestroyed: {fn: me.contactDestroyed, scope: me}
+                            }
+                        },
+                        {
+                            xtype: 'emailaddressgrid',
+                            contactPurposesTitle: 'Use Email for:',
+                            contactPurposes: me.contactPurposes,
+                            partyId: me.partyId,
+                            listeners: {
+                                contactcreated: {fn: me.contactCreated, scope: me},
+                                contactupdated: {fn: me.contactUpdated, scope: me},
+                                contactdestroyed: {fn: me.contactDestroyed, scope: me}
+                            }
+                        },
+                        {
+                            xtype: 'postaladdressgrid',
+                            contactPurposesTitle: 'Use Address for:',
+                            contactPurposes: me.contactPurposes,
+                            partyId: me.partyId,
+                            listeners: {
+                                contactcreated: {fn: me.contactCreated, scope: me},
+                                contactupdated: {fn: me.contactUpdated, scope: me},
+                                contactdestroyed: {fn: me.contactDestroyed, scope: me}
+                            }
+                        }
+                    ]
+                }
+            ]
+        });
+
+        tabPanels.push(contactsPanel);
+        tabPanels.push({xtype: 'shared_notesgrid', recordType: 'Party', recordId: me.partyId});
+
+        me.partyDetailsPanel = Ext.create('widget.panel', {
+            itemId: 'partyDetails',
+            html: 'Party Details',
+            border: false,
+            frame: false,
+            region: 'north',
+            bodyStyle: 'border-bottom-left-radius: 5px; border-bottom-right-radius: 5px;',
+            height: 200,
+            header: false,
+            split: true,
+            collapsible: true,
+            autoScroll: true
+        });
+
+        Ext.each(me.partyRelationships, function (partyRelationship) {
+            tabPanels.push({
+                xtype: 'crmpartygrid',
+                title: partyRelationship.title,
+                contactPurposes: partyRelationship.contactPurposes || [{fieldLabel: 'Default',internalIdentifier: 'default'}],
+                formFields: partyRelationship.formFields || 'none',
+                securityRoles: partyRelationship.securityRoles || [],
+                allowedPartyType: partyRelationship.allowedPartyType || 'Both',
+                addBtnDescription: partyRelationship.addBtnDescription || ('Add ' + Ext.String.capitalize(partyRelationship.fromRoleType)),
+                searchDescription: 'Search ' + partyRelationship.title,
+                toRole: partyRelationship.toRoleType,
+                toPartyId: me.partyId,
+                relationshipTypeToCreate: partyRelationship.relationshipType,
+                partyRole: partyRelationship.fromRoleType,
+                canAddParty: partyRelationship.canAddParty || true,
+                canEditParty: partyRelationship.canEditParty || true,
+                canDeleteParty: partyRelationship.canDeleteParty || true,
+                partyRelationships: partyRelationship.partyRelationships || [],
+                listeners: {
+                    partycreated: function (comp, partyId) {
+                        this.store.load();
+                    },
+                    partyupdated: function (comp, partyId) {
+                        this.store.load();
+                    }
+                }
+            });
+        });
+
+        Ext.each(me.additionalTabs, function (tab) {
+
+            //
+            // Pass party id to each additional tab...
+            //
+            Ext.apply(tab, {partyId: me.partyId});
+            tabPanels.push(tab);
+        });
+
+        me.partyDetailsTabPanel = Ext.create('widget.tabpanel', {
+            //flex: 1,
+            //height: 400,
+            region: 'center',
+            items: tabPanels
+        });
+
+        me.items = [me.partyDetailsPanel, me.partyDetailsTabPanel];
+
+        this.callParent(arguments);
+    },
+
+    contactCreated: function (comp, contactType, record) {
+        var me = this;
+
+        me.fireEvent('contactcreated', me, contactType, record);
+
+        me.loadDetails();
+    },
+
+    contactUpdated: function (comp, contactType, record) {
+        var me = this;
+
+        me.fireEvent('contactupdated', me, contactType, record);
+
+        me.loadDetails();
+    },
+
+    contactDestroyed: function (comp, contactType, record) {
+        var me = this;
+
+        me.fireEvent('contactdestroyed', me, contactType, record);
+
+        me.loadDetails();
+    },
+
+    loadDetails: function () {
+        var me = this,
+            partyDetails = me.down('#partyDetails');
+
+        var myMask = new Ext.LoadMask(partyDetails, {msg: "Please wait..."});
+        myMask.show();
+
+        // Load html of party
+        Ext.Ajax.request({
+            url: '/erp_app/organizer/crm/parties/' + me.partyId + '/details',
+            disableCaching: false,
+            method: 'GET',
+            success: function (response) {
+                myMask.hide();
+                partyDetails.update(response.responseText);
+            }
+        });
+    },
+
+    loadParty: function () {
+        var me = this,
+            tabPanel = me.down('tabpanel');
+
+        me.loadDetails();
+
+        // Load contact stores
+        for (i = 0; i < me.contactWidgetXtypes.length; i += 1) {
+            var widget = tabPanel.down(me.contactWidgetXtypes[i]);
+            if (!Ext.isEmpty(widget)) {
+                widget.store.load();
+            }
+        }
+    }
+});

data/app/assets/javascripts/erp_app/shared/crm/PartyForm.js

@@ -0,0 +1,321 @@
+Ext.define("Compass.ErpApp.Shared.Crm.PartyForm", {
+    extend: "Ext.form.Panel",
+    alias: 'widget.crmpartyform',
+    buttonAlign: 'left',
+    frame: false,
+    border: false,
+
+    /**
+     * @cfg {Int} partyId
+     * Id of party being edited.
+     */
+    partyId: null,
+
+    /**
+     * @cfg {String} partyType
+     * Type of party (Individual, Organization).
+     */
+    partyType: null,
+
+    /**
+     * @cfg {String} allowedPartyType
+     * Party type that can be created {Both | Individual | Organization}.
+     */
+    allowedPartyType: 'Both',
+
+    /**
+     * @cfg {String | Array} formFields
+     * Optional Fields to show in edit and create forms, if set to 'All' all fields will be shown.
+     * if set to 'None' no fields are shown.
+     * If an array is passed only field names within array are shown
+     * field names are:
+     * - organizationTaxId
+     * - individualTitle
+     * - individualMiddleName
+     * - individualSuffix
+     * - individualNickname
+     * - individualPassportNumber
+     * - individualPassportExpirationDate
+     * - individualDateOfBirth
+     * - individualTotalYrsWorkExp
+     * - individualMaritalStatus
+     * - individualSocialSecurityNumber
+     */
+    formFields: 'None',
+
+    initComponent: function () {
+        var me = this,
+            items = [],
+            partyTypeFieldContainer = null;
+
+        var partyType = (me.partyType || me.allowedPartyType);
+
+        if (partyType !== 'Both' && partyType !== 'Individual' && partyType !== 'Organization') {
+            Ext.Msg.alert('Error', 'Invalid Party Type');
+            partyType = 'Both';
+        }
+
+        if (partyType === 'Both') {
+            partyTypeFieldContainer = {
+                xtype: 'fieldcontainer',
+                padding: 10,
+                fieldLabel: false,
+                defaultType: 'radiofield',
+                defaults: {
+                    width: 100,
+                    height: 50
+                },
+                layout: {
+                    type: "hbox",
+                    pack: "center",
+                    align: "middle"
+                },
+                items: []
+            };
+
+            partyTypeFieldContainer.items.push({
+                boxLabel: '<div style="text-align: center;"><img src="/assets/erp_app/organizer/applications/crm/person.png"><br/>Individual</div>',
+                itemId: 'individualRadio',
+                checked: true,
+                name: 'business_party_type',
+                inputValue: 'Individual',
+                listeners: {
+                    change: function (comp, newValue) {
+                        if (newValue)
+                            comp.up('crmpartyform').updateForm('Individual');
+                    }
+                }
+            });
+
+            partyTypeFieldContainer.items.push({
+                boxLabel: '<div style="text-align: center;"><img src="/assets/erp_app/organizer/applications/crm/business.png"><br/>Business</div>',
+                itemId: 'organizationRadio',
+                name: 'business_party_type',
+                inputValue: 'Organization',
+                listeners: {
+                    change: function (comp, newValue) {
+                        if (newValue)
+                            comp.up('crmpartyform').updateForm('Organization');
+                    }
+                }
+            });
+
+            items.push(partyTypeFieldContainer);
+        }
+        else {
+            items.push({
+                xtype: 'hidden',
+                name: 'business_party_type',
+                value: partyType
+            });
+        }
+
+        this.items = items.concat([
+            {
+                xtype: 'fieldset',
+                title: 'Business Details',
+                hidden: true,
+                itemId: 'organizationDetails',
+                defaults: {
+                    xtype: 'textfield',
+                    width: 350
+                },
+                items: [
+                    {
+                        itemId: 'organizationDescription',
+                        fieldLabel: 'Description',
+                        allowBlank: true,
+                        name: 'description'
+                    },
+                    {
+                        itemId: 'organizationTaxId',
+                        fieldLabel: 'Tax ID',
+                        allowBlank: true,
+                        hidden: me.hideField('organizationTaxId'),
+                        name: 'tax_id_number'
+                    }
+                ]
+            },
+            {
+                xtype: 'fieldset',
+                itemId: 'individualDetails',
+                title: 'Individual Details',
+                defaults: {
+                    xtype: 'textfield',
+                    width: 350
+                },
+                items: [
+                    {
+                        itemId: 'individualTitle',
+                        fieldLabel: 'Title',
+                        allowBlank: true,
+                        hidden: me.hideField('individualTitle'),
+                        name: 'current_personal_title'
+                    },
+                    {
+                        itemId: 'firstName',
+                        fieldLabel: 'First Name',
+                        allowBlank: false,
+                        name: 'current_first_name'
+                    },
+                    {
+                        fieldLabel: 'Middle Name',
+                        allowBlank: true,
+                        hidden: me.hideField('individualMiddleName'),
+                        name: 'current_middle_name'
+                    },
+                    {
+                        itemId: 'lastName',
+                        fieldLabel: 'Last Name',
+                        allowBlank: false,
+                        name: 'current_last_name'
+                    },
+                    {
+                        fieldLabel: 'Suffix',
+                        allowBlank: true,
+                        hidden: me.hideField('individualSuffix'),
+                        name: 'current_suffix'
+                    },
+                    {
+                        fieldLabel: 'Nickname',
+                        allowBlank: true,
+                        hidden: me.hideField('individualNickname'),
+                        name: 'current_nickname'
+                    },
+                    {
+                        fieldLabel: 'Passport Number',
+                        allowBlank: true,
+                        hidden: me.hideField('individualPassportNumber'),
+                        name: 'current_passport_number'
+                    },
+                    {
+                        fieldLabel: 'Passport Expiration Date',
+                        allowBlank: true,
+                        hidden: me.hideField('individualPassportExpirationDate'),
+                        name: 'current_passport_expire_date'
+                    },
+                    {
+                        fieldLabel: 'DOB',
+                        itemId: 'dob',
+                        allowBlank: true,
+                        hidden: me.hideField('individualDateOfBirth'),
+                        name: 'birth_date'
+                    },
+                    {
+                        xtype: 'radiogroup',
+                        allowBlank: false,
+                        itemId: 'statusContainer',
+                        fieldLabel: 'Gender',
+                        defaultType: 'radiofield',
+                        columns: [100, 100],
+                        items: [
+                            {
+                                boxLabel: 'Male',
+                                name: 'gender',
+                                inputValue: 'm',
+                                checked: true
+                            },
+                            {
+                                boxLabel: 'Female',
+                                name: 'gender',
+                                inputValue: 'f'
+                            }
+                        ]
+                    },
+                    {
+                        fieldLabel: 'Total Yrs Work Exp',
+                        allowBlank: true,
+                        hidden: me.hideField('individualTotalYrsWorkExp'),
+                        name: 'total_years_work_experience'
+                    },
+                    {
+                        fieldLabel: 'Marital Status',
+                        allowBlank: true,
+                        hidden: me.hideField('individualMaritalStatus'),
+                        name: 'marital_status'
+                    },
+                    {
+                        fieldLabel: 'Social Security Number',
+                        allowBlank: true,
+                        hidden: me.hideField('individualSocialSecurityNumber'),
+                        name: 'social_security_number'
+                    }
+                ]
+            },
+            {
+                xtype: 'hidden',
+                itemId: 'partyId',
+                name: 'party_id'
+            }
+        ]);
+
+        this.callParent(arguments);
+
+        if (partyType === 'Organization') {
+
+            organizationDetails = this.down('#organizationDetails');
+            organizationDetails.show();
+            organizationDetails.down('#organizationDescription').allowBlank = false;
+
+            individualDetails = me.down('#individualDetails');
+            individualDetails.down('#firstName').allowBlank = true;
+            individualDetails.down('#lastName').allowBlank = true;
+
+            individualDetails.hide();
+        }
+    },
+
+    updateForm: function (partyType) {
+        var me = this,
+            organizationDetails = me.down('#organizationDetails'),
+            individualDetails = me.down('#individualDetails');
+
+        if (partyType === 'Individual') {
+            organizationDetails.hide();
+            individualDetails.show();
+
+            individualDetails.down('#firstName').allowBlank = false;
+            individualDetails.down('#lastName').allowBlank = false;
+
+            organizationDetails.down('#organizationDescription').allowBlank = true;
+        }
+        else {
+            individualDetails.hide();
+            organizationDetails.show();
+
+            individualDetails.down('#firstName').allowBlank = true;
+            individualDetails.down('#lastName').allowBlank = true;
+
+            organizationDetails.down('#organizationDescription').allowBlank = false;
+        }
+
+        this.fireEvent('partytypechange', this, partyType);
+    },
+
+    loadParty: function (partyId) {
+        var me = this;
+
+        me.partyId = partyId;
+
+        Ext.Ajax.request({
+            method: 'GET',
+            url: '/erp_app/organizer/crm/parties/' + me.partyId,
+            success: function (response) {
+                responseObj = Ext.JSON.decode(response.responseText);
+
+                if (responseObj.success) {
+                    var basicForm = me.getForm();
+                    basicForm.setValues(responseObj.data);
+                    me.down('#partyId').setValue(me.partyId);
+                }
+            },
+            failure: function (response) {
+                Ext.Msg.alert("Error", "Error loading data.");
+            }
+        });
+    },
+
+    hideField: function(fieldName){
+        return (this.formFields == 'None' || (this.formFields !== 'All' && !Ext.Array.contains(this.initialConfig.formFields, fieldName)))
+    }
+});