`

Extjs后台管理系统模板

 
阅读更多
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>    
    <title>Extjs后台管理系统模板</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<link rel="stylesheet" href="ext/resources/css/ext-all.css" />
<script type="text/javascript" src="ext/ext-base.js"></script>
<script type="text/javascript" src="ext/ext-all.js"></script>
<script type="text/javascript" src="ext/ext-lang-zh_CN.js"></script>

<script type="text/javascript" src="js/small-debug.js"></script>
<script type="text/javascript" src="js/usermenu.js"></script>
  </head>
  
  <body>
    <div id="tree"></div>
  </body>
</html>
Ext.onReady(function() {

	var tree = new Ext.tree.TreePanel( {
		rootVisible : false
	});
	var tree = new Ext.tree.TreePanel( {});
	var root = new Ext.tree.AsyncTreeNode( {
		text : '后台管理',
		id : '0',
		children : [ {
			text : '权限管理',
			id : '01',
			children : [
			// {text:' 资源 ',leaf:true,id:'11'},
					{
						text : '  用户  ',
						leaf : true,
						id : '12'
					}, {
						text : '  角色  ',
						leaf : true,
						id : '13'
					} ]
		}, {
			text : '分类管理',
			leaf : true,
			id : '02'
		}, {
			text : '专题管理',
			leaf : true,
			id : '03'
		}, {
			text : '信息管理',
			leaf : true,
			id : '04'
		}, {
			text : '审核 ',
			leaf : true,
			id : '05'
		}, {
			text : '搜索 ',
			leaf : true,
			id : '06'
		}, {
			text : '退出',
			leaf : true,
			id : '41',
			listeners : {
				'click' : function() {
					parent.window.location.href = 'http://www.baidu.com';
				}
			}
		} ]
	});
	tree.setRootNode(root);
	tree.render("tree");
	tree.expandAll();// 默认展开全部

		tree
				.on("click", function(node) {
					var nodeId = node.id;
					var n = contentPanel.getComponent(node.id);
					// 资源
						// if(nodeId==11){
						// if(!n)
						// {
						// n=contentPanel.add({
						// 'id':node.id,
						// 'title':node.text,
						// closable:true,
						// html:'<iframe scrolling="no" frameborder="0"
						// width="100%" height="630" src="test.html"></iframe>'
						// });
						// };
						// }

						// 用户
						if (nodeId == 12) {
							Ext.Ajax
									.request( {
										url : 'PermissionProving?object=users',
										method : 'post',
										success : function(response) {
											var obj = Ext
													.decode(response.responseText);
											if (obj.success == true) {
												if (!n) {
													n = contentPanel
															.add( {
																'id' : node.id,
																'title' : node.text,
																closable : true,
																html : '<iframe scrolling="no" frameborder="0" width="100%" height="620" src="http://www.baidu.com"></iframe>'
															});
													contentPanel
															.setActiveTab(n);
												}
												;
											} else {
												Ext.Msg.alert('您好,您不是管理员。',
														'无权限使用该功能,有需要请与管理员联系。');
											}
										},
										failure : function(response, opts) {
											Ext.Msg.alert('消息', '服务器未响应!');
										}
									});
						}

						// 角色
						if (nodeId == 13) {
							Ext.Ajax
									.request( {
										url : 'PermissionProving?object=group',
										method : 'post',
										success : function(response) {
											var obj = Ext
													.decode(response.responseText);
											if (obj.success == true) {
												if (!n) {
													n = contentPanel
															.add( {
																'id' : node.id,
																'title' : node.text,
																closable : true,
																html : '<iframe scrolling="no" frameborder="0" width="100%" height="620" src="http://www.baidu.com"></iframe>'
															});
													contentPanel
															.setActiveTab(n);
												}
												;
											} else {
												Ext.Msg.alert('您好,您的用户不隶属于任何角色。',
														'无权限使用该功能,有需要请与管理员联系。');
											}
										},
										failure : function(response, opts) {
											Ext.Msg.alert('消息', '服务器未响应!');
										}
									});
						}

						// 分类管理
						if (nodeId == 02) {
							if (!n) {
								n = contentPanel
										.add( {
											'id' : node.id,
											'title' : node.text,
											closable : true,
											html : '<iframe scrolling="no" frameborder="0" width="100%" height="620" src="http://www.baidu.com"></iframe>'
										});
							}
							;
						}

						// 专题管理
						if (nodeId == 03) {
							if (!n) {
								n = contentPanel
										.add( {
											'id' : node.id,
											'title' : node.text,
											closable : true,
											html : '<iframe scrolling="no" frameborder="0" width="100%" height="620" src="http://www.baidu.com"></iframe>'
										});
							}
							;
						}
						// 信息管理
						if (nodeId == 04) {
							if (!n) {
								n = contentPanel
										.add( {
											'id' : node.id,
											'title' : node.text,
											closable : true,
											html : '<iframe scrolling="no" frameborder="0" width="100%" height="620" src="http://www.baidu.com"></iframe>'
										});
							}
							;
						}

						// 审核
						if (nodeId == 05) {
							if (!n) {
								n = contentPanel
										.add( {
											'id' : node.id,
											'title' : node.text,
											closable : true,
											html : '<iframe scrolling="no" frameborder="0" width="100%" height="620" src="http://www.baidu.com"></iframe>'
										});
							}
							;
						}

						// 搜索
						if (nodeId == 06) {
							if (!n) {
								n = contentPanel
										.add( {
											'id' : node.id,
											'title' : node.text,
											closable : true,
											html : '<iframe scrolling="no" frameborder="0" width="100%" height="620" src="http://www.baidu.com"></iframe>'
										});
							}
							;
						}

						contentPanel.setActiveTab(n);
					})

	});

Ext.onReady(function(){

	var viewport=new Ext.Viewport({
	    layout:'border',
		frame:'true',
		items:[
			   {region:'north',//contentEl:'head'
			    height:100,
			    html:'<center><font color="red" size="12" style="margin:-15px 0px 0px 0px">后台管理系统</font></center>'
			   },
			   {region:'center',
			    items:[
					   contentPanel=new Ext.TabPanel({
													 id:'centerP',
													 enableTabScroll:true,//能够滚动收缩
													 activeTab:0,//激活第一个标签
													 items:[{
															id:'homePage',
															layout:'fit',
															title:'首页',
															autoScroll:true,
															html:'<iframe scrolling="auto" frameborder="0" width="100%" height="630" src="index.jsp"></iframe>'
													 }]
					   })
				]
			   },
			   {region:'west',title:'菜单',split:false,width:150,minSize:100,maxSize:200,collapsible:true,contentEl:'tree'},
			   {region:'south',height:46,html:'<center><font color="red" size="4">order by:潴哥哥</font></center>'}
			  ]
	});
});
分享到:
评论

相关推荐

    基于ExtJS的通用后台管理系统

    在这个基于ExtJS的通用后台管理系统中,我们可以看到它被用来创建一个高效的管理界面,可能包含了数据的增删查改、图表分析、用户权限管理等多种功能。 首先,让我们了解一下ExtJS在后台管理系统中的应用。ExtJS...

    extjs后台界面模板3.zip

    EXTJS后台界面模板3.zip提供了一个完整的后台管理系统的界面模板,包括了机构、用户、角色和权限模块,使得开发者可以快速搭建功能完备的管理平台。 这个模板的结构设计十分清晰,顶部菜单栏提供了导航功能,方便...

    基于ExtJS3的后台管理系统模板

    3、通过实现角色管理、用户管理、部门管理三个基础的功能模块,演示了Viewport、Container、Panel、Grid、Window、Form、Tree等常用组件的用法,以及border、column、form、fit、accordion、hbox等常用布局方式;...

    基于ExtJS5的后台管理系统案例 - 源码

    2. **后台管理系统模板** 这个案例提供了一个完整的后台管理系统的模板,包括基础的增删改查功能,这些都是任何管理系统的必备元素。开发者可以通过这个模板快速理解和学习如何使用ExtJS5构建类似的系统。 3. **增...

    通用后台管理系统(ExtJS 4.2+Hibernate 4.1.7+Spring MVC 3.2.8)

    系统可作为OA、网站、电子政务、ERP、CRM、APP后台等基于B/S架构的应用软件系统的快速开发框架。 1、开发工具:Eclipse、MyEclipse和其他IDE。 2、采用Spring 3中最新最稳定的Spring MVC 3.2.8版本。 3、采用...

    简单简洁大方仿extjs网站后台管理系统

    简单大方的后台管理系统,可用于oa,网站后台,erp,crm等后台使用。 本人自主开发,IE6.7.8全兼容,FF chrome兼容, 主页左右宽高可随浏览器变化而变化, 本系统有很好的用户体验设计,欢迎您二次开发。

    基于SpringBoot+FreeMarker+MyBatis+ExtJs实现的一个通用后台管理系统,界面美观,适合快速迭代开发

    基于SpringBoot+FreeMarker+MyBatis+ExtJs实现的一个通用后台管理系统,界面美观,适合快速迭代开发 项目说明 技术栈: SpringBoot MyBatis Redis MySQL FreeMarker ExtJs 基于SpringBoot+FreeMarker+MyBatis+...

    基于Extjs 4.2的通用权限管理系统,通用后台模板,EF+MVC+Extjs 4.2

    WMC2.0-Client.zip是一个基于Extjs4.2的开发框架,其实是个只有大框架的,并没有其他功能,您可能会骂我标题党“通用权限管理系统,通用后台模板”,呵呵,其实不是这样的。 整个WMC系统分为WMC2.0-Server服务端...

    Extjs 通用后台模板| 经典 Tree+Tab+Grid

    这个"Extjs 通用后台模板| 经典 Tree+Tab+Grid"是一个基于ExtJS的预配置模板,它集成了常见的界面元素,如树形视图(Tree)、选项卡(Tab)和网格(Grid),为开发高效能、用户友好的后台应用提供了便利。...

    jQuery easyui ,extjs,html200套模板+仿WEBQQ8套模板后台模板

    在后台管理系统中,EXTJS的模板可以用于构建复杂的业务逻辑,比如工作流审批、数据可视化等,提升管理效率。 至于WEBQQ,它是腾讯推出的一款基于Web的即时通讯应用,它的界面设计和交互体验备受赞誉。在提供的10套...

    extjs通用后台管理界面

    标题中的"extjs通用后台管理界面"指的是使用ExtJS框架开发的适用于各种后台管理系统的用户界面模板。这种界面通常包括一系列常见的管理功能,如数据表格、图表、表单、导航菜单等,以满足日常的后台管理需求。它的...

    13款extjs后台框架

    在给定的“13款extjs后台框架”中,我们可以看到各种基于ExtJS开发的后台管理模板,这些模板通常包含了一系列预设的页面布局、功能组件和样式设计,旨在帮助开发者快速搭建后台管理系统。 1. **免费后台管理模板**...

    Extjs 后台模板

    在“Extjs 后台模板”中,我们通常会看到一系列预先设计好的页面布局、组件配置和交互逻辑,这些可以帮助开发者快速搭建后台管理系统的基础架构。 1. **页面布局**:后台模板通常包含多种常见的页面布局,如仪表盘...

    后台管理系统,SpringBoot+FreeMarker+MyBatis+ExtJs.zip

    【标题】"后台管理系统,SpringBoot+FreeMarker+MyBatis+ExtJs.zip" 所涉及的知识点主要集中在四个核心技术上:SpringBoot、FreeMarker、MyBatis以及ExtJs。这些技术是构建现代Web应用程序的常见组件,尤其适用于...

    EXT富客户端后台管理系统 初步代码第1/2页

    &lt;!DOCTYPE html PUBLIC “-//W3C//DTD ... &lt;head&gt; &lt;... charset=UTF-8″&gt; &lt;...*加载的Extjs 资源文件 — 开始*%&gt; &lt;link rel=”stylesheet” type=”text/css” href=”&lt;&#37;$extjs_res%&gt;”

    extjs+asp.net后台管理系统页面

    在本系统中,很可能是采用了Web Forms或MVC模式,因为它们更适合构建后台管理系统,提供了丰富的控件和模板来简化开发流程。 **后台管理系统的构建**: 1. **用户认证与授权**:在后台管理系统中,通常需要实现用户...

    漂亮的通用后台 html模板 静态模板 后台模板

    在描述和标签中,再次强调了模板的通用性、美观性和其静态属性,暗示这个模板可能具有良好的用户体验设计,易于定制,并且适用于不同类型的后台管理系统。 “仿126邮箱后台”这个压缩包子文件的文件名称表明,该...

    Extjs4.0通用后台管理系统源码完整大型项目可二次开发

    系统可作为OA、网站、电子政务、ERP、CRM、APP后台等基于B/S架构的应用软件系统的快速开发框架。 特色功能 1采用Spring MVC的静态加载缓存功能,在首页将Javascript文件、CSS文件和图片等静态资源文件加载进来放进...

    几种Ext后台模板和网站后台模板

    这些模板可能包括预定义的布局、组件样式和示例代码,帮助开发者快速搭建后台管理系统。通过下载和学习这些模板,开发者可以学习到如何有效地使用Ext JS库,理解如何构建组件、组织布局、处理数据以及实现交互效果。...

    后端SpringBoot+Shiro+MyBatis+Redis,前端Vue+ElementUI+Axios的后台管理系统模板

    后端SpringBoot+Shiro+MyBatis+Redis,前端Vue+ElementUI+Axios的后台管理系统模板 项目经过严格测试,确保可以运行! 基于SpringBoot整个常用框架的模板库 运用这个模板开发了一个基于粗粒度权限设计的管理后台,...

Global site tag (gtag.js) - Google Analytics