layUI开发笔记-003

LayUI弹出窗体

说明：
maxmin: false：是否有最大化按钮
area:[‘800px’,‘600px’]：设置显示大小
content: [url, “no”] ：没有滚轮

function BrowseShangPin()
			{	
				var DingDanID = document.getElementById("DingDanID").value;
				//var KeHuID 		=document.getElementById("KeHuID").value;     
				console.log(DingDanID);
				var url ="{:U('/index?DingDanID='.$DingDanID)}";		    
				console.log("url:",url);
				layer.open({
				    type:2,
				    shade: 0,
				    maxmin: false,
				    offset: 'auto', 
				    area:['800px','600px'],
				    title: '订单货品一览',
				    content: [url, "no"] ,
			    });
			}

2、事件引用

<label class="layui-form-label">
				    	<a onclick="BrowseShangPin();"class="layui-btn layui-btn-radius">订单详情</a>
				    </label>

3、表格操作事件绑定：

//监听行工具事件table
			table.on('tool(Tbl_DingDan)', function(tbl_obj){
			    var data = tbl_obj.data;
			    var DingDanID = data.DingDanID;
			    if(tbl_obj.event === 'AnZhuang')
			    {
				    //开启安装窗体
				    //lay-event="AnZhuang"
				    var url ="{:U('ng/index')}"+"?DingDanID="+DingDanID+"&KeHuName="+data.KeHuName;
				    console.log("url2:",url);
				    layer.open({
						type:2,
						shade: 0,
						maxmin: true,
						shadeClose: true,
						offset: 'auto', 
						area:['60%','90%'],
						title: '安装窗体',
						content: [url] ,
			    	});
			    }
			    if(tbl_obj.event === 'GuanLi')
			    {
				    var url ="{:U('n/index')}"+"?DingDanID="+DingDanID;
				    console.log("url:",url);
				    layer.open({						
						type: 2,
						title: '管理订单', 
						maxmin: true, 
						shadeClose: true,
						shade: 0.8,
						area: ['85%', '95%'],
						content: [url] ,
			    	});
			    }
			});

<div class="layui-form" lay-accordion="">
			<div class="layui-colla-item">
			    <h2 class="layui-colla-title">订单信息一览表</h2>
				    <div class="layui-colla-content layui-show">
				     	<table class="layui-table" lay-size="sm" id="Tbl_DingDan" lay-filter="Tbl_DingDan"></table>
				     	<script type="text/html" id="barDemo">
							  <a class="layui-btn layui-btn-xs" lay-event="AnZhuang">安装</a>
							  <a class="layui-btn layui-btn-xs" lay-event="GuanLi">管理</a>
						</script>
				    </div>
			</div>
	  	</div>