一、tab列表的按钮
{field: 'operate', title: __('Operate'), table: table, events: Table.api.events.operate, buttons:[ { name: 'detail',//名称 text: __('Send_coupon'),//文本 title: __('Send_coupon'),//标题 classname: 'btn btn-info btn-xs btn-list btn-dialog',//样式 icon: 'fa fa-folder-o',//图标 url: 'litestore/litestorecoupon/send' },//跳转地址 { name: 'detail', text: __('Show_coupon'), title: __('Show_coupon'), classname: 'btn btn-xs btn-primary btn-dialog', icon: 'fa fa-folder-o', url: 'litestore/litestorecoupon/showcoupon' } ], formatter: Table.api.formatter.operate}
(1)按钮图标样式
1. 修改
classname: 'btn btn-xs btn-success btn-editone',//样式
icon: 'fa fa fa-pencil',//图标
效果图:
2. 删除
classname: 'btn btn-xs btn-danger btn-delone',//样式
icon: 'fa fa-trash',//图标
效果图:
3. 排序
classname: 'btn btn-xs btn-primary btn-dragsort',//样式
icon: 'fa fa-arrows',//图标
效果图:
4. 文件
classname: 'btn btn-info btn-xs btn-list btn-dialog',//样式
icon: 'fa fa-folder-o',//图标
效果图:
5. 列表
classname: 'btn btn-info btn-xs btn-list btn-dialog',//样式
icon: 'fa fa-list',//图标
效果图:
6. AJAX
classname: 'btn btn-xs btn-success btn-magic btn-ajax',//样式
icon: 'fa fa-magic',//图标
效果图:
注释:(
代表样式:”success,warning,danger,info“
图标库:http://fontawesome.dashgame.com
样式:\public\assets\css\fastadmin.css 大约 5293行
)
7. 按钮隐藏
{field: 'operate', title: __('Operate'), table: table, events: Table.api.events.operate, buttons:[ { name: 'detail', text: __(' '), title: __(' '), classname: 'btn btn-xs btn-primary btn-dialog', icon: 'fa fa-list', url: 'litestore/litestorecoupon/showcoupon', hidden:function(row){ if(row.status != 2){ return true; } } } ], formatter: Table.api.formatter.buttons}
hidden:function(row){ if(row.status != 2){ return true; } }
注释:(hidden:函数是隐藏函数 内部可以加条件 返回true 按钮展示 或者隐藏)
8. 按钮删除
{field: 'operate', title: __('Operate'), table: table, events: Table.api.events.operate, formatter: Table.api.formatter.operate, formatter: function (value, row, index) { var that = $.extend({}, this); var table = $(that.table).clone(true); $(table).data("operate-del", null);//隐藏删除 $(table).data("operate-edit", null);//隐藏编辑 $(table).data("operate-dragsort", null);//隐藏排序 that.table = table; return Table.api.formatter.operate.call(that, value, row, index); } }
注释(隐藏table 按钮可以用 formatter: function (value, row, index) {}) 内部可以加条件)
还有一种简便的方法(全部隐藏) 对应的 url等于空 即可 例如 del_url:'';删除按钮就不会展示
// 初始化表格参数配置 Table.api.init({ extend: { index_url: 'test/test/index' + location.search, add_url: 'test/test/add', edit_url: 'test/test/edit', del_url: 'test/test/del', multi_url: 'test/test/multi', dragsort_url: ' ', table: 'test', } });
9. 按钮弹窗
{field: 'operate', title: __('Operate'), table: table, events: Table.api.events.operate, buttons:[ { name: 'detail', text: __(' '), title: __(' '), classname: 'btn btn-xs btn-primary btn-dialog', icon: 'fa fa-list', url: 'test/test/execute', success: function (data) { Layer.alert("<textarea class='form-control' cols='60' rows='5'>" + data.result + "</textarea>", { title: __("执行结果"), shadeClose: true }); table.bootstrapTable('refresh'); return false; }, error:function (data) { Layer.alert("<textarea class='form-control' cols='60' rows='5'>" + data.result + "</textarea>", { title: __("执行结果"), shadeClose: true }); table.bootstrapTable('refresh'); return false; } } ], formatter: Table.api.formatter.buttons}
注释:(success,error 是执行结果 )
(2)添加、修改 页面样式
1. 下拉( build_select)
代码:
{:build_select('row[status',['normal' => __('Normal'), 'hidden' => __('Hidden')],'normal')}
效果:
2. 单选( build_radios)
代码:
{:build_radios('row[status',['normal' => __('Normal'), 'hidden' => __('Hidden')],'normal')}
效果:
2. 复选( build_checkboxs)
代码:
{:build_checkboxs('row[status',['normal' => __('Normal'), 'hidden' => __('Hidden')],'normal')}
效果:
3. 分类( build_category_select)
代码:
{:build_category_select('row[category_id]','page',$row.category_id)}
效果:
4. 表格操作按钮栏( build_toolbar)
代码:
{:build_toolbar('refresh,add,edit,del')}
效果:
注释(按钮 有 以下几种: 'refresh', 'add', 'edit', 'del', 'import')
5. 页面Heading( build_heading)
代码:
{:build_heading('auth/adminlog')}
效果:
注释({:build_heading('path',true)} path 必须是存在的 php中封装方法的 文件地址为:\application\admin\common.php )