hexters/ladmin

Package for handel admin page in laravel

v1.7.8 2020-12-02 15:41 UTC

README

Latest Stable Version Total Downloads License

Make an Administrator page in 5 minutes

Example Image

Index

Laravel Version

Version Laravel
v1.0.x 7.x
Last version 8.x

Note

Before using this package you must already have a login page or route login route('login') for your members, you can use laravel/breeze, larave/ui or laravel jetstream.

For member pages, you should use a different guard from admin or vice versa.

Scheme

Installation

You can install this package via composer:

$ composer require hexters/ladmin

Add this trait to your user model

. . .
use Hexters\Ladmin\LadminTrait;

class User extends Authenticatable {

  use Notifiable, LadminTrait;

  . . .

Publish asset and system package

$ php artisan vendor:publish --tag=assets --force
$ php artisan vendor:publish --tag=core

Attach role to user admin with database seed or other

. . .

  $role = \App\Models\Role::first();
  \App\Models\User::factory(10)->create()
    ->each(function($user) use ($role) {
      $user->roles()->sync([$role->id]);
    });

. . .

Migrate database

$ php artisan migrate --seed

Add Ladmin route to your route project routes/web.php

. . .

use Illuminate\Support\Facades\Route;
use Hexters\Ladmin\Routes\Ladmin;

. . .

Ladmin::route(function() {

    Route::resource('/withdrawal', WithdrawalController::class); // Example

});

. . .

Manage Sidebar & Top Menu

To add a menu open app/Menus/sidebar.php file and top_right.php

Create Datatables server

Create datatables server to handle your list of data

$ php artisan make:datatables UserDataTables  --model=User

Example below

. . .

use App\DataTables\UserDataTables;

class UserController extends Controller {

  . . .

  public function index() { 

    . . .

    return UserDataTables::view();

    // OR custom view and custom data

    return UserDataTables::view('your.custom.view', [ 'foo' => 'bar' ]);

  }

. . .

Role & Permission

Protect your module via Controller

. . . 
class UserController extends Controller {

  . . .

  public function index() {

    ladmin()->allow(['administrator.account.admin.index']) // Call the gates based on menu `app/Menus/sidebar.php`

    . . .

    

For an other you can use @can() from blade or auth()->user()->can() more Gates

Example Image

User Activity

Add this trait Hexters\Ladmin\LadminLogable to all the models you want to monitor. Inspired by haruncpi/laravel-user-activity

. . .

use Hexters\Ladmin\LadminLogable;

class Role extends Model {
    
    use HasFactory, LadminLogable;

. . .

Example Image

Blade Layout

Ladmin layout in resources/views/vendor/ladmin

Insert your module content to ladmin layout

  <x-ladmin-layout>
    <x-slot name="title">Title Page</x-slot>

    {-- Your content here --}    

  </x-ladmin-layout>
  

And you can Access admin page in this link below.

http://localhost:8000/administrator

Example Image

Datatables Render

If you have a custom view for render data from Datatables server you should call this component to render your table

<x-ladmin-datatables :fields="$fields" :options="$options" />

Attributes

Attribute value require
fields don't be changed the value should be still $fields YES
options don't be changed the value should be still $options YES

Icons

You can user Fontawesome or SVG file in resources/assets/icons, svg file retrieved from site Heroicons

  ladmin()->icon('fas fa-user')

  // OR

  ladmin()->icon('user')

  // OR 

  ladmin()->icon('somefolder.customicon') // resources/assets/icons/somefolder/customicon.svg

Custom Style

Install node modules

$ npm i jquery popper.js bootstrap @fortawesome/fontawesome-free datatables.net@1.10.21 datatables.net-bs4@1.10.21 vue --save

// OR

$ yarn add jquery popper.js bootstrap @fortawesome/fontawesome-free datatables.net@1.10.21 datatables.net-bs4@1.10.21 vue

Add this code to your webpack.mix.js file

mix.js('resources/js/ladmin/app.js', 'public/js/ladmin/app.js')
   .sass('resources/sass/ladmin/app.scss', 'public/css/ladmin/app.css');

Notification

Set the true to activated notification

. . .

'notification' => true

. . .

Send notification

ladmin()
  ->notification()
    ->setTitle('new Invoice')
    ->setLink('http://project.test/invoice/31eb6d58-3622-42a4-9206-d36e7a8d6c06')
    ->setDescription('Pay invoice #123455')
    ->setImageLink('http://porject.test/icon-invoice.ong') // optional
    ->setGates(['administrator.accounting', 'administrator.owner']) // optional
  ->send()

Notification required

Option Type required Note
setTitle String YES -
setLink String YES -
setImageLink String NO -
setDescription String YES -
setGates Array NO default all gates

Listen with Larave Echo Server

Echo.channel(`ladmin`)
    .listen('.notification', (e) => {
        console.log(e.update);
        // Notification handle
    });

Example Image

Options

You can store the option for your application with the ladmin option,

Create or Update option

Data type of value is String, Number and Array

  ladmin()->update_option('my-option', ['foo', 'bar', 'baz']);
  // out: boolean

Get Option Value

  ladmin()->get_option('my-option');
  // out: Array ['foo', 'bar', 'baz']

Delete Option

ladmin()->delete_option('my-option');
// out: boolean