use jQuery DataTable to show plugins page

2024-12-27 06:29:19 +08:00 · 2017-01-02 12:19:34 +08:00 · 2017-01-02 12:19:34 +08:00 · 6c462d0a96
commit 6c462d0a96
parent 53d1a6627d
7 changed files with 132 additions and 79 deletions
--- a/app/Http/Controllers/PluginController.php
+++ b/app/Http/Controllers/PluginController.php
@ -3,6 +3,7 @@
 namespace App\Http\Controllers;

 use View;
+use Datatables;
 use App\Events;
 use Illuminate\Http\Request;
 use App\Services\PluginManager;
@ -29,13 +30,13 @@ class PluginController extends Controller
                    case 'enable':
                        $plugins->enable($id);

-                        return redirect('admin/plugins/manage')->with('message', trans('admin.plugins.operations.enabled', ['plugin' => $plugin->title]));
+                        return json(trans('admin.plugins.operations.enabled', ['plugin' => $plugin->title]), 0);
                        break;

                    case 'disable':
                        $plugins->disable($id);

-                        return redirect('admin/plugins/manage')->with('message', trans('admin.plugins.operations.disabled', ['plugin' => $plugin->title]));
+                        return json(trans('admin.plugins.operations.disabled', ['plugin' => $plugin->title]), 0);
                        break;

                    case 'delete':
@ -65,11 +66,27 @@ class PluginController extends Controller

        }

-        $data = [
-            'installed' => $plugins->getPlugins(),
-            'enabled'   => $plugins->getEnabledPlugins()
-        ];
+        return view('admin.plugins');
+    }

-        return view('admin.plugins', $data);
+    public function getPluginData(PluginManager $plugins)
+    {
+        $installed = $plugins->getPlugins();
+
+        return Datatables::of($installed)
+            ->setRowId('plugin-{{ $name }}')
+            ->editColumn('title', function ($plugin) {
+                return trans($plugin->title);
+            })
+            ->editColumn('description', function ($plugin) {
+                return trans($plugin->description);
+            })
+            ->addColumn('status', function ($plugin) {
+                return trans('admin.plugins.status.'.($plugin->isEnabled() ? 'enabled' : 'disabled'));
+            })
+            ->addColumn('operations', function ($plugin) {
+                return view('vendor.admin-operations.plugins.operations', compact('plugin'));
+            })
+            ->make(true);
    }
 }
--- a/app/Http/Routes/web.php
+++ b/app/Http/Routes/web.php
@ -114,6 +114,7 @@ Route::group(['middleware' => 'admin', 'prefix' => 'admin'], function ()

    Route::group(['prefix' => 'plugins'], function () {
        Route::any('/manage', 'PluginController@manage');
+        Route::get('/data',   'PluginController@getPluginData');
        Route::any('/market', 'PluginController@showMarket');
    });

--- a/resources/assets/src/js/admin.js
+++ b/resources/assets/src/js/admin.js
@ -2,7 +2,7 @@
 * @Author: printempw
 * @Date:   2016-07-22 14:02:44
 * @Last Modified by:   printempw
- * @Last Modified time: 2016-12-31 19:54:01
+ * @Last Modified time: 2017-01-02 12:11:43
 */

 'use strict';
@ -296,6 +296,66 @@ function deletePlayer(pid) {
    });
 }

+function enablePlugin(name) {
+    $.ajax({
+        type: "POST",
+        url: "?action=enable&id=" + name,
+        dataType: "json",
+        success: function(json) {
+            if (json.errno == 0) {
+                toastr.success(json.msg);
+
+                table.ajax.reload(null, false);
+            } else {
+                toastr.warning(json.msg);
+            }
+        },
+        error: showAjaxError
+    });
+}
+
+function disablePlugin(name) {
+    $.ajax({
+        type: "POST",
+        url: "?action=disable&id=" + name,
+        dataType: "json",
+        success: function(json) {
+            if (json.errno == 0) {
+                toastr.warning(json.msg);
+
+                table.ajax.reload(null, false);
+            } else {
+                toastr.warning(json.msg);
+            }
+        },
+        error: showAjaxError
+    });
+}
+
+function deletePlugin(name) {
+    swal({
+        text: trans('admin.confirmDeletion'),
+        type: 'warning',
+        showCancelButton: true
+    }).then(function() {
+        $.ajax({
+            type: "POST",
+            url: "?action=delete&id=" + name,
+            dataType: "json",
+            success: function(json) {
+                if (json.errno == 0) {
+                    toastr.success(json.msg);
+
+                    $('tr[id=plugin-'+name+']').remove();
+                } else {
+                    toastr.warning(json.msg);
+                }
+            },
+            error: showAjaxError
+        });
+    });
+}
+
 function downloadUpdates() {
    var file_size = 0;
    var progress  = 0;
--- a/resources/lang/en/locale.js
+++ b/resources/lang/en/locale.js
@ -134,6 +134,10 @@
            userRegistration: 'User Registration',

            // Plugins
+            statusEnabled: 'Enabled',
+            statusDisabled: 'Disabled',
+            enablePlugin: 'Enable',
+            disablePlugin: 'Disable',
            confirmDeletion: 'Are you sure to delete this plugin?'
        },
        utils: {
--- a/resources/lang/zh_CN/locale.js
+++ b/resources/lang/zh_CN/locale.js
@ -134,6 +134,10 @@
            userRegistration: '用户注册',

            // Plugins
+            statusEnabled: '已启用',
+            statusDisabled: '已禁用',
+            enablePlugin: '启用插件',
+            disablePlugin: '禁用插件',
            confirmDeletion: '真的要删除这个插件吗？'
        },
        utils: {
--- a/resources/views/admin/plugins.tpl
+++ b/resources/views/admin/plugins.tpl
@ -3,11 +3,7 @@
@section('title', trans('general.plugin-manage'))

@section('style')
-<style>
-.btn { margin-right: 4px; }
-td#description { width: 35%; }
-@media (max-width: 767px) { .content-header > h1 > small { display: none; } }
-</style>
+<style> .btn { margin-right: 4px; } </style>
@endsection

@section('content')
@ -32,8 +28,8 @@ td#description { width: 35%; }
        @endif

        <div class="box">
-            <div class="box-body table-responsive no-padding">
-                <table class="table table-hover">
+            <div class="box-body table-bordered">
+                <table id="plugin-table" class="table table-hover">
                    <thead>
                        <tr>
                            <th>{{ trans('admin.plugins.name') }}</th>
@ -44,47 +40,6 @@ td#description { width: 35%; }
                            <th>{{ trans('admin.plugins.operations.title') }}</th>
                        </tr>
                    </thead>
-
-                    <tbody>
-                        @forelse($installed as $plugin)
-                        <tr id="plugin-{{ $plugin->name }}">
-                            <td>{!! trans($plugin->title) !!}</td>
-                            <td id="description">{!! trans($plugin->description) !!}</td>
-                            <td id="author">{{ $plugin->author }}</td>
-                            <td id="version">{{ $plugin->version }}</td>
-                            <td id="status">
-                                @if ($plugin->isEnabled())
-                                {{ trans('admin.plugins.status.enabled') }}
-                                @else
-                                {{ trans('admin.plugins.status.disabled') }}
-                                @endif
-                            </td>
-
-                            <td>
-                                @if ($plugin->isEnabled())
-                                <a class="btn btn-warning btn-sm" href="?action=disable&id={{ $plugin->name }}">{{ trans('admin.plugins.operations.disable') }}</a>
-                                @else
-                                <a class="btn btn-primary btn-sm" href="?action=enable&id={{ $plugin->name }}">{{ trans('admin.plugins.operations.enable') }}</a>
-                                @endif
-
-                                @if ($plugin->isEnabled() && $plugin->hasConfigView())
-                                <a class="btn btn-default btn-sm" href="?action=config&id={{ $plugin->name }}">{{ trans('admin.plugins.operations.configure') }}</a>
-                                @else
-                                <a class="btn btn-default btn-sm" disabled="disabled" title="{{ trans('admin.plugins.operations.no-config-notice') }}" data-toggle="tooltip" data-placement="top">{{ trans('admin.plugins.operations.configure') }}</a>
-                                @endif
-
-                                <a class="btn btn-danger btn-sm" href="javascript:deletePlugin('{{ $plugin->name }}');">{{ trans('admin.plugins.operations.delete') }}</a>
-
-                            </td>
-                        </tr>
-                        @empty
-                        <tr>
-                            <td>0</td>
-                            <td>{{ trans('admin.plugins.empty') }}</td>
-                            <td>(´・ω・`)</td>
-                        </tr>
-                        @endforelse
-                    </tbody>
                </table>
            </div>
        </div>
@ -97,28 +52,27 @@ td#description { width: 35%; }
@section('script')
 <script type="text/javascript">

-function deletePlugin(name) {
-    swal({
-        text: trans('admin.confirmDeletion'),
-        type: 'warning',
-        showCancelButton: true
-    }).then(function() {
-        $.ajax({
-            type: "POST",
-            url: "?action=delete&id=" + name,
-            dataType: "json",
-            success: function(json) {
-                if (json.errno == 0) {
-                    toastr.success(json.msg);
-
-                    $('tr[id=plugin-'+name+']').remove();
-                } else {
-                    toastr.warning(json.msg);
-                }
-            },
-            error: showAjaxError
-        });
-    });
-}
+var table = $('#plugin-table').DataTable({
+    language: trans('vendor.datatables'),
+    responsive: true,
+    autoWidth: false,
+    processing: true,
+    serverSide: true,
+    ajax: '{{ url("admin/plugins/data") }}',
+    createdRow: function (row, data, index) {
+        $('td', row).eq(1).attr('id', 'description');
+        $('td', row).eq(2).attr('id', 'author');
+        $('td', row).eq(3).attr('id', 'version');
+        $('td', row).eq(4).attr('id', 'status');
+    },
+    columns: [
+        {data: 'title'},
+        {data: 'description', 'width': '35%'},
+        {data: 'author'},
+        {data: 'version'},
+        {data: 'status'},
+        {data: 'operations', searchable: false, orderable: false}
+    ]
+});
 </script>
@endsection
--- a/resources/views/vendor/admin-operations/plugins/operations.tpl
+++ b/resources/views/vendor/admin-operations/plugins/operations.tpl
@ -0,0 +1,13 @@
+@if ($plugin->isEnabled())
+<a class="btn btn-warning btn-sm" href="javascript:disablePlugin('{{ $plugin->name }}');">{{ trans('admin.plugins.operations.disable') }}</a>
+@else
+<a class="btn btn-primary btn-sm" href="javascript:enablePlugin('{{ $plugin->name }}');">{{ trans('admin.plugins.operations.enable') }}</a>
+@endif
+
+@if ($plugin->isEnabled() && $plugin->hasConfigView())
+<a class="btn btn-default btn-sm" href="?action=config&id={{ $plugin->name }}">{{ trans('admin.plugins.operations.configure') }}</a>
+@else
+<a class="btn btn-default btn-sm" disabled="disabled" title="{{ trans('admin.plugins.operations.no-config-notice') }}" data-toggle="tooltip" data-placement="top">{{ trans('admin.plugins.operations.configure') }}</a>
+@endif
+
+<a class="btn btn-danger btn-sm" href="javascript:deletePlugin('{{ $plugin->name }}');">{{ trans('admin.plugins.operations.delete') }}</a>