console
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<title>layui 调试预览</title>
<link rel="stylesheet" href="https://www.layuicdn.com/layui/css/layui.css" media="all">
<style>
body {
margin: 10px;
}
</style>
</head>
<body>
<div class="layui-bg-gray" style="padding: 10px;">
<div class="layui-row layui-col-space10">
<div class="layui-col-xs4">
<div class="layui-panel">
<div style="padding: 10px 10px;">
<fieldset class="layui-elem-field layui-field-title" style="margin: 5px 5px;">
<legend style="font-size:14px;">模型属性</legend>
</fieldset>
<form class="layui-form" action="" lay-filter="example">
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label" >模型名称</label>
<div class="layui-input-inline">
<input type="tel" name="phone" lay-verify="required|phone" autocomplete="off" class="layui-input">
</div>
</div>
</div>
<div class="layui-form-item" style="margin-top:-10px;">
<div class="layui-inline">
<label class="layui-form-label" >英文名称</label>
<div class="layui-input-inline">
<input type="tel" name="phone" lay-verify="required|phone" autocomplete="off" class="layui-input">
</div>
</div>
</div>
<div class="layui-form-item" style="margin-top:-10px;">
<div class="layui-inline">
<label class="layui-form-label">模型类型</label>
<div class="layui-input-inline">
<input type="tel" name="phone" lay-verify="required|phone" autocomplete="off" class="layui-input">
</div>
</div>
</div>
<div class="layui-form-item" style="margin-top:-10px;">
<div class="layui-inline">
<label class="layui-form-label">创建日期</label>
<div class="layui-input-inline">
<input type="tel" name="phone" lay-verify="required|phone" autocomplete="off" class="layui-input">
</div>
</div>
</div>
<div class="layui-form-item" style="margin-top:-10px;">
<div class="layui-inline">
<label class="layui-form-label">创建人员</label>
<div class="layui-input-inline">
<input type="tel" name="phone" lay-verify="required|phone" autocomplete="off" class="layui-input">
</div>
</div>
</div>
</form>
</div>
</div>
</div>
<div class="layui-col-xs8">
<div class="layui-panel">
<div style="padding: 8px 8px;">
<div class="layui-btn-container" style="height:30px;width:70%;">
<button id="demo1" type="button" class="layui-btn layui-btn-normal layui-btn-sm"><i class="layui-icon layui-icon-delete"></i>保存</button>
<button type="button" class="layui-btn layui-btn-normal layui-btn-sm"><i class="layui-icon layui-icon-delete"></i>测试</button>
</div>
</div>
</div>
<div class="layui-panel" style="margin-top:10px;">
<div style="padding: 10px 5px;">
<form class="layui-form" action="" lay-filter="example">
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">任务模型</label>
<div class="layui-input-inline">
<select name="modules" lay-verify="required" lay-search="">
<option value="">直接选择或搜索选择</option>
<option value="1">模型1</option>
<option value="2">模型2</option>
<option value="3">模型3</option>
<option value="4">模型4</option>
</select>
</div>
<button id="demo1" type="button" class="layui-btn layui-btn-normal layui-btn-sm" style="margin-top:2px;height:34px;"><i class="layui-icon layui-icon-more"></i></button>
</div>
<div class="layui-inline">
<label class="layui-form-label">计划安排</label>
<div class="layui-input-inline">
<select name="modules" lay-verify="required" lay-search="">
<option value="">直接选择或搜索选择</option>
<option value="1">计划1</option>
<option value="2">计划2</option>
<option value="3">计划3</option>
<option value="4">计划4</option>
</select>
</div>
<button id="demo1" type="button" class="layui-btn layui-btn-normal layui-btn-sm" style="margin-top:2px;height:34px;"><i class="layui-icon layui-icon-more"></i></button>
</div>
</div>
</form>
</div>
</div>
<div class="layui-panel" style="margin-top:10px;">
<div style="padding: 5px 10px;">
<table class="layui-hide" id="test" lay-filter="test"></table>
</div>
</div>
</div>
</div>
</div>
<script src="https://www.layuicdn.com/layui/layui.js" charset="utf-8">
</script>
<script>
layui.use('table', function(){
var table = layui.table;
table.render({
elem: '#test'
,url:'/test/table/demo1.json'
,title: '用户数据表'
,cols: [[
{type: 'checkbox', fixed: 'left'}
,{field:'id', title:'序号', width:80, fixed: 'left', unresize: true, sort: true}
,{field:'username', title:'任务模型'}
,{field:'sex', title:'计划安排'}
]]
,page: true
});
});
</script>
</body>
</html>