Extjs后台管理系统模板

最新推荐文章于 2015-12-22 15:45:00 发布
最新推荐文章于 2015-12-22 15:45:00 发布
阅读量737 收藏
点赞数
分类专栏： hibernate ext 文章标签： 后端 javascript ViewUI
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/dwj200810/article/details/84080149
版权 
<!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>'}
			  ]
	});
});
dwj200810
关注
专栏目录
Extjs案例---后台管理系统界面布局
爱音乐，爱编程。
03-22 4096
主要使用的是viewPort布局，，再添加一些组件(下附源代码) HELLO WORD Ext.onReady(function(){ //使用Viewport布局 var mypanel = new Ext.container.Viewport({ layout:'border',//表格布局 items:[
Extjs之简单后台管理界面示例
码农的世界
10-14 4435
a{ text-decoration: none; } Ext.onReady(function(){ /** * 主体面板 * */ var centerPanel = Ext.create('Ext.tab.Panel', { region:'center', items:{
基于ExtJS的通用后台管理系统
12-08
基于ExtJS的通用后台管理系统。某宝购买，界面布局漂亮、里面有如何导入，以及中间遇到错误的解决办法的文档。可以快捷、方便的移入自己的项目中。
基于ExtJS3的后台管理系统模板
05-09
项目特点： 1、基于ExtJS 3.4版本实现，采用默认的样式风格，中文语言； 2、演示了登录页和主页面之间的相互切换； 3、通过实现角色管理、用户管理、部门管理三个基础的功能模块，演示了Viewport、Container、Panel、Grid、Window、Form、Tree等常用组件的用法，以及border、column、form、fit、accordion、hbox等常用布局方式； 4、通过ColumnHeaderGroup 和 DatePickerPlus，演示了ExtJS插件的基本用法； 5、使用JSON，模拟从后台动态获取数据； 注意事项： 因为file协议不支持Ajax获取数据，所以请把该项目部署到Nginx、Apache或Tomcat等Web服务器，然后通过http协议访问。
ExtJS5-一个简洁完整的后台管理系统入门实例
04-12
1、基于ExtJS 5.1版本实现，采用Neptune样式风格，中文语言； 2、使用全新的MVVM模式架构，面向对象写法； 3、全系统只有一个index.html界面，登录框也封装成独立的视图组件； 4、通过实现角色管理、用户管理两个基础的功能模块，演示了Viewport、Container、Panel、TreePanel、Grid、Window、Form等常用组件的用法，以及border、column、form、fit、hbox等常用布局方式； 5、通过自定义一个Ext.button.Button的扩展类，演示了自定义扩展Ext类的基本方法； 6、使用JSON，模拟从后台动态获取数据； 7.放入webapp运行tomcat,,直接访问index.html即可访问,其他语言相同
Extjs后台管理模板
07-20
这是我用Extjs做的后台管理模板 只是个框架 我也是个初学者，刚开始学习它的时候 都是自己去看资料学习的，当时很希望有个这样的框架模板那样的话就可以照着模板做了，省了很多时间 这里我给了一个后台布局的一个框架，希望能给初学者一点帮助
Extjs复习之管理后台的通用模版
浮白
08-20 9584
很久没有用过ExtJS，正好一个新的在线系统需要搭建一个运营平台，没有交互，没有页面设计，没有原型，我那点可怜的美感只能借助Extjs来搭建了。 1.通用的架子典型的Border布局+tree菜单+TabPanel的内容区的框架，模块清晰简单，菜单可配置。 Ex
Extjs 通用后台模板| 经典 Tree+Tab+Grid
11-14
Extjs (Tree+Tab+Grid)通用后台模板,全静态数据，下载即可看效果。可以完全套用。
EXT富客户端后台管理系统 初步代码第1/2页
12-07
<!DOCTYPE html PUBLIC “-//W3C//DTD ... <head> <... charset=UTF-8″> <...*加载的Extjs 资源文件 — 开始*%> <link rel=”stylesheet” type=”text/css” href=”<%$extjs_res%>”
通用后台管理系统（ExtJS 4.2+Hibernate 4.1.7+Spring MVC 3.2.8）
03-23
系统可作为OA、网站、电子政务、ERP、CRM、APP后台等基于B/S架构的应用软件系统的快速开发框架。 1、开发工具：Eclipse、MyEclipse和其他IDE。 2、采用Spring 3中最新最稳定的Spring MVC 3.2.8版本。 3、采用...
ExtJS项目后台模板
09-30
已经整理，能直接看效果的哦，用着不错，要使用的拿走吧
基于Extjs 4.2的通用权限管理系统,通用后台模板,EF+MVC+Extjs 4.2
02-19
您刚刚下载EnterpriseExtjs.rar中，包含WMC2.0-Client.zip文件，正如（Client）名字一样，是属于一个客户端产品。 WMC2.0-Client.zip是一个基于Extjs4.2的开发框架，其实是个只有大框架的，并没有其他功能，您可能会骂我标题党“通用权限管理系统,通用后台模板”，呵呵，其实不是这样的。 整个WMC系统分为WMC2.0-Server服务端，和WMC2.0-Client客户端两部分组成，您刚刚下载的这个是客户端模板，客户端需要依托服务端Server来运行的，只有配合了服务端，才能使用通用权限系统，包括1.用户中心；2.组织架构中心；3.sso单点登录；4.权限中心；5系统监控中心；这五大功能。 并且WMC2.0-Client.zip作为客户端开发框架，您是不需要写任何代码的，我们提供代码生成器帮助你实现基于EntityFramework+Extjs+MVC架构的快速开发。
extjs后台界面模板3.zip
12-13
extjs后台界面模板，实现了机构、用户、角色、权限模块的界面。顶部为菜单栏，中间分左、右两部分，左侧为机构树，右侧为查询列表，可动态添加、修改、删除机构节点。
Extjs4.0通用后台管理系统源码完整大型项目（ExtJS 4.2+Hibernate 4.1.7+Spring MVC 3.2.8）
10-26
可二次开发Extjs4.0通用后台管理系统源码完整大型项目。数据库在项目里面的一个sql文件里面 1、采用Spring MVC的静态加载缓存功能，在首页将Javascript文件、CSS文件和图片等静态资源文件加载进来放进内存，极大提高ExtJS的加载速度。 2、三种皮肤主题：经典、灰色和海王星，支持多浏览器和多分辨率。 3、分别封装了模型层、控制层、业务逻辑层和数据持久层的通用操作模块，层次分明，大大减少代码冗余，二次开发效率高。 4、系统是公司多个项目的基础框架，稳定性好，支持大并发。
Extjs4.0通用后台管理系统源码完整大型项目（ExtJS 4.2+Hibernate 4.1.7+Spring MVC
12-19
可二次开发Extjs4.0通用后台管理系统源码完整大型项目。数据库在项目里面的一个sql文件里面 1、采用Spring MVC的静态加载缓存功能，在首页将Javascript文件、CSS文件和图片等静态资源文件加载进来放进内存，极大提高ExtJS的加载速度。 2、三种皮肤主题：经典、灰色和海王星，支持多浏览器和多分辨率。 3、分别封装了模型层、控制层、业务逻辑层和数据持久层的通用操作模块，层次分明，大大减少代码冗余，二次开发效率高。 4、系统是公司多个项目的基础框架，稳定性好，支持大并发。
基于ExtJS5的后台管理系统案例 - 源码
06-03
2. **后台管理系统模板** 这个案例提供了一个完整的后台管理系统的模板，包括基础的增删改查功能，这些都是任何管理系统的必备元素。开发者可以通过这个模板快速理解和学习如何使用ExtJS5构建类似的系统。 3. **增...
extjs5 后台管理系统
weixin_33906657的博客
12-22 253
2019独角兽企业重金招聘Python工程师标准>>> ...
ExtJs 实现的后台管理框架
wjt276的专栏
12-14 313
由ExtJs实现的后台管理框架， 你只要添加你左边的树型数据即可。 数据格式可以是JSON、TXT、XML都可以。 如果你需要在左边添加管理快，只需要修改下面代码：   var panelItems = [ createPanel('加载Json格式数据',Docs.classData,'ExtJsK00KK','root0','json'), createPanel('...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值