Быстрое создание нового раздела

Для примера добавим в админ-панель новый раздел для работы с новостями.

Модель

Добавим новую модель Post.

Schema::create('posts', function (Blueprint $table) {
    $table->id();
    $table->string('title');
    $table->text('desc');
    $table->timestamps();
});

Роуты

Добавим роуты для вывода списка, просмотра, редактирования и создания новости.

Подробнее про настройку роутов здесь.

// routes/admin.php

Route::get('/admin/posts', function () {
    return view('admin.posts.list');
})->name('posts.list');

Route::get('/admin/posts/{post}/edit', function (Post $post) {
    return view('admin.posts.edit')
        ->with([
            'model' => $post
        ]);
})->name('posts.edit');

Route::get('/admin/posts/{post}/show', function (Post $post) {
    return view('admin.posts.show')
        ->with([
            'model' => $post
        ]);
})->name('posts.show');

Route::get('/admin/posts/create', function () {
    return view('admin.posts.create')
        ->with([
            'model' => new Post()
        ]);
})->name('posts.create');

Шаблоны

список новостей

resources/views/admin/posts/list.blade.php

@extends('rock-cms::page')

@section('title', 'Новости')

@section('breadcrumbs')
    {{ Breadcrumbs::render('posts') }}
@stop

@section('buttons')
    <livewire:resource-buttons :buttons="[
        'create',
    ]"/>
@stop

@section('content_title')
    <h1>Новости</h1>
@stop

@section('content')
    <livewire:admin.posts.post-list />
@stop

редактирование новости

resources/views/admin/posts/edit.blade.php

@extends('rock-cms::page')

@section('title', $model->title)

@section('breadcrumbs')
    {{ Breadcrumbs::render('posts.edit', $model) }}
@stop

@section('buttons')
    <livewire:resource-buttons :buttons="[
        'save',
        'saveAndExit',
        'cancel',
        'delete'
    ]"/>
@stop

@section('content')
    <livewire:admin.posts.post-item :resource="$model"/>
@stop

создание новости

resources/views/admin/posts/create.blade.php

@extends('rock-cms::page')

@section('title', 'Новая новость')

@section('breadcrumbs')
    {{ Breadcrumbs::render('posts.create') }}
@stop

@section('buttons')
    <livewire:resource-buttons :buttons="[
        'save',
        'cancel',
    ]"/>
@stop

@section('content')
    <livewire:admin.posts.post-item :resource="$model"/>
@stop

просмотр новости

resources/views/admin/posts/show.blade.php

@extends('rock-cms::page')

@section('title', $model->title)

@section('breadcrumbs')
    {{ Breadcrumbs::render('posts.show', $model) }}
@stop

@section('buttons')
    <livewire:resource-buttons :buttons="[
        'cancel',
    ]"/>
@stop

@section('content_title')
    <h1>{{ $model->title }}</h1>
@stop

@section('content')
    <livewire:admin.posts.post-show :resource="$model"/>
@stop

Меню

Добавим новый раздел в меню.

Подробнее про настройку меню здесь.

// app/Helpers/MenuHelper.php

<?php

namespace App\Helpers;

class MenuHelper
{
    public static function getMenu(): array
    {
        return [
            ['header' => 'РАЗДЕЛЫ САЙТА'],
            [
                'text' => 'Новости',
                'icon' => 'far fa-fw fa-file',
                'route' => 'posts.list',
                'active' => ['admin/posts/*']
            ],
            ...
        ];
    }

Хлебные крошки

Добавим новый файл с хлебными крошками.

Подробнее про настройку хлебных крошек здесь.

routes/breadcrumbs/posts.php

<?php

use App\Models\Post;
use Diglactic\Breadcrumbs\Breadcrumbs;
use Diglactic\Breadcrumbs\Generator as BreadcrumbTrail;

// Список новостей
Breadcrumbs::for('posts', function (BreadcrumbTrail $trail) {
    $trail->parent('home');
    $trail->push('Новости', route('posts.list'));
});

// Страница редактирования новости
Breadcrumbs::for('posts.edit', function (BreadcrumbTrail $trail, Post $post) {
    $trail->parent('posts');
    $trail->push($post->title, route('posts.edit', $post));
});

// Страница создания новой новости
Breadcrumbs::for('posts.create', function (BreadcrumbTrail $trail) {
    $trail->parent('posts');
    $trail->push('Новая новость');
});

// Страница просмотра новости
Breadcrumbs::for('posts.show', function (BreadcrumbTrail $trail, Post $post) {
    $trail->parent('posts');
    $trail->push($post->title, route('posts.show', $post));
});

Вывод списка новостей

Подробнее про настройку вывода списка ресурсов здесь.

Создадим livewire компонент для вывода списка новостей.

php artisan make:livewire Admin/Posts/PostList --inline

Код компонента:

app/Http/Livewire/Admin/Posts/PostList.php

<?php

namespace App\Http\Livewire\Admin\Posts;

use App\Models\Post;
use WebVovan\RockCms\Http\Livewire\ResourceListComponent;
use WebVovan\RockCms\View\Components\ActionColumn;
use WebVovan\RockCms\View\Components\Column;
use WebVovan\RockCms\View\Components\EditLinkColumn;

class PostList extends ResourceListComponent
{
    public string $resourceClass = Post::class;

    public string $nameRouteResourceCreate = 'posts.create';
    public string $nameRouteResourceEdit = 'posts.edit';
    public string $nameRouteResourceShow = 'posts.show';

    public array $search = ['title'];

    /**
     * Колонки
     *
     * @return array
     */
    public function columns(): array
    {
        return [
            Column::make('id', 'ID')
                ->sortable(),
            EditLinkColumn::make('title', 'Заголовок')
                ->sortable(),
            Column::make('created_at', 'Дата'),
            ActionColumn::make('Действия')
                ->addClass('text-center'),
        ];
    }
}

Редактирование и создание новости

Подробнее про настройку создания и редактирования ресурса здесь.

Создадим livewire компонент для редактирования и создания новости.

php artisan make:livewire Admin/Posts/PostItem

Код компонента:

app/Http/Livewire/Admin/Posts/PostItem.php

<?php

namespace App\Http\Livewire\Admin\Posts;

use App\Models\Post;
use WebVovan\RockCms\Http\Livewire\ResourceComponent;

class PostItem extends ResourceComponent
{
    public Post $resource;

    public string $resourceClass = Post::class;
    public string $nameRouteResourceList = 'posts.list';
    public string $nameRouteResourceEdit = 'posts.edit';

    protected $rules = [
        'resource.title' => 'string|required',
        'resource.desc' => 'string',
    ];

    public function init()
    {
        $this->resource->title = $this->resource->title ?? '';
        $this->resource->desc = $this->resource->desc ?? '';
    }

    public function save()
    {
        $this->resource->save();
    }

    public function render()
    {
        return view('livewire.admin.posts.post-item');
    }
}

Шаблон компонента:

resources/views/livewire/admin/posts/post-item.blade.php

<div>
    <x-rock-cms::fields.input field="resource.title" title="Заголовок"/>
    <x-rock-cms::fields.editor :model="$resource->desc" field="resource.desc" title="Описание"/>
</div>

Просмотр новости

Создадим livewire компонент для просмотра новости.

php artisan make:livewire Admin/Posts/PostShow

Код компонента:

app/Http/Livewire/Admin/Posts/PostShow.php

<?php

namespace App\Http\Livewire\Admin\Posts;

use App\Models\Post;
use WebVovan\RockCms\Http\Livewire\ResourceComponent;

class PostShow extends ResourceComponent
{
    public Post $resource;

    public string $resourceClass = Post::class;
    public string $nameRouteResourceList = 'posts.list';
    public string $nameRouteResourceEdit = 'posts.edit';

    protected $rules = [
        'resource.title' => 'string|required',
        'resource.desc' => 'string',
    ];

    public function init()
    {
    }

    public function save()
    {
    }

    public function render()
    {
        return view('livewire.admin.posts.post-show');
    }
}

Шаблон компонента:

resources/views/livewire/admin/posts/post-show.blade.php

<div>
    <x-rock-cms::fields.input readonly field="resource.title" title="Заголовок"/>
    <x-rock-cms::fields.editor
        :model="$resource->desc"
        field="resource.desc"
        enableMedia
        readonly
        title="Описание"/>
</div>