-
-
Save caleywoods/8ea2dfd5aa9e199101ab to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Ext.require([ | |
| 'Ext.form.*', | |
| 'Ext.grid.*', | |
| 'Ext.data.*', | |
| 'Ext.tip.QuickTipManager', | |
| 'Ext.window.MessageBox' | |
| ]); | |
| /* | |
| Used in the lineItemModel to convert the DB values | |
| for concessionable, commissionable, and taxable | |
| from the string values 'Y', 'N' to actual | |
| boolean true and false values. | |
| */ | |
| function checkboxConvert(v, record) { | |
| if (v === 'Y') { | |
| return true; | |
| } else { | |
| return false; | |
| } | |
| } | |
| Ext.define('lineItemModel',{ | |
| extend:'Ext.data.Model', | |
| fields:[{ | |
| name: 'id', | |
| mapping: 'item_id', | |
| type: 'int', | |
| useNull: false}, | |
| 'item_display_number','item_name', | |
| 'year','base_price','max_price_per_unit','unit_price', | |
| {name: 'include_in_program',convert: checkboxConvert}, | |
| {name: 'commissionable',convert: checkboxConvert}, | |
| {name: 'concessionable',convert: checkboxConvert}, | |
| {name: 'taxable',convert: checkboxConvert}, | |
| {name: 'print_on_preliminary',convert: checkboxConvert}, | |
| {name: 'print_on_invoice',convert: checkboxConvert}, | |
| {name: 'print_units',convert: checkboxConvert}, | |
| 'debit_gl_id','created','created_by','last_updated','last_updated_by', | |
| 'line_item_notes','yearbook','commercial','donning','military','history', | |
| 'other','none', 'item_description', 'line_item_type' | |
| ], | |
| validations: [ | |
| {type: 'presence', field: 'item_name'}] | |
| }); | |
| var invoicer_lineItemYearStore = new Ext.data.Store({ | |
| fields: ['YEAR'], | |
| proxy: { | |
| type: 'ajax', | |
| url: '/invoicer/data/getlineitemyears', | |
| reader: { | |
| type: 'json' | |
| } | |
| } | |
| }); // end invoicer_lineItemYearStore | |
| var invoicer_lineItemTypeStore = Ext.create ('Ext.data.Store',{ | |
| fields: [{ | |
| name: 'id', | |
| mapping: 'line_item_type_id', | |
| type: 'int'}, | |
| 'line_item_type','active'], | |
| autoLoad:true, | |
| proxy: { | |
| type: 'ajax', | |
| url : '/invoicer/data/getlineitemtypes', | |
| reader: { | |
| type: 'json', | |
| root: 'results' | |
| } | |
| }, | |
| sorters:[{ | |
| property:'line_item_type_id', | |
| direction:'ASC' | |
| }] | |
| }); // end invoicer_lineItemTypeStore | |
| var invoicer_glStore = new Ext.data.Store({ | |
| fields: [ | |
| 'gl_id', 'segment1', 'segment2', 'segment3', 'segment4', | |
| 'segment5', 'segment6', 'description' | |
| ], | |
| proxy: { | |
| type: 'ajax', | |
| url: '/invoicer/data/getgl', | |
| reader: { | |
| type: 'json', | |
| root: 'results', | |
| totalProperty: 'totalCount' | |
| } | |
| } | |
| }); // end invoicer_glStore | |
| var invoicer_glStore2 = new Ext.data.Store({ | |
| fields: [ | |
| 'item_id', 'year', 'job_type', 'job_type_name', | |
| 'gl_id', 'segment1', 'segment2', 'segment3', | |
| 'segment4', 'segment5', 'segment6', 'display', 'gl_desc' | |
| ], | |
| proxy: { | |
| type: 'ajax', | |
| url: '/invoicer/data/getgl', | |
| reader: { | |
| type: 'json', | |
| root: 'results', | |
| totalProperty: 'totalCount' | |
| } | |
| }, | |
| filters:[{ | |
| property:'active', | |
| value:'1' | |
| }] | |
| }); // end invoicer_glStore | |
| /* | |
| Called when a user picks a year from the year drop down | |
| on the top dock of the grid. This filters the store to | |
| only populate with line items from that job year. | |
| */ | |
| function lineItemGridFilter( store ) { | |
| var data = Ext.getCmp('year').getValue(); | |
| store.remoteFilter = false; | |
| store.clearFilter(); | |
| if ( data ) { | |
| store.filter('year', data); | |
| } | |
| store.remoteFilter = true; | |
| store.removeAll(); | |
| store.load(); | |
| } | |
| /* | |
| Called when a user clicks a record in the grid. | |
| This sets the value of each combobox for the record. | |
| If we get 'None' as a GL Type from the database, we're | |
| disabling the other comboboxes. | |
| ***Cross Browser Warning!!!*** | |
| * | |
| * forEach used in this | |
| * function doesn't work | |
| * in IE. | |
| * | |
| ****************************** | |
| */ | |
| function lineItemGlFilter( store ) { | |
| var id = +Ext.getCmp('item_id').getValue(); | |
| store.remoteFilter = false; | |
| store.clearFilter(); | |
| if ( id ) { | |
| store.filter('item_id', id); | |
| store.sort('job_type_name', 'ASC'); | |
| } | |
| store.remoteFilter = true; | |
| store.removeAll(); | |
| store.load({ | |
| scope: this, | |
| callback: function ( records ) { | |
| var components = ['Commercial', 'Donning', 'History', | |
| 'Military', 'Other', 'Yearbook']; | |
| if ( records.length <= 1 ) { | |
| if ( records[0].data.job_type_name === 'None' ) { | |
| components.forEach(function ( comp ) { | |
| Ext.getCmp(comp).hide(); | |
| Ext.getCmp('None').show(); | |
| }); | |
| } | |
| } else { | |
| Ext.getCmp('None').hide(); | |
| } | |
| /* forEach(function(elementValue, elementIndex,traversedArray))*/ | |
| //https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/forEach | |
| components.forEach(function (comp, index) { | |
| //# of times following line has been used for debug: 4 | |
| //console.log('Component: ' + comp + ' | ' + 'Type: ' + records[index].data.job_type_name + ' Value: ' + records[index].data.display) | |
| Ext.getCmp(comp).setValue(records[index].data.display); | |
| }); | |
| } | |
| }); | |
| } | |
| var invoicer_lineItemStore = Ext.create('Ext.data.Store', { | |
| model: 'lineItemModel', | |
| autoLoad: false, | |
| autoSync: true, | |
| pageSize: 10, | |
| proxy: { | |
| type: 'ajax', | |
| api: { | |
| read: '/invoicer/data/getlineitems', | |
| create: '/invoicer/data/savelineitem', | |
| update: '/invoicer/data/savelineitem', | |
| destroy: '' | |
| }, | |
| reader: { | |
| type: 'json', | |
| successProperty: 'success', | |
| root: 'results', | |
| totalProperty: 'totalCount', | |
| messageProperty: 'message' | |
| }, | |
| writer: { | |
| type: 'json', | |
| writeAllFields: true, | |
| root: 'data' | |
| }, | |
| listeners: { | |
| exception: function (proxy, response, operation) { | |
| Ext.MessageBox.show({ | |
| title: 'REMOTE EXCEPTION', | |
| msg: operation.getError(), | |
| icon: Ext.MessageBox.ERROR, | |
| buttons: Ext.Msg.OK | |
| }); | |
| } | |
| } | |
| }, | |
| listeners: { | |
| write: function (proxy, operation) { | |
| if (operation.action === 'destroy') { | |
| invoicer_creditMemoReasonPanel.child('#form').setActiveRecord(null); | |
| } | |
| } | |
| }, | |
| sorters:[{ | |
| property:'item_id', | |
| direction:'ASC' | |
| }] | |
| }); | |
| // var store = invoicer_lineItemStore; | |
| // store.filter('item_id','472'); | |
| // store.remoteFilter = true; | |
| // store.removeAll(); | |
| // store.load(); | |
| Ext.define('Writer.Form', { | |
| extend: 'Ext.form.Panel', | |
| alias: 'widget.creditMemoReasonForm', | |
| requires: ['Ext.form.field.Text'], | |
| initComponent: function() { | |
| this.addEvents('create'); | |
| Ext.apply(this, { | |
| activeRecord: null, | |
| id: 'itemYear', | |
| frame: true, | |
| defaultType: 'textfield', | |
| bodyPadding: 5, | |
| fieldDefaults: { | |
| anchor: '100%', | |
| labelAlign: 'right' | |
| }, | |
| items: [{ | |
| xtype: 'hiddenfield', | |
| name: 'year', | |
| id: 'li_year', | |
| fieldLabel: 'Label', | |
| anchor: '100%' | |
| },{ | |
| xtype: 'hiddenfield', | |
| name: 'id', | |
| id: 'item_id', | |
| fieldLabel: 'Item ID', | |
| anchor: '100%' | |
| },{ | |
| xtype: 'fieldset', | |
| height: 32, | |
| layout: { | |
| align: 'stretch', | |
| type: 'hbox' | |
| }, | |
| anchor: '100%', | |
| items: [{ | |
| xtype: 'numberfield', | |
| padding: '5 0 0 0', | |
| //height: 25, | |
| width: 200, | |
| name: 'item_display_number', | |
| fieldLabel: 'Display Number', | |
| labelWidth: 100, | |
| flex: .5, | |
| allowBlank: false | |
| },{ | |
| xtype: 'textfield', | |
| padding: '2 0 0 0', | |
| height: 25, | |
| name: 'item_name', | |
| id: 'item_name', | |
| fieldLabel: 'Name', | |
| labelWidth: 60, | |
| width: 100, | |
| flex: 1, | |
| allowBlank: false | |
| },{ | |
| xtype: 'numberfield', | |
| padding: '5 0 0 0', | |
| width: 200, | |
| name: 'unit_price', | |
| fieldLabel: 'Unit Price', | |
| renderer: 'usMoney', | |
| flex: .5, | |
| allowBlank: false | |
| }] | |
| },{ | |
| xtype: 'fieldset', | |
| height: 77, | |
| layout: { | |
| align: 'stretch', | |
| type: 'hbox' | |
| }, | |
| anchor: '100%', | |
| items: [{ | |
| xtype: 'panel', | |
| cls: 'lulz', | |
| items: [{ | |
| xtype: 'checkboxgroup', | |
| width: 150, | |
| height: 75, | |
| layout: { | |
| align: 'stretch', | |
| type: 'vbox' | |
| }, | |
| flex: 1, | |
| items: [ | |
| { | |
| xtype: 'checkboxfield', | |
| name: 'commissionable', | |
| boxLabel: 'Commissionable', | |
| dataIndex: 'commissionable', | |
| inputValue:'Y', | |
| uncheckedValue:'N', | |
| flex: 1 | |
| },{ | |
| xtype: 'checkboxfield', | |
| name: 'concessionable', | |
| boxLabel: 'Concessionable', | |
| inputValue:'Y', | |
| uncheckedValue:'N', | |
| flex: 1 | |
| },{ | |
| xtype: 'checkboxfield', | |
| name: 'taxable', | |
| boxLabel: 'Taxable', | |
| inputValue:'Y', | |
| uncheckedValue:'N', | |
| flex: 1 | |
| } | |
| ] | |
| }] | |
| },{ | |
| xtype: 'panel', | |
| cls: 'lulz', | |
| items: [{ | |
| xtype: 'checkboxgroup', | |
| width: 150, | |
| height: 75, | |
| layout: { | |
| align: 'stretch', | |
| type: 'vbox' | |
| }, | |
| flex: 1, | |
| items: [ | |
| { | |
| xtype: 'checkboxfield', | |
| name: 'print_on_preliminary', | |
| boxLabel: 'Print On Prelim', | |
| inputValue: 'Y', | |
| uncheckedValue: 'N', | |
| flex: 1 | |
| },{ | |
| xtype: 'checkboxfield', | |
| name: 'print_on_invoice', | |
| boxLabel: 'Print On Invoice', | |
| inputValue: 'Y', | |
| uncheckedValue: 'N', | |
| flex: 1 | |
| },{ | |
| xtype: 'checkboxfield', | |
| name: 'print_units', | |
| boxLabel: 'Print Units', | |
| inputValue: 'Y', | |
| uncheckedValue: 'N', | |
| flex: 1 | |
| } | |
| ] | |
| }] | |
| },{ | |
| xtype: 'panel', | |
| cls: 'lulz', | |
| height: 150, | |
| width: 850, | |
| layout: { | |
| type: 'auto' | |
| }, | |
| items: [{ | |
| xtype: 'container', | |
| width: 850, | |
| height: 25, | |
| layout: { | |
| align: 'stretch', | |
| type: 'hbox' | |
| }, | |
| items: [{ | |
| xtype: 'combobox', | |
| name: 'debit_gl_id', | |
| fieldLabel: 'Debit GL ID', | |
| store: invoicer_glStore, | |
| displayField: 'description', | |
| valueField: 'gl_id', | |
| width: 450 | |
| },{ | |
| xtype: 'combobox', | |
| fieldLabel: 'Line Item Type', | |
| anchor: '100%', | |
| name: 'line_item_type', | |
| store: invoicer_lineItemTypeStore, | |
| displayField: 'line_item_type', | |
| valueField: 'id', | |
| width: 400 | |
| }] | |
| },{ | |
| xtype: 'container', | |
| width: 850, | |
| height: 50, | |
| items: [{ | |
| xtype: 'textareafield', | |
| name: 'item_description', | |
| width: 850, | |
| height: 50, | |
| fieldLabel: 'Description' | |
| } | |
| ] | |
| }] | |
| } | |
| ] | |
| },{ | |
| xtype: 'fieldset', | |
| height: 117, | |
| layout: { | |
| align: 'stretch', | |
| type: 'hbox' | |
| }, | |
| items: [ | |
| { | |
| xtype: 'fieldset', | |
| cls: 'removeFSBorder', | |
| padding: '15 0 0 0', | |
| border: 0, | |
| layout: { | |
| align: 'stretch', | |
| type: 'vbox' | |
| }, | |
| flex: 1, | |
| items: [ | |
| { | |
| xtype: 'combobox', | |
| name: 'yearbook', | |
| id: 'Yearbook', | |
| fieldLabel: 'Yearbook', | |
| labelAlign: 'right', | |
| store: invoicer_glStore, | |
| displayField: 'description', | |
| valueField: 'gl_id', | |
| labelWidth: 70, | |
| flex: 1 | |
| },{ | |
| xtype: 'combobox', | |
| name: 'commercial', | |
| id: 'Commercial', | |
| fieldLabel: 'Commercial', | |
| labelAlign: 'right', | |
| store: invoicer_glStore, | |
| displayField: 'description', | |
| valueField: 'gl_id', | |
| labelWidth: 70, | |
| flex: 1 | |
| },{ | |
| xtype: 'combobox', | |
| name: 'donning', | |
| id: 'Donning', | |
| fieldLabel: 'Donning', | |
| labelAlign: 'right', | |
| store: invoicer_glStore, | |
| displayField: 'description', | |
| valueField: 'gl_id', | |
| labelWidth: 70, | |
| flex: 1 | |
| } | |
| ] | |
| }, | |
| { | |
| xtype: 'fieldset', | |
| cls: 'removeFSBorder', | |
| padding: '15 0 0 0', | |
| border: 0, | |
| flex: 1, | |
| //height: 200, | |
| items: [ | |
| { | |
| xtype: 'combobox', | |
| name: 'military', | |
| id: 'Military', | |
| fieldLabel: 'Military', | |
| labelAlign: 'right', | |
| store: invoicer_glStore, | |
| displayField: 'description', | |
| valueField: 'gl_id', | |
| labelWidth: 50, | |
| flex: 1 | |
| },{ | |
| xtype: 'combobox', | |
| name: 'history', | |
| id: 'History', | |
| fieldLabel: 'History', | |
| labelAlign: 'right', | |
| padding: '1 0 0 0', | |
| store: invoicer_glStore, | |
| displayField: 'description', | |
| valueField: 'gl_id', | |
| labelWidth: 50, | |
| flex: 1 | |
| },{ | |
| xtype: 'combobox', | |
| name: 'other', | |
| id: 'Other', | |
| fieldLabel: 'Other', | |
| labelAlign: 'right', | |
| store: invoicer_glStore, | |
| displayField: 'description', | |
| valueField: 'gl_id', | |
| labelWidth: 50, | |
| flex: 1 | |
| },{ | |
| xtype: 'combobox', | |
| name: 'none', | |
| hidden: true, | |
| id: 'None', | |
| fieldLabel: 'None', | |
| labelAlign: 'right', | |
| store: invoicer_glStore, | |
| displayField: 'description', | |
| valueField: 'gl_id', | |
| labelWidth: 50, | |
| flex: .5 | |
| } | |
| ] | |
| } | |
| ] | |
| }], | |
| dockedItems: [{ | |
| xtype: 'toolbar', | |
| dock: 'bottom', | |
| ui: 'footer', | |
| items: ['->', { | |
| itemId: 'save', | |
| text: 'Save', | |
| disabled: true, | |
| scope: this, | |
| handler: this.onSave | |
| }, { | |
| text: 'Create', | |
| scope: this, | |
| handler: this.onCreate | |
| }, { | |
| text: 'Reset', | |
| scope: this, | |
| handler: this.onReset | |
| }] | |
| }] | |
| }); | |
| this.callParent(); | |
| }, | |
| setActiveRecord: function(record){ | |
| this.activeRecord = record; | |
| if (record) { | |
| this.down('#save').enable(); | |
| this.getForm().loadRecord(record); | |
| } else { | |
| this.down('#save').disable(); | |
| this.getForm().reset(); | |
| } | |
| }, | |
| onSave: function(){ | |
| var active = this.activeRecord, | |
| form = this.getForm(); | |
| if ( !active ) { | |
| return; | |
| } | |
| if (form.isValid()) { | |
| form.updateRecord(active); | |
| this.onReset(); | |
| } | |
| }, | |
| onCreate: function(){ | |
| var form = this.getForm(); | |
| if (form.isValid()) { | |
| this.fireEvent('create', this, form.getValues()); | |
| form.reset(); | |
| } | |
| }, | |
| onReset: function(){ | |
| this.setActiveRecord(null); | |
| this.getForm().reset(); | |
| } | |
| }); | |
| var invoicer_lineItemColumns=[{ | |
| xtype: 'gridcolumn', | |
| text: 'ID', | |
| dataIndex:'item_display_number', | |
| width:40 | |
| },{ xtype: 'gridcolumn', | |
| text: 'Name', | |
| dataIndex:'item_name', | |
| width:300 | |
| },{ | |
| xtype: 'gridcolumn', | |
| text: 'Description', | |
| dataIndex: 'item_description', | |
| width: 300 | |
| },{ | |
| xtype: 'gridcolumn', | |
| text: 'Unit Price', | |
| dataIndex:'unit_price', | |
| renderer: 'usMoney', | |
| width: 100 | |
| },{ | |
| xtype: 'booleancolumn', | |
| header: 'Taxable', | |
| sortable: false, | |
| dataIndex: 'taxable', | |
| trueText: 'Y', | |
| falseText: 'N' | |
| },{ | |
| xtype: 'booleancolumn', | |
| header: 'Commissionable', | |
| sortable: false, | |
| dataIndex: 'commissionable', | |
| trueText: 'Y', | |
| falseText: 'N' | |
| }, { | |
| xtype: 'booleancolumn', | |
| header: 'Concessionable', | |
| sortable: false, | |
| dataIndex: 'concessionable', | |
| trueText: 'Y', | |
| falseText: 'N' | |
| }, { | |
| xtype: 'booleancolumn', | |
| header: 'Print on Prelim', | |
| sortable: false, | |
| dataIndex: 'print_on_preliminary', | |
| trueText: 'Y', | |
| falseText: 'N' | |
| }, { | |
| xtype: 'booleancolumn', | |
| header: 'Print On Invoice', | |
| sortable: false, | |
| dataIndex: 'print_on_invoice', | |
| trueText: 'Y', | |
| falseText: 'N' | |
| }]; | |
| Ext.define('Writer.Grid', { | |
| extend: 'Ext.grid.Panel', | |
| alias: 'widget.writergrid', | |
| requires: [ | |
| 'Ext.grid.plugin.CellEditing', | |
| 'Ext.form.field.Text', | |
| 'Ext.toolbar.TextItem' | |
| ], | |
| initComponent: function(){ | |
| this.editing = Ext.create('Ext.grid.plugin.CellEditing'); | |
| Ext.apply(this, { | |
| iconCls: 'icon-grid', | |
| frame: true, | |
| plugins: [this.editing], | |
| dockedItems: [{ | |
| xtype: 'toolbar', | |
| dock: 'top', | |
| items: [{ | |
| xtype: 'combobox', | |
| fieldLabel: 'Year', | |
| id: 'year', | |
| name: 'year', | |
| displayField: 'YEAR', | |
| valueField: 'YEAR', | |
| store: invoicer_lineItemYearStore, | |
| forceSelection: true, | |
| listeners:{ | |
| change:{ | |
| fn: function( v ) { | |
| var form = Ext.getCmp('itemYear').getForm(); | |
| if ( form.isValid() ) { | |
| form.setValues({ | |
| year: v.value | |
| }); | |
| } else { | |
| lineItemGridFilter(invoicer_lineItemStore); | |
| } | |
| } | |
| } | |
| } | |
| }] | |
| },{ | |
| xtype: 'pagingtoolbar', | |
| store: invoicer_lineItemStore, | |
| dock: 'bottom', | |
| displayInfo: true | |
| }], | |
| columns: invoicer_lineItemColumns | |
| }); | |
| this.callParent(); | |
| this.getSelectionModel().on('selectionchange', this.onSelectChange, this); | |
| }, | |
| onSelectChange: function(selModel, selections){ | |
| this.down().setDisabled(selections.length === 0); | |
| }, | |
| onSync: function(){ | |
| this.store.sync(); | |
| }, | |
| onDeleteClick: function(){ | |
| var selection = this.getView().getSelectionModel().getSelection()[0]; | |
| if (selection) { | |
| this.store.remove(selection); | |
| } | |
| }, | |
| onAddClick: function(){ | |
| var rec = new Writer.Person({ | |
| first: '', | |
| last: '', | |
| email: '' | |
| }), edit = this.editing; | |
| edit.cancelEdit(); | |
| this.invoicer_creditMemoReasonStore.insert(0, rec); | |
| edit.startEditByPosition({ | |
| row: 0, | |
| column: 1 | |
| }); | |
| } | |
| }); | |
| Ext.onReady(function(){ | |
| Ext.tip.QuickTipManager.init(); | |
| var invoicer_creditMemoReasonPanel = Ext.create('Ext.Panel',{ | |
| renderTo:'cm-panel', | |
| title:'Line Item Content Management', | |
| width: 1200, | |
| layout: { | |
| align: 'stretch', | |
| type: 'vbox' | |
| }, | |
| items:[{ | |
| itemId: 'form', | |
| xtype: 'creditMemoReasonForm', | |
| height: 300, | |
| margins: '0 0 10 0', | |
| //padding: '10 200', | |
| listeners: { | |
| create: function(form, data) { | |
| invoicer_lineItemStore.insert(0, data); | |
| } | |
| } | |
| },{ | |
| itemId: 'grid', | |
| xtype: 'writergrid', | |
| height: 300, | |
| store: invoicer_lineItemStore, | |
| listeners: { | |
| selectionchange: function(selModel, selected) { | |
| var form = invoicer_creditMemoReasonPanel.child('#form'); | |
| var id = form.getValues().item_id; | |
| form.setActiveRecord(selected[0] || null); | |
| lineItemGlFilter(invoicer_glStore2); | |
| } | |
| } | |
| }] | |
| }); | |
| // Set height of the panel equal to the height of its childen | |
| // Plus a buffer of 35PX. | |
| // # TODO: Remove before prod | |
| invoicer_creditMemoReasonPanel.setHeight(invoicer_creditMemoReasonPanel.child('#form').height + invoicer_creditMemoReasonPanel.child('#grid').height + 35); | |
| }); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment