## addBlock('类型', '标题', '列表') 侧栏构建器内置了四种不同类型的区块,分别是recent、online、switch、html。 ### recent 一般用于展示最近事项,列表数据是一个数组,每个元素可以定义4个参数:title、link、tips、icon。 | 参数 | 含义 | | --- | --- | | title | 标题 | | link | 链接 | | tips | 提示 | | icon | 字体图标 | ~~~ $recent_list = [ [ 'title' => '最近编辑文件', 'link' => [ 'title' => '<i class="fa fa-file-text-o"></i> Documentation.doc', 'url' => url('index') ], 'tips' => '15 分钟前', 'icon' => 'si si-pencil text-info' ], [ 'title' => '最近删除文件', 'link' => [ 'title' => '<i class="fa fa-file-text-o"></i> Documentation2.doc', 'url' => url('index') ], 'tips' => '4 小时前', 'icon' => 'si si-close text-danger' ] ]; // 使用ZBuilder快速侧栏 ZBuilder::make('aside')->addBlock('recent', '最近事项', $recent_list); ~~~ ![](https://box.kancloud.cn/19d280fff6ba67af5d3a5bf768ef7ace_326x295.png) ### online 一般用于展示在线用户,每个元素可以定义5个参数:name、link、tips、online、avatar。 | 参数 | 含义 | | --- | --- | | name | 用户名 | | link | 链接 | | tips | 提示 | | online | 在线状态:1或0 | | avatar | 头像 | ~~~ $online_list = [ [ 'name' => '张三', 'link' => url('index'), 'avatar' => '/static/admin/img/avatar.jpg', 'online' => 1, 'tips' => '村支书' ], [ 'name' => '李四', 'link' => url('index'), 'avatar' => '/static/admin/img/avatar.jpg', 'online' => 1, 'tips' => '主任' ], [ 'name' => '王五', 'link' => url('index'), 'avatar' => '/static/admin/img/avatar.jpg', 'online' => 0, 'tips' => '小职员' ] ]; // 使用ZBuilder快速侧栏 ZBuilder::make('aside')->addBlock('online', '在线用户', $online_list); ~~~ ![](https://box.kancloud.cn/2349f6c69323c4eb78c3ce4f4aa712d1_328x373.png) ### switch 一般用于某些参数状态的设置,每个元素有6个参数:title、tips、checked、table、id、field。 | 参数 | 含义 | | --- | --- | | title | 标题 | | tips | 提示 | | checked | 开关状态:1或0 | | table | 数据表名 | | id | 主键值 | | field | 字段名 | ~~~ $settings = [ [ 'title' => '站点开关', 'tips' => '站点关闭后将不能访问', 'checked' => Db::name('admin_config')->where('id', 1)->value('value'), 'table' => 'admin_config', 'id' => 1, 'field' => 'value' ] ]; // 使用ZBuilder快速侧栏 ZBuilder::make('aside')->addBlock('switch', '系统设置', $settings); ~~~ ![](https://box.kancloud.cn/c0012a167d9157e4bdfe0e942eb2593a_331x225.png) ### html 也可以直接输入html代码 ~~~ $html = '<h1>自定义代码</h1>'; // 使用ZBuilder快速侧栏 ZBuilder::make('aside')->addBlock('html', $html); ~~~ ![](https://box.kancloud.cn/4132e907ca8821b5e2e73363d3419ca1_327x134.png) 支持传入变量 ~~~ $html = '<h1>{$title}</h1>'; // 使用ZBuilder快速侧栏 ZBuilder::make('aside')->addBlock('html', $html, ['title' => '自定义代码']); ~~~ 以上4种类型可以一起使用 ~~~ ZBuilder::make('aside') ->addBlock('html', $html, ['title' => '自定义代码']) ->addBlock('online', '在线用户', $online_list) ->addBlock('recent', '最近事项', $recent_list) ->addBlock('switch', '系统设置', $settings); ~~~ ![](https://box.kancloud.cn/ed10a03c9f5e6a1b2c248544be06970e_336x771.png)