新增Table.api.formatter.toggle切换

application/admin/controller/user/Rule.php

@@ -18,6 +18,7 @@ class Rule extends Backend
      */
     protected $model = null;
     protected $rulelist = [];
+    protected $multiFields = 'ismenu,status';
 
     public function _initialize()
     {

application/admin/lang/zh-cn.php

@@ -111,6 +111,7 @@ return [
     'Go back'                                               => '返回首页',
     'Jump now'                                              => '立即跳转',
     'Click to search %s'                                    => '点击搜索 %s',
+    'Click to toggle'                                       => '点击切换',
     'Operation completed'                                   => '操作成功!',
     'Operation failed'                                      => '操作失败!',
     'Unknown data format'                                   => '未知的数据格式!',

public/assets/css/backend.css

@@ -646,6 +646,9 @@ form.form-horizontal .control-label {
 .bootstrap-table .fixed-table-toolbar .dropdown-menu {
   overflow: auto;
 }
+.bootstrap-table .fa-toggle-on.fa-2x {
+  font-size: 1.86em;
+}
 .toolbar {
   margin-top: 10px;
   margin-bottom: 10px;

public/assets/js/backend/auth/rule.js

@@ -34,7 +34,7 @@ define(['jquery', 'bootstrap', 'backend', 'table', 'form', 'template'], function
                             field: 'ismenu',
                             title: __('Ismenu'),
                             align: 'center',
-                            formatter: Controller.api.formatter.menu
+                            formatter: Table.api.formatter.toggle
                         },
                         {
                             field: 'id',
@@ -117,10 +117,6 @@ define(['jquery', 'bootstrap', 'backend', 'table', 'form', 'template'], function
                 name: function (value, row, index) {
                     return !row.ismenu || row.status == 'hidden' ? "<span class='text-muted'>" + value + "</span>" : value;
                 },
-                menu: function (value, row, index) {
-                    return "<a href='javascript:;' data-toggle='tooltip' title='" + __('Toggle menu visible') + "' class='btn btn-" + (value ? "info" : "default") + " btn-xs btn-change' data-id='"
-                        + row.id + "' data-params='ismenu=" + (value ? 0 : 1) + "'>" + (value ? __('Yes') : __('No')) + "</a>";
-                },
                 icon: function (value, row, index) {
                     return '<span class="' + (!row.ismenu || row.status == 'hidden' ? 'text-muted' : '') + '"><i class="' + value + '"></i></span>';
                 },

public/assets/js/backend/user/rule.js

@@ -30,7 +30,7 @@ define(['jquery', 'bootstrap', 'backend', 'table', 'form'], function ($, undefin
                         {field: 'title', title: __('Title'), align: 'left'},
                         {field: 'name', title: __('Name'), align: 'left'},
                         {field: 'remark', title: __('Remark')},
-                        {field: 'ismenu', title: __('Ismenu'), formatter: Controller.api.formatter.toggle},
+                        {field: 'ismenu', title: __('Ismenu'), formatter: Table.api.formatter.toggle},
                         {field: 'createtime', title: __('Createtime'), formatter: Table.api.formatter.datetime, operate: 'RANGE', addclass: 'datetimerange', sortable: true, visible: false},
                         {field: 'updatetime', title: __('Updatetime'), formatter: Table.api.formatter.datetime, operate: 'RANGE', addclass: 'datetimerange', sortable: true, visible: false},
                         {field: 'weigh', title: __('Weigh')},
@@ -60,12 +60,6 @@ define(['jquery', 'bootstrap', 'backend', 'table', 'form'], function ($, undefin
                 });
                 $("input[name='row[ismenu]']:checked").trigger("click");
                 Form.api.bindevent($("form[role=form]"));
-            },
-            formatter: {
-                toggle: function (value, row, index) {
-                    //添加上btn-change可以自定义请求的URL进行数据处理
-                    return '<i class="fa ' + (value == 0 ? 'fa-toggle-off' : 'fa-toggle-on') + ' fa-2x"></i>';
-                },
             }
         }
     };

public/assets/js/require-backend.min.js

@@ -9742,6 +9742,13 @@ define('table',['jquery', 'bootstrap', 'moment', 'moment/locale/zh-cn', 'bootstr
                     }
                     return html;
                 },
+                toggle: function (value, row, index) {
+                    var color = typeof this.color !== 'undefined' ? this.color : 'success';
+                    var yes = typeof this.yes !== 'undefined' ? this.yes : 1;
+                    var no = typeof this.no !== 'undefined' ? this.no : 0;
+                    return "<a href='javascript:;' data-toggle='tooltip' title='" + __('Click to toggle') + "' class='btn-change' data-id='"
+                        + row.id + "' data-params='" + this.field + "=" + (value ? no : yes) + "'><i class='fa fa-toggle-on " + (value == yes ? 'text-' + color : 'fa-flip-horizontal text-gray') + " fa-2x'></i></a>";
+                },
                 url: function (value, row, index) {
                     return '<div class="input-group input-group-sm" style="width:250px;margin:0 auto;"><input type="text" class="form-control input-sm" value="' + value + '"><span class="input-group-btn input-group-sm"><a href="' + value + '" target="_blank" class="btn btn-default btn-sm"><i class="fa fa-link"></i></a></span></div>';
                 },

public/assets/js/require-table.js

@@ -402,6 +402,13 @@ define(['jquery', 'bootstrap', 'moment', 'moment/locale/zh-cn', 'bootstrap-table
                     }
                     return html;
                 },
+                toggle: function (value, row, index) {
+                    var color = typeof this.color !== 'undefined' ? this.color : 'success';
+                    var yes = typeof this.yes !== 'undefined' ? this.yes : 1;
+                    var no = typeof this.no !== 'undefined' ? this.no : 0;
+                    return "<a href='javascript:;' data-toggle='tooltip' title='" + __('Click to toggle') + "' class='btn-change' data-id='"
+                        + row.id + "' data-params='" + this.field + "=" + (value ? no : yes) + "'><i class='fa fa-toggle-on " + (value == yes ? 'text-' + color : 'fa-flip-horizontal text-gray') + " fa-2x'></i></a>";
+                },
                 url: function (value, row, index) {
                     return '<div class="input-group input-group-sm" style="width:250px;margin:0 auto;"><input type="text" class="form-control input-sm" value="' + value + '"><span class="input-group-btn input-group-sm"><a href="' + value + '" target="_blank" class="btn btn-default btn-sm"><i class="fa fa-link"></i></a></span></div>';
                 },

public/assets/less/backend.less

@@ -730,6 +730,9 @@ form.form-horizontal .control-label {
 .bootstrap-table .fixed-table-toolbar .dropdown-menu {
   overflow: auto;
 }
+.bootstrap-table .fa-toggle-on.fa-2x {
+  font-size:1.86em;
+}
 
 .toolbar {
   margin-top: 10px;