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>