# bootstrap 按钮 color 属性
| color | class |
|---|
| 白 | btn |
| 深蓝 | btn btn-primary |
| 浅蓝 | btn btn-info |
| 绿 | btn btn-success |
| 黄 | btn btn-warning |
| 红 | btn btn-danger |
# text-color
表格状态用到 formatter: Table.api.formatter.status, custom:
| Class Name | 颜色示例 | 颜色代码 |
|---|
| .text-red | ■ 红色 | #e74c3c |
| .text-yellow | ■ 黄色 | #f39c12 |
| .text-aqua | ■ 水蓝 | #3498db |
| .text-blue | ■ 蓝色 | #0073b7 |
| .text-black | ■ 黑色 | #111 |
| .text-light-blue | ■ 浅蓝 | #3c8dbc |
| .text-green | ■ 绿色 | #18bc9c |
| .text-gray | ■ 灰色 | #d2d6de |
| .text-navy | ■ 海军蓝 | #001F3F |
| .text-teal | ■ 蓝绿 | #39CCCC |
| .text-olive | ■ 橄榄绿 | #3D9970 |
| .text-lime | ■ 柠檬绿 | #01FF70 |
| .text-orange | ■ 橙色 | #FF851B |
| .text-fuchsia | ■ 紫红 | #F012BE |
| .text-purple | ■ 紫色 | #605ca8 |
| .text-maroon | ■ 褐红 | #D81B60 |
# table 按钮根据权限显示
- index.html table 标签增加 data-operate-{name} name = 按钮名
- 对应的 js 增加自定义按钮
| <table id="table" class="table table-striped table-bordered table-hover table-nowrap" |
| data-operate-edit=false |
| data-operate-del=false |
| data-operate-ban="{:$auth->check('')}" |
| width="100%"> |
| </table> |
| buttons: [{ |
| name: '', |
| text: '', |
| title: '', |
| classname: 'btn btn-xs btn-danger btn-dialog', |
| icon: 'fa fa-ban', |
| url: '', |
| extend: 'data-area=\'["50%", "70%"]\'', |
| callback: function (data) { |
| }, |
| visible: function (row) { |
| |
| return true; |
| } |
| }] |
# 自定义按钮定义 class
| 功能 | class |
|---|
| 弹出框 | btn btn-dialog |
| 请求 | btn btn-ajax |
| 点击 | btn btn-click |
例子
| //data-url 按钮地址 |
| //data-area 弹出框大小 |
| <a href="javascript:;" data-url="" data-area='["950px", "750px"]' class="btn btn-success btn-dialog" title="{:__('Switch')}" ><i class="fa fa-list"></i> {:__('Switch')}</a> |
| {field: 'operate', title: __('Operate'), table: table, |
| buttons:[ |
| { |
| name: 'copy', |
| text: __('Copy Bankcard'), |
| title: __('Copy Bankcard'), |
| icon: 'fa fa-copy', |
| classname: 'btn btn-xs btn-info btn-click', |
| click: function (t,row) { |
| Layer.msg('点击事件'); |
| return false; |
| } |
| }, |
| ]}, |
