layui框架使用与代码编写

layui框架使用与代码编写

一、layui增加操作工具列

ShowLeakList = ListPager.extend({
	init : function(container, primaryKey, url){
		//列表容器
		this.container = container;
		//主键字段
		this.primaryKey = primaryKey;
		//数据请求地址
		this.url = url;
		//界面需要引用的插件
		this.plugins = ['table', 'element', 'form', 'laydate', 'layer','carousel'];
//		//弹出卡片界面的大小[60%,80%]
//		this.cardSize = ['100%','100%'];
//		//弹出卡片界面方式：页面层(这里content是一个普通的String):1;iframe层(content是一个URl):2
		this.cardPopStyle = 2;
		//每页大小 
		this.pageSize = 5;
		//列表头
		this.title = [[
			{field: 'checkDate', title: '检测日期', width: 120},
			
			{field: 'startTime', title: '检测开始时间', width: 120},
			
			{field: 'endTime', title: '检测结束时间', width: 120},
			
			{field: 'checkUser', title: '检测人', width: 120},
			
			
			{fixed: 'right', title: '轨迹查看', align:'center',width: 100, toolbar: '#scanLeak'}
			
	     ]]; 
		//插件是基于layui封装的， layOption是对layui的参数扩展（具体api参照layui属性）
		this.layOption = {
				
		};
	},
	initLayuiPlugin: function(){
		this._super();
	},
	initEvent: function(){
		this._super();
		//TODO 父类仅仅绑定了工具条通用按钮事件， 如有其他事件请在这里定义
	},
	hookMethod:function(obj){
		debugger;
	 	var data = obj.data,
	 	url = CONTEXT_PATH + '/cusviews/leak/listLeakPoint';
		var param = {
				checkId : data.checkId
		}
		var retData = $.getData(url,param);
		if(1000 != retData.status){
			layer.msg('获取数据失败', {icon: 5});
			return;
		}
		var points = [];
		var data = retData.data;
		if(!$.isEmptyArray(data)){
			Leak.removePoint();
			for(var i=0;i