Added data labels to link and buttons (#44)

Co-authored-by: Wim Pruiksma <wim@quotec.nl>

composer.json

@@ -9,7 +9,7 @@
     ],
     "homepage": "https://github.com/singlequote/Laravel-datatables",
     "license": "MIT",
-    "version": "3.1.14",
+    "version": "3.1.15",
     "authors": [
         {
             "name": "Wim Pruiksma",

docs/fields.md

@@ -13,6 +13,7 @@ Field classes can be used to change the behaviour of the columns.
 - [Middleware](https://singlequote.github.io/Laravel-datatables/fields/middleware)
 - [Number](https://singlequote.github.io/Laravel-datatables/fields/number)
 - [Checkbox](https://singlequote.github.io/Laravel-datatables/fields/checkbox)
+- [Link](https://singlequote.github.io/Laravel-datatables/fields/link)
 
 
 ### Example

docs/fields/button.md

@@ -77,6 +77,12 @@ Button::make('id')->label('edit user'),
 
 // <button>edit user</button>
 ```
+The label also accepts column data. For example when you want to show the users name inside a button.
+```php
+Button::make('id')->label('name'),
+
+// <button>John Doe</button>
+```
 
 ### Add onclick
 The onclick method can be used to overwrite the onlick attribute. 

docs/fields/link.md

@@ -0,0 +1,83 @@
+
+# Link
+The link class replaces a value from the results with an default html a tag.
+
+[Go back to fields](https://singlequote.github.io/Laravel-datatables/fields)
+
+### Default link
+Below is an example on how to generate a default html link.
+
+```php
+Link::make('name')->route('users.show', 'id')
+```
+The link field can be extended with a lot of available methods. Such as classes and routes. 
+
+#### Class
+Add dom classes to the link
+
+```php
+Link::make('name')->route('users.show', 'id')->class('btn btn-primary'),
+// <a class="btn btn-primary"></a>
+```
+
+#### Icon
+Add dom classes to the link
+
+```php
+Link::make('name')->route('users.show', 'id')->icon('material-icons', optional 'edit'),
+// <a> <i class="material-icons">edit</i> </a>
+
+Link::make('name')->route('users.show', 'id')->icon('fa fa-edit'),
+// <a> <i class="fa fa-edit"></i> </a>
+```
+
+#### Route
+Add an route to the link. The link will automatic redirect the user to the given route when clicked.
+Variables can be passed directly from the results
+
+```php
+Link::make('name')->route('users.edit', optional 'id'),
+// <a href="https://www.example.com/users/1/edit"> </a>
+Link::make('name')->route('users.edit', ['id', 'status' => 'status_id']), //arrays can also be passed
+// <a href="https://www.example.com/users/1/edit?status_id=2"> </a>
+```
+By default the package handles the routes passed to the `route` method. In some cases you want to prevent the click on the a.
+In that case you can add the class 'prevent' tot the field. The package will ignore all `get` clicks.
+
+```php
+Link::make('name')->class('prevent')->route('users.edit', 'id'), //will ignore the clicks on the 
+```
+
+### Change target window
+The target method can be used to open a blank window. It depends on the route method
+
+```php
+Link::make('name')->route('users.show', 'id')->target('blank'),
+
+// <a href="https://www.example.com/users/1/edit"> </a>
+```
+
+### Add label
+The label method can be used to add a label to the link
+
+```php
+Link::make('name')->route('users.show', 'id')->label('Edit user'),
+
+// <a href="...">Edit user</a>
+
+//The label method also accepts table columns.
+Link::make('name')->route('users.show', 'id')->label('id')
+// <a href="...">12</a>
+
+```
+
+
+### Full example
+```php
+Link::make('name')->route('users.show', 'id')->class('btn btn-warning')->icon('fa fa-edit')->label('Edit user')->target('blank');
+
+```
+
+```html
+<a class="btn btn-warning" href="https://www.example.com/users/1/edit"> <i class="fa fa-edit"></i> Edit user</a>
+```

src/resources/views/fields/button.blade.php

@@ -28,6 +28,14 @@
     @endforeach
     route = `data-route="${url}"`;
     @endif
+    
+    let label = !`{{ $class->label }}`.length ? '' : `{{ $class->label }}`;
+        
+    @if($class->label)
+    if(row.{{ $class->label }}){
+        label = row.{{ $class->label }};
+    }
+    @endif
 
     @if($class->method === 'GET')
     $(document).on('click', `#${id}:not(.prevent)`,  (e) => {
@@ -40,11 +48,11 @@
 
     });
     let template = `
-        <button ${ dataAttributes } title="{{ $class->title['title'] }}" data-toggle="{{ $class->title['toggle'] }}" onclick="{{ $class->onClick }}" type="button" ${route} id="${id}" class="{{ $class->class }}">{{ $class->label }} {!! $class->icon !!}</button>
+        <button ${ dataAttributes } title="{{ $class->title['title'] }}" data-toggle="{{ $class->title['toggle'] }}" onclick="{{ $class->onClick }}" type="button" ${route} id="${id}" class="{{ $class->class }}">${ label } {!! $class->icon !!}</button>
     `;
     @elseif(in_array($class->method, ['POST', 'DELETE', 'PUT', 'PATCH']))
     let template = `
-        <button ${ dataAttributes } title="{{ $class->title['title'] }}" data-toggle="{{ $class->title['toggle'] }}" onclick="{{ $class->onClick != "" ? $class->onClick : '$("#form${id}").submit();' }}" type="button" id="${id}" class="{{ $class->class }}">{{ $class->label }} {!! $class->icon !!}</button>
+        <button ${ dataAttributes } title="{{ $class->title['title'] }}" data-toggle="{{ $class->title['toggle'] }}" onclick="{{ $class->onClick != "" ? $class->onClick : '$("#form${id}").submit();' }}" type="button" id="${id}" class="{{ $class->class }}">${ label } {!! $class->icon !!}</button>
         <form class="laravel-datatable-form-{{ strtolower($class->method) }}" style="display:none;" method="post" id="form${id}" action="${url}">@csrf @method($class->method)</form>
     `;
     @endif

src/resources/views/fields/link.blade.php

@@ -30,6 +30,12 @@
 
     let label = !`{{ $class->label }}`.length ? data : `{{ $class->label }}`;
     
+    @if($class->label)
+    if(row.{{ $class->label }}){
+        label = row.{{ $class->label }};
+    }
+    @endif
+    
     let template = `
         <a ${ dataAttributes } title="{{ $class->title['title'] }}" data-toggle="{{ $class->title['toggle'] }}" ${route} id="${id}" class="{{ $class->class }}">${label} {!! $class->icon !!}</a>
     `;