{"id":20090854,"url":"https://github.com/santigarcor/laravel-vuetable","last_synced_at":"2025-05-06T03:30:51.607Z","repository":{"id":54093474,"uuid":"99027423","full_name":"santigarcor/laravel-vuetable","owner":"santigarcor","description":"The laravel backend for the vuetable component","archived":false,"fork":false,"pushed_at":"2021-03-09T13:17:47.000Z","size":46,"stargazers_count":27,"open_issues_count":0,"forks_count":6,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-04-27T02:06:44.967Z","etag":null,"topics":["datatable","laravel","table","vue","vuetable"],"latest_commit_sha":null,"homepage":null,"language":"PHP","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/santigarcor.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-08-01T17:39:10.000Z","updated_at":"2023-12-20T14:53:55.000Z","dependencies_parsed_at":"2022-08-13T06:40:35.667Z","dependency_job_id":null,"html_url":"https://github.com/santigarcor/laravel-vuetable","commit_stats":null,"previous_names":[],"tags_count":8,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/santigarcor%2Flaravel-vuetable","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/santigarcor%2Flaravel-vuetable/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/santigarcor%2Flaravel-vuetable/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/santigarcor%2Flaravel-vuetable/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/santigarcor","download_url":"https://codeload.github.com/santigarcor/laravel-vuetable/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":252616080,"owners_count":21776915,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["datatable","laravel","table","vue","vuetable"],"created_at":"2024-11-13T16:26:42.149Z","updated_at":"2025-05-06T03:30:51.347Z","avatar_url":"https://github.com/santigarcor.png","language":"PHP","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Laravel Vuetable (Laravel 8.x/7.x/6.x/5.x Package)\n\n[![Build Status](https://travis-ci.org/santigarcor/laravel-vuetable.svg?branch=master)](https://travis-ci.org/santigarcor/laravel-vuetable)\n[![Latest Stable Version](https://poser.pugx.org/santigarcor/laravel-vuetable/v/stable)](https://packagist.org/packages/santigarcor/laravel-vuetable)\n[![Total Downloads](https://poser.pugx.org/santigarcor/laravel-vuetable/downloads)](https://packagist.org/packages/santigarcor/laravel-vuetable)\n[![StyleCI](https://styleci.io/repos/99027423/shield?branch=master)](https://styleci.io/repos/99027423)\n[![License](https://poser.pugx.org/santigarcor/laravel-vuetable/license)](https://packagist.org/packages/santigarcor/laravel-vuetable)\n\nLaravel Vuetable is the backend component that can work with the [Vuetable component](https://github.com/ratiw/vuetable-2).\n\nThe latest release requires [PHP](https://php.net) 7.2.5-7.4 and supports Laravel 5.7, 5.8, 6.* ,7.* and 8.*\n\n| Laravel Vuetable  |  L5.4            | L5.5             | L5.6             | L5.7             | L5.8             | L6               | L7               | L8               |\n|-------------------|------------------|------------------|------------------|------------------|------------------|------------------|------------------|------------------|\n| \u003c 1.0             |:heavy_check_mark:|:heavy_check_mark:|:heavy_check_mark:|:heavy_check_mark:|:heavy_check_mark:|:x:               |:x:               |:x:               |\n| \\\u003e 1.0            |:x:               |:x:               |:x:               |:heavy_check_mark:|:heavy_check_mark:|:heavy_check_mark:|:heavy_check_mark:|:heavy_check_mark:|\n\n## Installation\n1. Run the composer require command from your terminal:\n\n        composer require \"santigarcor/laravel-vuetable\"\n\n2. If you laravel version not supported the package discovery, set in your `config/app.php`:\n    - In the providers array add:\n\n            Vuetable\\VuetableServiceProvider::class,\n\n    - In the aliases array add:\n\n            'Vuetable' =\u003e Vuetable\\VuetableFacade::class,\n\n## Usage\nYour request to the controller should have this data:\n\n```javascript\n{\n    sort: '', // column_name|asc or column_name|desc\n    page: 1,\n    per_page: 10,\n    searchable: [\n        // This array should have the names of the columns in the database\n    ],\n    filter: '' //The text that is going to be used to filter the data\n}\n```\n\nYou can also specify the sorting order using the \"order\" attribute (required by https://mannyyang.github.io/vuetable-3/ ):\n```javascript\n{\n    sort: '', // column_name\n    order: '', // asc or desc\n}\n```\n\n\nSo for example lets create the table for the users with their companies. Then in the javascript we should have:\n\n```javascript\ndata = {\n    sort: 'users.name|asc',\n    page: 1,\n    per_page: 10,\n    searchable: [ // This means the 'users.name', 'users.email' and 'companies.name' columns can be filtered through the 'filter' attribute in the data.\n        'users.name',\n        'users.email',\n        'companies.name',\n    ]\n}\n\naxios.get('http://url.com/users-with-companies', data)\n```\n\nIn Controller we can provide Eloquent:\n\n```php\nclass UsersDataController extends Controller\n{\n    public function index() {\n\n        $query = User::select([\n                'users.id',\n                'users.name',\n                'users.email',\n                'companies.name as company',\n                'companies.company_id'\n            ])\n            -\u003eleftJoin('companies', 'users.company_id', '=', 'companies.id');\n\n        return Vuetable::of($query)\n            -\u003eeditColumn('company', function ($user) {\n                if ($user-\u003ecompany) {\n                    return $user-\u003ecompany;\n                }\n\n                return '-';\n            })\n            -\u003eaddColumn('urls', function ($user) {\n                return [\n                    'edit' =\u003e route('users.edit', $user-\u003eid),\n                    'delete' =\u003e route('users.destroy', $user-\u003eid),\n                ];\n            })\n            -\u003emake();\n    }\n}\n```\n\nOr Collection\n```php\nclass UsersDataController extends Controller\n{\n    public function index() {\n\n        $query = new Collection([\n             ['name' =\u003e 'John Doe', 'email' =\u003e 'john@mail.com'],\n             ['name' =\u003e 'Jane Doe', 'email' =\u003e 'jane@mail.com'],\n             ['name' =\u003e 'Test John', 'email' =\u003e 'test@mail.com']\n        ]);\n\n        return Vuetable::of($query)\n            -\u003eeditColumn('name', function ($user) {\n                return Str::lower($user['name']);\n            })\n            -\u003eaddColumn('urls', function ($user) {\n                return [\n                    'edit' =\u003e route('users.edit', $user['id']),\n                    'delete' =\u003e route('users.destroy', $user['id']),\n                ];\n            })\n            -\u003emake();\n    }\n}\n```\nThis controller is going to return:\n```json\n{\n  \"current_page\": 1,\n  \"from\": 1,\n  \"to\": 10,\n  \"total\": 150,\n  \"per_page\": 10,\n  \"last_page\": 15,\n  \"first_page_url\": \"http://url.com/users-with-companies?page=1\",\n  \"last_page_url\": \"http://url.com/users-with-companies?page=15\",\n  \"next_page_url\": \"http://url.com/users-with-companies?page=2\",\n  \"prev_page_url\": null,\n  \"path\": \"http://url.com/users-with-companies\",\n  \"data\": [\n    {\n      \"id\": 1,\n      \"name\": \"Administrator\",\n      \"email\": \"administrator@app.com\",\n      \"company\": \"-\",\n      \"company_id\": null,\n      \"urls\": {\n        \"edit\": \"http://url.com//users/1/edit\",\n        \"delete\": \"http://url.com//users/1\"\n      },\n    },\n    {\n      \"id\": 2,\n      \"name\": \"Company Administrator\",\n      \"email\": \"company_administrator@app.com\",\n      \"company\": \"-\",\n      \"company_id\": null,\n      \"urls\": {\n        \"edit\": \"http://url.com//users/2/edit\",\n        \"delete\": \"http://url.com//users/2\"\n      },\n      ...\n    }\n  ],\n}\n```\n\n## What does Laravel Vuetable support?\n\nUsing the Eloquent Builder you can:\n- Filter/Sort by model columns.\n- Make joins and filter/sort by them.\n- Define the length of the pagination.\n- Add columns.\n- Edit columns (if the column has a cast defined, it doesn't work).\n\nUsing the Collection you can:\n- Filter/Sort by model columns.\n- Define the length of the pagination.\n- Add columns.\n- Edit columns.\n\n## License\n\nLaravel Vuetable is open-sourced software licensed under the [MIT license](http://opensource.org/licenses/MIT).\n\n## Contributing\n\nPlease report any issue you find in the issues page. Pull requests are more than welcome.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsantigarcor%2Flaravel-vuetable","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsantigarcor%2Flaravel-vuetable","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsantigarcor%2Flaravel-vuetable/lists"}