今天心情不好,给大家分享下extjs做的进销存系统happy下
也是one page one application 系统
废话不多说先贴部分代码,然后需要的话自己下载包
如果反馈不错的话在发个移动的也是用extjs做的
左边的树是静态的添加的
var root=new Ext.tree.TreeNode({ text:'物品属性管理', expanded: true }); var root1=new Ext.tree.TreeNode({ text:'物品属性管理', expanded: true }); var root2=new Ext.tree.TreeNode({ text:'物品管理', expanded: true }); var root3=new Ext.tree.TreeNode({ text:'物品出入库管理', expanded: true }); var root4=new Ext.tree.TreeNode({ text:'物品报表管理', expanded: true }); var root4_1=new Ext.tree.TreeNode({ text:'入库报表', id:'inreport-manage', expanded: true, leaf:true }); var root4_2=new Ext.tree.TreeNode({ text:'出库报表', id:'outreport-manage', expanded: true, leaf:true }); var root5=new Ext.tree.TreeNode({ text:'供应商管理', expanded: true }); var root6=new Ext.tree.TreeNode({ text:'系统管理', expanded: true }); var root6_1=new Ext.tree.TreeNode({ text:'机构管理', id:'org-panel', expanded: true, leaf:true }); var root6_2=new Ext.tree.TreeNode({ text:'人员管理', expanded: true, leaf:true }); var root6_3=new Ext.tree.TreeNode({ text:'角色管理', id:'user-panel', expanded: true, leaf:true }); root6.appendChild(root6_1); root6.appendChild(root6_2); root6.appendChild(root6_3); root1.appendChild(new Ext.tree.TreeNode({ text:'计量管理', id:'unit-manage', expanded:false, leaf:true, listeners:{ 'click':function() { ds_unit.reload({ params:{start:0,limit:20} }) } } })); root1.appendChild(new Ext.tree.TreeNode({ text:'类别管理', expanded:true, id:'Gssort-manage', leaf:true, listeners:{ 'click':function() { ds_Gssort.reload({ params:{start:0,limit:20} }) } } })); root1.appendChild(new Ext.tree.TreeNode({ text:'规格管理', id:'spec-manage', leaf:true, listeners:{ 'click':function() { ds_spec.reload({ params:{start:0,limit:20} }); ds_Gssort.reload(); } } })); root2.appendChild(new Ext.tree.TreeNode({ text:'物品管理', id:'goods-manage', leaf:true, listeners:{ 'click':function() { ds_goods.baseParams.type="findAll" ds_goods.reload({ params:{start:0,limit:20} }); } } })); root2.appendChild(new Ext.tree.TreeNode({ text:'物品浏览', id:'goodsBrowse-manage', leaf:true, href:'goods.do?type=View&start=0', hrefTarget:'content' })); root3.appendChild(new Ext.tree.TreeNode({ text:'物品入库', id:'ingoods-manage', leaf:true })); root3.appendChild(new Ext.tree.TreeNode({ text:'物品出库', id:'outgoods-manage', leaf:true })); root4.appendChild(root4_1); root4.appendChild(root4_2); root5.appendChild(new Ext.tree.TreeNode({ text:'供应商管理', id:'provider-manage', leaf:true, listeners:{ 'click':function() { ds_Provide.reload({ params:{start:0,limit:20} }) } } })); root.appendChild(root1); root.appendChild(root2); root.appendChild(root3); root.appendChild(root4); root.appendChild(root5); root.appendChild(root6);
主页可以换肤
Ext.BLANK_IMAGE_URL = '/jxxt/ExtJs/ext/resources/images/default/s.gif'; Ext.QuickTips.init(); var start = { id : 'start-panel', title : '欢迎使用', layout : 'fit', bodyStyle : 'padding:25px', html : '<img src="/jxxt/img/bg.jpg"/>' }; var themes=new Ext.data.SimpleStore({ fields:['theme','css'], data:[ ['默 认','ext-all.css'], ['粉 色','xtheme-pink.css'], ['绿 色','xtheme-green.css'], ['黑 色','xtheme-black.css'], ['巧克力色','xtheme-chocolate.css'], ['金 黄 色','xtheme-calista.css'], ['浅 蓝 色','xtheme-purple.css'], ['深 蓝 色','xtheme-indigo.css'], ['橘黄 色','xtheme-orange.css'], ['红 色','xtheme-red5.css'] ] }); var color_change=new Ext.form.ComboBox({ triggerAction:"all", fieldLabel:'切换系统皮肤', forceSelection:true, listAlign:'center', typeAhead:true, emptyText:"切换系统皮肤", width:100, store:themes, displayField:"theme", valueField:"css", mode:"local", listeners:{ 'select':function(e){ var conboBoxValue=color_change.getValue(); addCookie('color',conboBoxValue); Ext.util.CSS.swapStyleSheet( 'theme', './ExtJs/ext/resources/css/'+conboBoxValue ); } } }); Ext.onReady( function(){ setTimeout(function(){ Ext.get('loading').remove(); var vp=new Ext.Viewport({ layout : 'border', defaults : { collapsible : true, split : true }, items:[{ region:"north", title:"广州农业局后勤进销系统", height:100, bodyStyle:'background-image: url(/jxxt/img/top1.bmp)', maxSize : 150 },{ title:"菜单", region:"west", id : 'accordion-panel', width : 150, minSize : 150, layout : 'border', margins : '2 0 5 5', maxSize : 250, tbar:[color_change], bbar:[{ iconCls:'icon-zhuxiao', text:'注销系统', handler:function(){ Ext.Msg.confirm('系统注销', '你确定要注销系统吗?数据都保存了吗?', function(btn) { if(btn=='yes') { window.location.href = 'login.do?type=logout'; } }) } }], defaults : { border : false }, items : [{ layout : 'accordion', region : 'center', items : [{ title : '导航菜单', iconCls : 'icon-nav', border : false, items : [{ xtype : 'treepanel', border : false, rootVisible : false, autoScroll : true, root : root, listeners : { 'click' : function(n) { try { var sn = this.selModel.selNode || {}; if (n.leaf && n.id != sn.id){ var panel=n.id.substring(0,n.id.indexOf("-"))+"-panel"; Ext.getCmp('content-panel').layout.setActiveItem(panel); } } catch (e) { } } } }] }] }] },{ region:"center", id : 'content-panel', layout : 'card', margins : '2 5 5 0', activeItem : 0, border : false, items:[start,unit, ssort,provider,p_spec,p_goods,p_goodsBrowse,ingoods,outgoods,inreport,outreport,org] }] }); var css=getCookie('color'); Ext.util.CSS.swapStyleSheet( 'theme', './ExtJs/ext/resources/css/'+css ); },250) });
具体的模块js代码就不贴了,贴两张截图