技术测试管理系统之easyUI布局

技术测试管理系统旨在管理自己所用的技术，通俗说就是毫无关联的技术放在一个系统里。目的看着自己技术成长，作为技术笔记。与同道共享、共勉！

效果图：

必备文件：

技术用处：web应用系统常用布局

所用技术：easyUI-easyui-layout、easyui-accordion、easyui-tabs

code：

   
   

    
    north
region
   
   

   
   

	
    
    

		
     
     学生档案
     
     

     
     

		
     
     请假记录
	
    
    
	
    
    

		
     
     课程安排
     
     

     
     

		
     
     课程签到
     
     

     
     

		
     
     课程老师
	
    
    
	
    
    

		
     
     图书列表
     
     

     
     

		
     
     图书借阅
     
     

     
     

		
     
     图书报损
     
     

     
     

		
     
     图书位置
	
    
    

   
   

   
   

    
    east region
   
   

   
   

    
    south
region
   
   

   
   


   
   

<script type="text/javascript">
		var index = 0;
		function addPanel(obj, URL){
			index++;
			if(!$('#tt').tabs('exists', obj.title)) {
				$('#tt').tabs('add',{
					title: obj.title,
					content: ' scrolling="auto" frameborder="0"  src="'+ URL +'" style="width:100%;height:99%;">',
					closable: true
				});
			}else {
				$('#tt').tabs('select', obj.title);
			}
		}
		function removePanel(){
			var tab = $('#tt').tabs('getSelected');
			if (tab){
				var index = $('#tt').tabs('getTabIndex', tab);
				$('#tt').tabs('close', index);
			}
		}
		
	</script>

技术难点：easyUI用标签的class和data-options来定义使用什么控件及控件效果。

技术扩展：demo的模块是静态文字，实际工作使用中一般使用动态获取（即从数据库）

下礼拜日更新计划：技术测试管理系统之easyUI数据获取