laravel9搭配dact-admin快速打造一個幫助中心

wongvio發表於2023-03-25
Laravel

先上效果：aikm.cn/faq

是不是感覺，這東西不就是發文章，顯示文章？
不不不，你要是那麼做，還得搞分類，後臺管理也不直觀，看後臺效果：

後臺結構清晰，可以滑鼠拖拽排序，非常直觀好用，接下來上程式碼：
第一步：新建faq遷移檔案：

public function up()
    {
        Schema::create('faqs', function (Blueprint $table) {
            $table->increments('id');
            $table->integer('parent_id')->default(0)->comment('父id');
            $table->integer('order')->default(0)->comment('排序');
            $table->string('title')->comment('名稱');
            $table->text('body')->nullable()->comment('內容');
            $table->timestamps();
        });
    }

第二步：去dcat後臺用程式碼生成工具生成FaqController檔案，生成以後直接用我下面的程式碼覆蓋：

<?php

namespace App\Admin\Controllers;

use App\Models\Faq;
use Dcat\Admin\Layout\Row;
use Dcat\Admin\Layout\Content;
use Dcat\Admin\Layout\Column;
use Dcat\Admin\Tree;
use Dcat\Admin\Form;
use Dcat\Admin\Widgets\Box;
use Dcat\Admin\Http\Controllers\AdminController;
use Dcat\Admin\Widgets\Form as WidgetForm;

class FaqController extends AdminController
{
    public function index(Content $content)
    {
        return $content->header('幫助中心')
            ->body(function (Row $row) {
                $tree = new Tree(new Faq);

                // $tree->disableCreateButton();

                $tree->disableQuickCreateButton();

                $tree->disableQuickEditButton();

                $tree->showEditButton();

                $row->column(7, $tree);

                $row->column(5, function (Column $column) {
                    $form = new WidgetForm();

                    $menuModel = config('admin.database.faq');

                    $form->select('parent_id', '父級選單')->options($menuModel::selectOptions());
                    $form->text('order')->default(0);
                    $form->text('title', '標題')->required();
                    // $form->text('uri', trans('admin.uri'));

                    $form->width(9, 2);

                    $column->append(Box::make(trans('admin.new'), $form));
                });
            });
    }

    protected function form()
    {
        return Form::make(new Faq(), function (Form $form) {

            $menuModel = config('admin.database.faq');

            // $form->display('id');
            $form->select('parent_id', '父級選單')->options($menuModel::selectOptions());
            $form->text('order');
            $form->text('title');
            $form->editor('body');

            $form->display('created_at');
            $form->display('updated_at');
        });
    }
}

注意：$menuModel = config('admin.database.faq')要去config檔案裡找到admin.database照著官方的樣子加上faq的配置

第三步：新建並修改Model/Faq.php:

<?php

namespace App\Models;

use Dcat\Admin\Traits\ModelTree;
use Illuminate\Database\Eloquent\Model;
use Dcat\Admin\Traits\HasDateTimeFormatter;

class Faq extends Model
{
    use ModelTree;

    use HasDateTimeFormatter;

    protected $fillable = [
        'parent_id',
        'order',
        'title',
        'body'
    ];
}

好啦，現在你的後臺路由檔案再配置以下，後臺就弄好了

$router->resource('/faq', 'FaqController');

web路由

Route::get('/faq', [FaqsController::class, 'index'])->name('faq.index');

Route::get('/faq/{faq}', [FaqsController::class, 'show'])->name('faq.show');

最後，回覆裡給大家前端模板吧，發帖的時候內容太長會HTTP500：

本作品採用《CC 協議》，轉載必須註明作者和本文連結

相關文章