[TOC]
# .com\view\admin\layout.html
{__CONTENT__}为fetch()指定的模板内容
```
//layer 是分组？
{if $layer == false}
{if $pjax == true}
{include file="public/breadcrumb" /}
{__CONTENT__}
{else /}
{include file="public/header" /}
{include file="public/left" /}
<div class="content-wrapper">
{include file="public/breadcrumb" /}
{__CONTENT__}
</div>
{include file="public/footer" /}
{/if}
{else /}
{include file="public/header" /}
<div class="content-wrapper">
{__CONTENT__}
</div>
{include file="public/footer" /}
{/if}
```
## public/header
```
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>SIYUCMS | 控制台</title>
{include file="public/css_js" /}
</head>
<body class="hold-transition sidebar-mini layout-fixed layout-navbar-fixed pace-primary text-sm {if $layer == true}layer-body{/if}">
<div class="wrapper">
{if $layer == false}
<!-- Navbar -->
<nav class="main-header navbar navbar-expand navbar-white navbar-light">
<!-- Left navbar links -->
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" data-widget="pushmenu" href="#" role="button"><i class="fas fa-bars"></i></a>
</li>
</ul>
<!-- Left navbar links -->
<ul class="navbar-nav js_left_menu">
<li class="nav-item active">
<a class="nav-link" href="javascript:;">
<i class="fas fa-cog"></i>
<span>主导航</span>
</a>
</li>
{if count($cates)}
<li class="nav-item">
<a class="nav-link" href="javascript:;">
<i class="fa fa-th-large"></i>
<span>内容管理</span>
</a>
</li>
{/if}
</ul>
<!-- Right navbar links -->
<ul class="navbar-nav ml-auto">
<!-- User Account Menu -->
<li class="nav-item dropdown user user-menu">
<!-- Menu Toggle Button -->
<a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
<img src="{:session('admin.image') ?: '/static/plugins/AdminLTE/dist/img/user2-160x160.jpg'}" class="user-image">
<span class="d-none d-lg-block">{:session('admin.nickname') ?: session('admin.username')}</span>
</a>
<ul class="dropdown-menu">
<li class="user-header">
<img src="{:session('admin.image') ?: '/static/plugins/AdminLTE/dist/img/user2-160x160.jpg'}" class="img-circle">
<h5>上次登录时间：{:session('admin.login_time')}</h5>
<h5>上次登录IP：{:session('admin.login_ip')}</h5>
</li>
<li class="user-footer">
<div class="pull-left">
<a href="{:url('Admin/edit',['id'=>session('admin.id')])}" class="btn btn-default btn-flat">资料</a>
</div>
<div class="pull-right">
<a href="{:url('Login/logout')}" class="btn btn-default btn-flat">退出</a>
</div>
</li>
</ul>
</li>
<li class="nav-item">
<a class="nav-link" data-widget="fullscreen" href="#" role="button" title="全屏">
<i class="fas fa-expand-arrows-alt"></i>
</a>
</li>
<li class="nav-item">
<a class="nav-link" data-widget="control-sidebar" data-slide="true" href="#" role="button" title="自定义">
<i class="fas fa-palette"></i>
</a>
</li>
<li class="nav-item">
<a class="nav-link js_clear_cash" href="javascript:;" title="清空缓存">
<i class="fas fa-sync-alt"></i>
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="{$indexUrl}" target="_blank" title="前台首页">
<i class="fas fa-home"></i>
</a>
</li>
</ul>
</nav>
<!-- /.navbar -->
{/if}
```
### public/css_js
```
<!-- layui -->
<link rel="stylesheet" href="/static/plugins/layui/css/layui.css">
<!-- Google Font: Source Sans Pro -->
<link rel="stylesheet" href="/static/plugins/AdminLTE/plugins/google-fonts/google.fonts.css">
<!-- Font Awesome -->
<link rel="stylesheet" href="/static/plugins/AdminLTE/plugins/fontawesome-free/css/all.min.css">
<!-- Ionicons -->
<link rel="stylesheet" href="https://cdn.staticfile.org/ionicons/2.0.1/css/ionicons.min.css">
<!-- Tempusdominus Bootstrap 4 -->
<link rel="stylesheet" href="/static/plugins/AdminLTE/plugins/tempusdominus-bootstrap-4/css/tempusdominus-bootstrap-4.min.css">
<!-- iCheck -->
<link rel="stylesheet" href="/static/plugins/AdminLTE/plugins/icheck-bootstrap/icheck-bootstrap.min.css">
<!-- Theme style -->
<link rel="stylesheet" href="/static/plugins/AdminLTE/dist/css/AdminLTE.min.css">
<!-- overlayScrollbars -->
<link rel="stylesheet" href="/static/plugins/AdminLTE/plugins/overlayScrollbars/css/OverlayScrollbars.min.css">
<!-- Daterange picker -->
<link rel="stylesheet" href="/static/plugins/AdminLTE/plugins/daterangepicker/daterangepicker.css">
<!-- Bootstrap Color Picker -->
<link rel="stylesheet" href="/static/plugins/AdminLTE/plugins/bootstrap-colorpicker/css/bootstrap-colorpicker.min.css">
<!-- Toastr -->
<link rel="stylesheet" href="/static/plugins/AdminLTE/plugins/toastr/toastr.min.css">
<!-- pace-progress -->
<link rel="stylesheet" href="/static/plugins/AdminLTE/plugins/pace-progress/themes/black/pace-theme-flat-top.css">
<!-- jQuery -->
<script src="/static/plugins/AdminLTE/plugins/jquery/jquery.min.js"></script>
<!-- layui -->
<script src="/static/plugins/layui/layui.js"></script>
<!-- webuploader -->
<link rel="stylesheet" href="/static/plugins/webuploader-0.1.5/webuploader.css">
<script src="/static/plugins/webuploader-0.1.5/webuploader.js"></script>
{include file="index/webuploader" /}
{if $system.editor == '1'}
<!-- ueditor -->
<script src="/static/plugins/ueditor/ueditor.config.js"></script>
<script src="/static/plugins/ueditor/ueditor.all.min.js"> </script>
<script src="/static/plugins/ueditor/lang/zh-cn/zh-cn.js"></script>
{else}
<!-- ckeditor4 -->
<script src="/static/plugins/ckeditor/ckeditor.js"></script>
{/if}
<!-- Bootstrap Table -->
<link rel="stylesheet" href="/static/plugins/bootstrap-table/bootstrap-table.min.css" />
<!-- layer 弹层组件 -->
<script>
layui.use('layer',
function () {
var layer = layui.layer;
})
</script>
<!-- zTree 树节点组件 -->
<script type="text/javascript" src="/static/plugins/zTree_v3/js/jquery.ztree.core.js"></script>
<script type="text/javascript" src="/static/plugins/zTree_v3/js/jquery.ztree.excheck.js"></script>
<!-- jQueryTagsInput -->
<link rel="stylesheet" href="/static/plugins/AdminLTE/plugins/jQueryTagsInput/jquery.tagsinput.css">
<script src="/static/plugins/AdminLTE/plugins/jQueryTagsInput/jquery.tagsinput.js"></script>
<!-- Select2 -->
<link rel="stylesheet" href="/static/plugins/AdminLTE/plugins/select2/css/select2.min.css">
<link rel="stylesheet" href="/static/plugins/AdminLTE/plugins/select2-bootstrap4-theme/select2-bootstrap4.min.css">
<script src="/static/plugins/AdminLTE/plugins/select2/js/select2.full.min.js"></script>
<!-- CodeMirror -->
<link rel="stylesheet" href="/static/plugins/AdminLTE/plugins/codemirror/codemirror.css">
<link rel="stylesheet" href="/static/plugins/AdminLTE/plugins/codemirror/theme/monokai.css">
<!-- SIYUCMS -->
<link rel="stylesheet" href="/static/plugins/AdminLTE/dist/css/siyucms.css">
<script src="/static/plugins/siyu-ui.js?v=20201013"></script>
<script src="/static/plugins/siyucms.js?v=20201013"></script>
```
## public/left
```
<!-- Main Sidebar Container -->
<aside class="main-sidebar sidebar-dark-default elevation-4">
<!-- Brand Logo -->
<a href="{:url('Index/index')}" class="brand-link">
<img src="/static/plugins/AdminLTE/dist/img/AdminLTELogo.png" alt="SIYUCMS" class="brand-image img-circle elevation-3" style="opacity: .8">
<span class="brand-text font-weight-light">SIYUCMS</span>
</a>
<!-- Sidebar -->
<div class="sidebar">
<!-- Sidebar user panel (optional) -->
<div class="user-panel mt-3 pb-3 mb-3 d-flex">
<div class="image">
<img src="{:session('admin.image') ?: '/static/plugins/AdminLTE/dist/img/user2-160x160.jpg'}" class="img-circle elevation-2">
</div>
<div class="info">
<a href="{:url('Admin/edit',['id'=>session('admin.id')])}" class="d-block">{:session('admin.nickname') ?: session('admin.username')}</a>
</div>
</div>
<!-- SidebarSearch Form -->
<div class="form-inline">
<div class="input-group" data-widget="sidebar-search">
<input class="form-control form-control-sidebar" type="search" placeholder="Search" aria-label="Search">
<div class="input-group-append">
<button class="btn btn-sidebar">
<i class="fas fa-search fa-fw"></i>
</button>
</div>
</div>
</div>
<!-- Sidebar Menu -->
<nav class="mt-2 mb-2">
<ul class="nav nav-pills no_radius nav-sidebar flex-column nav-child-indent js_left_menu_show" data-widget="treeview" role="menu" data-accordion="true">
<li data-item="0" class="nav-header nav-item_0">主导航</li>
{volist name="$menus" id="vo"}
<li data-item="0" class="nav-item nav-item_0 has-treeview">
<a href="#" class="nav-link">
<i class="nav-icon {$vo.icon|default='fas fa-bars'}"></i>
<p>
{$vo.title}
<i class="right fas fa-angle-left"></i>
</p>
</a>
<ul class="nav nav-treeview">
{volist name="vo.children" id="voo"}
<li class="nav-item {if count($voo.children)}has-treeview{/if}">
<a href="{if count($voo.children)}#{else /}{$voo.href}{/if}" class="nav-link">
<i class="{$voo.icon|default='far fa-circle'} nav-icon"></i>
<p>{$voo.title}{if count($voo.children)}<i class="right fas fa-angle-left"></i>{/if}</p>
</a>
{if count($voo.children)}
<ul class="nav nav-treeview">
{volist name="voo.children" id="vooo"}
<li class="nav-item">
<a href="{$vooo.href}" class="nav-link">
<i class="{$vooo.icon|default='far fa-circle'} nav-icon"></i>
<p>{$vooo.title}</p>
</a>
</li>
{/volist}
</ul>
{/if}
</li>
{/volist}
</ul>
</li>
{/volist}
<li data-item="1" class="nav-header nav-item_1" style="display: none">内容管理</li>
{volist name="$cates" id="vo"}
<li data-item="1" class="nav-item nav-item_1 {if count($vo.sub)}has-treeview{/if}" style="display: none">
<a href="{if count($vo.sub)}#{else /}{:url($vo.module.model_name.'/index',['cate_id'=>$vo.id])}{/if}" class="nav-link">
<i class="fas fa-bars nav-icon"></i>
<p>
{$vo.cate_name}
{if count($vo.sub)}<i class="right fas fa-angle-left"></i>{/if}
</p>
</a>
{if count($vo.sub)}
<ul class="nav nav-treeview">
{volist name="vo.sub" id="voo"}
<li class="nav-item">
<a href="{:url($voo.module.model_name.'/index',['cate_id'=>$voo.id])}" class="nav-link">
<i class="far fa-circle nav-icon"></i>
<p>
{$voo.cate_name}
{if count($voo.sub)}<i class="right fas fa-angle-left"></i>{/if}
</p>
</a>
{if count($voo.sub)}
<ul class="nav nav-treeview">
{volist name="voo.sub" id="vooo"}
<li class="nav-item">
<a href="{:url($vooo.module.model_name.'/index',['cate_id'=>$vooo.id])}" class="nav-link">
<i class="far fa-circle nav-icon"></i>
<p>
{$vooo.cate_name}
</p>
</a>
</li>
{/volist}
</ul>
{/if}
</li>
{/volist}
</ul>
{/if}
</li>
{/volist}
</ul>
</nav>
<!-- /.sidebar-menu -->
</div>
<!-- /.sidebar -->
</aside>
<script>
// 主导航、内容管理切换
$(".js_left_menu li").click(function () {
// 通过 .index()方法获取元素下标（从0开始）
var _index = $(this).index();
// 让左侧菜单第 _index 个显示出来，其他的隐藏起来
$(".js_left_menu_show > li").hide();
$(".js_left_menu_show > li.nav-item_" + _index).show();
// 当前菜单添加选中效果，同级的移除选中效果
$(this).addClass('active').siblings('li').removeClass('active');
})
// 清空缓存
$(".js_clear_cash").click(function () {
var url = "{:url('index/clear')}";
$.modal.confirm('确定要清除缓存吗？', function () {
$.post(url, {
del: true
}, function (result) {
if (result.error == 0) {
$.modal.alertSuccess(result.msg, function (index) {
layer.close(index);
$.pjax.reload('.content-wrapper'); // pjax 重载
});
} else {
$.modal.alertError(result.msg);
}
});
});
})
</script>
```
## public/breadcrumb(内容页面导航 ，显示标题的那一丢丢，即button上的那一丢丢)
```
{if isset($page_title) && !empty($page_title)}
<div class="content-header">
<div class="container-fluid">
{$page_title|raw|default=''}
</div>
</div>
{elseif $breadCrumb /}
<div class="content-header">
<div class="container-fluid">
<div class="row">
<div class="col-sm-6">
<h1 class="m-0">
{$breadCrumb.left.0}
<small>{$breadCrumb.left.1}</small>
</h1>
</div><!-- /.col -->
<div class="col-sm-6">
<ol class="breadcrumb float-sm-right">
<li class="breadcrumb-item"><a href="{:url('index/index')}">Home</a></li>
<li class="breadcrumb-item active"><a href="{:url($breadCrumb.right.url)}">{$breadCrumb.right.title}</a></li>
</ol>
</div><!-- /.col -->
</div><!-- /.row -->
</div><!-- /.container-fluid -->
</div>
{/if}
```
## fetch()指定的模板内容
默认是（com\view\admin\salesmen_accounts_expenditure\layout.html
```
<!--内容开始-->
<section class="content">
{// 额外CSS代码 }
{$extra_css|raw|default=''}
{// 额外HTML代码 }
{$extra_html_content_top|raw|default=''}
<!--顶部提示开始-->
{notempty name="page_tips_top"}
<div class="alert alert-{$tips_type} alert-dismissable">
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
<p>{$page_tips_top|raw}</p>
</div>
{/notempty}
<!--顶部提示结束-->
<div class="container-fluid">
<div class="row">
<!--搜索区域开始-->
{include file="table_builder/search" /}
<!--列表区域开始-->
<div class="col-sm-12 select-table table-striped">
{include file="table_builder/toolbar" /}
<table id="bootstrap-table" data-mobile-responsive="true"></table>
</div>
</div>
</div>
<script>
$(function() {
var options = {
uniqueId : "{$unique_id}", // 表格主键名称，（默认为id，如表主键不为id必须设置主键）
url : "{$data_url|raw}", // 请求后台的URL
addUrl : "{$add_url|raw}", // 新增的地址
editUrl : "{$edit_url|raw}", // 修改的地址
delUrl : "{$del_url|raw}", // 删除的地址
exportUrl : "{$export_url|raw}", // 导出的地址
sortUrl : "{$sort_url|raw}", // 排序的地址
sortName : "{$unique_id}", // 排序列名称
sortOrder : "desc", // 排序方式 asc 或者 desc
pagination : {$pagination}, // 是否进行分页
parentIdField : "{$parent_id_field}", // 列表树模式需传递父id字段名（parent_id/pid）
clickToSelect : true, // 默认false不响应，设为true则当点击此行的某处时，会自动选中此行的checkbox/radiobox
pageSize : "{$page_size}", // 每页显示的行数
layerOpen : "{$layer_open}", // 添加/编辑等页启用layer弹层加载
columns: [
{
//field: 'state',
checkbox: true,
// 当某行包含checkbox_disabled时禁止选择
formatter: function(value, row, index) {
if(row.checkbox_disabled =='1'){
return {
disabled : true
}
}
}
},
{volist name="columns" id="column"}
{
field: '{$column.name|default=''}', {// 字段名称}
title: '{$column.title|default=''}', {// 字段别名}
{if $column.name==$unique_id}
sortable: true, {// 主键必须可以排序}
{else}
sortable: {$column.sortable}, {// 是否可排序}
{/if}
{notempty name="column.class"}
class: '{$column.class|default=''}', {// 使用class定义/覆盖列的CSS类}
{/notempty}
{if $column.param }
{if $column.name == 'status' }
formatter: function(value, row, index) {
if (value == 0) {
return '<i class="fa fa-toggle-off text-info fa-2x cursor_pointer" onclick="$.operate.state(\'' + row.{$unique_id} + '\',\'{:url('state')}\')"></i>';
} else {
return '<i class="fa fa-toggle-on text-info fa-2x cursor_pointer" onclick="$.operate.state(\'' + row.{$unique_id} + '\',\'{:url('state')}\')"></i>';
}
}
{else}
formatter: function(value, row, index) {
if (value == 0) {
return '<span class="badge badge-{$column.param.0.class|default='danger'}">{$column.param.0|default='禁用'}</span>';
} else if (value == 1) {
return '<span class="badge badge-{$column.param.1.class|default='primary'}">{$column.param.1|default='启用'}</span>';
}else if (value == 2) {
return '<span class="badge badge-{$column.param.1.class|default='info'}">{$column.param.2|default='状态2'}</span>';
}else if (value == 3) {
return '<span class="badge badge-{$column.param.1.class|default='success'}">{$column.param.3|default='状态3'}</span>';
}else {
var str = '';
{foreach $column.param as $key=>$vo }
var kk = '{$key}';
if (value == kk || checkValInStr(kk, value)) {
str += '<span class="badge badge-info">{$vo}</span> ';
}
{/foreach}
return str;
}
}
{/if}
{else}
{if $column.name == 'sort' }
formatter: function(value, row, index) {
return '<input class="form-control input-sm w_40 changeSort" type="text" value="' + value + '" data-id="' + row.{$unique_id} + '" onblur="$.table.sort(this)">';
}
{else}
{// 根据格式决定如何处理数据}
{switch column.type }
{case text }
formatter: function(value, row, index) {
return HTMLDecode(value);
}
{/case}
{case datetime }
formatter: function(value, row, index) {
return changeDateFormat(value);
}
{/case}
{case status }
formatter: function(value, row, index) {
if (value == 0) {
return '<span class="badge badge-{$column.param.0.class|default='danger'}">{$column.param.0.title|default='禁用'}</span>';
} else if (value == 1) {
return '<span class="badge badge-{$column.param.1.class|default='primary'}">{$column.param.1.title|default='启用'}</span>';
}else if (value == 2) {
return '<span class="badge badge-{$column.param.1.class|default='default'}">{$column.param.1.title|default='状态2'}</span>';
}else if (value == 3) {
return '<span class="badge badge-{$column.param.1.class|default='success'}">{$column.param.1.title|default='状态3'}</span>';
}else {
return '<span class="badge badge-{$column.param.1.class|default='info'}">{$column.param.1.title|default='其他'}</span>';
}
}
{/case}
{case yesno }
formatter: function(value, row, index) {
if (value == 0) {
return '<i class="fa fa-ban text-{$column.param.0.class|default='danger'}"></i>';
} else if (value == 1) {
return '<i class="fa fa-check text-{$column.param.1.class|default='primary'}"></i>';
}
}
{/case}
{case link }
formatter: function(value, row, index) {
var link = '{$column.default|default=''}';
var reg = /__(.*?)__/g;
// 匹配ID和email，可能为任何的其他参数，但都是 __字段__ 格式
while (result = reg.exec(link)) {
link = link.replace(result[0], row[result[1]]);
}
// 拼接
link = '<a href="'+link+'" target="{$column.param}">' + value + '</a>';
return link;
}
{/case}
{case image }
formatter: function(value, row, index) {
if ($.common.isNotEmpty(value)) {
return '<a href="' + value + '" target="_blank"><img class="image_preview" src="' + value + '"></a>';
}
}
{/case}
{case color }
formatter: function(value, row, index) {
if ($.common.isNotEmpty(value)) {
return '<i class="table_colorpicker" style="background: ' + value + '""></i>';
}
}
{/case}
{case select }
formatter: function(value, row, index) {
return row.{$column.name|default=''};
}
{/case}
{case select2 }
formatter: function(value, row, index) {
return row.{$column.name|default=''};
}
{/case}
{case btn }
class : 'text-nowrap',
formatter: function(value, row, index) {
var actions = [];
{volist name="right_buttons" id="right_button"}
if('{$right_button.type|default=''}' == 'edit' || '{$right_button.type|default=''}' == 'preview'){
if('{$right_button.href|default=''}'){
var url = '{$right_button.href|default=''}';
var reg = /__(.*?)__/g;
// 匹配ID和email，可能为任何的其他参数，但都是 __字段__ 格式
while (result = reg.exec(url)) {
url = url.replace(result[0], row[result[1]]);
}
actions.push('<a class="{$right_button.class|default=''}" target="{$right_button.target|default=''}" href="'+url+'"><i class="{$right_button.icon|default=''}"></i> {$right_button.title|default=''}</a> ');
}else{
actions.push('<a class="{$right_button.class|default=''}" href="javascript:void(0)" onclick="$.operate.edit(\'' + row.{$unique_id} + '\')"><i class="{$right_button.icon|default=''}"></i> {$right_button.title|default=''}</a> ');
}
} else if ('{$right_button.type|default=''}' == 'delete'){
if('{$right_button.href|default=''}'){
var url = '{$right_button.href|default=''}';
var reg = /__(.*?)__/g;
// 匹配ID和email，可能为任何的其他参数，但都是 __字段__ 格式
while (result = reg.exec(url)) {
url = url.replace(result[0], row[result[1]]);
}
actions.push('<a class="{$right_button.class|default=''}" target="{$right_button.target|default=''}" href="'+url+'"><i class="{$right_button.icon|default=''}"></i> {$right_button.title|default=''}</a> ');
}else{
actions.push('<a class="{$right_button.class|default=''}" href="javascript:void(0)" onclick="$.operate.remove(\'' + row.{$unique_id} + '\')"><i class="{$right_button.icon|default=''}"></i> {$right_button.title|default=''}</a> ');
}
} else {
var url = '{$right_button.href|default=''}';
var reg = /__(.*?)__/g;
// 匹配ID和email，可能为任何的其他参数，但都是 __字段__ 格式
while (result = reg.exec(url)) {
url = url.replace(result[0], row[result[1]]);
}
actions.push('<a class="{$right_button.class|default=''}" target="{$right_button.target|default=''}" href="'+url+'"><i class="{$right_button.icon|default=''}"></i> {$right_button.title|default=''}</a> ');
}
{/volist}
return actions.join('');
}
{/case}
{default /}
{/switch}
{/if}
{/if}
},
{/volist}
]
};
$.table.init(options);
});
// 搜索
function searchPre() {
var data = {};
$.table.search('', data);
}
// 重置搜索
function resetPre() {
$.form.reset();
}
//HTML反转义
function HTMLDecode(text) {
var temp = document.createElement("div");
temp.innerHTML = text;
var output = temp.innerText || temp.textContent;
temp = null;
return output;
}
</script>
<!--bootstrap table end-->
<!--底部提示-->
{notempty name="page_tips_bottom"}
<div class="alert alert-{$tips_type} alert-dismissable">
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>
<p>{$page_tips_bottom|raw}</p>
</div>
{/notempty}
{// 额外HTML代码 }
{$extra_html_content_bottom|raw|default=''}
{// 额外JS代码 }
{$extra_js|raw|default=''}
</section>
<!--内容结束-->
```
### table_builder/search
```
{if $search OR $page_tips_search }
<div class="col-12 search-collapse">
<form id="search_form">
<div class="select-list">
{notempty name="page_tips_search"}{$page_tips_search|raw}{/notempty}
{notempty name="search"}
<ul>
{volist name="search" id="search"}
<li>
<label>{$search.title|default=''}： </label>
{if $search.param }
{// 存在数组 }
{if $search.data_source == 2 && ($search.type == 'text' || $search.type == 'textarea' || $search.type == 'number' || $search.type == 'hidden') }
{// 模型关联且需要转换的单独处理 }
<input type="text" id="search_{$search.name|default=''}" name="{$search.name|default=''}" value="{$search.default|default=''}"/>
{else}
<select id="search_{$search.name|default=''}" name="{$search.name|default=''}">
<option value="">所有</option>
{notempty name="search.param"}
{volist name="search.param" id="v"}
{if is_array($v)}
<option value="{$key}" {if ((string)$search.default == (string)$key)}selected{/if}{if $v.disabled == 1}disabled{/if}>{$v.value}</option>
{else}
<option value="{$key}" {if ((string)$search.default == (string)$key)}selected{/if}>{$v}</option>
{/if}
{/volist}
{/notempty}
</select>
{/if}
{else}
{// 不存在数组 }
{if $search.type == 'date' OR $search.type == 'time' OR $search.type == 'datetime' }
{// 日期类型的数据 }
<input type="text" id="search_{$search.name|default=''}" name="{$search.name|default=''}" value="{$search.default|default=''}" daterange="true" autocomplete="off"/>
{elseif $search.type == 'select2'}
<select class="select2" id="search_{$search.name|default=''}" name="{$search.name|default=''}" data-value="{$search.default|default=''}">
<option value="">所有</option>
</select>
<script>
$(function () {
var option = {};
// 启用ajax分页查询
option = {
language: "zh-CN",
//allowClear: true,
ajax: {
delay: 250, // 限速请求
url: "{:url('Index/select2',['id'=>$search.field_id])}", // 请求地址
dataType: 'json',
data: function (params) {
return {
keyWord: params.term || '', //搜索参数
page: params.page || 1, //分页参数
rows: params.pagesize || 10, //每次查询10条记录
};
},
processResults: function (data, params) {
params.page = params.page || 1;
if (params.page == 1) {
data.data.unshift({id: '', name: "", text: "所有"});
}
return {
results: data.data,
pagination: {
more: (params.page) < data.last_page
}
};
},
cache: true
}
};
// 默认值设置
var defaultValue = $("#search_{$search.name|default=''}").data("value");
if (defaultValue) {
$.ajax({
type: "POST",
url: "{:url('Index/select2',['id'=>$search.field_id])}",
data: {value: defaultValue},
dataType: "json",
async: false,
success: function(data){
$("#search_{$search.name|default=''}").append("<option selected value='" + data.key + "'>" + data.value + "</option>");
}
});
}
$("#search_{$search.name|default=''}").select2(option);
})
</script>
{else}
{// 其他类型的数据 }
<input type="text" id="search_{$search.name|default=''}" name="{$search.name|default=''}" value="{$search.default|default=''}"/>
{/if}
{/if}
</li>
{/volist}
<li>
<a class="btn btn-primary btn-rounded btn-sm" onclick="$.table.search()"><i class="fa fa-search"></i> 搜索</a>
<a class="btn btn-warning btn-rounded btn-sm" onclick="resetPre()"><i class="fas fa-sync-alt"></i> 重置</a>
<input class="hide" type="submit" name="btnSave" value="提交" onclick="$.table.search();return false;"/>
</li>
</ul>
{/notempty}
</div>
</form>
</div>
{/if}
```
### table_builder/toolbar
```
<div class="btn-group-sm" id="toolbar" role="group">
{volist name="top_buttons" id="top_button"}
{notempty name="top_button.group"}
<div class="btn-group">
{/notempty}
<a class="{$top_button.class|default=''}" {notempty name="top_button.href"}href="{$top_button.href|default=''}"{/notempty}{notempty name="top_button.target"} target="{$top_button.target|default=''}"{/notempty}{notempty name="top_button.onclick"} onclick="{$top_button.onclick|default=''}"{/notempty}>
<i class="{$top_button.icon|default=''}"></i> {$top_button.title|default=''}
</a>
{notempty name="top_button.group"}
<button type="button" class="btn {$top_button.group.class|default='btn-info'} dropdown-toggle dropdown-toggle-split" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<span class="sr-only">Toggle Dropdown</span>
</button>
<div class="dropdown-menu">
{foreach $top_button.group.menus as $key=>$vo }
<a class="dropdown-item {$vo.class|default=''}" {notempty name="vo.href"}href="{$vo.href|default=''}"{/notempty}{notempty name="vo.target"} target="{$vo.target|default=''}"{/notempty}{notempty name="$vo.onclick"} onclick="{$vo.onclick|default=''}"{/notempty}>
<i class="{$vo.icon|default=''}"></i> {$vo.title|default=''}
</a>
{/foreach}
</div>
</div>
{/notempty}
{/volist}
</div>
```
## public/footer
```
{if $layer == false}
<!-- /.content-wrapper -->
<footer class="main-footer">
<strong>Copyright © 2019-{:date("Y")} <a href="https://siyucms.com" target="_blank">siyucms.com</a>.</strong>
All rights reserved.
<div class="float-right d-none d-sm-inline-block">
<b>Version</b> {:config('app.siyu_version')}
</div>
</footer>
{/if}
<!-- Control Sidebar -->
<aside class="control-sidebar control-sidebar-dark">
<!-- Control sidebar content goes here -->
</aside>
<!-- /.control-sidebar -->
</div>
<!-- ./wrapper -->
<button id="totop" title="返回顶部" style="display: none;"><i class="fa fa-chevron-up"></i></button>
{include file="public/foot_css_js" /}
</body>
</html>
```
### public/foot_css_js
```
<!-- Bootstrap 4 -->
<script src="/static/plugins/AdminLTE/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
<!-- daterangepicker -->
<script src="/static/plugins/AdminLTE/plugins/moment/moment.min.js"></script>
<script src="/static/plugins/AdminLTE/plugins/moment/locale/zh-cn.js"></script>
<script src="/static/plugins/AdminLTE/plugins/daterangepicker/daterangepicker.js"></script>
<!-- bootstrap color picker -->
<script src="/static/plugins/AdminLTE/plugins/bootstrap-colorpicker/js/bootstrap-colorpicker.min.js"></script>
<!-- Tempusdominus Bootstrap 4 -->
<script src="/static/plugins/AdminLTE/plugins/tempusdominus-bootstrap-4/js/tempusdominus-bootstrap-4.min.js"></script>
<!-- overlayScrollbars -->
<script src="/static/plugins/AdminLTE/plugins/overlayScrollbars/js/jquery.overlayScrollbars.min.js"></script>
<!-- Toastr -->
<script src="/static/plugins/AdminLTE/plugins/toastr/toastr.min.js"></script>
<!-- pace-progress -->
<script src="/static/plugins/AdminLTE/plugins/pace-progress/pace.min.js"></script>
<!-- Bootstrap Table 表格插件样式 -->
<script src="/static/plugins/bootstrap-table/bootstrap-table.min.js"></script>
<script src="/static/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>
<script src="/static/plugins/bootstrap-table/extensions/mobile/bootstrap-table-mobile.js"></script>
<script src="/static/plugins/bootstrap-table/extensions/toolbar/bootstrap-table-toolbar.min.js"></script>
<link rel="stylesheet" href="/static/plugins/bootstrap-table/extensions/fixed-columns/bootstrap-table-fixed-columns.min.css"/>
<script src="/static/plugins/bootstrap-table/extensions/fixed-columns/bootstrap-table-fixed-columns.min.js"></script>
<!-- AdminLTE App -->
<script src="/static/plugins/AdminLTE/dist/js/adminlte.js"></script>
<!-- AdminLTE for demo purposes -->
<script src="/static/plugins/AdminLTE/dist/js/demo.js"></script>
<!-- pjax -->
<script src="/static/plugins/AdminLTE/plugins/pjax/jquery.pjax.js"></script>
<!-- jQueryForm -->
<script src="/static/plugins/AdminLTE/plugins/jQueryForm/jquery.form.js"></script>
<!-- CodeMirror -->
<script src="/static/plugins/AdminLTE/plugins/codemirror/codemirror.js"></script>
<script src="/static/plugins/AdminLTE/plugins/codemirror/mode/css/css.js"></script>
<script src="/static/plugins/AdminLTE/plugins/codemirror/mode/xml/xml.js"></script>
<script src="/static/plugins/AdminLTE/plugins/codemirror/mode/javascript/javascript.js"></script>
<script src="/static/plugins/AdminLTE/plugins/codemirror/mode/htmlmixed/htmlmixed.js"></script>
<!-- jquery-treegrid -->
<link rel="stylesheet" href="/static/plugins/jquery-treegrid/css/jquery.treegrid.css">
<script src="/static/plugins/jquery-treegrid/js/jquery.treegrid.js"></script>
<script src="/static/plugins/bootstrap-table/extensions/treegrid/bootstrap-table-treegrid.js"></script>
{literal}
<script type="text/javascript">
$(function () {
// 跳转页
$(document).on('pjax:complete', function (event, xhr, textStatus, options) {
var url = xhr.getResponseHeader('X-PJAX-URL');
if (url) {
$.pjax({url: url, container: '.content-wrapper'})
}
});
// a 链接
$(document).pjax('a[target!=_blank]', '.content-wrapper');
// form 表单
$(document).on('submit', 'form[data-pjax]', function (event) {
$.pjax.submit(event, '.content-wrapper');
});
// 阻止超时导致的链接跳转(ajax默认超时时间650毫秒，超时后强制刷新整个页面)
$(document).on('pjax:timeout', function (event) {
event.preventDefault()
});
// 重新加载
//$.pjax.reload('.content-wrapper');
})
</script>
{/literal}
```
- 空白目录
- php语法结构
- 安装与更新
- 开启调试模式及代码跟踪器
- 架构
- 源码分析
- 应用初始化
- 请求流程
- 中间件源码分析
- 请求处理源码分析
- Request源码分析
- 模板编译流程
- 路由与请求流程
- 容器
- 获取目录位置
- 入口文件
- 多应用模式及URL访问
- 依赖注入与容器
- 容器属性及方法
- Container
- App
- facade
- 中间件(middleware)
- 系统服务
- extend 扩展类库
- 笔记
- 配置
- env配置定义及获取
- 配置文件的配置获取
- 单应用模式-(配置)文件目录结构(默认)
- 多应用模式(配置)文件目录结构(配置文件)
- 配置文件
- 应用配置：app.php
- 缓存配置: cache.php
- 数据库配置：database.php
- 路由和URL配置:route.php
- Cookie配置:cookie.php
- Session配置:session.php
- 命令行配置:console.php
- 多语言配置:lang.php
- 日志配置:log.php
- 页面Trace配置:trace.php
- 磁盘配置： filesystem.php
- 中间件配置：middleware.php
- 视图配置：view.php
- 改成用yaconf配置
- 事件
- 例子：省略事件类的demo
- 例子2：完整事件类
- 例子3：事件订阅，监听多个事件
- 解析
- 路由
- 路由定义
- 路由地址
- 变量规则
- MISS路由
- URL生成
- 闭包支持
- 路由参数
- 路由中间件
- 路由分组
- 资源路由
- 注解路由
- 路由绑定
- 域名路由
- 路由缓存
- 跨域路由
- 控制器
- 控制器定义
- 空控制器、空操作
- 空模块处理
- RESTFul资源控制器
- 控制器中间件
- 请求对象Request(url参数)
- 请求信息
- 获取输入变量（$_POST、$_GET等）
- 请求类型的获取与伪装
- HTTP头信息
- 伪静态
- 参数绑定
- 请求缓存
- 响应对象Response
- 响应输出
- 响应参数
- 重定向
- 文件下载
- 错误页面的处理办法
- 应用公共文件common.php
- 模型
- 模型定义及常规属性
- 模型数据获取与模型赋值
- 查询
- 数据集
- 增加
- 修改
- 删除
- 条件
- 查询范围scope
- 获取器
- 修改器
- 搜索器
- 软删除
- 模型事件
- 关联预载入
- 模型关联
- 一对一关联
- 一对多关联
- 多对多关联
- 自动时间戳
- 事务
- 数据库
- 查询构造器
- 查询合集
- 子查询
- 聚合查询
- 时间查询
- 视图查询(比join简单)
- 获取查询参数
- 快捷方法
- 动态查询
- 条件查询
- 打印sql语句
- 增
- 删
- 改
- 查
- 链式操作
- 查询表达式
- 分页查询
- 原生查询
- JSON字段
- 链接数据库配置
- 分布式数据库
- 查询事件
- Db获取器
- 事务操作
- 存储过程
- Db数据集
- 数据库驱动
- 视图
- 模板
- 模板配置
- 模板位置
- 模板渲染
- 模板变量与赋值(assign)
- 模板输出替换
- url生成
- 模板详解
- 内置标签
- 三元运算
- 变量输出
- 函数输出
- Request请求参数
- 模板注释及原样输出
- 模板继承
- 模板布局
- 原生PHP
- 模板引擎
- 视图过滤
- 视图驱动
- 验证
- 验证进阶之最终版
- 错误和日志
- 异常处理
- 日志处理
- 调试
- 调试模式
- Trace调试
- SQL调试
- 变量调试
- 远程调试
- 杂项
- 缓存
- Session
- Cookie
- 多语言
- 上传
- 扩展说明
- N+1查询
- TP类库
- 扩展类库
- 数据库迁移工具
- Workerman
- think助手工具库
- 验证码
- Swoole
- request
- app
- Response
- View
- Validate
- Config
- 命令行
- 助手函数
- 升级指导(功能的添加与删除说明)
- siyucms
- 开始
- 添加页面流程
- 列表页加载流程
- 弹出框
- 基础控制器
- 基础模型
- 快速构建
- 表单form构建
- 表格table构建
- MakeBuilder
- 前端组件
- 日期组件
- layer 弹层组件
- Moment.js 日期处理插件
- siyucms模板布局
- 函数即其变量
- 前端页面
- $.operate.方法
- $.modal.方法：弹出层
- $.common.方法：通用方法
- 被cms重写的表格options
- 自定义模板
- 搜索框
- 自定义form表单
- 获取表单搜索参数并组装为url字符串