README

Laravel 的自定义表格工具，使用强大的 vue-good-table。无需痛苦的服务端表格。

支持分页、过滤、搜索、排序。灵感来源于 Laravel Nova :)

要求

• Laravel 5.6+ 或 Laravel 6, Laravel 7, Laravel 8, Laravel 9
• 在项目中使用 Vue.js

使用示例

1. 在你的控制器中使用 InteractsWithVueGoodTable 特性，并实现两个方法： getColumns() 和 getQuery()。
2. 注册两个新的路由。
3. 在您想要的地方使用 Vue 组件 laravel-vue-good-table。

控制器

namespace App\Http\Controllers;

use LaravelVueGoodTable\InteractsWithVueGoodTable;
use LaravelVueGoodTable\Columns\Column;
use LaravelVueGoodTable\Columns\Date;
use Illuminate\Http\Request;
use App\User;

class TestController extends Controller
{
    use InteractsWithVueGoodTable;

    /**
     * Get the query builder
     * 
     * @param Request $request
     *
     * @return Illuminate\Database\Eloquent\Builder
     */
    protected function getQuery(Request $request)
    {
        return User::query();
    }

    /**
     * Get the columns displayed in the table
     *
     * @return array
     */
    protected function getColumns(): array
    {
        return [
            Text::make('ID', 'id')
                ->sortable()
                ->searchable(),
                
            Text::make('Name', 'name')
                ->searchable(),
                
            Text::make('E-mail', 'email')
                ->searchable(),
                
            Date::make('Created At', 'created_at')
                ->sortable()
                ->dateOutputFormat('dd.MM.yyyy HH:mm:ss'),
        ];
    }
}

路由

Route::get('/lvgt/config', 'TestController@handleConfigRequest');
Route::get('/lvgt/data', 'TestController@handleDataRequest');

Blade/HTML

<div id="vue">
    <laravel-vue-good-table data-url="/lvgt/data" config-url="/lvgt/config"/>
</div>

安装

composer require underwear/laravel-vue-good-table

请参阅 DOCUMENTATION.md 中的完整安装指南

文档

请参阅 DOCUMENTATION.md

贡献

欢迎贡献！

致谢

• Igor Filippov

许可证

MIT 许可证 (MIT)。请参阅 许可证文件 以获取更多信息。